• A
• B
• C
• D
• E
• F
• G
• H
• I
• J
• K
• L
• M
• N
• O
• P
• Q
• R
• S
• T
• U
• V
• W
• X
• Y
• Z

HTML

Kurzerklärung

HTML ist die Abkürzung für Hypertext Markup Language. Diese Standard-Auszeichnungssprache für das Internet beschreibt die Struktur einer Website. Jeder Browser „liest” HTML und gibt diese Anweisungen auf dem Bildschirm oder dem Display aus – in Form von Seiten mit Schrift, Bildern, Videos, Grafiken, Buttons und vielen anderen Elementen.

HTML Erklärung

 
Wer sich einen Eindruck von HTML verschaffen möchte, braucht nur eine beliebige Website im Browser aufzurufen. Die Anweisung „Seitenquelltext anzeigen”, die man mit einem Rechtsklick aufruft, zeigt den Inhalt einer Website in Form von purem HTML. Auf den ersten Blick wirkt dieser Code kryptisch. Wer genauer hinsieht (zum Beispiel mithilfe eines speziellen Editors), erkennt jedoch klare Strukturen – vor allem eine konsequente Verschachtelung. Das DOM (Document Object Model) macht sich diese Verschachtelung zunutze: Auf jedes einzelne Element einer Website, zum Beispiel einen Absatz, ein Bild oder einen Link, kann mit Auszeichnungs- und Programmiersprachen wie CSS oder JavaScript zugegriffen werden. So können die einzelnen Elemente formatiert, aber auch versteckt, animiert oder dynamisch verändert werden.

Erklärung: So funktioniert HTML

 
HTML besteht aus einzelnen Tags (engl. tag = Label, Etikett), die die Struktur eines HTML-Dokuments festlegen. Diese Tags bestimmen den Anfang und das Ende der jeweiligen Elemente. Das End-Tag wird dafür mit einem Slash (/) versehen:

 
• <h1>Dies ist eine Überschrift</h1>
• <p>Dies ist ein Absatz</p>

 

Die Unterscheidung zwischen dem Kopf (Head) und dem Körper (Body) eines Dokuments ist wesentlich. Im Body befinden sich die eigentlichen Inhalte – vor allem Texte, Bilder, Videos und gestalterische Elemente. Der Head ist für Programmierer und Designer, aber auch für SEO-Experten interessant. Hier finden sich Verweise auf Skriptsprachen wie JavaScript (<script>), Formatierungssprachen wie CSS (<style>) und beschreibende Angaben zum Seiteninhalt (<title>, <meta>-Tags für Inhaltsangaben, Keywords, den Autor usw.). Vor allem die Angabe <title> ist unter SEO-Aspekten wichtig. Denn der Inhalt dieses Tags wird nicht nur auf dem Browser-Tab angezeigt. In der Regel dient der Titel für Google als Überschrift für einzelne Suchergebnisse.

Mit HTML wird also in erster Linie die semantische Struktur einer Website festgelegt. Alle Elemente einer Webseite lassen sich mit HTML auf einfache und vor allem plattformübergreifende Weise darstellen.

Von HTML 1.0 über XHTML zu HTML5

 
Die Geschichte von HTML ist so alt wie das World Wide Web. 1992 wurde die erste Version veröffentlicht (HTML 1.0), die noch ausschließlich für die Textdarstellung vorgesehen war. Der Clou dieser neuen Auszeichnungssprache war das anchor-Tag (<a>). Auf einfache Weise kann man damit zu anderen Seiten verlinken. Ein Klick – und sofort erscheint ein anderes Dokument, das möglicherweise auf einem Tausende von Kilometern entfernten Server gespeichert ist. Diese Möglichkeit der schnellen Verlinkung ist das eigentliche Erfolgsgeheimnis von HTML.

Nach mehreren Syntax-Anpassungen in den 1990er Jahren (HTML 2, 3, 4) veröffentlichte das W3C (World Wide Web Consortium) im Jahr 2000 eine Neuentwicklung: XHTML – Extensible HTML. Diese HTML-Version orientierte sich wesentlich an der Metasprache XML. Das Projekt wurde jedoch 2014 zugunsten von HTML5 aufgeben. HTML5 stellt sehr einfache Möglichkeiten zur Integration multimedialer Inhalte zur Verfügung – zum Beispiel Videos, Audiodateien, Diagramme, Grafiken und dynamische visuelle Effekte. Die gesamte Struktur einer Website (Navigation, Footer, Artikel usw.) kann mit HTML5 auf einfache Weise verdeutlicht werden.

Mit HTML5 wurde vor allem auf die wachsende Bedeutung mobiler Endgeräte reagiert. Eine Website, deren Quelltext HTML5-konform ist, ist auch für die Suchmaschinenoptimierung vorteilhaft. Google registriert die verschiedenen Versionen von HTML und CSS und bewertet dadurch unter anderem die Aktualität einer Internetseite.

Erklärung der wichtigsten HTML-Tags:

Tags können Attribute enthalten, zum Beispiel eine ID (<p id=“erklaerung“>) oder eine Klasse (<p class=“roteSchrift“>). Über die IDs oder Klassen kann mithilfe von JavaScript oder CSS auf die jeweiligen Elemente zugegriffen werden.

HTML, JavaScript, PHP & Co.
 

Für das Layout und die Funktionalität einer Website spielen neben HTML vor allem CSS, JavaScript und PHP eine große Rolle.

 
• Mit CSS (Cascading Style Sheets) werden HTML-Dokumente gestaltet.
• JavaScript ist eine Programmiersprache, die insbesondere für Webseiten entwickelt wurde. Ajax und jQuery nutzen JavaScript als Grundlage.
• PHP (Personal Homepage Tools oder Hypertext Preprocessor) ist eine sehr leistungsfähige Programmiersprache, die serverseitig agiert. PHP kann HTML-Dokumente erzeugen oder verändern. Im Zusammenspiel mit Datenbanken (vor allem bei Onlineshops) zeigt PHP große Stärken.

 

Die endgültige Formatierung der einzelnen Elemente wird mit CSS (Cascading Style Sheets) vorgenommen. Beispiel:

 
• In einer CSS-Datei steht folgender Befehl: p { color: red; }
• Jedes HTML-Dokument, das auf die betreffende CSS-Datei verweist, zeigt alle Absätze (<p>) in roter Schrift.

 

Auch Google liest HTML

 
Die Robots von Suchmaschinen wie Google analysieren HTML. Sie untersuchen den Quelltext nicht nur nach der Häufigkeit bestimmter Keywords, sondern auch danach, an welcher Stelle diese auftauchen. Die Platzierung von Schlüsselbegriffen spielt eine ausschlaggebende Rolle für die thematische Relevanz einer Internetseite. Wenn etwa das Keyword „Blumen” in einer h1-Überschrift (also einer Headline erster Ordnung) vorkommt, ist dies ein sehr starkes Indiz dafür, dass es in dem gesamten Text um das Thema Blumen geht.

Die Algorithmen von Google erfassen dabei ausschließlich den HTML-Quelltext. Dies gilt auch für Bilder. Die eigentliche Bilddatei ist weniger relevant. Mit einem alt-Attribut lässt sich ein Bild mithilfe von HTML beschreiben. Dieses gibt Google einen Hinweis darauf, was auf dem Bild dargestellt wird:

<img src=“blume.jpg“ alt=“Eine rote Blume“

Wer mehr zum Thema HTML erfahren möchte, findet im Artikel HTML für Fortgeschrittene Hilfe zum Einsatz der Hypertext Markup Language. Eine ausführliche Dokumentation, Tutorials und eine Anleitung zum Einsatz von HTML bieten unter anderem auch das Wiki von selfhtml, die Website von w3schools, die Developer-Seiten von Mozilla und html.net.

Elemente für Texte in HTML

 
Eine Website, deren Syntax den HTML-Regeln entspricht, sieht nicht nur gut aus. Sie wird auch von Suchmaschinen positiv bewertet. Für das Erstellen von Texten, die ohne Bilder oder zusätzliche Effekte auskommen, sind vier Elemente besonders wichtig:

 
1. <h1>Überschrift</h1> (oder <h2>, <h3> usw.)
2. <p>Absatz</p>
3. <strong>fett</strong>
4. <em>kursiv</em>

 

Wenn diese vier Tags richtig eingesetzt werden, haben Programmierer und Webdesigner kein Problem, einen Text für das Web aufzuarbeiten und diesen in eine Internetseite zu integrieren. Das endgültige Design wird mit Werkzeugen wie CSS oder JavaScript vorgenommen. Wer HTML lernen möchte, findet hierfür eine Vielzahl von Tutorials im Internet.

Tritt über 80.000 Kunden weltweit bei und nutze Textbroker für dein Content-Marketing.

Jetzt kostenlos anmelden