Barrierefreiheit

[beatovich]

hallo

Hallo, zur Barrierefreiheit (insbes. für Blinde) habe ich folgendes gefunden.

span.inivisble
{
    position: absolute;
    left: -1000px;
    font-size: 0px;
}
a.sprunglink
{
	position: relative;

Hier solltest du bereits position absolute verwenden

left: -99999px;

left: -120vw geht sparsamer mit Ressourcen um.

Aber siehe unten

}

a.sprunglink:focus { position: absolute; left: 0px; }

HTML: <h2 class="invisible">Navigation</h2>

<div id="header"> <a href="#inhalt" class="sprunglink">Direkt zum Inhalt</a> ... </div>

Wenn ich dies allerdings einbaue, rutscht mein gesamter Inhalt nach unten.
Würde in beiden Fällen (invisible und sprunglink) nicht genügen "display: none;"?

Mit display:none kann a nicht fokusiert werden.

Durch das Umschalten von absolut auf relative wird natürlich Platz beansprucht. Das macht sich dann im Layout bemerkbar.

Du solltest nicht mit left arbeiten sondern damit:

{ height:0; width:0; overflow:hidden; }