RSS
06 Mär 2007

Warum "left: -9999px" besser ist als "display: none"

Author: Andreas | Filed under: Notizblog
In seinem Blog Artikel - Why “left: -9999px;” is Better For Accessibility Than “display: none;” - erklärt Nick Fitz warum man lieber die Position eines zu verbergenden Textes in den nicht sichtbaren Bereich schieben soll, statt den Text mit CSS ganz zu verstecken.
Die Tatsache das Screenreader damit nicht umgehen können, war Ihm nicht genug und so hat er die Aussage genau durchleuchtet und herausgefunden, dass der Internet Explorer generell in 2 Arten von "Unsichtbar" unterscheidet.
Die eine ist STATE_SYSTEM_INVISIBLE, die andere STATE_SYSTEM_OFFSCREEN.
Weil die Screenreader nicht selber die Website auswerten sondern sich auf den Browser verlassen, kann es dank dem IE dabei zu Probleme kommen. Dieser versteckt nämlich Objekte die Invisible sind ganz während er Objekte die Offscreen sind ausliefert. Daher werden diese auch vorgelesen.
Die ganze Abhandlung findet sich im englischen Original im Blog von Nick Fitz.

0 Trackbacks

Trackback-URL für diesen Eintrag

  1. Keine Trackbacks

2 Kommentare

  1. *Interessant!
    Das eine einige Screenreader "display:none" nicht lesen können, wusste ich schon lange. Jetzt weiß ich endlich warum.
  2. *Danke für den netten Hinweis. Ich hoffe das Problem hat sich mittlerweile beim aktuellen IE erledigt.

Kommentar schreiben

Umschließende Sterne heben ein Wort hervor (*wort*), per _wort_ kann ein Wort unterstrichen werden.
Standard-Text Smilies wie :-) und ;-) werden zu Bildern konvertiert.
Die angegebene E-Mail-Adresse wird nicht dargestellt, sondern nur für eventuelle Benachrichtigungen verwendet.

Um maschinelle und automatische Übertragung von Spamkommentaren zu verhindern, bitte die Zeichenfolge im dargestellten Bild in der Eingabemaske eintragen. Nur wenn die Zeichenfolge richtig eingegeben wurde, kann der Kommentar angenommen werden. Bitte beachten Sie, dass Ihr Browser Cookies unterstützen muss, um dieses Verfahren anzuwenden.
CAPTCHA

Twitter, Identica, MyBlogLog, Favatar, Pavatar, Identicon/Ycon Autoren-Bilder werden unterstützt.

tweetbackcheck