HTML Einführung
Was ist HTML
HTML ist die Standard-Auszeichnungssprache für die Erstellung von Web-Seiten.
- HTML steht für Hyper Text Markup Language
- HTML beschreibt die Struktur von Inhalten einer Web-Seite
- HTML-Elemente sind die Bausteine von HTML-Seiten
- HTML-Elemente werden durch die einzelneTags dargestellt
- HTML-Tags sind kleine Stücke von Inhalten wie „Überschriften“, „Absätzen“, „Tabellen“, "Blöcken" und so weiter
- Die HTML-Tags werden nicht im Browser angezeigt, sie werden genutzt, um den Inhalt der Seite zu rendern
Das HTML Grundgerüst
<!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Titel</title> </head> <body> </body> </html>
Erklärung
<!DOCTYPE html> - Dies ist die Deklaration, dass es sich um HTML Dokument handelt und wird stets am Anfang einer HTML Seite gesetzt.
Nach vorgegebenen W3C-Standard besteht eine HTML-Datei mindestens auds folgenden Elementen:
html: Der html-tag umschließt das gesamte Dokument. Dieses wird auch als Wurzelelement bezeichnet. Das html-Element wird stets mit einem lang-Attribut (Sprach-Attribut) angegeben. In unserem Bespielt wird die Sprache in deutsch gekennzeichen <html lang="de">
head: Im head-Element werden Informationen von Programmierern eingebunden. Auch dient er zum Einbinden externer Dateien.
title: Der title wird in der Webseite nicht angezeigt, er erscheintjedoch an vielen Stellen wie:
- Anzeige in einer Registerkarte im Browser
- In Suchmaschinen wird der title als Treffer oder Überschrfit ausgegeben
- Wird ein Vorleseprogramm verwendet, wird der title stets als erstes vorgelesen. Somit sollte man der title immer aussagekräftig sein.
body: Die Inhalte die im body vorliegen, werden zu den darstellenden Elemement die im Browser angezeigt werden.
<meta charset="utf-8">>: In einer html-Datei muss immer eine Zeichencodierung eingebunden werden. Der Standard ist utf-8. Dieser dient dazu das Umlaute wie zum Beispiel: ä ö ü richtig dargestellt werden.
Damit eine Webseite auf mobile Geräte vernünftig dargstellt werden kann, ist es wichtig, dass die Webseite reponsiv ist.
<meta name="viewport" content="width=device-width, initial-scale=1.0" />