Fritz: Versteckte Skiplinks

Beitrag lesen

Hallo,

Seiteninterne Sprunglinks, etwa zum Inhalt, oder zur Navigation, sind ein wichtiges Element, um die Benutzung von Webseiten öhne Maus, ausschließlich mit der Tastatur zu erleichtern.
Vielfach werden diese Sprunglinks per CSS versteckt, und nur beim Durchtabben mit der Tastatur angezeigt.
Hierfür gibt es eine etablierte Technik, die eigentlich immer und überall funktioniert.
Eigentlich.
Nur nicht mit dem IE6 auf der folgenden Testseite, die ich eigens erstellt habe, um diese Technik in verschiedenen Browsern zu testen.
< http://webdesign.weisshart.de/test/skiptest/skip.html>

Ich bin, gelinde gesagt, ratlos.

Hier der (komplette = relevante Teil des) Quelltext der Seite:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>
<title>Titel</title>
<meta http-equiv="Content-Style-Type" content="text/css" />

<style type="text/css">

#skip a:link,
#skip a:visited {
 position:absolute;
 left:-500px;
 top:-500px;
 width:0;
 height:0;
 display:inline;
}

#skip a:focus,
#skip a:hover,
#skip a:active  {
 position:absolute;
 left:0;
 top:0;
 width:auto;
 height:auto;
 display:block;
}

</style>

</head>
<body>

<div id="skip"><a href="#navsprung">Sprung zur Navigation</a></div>

<div id="inhalt">
      <h1>Titel</h1>
      <p>Irgendwelche Inhalte</p>
      <p><a href="http://www.example.com">ein normaler Link</a></p>
</div>

<p>Viele Trennlinien, um Raum zu schaffen:</p>
<hr /><hr /><hr /><hr /><hr /><hr /><hr /><hr />

<h2><a name="navsprung">Navigation</a></h2>

</body>
</html>

Gruß Fritz

--
ie:( fl:( br:? va:) ls:< fo:| rl:? ss:{ de:> js:| mo:} zu:}
http://webdesign.weisshart.de/