Was ist neu in HTML 5?

Im Januar 2008 war es soweit. Das World Wide Web Consortium (W3C) hat den ersten Entwurf für HTML in der neuen Version 5 veröffentlicht. Trotz XHTML und XML, die die Zukunft darstellen sollen, wird es eine neue Version der "Ur-Programmiersprache" für Webanwendungen geben. Einige der Neuheiten im Zusammenhang mit HTML5 sind bereits in aktuellen Browserversionen enthalten.

Geschichte von HTML 5

Bereits im Jahr 2004 wurde von der WHATWG-Gruppe ein erster Entwurf für eine neue HTML-Version vorgelegt. In der Folge kündigte Tim Berners-Lee selbst an, dass im W3C ebenfalls eine Arbeitsgruppe zur weiteren Entwicklung von HTML ins Leben gerufen werden soll. Da man gleichzeitig auch an XHTML2 arbeitete, entstand zwar so eine hausinterne Konkurrenz, aber im Sommer 2007 hat man die Entscheidung getroffen, die neue HTML-Spezifikation auf Basis des WHATWG-Entwurfes auszuarbeiten, deren erster Entwurf am 22.01.08 veröffentlicht wurde.

Wichtige Ziele von HTML 5

Ersatz für vorhandene Spezifikationen

HTML 5 soll die bisherigen eigenständigen Spezifikationen für HTML 4.01, XHTML 1.0 und DOM 2 ersetzen. Aus diesem Grund wurde innerhalb des HTML 5-Entwurfes drei Sprachformen definiert: HTML 5, XHTML 5 und DOM 5.

Einsatz in unterschiedlichen Sprachformen

Aufgrund der drei Sprachformen von HTML 5 soll es für den Einsatz als klassisches HTML, als XML-Variante und für eine neue Version des Document Object Model geeignet sein.

Werkzeug zur Fehlerüberprüfung

Zum ersten Mal soll ein standardisierten Werkzeug zur Fehlerüberprüfung zur Verfügung gestellt werden, mit dem die klassische HTML-Variante auf Probleme untersucht werden kann.

Aufbau von HTML 5

Um diese Unterschiede in den bisherigen Spezifikationen für HTML 4.01, XHTML 1.0 und DOM zu minimieren, hat man HTML 5 nicht als eigene Sprache sondern eher als "Sammlung" von Programmierwerkzeugen konzipiert, die HTML, XML und DOM unter einem gemeinsamen Dach vereinigen und nutzbar machen soll.

Basis der neuen Sprache

Die Basis der Elemente und Attribute von HTML 5 sind ungefähr mit der Strict-Variante von HTML 4.01 vergleichbar. In der neuen Spezifikation wird ebenfalls definiert, wie ein Browser mit älteren Elementen und Attributen umgehen soll. Das heißt gleichzeitig, dass bestimmte Elemente und Attribute, die als "depreaced" eingestuft sind, nicht verwendet werden dürfen, der Browser sie aber akzeptieren müsste.

Einfluss von SGML

Bis einschließlich der HTML-Version 4.01 basiert die Sprache auf SGML, was in der neuen Version ebenfalls abgeschafft wurde. Es wurde ein SGML-unabhängiger Sprachstandard definiert, der sich jedoch an den bisherigen HTML-Parsern in den Browsern orientiert. Damit wird zum einen eine Abwärtskompatibilität in den Sprachversionen geschaffen und die Browserhersteller müssen - relativ betrachtet - nur minimale Änderungen vornehmen, um HTML 5 verarbeiten zu können.

Hinweise zu XHTML5

Die bisherige XHTML-Spezifikation ermöglichte es unter Einhaltung bestimmter Regeln, Dokumente mit dem Typ text/html zu verarbeiten. Browser wie der Internet Explorer oder Lynx verarbeiten diese Dokumente als HTML. Die in der Praxis existierenden Unterschiede zwischen reinem XHTML und als HTML interpretiertes XHTML will HTML 5 verringern und gleichzeitig einen problemlosen Übergang auf die neuen Sprachversionen ermöglichen.
XHTML 5 ist ein reines XML-Format und unterliegt deshalb den Regeln zur Verarbeitung von XML-Dokumenten. Da die HTML5-Arbeitsgruppe darauf keinen Einfluss hat, müssen Kompromisse für die HTML-Formulierung und dem DOM gefunden werden. Ein Beispiel dafür ist die in HTML 5 erlaubte selbstschließende Schreibweise leerer Elemente, die noch bei HTML 4.01 einen Fehler bedeuten würde.

Hinweise zu DOM 5

Die komplette HTML 5-Spezifikation ist vom DOM-Thema geprägt. HTML 5 legt fest, wie sich Browser, die DOM nicht unterstützen, verhalten müssen, wenn HTML 5-kompatible Dokumente angezeigt werden sollen.
Das Document Object Model selbst wird ebenfalls in der neuen Spezifikation weiter entwickelt. Ein neues Feature ist, dass alle HTML-Elemente, die im Gegensatz zu XHTML-Elemente über keinen Namensraum verfügen, dem XHTML-Namensraum angehören. Die dazugehörige URL lautet "http://www.w3.org/1999/xhtml/".

Auswahl neuer Elemente in HTML 5

Die folgenden neuen Elemente dienen der Struktur des Inhaltes eines HTML-Elementes.

Element article

Mit diesem neuen Tag wird ein Textabschnitt definiert, der im direkten Zusammenhang mit den Vorfahrelementen steht. Beispiele dafür sind Nachrichtenartikel, Foren- oder Blogeinträge.

Element aside

Damit wird ein Abschnitt beschrieben, der thematisch zum eigentlichen Inhalt passt, aber nicht unmittelbar dazugehört. Ein praktisches Beispiel dazu könnte ein durch "aside" definiertes Element sein, dass Quell- oder Querverweise für einen Nachrichtenartikel enthält.

Element dialog

Wie der Name des Elementes schon vermuten lässt, dient dies zur Kennzeichnung von Dialogen in einem HTML-Dokument. In diesem Zusammenhang gibt es die neuen Elemente "dd" und "dt". Damit werden die beiden "Teilnehmer" am Dialog bezeichnet.

Element footer

Mit diesem Element definiert eine Fußzeile für einen bestimmten Textabschnitt (z. B. "article") und gibt weitergehende Auskünfte über den Text. Zwei Beispiele dafür sind der Autorenname und der Erstellungszeitpunkt des Textes.

Element header

Mit diesem Element wird ein Kopfbereich für einen Abschnitt definiert. Neben der eigentlichen Überschrift kann dieser zum Beispiel auch die Version des folgenden Textes enthalten.
Beispiel:

<header>
<h1>Titel des Abschnittes</h1>
<h2>Untertitel des Abschnittes</h2>
</header>

Die einzelnen Informationen im Kopfbereich oder in der Fußzeile müssen selbst definiert werden. Für die Elemente <footer> und <header> sind keine weiteren Elemente bis jetzt vorgesehen.

Element figure

Damit können bestimmte Medien wie zum Beispiel Bilder oder Videos mit sog. "Bildunterschriften" versehen werden.

Element nav

Dieses Element definiert einen kompletten Navigationsbereich innerhalb eines Dokumentes, der sowohl externe als auch interne Links enthalten kann.

Element section

Damit wird ein Abschnitt mit thematisch zusammenhängenden Inhalt definiert. Dieser Abschnitt enthält gleichzeitig einen Kopf- und Fußbereich, der mit "header" bzw. "footer" definiert wird.

Elemente audio und video

Mit der Hilfe dieser Elemente sollen Audio- bzw. Videodateien in ein HTML-Dokument eingebunden werden. >HTML 5 soll verschiedene Schnittstellen zur Verfügung stellen, um die Wiedergabe dieser Dateien steuern zu können.

Element embed

Mit diesem Element wurden bisher im Netscape-Browser Audio-Dateien eingebunden. HTML 5 macht aus diesem proprietären Element ein standardisiertes Tag, mit dem externe Anwendungen und interaktive Inhalte eingebunden werden sollen.

Element m

Dieses Element hebt u.a. den Text hervor, der von einer Suchmaschine gefunden wurde und sichtbar markiert wird. Damit hat der Benutzer bzw. der Browser die Möglichkeit, den Text schneller zu finden. Anderweitig hervorgehobene Texte wie z. B. durch <b> spielen hier keine Rolle.

Element meter

Damit wird z. B. angezeigt, wie gut ein Suchergebnis zum eingegebenen Suchbegriff ist oder die Einschätzung eines Produktes im Vergleich zur besten Bewertung.

Element source

Für ein Medienelement unterschiedlicher Art können mit diesem Element unterschiedliche Quellen angegeben werden. Damit soll z.B. dem Browser geholfen werden, das passende Plugin/externe Programm zur Darstellung zu finden.

Element time

Mit diesem Element soll es einem Browser ermöglicht werden, einen interaktiven Kalender zu erzeugen. Damit werden Zeitangaben ausgezeichnet und mit Metadaten versehen.

Element canvas

Dieses Element erzeugt eine Zeichenoberfläche, auf der mit Hilfe von DOM-Methoden gezeichnet werden kann. Bisher sieht die HTML 5-Spezifikation eine zweidimensionale Oberfläche vor, wobei für die Zukunft die dritte Dimension schon eingeplant ist.

Element progress

Die Bezeichnung des Elementes ist die direkte englische Übersetzung für "Fortschritt" und diese Aufgabe soll das Element auch erfüllen. Es dient zu einer Fortschrittsanzeige bei der Ausführung von bestimmten Aufgaben - wie z.B. bei einer mehrseitigen Umfrage.

Formulare in HTML 5

Im Zusammenhang mit HTML5 arbeitet das W3C und die WHATWG-Gruppe zusammen an einer Spezifikation mit dem Titel "Web Forms 2.0". Sie soll in die HTML 5-Spezifikation integriert werden, wenn diese weiterentwickelt wird. Konkrete Bezeichnungen für die Elemente und Attribute gibt es noch nicht, jedoch sind einige der neuen Regeln bereits bekannt.

Es soll neue Eingabentypen u.a. für Emails, Internetadressen, Zeitstempel geben, die direkt vom Browser überprüft werden können.
Die Eingabefelder können bereits auf HTML-Ebene als Pflichtfelder gekennzeichnet werden und müssen nicht mehr mit Javascript überprüft werden.
Es können Templates erstellt werden, um standardisierte Formulareingaben bei Bedarf hinzuzufügen.
Es gibt die Möglichkeit, Datenlisten zu nutzen, um ein regelbares Kontrollobjekt zu erzeugen, mit dem u.a. die Lautstärke eines Multimedia-Elementes verstellt werden kann.
Auf HTML-Ebene kann festgelegt werden, wie sich CSS-Eigenschaften auf einzelne Formularelemente auswirken.

Praktische Beispiele

Eingabefeld für Email-Adresse:

Eingabefeld für ein Datum:

Eingabefeld für einen Zeitraum:

Mit den neuen Attributen "min" und "max" werden die Grenzen für den Zeitraum festgelegt, innerhalb dessen ein Zeitwert eingegeben werden kann. "min" und "max" können auch mit dem neuen Typ "range" für ein Eingabefeld verwendet werden, in dem eine bestimmte Zahlenfolge angegeben werden kann. In diesem Fall kann durch das Attribut "step" der Abstand zwischen den einzelnen Zahlen festgelegt werden.

Durch das neue Attribut "required" wird das dazugehörige Eingabefeld als Pflichtfeld definiert:

Neu definierte Elemente in HTML 5

Bei der Entwicklung der Spezifikation wurde den Verantwortlichen klar, dass einige HTML-Elemente, die "nur" zu Präsentationszwecken dienen, nicht vermieden werden können. Aus diesem Grund wurde für die entsprechenden Elemente neue Definitionen entwickelt, die ihrer Anwendung entsprechen und den Sinn der Elemente dem Nutzer verdeutlichen sollen. Am praktischen Einsatz dieser Elemente wird sich nichts ändern.

Element i

Bisher erzeugte das Element einen kursiv (= schräg) geschriebenen Text. Jetzt sollen damit Texte markiert werden, die im Normalfall kursiv dargestellt werden sollen - z. B. Gedanken, Titel usw.

Element b

Früher hat dieses Element einen Textabschnitt "fett" markiert. Mit HTML 5 soll mit diesem Element ein Abschnitt hervorgehoben werden, der aber keine wichtigere Bedeutung als der gesamte Text hat. Bestimmte Schlüsselwörter oder Produktbezeichnungen sind zwei Beispiele dafür.

Element em

Damit wird weiterhin Text markiert, der hervorgehoben werden soll. Allerdings verstärkt sich der Effekt des Elementes dadurch, wenn es verschachtelt angewendet wird.

Element hr

Bisher erzeugte dieses Element eine waagerechte Linie. In HTML 5 hat sich daran auch nichts geändert, jedoch symbolisiert die Linie zusätzlich einen thematischen Umbruch zwischen einzelnen Textabschnitten.

Element small

Bisher wurde damit ein Text pauschal kleiner als die normale Schriftgröße formatiert. In HTML 5 soll damit das "Kleingedruckte" wie Geschäftsbedingungen, Urheberrechtshinweise oder Einschränkungen in der rechtlichen Handhabung ausgezeichnet werden.

Element strong

Die bisherige Aufgabe dieses Elementes wird in HTML 5 durch das "em"-Element übernommen. Jetzt stellt dieses Element die besondere Wichtigkeit des damit gekennzeichneten Textabschnittes da.

Wieder erlaubte Elemente / Attribute

In HTML 4.01 wurden die Attribute "start" und "value" für das <ol>- bzw. das <li>-Element als "depreaced" eingestuft. Die beiden Attribute sind in HTML 5 wieder Teil des offiziellen Standards. Der Hintergrund dafür ist, dass beide Attribute nicht zur Präsentation des Inhaltes benötigt werden.

Neue Methode(n) für das Document Object Model

Neben den neuen Methoden zur Manipulation von Multimedia-Elementen heißt die wichtigste der neuen Methoden "getElementsByClassName". Damit können Elemente angesprochen werden, für die das Attribut "class" angegeben wurde. Damit sollen die bereits in proprietären Lösungen, die diesem Zweck dienen, ersetzt werden.

Entfernte HTML-Elemente

Element acronym

Für Abkürzungen soll nur noch das abbr-Element verwendet werden, da dies allgemeiner ist und die Aufgaben des acronym-Elementes mit übernehmen kann.

Element noscript

Für den neuen XHTML-Standard wurde dieses Element entfernt, da es den XML-Verarbeitungsregeln widerspricht.

Weiterhin wurden noch die Elemente "big" und "tt" entfernt.

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project