HTML

Die Abkürzung HTML steht für Hypertext Markup Language. HTML ist eine Computersprache, die dazu genutzt wird, Webseiten zu erstellen. Auch wenn es gerne mal behauptet wird, so ist HTML keine Programmiersprache, sondern eine Seitenbeschreibungssprache. Das heißt, sie gibt Entwicklern die Möglichkeit eine Webseite (mehr oder minder genau) zu beschreiben.

Die erste Version von HTML wurde Anfang der 1990er Jahre am CERN in der Schweiz entwickelt. Da das CERN eine Forschungsstätte ist, ist es nicht verwunderlich, dass die ursprüngliche Idee der Sprache war, wissenschaftliche Texte zu formatieren und sie somit zwischen verschiedenen Computersystemen austauschbar zu machen. Ursprünglich stand also die Formatierung von Texten und nicht der Aufbau von Layouts, Kommunikation mit Usern oder ähnliches im Vordergrund. HTML ist eine der zentralen Technologien des World Wid Webs (WWW), das zeitgleich am CERN entwickelt wurde.

Syntax

Die Syntax von HTML ist sehr einfach aufgebaut und schnell zu erlernen. Die Sprache besteht aus einzelnen Befehlen, so genannten Tags (Englisch für Kennzeichnung, Markierung). Ein Tag besteht mindestens immer aus einer „öffnenden spitzen Klammer“ (Kleiner-Als-Zeichen), dem Befehl und einer „schließenden spitzen Klammer“ (Größer-Als-Zeichen). Das heißt, ein Tag könnte beispielsweise so aussehen <b>. Dieser Befehl sorgt dafür, dass Schrift fett dargestellt wird. Die meisten Befehle können Sie, wie in diesem Fall (b steht für bold = fett), einfach aus der englischen Sprache ableiten. Zwischen dem Kleiner-Als-Zeichen und dem Befehl darf kein Leerzeichen oder etwas anderes auftauchen. Nach dem Befehl sind allerdings Leerzeichen oder auch noch weitere Spezifikationen zulässig (mehr dazu später). In Standard-HTML (also nicht HTML 5 oder XHTML) können Sie den eigentlichen Befehl übrigens groß oder klein schreiben. Ob Sie also <B> oder <b> schreiben macht keinen Unterschied. Üblicherweise werden Befehle aber klein geschrieben, wobei es interessanterweise eine Empfehlung des W3C gibt, die Befehle groß zu schreiben. Die Idee bei der Empfehlung war, dass groß geschriebene Befehle innerhalb des Codes besser zu erkennen sind.

In „normalem“ HTML werden viele Befehle auch wieder „geschlossen“. Das heißt, es gibt noch zusätzlich ein schließendes Tag, welches die Anweisung des öffnenden Befehls wieder aufhebt. Bei diesem gilt, dass es grundsätzlich erstmal genau so ausschaut wie das öffnende, wobei sich zwischen der öffnenden Klammer und dem Befehl allerdings ein Slash (/) befinde. Für das obige Beispiel  lautet der schließende Befehl also </b>.
Dieser HTML-Text:
Dieser <b>Text</b> ist fett!
wird im Browser dann so dargestellt:
Dieser Text ist fett!

Wie schon angedeutet kann das öffnende Tag um eine ganze Menge Erweiterungen ergänzt werden. Diese sogenannten Attribute werden nach dem Befehl aber vor der schließenden Klammer angegeben und jeweils durch Leerzeichen voneinander und von dem Befehl getrennt. Möchten Sie beispielsweise einen Absatz in einen Text einbauen und den Absatz zentriert ausrichten, dann wäre <p align=’right‘>Absatz</p> der korrekte Befehl. In den meisten Fällen besteht ein Attribut aus einem Namen und einem Wert, welcher mithilfe eines Gleichheitszeichens angehängt wird. Der Wert selbst sollte in einfache oder doppelte Anführungszeichen (‚ oder „) gesetzt werden, auch wenn das nicht immer notwendig ist. Welche Attribute bei welchen Befehlen zulässig sind, entnehmen Sie bitte den HTML-Spezifikationen.

Syntaktische Unterschiede zu XHTML

XHTML ist eine „Weiterentwicklung“ von HTML, welche Ende der 1990 Jahre entwickelt wurde und im Januar 2000 in der Version 1.0 veröffentlicht wurde. Bei der Benutzung sind die Unterschiede zwischen HTML und XHTML nicht sonderlich groß. Allerdings gibt es einige Punkte zu beachten. Die wichtigsten Punkte habe ich hier aufgeführt:

1. Befehle sind in XHTML immer klein zu schreiben. Das heißt, das Tag <b> muss in XHTML immer klein geschrieben werden. Ein <B>, das in HTML zulässig wäre, ist in XHTML verboten.
2. Jeder Befehl muss immer geschlossen werden. In HTML gibt es beispielsweise kein schließendes Tag für den Befehl <br>, der einen Zeilenumbruch erzeugt. In XHTML muss aber jeder Befehl geschlossen werden, so auch das <br>.  Das heißt, eigentlich müsste man in XHTML <br></br> schreiben, was aber recht unsinnig wäre, da ein Zeilenumbruch ja nicht irgendwo anfängt und wieder beendet werden muss. Daher wird der schließende Befehl mit einem Slash am Ende des öffnenden Befehls symbolisiert, was dann ein <br /> ergibt. Diese Vorgehensweise ist ist allerdings immer nur dann zulässig, wenn zwischen dem öffnenden und dem schließenden Befehl kein Text und keine anderen Befehle stehen.
3. Jedes Attribut muss immer einen Wert haben, was in (Standard-)HTML nicht immer der Fall ist. In HTML wäre beispielsweise <option selected> zulässig, was in XHTML nicht korrekt wäre. In XHTML lautet die korrekte Schreibweise <option selected=“selected“>.
4. Jeder Attributwert muss immer in Anführungszeichen gesetzt werden. In HTML wäre es bei bestimmten Werten zulässig, dass diese ohne Anführungszeichen an das Gleichheitszeichen angehängt werden, was in XHTML allerdings verboten ist. Hier ist es zwingend vorgeschrieben, dass die Werte immer in einfache oder doppelte Anführungszeichen eingeschlossen werden.

Zu ergänzen ist, dass diese Unterscheidung nur bis HTML 5 gilt. Bei HTML 5 kann konfiguriert werden ob es sich wie HTML oder XHTML verhalten soll.

 „Standard-HTML“

Im Text ist an einigen Stellen von Standard-HTML die Rede. Damit beziehe ich mich auf die Syntax von HTML bis einschließlich der Version 4.01. „Standard-HTML“ ist natürlich kein feststehender oder gar akademisch korrekter Begriff. Viel mehr versuche ich damit auf das Verhalten von „altem“ HTML anzusprechen, wie es vielen Entwicklern noch vertraut ist. Wie schon erwähnt verhält XHTML sich anders. HTML5, also die momentan aktuelle Version von HTML,  unterstützt sowohl die HTML als auch XHTML-Schreibweise.

HTML-Versionen

• HTML Urversion, 3. November 1992
• HTML Urversion mit neuen Formatierungsmöglichkeiten und integration von Bildern, 30. April 1993
• HTML 2.0 Ergänzung um Formulare u.a., November 1995
• HTML 3.2 Einführung von Tabellen u.a., 14. Januar 1997 (HTML 3.2 DTD)
• HTML 4.0 Ergänzung um Stylesheets, Frames u.a., 18. Dezember 1997
• HTML 4.01 Kleinere Korrekturen, 24. Dezember 1999
• XHTML 1.0 Neuformulierung von HTML in XML (vorher war HTML in SQML deklariert), 26. Januar 2000)
• XHTML 1.1 Moulbasierte Version von XHTML 1, 31. Mai 2001
• HTML5 komplette Überarbeitung, 28. Oktober 2014

Unterschied zu Programmiersprachen

Wie eingangs erwähnt, ist HTML keine Programmiersprache sondern eine Auszeichnungssprache. Das heißt, HTML gibt Ihnen zwar die Möglichkeit Texte zu formatieren, sieht aber keine Möglichkeit vor Logik zu implementieren. Anders gesagt, eine Programmiersprache ist in der Lage 1+1 auszurechnen, HTML kann 1+1 im Browser ausgeben und formatieren, aber nicht ausrechnen.

Ergänzende Technologien

Auch wenn man mit HTML eine ganze Menge machen kann, so ist es eigentlich unmöglich eine funktionale Webseite ohne ergänzende Technologien zu erstellen. In den meisten Fällen werden clientseitig, das heißt im Browser, noch CSS (Cascading Stylesheets) und JavaScript eingesetzt. HTML selbst bietet nur sehr eingeschränkte Formatierungsmöglichkeiten, die durch den Einsatz von CSS deutlich verbessert werden können. JavaScript ist eine Programmiersprache, die im Browser ausgeführt werden kann. Mit ihrer Hilfe kann HTML um Logik ergänzt werden. Somit können die Werte, die in ein Formular beispielsweise geprüft werden, ob sie gültig sein könnten.

Webseiten werden üblicherweise von einem Webserver an den Client ausgeliefert. Der Browser schickt also eine Anfrage an einen Server, welcher diese Anfrage dann mit einer Webseite beantwortet. Bevor diese Webseite zum Browser geschickt wird, kann diese auch noch von serverseitigen Technologien verarbeitet werden. Hier kommen Programmiersprachen wie PHP, Java oder Ruby zum Einsatz, die dann beispielsweise auch mit Datenbanken wie MySQL kommunizieren können.

Literaturempfehlungen

Hier noch ein paar Literaturempfehlungen zu den vorgenannten Themen

HTML / CSS

• HTML5 Handbuch (Guter Einstieg)
• HTML5 – kurz & gut (kleine Referenz für den Schreibtisch)
• HTML & XHTML kurz & gut (kleine Referenz für den Schreibtisch)
• Einstieg in CSS: Webseiten gestalten mit HTML und CSS (Schöner Titel um in die Erstellung moderner Webseiten einzusteigen)

JavaScript

• JavaScript: Grundlagen, Programmierung, Praxis – inkl. HTML5, JavaScript-Frameworks, jQuery, OOP (Guter Einstieg der auch auch weiterführende Themen behandelt)
• JavaScript – Das umfassende Referenzwerk (Sehr gute, umfassende Referenz)
• JavaScript – kurz & gut  (kleine Referenz für den Schreibtisch)

XML

Die Abkürzung XML steht für „Extensible Markup Language“. Die Sprache XML wird vom W3C betreut und ist im eigentlichen Sinn keine wirkliche Sprache, da sie keine Vokabeln, sprich Befehle kennt. Viel mehr gibt XML ein Regelwerk, also eine Grammatik vor, mit dessen Hilfe Sprachen definiert werden können. Die Idee dahinter ist, dass man ein Regelwerk schaffen wollte, mit dem Entwickler selbst eine Sprache definieren können. Selber eine Sprache zu definieren ist immer dann sinnvoll, wenn mehrere Computer- oder Softwaresysteme untereinander Daten austauschen sollen und alle beteiligten Systeme dieselbe Sprache sprechen sollen. Sollte Beispielsweise eine Namensliste zwischen zwei Computersystemen ausgetauscht werden, dann könnte man eine Sprache definieren, welche Sender und Empfänger verstehen. Ein entsprechendes Dokument, dessen Befehle wirklich komplett frei ausgedacht ist, könnte dann beispielsweise so aussehen:

<liste>
<name>
<vorname>Peter</vorname>
<nachname>Görgens</nachname>
</name>
<name>
<vorname>Franka</vorname>
<nachname>Gallone</nachname>
</name>
</liste>

Wie hier schon zu erkennen ist, ist die Syntax eng mit HTML verwandt. Das hat einen einfachen Grund. Das ursprüngliche HTML ist nämlich in SGML deklariert und XML ist aus SGML entstanden. Das heißt, es wurde ein Teil von SGML ausgegliedert und als eigenständige Sprache, sprich als XML deklariert.

Für den Aufbau der Befehle gilt, dass auch hier der Befehl in Kleiner-Als- und Größer-Als-Zeichen gefasst werden muss und zwischen der öffnenden Klammer und dem Befehl kein Whitespace (also Leerzeichen, Tabulator etc.) stehen darf. Wie der Befehl heißt, dürfen Sie sich selbst ausdenken, wobei er nicht mit jedem beliebigen Zeichen beginnen darf. XML ist „case sensitive“, das heißt, es wird zwischen Groß- und Kleinschreibung unterschieden. Das Element <name> muss also mit </name> abgeschlossen werden und darf nicht mit </Name> oder </NAME> beendet werden.

Des Weiteren sind auch hier Attribute zulässig, deren Namen Sie sich auch ausdenken dürfen. Auch hier gilt, dass ein Attribut immer einen Wert haben muss und dieser in einfache oder doppelte Anführungszeichen gesetzt werden muss.

Ergänzende Technologien

XML selbst gibt einem Entwickler also die Möglichkeit eine Sprache zu entwickeln. Allerdings funktionieren Sprachen als Kommunikationsmittel nur dann, wenn sowohl Sender als auch Empfänger einer Nachricht dieselbe Sprache sprechen. Daher gibt es eine ganze Menge Technologien, die es Ihnen ermöglichen eine Grammatik festzuschreiben. Im einfachsten Fall nutzt man dazu eine Document Type Definition (DTD). Mit ihrer Hilfe können Sie beispielsweise  definieren, welcher Befehl nach einem anderen kommen darf (also, etwas wie <vorname> muss nach <name> kommen) oder ob ein Element mehrfach auftauchen darf (<name> wiederholt sich beispielsweise). Allerdings sind die Möglichkeiten einer DTD eingeschränkt. So ist es beispielsweise nicht so einfach wenn man festlegen möchte, dass ein  Element mindestens 10 Mal, maximal aber 20 Mal auftauchen darf. Eine DTD kennt auch keine Möglichkeit um zu definieren, dass das was zwischen einem öffnenden und schließenden Tag steht, nur aus Zahlen bestehen darf und ähnliches.

Benötigen Sie solche und andere komplexere Definitionen, dann ist XML-Schema (Auch XSD für XML-Schema Definition genannt) die Lösung. Auch wenn XSD deutlich komplexer und umfangreicher ist, so lohnt es sich doch oft damit zu arbeiten, weil die Möglichkeiten, die sich daraus ergeben einfach sehr lohnend sind. Alternativ können auch RELAX NG, Schematron oder andere Technologien genutzt werden um ein Schema, also eine Grammatik, zu definieren.

Weitere, sehr zentrale Technologien sind XSLT und XSL-FO. Die Abkürzung XSL steht für Extensible Stylsheet Language. Bei XSLT kürzt das T „Transformation“ ab. Mithilfe von XSLT können Sie also ein Dokument in ein anderes transformieren. Das heißt, wenn Sie ein XML-Dokument wie aus dem obigen Beispiel haben und daraus HTML-Dokument erstellen lassen wollen, dann kann XSLT das für Sie übernehmen. Das macht natürlich meist nur dann Sinn, wenn ein Dokument öfter konvertiert werden soll.

XSL-FO, hier steht das FO für Formatting Objects, ist eine Seitenbeschreibungssprache.  Hiermit sind Sie in der Lage das Layout eines Dokuments sehr exakt zu beschreiben. Somit ist es sehr einfach aus einem XSL-FO-Dokument beispielsweise ein PDF generieren zu lassen. Ein XSL-FO-Dokument wird meist mithilfe von XSLT aus XML generiert.

Die Kombination dieser Technologien wird beispielsweise oft für die Produktion von Katalogen mit einem einfachen Layout genutzt. Die Daten für den Katalog liegen dann in einer Datenbank vor. welceh sie als XML-Dokument zur Verfügung stellt. Danach wird das Dokument mithilfe von XSLT zu XSL-FO transformiert und kann danach direkt gedruckt werden. Somit ist es möglich Kleinstauflagen zeitnah und „on demand“ zu produzieren.

Literaturempfehlungen

• Einstieg in XML: Grundlagen, Praxis, Referenz (Guter Einstieg in XML und angrenzende Themengebiete wie XSL)
• XSLT, XPath und XQuery (Guter Titel um sich tiefer in XSLT einzuarbeiten) 
• XSL-FO – verstehen und anwenden: XML-Verarbeitung für PDF und Druck (Gute Einführung in XSL-FO)

Unterschied zwischen HTML und XML

HTML und XML sind also zwei komplett unterschiedliche Paar Schuhe. HTML ist eine komplett fertige Sprache, welche dazu genutzt werden kann um Webseiten zu erstellen. XML gibt Ihnen die Möglichkeit eine eigene Sprache zu deklarieren und zu nutzen, wie das ja auch im Fall von XHTML gemacht wurde.

Der Beitrag Unterschied zwischen HTML und XML erschien zuerst auf Unterschied zwischen.