zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Barrierefreiheit
Seite neu laden Der perfekte Skiplink?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.10.2006, 13:46
Benutzerbild von Zen5656
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 24.07.2006
Beiträge: 378
Zen5656 befindet sich auf einem aufstrebenden Ast
Standard Der perfekte Skiplink?

Moin moin

beschäftige mich zurzeit immer mehr mit Barrierefreiheit auch wenn meine Zielgruppen 100%ig nichts damit zu tun haben.

Derzeitig verwirrt mich der Skiplink. Früher hieß es man solle einfach mit CSS display: none; das Teil für normale Besucher ausblenden. Letztens habe ich aber gelesen das Screenreader auch CSS können und somit diesen link auch nicht vorlesen. Ergo benutzt man eine Methode bei der man den Skiplink außerhalb dem Sichbereichs positioniert. Css wäre dann dafür:

PHP-Code:
.skiplink {
positionabsolute;
top: -1000px;
left: -1000px;

Meine Frage: Wenn die Screenreader CSS können, würde dann nicht beim der Umpositionierung die Reihenfolge verändert werden? Also das der Skiplink an einer anderen stelle vorgelesen wird?!

Little Boxes - CSS lernen - Aktuelles - » Ergänzung zu Seite 55: Skip-Link ausblenden

MfG Zen

Geändert von Zen5656 (13.10.2006 um 13:49 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 13.10.2006, 19:56
Weltverbesserer
XHTMLforum-Mitglied
 
Registriert seit: 22.05.2006
Beiträge: 124
Dr Snuggles befindet sich auf einem aufstrebenden Ast
Standard

Hallo

Ob das so perfekt ist, kann ich dir leider nicht beantworten.

Aber was die Reihenfolge des Vorlesens der Screenreader angeht, orientiert sich die doch an der Reihenfolge im Quelltext. Und wenn ein Screenreader display:none; versteht und es trotzdem vorliest, heißt das ja noch nicht, das er dann aus dem sichtbaren Bereich geschobene Elemente vorliest oder gar an anderer Stelle mit entsprechendem Hinweis wie "außerhalb des sichtbaren Bereiches...".
DAS wäre allerdings makaber *scnr*

Gruß
Christian
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.10.2006, 22:08
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

So gehts auch und es lesen auch Screenreader noch immer vor:

Code:
#accnav

{
	position: absolute;
	visibility: hidden;
}
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #4 (permalink)  
Alt 13.10.2006, 22:19
_42 _42 ist offline
Minimalist
XHTMLforum-Mitglied
 
Registriert seit: 04.11.2005
Beiträge: 258
_42 befindet sich auf einem aufstrebenden Ast
Standard

Vielleicht soetwas:
Code:
#skip { visibility: hidden; position: absolute; }

#skip:focus { visibility: visible; }
Damit die Tastaturnutzer auch etwas davon haben.
Mit Zitat antworten
  #5 (permalink)  
Alt 13.10.2006, 22:34
Benutzerbild von Yhi
Yhi Yhi ist offline
/* no comment */
XHTMLforum-Mitglied
 
Registriert seit: 28.05.2006
Beiträge: 208
Yhi befindet sich auf einem aufstrebenden Ast
Standard

Also ich bin mir jetzt zwar nicht 100%ig sicher aber der Medientyp braille müsste dafür doch ideal sein:

Code:
@media braille {
   /* Angaben für Screenreader */
}
oder eine extra Datei:

Code:
<link rel="stylesheet" media="braille" href="screenreader.css">
__________________
PHP und Webdesign Blog
Mit Zitat antworten
  #6 (permalink)  
Alt 14.10.2006, 11:04
Opera-User
XHTMLforum-Mitglied
 
Registriert seit: 01.08.2006
Ort: Hessen
Beiträge: 100
dementius befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von SelfHtml
CSS-Datei gilt für Ausgabegeräte mit so genannter "Braille-Zeile". Dabei wird Text eine veränderbare Oberflächenstruktur des Materials der Braille-Zeile umgewandelt und über Abtasten mit dem Finger gelesen. Diese Form des Ausgabemediums ist für blinde Menschen gedacht.
Gilt das dann nicht nur für Braille-Zeilen Umwandler und nicht für Screenreader allgemein? Hat jmd Erfahrungen damit?

[Dementius]
__________________
* html { display: none; }
Mit Zitat antworten
  #7 (permalink)  
Alt 14.10.2006, 16:18
Benutzerbild von Geronimo
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.06.2004
Beiträge: 2.644
Geronimo sorgt für eine eindrucksvolle AtmosphäreGeronimo sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von dementius Beitrag anzeigen
Gilt das dann nicht nur für Braille-Zeilen Umwandler und nicht für Screenreader allgemein? Hat jmd Erfahrungen damit?
Hab' mal irgendwo gelesen, dass die gängigen Screenreader diesen Medientyp nicht unterstützen. Irgendwie erschreckend.

Die Sprungmöglichkeit zu den einzelnen Seitenbereichen blende ich über die Eigenschaft display: none aus. Ein Screenreader sollte diese - von mir nur für die Bildschirmdarstellung und Projektion empfohlene - Formatierung ansich nicht beachten.
Mit Zitat antworten
  #8 (permalink)  
Alt 16.10.2006, 11:33
Benutzerbild von pmmueller
Autor von "Little Boxes"
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Ort: Groningen (Niederlande)
Beiträge: 292
pmmueller sorgt für eine eindrucksvolle Atmosphärepmmueller sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von Zen Beitrag anzeigen
Derzeitig verwirrt mich der Skiplink.
Ich habe mich inzwischen mal ein bisschen schlau gemacht und das mit den Skiplinks einmal in dem nicht ganz billigen, aber sehr guten Buch Barrierefreies Webdesign von Angie Radtke und Michael Charlier nachgelesen.

Wozu wir Sprungmarken (Skiplinks) brauchen
Auf Seite 141 stehen zunächst ein paar grundsätzliche Überlegungen zum Thema. Hier ein kurzer Ausschnitt:
Zitat:
Zitat von Barrierefreies Webdesign
Praktisch läuft der Einsatz von Sprungmarken darauf hinaus, an den Anfang jeder Seite noch einmal ein zusätzliches Menü für die seiteninterne Navigation zu stellen. In den meisten Fällen wird es sinnvoll sein, dieses Menü im grafischen Layout auszublenden ...
Sprungmarken ausblenden
Auf Seite 145 steht, das man zum Ausblenden von Sprungmarken nicht auf die CSS-Eigenschaft display:none zurückgreifen kann, "da diese mittlerweile auch von Screenreadern interpretiert wird." Dann folgt ein CSS-Beispiel für die Klasse .unsichtbar, mit der die Sprungmarken ausgeblendet werden:
Code:
.unsichtbar {
  position: absolute; 
  left: -3000px; 
  top: -2000px; 
  width: 0px; 
  height: 0px; 
  overflow: hidden; 
  display: inline; 
}
Ich denke, dass die Screenreader mit der absoluten Positionierung kein Problem haben, weil sie den Inhalt der Seite linearisieren, was im Klartext ja bedeutet, dass sie Positionsangaben ignorieren. display: none hingegen ist keine Positionsangabe und wird interpretiert.

Im Web kann man sich das übrigens die eigens für das Buch erstellte Beispielseite anschauen:

- Bad Seendorf clean - ziemlich zugänglich.

- Bad Seendorf alt - vor dem Relaunch.
__________________
HTML & CSS lernen: »Einstieg in CSS« + »Flexible Boxes« | CMS lernen: »Websites erstellen mit Contao«

Geändert von pmmueller (16.10.2006 um 11:36 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 16.10.2006, 12:18
Benutzerbild von Geronimo
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.06.2004
Beiträge: 2.644
Geronimo sorgt für eine eindrucksvolle AtmosphäreGeronimo sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von pmmueller Beitrag anzeigen
Auf Seite 145 steht, das man zum Ausblenden von Sprungmarken nicht auf die CSS-Eigenschaft display:none zurückgreifen kann, "da diese mittlerweile auch von Screenreadern interpretiert wird." [...] Ich denke, dass die Screenreader mit der absoluten Positionierung kein Problem haben, weil sie den Inhalt der Seite linearisieren, was im Klartext ja bedeutet, dass sie Positionsangaben ignorieren. display: none hingegen ist keine Positionsangabe und wird interpretiert.
Bei Screenreadern handelt es sich um ausgesprochen dämliche Programme. Sie setzen meist auf den IE auf, ignorieren die für sie bestimmten Formatierungen und verwenden stattdessen die ausdrücklich nur für visuelle Medien gedachten Formatierungen. Webautoren haben besseres zu tun, als fehlerhaften Benutzerschnittstellen den Bauch zu streicheln. Wer es dennoch tun möchte, findet auch bei Barrierefreies Webdesign: Einfach für Alle - eine Initiative der Aktion Mensch einen hilfreichen Artikel.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 16.10.2006, 12:44
Benutzerbild von pmmueller
Autor von "Little Boxes"
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Ort: Groningen (Niederlande)
Beiträge: 292
pmmueller sorgt für eine eindrucksvolle Atmosphärepmmueller sorgt für eine eindrucksvolle Atmosphäre
Standard

Danke für den Link zu Teil 3 des Artikels bei "Einfach für alle". Der gesamte 5-teilige Artikel ist sehr interessant:

- Tutorium: Barrierefreie Navigationsmenüs
__________________
HTML & CSS lernen: »Einstieg in CSS« + »Flexible Boxes« | CMS lernen: »Websites erstellen mit Contao«
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Perfekte 1 Pixel Linie in Illustrator 14 wurzelchensen Grafik, Design, Typografie 8 05.10.2009 10:45
Horizontale Navi mit Trennzeichen: perfekte Lösung? AndreasB CSS 29 16.05.2009 09:02
Skiplink direkt in ein Suchfeld? andir Barrierefreiheit 5 13.12.2007 18:53
Skiplink zum Inhaltsverzeichnis? hubspe Barrierefreiheit 43 21.10.2007 15:24


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:37 Uhr.