|
HTML heißt übersetzt Hyper Text Markup Language!
Definition von HTML!
Sprache für Veröffentlichungen im World Wide Web,
Textformat für HTTP
Basissprache = Englisch
1990 entwickelt von Berners - Lee; basiert sehr stark auf SGML
Geschichte von HTML!
die Geschichte des WWW begann um 1990 in Genf
Tim Berners-Lee, britischer Informatiker am Genfer Hochenergieforschungszentrum CERN, startete mit Kollegen Initiative, um Internet für neuartigen Informationsaustausch zwischen Wissenschaftlern zu nutzen:
o wissenschaftliche Dokumente sollten online sichtbar gemacht werden
o einfache Textformatierungen und Einbinden von Grafiken sollte dabei möglich sein
o Hypertext-Funktionalität: Dokumente verweisen auf beliebige andere Dokumente (auch Dokumente auf anderen Servern)
§ zwei Säulen: neues Dateiformat HTML und neues Internet-Protokoll HTTP
§ neue Endanwender-Software sollte Dateien online anzeigen und Verweise ausführen können
§ wegen Hypertext-Charakter wurde das Projekt World Wide Web genannt
§ gleichzeitig begann Einrichtung von WWW-Servern, die neues HTTP-Protokoll unterstützen
§ Entwicklung von ersten Client-Programmen für Endanwender und von ersten WWW-Browser
§ Marc Andreessen (später Mitbegründer von Netscape) entwickelte ersten WWW-Browser für grafische Benutzeroberflächen Mosaic
§ Programmierer von Mosaic erfanden neue Features, die sie in den WWW-Browser implementierten, ohne das diese standartisiert waren
§ ab 1993 begannen immer mehr Menschen mit Internet-Zugang und Zugang zu Servern HTML-Seiten über alle Themen für das WWW zu schreiben
§ Firmen wie Microsoft und Online-Dienstanbieter wie Compu-Serve oder Telekom ignorierten zunächst das \\\"Chaos Internet\\\"
§ heute: Anzahl von Technologien und Software-Lösungen im WWW-Bereich kaum noch überschaubar
§ aber: je unübersichtlicher der Markt, desto wichtiger werden allgemein anerkannte und weitgehend eingehaltene Standards wie HTML
Eigenschaften von HTML!
1. Elemente auszeichnen
§ HTML = Auszeichnungssprache (Markup Language)
§ Aufgabe: Beschreiben von logischen Bestandteilen eines Dokuments
→ Befehle zum Markieren typischer Elemente eines Dokuments (Überschriften, Textabsätze, Listen, Tabellen, Grafikreferenzen)
§ Beschreibungsschema geht von hierarchischer Gliederung aus
§ globale Eigenschaften von Dokumenten: Titel, Hintergrundfarbe...
§ eigentlicher Inhalt besteht aus Elementen z. B.: Überschrift 1. Ordnung
§ einige Elemente haben Unterelemente z. B.: Textabsatz enthält fett markierte Textstelle, Aufzählungsliste mit einzelnen Listenpunkten, Tabelle mit einzelnen Tabellenzellen
§ meisten Elemente haben fest definierbaren Gültigkeitsbereich (Überschrift geht vom ersten bis zum letzten Zeichen, Aufzählungsliste bis zum letzten Listenpunkt, Tabelle bis zur letzten Zelle)
§ Beispiel: Schema für eine Aufzählungsliste WWW-Browser lösen die Auszeichnungsbefehle auf und stellen die Elemente in angegebener Form dar
2. Vernetzung herstellen
§ eine der wichtigsten Eigenschaften: Verweise (Hyperlinks) definieren
§ Verweise können zu Stellen im eigenen Projekt, zu beliebigen Adressen im WWW und Internet-Adressen außerhalb des WWW führen
§ Kommerzialisierung: Werbebanner die durch anklicken zu Seiten des Anbieters führen
3. Software-Unabhängiger Klartext
§ HTML = Klartextformat; kann mit jedem beliebigen Texteditor bearbeitet werden, der Dateien als reine Textdateien speichern kann
→ HTML ist nicht an bestimmtes, kommerzielles Software-Produkt gebunden, läßt sich leicht von Programmen generieren
4. Universelle Einsetzbarkeit
§ HTML funktioniert nicht nur im WWW, sondern kann lokal auf jeden Rechner mit WWW-Browser geöffnet werden → geeignet für lokale Dokumentationen, CD-ROM-Oberflächen, Readme-Dateien usw.
§ mit HTML und unmittelbaren Ergänzungssprachen CSS und JavaScript (funktionieren ebenfalls lokal) kann man auch anspruchsvolle Projekte realisieren
Allgemeine Regel zu HTML!
1. Tags (Steuerbefehle in HTML)
§ Tags in HTML:
o HTML-Dateien bestehen aus ASCII-Text → können mit jedem einfachen Text-Editor bearbeitet werden
o neben eigentlichen Text enthalten die Dateien spezifische Befehle
o Befehle stehen in Tags (werden durch spitze Klammern markiert, egal ob Klein- oder Großbuchstaben)
o fast alle Befehle bestehen aus einleitenden und abschließenden Tag (am Schrägstrich zu erkennen);
Text dazwischen = Gültigkeitsbereich für Tag
o Beispiel: (h = heading = Überschrift)
HTML - die Sprache des WWW
o wenige Tags (Standalone-Tags) besitzen keinen abschließenden Tag (weil keine Einleitung für folgenden Text darstellen)
o Beispiel: (br = break = Umbruch)
Eine Zeile, ein manueller Zeilenumbruch
und die nächste Zeile
§ Verschachtelung von Tags:
o Beispiel: (i = italic = kursiver Text)
HTML - die Sprache des WWW
§ Attribute in Tags:
o einleitende Tags und Standalone-Tags können zusätzliche Angaben besitzen
o Beispiel: (align = Ausrichtung, center = zentriert)
HTML - die Sprache des WWW
o Arten von Attributen:
a. alleinstehende Attribute:
--------------------------------------------------------------------------------
(Trennlinie ohne Schatten)
b. Attribute mit Wertzuweisung bestimmter erlaubter Werte:
(Überschrift 1. Ordnung zentriert ausgerichtet - nur die Werte left, center, right und justify erlaubt)
c. Attribute mit numerischer Wertzuweisung:
--------------------------------------------------------------------------------
(Trennlinie 300 Pixel breit)
d. Attribute mit prozentualer Wertzuweisung:
--------------------------------------------------------------------------------
(Trennlinie bei 50% der Breite des Anzeigefensters)
e. Attribute mit variablen Namen: (Grafikreferenz)
o bei Attributen mit variablen Namen Anführungszeichen notwendig
o bei Wertzuweisungen möglichst keine Leerzeichen lassen, um Fehler bei nicht so toleranten Browsern zu vermeiden
§ Universalattribute:
o = Attribute, die in fast allen Tags erlaubt sind
o Beispiel: (p = Textabsatz, id = Namenvergabe für einzelne Elemente)
Text
2. Grundgerüst einer HTML Seite
§ Schema des Grundgerüsts:
o grundsätzlich 2 Teile:
a. Header (Kopf): enthält Angaben zu Titel u. ä.
b. Body (Körper): enthält den eigentlichen Text mit Überschriften, Verweisen, Grafikreferenzen usw.
o Beispiel:
Text, Verweise, Grafikreferenzen usw.
o wichtig: Angabe eines ausagekräftigen (aber nicht zu langen) Titels
o Titel erscheint in Fensterleiste und wird bei Lesezeichen und Historie verwendet, auß,erdem bauen viele Suchmaschinen ihre Datenbank auf den Titeln auf
1. Umlaute, Sonderzeichen und HTML-eigene Zeichen
§ deutsche Umlaute und scharfes S:
o wenn in Datei sonst keine Angaben zu verwendeten Zeichensatz, sollte wegen Internet und internationaler Verwendung für deutsche Umlaute dafür vorgesehene Zeichenfolge verwendet werden:
Zeichen Beschreibung Name in HTML Unicode in HTML
Ä A Umlaut Ä Ä
Ö O Umlaut Ö Ö
Ü U Umlaut Ü Ü
ß scharfes S ß ß
ä a Umlaut ä ä
ö o Umlaut ö ö
ü u Umlaut ü ü
§
§ HTML-eigene Zeichen:
o wenn Text Zeichen enthält, die in HTML eine bestimmte Bedeutung haben, müssen diese maskiert werden:
Zeichen Name in HTML
< <
> >
& &
\\\" \"
2. Regeln beim Editieren von HTML
§ in neuer Datei immer erst Grundgerüst notieren
§ bei Texteingabe Maskierungsvorschriften für Umlaute, Sonderzeichen und HTML-eigene Zeichen beachten
§ Zeilenumbrüche und Leerzeilen so setzen, daß man im Quelltext Übersicht behält
§ für Zeilenumbrüche und Absatzschaltungen die im Browser wirksam sein sollen, entsprechende Befehle benutzen
§ Browser interpretieren keine Tabulatoren; auch in HTML nicht vorgesehen → für Einrückungen Style-Sheets verwenden
§ mehrere Leerzeichen hintereinander werden vom Browser ignoriert, um sie zu erzwingen oder ( geschütztes Leerzeichen) benutzen
Guter HTML-Stil!
§ Nicht für einen bestimmten Browser schreiben
o wenn Dateien im WWW plaziert werden sollen: vorher mit mehreren Browsern testen und ( wenn Möglichkeit gegeben) auf mehreren Plattformen
o wenn nur für speziellen Browser erstellt, dann Hinweis schreiben (aber im Normallfall Mittelweg finden)
§ Tags nicht zweckentfremden
o besonders logische Tags nicht dafür benutzen, um bestimmte Formatiereffekte zu erzielen
o Beispiel: Überschriften nicht dazu da, um Text groß und fett zu machen, sonder um logische Hierachien zu markieren
§ Regeln für Sonderzeichen beachten
o viele Browser stellen auch nicht vorschriftsmäßig maskierte Sonderzeichen korrekt dar; allerdings nur, weil Browser auf Zeichensatz zugreift, den der Rechner verwendet → wenn Datei auf Rechner mit anderen Zeichensatz oder nicht so toleranten Browser angezeigt werden soll, kommt es zu Wortverstümmelungen
§ Start- und End-Tags verwenden
o bei Netscape und einigen anderen Browsern reicht in vielen Fällen Start-Tag
o aber: Anzeigefehler bei anderen Browsern
o da HTML immer umfangreicher und komplexer werden wird, wird zukünftig wahrscheinlich unbedingte Einhaltung von Anfangs- und End-Tag gefordert
§ Ehrliche und aussagekräftige Verweistexte verwenden
o Verweistext sollte weder zuviel noch zu wenig versprechen
o zuviele Verweise innerhalb eines Textes stören den Lesefluß → Verweis innerhalb eines Fließtextes muß sinnvoll und Verweistext aussagekräftig sein
§ Grafiken sinnvoll einsetzen
o große Grafikdateien vermeiden
o kleine wohlplazierte Bilder, die lange Texte auflockern
o ideal: kleine Grafiken in Icon-Größe: schnell geladen, können Orientierungsfunktion übernehmen, viele Browser laden solche mehrfach verwendeten Grafiken einmal und halten sie dann im Speicher
§ Grafiken mit Größenangaben und Alternativtext versehen
o Seiten werden schneller aufgebaut, wenn zu jeder Grafik genaue Angaben zu Breite und Höhe
o entsprechend große Platzhalter, wenn Grafik nicht bzw. nicht vollständig übertragen wird → übrige Seite wird nicht in ihrer Form verändert
o Alternativtexte bei Übertragungsfehlern oder wenn Anzeige von Grafiken ausgeschaltet ist
§ Nicht für eine bestimmte Bildschirmauflösung schreiben
o weiß nicht, welche Bildschirmauflösung Besucher der Seite hat
o weiß nicht, ob Anwender Browser im Vollbildmodus laufen läßt
o eher prozentuale Breiten- und Höhenangaben
§ Nicht ständig Schriftfarbe und -größe ändern
§ Darauf achten, daß sich Schrift vom Hintergrund abhebt
|
