[edit] [comment] [remove] |2007-03-28| e1 # Ziele der Lehrveranstaltung

  • Kenntnis der Grundbegriffe der Webtechnologien.
  • Fähigkeit des eigenständigen Vertiefens dieser Kenntnisse.
  • Praktische Erfahrung im Umgang mit Webstandardformaten und Programmiersprachen.
  • Fähigkeit zur nutzbringenden Anwendung des Gelernten im weiteren Studienverlauf.
 

[edit] [comment] [remove] |2007-03-28| e2 # Organisatorisches

  • Fragen in der Vorlesung sind erwünscht.
  • Übungen zur Vertiefung des Gelernten auf Papier oder am Rechner.
  • Vorlesungsunterlagen finden Sie im Web unter http://www.goessner.net/learn/web .
  • Klausurprüfung schriftlich ohne Rechner.
  • Sprechstunden im Raum B204. Termine laut Aushang oder nach Vereinbarung.
 

[edit] [comment] [remove] |2007-03-28| e3 # Literatur / Software

Web

Software

  • Standards-konformer Webbrowser (IE6, Mozilla, Opera, …)
  • Texteditor (EditPlus)
    • Username: stefan goessner
    • Regcode: 74D1F-84A70-B0017-B835A-F527B
  • alternativer Texteditor Notepad++
 

[edit] [comment] [remove] |2007-03-28| e4 # Gliederung

  1. Einführung
  2. HTML
  3. HTML + CSS
  4. HTML-Formulare
  5. XML
  6. Webprogrammierung
  7. Dokument Objektmodell (DOM)
  8. Webgraphik und Animation
  9. SVG
  10. SVG + DOM
  11. SVG + SMIL
 

[edit] [comment] [remove] |2007-03-28| e5 # Web-Technologien - Definition

Als Web-Technologien bezeichnen wir die Summe aller Technologien, mittels derer das World Wide Web betrieben wird.

 

[edit] [comment] [remove] |2007-03-28| e6 # Entstehung des Web

  • Tim Berners-Lee Tim Berners-Lee entwickelte am europäischen Kernforschungslabor CERN in Genf einen ersten Webbrowser und Webserver als experimentelles System. Heute ist er Direktor des World Wide Web Consortiums.
    1990 formulierte er schliesslich die drei Säulen des WWW:
    • HTTP
    • URI
    • HTML
  • Marc Andreessen Marc Andreessen programmierte als Student 1993 den ersten Webbrowser Mosaic, der außer Text auch Grafiken anzeigen konnte, ohne jene extra laden zu müssen. Seine spätere Fa. Netscape erreichte dann mit dem Navigator einen Marktanteil von 90%.
  • W3C Das World Wide Web Consortium (W3C) wurde 1994 von Tim Berners-Lee gegründet. Dieser Zusammenschluss interessierter Firmen, Personen und Hochschulen erarbeitet freie offene Webstandards.
 

[edit] [comment] [remove] |2007-03-28| e7 # Funktionsweise des Web

  • TCP/IP-Protokoll
  • IP-Adressen
  • DNS – Domain Name Service
  • Selbstorganisation des Internet
  • Client/Server-Technologie
 

[edit] [comment] [remove] |2007-03-28| e8 # TCP/IP - Protokoll

Mit diesem Übertragungsprotokoll für Daten im Netz werden

  • beim Absender Teildatenpakete gebildet und mit Adresse und Sequenznummern versehen
  • beim Empfänger alle Datenpakete in ihrer ursprünglichen Reihenfolge wieder zusammengesetzt.
  • E-Mails, Webseiten und Dateien verschickt.
TCP/IP-Schicht Protokolle (Auswahl)
Anwendung HTTP, FTP, SMTP, POP3, Telnet, SSH
Transport TCP
Netz IP
Netzzugang Ethernet, WLAN

Mittlerweile unterstützen alle Betriebssysteme das TCP/IP-Protokoll.

 

[edit] [comment] [remove] |2007-03-28| e9 # IP-Adressen

  • Jeder Rechner, der – wenn auch nur momentan – Bestandteil des Internet ist, muss eine weltweit eindeutige IP-Adresse besitzen.
  • IP-Adressen werden als vier — durch Punkte getrennte — Bytes in Dezimaldarstellung notiert.
    (Beispiel: 193.16.112.83)
  • Netzbetreiber oder ISP's können bei einer Einwahl eines Netzbenutzers diesem eine dynamische IP-Adresse zuweisen.
  • Da der Adressraum eng geworden ist, hat man ihn von 32 Bit (IPv4) auf 128 Bit (IPv6) erweitert.
 

[edit] [comment] [remove] |2007-03-28| e10 # Domain Name System

  • Wir Menschen können mit IP-Adressen aus Dezimalzahlen nicht besonders gut umgehen.
  • Also wird jeder IP-Adresse eine Namenadresse (Domain Name) zugeordnet. Beispiel: www.fh-dortmund.de.
  • Zu einer Namens- oder IP-Adresse kann über einen Dienst Information abgerufen werden.
  • DNS ist eine verteilte Datenbank, die den Namensraum im Internet verwaltet.
  • Die hierarchische Struktur der Namensadressen wird über einzelne durch Punkte getrennte Namensteile abgebildet.
    • de — Top-Level-Domain
    • fh-dortmund.de — Domain
    • www.fh-dortmund.de — Sub-Level-Domain
  • Die Domainvergabe wird zentral über NIC bzw. über organisations- oder länderspezifische Verwaltungsorgane gesteuert (NIC).
 

[edit] [comment] [remove] |2007-03-28| e11 # Selbstorganisation des Internet

  • Das Internet — und das Web — ist anarchisch (herrschaftsfrei, führerlos).
  • Ein Funktionieren basiert auf der grosszügigen Bereitschaft aller Teilnehmer, Informationen kostenlos bereitzustellen und weiterzuleiten. Anfallende Kosten tragen die Netzbetreiber selbst.
  • Die wenigen notwendigen Steuerungsfunktionen übernehmen internationale oder nationale Organisationen.
ICANN
Oberste Organisation für die technische Regulierung des Internets (z.B. neue Top-Level-Domains)
IETF
Organisation zur Erarbeitung technischer Standards
W3C
Organisation zur Erarbeitung von Webstandards.
 

[edit] [comment] [remove] |2007-03-28| e12 # Was ist das Web ?

Client/Server Architektur

  • Ein Hypertext-System von Tim Berners-Lee (CERN in Genf, Schweiz) wird 1989 zum World Wide Web.
  • Durch das weltweite Verlinken von Hypertext-Dokumenten entsteht ein Netz von sog. Webseiten.
  • Mittels eines Webclient werden Daten von einem Webserver geholt.
  • Das Web stellt nur einen von vielen Internet–Diensten dar.
 

[edit] [comment] [remove] |2007-03-28| e13 # Wie funktioniert das Web ... technisch ?

ClientServer01.png

  • URI's als Adressen im Web
  • HTTP als Übertragungsprotokoll
  • HTML als Dokumentformat.
 

[edit] [comment] [remove] |2007-03-28| e14 # Wie funktioniert das Web - organisatorisch ?

World Wide Web Consortium

  1. Das World Wide Web Consortium (W3C) als Zusammenschluss interessierter Firmen, Hochschulen und Forschungseinrichtungen erarbeitet und verbessert sog. Empfehlungen (recommendations), die allgemein als Webstandards bezeichnet werden.
  2. Die Browserhersteller und Zulieferer – Softwarefirmen, die auch im W3C vertreten sind – implementieren die verabschiedeten Webstandards in ihren Produkten.
  3. Webdokumente werden von allen standardkonformen Programmen korrekt verarbeitet.
 

[edit] [comment] [remove] |2007-03-28| e15 # HTTP - Hypertext Transport Protocol

  • 1989 von Tim Berners-Lee am Cern definiert und erstmalig implementiert.
  • bildet zusammen mit URL und HTML die 3 Säulen des World Wide Web.
  • HTTP erlaubt eine bidirektionale Kommunikation in der Form:
    1. Anfrage (Request) seitens des Web-Clients an den Web-Server
    2. Antwort (Response) vom Web-Server zurück an den Web-Client.
  • HTTP stellt verschieden Request-Methoden bereit:
    • GET — Inhalte von Server anfordern (Webseite).
    • POST — Daten an den Server senden (Formulare).
    • PUT — Daten/Datei auf den Server "hochladen".
    • DELETE — Daten/Datei vom Server löschen.
    • HEAD — wie GET, jedoch nur Header–Daten ohne Inhalte anfordern.
  • HTTP ist ein zustandsloses Protokoll.
  • HTTP in action
 

[edit] [comment] [remove] |2007-03-28| e16 # URI - Uniform Resource Identifier

  • Ein URI ist eine Zeichenfolge zur Identifizierung einer Resource im Internet.
  • Damit werden Webseiten, Dateien, E-Mail Adressen und Webservices angesprochen.
  • Eine Untermenge der URI's bilden die URL's.
  • URI's als Verweise innerhalb von Webseiten auf jeweils andere bezeichnen wir auch als Hyperlinks.

Syntax:

Schema://Benutzer:Passwort@Server:Port/Pfad?Anfrage#Fragment
 

[edit] [comment] [remove] |2007-03-28| e17 # Webstandards - Dokumentformate

Von einem standardisierten Dokumentformat sprechen wir, wenn …

  • die Dokumentstruktur festgelegten Regeln unterliegt.
  • eine gewisse Verbreitung vorliegt.

ein Standard ist offen, wenn …

  • die Dokumentstruktur vollständig offengelegt ist.
  • die Festlegung der Dokumentstruktur durch mehrere Personen und/oder Firmen erfolgt.
  • eine Erweiterung der Dokumentstruktur möglich/erlaubt ist.
  • die Verarbeitung eines Dokuments nicht an ein einzelnes Programm gebunden ist.

… ansonsten nennen wir den Standard proprietär.

 

[edit] [comment] [remove] |2007-03-28| e18 # Webstandards - W3C

Das W3C ist …

  • das World Wide Web Consortium (W3C).
  • 1994 gegründet und bis heute geleitet von Tim Berners-Lee.
  • ein Gremium zur Standardisierung von Web-Technologien — insbesondere Datenformaten
  • ein Konsortium aus unterschiedlichen Mitgliedern (Industrie, Hochschulen, Forschungseinrichtungen, unabhängige Experten).
  • selbstverpflichtet, nur Standards frei von Lizenzgebühren zu entwickeln.
  • keine zwischenstaatlich anerkannte Organisation wie bspw. die ISO.
  • daher nicht berechtigt, Standards festzulegen und bezeichnet ihre Arbeiten als Recommendations (Empfehlungen).
  • dem Entwicklungsprozess verbunden: Working Draft -> Last Call -> Candidate Recommendation -> Proposed Recommendation -> Recommendation
  • zunehmend in der Kritik …
    • … weil der Standardisierungsprozess zu lange dauert.
    • … wegen angeblicher Überbewertung von Mitgliederinteressen.
    • … wegen Nichtberücksichtigung aktueller De-Facto-Standards.
  • arbeitet deshalb mittlerweile mit einem Interessensverbund von Browserherstellern zusammen — WHAT
 

[edit] [comment] [remove] |2007-03-28| e19 # Webstandards - im Fokus

  • Hypertext Markup Language (HTML)
  • Extensible Markup Language (XML)
  • Extensible Hypertext Markup Language (XHTML)
  • Cascading Style Sheets (CSS)
  • Portable Network Graphics (PNG)
  • Scalable Vector Graphics (SVG)
  • Synchronized Multimedia Integration Language (SMIL)
  • Mathematical Markup Language (MathML)
  • Resource Description Framework (RDF)
  • Document Object Model (DOM)
  • Web Accessibility Initiative (WAI)
  • XML Path Language (XPath)
 

[edit] [comment] [remove] |2007-03-28| e20 # XML-basierte Webstandards

XML Familie

 

[edit] [comment] [remove] |2007-03-28| e21 # Wie funktioniert das Web ... real ?

Webstandards und die Browser

  1. Das W3C erarbeitet Webstandards, die von Vielen als zu komplex und überladen angesehen werden.
  2. Browserhersteller verzögern oder verweigern die Implementierung von Webstandards oder deren neuer Versionen.
  3. Verbreitete Dokument-Editoren halten sich nicht (konsequent) an aktuelle Webstandards.
 

[edit] [comment] [remove] |2007-03-28| e22 # Was ist Web 2.0

… kommentiert vom Erfinder des World Wide Web

Tim Berners-Lee

Web 2.0 is a useless jargon nobody can explain and a set of technology that tries to achieve exactly the same thing as "Web 1.0".

Tim Berners-Lee

 

[edit] [comment] [remove] |2007-03-28| e23 # Konventionelle Webanwendung - Web 1.0

Konventionelle Webanwendung

  • Serverseitig
    • Bereitstellung und Auslieferung statischer Webseiten an den anfragenden Browser.
    • Generierung dynamischer Webseiten aus Datenbankeinträgen (DB-Server).
    • Prüfen der Plausibilität von Formulareingaben.
    • Ausführen von Hintergrundanwendungen (Application Server).
  • Clientseitig
    • Darstellung statischer Webseiten.
    • Anforderung neuer vollständiger Webseiten via Links.
    • Übertragung von Formulardaten an den Webserver.
 

[edit] [comment] [remove] |2007-03-28| e24 # Aktuelle Webanwendung - Web 2.0

Aktuelle Webanwendung

  • Serverseitig
    • Auslieferung beliebiger (Teil-)Daten auf Anfrage des Browsers.
    • Durchführung von Datenbankanfragen (SQL).
    • Überprüfen der Sicherheit eingehender Daten.
    • Überprüfen der Vertraulichkeit ausgehender Daten (Authentifikation).
    • Ausführung von Hintergrundanwendungen.
  • Clientseitig
    • Dynamische Aktualisierung von Teilbereichen der Webseite.
    • Anforderung beliebiger Daten (XML, JSON) mittels asynchroner HTTP-Anfrage.
    • Prüfen der Plausibilität und Konsistenz von Formulardaten während der Eingabe.
    • Anwendungsprogramme (Javascript) in Verbindung mit HTTP und XML/JSON (Ajax).
 

[edit] [comment] [remove] |2007-03-28| e25 # Web 2.0 - Beispiel

Google Suggest

Einfaches und prominentes Beispiel einer aktuellen Webanwendung

Bei jedem Tastendruck wird eine Anfrage an Google's Webserver geschickt und von dort eine gewisse Anzahl Suchergebnisse geliefert.

 

[edit] [comment] [remove] |2007-03-28| e26 # Was ist denn nun Web 2.0 ?

Was ist Web 2.0 ?

Web 2.0 ist …

  • ein Marketing-Schlagwort.
  • eine Kennzeichnung für neue Webanwendungen nahezu vergleichbar mit Desktop-Anwendungen.
    • Web-Office
    • Kartographie
    • Online Storages
    • Widgets & Gadgets
  • die gezielte Vernetzung der Webnutzer (social software).
    • Weblogs
    • Wikis
    • Gemeinschaftliches Indexieren (social tagging).
    • Webforen und Kontaktbörsen.
  • RIA's – Hybride aus Desktop– und Webanwendungen
 

[edit] [comment] [remove] |2007-03-28| e27 # Webanwendung vs. Desktop-Anwendung

  • Vorteile einer Webanwendung
    • Keine Softwareinstallation (Browser bereits vorhanden)
    • Jederzeit aktuelle Daten (redundanzfreie Datenhaltung)
    • Zugriff von überall auf der Welt (Internetzugang vorausgesetzt)
    • Entfernte Zusammenarbeit an gemeinsamen Dokumenten.
    • Plattformunabhängigkeit (Browser laufen unter allen Betriebsystemen)
  • Vorteile einer Desktop-Anwendung
    • Kein Internetzugang notwendig.
    • Von der Verfügbarkeit eines Webservers unabhängig.
    • Keine Übertragung sensibler Daten.
    • Höhere Sicherheit beim Speichern personenbezogener Daten.
    • Browserunabhängigkeit.
 

[edit] [comment] [remove] |2007-03-28| e28 # Beispiele -moderne Webanwendungen

 

[edit] [comment] [remove] |2007-03-28| e29 # Weblogs

Weblogs oder Blogs …

  • sind Online-Tagebücher mit periodischen Einträgen.
  • dienen dem Austausch von Informationen und Erfahrungen sowie der Kommunikation.
  • sind meist thematisch mehr oder weniger scharf begrenzt.
  • in ihrer Gesamtheit bilden die sog. Blogosphäre.
  • sind einfache CMS zum Hinzufügen von chronologisch sortierten Einträgen.
  • besitzen die charakteristischen Merkmale
  • werden mittlerweile auch von Unternehmen zur Bildung von Communities eingesetzt (Corporate Blogs).
    • Kommentarfunktion.
    • Permalinks der Einträge.
    • Feed als Mittel des Abonnements von Weblogs (RSS, ATOM).
  • sind hier zu sehen.
 

[edit] [comment] [remove] |2007-03-28| e30 # Wikis

Wikis …

  • entstanden auf der Suche nach einem Wissensmanagement-Tool (Ward Cunningham, 1995).
  • können inhaltlich sofort von Jedem bearbeitet werden.
  • basieren auf reinem Ascii-Text – im Gegensatz zu Wysiwyg.
  • sind bekannt durch Wikipedia, die freie Enzyklopädie.
 

[edit] [comment] [remove] |2007-03-28| e31 # Danke ...

… für die Aufmerksamkeit.