Aufbau einer Webseite
Die Programmiersprache HTML
Webseiten werden in der Programmiersprache HTML (hypertext markup language) erstellt. Struktur und Format erhalten einzelne Wörter oder längere Textpassagen durch öffnende und schließende Tags. Einige Attribute verlangen keinen schließenden Tag.
Beispiel1:
Eine Hauptüberschrift wird wie folgt von einem öffnenden und einen schließenden Tag eingeschlossen:
<H1>Kapitel2: Struktur einer Webseite </H1>
Beispiel2:
Soll eine Zeile nur umgebrochen werden reicht der <br>-Tag:
Dies ist die erste Zeile<br>
und das die zweite Zeile
Logischer Aufbau einer Webseite
Mittels Steuerzeichen, den sog. Tags (sprich:tägs) erhält der Browser alle notwendigen Anweisungen, wie nachfolgende Inhalte dargestellt werden.
| <HTML> | * Info für den Browser, dass ein HTML-Dokument kommt |
| <HEAD> | * Einleitung des Kopfbereiches |
| <TITLE> | * Titel der Webseite |
| </TITLE> | * Ende des Titels |
| </HEADE> | * Ende des Kopfbereichs |
| <BODY> | * Webseiten-Körper; hier steht der sichtbare Inhalt |
| <P> | * Absatz |
| </BODY> | * Ende des Webseiten-Körpers |
| </HTML> | * Info für den Browser, dass das HTML-Dokument zuende ist |
Der <p>-Tag (=Paragraph) leitet innerhalb des Body-Tags einen Absatz ein. Selbst eine leere Webseite startet mit einem Absatz. Absätze, die Sie im Editor nur durch Betätigen der Return-Taste setzen, werden vom Browser ignoriert. Am Ende des Absatzes muss ein </p>-Tag stehen. Unterstützt Ihr Editor diesen Ende-Tag nicht, ist er veraltet und Sie sollten einen anderen Editor verwenden.
Hiervon unterscheidet sich der Zeilenumbruch innerhalb eines Absatzes. Längere Textpassagen werden vom Browser automatisch umgebrochen. Wünschen Sie einen Zeilenumbruch an einer bestimmten Stelle, dann verwenden Sie den <br>-Tag (=Break).
Der <br>-Tag benötigt keinen Ende-Tag. Um Ihre Webseite XHTML-konform zu gestalten, fügen Sie allerdings einen Ende-Tag ein. Im Gegensatz zu Tags wie dem </p>-Tag lautet die Schreibweise: <br />.
Übung:
Erzeugen Sie eine neue Webseite, die Sie “poster.html” nennen. Die folgende Bearbeitung erfolgt im Quellcode.
Geben Sie in der Titelleiste Ihrer neu erstellten Webseite den folgenden Titel ein: Posterversand – Martin Beispiel
Im Quellcode erfolgt im Title-Bereich des Head-Abschnittes die folgende Eintragung:
<HEAD>
<TITLE>untitled</TITLE>
</HEAD>
Ändern Sie “untitled” entsprechend in “Posterversand – Martin Beispiel” ab.
Welcher Programmcode folgt danach?