PDF-Skript

Grundlagen der WWW-Nutzung und
WWW-Programmierung
Alfred Wassermann
Inhaltsverzeichnis
4 Vorlesung
4.1 Der Einstieg in das World Wide Web
4.1.1 Suchmaschinen . . . . . . . .
4.2 Die Sprache des WWW: HTML . . .
4.2.1 SGML . . . . . . . . . . . . .
4.2.2 HTML . . . . . . . . . . . . .
4.2.3 Rückschläge . . . . . . . . . .
4.3 Tags (Auszeichnungen) in HTML . .
4.4 Das Grundgerüst einer HTML-Datei
4.5 Unsere ersten Formatierungsbefehle .
1
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
2
2
3
4
4
5
7
7
8
8
Kapitel 4
Vorlesung
Übungsblatt 03:
4.1
Der Einstieg in das World Wide Web
Meist hält die Organisation, die die Einwahl ins WWW ermöglicht, Einstiegsseiten bereit, die eine erste Orientierungsmöglichkeit im Netz für Anfänger bieten.
Diese Seiten werden Web-Portals genannt.
Typische Beispiele:
• http://www.netscape.com
• http://www.aol.com
• http://www.t-online.de
• http://www.uni-bayreuth.de
Eine weitere Einstiegsmöglichkeit bieten sogenannte Web-Kataloge, das heißt
redaktionell bearbeitete Seiten, die nach Themen geordnet sind.
Der Marktführer in dieser Hinsicht ist
• http://www.yahoo.com
Im deutschen Bereich sind (neben vielen anderen)
• http://www.yahoo.de
• http://www.dino-online.de
zu nennen.
Die Problematik bei diesen Seiten liegt in der Aktualität der Links.
2
4.1.1
Suchmaschinen
Eine Möglichkeit, Information im WWW zu finden, bieten sogenannte Suchmaschinen.
Eine sehr ausführliche Beschreibung von Suchmaschinen ist bei http://www.suchfibel.de
zu finden.
Suchmaschinen bestehen üblicherweise aus drei Komponenten:
• Der Informationssammler, auch Robot, Spider oder Crawler genannt.
Dieses Programm surft vollautomatisch durch das Internet und schickt
eine gewaltige Datenmenge an die Verwaltung“.
”
• Die Indizierungssoftware strukturiert die eingehenden Daten und füllt
damit eine Datenbank.
• Die Abfragesoftware wertet Suchanfragen aus, verknüpft logische Operatoren (das ist ein vornehmer Ausdruck für kombinierte Abfragen: z.B.
sollen alle Dateien ausgegeben werden, die die Wörter email und Bild
enthalten, aber nicht das Wort Computer), und schickt die Anfrage an den
Datenserver, um von dort aus die Ergebnisse zu präsentieren.
Häufig zu findende Eingabemöglichkeiten:
• Ein Pluszeichen (+) oder AND verknüpft zwei Wörter. Beide Begriffe
müssen im Ergebnisdokument vorkommen.
• Ein Minuszeichen (−) oder NOT schließt das nachfolgende Wort aus. Das
Ergebnis darf das Wort nicht enthalten.
• Mehrere Worte lassen sich mit Anführungszeichen zu einer Phrase verbinden.
Anmerkungen: Soll verhindert werden, daß ein Informationssammler ein Verzeichnis durchsucht, so sollte dieses Verzeichnis eine (möglicherweise leere) Datei robots.txt enthalten. Es gibt eine Konvention unter den Betreibern von
Suchmaschinen, daß Verzeichnisse, die eine Datei namens robots.txt enthalten, nicht durchsucht werden. Genausowenig können normalerweise Word- oder
PDF-Dateien katalogisiert werdn.
Zu beachten ist bei der Verwendung von Suchmaschinen jedoch, daß ein Großteil
der vorhandenen Information nicht von Suchmaschinen automatisch katalogisiert werden kann. Beispiele hierfür sind Bilder, Töne, Filme und Information
aus Datenbanken.
Ein weiteres Problem ist, daß neue Information erst mit einiger Verzögerung
von den Suchmaschinen erfaßt wird.
Weitere Suchmöglichkeiten:
• Nachdem die Zahl der Suchmaschinen ständig wächst, bieten sogenannte
Meta-Suchmaschinen ihre Dienste an: Sie leiten die Anfrage des Benutzers an mehrere Suchmaschinen weiter und zeigen deren Ergebnisse
an.
• Spezialsuchmaschinen:
– Aktuelle Nachrichten (Paperboy, Paperball), http://www.paperazzi.de
http://www.paperball.de
3
– Jobbörsen,
– Email-Suchmaschinen. http://mesa.rrzn.uni-hannover.de/
4.2
Die Sprache des WWW: HTML
Im Jahr 1989/90 schlägt Tim Berners-Lee in
Information Management: A Proposal“
”
eine Hypertext-Sprache vor: HTML oder
Hypertext-Markup-Language.
HTML basiert auf einer bereits existierenden Sprache SGML:
Standard Generalized Markup Language,
standardisiert durch ISO-Norm 8879.
Markup Language oder auch Auszeichnungssprache bedeutet: die logischen Bestandteile eines Dokumentes wie Überschriften, Kapitel, Aufzählungen sind im
Dokument durch spezielle Befehle markiert.
Im Gegensatz dazu stehen WYSIWYG-Systeme ( What you see is what you
”
get“): Der Autor rückt am Bildschirm das Dokument zurecht. Die Druckausgabe
entspricht genau dem Entwurf am Bildschirm. Beispielhafte Vertreter dieser Art
von Dokumenten sind PDF, PostScript, MS-Word.
4.2.1
SGML
Die Auszeichnungssprache SGML, ursprünglich nur GML, entstand 1969/70
im Rahmen eines Projektes bei IBM. Geplant war die Automatisierung von
Abläufen in Anwaltskanzleien. Der Zugriff auf und die Weiterverarbeitbarkeit
von
• Gesetzestexten,
• Urteilen,
• Kommentaren,
• Laufender Korrespondenz
soll ermöglicht werden.
Der Name GML wurde wegen der 3 Projektmitglieder
C. Goldfarb — E. Mosher — R. Lorie
gewählt.
SGML wird bei der Verwaltung von sehr großen Dokumenten verwendet, insbesondere:
• Herstellerangaben zur Flugzeugwartung (Boeing)
• Telekommunikationsfirmen
• Halbleiterhersteller.
4
4.2.2
HTML
Berners-Lee verwendete für HTML eine kleine Untermenge von SGML. Der
zukünftige WWW-Standard XML ist ebenfalls eine Untermenge von SGML.
HTML geht von einer hierarchischen Gliederung aus, beschreibt die Struktur
eines Dokumentes.
• Es werden globale Dokumenteigenschaften festgelegt, wie Titel, Hintergrundfarbe, . . .
• Der Inhalt wird in Elemente aufgeteilt: z.B. Überschrift 1. Ordnung, Überschrift 2. Ordnung, Absatz, hervorgehobene Textstellen, Aufzählung: Punkt
1, Punkt 2, . . .
Der Text enthält Auszeichnungen“, die den Beginn eines Text-Elementes und
”
das Ende eines Elementes anzeigen.
Diese Auszeichnungen“ sind im Text sichtbar enthalten: HTML ist ein soge”
nanntes Klartext-Format.
5
6
Dies hat zur Folge, daß HTML-Dateien mit jedem beliebigen Editor erstellt werden können. Der Autor ist nicht an ein kommerzielles Software-Paket gebunden.
Die Klartext-Befehle von HTML sind für Maschine und Mensch gedacht. Mittlerweile gibt es eine nahezu unüberschaubare Vielfalt von HTML-Editoren, die
auch Anfängern das Erzeugen von HTML-Dateien ermöglichen.
Die Klartext-Befehle haben einen weiteren Vorteil: Es ist nicht schwer, Programme zu schreiben, die HTML-Text erzeugen. Dies erleichtert das Generieren von
HTML-Seiten aufgrund einer Benutzeranfrage.
4.2.3
Rückschläge
Natürlich wurde HTML seit der Einführung durch Tim Berners-Lee weiterentwickelt. Der kommerzielle Druck veranlaßte die beiden großen Hersteller von
Browsern
• Microsoft
• Netscape
eigene Sprachelemente zu HTML hinzuzufügen.
Diese Browser-spezifischen Auszeichnungen sind nicht immer kompatibel. Es
existiert eine Kommission beim W3-Consortium http://www.w3.org die einen
HTML-Standard definiert. Leider halten sich die Hersteller der Browser nicht
immer daran.
Der momentan aktuelle Standard ist HTML 4.0.
Da dieser Standard jedoch nur sehr unzureichend implementiert ist, werden wir
uns in etwa an HTML 3, 3.1 orientieren.
4.3
Tags (Auszeichnungen) in HTML
Die HTML-Datei:
• HTML-Dateien bestehen aus ASCII-Text
• Der Dateiname sollte die Endung .html oder .htm haben.
• HTML-Tags (Auszeichnungen) werden durch < und > eingeklammert.
Das heißt, alle Zeichen, die zwischen < und dem nächsten > stehen, werden
vom Browser als HTML-Befehl interpretiert.
• Browser sind im allgemeinen recht gutmütig“: Wird ein HTML-Befehl
”
nicht erkannt, oder steht er an der falschen Stelle, wird er vom Browser
möglichst ignoriert.
• Fast alle HTML-Befehle bestehen aus 2 Tags: einem einleitenden und einem abschließenden Tag.
• Der abschließende Tag sieht genauso aus wie der einleitende Tag, es wird
lediglich ein / hinzugefügt.
Ein Beispiel:
Dieses Wort wird <b>fett</b> geschrieben. Der gesamte Text, der zwischen <b> und </b> enthalten ist, wird fettgedruckt wiedergegeben.
7
Wir probieren es gleich aus:
Kurzübung
• Klein-/Großschreibung wird bei Tags nicht unterschieden. In Hinblick auf
zukünftige Entwicklungen ist aber Kleinschreibung zu empfehlen.
• Tags können ineinander verschachtelt werden: <i><b>Text...</b></i>.
Ausprobieren:
Kurzübung
• Tags können zusätzliche Angaben, sogenannte Attribute enthalten:
<p align=center>...</p>.
Streng genommen, sollte man <p align="center">...</p> schreiben,
dabei dürfen keine Leerzeichen vor und nach dem =-Zeichen stehen.
Kurzübung
• Die Browser ignorieren sogenannten whitespace“, d.h. mehrere aufein”
anderfolgende Leerzeichen, Zeilenumbrüche, Tabulatoren werden als ein
Leerzeichen interpretiert. Insbesondere Zeilenumbrüche werden vom Browser in Abhängigkeit von der Fensterbreite selbst eingefügt.
Kurzübung
4.4
Das Grundgerüst einer HTML-Datei
Eine sauber geschriebene HTML-Datei sollte aus folgendem Grundgerüst bestehen:
<html>
<head>
<title>...</title>
...
</head>
<body>
...
</body>
</html>
Der header, d.h. der Bereich von <head> bis </head>, enthält allgemeine Information zur Datei, z.B. den Titel, aber auch Schlüsselwörter, die speziell für
die Suchmaschinen gedacht sind.
Der body, d.h. der Bereich von <body> bis </body> enthält den eigentlichen
(sichtbaren) Text.
Markieren Sie einige Worte als fettgedruckt im folgenden Grundgerüst:
Kurzübung
4.5
Unsere ersten Formatierungsbefehle
Wir wollen mit einigen Tags zur physischen Schriftauszeichnung beginnen:
• <b>: fettgedruckt
8
• <i>: kursiv
• <u>: unterstrichen
• <tt>: nichtproportional – Schreibmaschinenschrift
• <blink>: Raten Sie selbst.
Bitte sofort ausprobieren: Markieren Sie die Wörter mit den richtigen HTMLBefehlen.
Kurzübung
Befehle zur logischen Schriftauszeichnung:
• <em>: betonter“ Text
”
• <strong>: stark betonter“ Text
”
• <code>: wird als Quellcode“ interpretiert
”
• <cite>: Zitat
• <blockquote>: Zitat in eigenem Abschnitt
• <address>: Formatierung von email-Adressen (etwas veraltet)
In der Übung sehen Sie, daß das Ergebnis nicht unbedingt zu erwarten ist:
Kurzübung
Es werden 6 Überschriften unterschieden:
• <h1>...</h1>, <h2>...</h2>, . . . , <h6>...</h6>.
Kurzübung
Absätze werden durch <p> eingefügt, der End-Tag </p> ist dabei nicht zwingend
notwendig.
Zeilenumbrüche können mit <br> vom Autor erzwungen werden. Hier ist ein
End-Tag ebensowenig nötig wie bei einer horizontalen Linie: <hr>.
Kurzübung
9
Literaturverzeichnis
[1] Born, Günter: Referenzhandbuch Dateiformate, Addison-Wesley (1996).
[2] Bruns, B., Gajewski, P.: Multimediales Lernen im Netz, Springer-Verlag
(1999).
[3] Bush, Vannevar: As we may think, in The Atlantic Monthly, July 1945,
siehe http://www.w3.org/History/1945/vbush/
[4] Haaß, Wolf-Dieter: Handbuch der Kommunikationsnetze, Springer-Verlag
(1997).
[5] Hauben,
Michael:
History
of
ARPANET,
http://www.dei.isep.ipp.pt/docs/arpa-Contents.html
siehe
[6] Klau, Peter: Das Internet, Thomson Publishing (1995).
[7] Krol, Ed: Die Welt des Internet, O’Reilly-Verlag (1995).
[8] Levine, John, Young, Margaret: More Internet für Dummies, Thomson Publishing (1996).
[9] Stefan
Münz:
SELFHTML,
http://www.teamone.de/selfhtml
erhältlich
bei
[10] Rost, Martin, Schack, Michael (Hrsg.): Der Internet Praktiker (1995),
Heise-Verlag.
[11] Schulmeister, Rolf: Grundlagen hypermedialer Lernsysteme, AddisonWesley (1996).
10