HTML 4.01 erklärt: Doctypes, Altlasten, Umstieg

HTML 4.01 wurde am 24. Dezember 1999 als W3C Recommendation veröffentlicht und prägte gut zehn Jahre lang, wie Webseiten geschrieben wurden. Seit dem 27. März 2018 ist die Spezifikation offiziell als »Superseded Recommendation« eingestuft, also durch eine neuere ersetzt. Trotzdem begegnet sie einem ständig: in alten Firmenseiten, in Content-Management-Vorlagen, in E-Mail-Templates. Wer solchen Code pflegt, muss verstehen, was HTML 4.01 wollte, welche Teile heute ungültig sind und wie man eine alte Seite ohne Risiko modernisiert.

Was HTML 4.01 festlegte

Technisch war HTML 4.01 eine Anwendung von SGML (Standard Generalized Markup Language, ISO 8879). Welche Elemente wo stehen durften, legten Document Type Definitions fest, kurz DTDs. Ein Dokument galt als gültig, wenn es der im Doctype genannten DTD entsprach.

Inhaltlich verfolgte die Spezifikation ein klares Ziel: Struktur gehört ins HTML, Gestaltung in Stylesheets. Elemente wie font, center oder u und Attribute wie align oder bgcolor wurden deshalb als »deprecated« markiert. Laut Spezifikation hieß das: durch neuere Konstrukte überholt, von Browsern aber aus Kompatibilitätsgründen weiter unterstützt. Insgesamt zehn Elemente trugen diesen Vermerk, darunter auch applet, basefont, dir, isindex, menu, s und strike.

Drei Doctypes für drei Zwecke

Weil der Umstieg auf CSS nicht über Nacht gelingen konnte, bot HTML 4.01 drei Varianten an. Strict ließ alle veralteten Elemente und Attribute weg. Transitional erlaubte sie zusätzlich. Frameset enthielt alles aus Transitional und dazu Frames.

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN'
  'http://www.w3.org/TR/html4/strict.dtd'>



<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'
  'http://www.w3.org/TR/html4/loose.dtd'>



<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Frameset//EN'
  'http://www.w3.org/TR/html4/frameset.dtd'>

Die Spezifikation setzt die Bezeichner in doppelte Anführungszeichen. In der Praxis setzte sich Transitional durch, weil damit alter Code gültig blieb. Den Gedanken hinter Strict hat das heutige HTML übernommen: Präsentation gehört nicht ins Markup.

Begriffe aus der Spezifikation kurz erklärt

Begriff	Bedeutung in HTML 4.01
Element	Baustein mit Start-Tag, Inhalt und meist End-Tag, etwa `P` oder `TABLE`; die Spezifikation schreibt Elementnamen groß
Attribut	Eigenschaft eines Elements im Start-Tag, z. B. `href`; je nach Attribut ist der Wert groß-/kleinschreibungsabhängig oder nicht
Datentyp	zulässige Werte eines Attributs, etwa CDATA (Zeichenfolge), `%URI;`, `%Length;` (Pixel oder Prozent) oder `%Color;` (Hexwert oder einer von 16 Farbnamen)
ID und NAME	müssen mit einem Buchstaben beginnen, danach Buchstaben, Ziffern, Bindestrich, Unterstrich, Doppelpunkt, Punkt
Deprecated	überholt, wird aber noch unterstützt
Obsolete	aus der Spezifikation entfernt, Unterstützung nicht garantiert
Konformer User Agent	Programm, das alle verpflichtenden Bedingungen (»must«) der Spezifikation einhält

Die Schlüsselwörter must, should und may verwendet HTML 4.01 im Sinne von RFC 2119, schreibt sie aber klein. Formulierungen wie »We recommend« sind ausdrücklich nicht normativ. Wie man solche Feinheiten in heutigen Spezifikationen liest, erklärt der Beitrag zu W3C-Webstandards.

Welche HTML-4.01-Elemente heute ungültig sind

Der HTML Living Standard der WHATWG, seit 2019 die maßgebliche HTML-Spezifikation, führt die alten Präsentationselemente als obsolet und nicht konform. Browser stellen viele davon aus Rücksicht auf alte Seiten weiterhin dar, ein Validator meldet sie aber als Fehler. Einige Elemente wurden dagegen mit neuer Bedeutung zurückgeholt.

HTML 4.01	Status heute	Ersatz
`font`, `basefont`, `center`	obsolet	CSS (`font-family`, `color`, `text-align`, `margin-inline: auto`)
`frameset`, `frame`, `noframes`	obsolet	`iframe` oder einzelne Seiten mit gemeinsamer Navigation
`applet`	obsolet	`embed` oder `object`
`dir`	obsolet	`ul`
`strike`	obsolet	`del` für Änderungen, sonst `s`
`acronym`	obsolet	`abbr`
`tt`, `big`	obsolet	`code`, `kbd`, `samp`, `var` bzw. `strong`, `mark` oder CSS
Attribute `align`, `bgcolor`, `background`, `border`, `cellpadding`, `cellspacing`	obsolet	CSS
`summary` an `table`	obsolet	`caption` oder erklärender Text
`u`, `s`	wieder gültig, neue Bedeutung	`u` für nicht-textuelle Anmerkungen (z. B. Rechtschreibfehler), `s` für nicht mehr zutreffende Inhalte
`menu`	wieder gültig	Liste von Befehlen, etwa eine Werkzeugleiste

Vieles aus HTML 4.01 gilt dagegen unverändert: die Grundstruktur aus html, head und body, Pflicht-title, Überschriften, Listen, Links, Tabellen mit thead, th und scope, Formulare mit label und fieldset sowie das alt-Attribut für Bilder. Wie diese Bausteine heute korrekt ausgezeichnet werden, zeigen die Beiträge zu HTML-Tabellen und HTML-Formularen.

HTML 4.01 und HTML Living Standard im Vergleich

Thema	HTML 4.01	HTML heute
Grundlage	SGML mit DTDs	eigene Syntax mit genau beschriebenem Parser, dazu XML-Syntax
Version	feste Fassung von 1999	Living Standard ohne Versionsnummer
Doctype	lange Deklaration mit DTD-Adresse	`<!DOCTYPE html>`, dient nur noch dem Standardmodus
Fehlerbehandlung	Umgang mit ungültigem Code weitgehend offen	Parser legt für jeden Fehler fest, was passiert
Zeichensatz	beliebige IANA-Kodierung, Angabe per HTTP oder `meta http-equiv`	nur UTF-8, `<meta charset='utf-8'>` in den ersten 1024 Bytes
Formularfelder	zehn `input`-Typen, keine eingebaute Prüfung	über 20 Typen, Validierung mit `required`, `pattern`, `min`/`max`
Struktur	`div` mit Klassen	zusätzlich `header`, `nav`, `main`, `article`, `footer`
Medien	`object`, `applet`, Plug-ins	`video`, `audio`, `picture`, `iframe`
Prüfung	DTD-Validator	Nu Html Checker

Alte Seiten modernisieren: eine Checkliste

Eine HTML-4.01-Seite funktioniert im Browser meist noch. Der Umbau lohnt sich trotzdem, vor allem wegen Mobilgeräten, Barrierefreiheit und Wartbarkeit. Bewährt hat sich diese Reihenfolge:

Doctype ersetzen durch <!DOCTYPE html>. Danach das Layout prüfen: Alte Doctypes können den Quirks-Modus auslösen, der das Verhalten von Navigator 4 und Internet Explorer 5 nachahmt. Im Standardmodus verschieben sich deshalb manchmal Abstände und Tabellenhöhen.
Zeichensatz auf UTF-8 umstellen: Dateien als UTF-8 speichern, <meta charset='utf-8'> als erstes Element im head, Server-Header prüfen. Details im Beitrag zur Zeichenkodierung.
Sprache setzen mit <html lang='de'>, damit Screenreader richtig vorlesen.
Layout-Tabellen ersetzen durch CSS Grid oder Flexbox; Tabellen nur für tabellarische Daten behalten.
Präsentationsmarkup entfernen: font, center, bgcolor, align und Abstandsgrafiken in CSS-Regeln überführen.
Frames auflösen: Jede Frame-Seite wird eine eigene, verlinkbare URL mit gemeinsamer Navigation.
Validieren mit dem Nu Html Checker und die gemeldeten Strukturfehler beheben.
Barrierefreiheit testen: Tastaturbedienung, Alternativtexte, Formularbeschriftungen.

Ein Kopfbereich vorher und nachher

<!-- HTML 4.01 Transitional -->
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'
  'http://www.w3.org/TR/html4/loose.dtd'>
<HTML>
<HEAD>
<META http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'>
<TITLE>Willkommen</TITLE>
</HEAD>
<BODY bgcolor='#FFFFFF'>
<CENTER><FONT face='Arial' size='5'>Willkommen</FONT></CENTER>



<!-- HTML heute -->
<!DOCTYPE html>
<html lang='de'>
<head>
  <meta charset='utf-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1'>
  <title>Willkommen</title>
  <link rel='stylesheet' href='style.css'>
</head>
<body>
  <h1>Willkommen</h1>

Die Gestaltung wandert in style.css, etwa h1 { text-align: center; font-family: Arial, sans-serif; }. Aus dem FONT-Tag wird so eine echte Überschrift, die Suchmaschinen und Screenreader als solche erkennen. Für E-Mail-Vorlagen gelten eigene Regeln, weil viele Mailprogramme modernes CSS nur eingeschränkt verstehen; mehr dazu im Beitrag zu HTML-E-Mails.