Herzlich willkommen in der Welt der Webentwicklung! Wenn Sie noch nie von HTML gehört haben, sind Sie hier genau richtig. HTML, oder Hypertext Markup Language, ist die grundlegende Sprache, mit der Webseiten erstellt werden. In diesem Artikel führen wir Sie Schritt für Schritt durch die Grundlagen von HTML und geben Ihnen praktische Beispiele, die Ihnen helfen, Ihre erste Webseite zu erstellen. Lassen Sie uns gemeinsam diesen aufregenden Weg beschreiten!
Was ist HTML?
HTML ist eine Auszeichnungssprache, die verwendet wird, um Struktur und Inhalt von Webseiten zu definieren. Sie besteht aus verschiedenen Elementen, die aus Tags bestehen. Ein Tag sieht in der
Regel so aus: Inhalt. Der Inhalt wird zwischen den öffnenden und schließenden Tags platziert.
Struktur einer HTML-Seite
Eine grundlegende HTML-Seite hat immer eine bestimmte Struktur. Hier ist ein einfaches Beispiel:
Erläuterung zum Code:
1. <!DOCTYPE html>: Dies ist eine Deklaration, die dem Browser mitteilt, dass es sich um eine HTML5-Seite handelt.
2. <html>: Dieses Tag umschließt den gesamten Inhalt der Webseite.
3. <head>: Hier werden Metainformationen wie der Titel der Seite definiert.
4. <title>: Der Titel wird im Tab des Browsers angezeigt.
5. <body>: In diesem Bereich wird der sichtbare Inhalt der Webseite platziert.
6. <h1>: Dies ist eine Überschrift der höchsten Stufe – ideal, um den Haupttitel Ihrer Seite hervorzuheben.
7. <p>: Dies ist ein Absatz-Tag. Es wird verwendet, um Textabschnitte zu definieren.
Erste Schritte mit Elementen
Nun, da Sie die Struktur kennen, möchten wir einige wichtige HTML-Elemente durchgehen:
1. Überschriften
HTML bietet mehrere Überschrifts-Ebenen, von <h1> bis <h6>. Die <h1>-Überschrift ist die wichtigste, während <h6> die unwichtigste ist.
<h1>Überschrift 1</h1>
<h2>Überschrift 2</h2>
<h3>Überschrift 3</h3>
2. Absätze
Um Text zu strukturieren, verwenden Sie Absatz-Tags:
<p>Das ist der erste Absatz.</p>
<p>Das ist ein weiterer Absatz, der unglaublich wichtig ist.</p>
3. Listen
Es gibt geordnete und ungeordnete Listen in HTML:
Ungeordnete Liste:
<ul>
<li>Apfel</li>
<li>Banane</li>
<li>Kirsche</li>
</ul>
Geordnete Liste:
<ol>
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
<li>Dritter Punkt</li>
</ol>
Links und Bilder
Links und Bilder sind entscheidende Elemente einer Webseite. Hier ist, wie Sie sie hinzufügen:
1. Links
Um einen Link zu erstellen, verwenden Sie das <a>-Tag:
<a href="https://www.example.com">Besuchen Sie Example.com</a>
2. Bilder
Bilder können mit dem <img>
<img src="bild.jpg" alt="Ein beschreibender Text für das Bild">
Praktisches Beispiel
Hier ist ein einfaches Beispiel für eine vollständige HTML-Seite, die einige der zuvor erwähnten Elemente kombiniert:
Fazit
Herzlichen Glückwunsch! Sie haben nun die Grundlagen von HTML kennengelernt. Sie wissen, wie man eine einfache Webseite strukturiert und verschiedene Elemente hinzufügt. Der nächste Schritt könnte sein, CSS zu lernen, um das Aussehen Ihrer Webseite zu gestalten. Lassen Sie sich von Ihrer Kreativität leiten und entdecken Sie die aufregende Welt der Webentwicklung! Besuchen Sie uns in unserem Lambert-Studio oder probieren Sie es gleich in Ihrem eigenen Zuhause aus – wir sind hier, um Ihnen zu helfen!