HTML steht zwar für Hypertext Markup Language, trotzdem ist HTML keine Programmiersprache, sondern eine sog. Auszeichnungssprache - ein dokumentenbeschreibendes Format. HTML besteht eigentlich nur aus Tags, die (wenn XML-kompatibel) den Inhalt umschließen und verschachtelt sein können. In der Regel gibt es zu jedem Tag, der geöffnet wurde, das Gegenstück, das geschlossen wird; Gibt es das Gegenstück nicht, ist das meist ein Fehler:
<html>
<head>Hier ist der Kopf</head>
<body>..und hier der Körper</body>
</html>
Struktur
Das Grundgerüst einer HTML-Datei sieht typischerweise wie folgt aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Seitentitel</title>
</head>
<body>
<p>Hallo Welt!</p>
<p><i>Das</i> ist eine HTML-Seite…</p>
</body>
</html>
Erläuterung der Zeilen:
- Definition des Dokumentenformats
- Es gibt folgende sog. DTD:
- Strict: Trennung zwischen Inhalt und Design, strenge Verschachtelungsregeln
- Transitional/Loose: Weniger Beschränkungen als Strict
- Frameset: Nicht mehr gebräuchlich
- HTML Anfang
- Head Anfang
- Durch die Festlegung des Charset auf UTF-8 (das Dokument muss natürlich auch diese Zeichenkodierung verwenden!), kann man Umlaute wie ä,ü und ß verwenden ohne diese speziell codieren zu müssen; z.B. in &auuml;, &üuml; und ß
- Der Seitentitel wie im Browserfenster angezeigt
- Head Ende
- Body Anfang
- Ein P-Tag (Paragraph = Absatz)
- Ein Paragraph mit einem italic Teil (i-Tag = italic; ginge auch ein em-Tag = emphasized)
- Body Ende
- HTML Ende
Tags
Tags kann man sich einfach merken, wenn man weiß, wofür sie stehen. Die gängisten Tags sind:
- HTML
- head
- title
- meta
- link (kein umgangsspr. Link, sondern Einbettung von weiteren Ressourcen wie z.B. CSS-Dateien oder JavaScripts)
- body
- p (paragraph)
- i (italic), em (emphasized), b (bold), strong
- a (anchor, z.B. a href = anchor hyper-reference für das, was man gewöhnlich umgangssprachlich als "Link" bezeichnet)
- br (line break), hr (horizonal roule)
- div (division), span
- img (image)
- script
Außer dem script-Tag kann man Tags ohne Inhalt auch verkürzt notieren, z.B.
<br/>
statt einem (recht sinnlosen)
<br></br>
Ressourcen
- de.selfHTML.org - die (deutsche) Standard-HTML-Referenz!
- HTML5 Referenz
- Kursbegleitende Quelldateien 011-017.zip
- siehe auch Kurs "Web-Technologie" / Part. Dokumentsprachen der Medien-Informatik
Diese Seite ist Teil der Werkmodule Grundlagen der Webprogrammierung und WebApps - Grundlagen Webprogrammierung von Michael Markert für Interface Design / Fakultät Medien an der Bauhaus-Universität Weimar.