Lernziele. World!Wide!Web!-!WWW. Eigenschaften. Das!World!Wide!Web

Transkript

1 Lernziele! Sie!können!je!mindestens!2!Aufgaben!des!WWW-Servers!und des!www-clients!aufzählen. World!Wide!Web!-!WWW! Sie!können!die!Hauptkomponenten,!die!für!das!World!Wide Web!benötigt!werden!benennen.! Sie!können!den!prinzipiellen!Aufbau!eines!Uniform! Locator!aufzeigen!und!die!einzelnen!Elemente!erklären.! Sie!können!3!Merkmale!von!Hypertext!aufzählen.! Sie!können!den!Unterschied!zwischen!Hypertext!und Hypermedia!erläutern.! Sie!können!mindestens!3!Merkmale!von!HTML!aufzählen. 2 Das!World!Wide!Web Eigenschaften! Weltweit!verteilte!Dokumente,!die!über!Links!vernetzt!werden! weltweit!verteiltes!informationssystem! attraktive,!flexible!und!erweiterbare!benutzerschnittstelle! einfache!bedienung!(mit!mausklicks)!! mit!texten,!graphik!und!multimedia-dokumenten!(ton,!bild,!videoclips)! plattformunabhängig! verschiedene!rechner-!und!betriebssysteme! einheitliches!aussehen! Basis!für!viele!neue!Dienste!(WebDAV,!Jabber,!RSS,!...)! wesentlicher!beitrag!zur!internet-verbreitung,!-popularität!und -Kommerzialisierung! wird!oft!mit!dem! Internet!gleichgesetzt Grafische Darstellung eines kleinen Ausschnitts des WWW (Wikipedia) 3 4

2 Funktionsweise Hauptkomponenten! Client!(Browser)!!Server!(WWW-Server)!Prinzip! Client!baut!Verbindung!zum!Server!auf!und!verlangt!ein!Dokument!(z.B.!HTML-Datei).! Server!stellt!das!Dokument!zusammen!(z.B.!lädt!Datei!von!Festplatte),!schickt!es!als Antwort!zurück!an!den!Client!und!unterbricht!die!Verbindung.! Client!präsentiert!das!Dokument!dem!Benutzer! Benutzer!startet!nächste!Anfrage!mit!Auswahl!(Mausklick)!eines!Hyperlinks. Server HTML-Dokument Client (Browser) graphische Präsentation! Uniform!Resource!Locator!(URL)!oder!"how!to!name!a!document! HyperText!Transfer!Protocol!(HTTP) oder!"how!to!get!a!document" URL Internet! HyperText!Markup!Language!(HTML) oder!"the!document!format!for!hypertext" 6 Uniform!!Locator!(URL)! Eindeutige!Identifikation!einer!!im!Informationsraum!(nicht!nur!WWW) Protokoll://Rechneradresse:Port/Dateipfad Protokoll Definiert!mit!welchem!Internetprotokoll!auf!den!Server!zugegriffen!werden!soll http! unverschlüsselte!verbindung!mit!dem!http-protokoll https! verschlüsselte!(secure)!verbindung!mit!dem!http-protokoll Diverse!Clients!unterstützen!auch!andere!Dienste!(nicht!WWW): ftp Zugriff!auf!FTP-Server!(z.B.!ftp://kermit.zhwin.ch) mailtomailprogramm!öffnen!(z.b.!mailto://mustepet@zhwin.ch) file Zugriff!auf!lokale!Datei!(z.B.!file://c /data/www/index.html) Rechneradresse Adresse!des!Rechners,!der!für!die!Bereitstellung!der!Information!zuständig!ist. DNS-Name!(z.B.! Port Dateipfad Dienstnummer!auf!welcher!der!Webserver!auf!Anfragen!wartet.!Optional,!wenn Standard!(well!known)!Ports!verwendet!werden!(80!=!http,!443!=!https) Pfad!unter!welchem!die!Information!auf!dem!Server!zu!finden!ist.!Wenn!kein Dateiname!angegeben!ist!wird!eine!Standard-Datei!verwendet!(meist!index.html) 7 Hypertext!Transfer!Protokoll!(HTTP)! Internet-Protokoll!zur!Übertragung!von!Dokumenten!(HTML,!PDF,!...)! Meist!zwischen!Web-Browser!und!Web-Server! Textbasiert:!nur!5!Kommandos GET/POST Anfordern!einer! PUT Senden!einer! HEAD Nur!Informationen!über!!anfordern 8

3 Hypertext!Markup!Language!(HTML)! Textbasierte!Auszeichnungssprache!(Markup!Language)! Darstellung!von!Text,!Bildern,!Mulitmediaobjekten!und!Hyperlinks! Definiert!die!Struktur!und!Inhalt!des!Dokumentes! In!frühen!Versionen!auch!das!Aussehen!!neu!mittels!Cascading!Stylesheets!(CSS)! Mit!normalem!Texteditor!editierbar! Genormt!und!weiterentwickelt!durch!das!World!Wide!Web Consortium!(W3C)!!! Weiterentwickelt!über!verschiedene!Versionen!1.o!!4.01! Nachfolge!durch!XHTML!1.0/1.1!(basiert!auf!XML)! Dynamische!Webseiten! Erstellt!durch!Programme!(PHP,!Java,!Perl,!ASP,!...)!anhand Benutzerangaben,!Datenbanken,!... Hypertext! keine!sequentielle!präsentationsreihenfolge! Dokument!als!Menge!verlinkter!n! Format!der!n!(HTML)! Format!der!Links!(URL)! Erste!Systeme!waren!rein!textbasiert! zunehmende!bedeutung!des!betrachters! keine!eindeutige!reihenfolge!vorgegeben! aktive!navigation!statt!passiver!präsentation! Wenn!auch!Multimedia-Dokumente!(nicht!rein!textbasiert: Film,!Animation,!Audio)!eingesetzt!werden,!spricht!man auch!von!hypermedia 9 10 Sequentielles!Medium Hypertext!-!Datei Beispiel: Apple Hypercard Betrachter A Betrachter B Betrachter C 11 Dokument = Datei 12

4 Hypertext!-!Rechner Hypertext!-!Global Beispiel: Adobe Acrobat, FrameMaker Datei A Beispiel: WWW Rechner A Datei B Datei C Rechner 13 Rechner B Rechner C Globales Hypertext- Dokument 14 Dokumentenvernetzung!-!WWW Anforderungen!an!n! Jedes!Dokument!()!hat!weltweit!eindeutige!Adresse!(URL)!und kann!direkt!oder!indirekt!(via!kette!von!verweisen)!angesprochen!werden.! Dokumente!können!von!unterschiedlichem!Typ!sein!(nicht!nur!HTML).! Jede!HTML-Seite!kann!Verweise!auf!mehrere!andere!n!beinhalten Startdokument (durch URL im WWW-Client 1 angesprochen) Internet Graphik-Datei (z.b. *.jpeg, *.gif) Startdokument (durch URL im WWW-Client 2 direkt angesprochen) Verweis (Link) auf weiteres Dokument! n!inhalt! allgemein!verständliches!format!(z.b.!html)! Einbettung!von!Referenzen!auf!n!(z.B.!Links)! Unterstützung!für!verschiedene!Typen!von!n!(Multimedia)! n!identifikation! Eindeutige!Kennzeichnung!(z.B.!URL)! Auffindbarkeit!in!global!verteilter!Umgebung!(z.B.!URL)! n!zugriff! Zugriff!mit!allgemein!unterstütztem!Verfahren!(z.B.!HTTP)! einfache!methode!(überall!implementiert)! Tragfähige!Infrastruktur! Genügend!Netzbandbreite! Genügend!Rechenleistung!auf!dem!Server!/!Redundanz 16

5 HTML!!Das!WWW!Hypertextformat HTML!als!Hypertext!! Hypertext-Dokumentformat,!das!im!WWW!eingesetzt!wird! Wird!in!Dateien!gespeichert!oder!mittels!Programmen!generiert! Enthält!<tags>,!welche!einerseits!Strukturanweisungen, Formatanweisungen!oder!Verweise!auf!andere!n!(Links) enthalten.! n!können!dokumente!jeglicher!art!sein:! Andere!HTML!Dokumente! Grafiken!und!Bilder!(gif,!jpeg,!png)! Video!und!Sounddateien! Über!Links!können!auch!andere!Programme!aufgerufen!werden!(Telnet, FTP,!Mail,! ).! Kann!auch!Formulare!enthalten,!welche!Benutzereingaben!erwarten!und diese!zur!bearbeitung!an!den!server!schicken. 17 WWW-Browser-Präsentation HTML-Text (normale Textdatei mit Formatanweisungen (<tags>) und Hyperlinks) <html> <head> <title>switch Welcome Page</title> </head> <body> <p><a href="/cgi-bin/imagemap/switchlogo.map"> <img src="misc/switchheader.gif" border= 1 width= 480 height= 130 ismap= ismap alt="swiss Academic & Research Network"></a> </p> <p>about <a href="switch/about.html">switch</a>, its <a href="switch/thirdparty.html">www Rent-A-Page Customers</a> and this <a href="misc/intro.html">www Service</a>.</p> <p><strong>hot Topic</strong>: <a href="switch/docs/ttl_info.html"> Internet Connectivity Problems</a> caused by low TTL (Time To Live) values. </p><p> <a href="switch/services.html"><img src="switch/services.gif" border=1 alt="services offered by SWITCH..."></a> 18 WWW-Browser...WWW-Browser:!!Caching! Graphical!WEB-Client! beherrscht!http-!und!z.t.!auch!andere!protokolle!(ftp)! holt!die!angegebene!web-seite!und!alle!ihre!bestandteile (eingebettete!bild-!und!multimedia-dateien!usw.)! Kann!direkt!HTML-Text!und!Bilder!(gif,!jpeg,!png)!!darstellen.! andere!eingebettete!multimediale!inhalte! Ausgabe!mittels!Browser-Pluggins!oder!Active-X-Komponenten!(Windows)! Hypertext-Links!auf!!html-Dateien:!werden!geladen!und!dargestellt! andere!dateitypen!(z.b.!pdf,!doc,!video,!ton):!!ausgabe!(rendering)!mit!helper-applikationen!oder!pluggins!!steuerung!via!datei-extention!(z.b.!.zip,!.gif,!.doc)! Beispiele:!Mozilla,!Firefox,!IE,!Opera,!.! Allg.!Bezeichnung!von!WEB-Clients!in!RFCs:!User!Agent!,!warum!?!! Cache:! schneller!zwischenspeicher! Beschleunigt!Zugriff! Zwei!Arten!von!WEB-Caching! locales!cache!(speicherplatte)! Proxy! Proxy: WWW-Client 1. Antwort 1. Anfrage 2. Anfrage! Wo!liegt!der!Unterschied? Proxy- Server 2. aktuelle Antwort im Cache caching von 1. Antwort WWW-Server Überprüfung der Aktualität der Cache-Info

6 Wiki Wiki!Notation! Kurzform!von!wikiwiki!(hawaiianisch!für!schnell,!hastig)! Webanwendung!um!schnell!einfache,!verlinkte!Webseiten!zu erstellen.!(z.b.!lexikon,!glossar,!projektsupport,! )! Berühmteste!Anwendung:!Wikipedia! Interne!Verlinkung!(im!gleichen!Wiki)!über!Stichwörter! Eigener!Syntax!für!Formatierung!(keine!Tags)! Wenige!simple!Regeln!aber! eingeschränkte!darstellungsmöglichkeiten! Versionsverwaltung!für!Wikiseiten!(History)! Automatisch:!Inhaltsverzeichnis,!Index,!Navigation,!Suche! Oft!Schreibzugriff!möglich!!!Jeder!kann!mitarbeiten Wiki-Link: [[Stichwort]] Stichwort Kursiv:! kursiv kursiv Titel Fett: fett fett Fett&Kursiv: fett&kursiv fett&kursiv Titel: ==Stufe!1== Stufe!1 ===Stufe!2=== =====Stufe!4===== Stufe!2 Stufe!4 Aufzählung: *!Eins #!Eins!Eins 1.!Eins *!Zwei #!Zwei!Zwei 2.!Zwei Syntax!teilweise!abhängig!von!Wiki-Implementierung.!Beispiele!für!MediaWiki. Details!unter!!( Geschichte Anhang 1989 Tim!Berners!Lee!veröffentlicht!am!CERN!sein!Papier! Information Management:!A!Proposal!in!dem!er!das!WWW!beschreibt.!Er!entwickelt basierend!auf!dem!hypertext-prinzip!die!hypertext!markup!language (HTML),!das!Hypertext!Transport!Protokoll!(HTTP)!und!den!Unified Resource!Locator!(URL) Entwicklung!erster!Browser!(WorldWideWeb)!und!Webserver!auf!NeXT- Computer 1991 WWW!wird!am!CERN!produktiv!eingesetzt Geschichte Frühe!Zeiten!des!Web 1993 Erster!graphischer!Browser! Mosaic!(Marc!Andreessen!-!!NCSA!!National Center!for!Supercomputer!Applications!an!der!University!of!Illinois) 1994 Gründung!von!Netscape!(durch!die!Entwickler!von! Mosaic )!!kommerzieller!browser!und!server 1995 Veröffentlichung!der!Programmiersprache!Java 1995 Erstes!Implementierung!eines!Wiki!(WikiWikiWeb) 24

7 Geschichte Erste!Browser!!Mosaic!und!Netscape 1995 Microsoft!veröffentlicht!ersten!Internet!Explorer!basierend!auf!Mosaic 1996 Integration!von!Mail,!News!und!Java!(!!Netscape-Communicator!4.0) 1997 Microsoft!IE!4.0!wird!mit!Windows!98!ausgeliefert 1998 Microsoft!IE!5.0!überholt!Netscape!Communicator!4.5!in!der!Verbreitung 1998 Netscape!gibt!Browser!als!OpenSource!frei!(Mozilla-Suite,!Gecko-Engine) 1999 AOL!übernimmt!Netscape 2003 Laufende!Erweiterung!der!Funktionen!(CSS,!DOM,!XHTML,! ) IE!5.5,!IE!6.0,!Netscape!6(Mozilla!0.6),!Netscape!7(Mozilla!1.0) 2003 Aufsplittung!der!Mozilla-Suite!in!Einzelanwendungen: Firefox!(Browser) Firebird!( )!!später!in!Thunderbird!umbenannt 2004 Release!von!Firefox!1.0!und!Thunderbird! Firefox!1.0!wird!innert!10!Monaten!90!Millionen!mal!heruntergeladen Erste!Browser!-!Internet!Explorer Frühe!Webseiten 27 28