Inhaltsverzeichnis
HTML
HTML ist die Abkürzung für Hypertext Markup Language. Diese Auszeichnungssprache wird zur Darstellung von Internetseiten verwendet. Sie besteht aus einzelnen Elementen (sogenannten Tags), die ineinander verschachtelt sind. Korrektes HTML ist auch für die Suchmaschinenoptimierung essenziell.
HTML – die Sprache des Webs
HTML wird häufig als die Sprache des Internets bezeichnet. Und in der Tat kommt niemand, der Seiten für das Internet erstellt oder programmiert, um HTML herum. Jeder Browser liest HTML und stellt als Ergebnis eine Internetseite mit Überschriften, Absätzen, Bildern, Listen und vielen anderen Elementen dar. Auch Content Management Systeme, die zum Teil ohne Programmiererfahrung genutzt werden können, erzeugen HTML.
Wer sich einen Eindruck über die Syntax dieser Auszeichnungssprache machen möchte, klickt einfach auf eine beliebige Website mit rechts und wählt Quelltext anzeigen. Was dann im Browserfenster erscheint, ist pures HTML.
Ein sehr einfaches Grundgerüst für eine HTML-Seite sieht wie folgt aus:
Dies ist eine Überschrift
Dies ist ein Absatz.
Was bedeuten die einzelnen Elemente dieses HTML-Codes?
- zeigt dem Browser an, dass hier ein HTML-Dokument beginnt. Das Ende des Dokuments wird mit bezeichnet. Dazwischen befinden sich alle Angaben, die der Browser zur Darstellung der Seite benötigt.
- Zwischen head und /head ist Platz für verschiedene „Meta-Angaben“, aber auch für Programmiercode wie zum Beispiel JavaScript.
- Im Body der Seite befinden sich die Elemente, die der Browser direkt darstellt, zum Beispiel Überschriften verschiedener Ordnung (h1 bis h6) und Absätze.
Das ist das Grundprinzip von HTML: ineinander verschachtelte Elemente, die vom Browser dargestellt werden. Einzelne Elemente können dabei mit CSS formatiert werden.
Verschiedene HTML-Versionen
Wie fast jede andere Programmier- und Auszeichnungssprache hat sich auch HTML im Lauf der Zeit weiterentwickelt. Der Ursprung von HTML geht auf die frühen 1990er-Jahre zurück. Der Erfinder von HTML ist Tim Berners-Lee.
- Die erste Version (HTML) wurde 1992 veröffentlicht und enthielt nur wenige Tags. Besonders revolutionär war die Hypertext-Verlinkung mit a href=“Adresse einer anderen Internetseite“, die maßgeblich den Siegeszug des Internets in Gang setzte.
- Es folgten stetige Verbesserungen – von der Version 2.0 bis 4.01 im Jahr 1999.
- 2000 erschien XHTML – HTML in einer Version, die auf XML basierte. 2009 wurde dieses Projekt jedoch aufgegeben.
- Seit 2014 bis heute ist HTML5 das Maß aller Dinge. Diese HTML-Version ist vor allem für Responsive Design ideal.
Für Programmierer und Designer ist es wichtig, stets die neueste Version von HTML zu verwenden. Ältere Versionen weisen zum Teil weniger Funktionalitäten auf. Außerdem registrieren die Google-Crawler überkommene HTML-Tags als Indiz für veraltete Inhalte.
HTML für Inhalte, Design und Struktur
Content is king – aber der beste Content nützt nicht viel, wenn der User mit der Darstellung nicht zurechtkommt oder diesen Content nicht erkennt. Das kann zum Beispiel daran liegen, dass eine Website nicht im Responsive Design erstellt wurde. Die Programmierung einer Website, die auf allen Endgeräten gleich gut dargestellt wird, erfordert tiefer gehende HTML-Kenntnisse. Hier wird vor allem das Zusammenspiel zwischen HTML und CSS wichtig. Während HTML das Grundgerüst einer Website bestimmt, ist die Formatierungssprache CSS (Cascading Style Sheets) für das Design zuständig.
Wichtige Strukturelemente einer modernen Website sind zum Beispiel
- Überschriften mit verschiedenen Gewichtungen (h1, h2, h3 usw.),
- Header und Footer für wichtige Informationen,
- Bilder mit erklärenden Hinweisen,
- Navigationselemente (zum Beispiel in einer Sidebar).
Eine positive User-Experience (UX) ist nur mit einer intelligent strukturierten Webpräsenz möglich, die über eine intuitive Navigation verfügt. Hierfür ist HTML im Zusammenspiel mit CSS unabdingbar.
Webdesign mit HTML und CSS
User bevorzugen benutzerfreundliche Websites. Diese User-Reaktionen registriert auch Google. Ein gutes Webdesign erleichtert es dem Nutzer, sich durch eine Internetpräsenz zu navigieren. Design und SEO haben zwar auf den ersten Blick nicht viel miteinander zu tun. Doch das Ziel von gutem Design und Suchmaschinenoptimierung ist das gleiche: Der User soll die gewünschten Informationen finden und in den meisten Fällen zu einem bestimmten Lead geführt werden.
Spätestens als Google 2018 die Mobiltauglichkeit als wichtigen Faktor für das Ranking eingeführt hat, kommen Webdesigner nicht mehr um Responsive Design herum. Hierfür gibt es verschiedene Ansätze, die mit HTML und CSS zu verwirklichen sind:
- Das HTML-Meta-Tag
Viewport
legt richtet den Inhalt auf die Bildschirmgröße aus. - Mit CSS lässt sich die Schriftgröße so einstellen, dass die Lesbarkeit auch auf kleinsten Geräten nicht beeinträchtigt wird.
- Die möglichst sparsame Verwendung von HTML- und CSS-Angaben verbessert die Ladezeiten – ebenfalls ein wichtiger Ranking-Faktor.
HTML und SEO
Klar ist: Eine Seite mit fehlerhaftem HTML-Code hat kaum Chancen, um bei Google ganz vorne zu rangieren. Vor der Veröffentlichung einer Seite ist es deshalb unbedingt erforderlich, den Code auf Fehler zu prüfen. Hilfreich ist hier der Markup Validation Service des W3C (World Wide Web Consortium).
Jeder Browser benötigt HTML-Code, um eine Website darstellen zu können. Und auch die Google Crawler lesen HTML. Nicht nur die Text-Inhalte von Überschriften, Absätzen, Tabellen und Listen fließen dabei in die Bewertung ein. Auch die intelligente Verwendung einzelner HTML-Tags gibt den Google-Algorithmen wichtige Hinweise.
- So bewirken die Tags „strong“ und „em“ die besondere Betonung einzelner Schlüsselbegriffe.
- Sogenannte Alt-Tags liefern den Crawlern wichtige Informationen über Bildinhalte.
- Der title-Tag ist ebenfalls ein wichtiger SEO Faktor. Google verwendet den Inhalt dieses Tags für die Listenpunkte in den SERPs.
- Auch der Tag meta name=“description“ ist außerordentlich wichtig. Denn dieser Textinhalt wird meist für die Auswahl der Snippets auf der Ergebnisliste von Google gewählt.
Fazit
Ohne HTML ist das Internet nicht denkbar. Denn jede Website beruht auf einem Quelltext, der in dieser Auszeichnungssprache geschrieben ist. Aber nicht nur Browser lesen HTML. Auch die Robots von Google analysieren diesen Code. Je perfekter dieser Code geschrieben ist, umso leichter können die Google-Algorithmen den Inhalt der Seite erfassen. Deshalb eröffnet HTML auch für SEO-Strategien viele Optionen.