HTML: Unterschied zwischen den Versionen

← Zum vorherigen Versionsunterschied Zum nächsten Versionsunterschied →

Version vom 20. September 2009, 20:18 Uhr

HTML steht für Hypertext Markup Language und ist im Grunde keine Programmiersprache, sondern eine Auszeichnungssprache. Dies bedeutet, dass Dokumentinhalte mit sogenannten "Tags" beschrieben werden. Bei diesen "Tags" gibt es eine Vielzahl an Möglichkeiten, Dokumentinhalte zu beschreiben.

Grundkonzepte der Hypertext Markup Language

Im Vergleich zu einem herkömmlichen Desktop-Publishing-Programm sind den Gestaltungsmöglichkeiten im W3 noch gewisse Grenzen gesetzt. Die Entwicklung und Normung von HTML ist aber einem steten Erweiterungsprozess unterworfen, wobei neben dem aktuellen Standard HTML 4.01 bzw. xHTML 1.0 von einzelnen Client-Entwicklern vom Standard abweichende Zusatzfeatures implementiert werden. Mit einer weitgehenden Unterstützung der durch das W3C bereits standardisierten CSS-2 ist dadurch echte Seitengestaltung bei Web-Seiten möglich.

Genau betrachtet, müsste es eigentlich Hypermedia Markup Language heißen, da viele Dokumente im W3 hypermedial, mit eingebetteten Grafiken, Links auf Videos, Animation, Sound und dynamischen Inhalten gestaltet sind. Ein weiterer oft benutzter Ausdruck ist Dynamic-HTML (DHMTL). Dabei handelt es sich aber um keine neue Sprachversion oder einen Standard, sondern um eine marketingorientierte Bezeichnung der großen Browserhersteller. Gemeint sind damit die Möglichkeiten, dynamische Inhalte in einfachen HTML-Codes einzubinden. Mit der Abkehr von proprietären Entwicklungen und der zunehmenden Unterstützung des gesamten HTML-Sprachumfanges, von Stylesheets, standardisierten Skripting bzw. Programmiersprachen in aktuelle Webbrowser ist das Schlagwort DHMTL als Mittel zur Produktdifferenzierung jedoch in den Hintergrund geraten.

W3C

Das World Wide Web Consortium (kurz: W3C) ist das Gremium zur Standardisierung der das World Wide Web betreffenden Techniken. Es wurde 1994 gegründet. Gründer und Vorsitzender des W3C ist Tim Berners Lee, der auch als der Erfinder des World Wide Web bekannt ist. Standardisierte Techniken sind HTML XML CSS und so weiter.

HTML Code

Grundgerüst

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html> 
	<head> 
	<title>
		Titel der Webseite
	</title>
 	<!-- Evtl. weitere Kopfinformationen --> 
	</head>

 	<body> 
		Inhalt der Webseite 
	</body> 
</html>

Überschrift

Im eigentlichen Textteil <BODY> gibt es wesentlich mehr Möglichkeiten, Tags einzusetzen. Überschriften können in sechs verschiedenen Größen definiert werden, wobei die Festlegung der Schriftart und Größe für die einzelnen <Hx>-Tags an den W3-Clients eingestellt werden kann. Die Syntax lautet <Hx>text </Hx>, wobei x eine Zahl zwischen 1 und 6 ist und die Überschriften-Ebene definiert.

<h1>Überschrift 1</h1>
<h2>Überschrift 2</h2>
<h3>Überschrift 3</h3>
<h4>Überschrift 4</h4>
<h5>Überschrift 5</h5>
<h6>Überschrift 6</h6>

Text

Umlaute und Sonderzeichen werden durch spezielle Codes in der Form von &xxx; darge-stellt und von den meisten HTML-Editoren automatisch konvertiert. Die entsprechenden Werte können aus Tabellen entnommen werden.

Zeilenschaltungen (CR) werden von W3-Clients ignoriert, d. h. der Text wird der Fenstergröße des Clients entsprechend umgebrochen. Um einen erzwungenen Zeilenumbruch durchzuführen, wird der Tag <BR> verwendet. Der Tag <P> Paragraf hat eine ähnliche Funktion, jedoch wird eine Leerzeile zusätzlich hinzugefügt.

Um Textteile durch ein horizontale Linie zu trennen, wird der <HR> Tag eingesetzt. Zur Zeichenformatierung werden sogenannte Stil-Tags eingesetzt, deren wichtigste folgende sind:

<EM>	einfache Hervorhebung (Emphasize)</EM>
<STRONG>	starke Hervorhebung </STRONG>
<B>	Fettdruck (Bold) </B>
<I>	Kursiv (Italics) </I>

Um einen Text genauso darzustellen, wie er eingegeben wurde, inklusive aller Leerzeichen, Zeilenschaltungen, Tabulatoren etc. wird der <PRE> (preformated) Tag verwendet.

Auflistung

Listen können als aufzählende Listen, nummerierte Listen oder beschreibende Listen ausgeführt werden. Eine aufzählende Liste startet mit dem <UL> Tag (Unnumbered List), die einzelnen Listeneinträge werden so wie bei allen anderen Listenformen mit dem <LI> Tag eingetragen und enden mit dem </UL> Tag. Sollen die einzelnen Listeneinträge durchnumeriert werden, so wird mit dem <OL> Tag (Ordered List) begonnen und mit dem </OL> Tag abgeschlossen. Einen Sonderfall stellt die beschreibende Liste <DL> (Definition List) dar, deren Listeneinträge mit dem <DD> Tag gekennzeichnet werden.

Grafiken

Eingebettete Grafiken (Inline Images) und Multimediaobjekte. Ein Bild sagt mehr als tausend Worte und so ist auch im W3 die Verwendung von in das HTML-Dokument eingebetteten Grafiken ein wesentliches Gestaltungselement. Mit dem <IMG SRC=”image_URL” ALIGN = TOP/MIDDLE/BOTTOM> Tag können Grafiken im GIF-, JPEG- oder X-Bitmap Format in ein Dokument eingebunden werden. Mit dem optionalen ALIGN wird festgelegt, ob der folgende Text oben, in der Mitte oder unten an das Bild gestellt werden soll.

Verweise

Die volle Hypertextfunktionalität in HTML kommt aber erst durch die Möglichkeit des Erzeu-gens von Links Querverweise) zur Geltung. Links werden mit dem <A> Tag (Anchor) hergestellt. Um externe Links zu realisieren, wird das Attribut HREF (HyperText Reference) verwendet. <A HREF=”Page2”> Seite 2 </A>: Dieser Link verweist auf ein Dokument „Page2”, welches sich im gleichen Verzeichnis wie das aktuelle Dokument befindet. Am Bildschirm erscheint der Text „Seite 2”, der wie alle Links farblich hervorgehoben oder unterstrichen ist.

Mit <A HREF=“#Linkname”> Linkname </A> kann auf eine bestimmte Stelle innerhalb eines Dokuments verwiesen werden, die mit <A NAME= ”Linkname”> Linkname </A> gekennzeichnet wurde. Um Links zu Dokumenten auf anderen Servern zu erstellen, werden die in der Einleitung schon beschriebenen URL-Adressen verwendet. Ein Link auf die Homepage des idv-HTTP-Servers hätte somit folgendes Format:

Tabellen

Ein weiteres Strukturelement von HTML-Seiten sind Tabellen. Tabellen, deren Rahmen und Gitternetzlinien nicht sichtbar sind (sogenannte transparente Tabellen), stellen ein einfaches Mittel zur Positionierung von Elementen zur Verfügung. Tabellen werden ebenfalls mittels Tags realisiert. Wegen der Möglichkeit zur Schachtelung von Tags kann eine Tabellenzelle wiederum Elemente wie Listen, Tabellen, Bilder, Links etc. enthalten und es ist ein Positionieren der Elemente einfach möglich. Ein pixelgenaues Positionieren ist in HTML damit nicht möglich und ist von der, der Sprache zugrundeliegenden Philosophie auch nicht beabsichtigt. Für diese typischen Seitengestaltungsaufgaben sind die Cascading Style Sheets (CSS) vorgesehen, die auch eine auf das Ausgabemedium hin optimierte Gestaltung ermöglichen. CSS werden detaillierter später dargestellt.

Literatur

Quellen

Weiterführende Links

SELFHTML

Zitiervorschlag

Niederländer in Pils, Informationsverarbeitung I (21.9.2009), Informationsdarstellung#HTML (mussswiki.idv.edu/iv1)

Version vom 20. September 2009, 20:17 Uhr Quelltext anzeigen Rainernl (Diskussion \| Beiträge) Bots, Bürokraten, Administratoren 1.098 Bearbeitungen Keine Bearbeitungszusammenfassung ← Zum vorherigen Versionsunterschied		Version vom 20. September 2009, 20:18 Uhr Quelltext anzeigen Rainernl (Diskussion \| Beiträge) Bots, Bürokraten, Administratoren 1.098 Bearbeitungen Keine Bearbeitungszusammenfassung Zum nächsten Versionsunterschied →
Zeile 109:		Zeile 109:
	== Zitiervorschlag ==		== Zitiervorschlag ==

	''Niederländer'' in ''Pils'', Informationsverarbeitung I (21.9.2009), Informationsdarstellung#~~Bits & Bytes~~ (mussswiki.idv.edu/iv1)		''Niederländer'' in ''Pils'', Informationsverarbeitung I (21.9.2009), Informationsdarstellung#HTML (mussswiki.idv.edu/iv1)