Your SlideShare is downloading. ×
0
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Internet und Webdesign (Historisches Dokument)

393

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
393
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Internet und Webdesign Ein Referat von Eric Eggert
  • 2. Internet-Geschichteund Webtechnologie Technologien, die im Internet verwendet werden sowie eine kurze Einführung in die Geschichte des Internets.
  • 3. 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)
  • 4. 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)
  • 5. Geschichte des Internets Gründung des „EuropaNET“ mit verschiedenen nationalen Forschungsnetzen Gründung der RIPE (Réseaux IP Européens) (3/3)
  • 6. Dienste im Internet E-Mail Telnet und SSH File Transfer (FTP) Gopher Chat (IRC) Newsgroups (Usenet) World Wide Web (WWW)
  • 7. 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.
  • 8. 3 Säulen des WWW WWW HTML HTTP URI Hypertext
  • 9. HTTP(Hypertext Transfer Protocol) WWW Das Hypertext Transfer Protocol ist eine Spezifikation für die Kommunikation zwischen Server HTTP und Client (=Browser). Hypertext
  • 10. URI(Universal Resource Identifier) WWW Die URI ist eine Spezifikation für die Addressierung beliebiger Dateien im Web und im übrigen URI Internet. Oft wird auch der Begriff URL (=Uniform Resource Locator) benutzt. Hypertext
  • 11. 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
  • 12. HTML(HyperText Markup Language) WWW HTML ist eine Spezifikation einer Auszeichnungssprache für Web-Dokumente. HTML Hypertext
  • 13. 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
  • 14. Webtechnologien
  • 15. Grundsätzliche Einteilung Server- Client- seitige HTML seitige Ausführung Ausführung
  • 16. 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)
  • 17. PHP Einbettung direkt in HTML via <?php ... ?> -Tags Beispiel: <?php echo "Hallo Welt!"; ?> Beim Benutzer kommt aber nur „Hallo Welt!“ an.
  • 18. 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.
  • 19. 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!)
  • 20. Fehler im Webdesign An einem praktischen Beispiel Fehler aufgezeigt.
  • 21. StartseiteGanz schlechterTitel!Ganz hässlicherSchriftzug!Ganz dummerSpruch!
  • 22. Startseite 
  • 23. Klick...Ganz schlechterTitel!Frames!
  • 24. Und so sah’s 2001 aus...3 Framesbedeutet:3 HTML-Seiten,3 Head-Bereiche,3 Server-Anfragen
  • 25. Und so „sieht’s“ ein Blinder...Nicht sehraufschlussreich...Auch nichtbesser...
  • 26. 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.
  • 27. Noch eine VersionBescheideneFarbgebung!Wieder Frames...Imagemap alsNavigation istvon Screen-readern so gutwie nicht zuentziffern
  • 28. Eine weitere VersionAlles in allem:HässlichesDesignKeine Frames!Lustige (???)Gesichter...
  • 29. Layout-tabellenBenutzen vonunsichtbarenTabellen alsGestaltungs-raster18 (!!) Tabellenmit 83 (!!!)<td/>-TagsViel Bandbreitedadurchverschwendet...
  • 30. Layout-tabellenBenutzen vonunsichtbarenTabellen alsGestaltungs-rasterWesentlichwenigerTabellen!
  • 31. Vorteile von WebstandardsWieso Web-standards gut fürdas Internet sindund warum sietrotzdem so seltenverwendet werden.
  • 32. Was sindWebstandards?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.
  • 33. Wer definiertWebstandards?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.
  • 34. 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
  • 35. Welche Webstandardsgibt es? Objektmodelle: Document Object Model (DOM) Level 1 (Core)   DOM Level 2 t“ crip avaS Scriptsprache: „J  ECMAScript 262 Zusätzliche Präsentationssprachen:  MathML 1.01 und 2.0 (Mathematical Markup Language)  SVG 1.0 (Scalable Vector Graphics)
  • 36. Die AuszeichnungsspracheHTML HTML ist mittels SGML (Standard Generalized Markup Language, ISO- Norm 8879) definiert Mittlerweile: Redefinition mit dem XML-Standard  XHTML
  • 37. 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.0 Erster offizieller Sprachstandard 1995. Browser waren aber schon Meilenweit weiter, so unterstützte Netscape 2.0 bereits Frames und Multimedia- Referenzen
  • 38. 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.
  • 39. 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.0 Erste neudefinition per XML. Kaum Veränderungen gegenüber HTML 4.0 außer dem Kennzeichnen von physischen Tags (font, i, u, b) als deprecated.
  • 40. Spezifikationen für (X)HTML XHTML 1.1 Konsequentes Fortsetzen der Reform. Rückbesinnung auf eine Version.
  • 41. Das ProblemBrowserhersteller brachen die StandardsDadurch: Fragmentierung des InternetsSchaden für: • Designer • Entwickler • Nutzer • Unternehmen
  • 42. Das ProblemManche Webseiten konnten nicht aufgerufen werden, wenn man den falschen Browser benutzte.Besonders betroffen: Behinderte Menschen und Menschen mit besonderen Bedürfnissen.
  • 43. Das DilemmaEntweder:  Entwickeln verschiedener Versionen einer Seite für verschiedene BrowserOder:  Browser vernachlässigen und damit Besucher und/oder Kunden zu verlieren.Egal, wie die Entscheidung ausfällt: Der Preis ist zu hoch! % +25
  • 44. Die EntwicklerSie 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.)
  • 45. Die FolgenEntwickler setzten nur die ältesten und algemeingültigsten Web- Technologien ein (HTML 3.2 oder niedriger!) Begrenzte Attraktivität und Funktionalität der Website.
  • 46. Die FolgenAndere: 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
  • 47. Was dagegen tun?
  • 48. Das Web Standards Project Gründung des WaSP: 1998 Ziele:  Bekannt machen der grundlegenden Webstandards  Ermutigen der Browser-Hersteller Webstandards zu benutzen  Sicherstellen des mühelosen Zugangs zum Internet für jeden Nutzer
  • 49. Das Web Standards Project Zunächst: Widerstand bei den Browser-Firmen Dann: Durchsetzen mit Hilfe der Software-Ingenieure
  • 50. 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.
  • 51. 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.
  • 52. 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
  • 53. Folgen nicht-validen CodesWebseiten sehen in allen Browsern gleich aus und lassen sich gleich bedienen,Aber:  Die Webseiten sind viel „schwerer“  Redesigns werden effizienter und schneller umzusetzen
  • 54. Vorteile von Webstandards Seiten laden schneller (Einsparungen von -30% 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

×