top of page

HTML - Grundgerüst

Jede aktuelle HTML5-Seite besitzt das gleiche Grundgerüst, d.h. die gleichen Tags in der gleichen Anzahl und Reihenfolge. Je schneller Sie sich diese einprägen, desto leichter werden Sie es später haben, Fehler in Ihrer Seite zu finden.

<!doctype html>

<html lang="de">

  <head>

    <title>Testseite</title>

    <meta charset="utf-8">

  </head>

  <body>

   Content mit Ä, ä, Ü, ü,

   Ö, ö und ß

  </body>

</html>

  • <!doctype html> bezeichnet die HTML-Version HTML 5.

  • <irgendwas> ist ein Tag, d.h. eine Markierung. Es ist ein Tag, welches den Anfang eines HTML-Elements markiert.
    </irgendwas> ist auch ein Tag. Es ist das zugehörige Ende-Tag, welches das Ende des gleichnamigen HTML-Elements markiert.

  • Es gibt auch Tags, die keine Ende-Markierung besitzen, wie z.B. <meta ...>

  • Es gibt zusätzliche Werte, die man in den Anfangstags findet, z.B. charset="utf-8". 'charset' ist ein Attribut, d.h. eine Eigenschaft dieses Tags.

  • Damit alle weltweit verwendeten Zeichen in ihren Seiten einwandfrei funktionieren, muss die Kodierung im Editor auf UTF-8 eingestellt sein. Der Browser liesst die Angabe UTF-8 aus ihrem Metatag und kann dann auch Sonderzeichen fehlerfrei anzeigen.

  • Alle die Seite beschreibenden Inhalte befinden sich innerhalb des <head>-Elements

  • Der komplette Inhalt der Seite mit den Texten befindet sich im <body>-Tag.

  • Das <title>-Tag legt den im Tab angezeigten Namen der Seite fest.

Aufgabe 1:

  1. Starten Sie einen Editor, z.B. Notepad++.

  2. Tippen Sie das Grundgerüst genau so ein, wie es oben angezeigt wird!

  3. Speichern Sie die Datei unter dem Namen test.html.

  4. Starten Sie den Browser und laden Sie die Datei test.html.

    1. Die Bezeichnung der Seite - title - wird oben im Tab angezeigt und sollte 'Testseite' lauten.

    2. Der Text mit den deutschen Umlauten sollte einwandfrei angezeigt werden.

    3. Auch wenn jetzt alles richtig zu sein schien, kann die Seite immer noch Fehler enthalten!

  5. Besuchen Sie mit ihrem Browser die Seite http://validator.w3.org/

    1. Mit Hilfe dieser Seite können Sie ihre Datei auf Fehler überprüfen. Alle Fehler, die hier gefunden werden, werden auch von jedem Browser festgestellt und können zu unterschiedlichen Darstellungen der Seite in verschiedenen Browsern führen.

    2. Klicken Sie auf File-Upload, wählen Sie die Datei aus und Klicken Sie auf 'Check'.

    3. Die Meldung 'Document checking completed. No errors or warnings to show.' bedeutet, dass Sie diese Übung erfolgreich abgeschlossen haben.

​

​

© 2018 by Rüdiger Borrmann

© 2018/2019/2020 by Rüdiger Borrmann

bottom of page