HTML lernen leicht gemacht: Einführung in HTML

In diesem Blogartikel gibt es eine Einführung in HTML.

HTML steht für HyperText Markup Language. Es ist die grundlegende Sprache, die zum Erstellen von Webseiten verwendet wird.

Grundlage des Webs

HTML ist die Sprache, die das Grundgerüst jeder Webseite bildet. Jede Webseite, die Sie im Internet sehen, wird mit HTML erstellt.

HTML-Datei in Visual Studio Code erstellen

Starten Sie Visual Studio Code, indem Sie das Programm aus deinem Startmenü oder der Taskleiste öffnen.

Neues Projekt oder Ordner erstellen

Falls Sie ein neues Projekt beginnen möchten, können entweder ein neues Verzeichnis erstellen oder ein bestehendes Projekt öffnen. Gehen Sie dazu zu Datei > Ordner öffnen… und wähle Sie den Ordner aus, in dem Sie arbeiten möchtest.

Neue HTML-Datei erstellen

Klicken Sie im Datei-Explorer von Visual Studio Code mit der rechten Maustaste (oder drücken von Strg + N), um ein neues Dokument zu erstellen.
Geben Sie einen Dateinamen ein, der mit der Erweiterung .html endet. Zum Beispiel: index.html.

Aufbau des Dateinamens einer HTML-Datei

  • Name der Datei:
    • Dies ist der eigentliche Name Ihrer Datei. Der Name kann nahezu beliebig gewählt werden, sollte aber aussagekräftig und leicht verständlich sein. Zum Beispiel: index, about, contact, etc.
    • Vermeiden Sie Leerzeichen und Sonderzeichen im Dateinamen. Stattdessen können Sie Bindestriche oder Unterstriche verwenden, z.B. meine-seite oder meine_seite.
  • Erweiterung .html:
    • Die Erweiterung .html zeigt an, dass es sich um eine HTML-Datei handelt. Diese Erweiterung ist notwendig, damit der Browser und andere Programme erkennen, dass es sich um eine Webseite handelt, die im HTML-Format geschrieben ist.

Beispiele:

    • index.html: Hier ist index der Dateiname und .html die Erweiterung. Dies ist eine typische Bezeichnung für die Startseite einer Webseite.
    • about.html: Hier ist about der Dateiname und .html die Erweiterung. Dies könnte eine Seite sein, die Informationen über Sie oder Ihr Unternehmen enthält.
    • contact.html: Hier ist contact der Dateiname und .html die Erweiterung. Dies könnte eine Seite sein, die Kontaktdaten oder ein Kontaktformular enthält.

Markup Language

Eine Markup-Sprache verwendet spezielle Codes, sogenannte „Tags“, um den Inhalt einer Webseite zu strukturieren und zu formatieren. Diese Tags geben an, wie Text, Bilder, Links und andere Elemente auf der Seite angezeigt werden sollen.

Tags und Elemente

HTML verwendet Tags, die in spitzen Klammern (< >) stehen. Ein einfaches Beispiel ist das <p>-Tag, das für einen Absatz steht. Der Text, der innerhalb dieser Tags steht, wird als Absatz formatiert.

Beispiel:

<p>Das ist ein Absatz.</p>

„HTML lernen leicht gemacht: Einführung in HTML“ weiterlesen