• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Barrierefreiheit sichern Voodoo Werkzeuge für Frontend Entwickler
 

Barrierefreiheit sichern Voodoo Werkzeuge für Frontend Entwickler

on

  • 989 views

 

Statistics

Views

Total Views
989
Views on SlideShare
989
Embed Views
0

Actions

Likes
0
Downloads
5
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Barrierefreiheit sichern Voodoo Werkzeuge für Frontend Entwickler Barrierefreiheit sichern Voodoo Werkzeuge für Frontend Entwickler Presentation Transcript

    • Barrierefreiheit sichern! Voodoo-Werkzeuge für Frontend-Entwickler Accesibi Peter Rozek, 12.10.2010
    • Peter Rozek ... Accesibi
    • ... seit 2010 bei der ecomplexx GmbH als Frontend-Developer für die barrierefreie und gebrauchtsaugliche Entwicklung von Websites. ...Usability Professional im AK Barrierefreiheit ... mit think green - neue Medien im Einkaufsführer Barrierefreies Internet Accesibi aufgenommen und Unterstützer im Aktionsbündnis für barrierefreie Informationstechnik.
    • Inhalt... Accesibi
    • Inhalt: • Grundlage Barrierefreiheit • Werkzeuge Accesibi • Praxis
    • Grundlage Accesibi
    • Damit wir barrierefreie Webseiten erstellen können, unterstützt uns die die Web Content Accessibility Accesibi Guidlines (WCAG) 2.0
    • WCAG 2.0 W3C Recommendation 11. 12. 2008 Accesibi
    • WCAG 2.0 (DE) Autorisierte deutsche Übersetzung Accesibi vom 29. 10. 2009
    • BITV 2.0 . . . ? Accesibi
    • Wann kommt die BITV 2.0? Accesibi
    • Gute Frage! Accesibi
    • ... Schritt für Schritt zur BITV 2.0 Accesibi
    • Die vier Prinzipien der WCAG 2.0 Accesibi
    • 1. Wahrnehmbar 2. Bedienbar 3. Verständlich Accesibi 4. Robust
    • Unter den Prinzipien stehen die Richtlinien. Accesibi
    • Für jede Richtlinie werden testbare Erfolgskriterien zur Accesibi Verfügung gestellt.
    • Für die Richtlinien und Erfolgskriterien sind Techniken dokumentiert. Accesibi
    • Damit wir barrierefrei entwickeln können brauchen wir verlässliche Werkzeuge, die uns valide Ergebnisse Accesibi liefern.
    • Werkzeuge Accesibi eine Auswahl...
    • Web-Developer Toolbar WAVE-Toolbar Juicy Studio Accessibility Toolbar Accesibi Firebug
    • Accesibi Web Developer Toolbar
    • • Ansicht in beliebiger Auflösung • CSS direkt verändern • Elemente ausblenden Accesibi • JavaScript deaktivieren
    • WAVE Toolbar Accesibi WAVE Toolbar
    • Plugin mit nützlichen Funktionen für die Prüfung auf Accesibi Zugänglichkeit
    • Juicy Studio Accessibility Toolbar Accesibi Juicy Studio Accessibility Toolbar
    • Prüfung von WAI-ARIA- Elementen • Document landmarks • Roles and Properties Accesibi • Table Inspector • Farbkontraste
    • Praxis Accesibi eine Auswahl...
    • Kontrast Ohne Farbe Accesibi
    • Test mit: Web-Developer- Toolbar* Accesibi * Add-on für Firefox
    • Navigierbar Überschriften und Accesibi Beschriftungen (Labels)
    • Test mit: Web-Developer- Toolbar* Accesibi * Add-on für Firefox
    • Linearisierbarkeit Wichtiges Kriterium in der Accesibi Barrierefreiheit
    • Test mit: Web-Developer- Toolbar* Accesibi * Add-on für Firefox
    • Syntaxanalyse Kompatibilität mit Benutzeragenten Accesibi und assistierender Technik.
    • Test mit: Web-Developer- Toolbar* Accesibi * Add-on für Firefox
    • Navigierbar Überschriften und Accesibi Beschriftungen (Labels)
    • Test mit: WAVE Toolbar* Accesibi * Add-on für Firefox
    • Kontrast Vorder- und Hintergrundfarbe Accesibi
    • Test mit: Juicy Studio Accessibility Accesibi Toolbar* * Add-on für Firefox
    • WAI-ARIA Prüfung von WAI-ARIA-Elementen Accesibi
    • Test mit: Juicy Studio Accessibility Accesibi Toolbar* * Add-on für Firefox
    • Firebug Accesibi
    • • CSS Layouts überprüfen • DOM-Objekte anzeigen und editieren • Analyse der Ladezeit Accesibi einzelner Objekte
    • wofür brauche ich Firebug... Accesibi
    • Performance Optimierung = schnellere Webseiten Accesibi
    • Einflussfaktoren auf die Ladezeit... Accesibi
    • • Bandbreite • Gesamtvolumen der Website • Anzahl der zu ladenden Accesibi Objekte (HTTP-Requets)
    • Wo kann man optimieren... Accesibi
    • • HTML • CSS • JavaScript Accesibi • Grafiken
    • HTML Accesibi
    • • Webstandards • Trennung von Struktur, Design und Interaktion Accesibi • Valides HTML
    • • Kommentare entfernen • CSS und JavaScript in externe Dateien Accesibi
    • CSS Accesibi
    • Schreibweise optimieren #container { margin-top: 5px; margin-right: 10px; margin-bottom: 5px; margin-left: 10px; } Accesibi #container { } margin: 5px 10px;
    • • minify CSS • CSS Dateien zusammenfassen Accesibi
    • Test mit: Firebug* Accesibi * Add-on für Firefox
    • Vielen Dank für Ihre Aufmerksamkeit Accesibi Peter Rozek, 12.10.2010
    • Fragen Accesibi Peter Rozek, 12.10.2010
    • E-Mail: peter.rozek@complexx.com E-Mail: rozek.p@think-green.de Twitter: webinterface Accesibi Peter Rozek, 12.10.2010