putzhuber.at > Wai Happen > Stylesheets

50er Jahre Anzeige, Hausfrau beim Abwasch mit Prilpaket, mit Slogan: wenig Stil hilft viel
Inserat für "Pril", aus "Frau und Mutter", 47. Jahrgang, zweites Juniheft 1958, Seite 32, bearbeitet. (Originaltext: "Pril so sparsam - wenig Pril hilft viel", "Pril ohne Soda schont die Hände")

Accessibility Know-how

Für die BerufskollegInnen, die sich einen schnellen Überblick verschaffen wollen...

Die Inhalte sind nicht neu, aber weitgehend aktuell.

HTML / CSS Tipps

Stylesheets

18. Juni 2007

  1. Webseiten müssen ohne Stylesheets gelesen werden können.
  2. Prüfen kann man das leicht durch Wegschalten des CSS im Firefox (Ansicht / Webseitenstil) oder mit der Webdeveloper Toolbar.
  3. Idealerweise bleibt eine lineare HTML Version übrig (keine Layouttabellen).
  4. Keine Formatangaben (z.b. font, bgcolor, b, i, Hintergrund, Schriftfarbe…) im HTML, möglichst keine Inline Styles, sondern externe Stylesheets.
  5. Vorsicht bei Wysiwyg Editoren in CMS! Unerlaubte Formatierungsmöglichkeiten für RedakteurInnen ausblenden.
  6. Vorsicht bei Image Replacement Techniken (siehe Bilder).
  7. Linkmarkierung für mouseover a:hover auch für TastaturbenutzerInnen sichtbar machen mit a:focus, a:active (für IE).
  8. Jeweils Hintergrund und Vordergrundfarben definieren.
  9. Für media aural und handheld gibt es noch zu wenig bzw. sehr unterschiedliche Unterstützung.
  10. Ein print.css, das die Navigation ausblendet, sollte selbstverständlich sein.
  11. Styleswitcher: Verschiedene CSS auf Webseiten zur Auswahl – z.B. Farb-, Kontrastvarianten – sind nette Features, UserInnen, die sie wirklich brauchen, verwenden aber vermutlich Zoomsoftware (die Seiten auch mit Farbfiltern versehen kann) oder individuelle Benutzereinstellungen, weil sie Farb- oder Kontrastanpassungen im normalen Computeralltag auch benötigen.
  12. Manche UserInnen mit starker Sehbehinderung schätzen eigens für sie gestaltete einspaltige Versionen mit größerer Schrift und nicht blendendem Hintergrund, die sich sehr groß skalieren lassen. Andere wiederum bevorzugen die „normale“ grafische Version zur Gesamtorientierung und scrollen lieber quer beim Zoomen.
  13. Screenreader interpretieren CSS auch. Mit display:none oder visibility:hidden versteckte Teile zeigen auch Screenreader nicht. Für Navigationsunterstützung (Sprungmarken, unsichtbare Headlines) gibts die Lösung, sie mit Minuswerten außerhalb des Bildschirms zu positionieren.
  14. Info auf der W3C Seite: Accessibility Features von CSS.

Kommentarfunktion ist deaktiviert