Start Themenbereiche Stichwortsuche Literaturdatenbank Vorlesung

Zurück zum Kapitelanfang HTML-Tags

Die einzelnen Elemente: "Tags"

HTML ist eine Sprache, mit der man die Struktur eines Textes beschreibt, nicht das konkrete Aussehen. Um kenntlich zu machen, wie ein Text aussehen soll, verwendet HTML sogenannte "TAGs". Grundsätzlich gilt dabei: Jede Textveränderung muß durch einen "Tag" angekündigt und durch einen anderen wieder abgemeldet werden. Die hierfür zuständigen TAGs werden also so verwendet:

<TAG>Text</TAG> Jeder TAG muß in diesen Klammern (<>) stehen, eine Abmeldung hat jeweils einen Slash (/)davor.
Tags dürfen groß oder klein geschrieben werden: zwischen <body> und <BODY> ist kein Unterschied.

Das Grundgerüst einer HTML-Datei

Jede HTML-Datei wird zwischen den Tags <html> und </html> eingeschlossen. Damit wird mitgeteilt, daß es sich um eine Datei im HTML-Format handelt (ein Browser kann nämlich auch reine Textdateien anzeigen).
Das erste Gebiet der HTML-Datei ist der Dateikopf. Er beginnt mit <head> und endet mit </head>. Im Dateikopf werden allgemeine Informationen zur HTML-Datei gegeben. Das wichtigste Paar davon ist <title></title>. Zwischen diesen beiden Tags wird der Titel der Seite bestimmt, der in der blauen Titelleiste des Browser-Fensters erscheinen soll und der z.B. von Suchmaschinen abgefragt wird.
Der Textkörper, also das gesamte sichtbare Dokument, beginnt mit <body> und endet mit </body>. Dazwischen kommt der eigentliche Inhalt Ihrer Webseite einschließlich der Tags für die gewünschten Formatierungen.
<html>

<head>
<title>Meine Homepage</title>
</head>

<body>
Willkommen
</body>

</html>

Die gebräuchlichsten HTML-Tags

<HTML> </HTML>
Anfang und Ende der HTML-Datei 		keine Repräsentation auf dem Bildschirm
<HEAD> </HEAD>
Im Kopf wird der Titel definiert, außerdem können andere Informationen, die im Text nicht erscheinen, angegeben werden (Meta-Informationen: Autor, HTML-Standard, Programm, Ort, Zeit) 		keine Repräsentation auf dem Bildschirm
<TITLE> </TITLE>
Der Titel, den die Seite bekommen soll. 		erscheint in der (meist) blauen Titelleiste
<BODY> </BODY>
Innerhalb des <BODY>-Tags steht der eigentliche Text, der auf der Webseite sichtbar ist.
das Tag selbst hat keine Repräsentation auf dem Bildschirm
Anstelle von BODY kann z.B. auch <BODY BGCOLOR="BLUE">
stehen. Das erzeugt dann blaue Hintergrundfarbe. 		 
<H1> </H1>
Überschriften (headings) (Es gibt in HTML Überschriften von H1 bis H6).

Überschrift 1

Überschrift 3

Überschrift 6
usw.
<P> </P>
Absatz (paragraph) = Zeilenumbruch + Leerzeile. (Das abschließende "</P>"-Element ist nicht unbedingt nötig.) 		Zeile vor dem Absatz

Zeile nach dem Absatz
<BR>
Zeilenumbruch (line break) 		Text vor dem Zeilenumbruch.
Hier geht es nach dem Zeilenumbruch weiter.
<B> </B>
fetter Text (bold) 		Fetter Text
<I> < /I>
kursiver Text (italic) 		Kursiver Text
<FONT SIZE=n> </FONT>
Schriftgröße (proportional zum normalen Text (z.B. -3,+4) oder absolut (z.B. 1,6,5) 		Größe 1
Größe 2
Größe 4
<FONT COLOR=red> </FONT>
Schriftfarbe 		Rote Farbe
<HR>
horizontale Linie (horizontal rule) über die gesamte Breite der WWW-Seite
<CENTER> </CENTER>
zentriert 
Zentrierter Text
<IMG SRC="URL (Adresse) des Bildes">
Bilder einfügen, z.B. <IMG SRC="http://www.educat.hu-berlin.de/mv/ibl.gif"> 		ibl.gif
<A HREF="URL des Zieldokuments">Text</A>
Links auf andere Dokumente/Dateien Beispiel: Dies ist ein Link zur Homepage des <A HREF="http://www.educat.hu-berlin.de/mv/"> Modellversuchs</A> 		Modellversuchs
<OL>
Numerierte Liste (ordered list) mit numerierten Listeneinträgen (list item)
<LI>Erster Eintrag
<LI>Zweiter Eintrag
</OL>
  1. Erster Eintrag
  2. Zweiter Eintrag
<UL> Unnumerierte Liste
(unordered list) mit nicht numerierten Listeneinträgen (list item)
<LI>Erster Eintrag
<LI>Zweiter Eintrag
</UL>
  • Erster Eintrag
  • Zweiter Eintrag
ACHTUNG: Umlaute und ß sollten im HTML-Text anders geschrieben werden:

ä = &auml;
ö = &ouml;
ü = &uuml;
ß = &szlig;

Quellen:

Materialien des BLK-Modellversuchs "Informatische Bildung für Lehramtsstudierende" (IBL). Die Nutzung dieser Seite für Bildungszwecke ist frei. Alle Rechte bei Pädagogik und Informatik. Die Dokumente des Modellversuchs dürfen für den privaten Gebrauch kopiert werden. Jede darüber hinaus gehende Vervielfältigung sowie die kommerzielle Nutzung bedürfen der vorherigen schriftlichen Zustimmung.
IBL Haben Sie Fragen - Anregungen - Kritik? Bitte schreiben Sie an: modellversuch@educat.hu-berlin.de
Impressum - - 2012 © HU
URL: http://www.educat.hu-berlin.de