TAGs bezeichnen den Syntax eines HTML-Dokumentes, welcher als Befehlseinheit bzw. Anweisung dient. Ein TAG (Element) wird immer durch eine spitze Klammer gekennzeichnet und kann durch vordefinierte Attribute erweitert werden.

Wenn Sie neu auf dem Gebiet der Programmierung sind und/ oder kaum Erfahrungen haben ein HTML-Dokument von Hand zu erstellen, erhalten Sie hier eine Übersicht der gängigsten und wichtigsten Tags. Bevor Sie Ihre HTML-Tags wahllos platzieren, machen Sie sich erst mit der Struktur eines HTML-Dokumentes vertraut!

Tag Attribut

Wichtige Tags im Head-Bereich

<head> … </head>

Kennzeichnet den HEAD-Bereich und die damit verbundenen Inhalte. Ist standardmäßig in einem HTML-Dokument zu deklarieren sofern es nicht eingebettet und originär aufgerufen wird.

<meta name=““> … </meta>

Legt zahlreiche Anweisungen zur Vereinfachung und Standardisierung für den Browser fest um eine einheitliche und eindeutige Interpretation zu ermöglichen. Empfohlen werden META-Angaben zu den Keywords, der Seitenbeschreibung, der Ländersprache, dem zu verwendenden Zeichensatz und zum Crawl-Verhalten von Suchmaschinen.

<link href=““ rel=““ type=““> … </link>

Ermöglicht das Einbetten bestimmter Zusatzdokumente. Oft verwendet für CSS-Stylesheets und JAVASCRIPT-Auslagerungen. Vorteil ist eine Mehrfachverwendung bestimmter Codeschnipsel und eine verbesserte Übersicht des Quellcodes.

Wichtige Tags im Body-Bereich

<body> … </body>

Kennzeichnet den BODY-Bereich und die damit verbundenen Inhalte. Ist standardmäßig in einem HTML-Dokument zu deklarieren sofern es nicht eingebettet und originär aufgerufen wird.

<h1,h2,…,h6> … </h1,/h2,…,/h6>

Dient der Darstellung von Überschriften. <h1> weist den Browser an eine Überschrift erster Ordnung anzuzeigen. <h2> ist demnach die Überschrift zweiter Ordnung. Maximal sind sechs Ebenenordnungen gestattet.

<div> … </div>

Der <div>-Container kennzeichnet einen Absatz allgemeiner Art. Ihm ist keine spezielle Funktion zugewiesen, eignet sich aber ideal für die Integrierung von CSS-Angaben.

<p> … </p>

Der <p>-Tag ist für den Einsatz von Text als Absatz vorgesehen. Hier können Texte frei formuliert werden.

<img> … </img>

Der <img>-Tag integriert Grafiken, Bilder und Fotos in Ihre Website.

<br> … </br>

Der <br>-Tag erzwingt einen Zeilenumbruch. Ein erneuter <br>-Tag erzeugt eine Leerzeile.

<ul> … </ul>

Der <ul>-Tag bedeutet „unsorted list“ und weist dem Browser an <li>-Tags als Listenpunkte darzustellen. Ideal für den Einsatz von Stichpunkten. Anstatt eines <ul> kann auch ein <ol> verwendet werden. Es ist das Pendant und bedeutet „ordered list“ – also eine geordnete Liste.

<li> … </li>

Der <li>-Tag stellt den einzelnen Listenpunkt dar.

<table> … </table>

Der <table>-Tag ermöglicht den Einsatz von Tabellen im Dokument. Tabellen unterliegen einer gesonderten Struktur. Näheres finden Sie hier.

<a href=““> … </a>

Der <a>-Tag wird zur Verlinkung benutzt. Sie können damit auf andere externen Websites verweisen oder aber auch auf Seiten innerhalb Ihrer Homepage.

Mehr Befehls-Tags zur Erstellung einer Website benötigen Sie anfangs nicht. Mit fortschreitender Programmiertätigkeit erlernen Sie noch zahlreich andere Tags mit den zugehörigen Bedeutungen und Verwendungsmöglichkeiten. Für die Optimierung des Visuellen sind allein CSS-Angaben zuständig. Diese können hier abgerufen werden.