internet und webdesign (historisches dokument)
DESCRIPTION
TRANSCRIPT
Internet und Webdesign
Ein Referat von Eric Eggert
Internet-Geschichte und Webtechnologie
Technologien, die im Internet verwendet werden sowie eine kurze Einführung in die Geschichte des Internets.
Geschichte des Internets Basis: US-amerikanische
Militärtechnologie Wissenschaftliche Verwendung des
ARPA-Net zum Austausch von Forschungsergebnissen
Entwicklung des TCP/IP-Protokolls (Betriebssystem unabhängig)
Gründung des Usenet von Studenten
(1/3)
Geschichte des Internets 80er-Jahre: Einführung des Begriffs
„Internet“ In Europa: Gründung von RARE
(Réseaux Associés pour la Recherche Européenne) zur durchsetzung von „ISO-Normen“, die sich aber nicht gegen TCP/IP durchsetzen konnten.
(2/3)
Geschichte des Internets Gründung des „EuropaNET“ mit
verschiedenen nationalen Forschungsnetzen
Gründung der RIPE (Réseaux IP Européens)
(3/3)
Dienste im Internet E-Mail Telnet und SSH File Transfer (FTP) Gopher Chat (IRC) Newsgroups (Usenet) World Wide Web (WWW)
Geschichte des WWW Tim Berners-Lee entwickelt bis 1990 die
Grundzüge des World Wide Web. Erste Webseite: info.cern.ch an
Weihnachten 1990 Seine Idee: Jeder sollte Webseiten online
bearbeiten können, sofern der Autor der Webseite ein Schreibrecht vergab. Dies konnte sich aber nicht durchsetzen.
3 Säulen des WWW
WWW
Hypertext
HTTP
UR
I
HTM
L
HTTP(Hypertext Transfer Protocol)
WWW
Hypertext
HTTP
Das Hypertext Transfer Protocol ist eine Spezifikation für dieKommunikation zwischen Serverund Client (=Browser).
URI(Universal Resource Identifier)
WWW
Hypertext
UR
I
Die URI ist eine Spezifikation fürdie Addressierung beliebigerDateien im Web und im übrigenInternet.Oft wird auch der Begriff URL(=Uniform Resource Locator)benutzt.
Domain Name Service (DNS) Domains: Eindeutige Zuordnung eines
Namens zu einer IP-Adresse Beispiele:
csszengarden.com yatil.de strohhalm.org
TLD (Top-Level-Domains): .com, .net, .org, .edu .de, .at, .ch .info, .biz
HTML(HyperText Markup Language)
WWW
Hypertext
HTM
L
HTML ist eine Spezifikation einer Auszeichnungssprache für Web-Dokumente.
Geschichte des WWW Marc Andreessen entwickelte den
ersten Browser mit grafischer Oberfläche: „Mosaic“
Mitbegründer der Firma „Netscape“ (jetzt von AOL/TimeWarner geschluckt), da ihm das Mosaic-Projekt zu klein wurde
Webtechnologien
Grundsätzliche Einteilung
Server-seitige
AusführungHTML
Client-seitige
Ausführung
ServerseitigeProgrammiersprachen Perl und CGI (Common Gateway
Interface), deren Mittel begrenzt sind. Deshalb entwicklung von Alternativen:
ASP (Active Server Pages), Microsoft-Format, meist auf Windows NT-Webservern (€)
PHP (Hypertext Preprocessor), meist auf Linux-/Unix-Servern, freies Format (kostenlos: http://www.php.net)
PHP Einbettung direkt in HTML via <?php ... ?> -Tags
Beispiel:<?phpecho "Hallo Welt!";?>
Beim Benutzer kommt aber nur „Hallo Welt!“ an.
ClientseitigeProgrammiersprache JavaScript (Java) hat sich gegen das
proprietäre VBScript (Microsoft) durchgesetzt
Unterstützt wird JS durch das Document Object Model (DOM), welches beschreibt, wie auf Elemente in (X)HTML-Dokumenten zugegriffen wird.
JavaScript eigentlich Netscape-Entwicklung, in Microsoft-Browsern JScript-Engine. Praktisch kein Unterschied.
Plugins Programme, durch die andere Formate in
HTML-Dokumenten zugänglich gemacht werden kann
Arbeiten Clientseitig Vertreter
Flash (Macromedia) Java (Sun) ActiveX (nur Microsoft, Sicherheitslücke!)
Fehler im Webdesign
An einem praktischen Beispiel Fehler aufgezeigt.
Startseite
Ganz schlechter Titel!
Ganz hässlicher Schriftzug!
Ganz dummer Spruch!
Startseite
Klick...
Ganz schlechter Titel!
Frames!
Und so sah’s 2001 aus...
3 Frames bedeutet:
3 HTML-Seiten,3 Head-Bereiche,3 Server-Anfragen
Und so „sieht’s“ ein Blinder...
Nicht sehr aufschlussreich...
Auch nicht besser...
Navigation Klick auf einen Navigationspunkt
ändert immer 2 Frames. Normalerweise funktioniert das per
JavaScript. Hier: Kompliziert, dafür auch bei
ausgeschaltetem JS bedienbar, durch Zusatzframe.
Noch eine Version
Bescheidene Farbgebung!
Wieder Frames...
Imagemap als Navigation ist von Screen-readern so gut wie nicht zu entziffern
Eine weitere Version
Alles in allem: Hässliches Design
Keine Frames!
Lustige (???) Gesichter...
Layout-tabellen
Benutzen von unsichtbaren Tabellen als Gestaltungs-raster
18 (!!) Tabellenmit 83 (!!!) <td/>-Tags
Viel Bandbreite dadurch verschwendet...
Layout-tabellen
Benutzen von unsichtbaren Tabellen als Gestaltungs-raster
Wesentlich weniger Tabellen!
Vorteile vonWebstandards
Wieso Web-standards gut für das Internet sind und warum sie trotzdem so selten verwendet werden.
Was sind Webstandards?
Sie sind Definitionen, wie Dateien im Internet aussehen sollen, um bei einer größtmöglichen Zahl an Internet-Nutzern den größtmöglichen Nutzen zu erzielen.
Sie sollen die Langlebigkeit von im Internet veröffentlichten Dokumenten sicherstellen.
Wer definiert Webstandards?
Diese Technologien werden vom World Wide Web Consortium (W3C) und anderen Organisationen entwickelt und ausgebaut.
Das W3C ist eine Kommission, in der Vertreter aller Bereiche des Internet-Geschäfts zu finden sind. Diese finanzieren das W3C auch.
Welche Webstandardsgibt es? Struktursprachen:
HTML 4 (HyperText Markup Language) XHTML 1.0 und 1.1 (eXtended HTML)
Präsentationssprachen: CSS Level 1 (Cascading Style Sheets) CSS Level 2 CSS Level 3
Welche Webstandardsgibt es? Objektmodelle:
Document Object Model (DOM) Level 1 (Core) DOM Level 2
Scriptsprache: ECMAScript 262
Zusätzliche Präsentationssprachen: MathML 1.01 und 2.0 (Mathematical Markup
Language) SVG 1.0 (Scalable Vector Graphics)
„JavaScript“
Die Auszeichnungssprache HTML HTML ist mittels SGML (Standard
Generalized Markup Language, ISO-Norm 8879) definiert
Mittlerweile: Redefinition mit dem XML-Standard XHTML
Spezifikationen für (X)HTML HTML 1.0
Auszeichnungen für Standard-Elemente wie Überschriften, Textabsätze, für Grafikreferenzen und natürlich für Verweise
HTML 2.0Erster offizieller Sprachstandard 1995. Browser waren aber schon Meilenweit weiter, so unterstützte Netscape 2.0 bereits Frames und Multimedia-Referenzen
Spezifikationen für (X)HTML HTML 3.2
Inoffizielle Version 3.0 ging an den Realitäten im Web vorbei, deshalb völlige Umarbeitung. Tabellen werden Standard und auch Tags zur physischen Textauszeichnung.Mittlerweile werden viele dieser Tags „deprecated“ (misbilligt). Diese werden durch CSS ersetzt.
Spezifikationen für (X)HTML HTML 4.0
Zurückbesinnung auf eigentliche Aufgaben von HTML. Einführung von 3 Varianten: Strict, Transitional und Frameset
XHTML 1.0Erste neudefinition per XML. Kaum Veränderungen gegenüber HTML 4.0 außer dem Kennzeichnen von physischen Tags (font, i, u, b) als deprecated.
Spezifikationen für (X)HTML XHTML 1.1
Konsequentes Fortsetzen der Reform. Rückbesinnung auf eine Version.
Das Problem
Browserhersteller brachen die Standards
Dadurch: Fragmentierung des Internets
Schaden für:• Designer• Entwickler• Nutzer• Unternehmen
Das Problem
Manche Webseiten konnten nicht aufgerufen werden, wenn man den falschen Browser benutzte.
Besonders betroffen: Behinderte Menschen und Menschen mit besonderen Bedürfnissen.
Das Dilemma
Entweder: Entwickeln verschiedener Versionen
einer Seite für verschiedene Browser
Oder: Browser vernachlässigen und damit
Besucher und/oder Kunden zu verlieren.
Egal, wie die Entscheidung ausfällt: Der Preis ist zu hoch!
+25%
Die Entwickler
Sie sahen keinen Sinn darin Standard-Webseiten zu erstellen, die kein Browser unterstützt.
Viele kannten die Standards so gut wie gar nicht.
(Dazu, dass auch heute Multi-Millionen-Dollar-Agenturen nicht in der Lage sind Standards zu benutzen kommen ich später.)
Die Folgen
Entwickler setzten nur die ältesten und algemeingültigsten Web-Technologien ein (HTML 3.2 oder niedriger!)
Begrenzte Attraktivität undFunktionalität der Website.
Die Folgen
Andere: WYSIWYG-Editoren oder Redaktionssysteme, die etliche Versionen an Markup und Code für jeden Browser generieren
Verschwendung von Geld und Bandbreite
Webseiten, die in der nächsten Browser-Generation nicht mehr laufen
Webseiten, die nicht in alternativen Browsern oder Endgeräten funktionieren
Was dagegen tun?
Das Web Standards Project
Gründung des WaSP: 1998Ziele:
Bekannt machen der grundlegenden Webstandards
Ermutigen der Browser-Hersteller Webstandards zu benutzen
Sicherstellen des mühelosen Zugangs zum Internet für jeden Nutzer
Das Web Standards Project
Zunächst: Widerstand bei den Browser-Firmen
Dann: Durchsetzen mit Hilfe der Software-Ingenieure
Das Web Standards Project
Seit 2000: Ein Browser nach dem anderen unterstützt Webstandards.
Das ermöglicht es Entwicklern Struktur und Design zu trennen um die Portabilität und den Zugang von behinderten zu verbessern.
!Mit Vorsicht können Designer und Ent-wickler sogar das standardisierte DOM ver-wenden um ihre Websites mit ausgefeilten interaktiven Komponenten auszustatten.
Das Web Standards Projectgibt’s immer noch!
Zehntausende professionelle Webdesigner und Entwickler verwenden veraltete Methoden.
Struktur wird weiterhin an das Design gekettet, manchmal wird sogar die semantische Struktur ganz missachtet oder (X)HTML als Design-Werkzeug missbraucht.
Das Web Standards Project
Hochbezahlte Fachleute produzieren weiterhin nicht-valide, unzugängliche Websites: Strukturell bedeutungsloses
Markup Riesige Image-Maps Maßlos verschachtelte Tabellen Überholte Browser-Detection-
Scripts
Folgen nicht-validen Codes
Webseiten sehen in allen Browsern gleich aus und lassen sich gleich bedienen,
Aber: Die Webseiten sind viel „schwerer“ Redesigns werden effizienter und
schneller umzusetzen
Vorteile von Webstandards Seiten laden schneller
(Einsparungen von 30% und mehr!)
Webstandards helfen ein Corporate Design auf den Seiten durch-zuziehen und es schnell zu ändern
Seiten sind auf jedem Gerät und für jeden Benutzer erreichbar
-30%