Categories: Software

HTML5: So erstellt man eine Basisvorlage

Im Artikel „HTML5: die nächste Web-Design-Generation“ wurden kurz die wichtigsten Änderungen erwähnt, die in der HTML5-Spezifikation bereits implementiert sind, da nicht erwartet wird, dass die vollständige Spezifikation vor 2020 oder 2022 fertig sein wird. Auch die Matrix der Browserkompatibilität mit HTML5 wurde behandelt.

Diesmal wird vertieft auf einige der wichtigen Aktualisierungen von Elementen, die die Spezifikation bringt, eingegangen, speziell auf diejenigen, die bereits heute implementiert werden können. Nicht jeder schreibt seine gesamten Auszeichnungen mit der Hand. Es bieten sich dafür Vorlagen an, die die ersten Schritte der Seitenerstellung erledigen. Bis die Tools, die derzeit verwendet werden, auch die neuen Elemente in HTML5 beherrschen, muss man ohnehin einige der ersten Auszeichnungen mit der Hand vornehmen, warum also nicht erst mal eine Basisvorlage erstellen?

HTML5-Basisvorlage

Mit der HTML5-Spezifikation lässt sich jetzt eine Basisvorlage erstellen, warum also sämtlichen Code jedes Mal neu schreiben, wenn neue HTML-Dokumente erstellt werden müssen. Hier sind die Elemente enthalten, die dabei helfen, mit einer HTML5-Basisvorlage zu beginnen.

Deklaration des Dokumenttyps

Zahlreiche Anwender arbeiten noch immer mit den schwer zu merkenden Dokumenttypen.

Schluss mit dem alten:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Jetzt kommt:

<!DOCTYPE html>

Wie könnte das noch einfacher gehen? Selbst wenn der Browser den Dokumententyp nicht erkennt, wird er im Standardmodus rendern.

Deklaration der Zeichensatz-Kodierung

Und wie sieht es mit der alten Zeichensatz-Deklaration aus?

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

HMTL5 hat den Code jetzt vereinfacht:

<meta charset="UTF-8">

Das http-Äquivalent und der Inhaltstyp sind jetzt impliziert und müssen nicht deklariert werden.

Deklaration des Sprachattributs

Browser benötigen dies, um Text in der richtigen Sprache zu rendern, speziell solchen, der nicht in Englisch geschrieben ist. Zum Beispiel wird heute die folgende Deklaration des Sprachattributs verwendet:

<meta http-equiv="Content-Language" content="en" />

HTML5 hat die Sprachdeklaration auf Folgendes verschlankt:

<html lang="en">

Internet-Medientyp entfällt

Bei früheren HTML-Versionen war man daran gewöhnt, ein Script- oder Link-Tag vorzufinden, das den Medientyp enthält und wie die folgenden Beispiele geschrieben ist:

<script type='text/javascript' src='modernizer-2.0.min.js'>
</script>
<link rel="stylesheet" href="style.css" type="text/css" />

Bei HTML5 gibt es den Internet-Medientyp für Scripts und Links nicht mehr, da er von der Script- oder Link-Quelle impliziert wird, was dann folgendermaßen aussieht:

<script src=
"
modernizer-2.0.min.js
"
>

</script>

<link rel="stylesheet" href="style.css">

Unmittelbare Vorteile für Webentwickler sind unter anderem ein optimiertes, leichter zu implementierendes HTML-Coding und eine reduzierte Gesamtgröße der Datei. Die HTML5-Basisvorlagendatei (.dwt) und die HTML-Datei können heruntergeladen werden (Zip-Datei).

Anführungszeichen?

Solange Attributwerte keine Leerzeichen aufweisen, sind Anführungszeichen in HTML5 nicht notwendig, aber empfohlen; wer also gern weiter Anführungszeichen verwenden oder seine Attribute in Anführungszeichen einschließen möchte, kann das ruhig tun, es ist aber nach den HTML5-Spezifikationen nicht erforderlich. Ganz gleich, wofür man sich entscheidet, es ist sinnvoll, dabei zu bleiben und einheitlich vorzugehen.

ZDNet.de Redaktion

Recent Posts

Studie: Ein Drittel aller E-Mails an Unternehmen sind unerwünscht

Der Cybersecurity Report von Hornetsecurity stuft 2,3 Prozent der Inhalte gar als bösartig ein. Die…

3 Tagen ago

HubPhish: Phishing-Kampagne zielt auf europäische Unternehmen

Die Hintermänner haben es auf Zugangsdaten zu Microsoft Azure abgesehen. Die Kampagne ist bis mindestens…

3 Tagen ago

1. Januar 2025: Umstieg auf E-Rechnung im B2B-Geschäftsverkehr

Cloud-Plattform für elektronische Beschaffungsprozesse mit automatisierter Abwicklung elektronischer Rechnungen.

3 Tagen ago

Google schließt schwerwiegende Sicherheitslücken in Chrome 131

Mindestens eine Schwachstelle erlaubt eine Remotecodeausführung. Dem Entdecker zahlt Google eine besonders hohe Belohnung von…

4 Tagen ago

Erreichbarkeit im Weihnachtsurlaub weiterhin hoch

Nur rund die Hälfte schaltet während der Feiertage komplett vom Job ab. Die anderen sind…

4 Tagen ago

Hacker missbrauchen Google Calendar zum Angriff auf Postfächer

Security-Experten von Check Point sind einer neuen Angriffsart auf die Spur gekommen, die E-Mail-Schutzmaßnahmen umgehen…

5 Tagen ago