Verfasst von: bletra | 29. September 2009

12.10.2009: Organisation, Softwaretechnik, Ergonomie, HTML Grundlagen und Tabellen

Fragen? Kommentare?

Nachträge meinerseits:

Barrierefreiheit

In der Vorlesung hatte ich den Fokus auf blinde Menschen gelegt. Barrieren gibt es aber auch andere Personengruppen mit möglichen Problemen …

  • Sehbehinderte Menschen: Unzureichende Kontraste, nicht skalierbare Schrift, unzureichende Darstellung bei geringer Auflösung.
  • Blinde Menschen: Mangelhafte Bildbeschreibungen, unzureichende Linkbezeichnung, falsche Überschriften, Nichtbedienbarkeit von Navigation durch Tastatur.
  • Stark hörgeschädigte und gehörlose Menschen: Audiodateien, schwer verständliche Texte (Muttersprache ist i.A. die Gebärdensprache!)
  • Manuell-motorisch eingeschränkte Menschen: Unzugänglichkeit von Hyperlinks und Nichtbedienbarkeit von Navigation für Tastatur-Nutzer.
  • Menschen mit kognitiven Einschränkungen: Schwere Sprache, überladene Seiten.
  • Menschen mit lichtinduzierter Epilepsie: Flackernder Inhalt, besonders gefährlich sind 15 – 35 Hz.

Beachten Sie bei der Codierung Ihrer HTML-Seiten folgende Hinweise:

  • Bilder und Co: Stellen Sie alternative Texte für Grafiken und Bilder über das alt-Attribut zur Verfügung.
  • Links: Der Text sollte selbsterklärend sein, auch innerhalb einer extrahierten Linkliste. Vermeiden Sie Links wie mehr oder hier klicken, vermeiden Sie gleiche Texte für verschiedene Ziele. Idealerweise fängt jeder Link mit einem Schlüsselwort an, so dass sich blinde Leute schnell und gut orientieren können.
  • Style: Strikte Trennung zwischen Inhalt und Layout, konsequente Verwendung eines verlinkten Stylesheets.
  • Markup: Verwenden Sie Überschriften, nutzen Sie HTML als semantische Sprache, kennzeichnen Sie Sprachwechsel, heben Sie die Bedeutung von Textabschnitten mit strong oder emph hervor.
  • Tabellen: Geben Sie Tabellenzusammenfassungen und Spaltenüberschriften an. Die Tabelle sollte Zeile für Zeile lesbar sein. Verwenden Sie für kompliziertere Tabellen die headers-id Technologie.
  • Formulare: Verwenden Sie Labels für Ihre Eingabefelder, beschriften sie diese möglichst genau: Nachname anstelle von Name. Gewährleisten Sie, dass teilweise ausgefüllte Formulare ihre Werte behalten, falls die Benutzerin einem Link auf der aktuellen Seite folgt (um beispielweise die BLZ einer Bank innerhalb eines Überweisungsformulars zu suchen) und dann wieder zum Formular zurückkehrt. Beschriften Sie alle Schaltflächen, andernfalls könnten Benutzer zu Recht Hemmungen haben, das Formular abzuschicken und damit beispielsweise eine Überweisung zu tätigen. Geben Sie Feedback, auch wenn ein Formular erfolgreich verarbeitet wurde.
  • Geräteunabhängigkeit: Gewährleisten Sie die Bedienung der Seite mausunabhängig.
  • Schreiben Sie einfach: Vermeiden Sie verschachtelte Sätze. (Kognitive Barriere)
  • Navigationselemente: Stellen Sie eine Sitemap zur Veranschaulichung der Struktur Ihrer Website sowie ein Breadcrumb auf jeder Seite zur Verfügung. Breadcrumbs zeigen an, auf welcher Seite man sich aktuell befindet und wie diese Seite in die Hierarchie der Applikation eingebunden ist. Stellen Sie ein Suche zur Verfügung und markieren Sie die Treffer als Überschriften.
  • Skalierbarkeit: Wählen Sie ein skalierbares Layout. Falls Sie Icons oder Imagemaps für Links verwenden, so werden diese nicht mitvergrößert. Hiervon ist abzuraten.
  • Validieren Sie Ihe Seiten nach XHTML strict und nutzen Sie automatische Testwerkzeuge.
Advertisements

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s

Kategorien

%d Bloggern gefällt das: