Übersicht Befehle

Ich unterteile die HTML-Befehle in sieben Bereiche.
*) neu in HTML5

Head

<!DOCTYPE html>*
Steht am Anfang, und definiert den Inhalt als HTML5. Pflicht!
<html>
Die Wurzel, das Grundgerüst. Anfang und Ende. Als Attribut wird hier schon oft die Sprache definiert (lang="de"). Pflicht!
<head>
Kopfbereich, in dem alle Infos hinterlegt werden. Pflicht!
<title>
Der Name der Seite, welcher in der Titelleiste des Browser gezeigt wird, bzw. für Lesezeichen verwendet wird. Pflicht!
<meta>
Alle weiteren Infos (z.B. Keywords für Suchmaschinen)
<link>
Zum Nachladen von diversen Dateien
<style>
Styles für das Design bzw. Layout
<base>
Grundverzeichnis setzen
<script>
Für JavaScript, auch im Body möglich, wird aber gerne vermieden.

Sections (block)

<body>
Beschreibt den sichtbaren Inhalt, hier kommt alles rein. Pflicht!
<main>*
Hauptinhalt der Seite, kann nur einmal vorkommen. Nicht unterstützt von IE11 und Opera Mini 8.
<article> <section>*
Beschreibt einen Themenbereich, ähnlich dem Artikel in einer Zeitung. Mit Section unterscheidet man entweder größere Bereiche eines Artikels, oder sie beschreibt einen Bereich mit mehreren Artikeln (für letzteres kam später <main> hinzu).
<nav>*
Seitennavigation
<header>*
Der sichtbare Kopf der Seite (Logo, Name, etc.)
<footer>*
Fußzeile der Seite
<aside>*
Nebenbereiche (Werbung, Jobangebote, News)
<address>*
Adressen, Kontakt, Personen, Karten, etc.

Gruppen (block)

<p>
Erzeugt einen Absatz
<hr>
Erzeugt eine Trennlinie
<pre>
Präformatierter Text (Zeichen wie im Texteditor, alle Zeichen gleicher Abstand)
<code>
Beinhaltet Teile eines oder beispielhaften Programmcode, verhält sich ähnlich wie pre.
<blockquote>
Zitate
<ol> <ul> <li>
Aufzählungen: ol für Zählung 1-2-3- und ul für Punkte. li ist das Aufzählungselement selbst.
<dl> <dd> <dt>
Definitionsliste startet und endet mit <dl>. Ein Begriff <dt> kann mehrere Beschreibungen <dd> haben. Zum Beispiel Begriffserklärungen oder FAQ.
<figure>*
Beschreibt Anmerkungen, Codebeispiele, Abbildungen, Zeichnungen, etc.
<figcaption>*
Ein alternative Information, wenn der Inhalt einer <figure> nicht angezeigt, verwendet werden kann (Text für Blinde, bei einer Zeichnung).
<div>
Ein Blockelement ohne Bedeutung, wichtig für Design, Layout und selten auch Struktur.

Text (inline)

<a>
Links
<em>
Betonter Text (kursiv, das alte i)
<strong>
Stark betonter Text (fett, das alte b)
<small>
Kleingedrucktes (Impressum, AGB, etc.) Schrift etwas kleiner
<span>
Inline-Element ohne Bedeutung. Wichtig für reines Design
<br>
Erzeugt einen Zeilenumnruch. Sollte eigentlich nur noch sehr selten eingesetzt werden.
<wbr>*
Markiert eine Stelle für automatischen Zeilenumbruch
<cite>
Titel eines Werkes (oft bei Zitaten zu finden)
<q>
Kurzzitat
<dfn>
Es folgt eine Begriffsdefinition
<abbr>
Eine Begriffsdefinition
<time>*
Datum und oder Uhrzeit
<sub> <sup>
Tief- und Hochgestellt
<i> <b> <u>
Text ohne besondere Betonung oder Wichtigkeit, wird aber anders dargestellt b = fett, i = kursiv, u = unterstrichen ACHTUNG: nicht einfach freizügig wie vorher für das Design verwenden, da sie schon eine gewisse (neue) Bedeutung haben. Lieber eines der oben genannten verwenden.
<mark>*
Hervorhebung wenn es relevant zu einem anderen Kontext steht. Zum Beispiel der Suchbegegriff bei den Suchergebnissen im Vorschautext.
<ruby>, <rb>, <rt>, <rtc>, <rp>*
Anmerkungs ... was? Für asiatische Schriftsprachen
<bdi> <bdo>*
Trennung von unterschiedlichen Sprachen und deren Textausrichtung/ Steuerung.
<s>
Text nicht mehr aktuell (durchgestrichen)
<var>
Eine Variable, Konstante, Platzhalter
<data>*
Maschinen Code
<samp>
Ausgabe eines Programmes
<kbd>
Benutzereingabe (Sprachbefehle)

Embedded

<img>
Bilder einfügen
<video>*
Videos einfügen
<audio>*
Audiodateien einfügen
<embed>*
Für diverse externe Programme/ Dateien/ Plugins
<object>
Auch zum einbinden diverse externen Quellen, und kann in Formularen verwendet werden (gesendet).
<param>
Zum Setzen von Parametern innerhalb des jeweiligen einbegundenen Elementes.
<source>*
Festlegen der Quelldatei für das jeweilg eingebundene Element.
<track>*
Für Text-Elemente die zu einer externen Quelle gehören, zum Beispiel Untertiteldatei für ein video.
<map> <area>
Erzeugt eine sensitive Fläche auf diveresen Objekten, welcher durch die <area> Elemente unterteilt werden können. Zum Beispiel verlinkte Bereiche auf einem Bild.
<canvas> <svg>
Erzeugt ein Bildobjekt, welches mit JavaScript bearbeitet werden kann.

Formular

<form>
Das Formular selbst, hier kommt alles rein.
<label>
Bezeichner für ein Eingabefeld, wird als Text angezeigt.
<input>*
Einzeilige Texteingabe, kann viele unterschiedliche Typen enthalten, und hier sind neue dazu gekommen: hidden, text, tel, url, email, password, date, time, number, range, color, checkbox, radio, file, submit, image, reset, button
<button>
Erstellt einen klickbaren Button (ähnlich input type button).
<select> <optgroup> <option>
Auswahlbereich mit Bereichen (optgroup) und den wählbaren Elementen (option).
<datalist>*
Auswahlliste ähnlich select.
<textarea>
Mehrzeiliges Textfeld
<keygen>*
Erzeugt zwei Schlüssel. lokal und für den Server beim übertragen des Formulars. Sicherheitsfeature.
<output>*
Ein Textfeld ür die Ausgabe, für interaktive Formulare (JavaScript notewendig)
<progress> <meter>*
Elemente zur Anzeige eines Status (Säulendiagramme, Fortschrittsbalken).
<fieldset> <legend>
Zum Gruppieren von Eingabebereichen innerhalb eines Formulars, mit entsprechenden Überschriften/ Bezeichnungen.

Tabelle

<table>
Start der Tabelle, hier kommt alles rein.
<caption>
Überschrift der Tabelle
<colgroup> <col>
Zum definieren von Spalten, sinnvoll für CSS.
<tbody> <thead> <tfoot>
Unterteilt die Tabelle in Kopf-, Inhalts- und Endbereich. Sinvoll für CSS.
<tr>
Beschreibt eine Zeile 
<td>
Beschreibt eine Zelle 
<th>
Beschreibt die Zelle in der ersten Spalte.

Entfernt

Folgende HTML-Befehle gibt es nicht mehr:

<acronym> <applet> <basefont> <big> <center> <dir> <font> <frame> <frameset> <noframes> <strike> <tt>