Website Meta Language: Webseiten generieren nach Unix-Art

Axel Beckert

Symlink.ch / ISG D-PHYS, ETH Zürich

abe@noone.org
http://noone.org/abe/

Übersicht

  • Content Management Systeme für Webseiten: Ziele, Vorstellungen
  • Die Website Meta Language - Was ist das?
  • Die Benutzerschnittstellen
  • Die neun Filter im Detail
  • Externe Filter
  • Weitere Features
  • Was WML nicht kann
  • Zusammenfassung
  • Bekannte, mit WML generierte Webseiten
  • Links
  • Danke

CMS für Webseiten: Ziele

  • Einheitliche Gestaltung, Trennung von Inhalt und Layout
  • Aufbau der Seiten aus mehrfach nutzbaren Komponenten / Objekten
  • Einfache, übersichtliche und schnelle Änderung von Inhalten
  • Rechtesystem für die Komponenten der Webseiten
  • Nachvollziehbarkeit und Versionierung von Änderungen

CMS für Webseiten: Vorstellungen

  • Server-basiert, Datenbank als Backend (z.B. PHP + Typo3 + MySQL)
  • Inhalte werden per Webbrowser gepflegt
  • WYSIWYG-HTML-Editoren in JavaScript (z.B. TinyMCE)
  • Benutzer sind dumm und haben keine Ahnung

Aber was ist mit Leuten, die...

  • HTML können,
  • keinen fetten Webserver haben,
  • vollständige Kontrolle über den HTML-Code haben wollen,
  • HTML mit ihrem Lieblingseditor (vi, Emacs, ...) bearbeiten wollen
  • ... und die aber trotzdem eine einfache, schnelle und übersichtliche Handhabung der Inhalte, ein einheitliches Design und deswegen Trennung von Inhalt und Layout wollen?

WML - Die Website Meta Language

  • Markup-Sprache
  • einfach zu verwenden
  • mächtig
  • erleichtert Automatisierung lästiger, immer wieder vorkommende Arbeiten massiv
  • gut aufeinander abgestimmten Sammlung von Werkzeugen
  • erzeugt statische und damit server- und client-unabhängige (aber nicht notwendigerweise statische) HTML-Seiten

Slogan

"While not trivial and idiot proof WML provides most of the core features real hackers always wanted for HTML generation."

WML ...

  • steht unter der GNU GPL,
  • läuft auf fast allen Unices (Linux, *BSD, Solaris, Cygwin, etc.),
  • beinhaltet zwei Benutzerschnittstellen (Frontends), neun Filter (Backends), eine eigene Bibliothek von Include-Files mit "higher-level features" und Schnittstellen zu weiteren Filtern,
  • ist klassische Unix-Philosophie: alles "einfache" Filter, die zusammen sehr mächtig sind, viel wiederverwendeter Code (m4, ePerl, etc.) und wiederverwendbarer Code (ipp, slice), gängiges Kommandozeilen-Interface,
  • sollte nicht mit der "Wireless Markup Language" des WAP-Forums oder der "Wesnoth Markup Language" verwechselt werden.

WML gleich HTML

Input: Output: 1| <HTML> 1| <HTML> 2| <BODY> 2| <BODY> 3| foobar baz 3| foobar baz 4| 4| 42 5| 42 5| </BODY> 6| </BODY> 6| </HTML> 7| </HTML>

Die Benutzerschnittstellen

> wml -O3 -DFOO=bar foobar.wml -o foobar.html > touch foobar.wml > wmk /usr/local/bin/wml -n -o foobar.html foobar.wml

Die Filter: Übersicht

  1. Optionaler externer Filter (Prolog)
  2. Pass: Include Preprocessor (ipp)
  3. Pass: Macro Processor for HTML Documents (mp4h)
  4. Pass: Embedded Perl 5 Language (eperl)
  5. Pass: GNU M4 (gm4)
  6. Pass: Divert (divert)
  7. Pass: Area Subst (asubst)
  8. Pass: HTML Fix (htmlfix)
  9. Pass: HTML Strip (htmlstrip)
  10. Pass: Slice (slice)
  11. Optionaler externer Filter (Epilog), z.B. HTML Tidy

Pass 1: Include Preprocessor

> wml -I/path/to -i/path/to/inc.wml -DFOO=bar test.wml #include "foobar.wml" BAR=baz #include "/path/to/category/foobar.wml" #include <category/foobar.wml> #include "*.wml" #use category::foobar # Kommentar Zeilen über mehrere \ Zeilen hinweg führen. $(BAR:-foo) $(BAR:=foo) $(BAR)

Pass 2: Macro Processor for HTML

Input: Output: 1| <define-tag foo>bar</define-tag> 1| bar 2| <foo> Input: Output: 1| <set-var foo="bar"> 1| bar 2| <get-var foo> Input: Output: 1| <define-tag test whitespace=delete> 1| yes 2| <if %0 "yes" "no"> 2| no 3| </define-tag> 4| 5| <test "string"> 6| <comment>Kommentar</comment> 7| <test "">

Pass 3: ePerl

ePerl bietet die Möglichkeit, Perl-Schnipsel in beliebige Dateien einzubinden.

Input: Output: 1| foo<: print 3+5; :>bar 1| foo8bar 2| foo<:=3+5:>bar 2| foo8bar

Pass 4: GNU M4

Der Makro-Prozessor GNU m4, wie er für Makro-Funktionaltät in den Konfigurationsdateien vieler Unix-Programme verwendet wird (z.B. sendmail, fvwm, etc.)

Input: Output: 1| define(`foo', `Hello world.') 1| Hello world. 2| foo

Pass 5: Divert

Erlaubt die beliebige Reihenfolge von Elementen. Sehr mächtig zusammen mit ipp.

Input: Output: | inc.wml: Input: | 1| {#HEAD#} 1| Header | 1| {#HEAD#} 1| #include "inc.wml" 2| {#BODY#} 2| Body | 2| {#BODY#} 2| Body Zeile 1 3| {#FOOT#} 3| Footer | 3| {#FOOT#} 3| Body Zeile 2 4| | 4| 5| {#FOOT#: | 5| {#FOOT#: Output: 6| Footer | 6| Footer 7| :##} | 7| :##} 1| Header 8| {#HEAD#: | 8| {#HEAD#: 2| Body Zeile 1 9| Header | 9| Header 3| Body Zeile 2 10| :##} | 10| :#}# 4| Footer 11| {#BODY#: | 11| {#BODY#: 12| Body |

Pass 6: Area Subst

Input: Output: 1| {: [[s/ä/&auml;/g]] 1| B&auml;h! 2| Bäh! 3| :}

Zusammen mit ipp und divert bzw. ipp und mp4h sind z.B. so nette WML-Features wie die beiden folgenden möglich:

Input: Output: 1| #use wml::fmt:isolatin 1| &auml;&ouml;&uuml; 2| <isolatin> 3| äöü 4| </isolatin> Input: Output: 1| #use wml::fmt::isolatin global 1| &auml;&ouml;&uuml; 2| äöü

Pass 7: HTML Fix

  • Fügt ggf. width= und height= zu <img …> hinzu
  • Fügt alt-Parameter zu <img …> hinzu
  • <center>…</center> → <div align="center">…</div>
  • Korrigiert fehlendes Quoting bei Attributwerten: foo=bar → foo="bar"
  • Korrigiert falsch deklarierte Farbwerte: color="ffffff" → color="#ffffff"
  • Rückt auf Wunsch Paragraphen ein.
  • Schnelles Auskommentieren von HTML-Tags: <a# href="foo">bar</a> wird zu bar.
  • Einheitliche Gross- oder Kleinschreibung aller HTML-Tags.
  • Einheitliche Verwendung von sog. Trailing Slashes für XHTML bzw. XML (tlw. auch schon in mp4h).

Pass 8: HTML Strip

  • Optimiert HTML hinsichtlich redundanter Leerzeichen, Leerzeilen, etc.
  • Verschiedene Optimierungsstufen
  • Beachtet <PRE>...</PRE> und Co.

Pass 9: Slice

  • Speichern verschiedener (sich ggf. überschneidende) Abschnitte in verschiedene Ausgabe-Dateien.
  • Gestattet die einfache Implementierung verschiedener (ähnlicher) Varianten eines Dokumentes, z.B. verschiedener Sprachen, etc.
foobar.txt: 1| Sprache: [DE:Deutsch[EN: Beides :DE]English:EN] > slice -o EN+UNDEF:foobar.en.txt -o DE+UNDEF:foobar.de.txt foobar.txt > wml -o EN+UNDEF:foobar.en.txt -o DE+UNDEF:foobar.de.txt foobar.txt foobar.en.txt: 1| Sprache: Beides English foobar.de.txt: 1| Sprache: Deutsch Beides

Externe Filter

WML kann vor und hinter seine Filterkette noch weitere, externe Programme als Filter einbinden.

Prolog: wml -P input-filter.sh foo.wml

Der Prolog-Filter bekommt den Quellcode per STDIN übergeben und WML erwartet den vom Filter modifizierten Quellcode auf STDOUT.

Epilog: wml -E output-filter.sh foo.wml

Für bestimmte Programme (z.B. HTML Tidy) kennt WML die entsprechenden Parameter, um sie direkt auf den Output anzuwenden. Andere Programme bekommen den Dateinamen der Ausgabe-Datei übergeben.

Weitere Features

  • Auswertung von Shebang-Zeilen, auch mit wmk: #!wml -DTITLE=Foobar -E tidy
  • $HOME/.wmlrc, $HOME/.wmkrc, (../)*.wmlrc und (../)*.wmkrc
  • <PROTECT PASS="1">#blafasel</PROTECT>
  • Automatisch gesetzte, in vielen Passes verfügbare Variablen: WML_SRC_FILENAME, WML_SRC_TIME, WML_SRC_USERNAME, WML_GEN_TIME, WML_GEN_USERNAME, WML_VERSION, etc.

Was WML nicht kann

WML ist mächtig, flexibel und bietet viele Möglichkeiten, ist aber trotzdem keine eierlegende Wollmilchsau. Manche Dinge können andere Programme einfach besser und sollte man auch diesen überlassen:

Zusammenfassung

Wer gerne Webseiten von Hand gestaltet, weil man dabei volle Kontrolle über den HTML-Code hat, wer sich gerne auf der Kommandozeile bewegt, viel mit Pipes arbeitet und ein wenig Perl kann, der wird mit WML sicher viel Spass haben und auf die Dauer auch viel Zeit sparen.

Mit WML generierte Webseiten

Links

Danke

  • Namics für die Location
  • Harry fürs Organisieren der Location und allfällige Erinnerungen
  • Eric A. Meyer für S5
  • Ralf Engelschall für WML