HTML: Unterschied zwischen den Versionen

Zur Navigation springen Zur Suche springen
// via Wikitext Extension for VSCode
 
 
(3 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
== Einführung in HTML ==
== Lernplan für HTML5 und HTML ==
HTML (HyperText Markup Language) ist die Standard-Auszeichnungssprache für Dokumente, die im Web angezeigt werden sollen. HTML beschreibt die Struktur einer Webseite und besteht aus einer Reihe von Elementen, die durch Tags dargestellt werden.


== Grundlegende HTML-Struktur ==
=== Einführung ===
Ein HTML-Dokument hat eine grundlegende Struktur, die aus den folgenden Teilen besteht: Doctype-Deklaration, HTML-Tag, Kopfbereich und Körperbereich.
* Was ist HTML?
* Geschichte von HTML
* Unterschiede zwischen HTML und HTML5


== Textformatierung ==
=== Grundlegende HTML-Struktur ===
HTML bietet verschiedene Tags zur Textformatierung, wie z.B. für fetten, kursiven und unterstrichenen Text.
<pre><!DOCTYPE html></pre>
* <pre><html>, <head>, <body></pre>
* Meta-Tags und ihre Bedeutung


== Links und Bilder ==
=== Textformatierung ===
Links und Bilder sind wesentliche Bestandteile einer Webseite. Links werden mit dem <code>&lt;a&gt;</code>-Tag erstellt und Bilder mit dem <code>&lt;img&gt;</code>-Tag eingefügt.
* Überschriften <pre><h1> bis <h6></pre>
* Absätze <pre><p></pre>
* Textformatierung <pre><b>, <i>, <u>, <strong>, <em></pre>


== Listen ==
=== Links und Bilder ===
HTML unterstützt geordnete und ungeordnete Listen, die mit den Tags <code>&lt;ul&gt;</code> und <code>&lt;ol&gt;</code> erstellt werden.
* Hyperlinks <pre><a></pre>
* Bilder einfügen <pre><img></pre>
* Alt-Text für Bilder


== Tabellen ==
=== Listen ===
Tabellen werden mit dem <code>&lt;table&gt;</code>-Tag erstellt und enthalten Zeilen und Zellen, die mit <code>&lt;tr&gt;</code> und <code>&lt;td&gt;</code> definiert werden.
* Ungeordnete Listen <pre><ul>, <li></pre>
* Geordnete Listen <pre><ol>, <li></pre>
* Verschachtelte Listen


== Formulare ==
=== Tabellen ===
Formulare ermöglichen die Eingabe von Daten durch den Benutzer und werden mit dem <code>&lt;form&gt;</code>-Tag erstellt.
* Grundlegende Tabellenstruktur <pre><table>, <tr>, <td></pre>
* Tabellenüberschriften <pre><th></pre>
* Tabellenrahmen und -abstände


== Multimedia ==
=== Formulare ===
HTML unterstützt die Einbindung von Multimedia-Inhalten wie Audio und Video, die mit den Tags <code>&lt;audio&gt;</code> und <code>&lt;video&gt;</code> eingefügt werden.
* Formularelemente <pre><form>, <input>, <textarea>, <button></pre>
* Formularattribute (action, method)
* Verschiedene Eingabetypen (text, password, email, etc.)


== HTML5-Neuerungen ==
=== Multimedia ===
HTML5 bringt viele neue Elemente und APIs mit sich, wie <code>&lt;article&gt;</code>, <code>&lt;section&gt;</code>, <code>&lt;canvas&gt;</code> und <code>&lt;video&gt;</code>.
* Einbetten von Videos <pre><video></pre>
* Einbetten von Audio <pre><audio></pre>
* Verwendung von <pre><source></pre> für verschiedene Formate


== Best Practices ==
=== Semantische HTML5-Tags ===
Einige Best Practices für HTML umfassen die Verwendung semantischer Tags, die Validierung des HTML-Codes und die Optimierung der Webseiten-Performance.
* Bedeutung und Verwendung von <pre><header>, <footer>, <article>, <section>, <nav>, <aside></pre>
* Vorteile semantischer Tags für SEO und Barrierefreiheit
 
=== HTML5 APIs ===
* Einführung in HTML5 APIs
* Canvas API
* Geolocation API
* Web Storage API
 
=== Best Practices ===
* Sauberer und valider HTML-Code
* Barrierefreiheit (Accessibility)
* SEO-freundliche HTML-Struktur
 
=== Weiterführende Ressourcen ===
* Offizielle HTML5-Spezifikation
* Online-Tutorials und Kurse
* Bücher und Dokumentationen
 
== Abschluss ==
* Zusammenfassung der wichtigsten Punkte
* Nächste Schritte und weiterführende Lernpfade
Abgerufen von „https://ahrensburg.city/HTML