slide1 n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
ix-Konferenz Ajax vs. Accessibility PowerPoint Presentation
Download Presentation
ix-Konferenz Ajax vs. Accessibility

Loading in 2 Seconds...

play fullscreen
1 / 93

ix-Konferenz Ajax vs. Accessibility - PowerPoint PPT Presentation


  • 129 Views
  • Uploaded on

ix-Konferenz Ajax vs. Accessibility. Ajax vs. Accessibility Der Kampf um die Zukunft des Internets. Ajax: Das Internet der Zukunft ist intuitiv bedien- und erlebbar. Accessibility: Das Internet der Zukunft ist plattformunabhängig und barrierefrei. Die beiden Gegner. Ajax aka Ivan Drago

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

ix-Konferenz Ajax vs. Accessibility


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
slide3

Ajax vs. Accessibility

Der Kampf um die Zukunft des Internets

slide5

Accessibility:Das Internet der Zukunft ist plattformunabhängig und barrierefrei.

slide9

Ajax aka Ivan Drago

  • die russische Kampfmaschine
  • das Produkt der High-End-Sporttechnologie
  • der Vorzeige-Athlet
slide12

Accessibility aka Rocky Balboa

  • der Underdog / unbekannter Außenseiter
  • klein, durchschnittlich, Rechtsausleger
  • Sehschwäche auf dem rechten Auge
slide13

Die GegnerAjax

  • Ajax

Teile einer Seite werden erneuert, ausgetauscht

oder verändert, ohne dass die Seite neu lädt.

slide14

Die GegnerAjax

  • Ajax

bekannt als:

  • die coole Hype-Maschine
  • Der große Innovator
  • Mr. OnTheFly
  • Drag&Drop-Wunder
  • Fast & Glamorous
slide15

Die GegnerAjax

  • Stärken
  • Reaktionszeit / Real time
  • Schnelligkeit / kein Reload
  • Interaktivität
  • Experience
  • Feature-Rich
slide16

Die GegnerAjax

  • Schwächen
  • URLs
  • Back-Button
  • View Port
slide17

Die GegnerAjax

  • Gefürchtet für
  • Schnelligkeit
  • Show-Effekte und Eleganz
  • Bricht mit allen Konventionen und Erwartungen
slide18

Die GegnerAjax

  • Glorreiche Siege
  • Flickr
  • Google Suggest
  • Backpack / Basecamp
  • Amazon Diamond Search
  • Netvibes
slide24

Die GegnerAccessibility

  • Accessibility

Accessibility heißt Zugang …

  • für alle Nutzer
  • mit allen Browsern und Plattformen
  • zu allen Daten und Informationen
slide25

Die GegnerAccessibility

  • bekannt als
  • Das Gute
  • Der Ur-Gedanke des World Wide Webs
slide26

„The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.“

- Tim Bernes-Lee, Web-Erfinder und Direktor des W3C

slide27

„The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.“

- Tim Bernes-Lee, Web-Erfinder und Direktor des W3C

slide29

Die GegnerAccessibility

  • Stärken
  • Liebling der Massen
  • Schnelle Ladezeit
  • Findability
  • Plattformunabhängigkeit
slide30

Die GegnerAccessibility

  • Schwächen
  • Wenig Show-Effekte
  • User Experience
  • Regel-Fetischismus
  • Design
slide31

Die GegnerAccessibility

  • Gefürchtet für
  • Moralische Überlegenheit
  • “The right thing to do”
slide32

Die GegnerAccessibility

  • Glorreiche Siege
  • tagesschau
  • News.com
  • Postbank
  • Baden Württemberg
  • BVG – Berliner Verkehrsbetriebe
  • Yahoo.com
slide41

Ajax vs. Accessibility Der Kampf

Runde 1: Suche

Runde 2: Dynamische Inhalte

Runde 3: Formulare

Runde 4: URLs

slide42

RUNDE

1

SUCHE

slide43

Runde 1 Suche

  • Klassische Suche
slide44

Runde 1 Suche

  • Klassische Suche

besteht aus:

  • Textfeld mit Button (label / input / input)

Nutzung:

  • Suchwort eingeben
  • Suchen-Button drücken
  • Laden der Suchergebnisseite
slide45

Runde 1 Suche

  • Live-Suche
slide46

Runde 1 Suche

  • Live-Suche

besteht aus:

  • Textfeld

Nutzung:

  • Während Eingabe erscheinen die Suchergebnisse
  • Live-Ergebnisse verfeinern sich automatisch beim Weiterschreiben
  • Auswahl des Ergebnisses oder des Suchwortes während der Eingabe
slide47

Runde 1 Suche

  • Rundenbewertung
  • Klassische Suche ist vertraut und leicht zugänglich
  • Live-Suche kann Suchprozess immens beschleunigen.
slide48

Runde 1 Suche

  • Lösung: Ajax & Accessibility
  • Live-Suche-Funktionalität + klassischer Button
slide49

RUNDE

2

DYNAMISCHE INHALTE

slide50

Runde 2 Dynamische Inhalte

  • Ajax
  • Neue Inhalte werden auf einer Seite dynamisch aktualisiert(ohne Reload)
  • Amazon-Diamond-Search
  • Last-FM
slide51

Runde 2 Dynamische Inhalte

  • Accessibility
  • Wie werden die Nutzer informiert, dass sich auf der Seite etwas verändert hat?
  • Sehende Nutzer mit herkömmlichen PC:Keine Probleme: Überblicken die ganze Seite
  • Nutzer mit Handy oder Palm:Probleme mit der Übersicht
  • Screenreader-Nutzer:linearer Nutzungsweg / kein Hinweis auf neue Inhalte
slide52

Runde 2 Dynamische Inhalte

  • Rundenbewertung
  • Neue Inhalte ohne Reload können Bestell- und Navigationsprozesse oder die Aneignung von Informationen immens beschleunigen.
slide53

Runde 2 Dynamische Inhalte

  • Lösung: Ajax & Accessibility
  • Fallback-Lösung
  • Hinweise für Screenreader-Nutzer
  • Option: Informieren per Alert
  • Inhalte sind bereits im Dokument vorhanden und werden per DOM und CSS ein und ausgeblendet
slide54

Runde 2 Dynamische Inhalte

  • Fallback
  • Amazon Diamond-Search
slide55

Runde 2 Dynamische Inhalte

  • Ajax-Rechner
  • AJAX calculator

Besser mit Alert:

  • The accessibleAJAX calculator
slide56

Runde 2 Dynamische Inhalte

  • Inhalte werden bereits geladen und per Klick eingeblendet
  • Dom-Tabs
slide59

RUNDE

3

FORMULARE

slide60

Runde 3 Formulare

  • Ajax-Formulare
  • sind dynamisch
  • geben sofort Feedback
  • machen Live-Änderungen möglich (Edit-In-Place)
slide64

Runde 3 Formulare

  • Accessibility

Wie werden die Nutzer informiert, dass

  • der Username schon vergeben ist?
  • die to-do-list ergänzt wurde?
slide65

Runde 3 Formulare

  • Rundenbewertung
  • Ajax-Formulare bieten einen hohen Komfort
slide66

Runde 3 Formulare

  • Lösung: Ajax & Accessibility
  • Yellow-Fade
  • Hinweis für Screenreader-Nutzer: Dynamische Aktualisierung
  • Hinweis, dass JavaScript benötigt wird
  • Überprüfen auf JavaScript und alternative Version bereitstellen
  • Option: per Alert informieren, dass sich was verändert hat
slide67

Runde 3 Formulare: Beispiel

  • Backpack

Accessibility-Studie:

Joe Clark: Usability tests of Basecamp with screen readers and other adaptive technology

slide72

RUNDE

4

URLs

slide74

Runde 4 URLs: Bookmarks & Back-Button

  • HTML-Seiten und URLs
  • jede Seite hat eine eigene URL
  • jede Seite kann gebookmarkt werden
  • jeder Link führt auf eine neue Seite
  • mit dem Back-Button kommt man wieder zurück zur vorherigen Seite
slide75

Runde 4 URLs: Bookmarks & Back-Button

  • Ajax-Seiten
  • Immer die gleiche URL

Probleme

  • Bookmarken nicht möglich
  • Links verschicken nicht möglich
  • Back-Button funktioniert nicht

Zusätzliches Problem:

  • Auffindbarkeit
slide77

Runde 4 URLs: Bookmarks & Back-Button

  • Rundenbewertung
  • Back-Button, URLs und Auffindbarkeit sind fundamentale Elemente des Webs
slide78

Runde 4 URLs: Bookmarks & Back-Button

  • Lösung: Ajax & Accessibility
  • Ajax mit Urls und Back-Button
slide80

Runde 4 URLs: Bookmarks & Back-Button

  • Wie es funktioniert
  • Content with Style: Fixing the Back Button and Enabling Bookmarking for AJAX Apps
  • Really Simple History: Ajax-Framework for bookmarking and back button support
  • Beispiele
  • Odeo
  • Content with Style
slide82

1. Ausgang: Ajax siegt

  • Ajax und Web 2.0 sind zu cool
  • Accessibility ist nett, aber nicht mehr zeitgemäß
  • Es gibt genügend andere Probleme
  • User-Experience ist wichtiger als Barrierefreiheit
slide83

2. Ausgang: Accessibility siegt

  • Ajax-Anwendungen scheitern an ihrer eigenen Show
  • Schillernde Oberfläche statt guter Benutzerführung
  • Effekthascherei nervt die Nutzer
  • Nutzer suchen Einfachheit und gute Inhalte
slide84

3. Ausgang: Harmonie

  • Graceful Degradation
  • Ajaxibility
  • Hijax: http://domscripting.com/blog/display/41
  • Build Ajax on top: Unobtrusive JavaScript for Ruby on Rails
slide87

„Wir haben nichts gegen Barrierefreiheit, aber wir haben mit unserer Technik schon genug Probleme.“

slide90

klar, damit verzichten Sie auch auf:

  • Google
  • Ältere Nutzer
  • Nutzer mit körperlichen Einschränkungen
  • Internet-Newbies
  • Nutzer, die mit Handy, Palm, Blackberry surfen
slide92

Das Comeback

  • Rocky VI

Dezember 2006Trailer: http://www.youtube.com/watch?v=0biU_lZE0Xc