Ein frei kopier- und anpassbares Lehrmittel von eduskript.org

Chemie: Moleküle & Gleichungen

Zwei Komponenten für Chemie-Inhalte: <molecule> zeichnet eine Strukturformel aus einem SMILES-String, und \ce{...} (mhchem, Teil von KaTeX) setzt eine ausgeglichene chemische Gleichung. Beide sind reines Markup — es steckt keine Chemie-Datenbank dahinter, die Richtigkeit liegt bei dir.


Strukturformeln: SMILES

SMILES (Simplified Molecular Input Line Entry System) ist die Standard-Textnotation für Moleküle. <molecule> rendert einen als Strukturformel-Bild:

<molecule smiles="O" name="Wasser" ></molecule>
Strukturformel von WasserStrukturformel von WasserWasser

Attribute: smiles (erforderlich), name (Bildunterschrift unter der Zeichnung), width / height in px (Standard 420×300).

Weitere Beispiele

Koffein:

<molecule smiles="CN1C=NC2=C1C(=O)N(C(=O)N2C)C" name="Koffein" width="360" height="280" ></molecule>

Aspirin (Acetylsalicylsäure):

<molecule smiles="CC(=O)Oc1ccccc1C(=O)O" name="Aspirin" ></molecule>

Du musst SMILES nicht auswendig schreiben können: PubChem listet auf jeder Seite einen SMILES-String für jeden Stoff, und die meisten Struktureditoren (z.B. ChemDraw, MolView) exportieren ihn direkt. Ein paar, die man auswendig kennen sollte: O ist Wasser, CCO ist Ethanol, c1ccccc1 ist Benzol (Kleinbuchstaben = aromatische Ringatome).

Layout, Bilder, Annotation

Das Layout funktioniert wie bei einem Bild: Ziehe den Griff in der Editor-Vorschau, um die Grösse zu ändern, oder verwende die Ausrichtungs-Buttons, um links/mittig/rechts auszurichten oder Text darum fliessen zu lassen — das schreibt display-width, align und wrap zurück in den Tag.

Die Zeichnung ist ein normales Bild, Schüler können sie also mit den Stiften annotieren, und ein <ai-feedback>-Tag im selben Abschnitt greift darauf zu — so baust du Aufgaben wie "kreise die funktionelle Gruppe ein" oder "beschrifte die polaren Bindungen" (siehe Code-Editoren & Bewertung für <ai-feedback>).

Warum es leicht anders aussieht als in deinem Lehrbuch

Das Layout wird generiert, nicht gezeichnet: Bindungswinkel und wo sich eine Kette biegt, sind die Wahl des Renderers. Elementfarben folgen der üblichen Konvention (O rot, N blau), und im Dark Mode wird nur die schwarze Tinte aufgehellt. Kaputte SMILES brechen die Seite nicht — das Bild selbst zeigt, woran der Parser sich gestört hat.


Chemische Gleichungen: mhchem

Bevorzuge für Gleichungen KaTeX' mhchem-Erweiterung (\ce{...}) gegenüber handgestricktem \mathrm{} — sie kennt chemiespezifische Abstände, Indizes und Pfeiltypen.

Verbrennung von Methan:

$$\ce{CH4 + 2O2 -> CO2 + 2H2O}$$

CHX4+2OX2COX2+2HX2O\ce{CH4 + 2O2 -> CO2 + 2H2O}

Eine umkehrbare Reaktion (Haber-Bosch-Verfahren), mit Aggregatzustandssymbolen:

$$\ce{N2(g) + 3H2(g) <=> 2NH3(g)}$$

NX2(g)+3HX2(g)2NHX3(g)\ce{N2(g) + 3H2(g) <=> 2NH3(g)}

Säuredissoziation, mit Ladungen:

$$\ce{CH3COOH <=> CH3COO- + H+}$$

CHX3COOHCHX3COOX+HX+\ce{CH3COOH <=> CH3COO- + H+}

\ce{} erledigt die gängige Notation automatisch: Zahlen nach einem Element werden zu Indizes (H2O), +/- nach einer Spezies werden zu Ladungen, -> und <=> werden zum passenden Pfeilstil, und (g)/(l)/(s)/(aq)-Aggregatzustandssymbole erhalten den richtigen Abstand. Es funktioniert inline ($\ce{H2O}$) oder im Block ($$\ce{...}$$) genau wie jeder andere KaTeX-Ausdruck — siehe Mathe und Funktionsplotter für die allgemeinen Inline-/Block-Regeln.


Chemie-Spickzettel

ZielSyntax
Strukturformel aus SMILES<molecule smiles="CCO" name="Ethanol" ></molecule>
Strukturformel mit Grösse<molecule smiles="..." width="360" height="280" ></molecule>
Ausgeglichene Gleichung$$\ce{CH4 + 2O2 -> CO2 + 2H2O}$$
Umkehrbare Reaktion\ce{A <=> B}
Aggregatzustandssymbole\ce{N2(g) + 3H2(g) <=> 2NH3(g)}
Ionenladung\ce{H+}, \ce{CH3COO-}