HTML
Wichtige HTML-Befehle und ihre Verwendung
Lernen Sie die essenziellen Bausteine einer HTML-Seite kennen
HTML wurde in den frühen 1990er Jahren von Tim Berners-Lee entwickelt, einem Physiker und Informatiker, der am CERN arbeitete. Sein Ziel war es, ein System zu schaffen, das es Wissenschaftlern ermöglicht, Informationen einfacher auszutauschen. Im Jahr 1991 veröffentlichte er die erste Version von HTML, die lediglich 18 Tags umfasste. Diese Tags konzentrierten sich auf grundlegende Strukturen wie Überschriften, Absätze und Links.
Einführung in HTML-Befehle (Hypertext Markup Language)
HTML (Hypertext Markup Language) ist die grundlegende Auszeichnungssprache, die verwendet wird, um Inhalte im Web zu strukturieren und darzustellen. HTML besteht aus verschiedenen Befehlen, die auch als Tags bezeichnet werden. Diese Tags sind der Kern von HTML und bestimmen, wie Inhalte auf einer Webseite angezeigt und organisiert werden.
Die Geschichte von HTML
Die Weiterentwicklung von HTML wurde später vom World Wide Web Consortium (W3C) übernommen, das 1994 gegründet wurde. Das W3C hat seither mehrere Versionen von HTML standardisiert, darunter:
- HTML 2.0 (1995): Die erste standardisierte Version von HTML, die grundlegende Funktionen für das Web bot.
- HTML 3.2 (1997): Erweiterte die Sprache um Tabellen, Skripte und Stiloptionen.
- HTML 4.01 (1999): Führte die Unterscheidung zwischen drei verschiedenen Versionen ein: Strict, Transitional und Frameset.
- HTML5 (2014): Die moderne Version von HTML, die neue semantische Elemente, Multimedia-Unterstützung und bessere Kompatibilität mit mobilen Geräten bietet.
HTML hat sich zu einem unverzichtbaren Bestandteil des Internets entwickelt und ist bis heute eine der grundlegenden Technologien für die Erstellung von Webseiten.
Grundlagen von HTML
HTML-Dokumente sind reine Textdateien, die mit der Endung .html oder .htm gespeichert werden. Sie bestehen aus einer Reihe von Elementen, die in Tags eingeschlossen sind. Jedes Element hat in der Regel einen öffnenden und einen schließenden Tag:
<tagname>Inhalt</tagname>
Beispiel:
<p>Dies ist ein Absatz.</p>
Die wichtigsten HTML-Befehle in einer Liste/Tabelle
Tabelle mit den wichtigsten HTML-Befehlen und deren Funktionen. HTML (Hypertext Markup Language) ist die Grundstruktur jeder Webseite. Mit HTML werden Inhalte wie Texte, Bilder und Links definiert und strukturiert. Es besteht aus einer Sammlung von Tags (Befehlen), die festlegen, wie der Browser den Inhalt darstellen soll. Diese Tabelle bietet eine Übersicht über die wichtigsten HTML-Befehle und deren Funktion, sodass Anfänger und Profis gleichermaßen einen schnellen Einstieg oder eine praktische Referenz haben.
| HTML-Befehl | Funktion |
|---|---|
<!DOCTYPE html> | Deklariert den Dokumententyp als HTML5. |
<html> | Start- und Endtag für das gesamte HTML-Dokument. |
<head> | Beinhaltet Metadaten, Titel und Verweise zu Stylesheets oder Skripten. |
<title> | Definiert den Titel des Dokuments, der in der Browser-Registerkarte angezeigt wird. |
<body> | Enthält den sichtbaren Inhalt der Webseite. |
<h1> bis <h6> | Überschriften-Tags, <h1> ist die größte, <h6> die kleinste. |
<p> | Definiert einen Absatz. |
<a href=""> | Erstellt einen Hyperlink zu einer anderen Seite oder Ressource. |
<img src="" alt=""> | Fügt ein Bild ein. src gibt den Pfad an, alt beschreibt das Bild für Barrierefreiheit. |
<ul> | Erstellt eine ungeordnete Liste (Bullet Points). |
<ol> | Erstellt eine geordnete Liste (nummeriert). |
<li> | Definiert ein Listenelement innerhalb von <ul> oder <ol>. |
<div> | Erstellt einen Block-Container zur Strukturierung des Inhalts. |
<span> | Definiert einen Inline-Container für Text oder Elemente. |
<strong> | Markiert Text als wichtig (meist fett dargestellt). |
<em> | Markiert Text als hervorgehoben (meist kursiv dargestellt). |
<br> | Fügt einen Zeilenumbruch ein. |
<hr> | Fügt eine horizontale Linie zur Trennung von Inhalten ein. |
<table> | Erstellt eine Tabelle. |
<tr> | Definiert eine Zeile in einer Tabelle. |
<td> | Definiert eine Zelle in einer Tabelle. |
<th> | Definiert eine Tabellenkopfzelle (meist fett und zentriert). |
<form> | Erstellt ein Formular zur Eingabe von Benutzerdaten. |
<input> | Definiert ein Eingabefeld innerhalb eines Formulars. |
<button> | Erstellt einen klickbaren Button. |
<script> | Fügt JavaScript-Code ein oder verweist darauf. |
<link> | Verknüpft externe Dateien wie Stylesheets mit dem Dokument. |
<style> | Enthält CSS-Code zur Gestaltung des Dokuments. |
<meta> | Definiert Metainformationen (z. B. Zeichensatz, Beschreibung, Autor). |
Die hier aufgelisteten HTML-Befehle bilden das Fundament für die Erstellung moderner Webseiten. Obwohl HTML alleine nur die Struktur vorgibt, bildet es zusammen mit CSS und JavaScript die Basis für ansprechende und interaktive Webanwendungen. Mit der regelmäßigen Übung und der Anwendung dieser Befehle kannst du selbstständig Webseiten erstellen und gestalten.
Struktur eines HTML-Dokuments
Ein typisches HTML-Dokument hat eine grundlegende Struktur:
<!DOCTYPE html>
<html>
<head>
<title>Meine erste Webseite</title>
</head>
<body>
<h1>Willkommen auf meiner Webseite!</h1>
<p>Dies ist ein einfacher Absatz.</p>
</body>
</html>
Erklärung der Struktur:
<!DOCTYPE html>: Deklariert die HTML-Version (HTML5 in diesem Fall).<html>: Das Wurzelelement, das den gesamten HTML-Code einschließt.<head>: Enthält Metadaten über das Dokument, wie den Titel oder Verweise auf Stylesheets.<title>: Definiert den Titel der Webseite, der im Browser-Tab angezeigt wird.<body>: Enthält den sichtbaren Inhalt der Webseite.
Wichtige HTML-Befehle und ihre Verwendung
Textformatierung
HTML bietet mehrere Tags, um Texte zu formatieren:
<h1>bis<h6>: Überschriften unterschiedlicher Hierarchiestufen.<h1>Größte Überschrift</h1> <h6>Kleinste Überschrift</h6><p>: Absatz.<p>Dies ist ein Absatz.</p><strong>und<em>: Hervorhebungen.<strong>Fett</strong> und <em>Kursiv</em><br>: Zeilenumbruch (kein schließendes Tag erforderlich).Zeile 1<br>Zeile 2
Listen
Es gibt zwei Arten von Listen:
- Geordnete Liste (
<ol>):<ol> <li>Punkt 1</li> <li>Punkt 2</li> </ol> - Ungeordnete Liste (
<ul>):<ul> <li>Punkt A</li> <li>Punkt B</li> </ul>
Links und Bilder
- Hyperlinks (
<a>):<a href="https://www.example.com">Besuche Example</a> - Bilder (
<img>):<img src="bild.jpg" alt="Beschreibung des Bildes">
Tabellen
Tabellen werden mit <table> erstellt:
<table>
<tr>
<th>Kopf 1</th>
<th>Kopf 2</th>
</tr>
<tr>
<td>Inhalt 1</td>
<td>Inhalt 2</td>
</tr>
</table>
Formulare
Formulare werden verwendet, um Benutzereingaben zu erfassen:
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<button type="submit">Senden</button>
</form>
Erweiterte HTML-Befehle
- Semantische Tags: Tags wie
<header>,<footer>,<article>und<section>verbessern die Struktur und Zugänglichkeit einer Webseite.<header> <h1>Seitenüberschrift</h1> </header> - Multimedia-Elemente: Tags wie
<audio>und<video>für Medieninhalte.<video controls> <source src="video.mp4" type="video/mp4"> Ihr Browser unterstützt dieses Videoformat nicht. </video>
Offizielle HTML-Spezifikation
Die offizielle HTML-Spezifikation wird von der WHATWG (Web Hypertext Application Technology Working Group) gepflegt. Diese umfassende Dokumentation dient als zentrale Ressource für Entwickler, die sich über alle Aspekte von HTML informieren möchten. Die Spezifikation enthält detaillierte Informationen zu Syntax, semantischen Elementen, APIs und den neuesten Standards, die das Verhalten von Webbrowsern und -anwendungen definieren. Durch ihren dynamischen und lebendigen Charakter wird die Spezifikation kontinuierlich aktualisiert, um den Anforderungen der modernen Webentwicklung gerecht zu werden. Entwickler können sie nutzen, um ihre Projekte mit den neuesten Best Practices zu gestalten.
Besuche die HTML-Spezifikation, um tief in die Welt von HTML einzutauchen.
Fazit
HTML ist eine einfache, aber leistungsfähige Sprache, die die Grundlage jeder Webseite bildet. Durch das Verständnis und die geschickte Nutzung von HTML-Befehlen können Sie ansprechende und gut strukturierte Webseiten erstellen. Für fortgeschrittenere Funktionalitäten kann HTML mit CSS und JavaScript kombiniert werden, um moderne, interaktive Webseiten zu gestalten.
Über den Autor
Hypertext-markup-language.com wurde von Alexander Müller gegründet, einem engagierten Experten im Bereich Webentwicklung. Unser Ziel ist es, Ihnen hochwertige Informationen rund um HTML bereitzustellen und dabei stets aktuell und präzise zu bleiben. Das Team von Hypertext-markup-language.com arbeitet kontinuierlich daran, diese Seite als verlässliche Quelle für Einsteiger und Fortgeschrittene gleichermaßen zu gestalten.
Wir freuen uns, dass Sie den Weg zu uns gefunden haben, und wünschen Ihnen viel Spaß beim Entdecken und Lernen!
Tipp: Ein besonderes Highlight ist das Tipidorf Bertingen – eine Reise wert!
Die Grundlagen von HTML verstehen
HTML ist die Basis jeder Webseite und ermöglicht es, Inhalte strukturiert und zugänglich darzustellen. Mit einfachen Tags wie <p> für Absätze oder <h1> für Überschriften lässt sich schnell eine übersichtliche Seite gestalten. Selbst Einsteiger können in wenigen Minuten ihre erste Webseite erstellen. Doch HTML ist mehr als nur eine Sprache für Struktur – es bildet die Grundlage für alles, was im Web interaktiv und modern ist. Starten Sie noch heute, die Welt von HTML zu entdecken!
HTML hat sich mit der Zeit stark weiterentwickelt und bietet mit HTML5 zahlreiche neue Möglichkeiten. Von eingebetteten Videos bis hin zu interaktiven Formularen – die Funktionen sind vielseitig und zukunftssicher. Durch semantische Tags wie <article> oder <section> wird die Strukturierung von Inhalten nicht nur für Nutzer, sondern auch für Suchmaschinen optimiert. In Kombination mit CSS und JavaScript können Sie beeindruckende Webseiten erstellen, die Design und Funktionalität vereinen. Entdecken Sie die aktuellen Trends und erweitern Sie Ihre HTML-Kenntnisse!
Letzte Bearbeitung am Montag, 30. Dezember 2024 – 17:51 Uhr von Alex, Webmaster für Google und Bing SEO.