Ich nutze ja bisher die Funktionalität von JSMath, die in WordPress-Blogs zur Verfügung gestellt wird. Durch Einbinden eines Skripts kann man sie auch in eigenen Webseiten einfügen. Viele Content Management Systeme haben diese Javascript-Bibliothek vorinstalliert, oder man kann sie nachinstallieren.

Die Formeln werden erst bei der Darstellung auf dem Browser durch Java-Script angezeigt. Das funktioniert nur, wenn Java-Script aktiv ist.

Beispiel:

\(\int\limits_0^1 \dfrac{x+1}{x^2+1} \, dx\)

Der Code, den man dazu eingeben muss ist

$latex\int\limits_0^1 \dfrac{x+1}{x^2+1} \, dx$

Alles muss in Dollar-Zeichen eingeschlossen werden. Zentrieren durch einen zentrierten Paragraphen ist möglich.

Meist verwende ich zusätzlich … &s=-1, um die Formel mehr der Schriftgröße des Blogs anzupassen. Auf diesem Blog macht das keinen Unterschied.

Es geht aber auch anders, nämlich per Bilder. Für viele eigene Websites ist das fast der bequemste Weg. Man setzt ein kleines Latex-File auf, in dem man die Formel eingibt, und schneidet sie mit einem Tool aus dem Bildschirm aus. Mit dem Snippet-Tool von Windows 7 geht das recht bequem. In den meisten Web-Editoren kann das Bild per Copy und Paste eingefügt werden. Es wird dann in einem Bildformat mit der Webseite abgespeichert. Man sollte dazu PNG wählen. Transparente Formeln lassen sich so allerdings nur mit einem Bildeditor erreichen.

Die Erzeugung des Formel-Bildes lässt sich aber auch automatisieren. Dazu gibt es das Programm dvipng in Latex, das zum Beispiel mit MikTeX installiert wird. Für Windows habe ich ein kleines Batch-File gebastelt, das eine TeX-Datei erzeugt, übersetzt und dann das Bild aus der DVI-Datei generiert.

echo documentclass{article} >%1.tex
echo usepackage{mine} >>%1.tex
echo thispagestyle{empty} >>%1.tex
echo begin{document} >>%1.tex
echo [ >>%1.tex
echo %~2 >>%1.tex
echo ] >>%1.tex
echo end{document} >>%1.tex
latex %1.tex
dvipng -o %1.png -bg Transparent -D 150 -T tight %1.dvi


Bei mir heißt die Datei „makepng.bat“. Der Aufruf geht so:

>makepng test "int_0^^1 frac{x+1}{x^^2+1} , dx"


Man beachte die Doppelten ^-Zeichen! Die Kommandozeile entfernt einfache ^. Der Output steht hier in „test.png“. Natürlich muss das ganze irgendwo gemacht werden, wo die Kommandos latex und dvipng bekannt sind. Normalerweise geht das überall, da das bin-Verzeichnis von Latex im Windows-Pfad ist. Es mag außerdem sinnvoll sein, die Ausgabe auf den Desktop zu lenken, da man das Ergebnis ja per Drag and Drop verwenden will.

Wer einen konfigurierbaren Editor hat, kann dort womöglich den Aufruf von Latex so einstellen, dass zusätzlich dvipng aufgerufen wird, oder gleich ein Skript wie das obige, und das Ergebnis von einem Bildbetrachter gezeigt wird. Von dort kann es dann sofort kopiert werden.

Oder man verwendet einen Dienst wie Roger’s Online Equation Editor, wo man die Formel eingeben kann. Im folgenden ist die Auflösung auf 100 gestellt, und der Hintergrund auf transparent. Das Bild wurde dann aus dem Browser auf den Desktop gezogen, und in diese Seite eingefügt.

Das Ergebnis ist nicht ganz perfekt, obwohl Anti-Aliasing eingestellt war. Etwas besser wird es, wenn man die Auflösung auf 200 stellt, und die Weite für das Bild im HTML-Code auf die Hälfte reduziert.

Eine weitere Möglichkeit ist der Daum Equation Editor, ein Plugin für Chrome. Er kann die Formeln lokal abspeichern. Man sollte sie dann von dort einfügen. Das Ergebnis sieht eher wie eine Formel von Word aus.

Leider setzt sich Math-ML nicht durch. Die meisten Browser können damit nichts anfangen. Es gibt ein Plugin für WordPress. Aber Math-ML ist nur sinnvoll, wenn der Browser die Darstellung erzeugen könnte.

Letztendlich ist die Variante mit Latex und einem Screendump oder dvipng die flexibelste und qualitativ die beste. Man hat die Darstellungsgröße und die Qualität selbst in der Hand. Die bequemste Methode ist ohne Zweifel JSMath.

PS:

Ich habe die Technik mit latex und dvipng inzwischen dazu genutzt, mein Programm Euler mit Latex-Fähigkeiten auszustatten. Ein Beispiel finden Sie hier.