Agenda. Neue Technologien für bessere Websites. Dorian Selz

Transkript

1 Neue Technologien für bessere Websites Dorian Selz 6. März 2007 Agenda 1. Einführung 2. Neue Technologien für bessere Websites 2.1 Was sind neue Technolgien 2.2 Neue Technologien im Web Was ist das Web Technolgien im Web 2.3. Abschlessene Bewertung der Einführung 3. Überblick Technologien 3.1 Mash-Ups 3.2 RSS 3.3 AJAX 3.4 OpenID 3.5 REST Definition Anwendung: Tiny URLs 3.6 Semantic 3.7 User Generated Content Der Vortrag beinhaltet: Background Info 89% Erfahrungsbericht 98% Zucker 0% Reales Leben 100% BUllet Points 20% Fragen??% 2 1

2 Was ist ein Mash-Up? 3 Clientseitiges Zusammenkleben von verschiedenen Anwendungen und Daten 4 2

3 Quelle: Karten Daten Fotos Events News Produkte Suche 6 3

4 7 Quelle: 8 4

5 Quelle:

6 Quelle: 11 Quelle:

7 13 Quelle:

8 Quelle: 15 Quelle:

9 17 Quelle:

10 Quelle: 19 Alles Mash-Ups 20 10

11 Am Anfang steht 21 eine klare Idee 22 11

12 Zum Beispiel: Hawkee.com Produktkatalog von einer Site E-Commerce Infrastruktur von anderer Site Reviews von Nutzern Resultat: Preisvergleich und Verkauf ohne grosse eigene Infrastruktur (Auf Deutsch: Lass die andern den mühsamen Teil machen und behalt die Kommission) APIs von Amazon, Commission Junction, E-Bay Quelle: 23 Wie können wir mittun? 24 12

13 Ganz einfach: Türen auf! 25 Zu einem Mash-Up gehören: Offene und dokumentierte API Gescheites Geschäftsmodell für den Gebrauch der API + Was darf die Drittpartei mit den Daten machen + Beispiel SBB: Freigeben macht Sinn; das eigentliche Geschäft ist der Ticketverkauf + Beispiel Google: Offene API; aber ab bestimmtem Erfolg kann Werbung eingeblendet werden Quelle: + Standards: RSS, Atom, GeoRSS + Quelle:

14 Und hier noch für die Tüftler unter uns Mash-Ups zum selber basteln Quelle: /03/02/5-ways-to-mix-ripand-mash-your-data/ 27 Web 2.0? 28 14

15 Generisch Definition Design Patterns and Business Models for the Next Generation of Software Tim O'Reilly, 30/09/2005 Quelle: 29 Definition Design Patterns and Business Models for the Next Generation of Software Generisch Generisch Generisch + + of Software = Web 2.0? 30 15

16 Ist einfach die nächste Etappe Mehr Komfort Mehr Interaktion Mehr Innovation 31 Sympathisch 32 16

17

18 35 Quelle:

19 Haben andere besser beantwortet 37 AJAX = Asynchronus Javascript and XML Jesse James Garret / Adaptive Path, 2005 Quelle:

20 Kein AJAX im Einsatz 39 Quelle:

21 AJAX im Einsatz 41 Quelle:

22 Wir nutzen Ajax: Einfachere Eingabe + Rubriken Lookup Fehlerreduktion + Type Ahead für Orte Interaktive Darstellung des lokalen Raums + Interaktion Karte Resultat Einfacheres Erfassen von Inseraten + WYSIWYG Formular Quelle: 43 Ziel des AJAX Einsatzes: 44 22

23 Eine(n) zufriedene(n) NutzerIn 45 Aber Quelle:

24 GZip Handshake Browser - Server Start User Session + Browser und Server etablieren Kompressionslevel Quelle: 47 js.php Map Widget 23 /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php /js.php 737 So ist es (auch) in der Realität So soll es sein: maximale Kompression Quelle: Auszug Log Files local.ch 25. Februar

25 Ajax ist kein Allerweltsheilmittel Klare Zielsetzung + Interaktion vereinfachen + Fehlerreduktion + Interaktiveres Erlebnis Mit Limitationen bewusst umgehen + Javascript funktioniert nicht überall (Corporate Firewall) + Clientseitige Verarbeitung ist nicht in jedem Fall gut + Komplexere Umgebung erhöhter Maintenance Aufwand Quelle: 49 Quelle: Time Magazine January 1,

26 51 User Generated Content Ich (You) publiziere Inhalte Andere können diese Inhalte aufgreifen, editieren, weiterverwenden Eine Reihe von standardisierten Formaten erleichtert den Austausch Stichworte sind + Blogs + Bilder Communities + Video Communities + Kommentare auf Websites Quelle:

27 Eine Reise nach Down Under Quelle:

28

29

30 Gute Tipps?! Quelle: 59 Aktualität?! Qualität?! Quelle?! Interessenlage?! Aufwand?! 60 30

31 Der Long Tail wirkt auch hier Quelle: 61 Nur Wenige contributen sehr viel Anzahl Artikel Anzahl Autoren Quelle:

32 Quelle: 63 User Generated Content: Tolle Möglichkeit, tolle Herausforderung ;-) You Sich der Öffentlichkeit stellen User Generated Content verlangt + Engagement + Offenheit + Ausdauer + Kritikfähigkeit + Bereitschaft Kontrolle aufzugeben Quelle:

33 Tags / Folksonomy 65 Was ist ein Tag? 66 33

34 Tags sind: A tag is a (relevant) keyword or term associated with or assigned to a piece of information (like picture, article, or video clip), thus describing the item and enabling keyword-based classification of information it is applied to. Auf Deutsch: Basisdemorkatische Verschlagwortung + Einzelne Worte + Durch User dezentral getrieben + Keine zentrale Ontologie: Spontan, nicht kontrolliert + Verteilung / Öffentlichkeit der Schlagworte Quelle: 67 Mein Blog Barbara s Blog Traveling Mama s Blog Andere Blogs XY-Blog XY-Blog 68 34

35 69 Was ist eine Tag-Cloud? 70 35

36 Quelle: 71 Alles unabhängige Sites 72 36

37 Verteilung ist der Schlüssel Jede Plattform bietet Inhalte in einem (maschinenlesbaren) Feed an + RSS + Atom Ziel: Verteilung der Inhalte Zusätzlich: Aktive Benachrichtigung von Hub-Sites Ping-Hubs + planet.blogug.ch + Paradigmenwechsel: Inhalte werden erstellt um maximal verteilt zu werden 73 Tags & Folksonomy Eignet sich als alternative Ordnungsstruktur + Besonders für Inhalte, die selbst nicht durchsucht werden können (Bilder) + Inhalte, die vom Benutzer/Kunde erstellt werden, z.b. Kleinanzeigen + Inhalte, deren Kategorisierung aufwändig ist und trotzdem unbefriedigend bleibt + Tags veredeln bestehende Informationen durch ein vielschichtiges Beziehungsnetz Aber: Folksonomy eignet sich nicht als ausschliessliche Ordnungsstruktur Quelle:

38 75 Microformats 76 38

39 Microformats sind: Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards. Microformats beschreiben Inhalte semantisch Microformats sind im Quellcode einer Website integrieret Die Information wird maschinenlesbar Einfach im Syntax (SemanticWeb at Work) im Gegensatz zu den grossen Semantic Web Standards wie RDF Quelle: 77 Microformats at work 78 39

40

41 Nützliche Dinge Die Treffer können als Mircoformats bezogen werden Telefonbuch als hcard Guide Resultate als hcard und hcalender Market.local mit hlisting 81 Die Business Idee für heute Abend 82 41

42 Semantik verändert das Web Microformat beginnt sich als Set von Standards durchzusetzen Eigene über APIs zugängliche Daten als Microformat anbieten Einmal mehr: Bazar vor Kathedrale Syndikation bekommt eine ganz neue Dimension Quellen: + Microformats.org + Structuredblogging.org Quelle: 83 Open ID 84 42

43 85 Viele Websites 86 43

44 viele User IDs 87 und viele Passwörter 88 44

45 die alle vergessen gehen. 89 Die Lösung: Open ID 90 45

46

47

48 95 Wie s funktioniert 96 48

49 97 Die andern schlafen nicht 98 49

50 Und andere (Yahoo, etc.) 99 Open ID einführen ist ein schlauer Zug Single Sign On in der Praxis. Für Public Websites ein gute Alternative zu eigenen teuren Entwicklungen Technologie ist (mehrfach) vorhanden Online-Identitäten sind kontrovers diskutiert: Ein Umdenken ist notwendig im Umgang mit persönlichen Daten Quellen: + Openid.net + MyOpenID.com, VeriSign PIP + openid.net/wiki/index.php/libraries

51 Zum Schluss

52 Das Internet wird mündig 103 Mash-Ups AJAX Tags & Folksonomy Microformats Open ID

53 Technologieeinsatz mit Ziel: 105 Rule 1 & 2: Der/Die NutzerIn ist KönigIn* Rule Nr 1: The User is King and always right! Rule Nr 2: In case she is wrong: go back to rule #1! * Tatsächlich**: User Tests haben unterschiedliche Nutzungsweisen zu Tage gefördert ** Nicht weiter erstaunlich ;-) ;

54 Vielen Dank 54