HTML - Lektion 1

Einführung

Aufgabe Lies dir die Einführung in die aktuellen Webtechniken unter der Adresse http://fwpf-webdesign.de/einfuehrung durch (alle Abschnitte). Du solltest danach in der Lage sein, die folgenden Fragen mündlich in eigenen Worten zu beantworten:

Wer war der "Erfinder" des "WWW"? Was bedeutet "Hypertext"? Wofür steht die Abkürzung "HTML"?

Wofür steht die Abkürzung "DNS", welche Aufgabe hat dieser Dienst im Internet?

Welches sind die zwei Ebenen des Webdesigns?

Erkläre die Begriffe Website, Webseite und Homepage.

Textauszeichnung mit HTML

Mit HTML wird die inhaltliche Struktur festgelegt – nicht das Aussehen/Layout.

Die Auszeichnung des Inhalts erfolgt in HTML durch Anfangs- und Endmarkierungen (Tags):
<mstart>auszuzeichnender Text</mende>

Start-Tag, Inhalt und Ende-Tag bilden ein HTML-Element

Elemente können verschachtelt werden, dürfen sich dabei aber nicht überschneiden.

Beispieldokument

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de" > <head> <title>Titel der Seite</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /> </head> <body> Hallo Welt! </body> </html>

Übungen

Erstelle auf deinem Arbeitsrechner in einem Texteditor eine html-Datei mit Dokumenttyp-Deklaration, Head und Body. Speichere sie unter einem passenden Namen ab und öffne sie dann in einem Browser ( → Betrachte die Datei lokal).

Verändere den Inhalt deiner Datei (füge z.B. ein Wort hinzu) und betrachte deine Änderungen. Notiere detailliert die notwendigen Arbeitsschritte, um die Ausgabe einer HTML-Datei zu verändern.

Übung

Die wichtigsten Strukturelemente für Texte sind:

Überschriften (in verschiedener Ebene)

Absätze

Auflistungen ("Spiegelstriche")

Aufzählungen ("Nummern")

Übung

Übungen Finde für jedes Strukturelement heraus, wie die zugehörige HTML Auszeichnung aussieht. Schreibe ein gültiges HTML-Beispieldokument, das alle Auszeichnungen enthält.