Hypertext Markup Language

aus Wikipedia, der freien Enzyklopädie
Wechseln zu: Navigation, Suche

HTML (Hypertext Markup Language)
Screenshot

Dateiendung: .html, .htm
MIME-Type: text/html
Entwickelt von: World Wide Web Consortium (W3C)
Aktuelle Version: 5.1 (Stand: 1. November 2016)
Art: Auszeichnungssprache
Erweitert zu: XHTML, HTML5
Standard(s): ISO/IEC 15445

W3C HTML 5[1] W3C HTML 4.01[2] W3C HTML 3.2[3]
Website: www.w3.org/html

Die Hypertext Markup Language (englisch für Hypertext-Auszeichnungssprache), abgekürzt HTML, ist eine textbasierte Auszeichnungssprache zur Strukturierung digitaler Dokumente wie Texte mit Hyperlinks, Bildern und anderen Inhalten. HTML-Dokumente sind die Grundlage des World Wide Web und werden von Webbrowsern dargestellt. Neben den vom Browser angezeigten Inhalten können HTML-Dateien zusätzliche Angaben in Form von Metainformationen enthalten, z. B. über die im Text verwendeten Sprachen, den Autor oder den zusammengefassten Inhalt des Textes.

HTML wird vom World Wide Web Consortium (W3C) und der Web Hypertext Application Technology Working Group (WHATWG) weiterentwickelt. Die aktuelle Version ist seit dem 1. November 2016 HTML 5.1,[4] die bereits von vielen aktuellen Webbrowsern und anderen Layout-Engines unterstützt wird. Auch die Extensible Hypertext Markup Language (XHTML) wird durch HTML5 ersetzt.[5]

HTML dient als Auszeichnungssprache dazu, einen Text semantisch zu strukturieren, nicht aber zu formatieren.[6] Die visuelle Darstellung ist nicht Teil der HTML-Spezifikationen und wird durch den Webbrowser und Gestaltungsvorlagen wie CSS bestimmt. Ausnahme sind die als veraltet (englisch deprecated) markierten präsentationsbezogenen Elemente.

Entstehung[Bearbeiten | Quelltext bearbeiten]

Vor der Entwicklung des World Wide Web und dessen Bestandteilen, zu denen auch HTML gehört, war es nicht möglich, Informationen auf digitalem Weg einfach, schnell und strukturiert zwischen mehreren Personen auszutauschen. Man benötigte neben Übertragungsprotokollen auch eine einfach zu verstehende Textauszeichnungssprache. Genau hier lag der Ansatzpunkt von HTML. Um Forschungsergebnisse mit anderen Mitarbeitern der Europäischen Organisation für Kernforschung (CERN) zu teilen und von den beiden Standorten in Frankreich und in der Schweiz aus zugänglich zu machen, entstand 1989 am CERN ein Projekt, welches sich mit der Lösung dieser Aufgabe beschäftigte. Am 3. November 1992 erschien die erste Version der HTML-Spezifikation.

Syntax[Bearbeiten | Quelltext bearbeiten]

Dem Text wird durch Auszeichnungen (englisch markup) von Textteilen eine Struktur verliehen. Die Auszeichnung erfolgt durch SGML-Elemente. Die meisten dieser HTML-Elemente werden durch ein Tag-Paar markiert, das heißt durch einen Starttag und einen Endtag. Ein Starttag beginnt immer mit dem Zeichen <. Es folgt der Elementname (z. B. p für einen Absatz oder h1 für eine Überschrift erster Ordnung) und optional eine Liste seiner Attribute (z. B. class="warning"). Mit einem > wird der Starttag geschlossen. Ein Endtag besteht aus den Zeichen </, dem Elementnamen und dem abschließenden >. Die zusammengehörenden Start- und Endtags bilden zusammen mit dem dazwischenliegenden Inhalt ein Element allgemeiner SGML-Spezifikation. Diese Elemente lassen sich nach Regeln, die in einer Dokumenttypdefinition (DTD) angegeben sind, verschachteln:

 <p>Ein Textabsatz, der ein <em>betontes</em> Wort enthält.</p>

Bestimmte Elemente müssen nicht explizit notiert werden. Bei einigen Elementen darf gemäß der SGML-Regel „OMITTAG“ der Endtag fehlen (z. B. </p> oder </li>). Zudem spielt bei Element- und Attributnamen Groß- und Kleinschreibung keine Rolle (z. B. <ul>, <UL>, <uL>). Zum Vergleich: In XHTML sind diese Regeln strenger verfasst.

Neben Elementen mit Start- und Endtag gibt es in HTML auch inhaltsleere Elemente, wie etwa Zeilenumbrüche (br) oder Bilder (img).

 Eine Textzeile,<br>die hier fortgesetzt wird. <img src="E-Mail-Button.jpg" alt="E-Mail">

Es geht in HTML um beschreibende (englisch descriptive), nicht um verfahrens- (englisch procedural) und darstellungsorientierte (englisch presentational) Textauszeichnung, auch wenn sich HTML in früheren Versionen dafür verwenden ließ. HTML-Elemente sind keine Angaben zur Präsentation, die dem Webbrowser mitteilen, wie er den Text visuell zu formatieren hat. Vielmehr sind Elemente eine strukturierende Auszeichnung, mit der sich Textbereichen eine Bedeutung zuordnen lässt, z. B. <h1>…</h1> für eine Überschrift, <p>…</p> für einen Textabsatz und <em>…</em> für betonten Text. Wie diese Bedeutung letztlich dem Benutzer vermittelt wird (im Falle einer Überschrift z. B. durch vergrößerte, fette Schrift), ist zunächst dem Webbrowser überlassen und hängt von der Ausgabe-Umgebung ab. Denn obwohl HTML-Dokumente in der Regel auf Computerbildschirmen dargestellt werden, können sie auch auf anderen Medien ausgegeben werden, etwa auf Papier oder mittels Sprachausgabe. CSS-Formatvorlagen eignen sich dazu, um auf die Präsentation eines HTML-Dokuments in verschiedenen Medien Einfluss zu nehmen.

Daher gelten Elemente und Attribute zur Präsentation wie <font>…</font>, <u>…</u> und noshade als „missbilligt“ (englisch deprecated) und sollen nach allgemeiner Auffassung vermieden werden; sie sollten in neu entwickelter Software nicht mehr verwendet und bei der Überarbeitung der dokumentengenerienden Software ersetzt werden.

Das Einlesen des Quelltextes sowie das Verarbeiten der vorhandenen Informationen wird in der Fachsprache auch als Parsen bezeichnet, und die Aufbereitung für das Ausgabemedium als Rendern. Die Sprache HTML beschreibt, wie der Browser (oder ein anderes Programm, wie z. B. ein Text-Editor) die Auszeichnungen des Textes zu „verstehen“ hat, nicht, wie er sie dann in der Darstellung umsetzt. So besagt <h1> zwar, dass eine Überschrift folgt, nicht aber, in welcher Schriftgröße oder Schriftschnitt diese darzustellen ist – hier haben sich nur gewisse übliche Standardeinstellungen eingebürgert, die aber nicht Teil der HTML-Spezifikation sind.

Sprachtyp[Bearbeiten | Quelltext bearbeiten]

HTML ist eine Auszeichnungssprache und wird als solche auch nicht programmiert, sondern schlicht geschrieben.

Ein ähnliches Konzept (logische Beschreibung) wie hinter HTML steht hinter dem Satzsystem TeX/LaTeX, das im Unterschied zu HTML jedoch auf die Ausgabe per Drucker auf Papier zielt.

Versionen[Bearbeiten | Quelltext bearbeiten]

HTML wurde erstmals am 13. März 1989 von Tim Berners-Lee am CERN in Genf vorgeschlagen.[7]

  • HTML (ohne Versionsnummer, 3. November 1992): Urversion, die sich nur an Text orientierte.[8]
  • HTML (ohne Versionsnummer, 30. April 1993): Zu Text kommt neben Attributen wie fette oder kursive Darstellung die Bildintegration dazu.
  • HTML+ (November 1993) Geplante Erweiterungen, die in spätere Versionen einflossen, aber nie als HTML+ verabschiedet wurden.[9]
  • HTML 2.0 (November 1995): Die mit RFC 1866 definierte Version führt u. a. Formulartechnik ein. Der Status dieses Standards ist „HISTORIC“. Auch die Vorgänger sind veraltet.
  • HTML 3.0: Nicht erschienen, weil sie mit der Einführung des Netscape-Browsers in der Version 3 bereits vor der geplanten Veröffentlichung veraltet ist.
  • HTML 3.2 (14. Januar 1997): Neu sind zahlreiche Features wie Tabellen, Textfluss um Bilder, Einbindung von Applets.
  • HTML 4.0 (18. Dezember 1997): Einführung von Stylesheets, Skripten und Frames. Auch eine Trennung in Strict, Frameset und Transitional erfolgt. Am 24. April 1998 erscheint eine leicht korrigierte Version.
  • HTML 4.01 (24. Dezember 1999): Ersetzt HTML 4.0 mit vielen kleineren Korrekturen. War lange Zeit Standard bis 2014.
  • XHTML 1.0 (26. Januar 2000): Neuformulierung von HTML 4.01 mit Hilfe von XML. Am 1. August 2002 erscheint eine überarbeitete Version.
  • XHTML 1.1 (31. Mai 2001): Nachdem XHTML in Module aufgeteilt wurde, wird mit XHTML 1.1 eine strikte Version definiert, bei der die mit HTML 4 eingeführten Varianten Frameset und Transitional entfallen.
  • XHTML 2.0 (closed,[10] 26. Juli 2006): Diese Version sollte nicht mehr auf HTML 4.01 basieren und einige neue Elemente einführen, so z. B. <nl> für Navigationslisten. Die Trennung von Auszeichnung und Stil sollte in dieser Version vollendet werden. – Das W3C hat die Arbeiten an XHTML 2.0 im Sommer 2009 eingestellt, weil XHTML durch HTML5 ersetzt werden soll.[11][12][5]
  • HTML5 (Recommendation, 28. Oktober 2014): Schafft auf Basis von HTML 4.01 und XHTML 1.0 ein neues Vokabular. Die zu HTML gehörende DOM-Spezifikation wurde ebenfalls überarbeitet und erweitert.[13]
  • HTML 5.1 (Recommendation, 1. November 2016): Aktuelle Version.[4]

HTML-Struktur[Bearbeiten | Quelltext bearbeiten]

Allgemeine Struktur[Bearbeiten | Quelltext bearbeiten]

Ein HTML-Dokument besteht aus drei Bereichen:

  1. der Dokumenttypdeklaration (Doctype) ganz am Anfang der Datei, die die verwendete Dokumenttypdefinition (DTD) angibt, z. B. HTML 5,
  2. dem HTML-Kopf (HEAD), der hauptsächlich technische oder dokumentarische Informationen enthält, die üblicherweise nicht im Anzeigebereich des Browsers dargestellt werden
  3. dem HTML-Körper (BODY), der jene Informationen enthält, die gewöhnlicherweise im Anzeigebereich des Browsers zu sehen sind.

Somit sieht die Grundstruktur einer Webseite wie folgt aus:

 <!DOCTYPE html> <html>   <head>     <title>Titel der Webseite</title>     <!-- weitere Kopfinformationen -->     <!-- Kommentare werden im Browser nicht angezeigt. -->   </head>   <body>     <p>Inhalt der Webseite</p>   </body> </html>

HTML-Kopf[Bearbeiten | Quelltext bearbeiten]

Im Kopf (engl. head) können sieben verschiedene Elemente verwendet werden:

title
bezeichnet den Titel der Seite, der von den meisten Browsern in der Titelleiste angezeigt wird.
meta
kann vielfältige Metadaten enthalten. Siehe Meta-Element.
base
gibt entweder eine Basis-URI oder einen Basisframe an.
link
dient zur Angabe von logischen Beziehungen zu anderen Ressourcen. Wird am häufigsten zur Einbindung von Stylesheets benutzt.
script
bindet Code in einer bestimmten Skriptsprache ein, hauptsächlich JavaScript.
style
enthält Stilinformationen, hauptsächlich CSS-Deklarationen.
object
bindet eine externe Datei ein. Browser dürfen solche Objekte im Dokumentkopf nicht darstellen.

HTML-Körper[Bearbeiten | Quelltext bearbeiten]

Der HTML-Körper (engl. body) enthält die eigentlichen Seiteninformationen. HTML unterscheidet zwischen Block- und Inline-Elementen. Der wesentliche Unterschied ist, dass erstere in der Ausgabe einen eigenen Block erzeugen, in dem der Inhalt untergebracht wird, während die Inline-Elemente den Textfluss nicht unterbrechen. Vereinfacht gesprochen haben Block-Elemente immer ihren eigenen Absatz. Mithilfe von CSS ist es jedoch möglich, Block-Elemente wie ein Inline-Element darzustellen und umgekehrt. Zudem lassen sich alle Elemente via CSS auch als inline-block auszeichnen, mit dem Ergebnis, dass ein solches Element sowohl Eigenschaften eines Block-Elementes als auch eines Inline-Elementes besitzt.

Eine Überschrift erster Ordnung wird so ausgezeichnet:

 <h1>Überschrift</h1>

h1 steht für Heading 1, zeichnet also eine Überschrift der ersten (und in HTML höchsten) Gliederungsstufe aus. Weiter möglich sind h2 bis h6, Überschriften zweiter bis sechster Gliederungsstufe.

Ein Hyperlink:

 <a href="http://example.com/">Dies ist ein Verweis auf example.com</a>

Hyperlinks sind Verweise auf andere Ressourcen, meistens ebenfalls HTML-Dokumente, die üblicherweise im Browser durch Klick verfolgt werden können. Dieser Link könnte so gerendert werden: Dies ist ein Verweis auf example.com Ebenso ist an diesem Beispiel zu sehen, dass das Link-Element ein Inline-Element ist und keine neue Zeile beginnt.

Normaler Text wird standardmäßig mit p (für Paragraph) angegeben, obwohl ein Text ohne p problemlos möglich wäre, allerdings ist es sehr zu empfehlen, da dadurch zum einen eine Abtrennung zwischen Quelltext und Ausgabe möglich ist, und zum anderen spätestens bei CSS-Programmierung der Befehl zwingend notwendig ist.

So wird ein Text in HTML ausgegeben:

 <p>Ich bin ein Beispieltext</p>

Zur Logik stehen zum Beispiel die Elemente strong oder em bereit, mit denen sich stark hervorgehobener oder betonter Text auszeichnen lässt. Per Voreinstellung (lt. W3C-Empfehlung) werden strong- und em-Elemente durch Fettschrift beziehungsweise kursive Schrift gerendert.

Die Strukturbeschreibung des Textes vereinfacht es, das Rendern dem Betrachter anzupassen, um etwa den Text einem Sehbehinderten vorzulesen oder als Braille auszugeben.

HTML-Varianten[Bearbeiten | Quelltext bearbeiten]

Beim Entwurf der letzten HTML-Version 4 sollte der Tatsache, dass in vielen HTML-Dokumenten noch Elemente und Attribute zur Präsentation eingesetzt werden, Rechnung getragen werden. Das Ergebnis waren schließlich drei Varianten:

Strict[Bearbeiten | Quelltext bearbeiten]

Diese DTD umfasst den Kernbestand an Elementen und Attributen. Es fehlen die meisten Elemente und Attribute zur Beeinflussung der Präsentation, unter anderem die Elemente font, center und u sowie Attribute wie bgcolor, align und target. Deren Rolle sollen in Strict-Dokumenten Stylesheets übernehmen. Text und nicht-blockbildende Elemente innerhalb der Elemente body, form, blockquote und noscript müssen sich grundsätzlich innerhalb eines Container-Elements befinden, zum Beispiel in einem p-Element.

Transitional[Bearbeiten | Quelltext bearbeiten]

Die Transitional-Variante enthält noch ältere Elemente und Attribute, die auch physische Textauszeichnung ermöglichen. Durch diese DTD soll Webautoren, die noch nicht logische Strukturierung und Präsentation voneinander trennen, die Möglichkeit gegeben werden, standardkonformes HTML zu schreiben. Gleichzeitig soll sie sicherstellen, dass bestehende Webseiten weiterhin durch aktuelle Webbrowser angezeigt werden können.

Frameset[Bearbeiten | Quelltext bearbeiten]

Diese Variante enthält zusätzlich zu allen Elementen der Transitional-Variante noch die Elemente für die Erzeugung von Framesets.

Zusatztechniken und Weiterentwicklungen[Bearbeiten | Quelltext bearbeiten]

Cascading Style Sheets[Bearbeiten | Quelltext bearbeiten]

Im Laufe der Jahre ist HTML um Elemente erweitert worden, die der visuellen Gestaltung der Dokumente dienen. Das lief der ursprünglichen Idee einer Systemunabhängigkeit entgegen. Eine Rückbesinnung auf die Trennung von Struktur und Layout (besser: Präsentation) wurde durch die Definition von Cascading Style Sheets (CSS) vorgenommen. So soll das Aussehen bzw. die Darstellung des Dokuments in einer separaten Datei, dem sogenannten Stylesheet, festgelegt werden. Dies verbessert die Anpassungsfähigkeit des Layouts an das jeweilige Ausgabegerät und an spezielle Bedürfnisse der Benutzer, beispielsweise eine spezielle Darstellung für Sehbehinderte. Heutzutage ist die CSS-Unterstützung der Browser ausreichend, um damit eine anspruchsvolle Gestaltung zu realisieren.

In den Anfangsjahren von HTML bis in die 2000er Jahre hinein wurde noch nicht streng zwischen Layout und Seitenphysik unterschieden. So wurde Design mit Hilfe von Layout-Attributen wie color="Farbe" oder Layout-Tags wie <font> umgesetzt oder das Aussehen von Tabellen direkt im table-Bereich grob vorgegeben. Dies gilt heute als veraltet und unprofessionell. Außerdem lässt sich der CSS-Code auch in einer Seite ohne ausgelagerte Datei einbinden.

Dynamisches HTML[Bearbeiten | Quelltext bearbeiten]

Schon sehr früh in der Geschichte von HTML wurden Zusatztechniken erfunden, die es ermöglichen, HTML-Dokumente während der Anzeige im Browser dynamisch zu verändern. Die gebräuchlichste ist JavaScript. Man spricht bei solchen interaktiven Dokumenten von dynamischem HTML. Diese Techniken wurden von verschiedenen Browser-Herstellern, allen voran Microsoft und Netscape, unabhängig voneinander entwickelt. Daher gab es erhebliche Probleme bei der Umsetzung der Techniken zwischen den verschiedenen Browsern. Mittlerweile interpretieren alle verbreiteten JavaScript-fähigen Browser das Document Object Model (DOM). Dadurch ist es möglich, in allen Browsern lauffähige Skripte zu schreiben. Es gibt jedoch noch immer Differenzen bei der Unterstützung des DOM-Standards.

XHTML[Bearbeiten | Quelltext bearbeiten]

Auf Grundlage von HTML 4.01 (SGML) wurde XHTML 1.0 entwickelt. XHTML genügt den im Vergleich zu SGML strengeren syntaktischen Regeln von XML, ist aber in seinen drei DTD-Varianten semantisch mit der jeweils entsprechenden DTD-Variante von HTML 4.01 identisch.

Siehe Hauptartikel XHTML.

HTML5[Bearbeiten | Quelltext bearbeiten]

Die jeweiligen Vorteile von SGML und XML der bisherigen HTML-Versionen wurde vereint in HTML5. Abweichend von den bisherigen HTML-Versionen gibt es keine in HTML5 keine DTD mehr.

Siehe Hauptartikel HTML5.

Ajax[Bearbeiten | Quelltext bearbeiten]

Mit der Ajax-Technologie ist es mittels JavaScript möglich, einzelne bereits geladene Webbrowser-Inhalte gezielt zu ändern und nachzuladen, ohne dass die Webseite komplett neu geladen werden muss. Wegen des geringeren Datenaufkommens wird zum einen eine schnellere Webserver-Antwort ermöglicht, und zum anderen lassen sich Reaktionsweisen von Desktop-Anwendungen simulieren.

Siehe auch[Bearbeiten | Quelltext bearbeiten]

Literatur[Bearbeiten | Quelltext bearbeiten]

  • Stefan Münz, Wolfgang Nefzger: HTML Handbuch. Franzis-Verlag, Poing 2005, ISBN 3-7723-6654-6.
  • Stefan Mintert (Hrsg.): XHTML, CSS & Co. Die W3C-Spezifikationen für das Web-Publishing. Addison-Wesley, München 2003, ISBN 3-8273-1872-6.
  • Mark Lubkowitz: Webseiten programmieren und gestalten – HTML, CSS, JavaScript, PHP, Perl, MySQL, SVG und Newsfeeds, mit CD. Galileo Press, Bonn 2004, ISBN 3-89842-557-6.
  • Elisabeth Robson, Eric Freeman: HTML und CSS von Kopf bis Fuß. O’Reilly, Köln 2012, ISBN 978-3-86899-934-1
  • Stephan Heller: Workshop HTML5 & CSS3. Weblayouts professionell umsetzen – ein Einstieg in die Frontendentwicklung. 1.Auflage, 2012; dpunkt.verlag, Heidelberg; ISBN 978-3-89864-807-3.

Weblinks[Bearbeiten | Quelltext bearbeiten]

 Commons: HTML – Sammlung von Bildern, Videos und Audiodateien

Tutorials[Bearbeiten | Quelltext bearbeiten]

 Wikibooks: Websiteentwicklung – Lern- und Lehrmaterialien
 Wikibooks: Handbuch Webdesign – Lern- und Lehrmaterialien

Validierung[Bearbeiten | Quelltext bearbeiten]

Ältere Standards[Bearbeiten | Quelltext bearbeiten]

Einzelnachweise[Bearbeiten | Quelltext bearbeiten]

  1. ↑ W3C HTML 5 w3.org
  2. ↑ W3C HTML 4.01 w3.org
  3. ↑ W3C HTML 3.2 w3.org
  4. ↑ a b HTML 5.1. Recommendation (Empfehlung). W3C, 1. November 2016, abgerufen am 12. November 2016 (englisch).
  5. ↑ a b Simon Pieters: HTML 5 differences from HTML 4. w3.org, 18. September 2014, abgerufen am 1. Oktober 2014 (englisch): „HTML 5 replaces these documents. [DOM2HTML] [HTML4] [XHTML1]“
  6. ↑ HTML als Auszeichnungssprache im SELFHTML-Wiki
  7. ↑ Tim Berners-Lee: Information Management: A Proposal. März 1989, abgerufen am 25. November 2014.
  8. ↑ HTML, Urversion
  9. ↑ A Review of the HTML+ Document Format, David Raggett
  10. ↑ XHTML 2.0, W3C Working Draft
  11. ↑ XHTML 2 wird eingestellt. Heise-Meldung, 3. Juli 2009
  12. ↑ zur Einstellung der Entwicklung von XHTML 2 Meldung des W3C
  13. ↑ HTML5, A vocabulary and associated APIs for HTML and XHTML. Recommendation (Empfehlung). W3C, 28. Oktober 2014, abgerufen am 27. November 2014 (englisch).
Standards des World Wide Web Consortiums

World Wide Web Consortium (W3C)

Empfehlungen

Canonical XML • CDF • CSS • DOM • Geolocation API • HTML • HTML5 • ITS • MathML • OWL • P3P • PLS • PNG • RDF • RDF-Schema • SISR • SKOS • SMIL • SOAP • SRGS • SSML • SVG • SPARQL • Timed Text • Turtle • VoiceXML • WSDL • XForms • XHTML • XHTML+RDFa • XInclude • XLink • XML • XML Base • XML-Encryption • XML Events • XML Information Set • XML Namespace • XML Schema • XML Signature • XPath • XPointer • XProc • XQuery • XSL • XSL-FO • XSLT (elements)

 {{{Bild-Beschreibung}}}
Arbeitsentwürfe
und Kandidaten

CCXML • CURIE • InkML • RIF • SCXML • SMIL Timesheets • sXBL • WICD • XFDL • XFrames • XBL • XHTML+MathML+SVG • XMLHttpRequest
Anmerkungen

XAdES • XHTML+SMIL • XUP
Richtlinien

Web Content Accessibility Guidelines • Multimodal Interaction Activity • Markup Validation Service
Initiativen

Web Accessibility Initiative
Abgerufen von „https://de.wikipedia.org/w/index.php?title=Hypertext_Markup_Language&oldid=162724635“