Frage zu Web-Accessibility

[defect]

Hallo zusammen.

Ich habe eine Frage zur Zugänglichkeit von Web-Seiten. Es sieht inzwischen so aus, als hätte ich meine erste Seite spruchreif designt. Jetzt habe ich noch Feinheiten zu machen, sowie den Inhalt abzustimmen.
Und jetzt die Frage: Die Seite ist komplett CSS designt, keine Tabellen im HTML oder so. Das Design ist mit Bildern (Logo usw.) realisiert, die auch in der CSS sitzen und nicht im HTML. Wenn ich also zB beim Firefox bei "Ansicht -> Webseiten-Stil -> Kein Stil" wähle, habe ich vollkommen undesignten, nackten Text. Allerdings fehlt der Name der Gruppe, sowie die Bezeichnung der Seite, auf der man/frau sich momentan befindet. Ich überlege also, ob ich Überschriften einbinden soll, die ich im CSS dann unsichtbar machen würde. Bei Ausschalten des CSS wären sie sichtbar und auch die Screenreader bekommen sie mit. Wie löst ihr eure Accessibility-Probleme? Ist meine Lösung elegant? Ich hatte auch überlegt, ein Alternativ-Design anzubieten... Kann ich darauf vertrauen, dass Menschen mit Sehschwächen Browser benutzen, die CSS abstellen können? Das Schriftgröße ändern auf meiner Seite führt nach sechs Klicks bei Safari ins Chaos, deswegen würde ich gerne trotzdem noch möglichst hohe Zugänglichkeit erreichen. Ich bin äußerst dankbar für Tipps und/oder Anregungen

mit Gruß.
godn

 

[defect]

-- Also ich hab inzwischen den Bobby-Tester gefunden... leider kann ich den Test erst durchführen, wenn die Seite online ist, aber das scheint schonmal gut zusein. www.einfach-fuer-alle.de hat einige interessante Beiträge. Fangs vor allem scheint mir auch ziemlich brauchbar... schon interessant, wie das dann aussieht.
Trotzdem interessieren mich immernoch eure Erfahrungen und Lösungswege.

 

[defect]

Kann mir niemand die Fragen beantworten? Mich interessiert die Sache mit der Accessibility wirklich sehr und es wäre sehr hilfreich für mich, von einigen erfahreneren Forums-Mitgliedern ihre Lösungswege und eine Einschätzung meiner Überschriften-Idee zu bekommen.
ich hoffe, mein erneutes posten wird mir nicht als spam angelastet

 

[HAL]

Vielleicht hilft Dir diese Seite weiter: http://www.scoreberlin.de/barrierefreiheit/*

Nebenbei bemerkt: Der Bobby Test ist Hardcore, die wenigsten Webseiten die ich
kenne erfüllen dessen Standard. Für rein private Webseiten ist es auch nicht
nötig, anders schaut es bei Gouverment (Behörden) Seiten aus, dort ist eine
strikte Accesibility gesetzlich vorgeschrieben (auch in Deutschland).

*Womit ich nicht sagen möchte, das Du deren Dienst in Anspruch nehmen
sollst, sondern man von denen einen Menge lernen kann.

 

[defect]

Nebenbei bemerkt: Der Bobby Test ist Hardcore, die wenigsten Webseiten die ich
kenne erfüllen dessen Standard. Für rein private Webseiten ist es auch nicht
nötig, anders schaut es bei Gouverment (Behörden) Seiten aus, dort ist eine
strikte Accesibility gesetzlich vorgeschrieben (auch in Deutschland).

Danke für den Link.
Zum Bobby-Test: Es wird keine rein-private Seite. Es wird die Homepage einer Hochschul-Fachschaft, die auch auf der Seite des entsprechenden Instituts landen wird. Außerdem kenne ich selbst schonmal entfernt Eine, die Sehbehindert ist, und ich möchte -bestimmt auch deswegen- eine Zugänglichkeit für wirklich so viele wie möglich erreichen.
mit Gruß und danke für den Hinweis
godn

 

[HAL]

Es wird die Homepage einer Hochschul-Fachschaft, die auch auf der Seite
des entsprechenden Instituts landen wird.

Das ist eine Seite, die durchaus durch die harte Mühle des Bobby-Tests
gehört. Viel Erfolg!

 

[defect]

Das ist eine Seite, die durchaus durch die harte Mühle des Bobby-Tests
gehört. Viel Erfolg!

Danke. Das wird schon... und wenn nicht, bau ich um (das Valid-XHTML 1.0 strict und Valid-CSS habe ich ja auch geschafft )
Bleibt also erstmal nur noch die Frage mit den unsichtbaren Überschriften... (das habe ich mir so ausgedacht, weil es für Bilder in der CSS ja kein "alt" gibt oder irre ich mich?)
Hat jemand so eine Lösung schonmal benutzt? Wie sichert ihr den Inhalt, wenn ihr mit Bildern (und CSS) gestaltet?
godn

 

[neolox]

gesetzlich vorgeschrieben ist für 2005 (wann genau weiss ich jetzt leider nicht) dass deutsche öffentliche und staatliche seiten barrierefrei gestaltet sein müssen...

mit bobby fährst du schon recht gut was barrierefreiheit angeht...
so weit ich das bisher gesehen hab wird das oft so gelöst wie du bereits gesagt hast...

eine überschrift <h1>name der seite</h1> wird mit css so formatiert dass dort ein logo dargsetellt wird, der inhalt jedoch nicht...wird das stylesheet weggelassen..zb wenn ein blinder mit textbrowser unterwegs ist -> brailleschrift oder einen screenreader verwendet..funktioniert die seite trotzdem wunderbar

weiters musst du nicht unbedingt auf teufel komm raus alle bilder aus dem quelltext entfernen..wenn sie für den inhalt der seite eine bedeutung haben kannst du sie ruhig reintun und einen alternativtext anbieten der so gut wie möglich eine alternative information geben kann falls das bild nicht dargestellt wird...ich glaube es gibt auch das attribut longesc um eine ausführliche beschreibung zu geben.

bilder die fürs design sind kannst du jedoch ins css auslagern das is auch super so

wie du die accessibility noch weiter steigern kannst ist wenn du die ladezeiten gering hältst, und indem du die navigation durch tabulator shortcuts ermöglichst (ist jedoch dank firefox nicht mehr so dringend notwendig, da der browser schon nette features für das ansteuern von links bietet...mit type-and-find

man kann generell sagen...100% barrierefrei geht nicht...aber man kann viel dazu beitragen und es der software wie browsern und screenreadern und bestimmter hardware einfacher machen damit so viele user wie möglich komfortabel eine webseite bedienen können...

es ist eine parallele weiterentwicklung zwischen standards in markup und design, software und hardware...und wenn du mit deiner webseite einen schritt in die richtige richtung machst kann das schon viel bewegen

find ich echt toll dass du dir mühe gibst...leider hab ich dir nicht viel mehr infos geben können...aber ich hoffe es hat dir ein bisschen weiter geholfen...

lg

 

[defect]

so weit ich das bisher gesehen hab wird das oft so gelöst wie du bereits gesagt hast...

Das ist gut zu hören Dann mach ichs so.

weiters musst du nicht unbedingt auf teufel komm raus alle bilder aus dem quelltext entfernen..wenn sie für den inhalt der seite eine bedeutung haben kannst du sie ruhig reintun und einen alternativtext anbieten der so gut wie möglich eine alternative information geben kann falls das bild nicht dargestellt wird...ich glaube es gibt auch das attribut longesc um eine ausführliche beschreibung zu geben.

bilder die fürs design sind kannst du jedoch ins css auslagern das is auch super so

So mach ichs auch. Die Bilder fürs Design (Logo, Navigationsleisten-Hintergrund) sind in der CSS, die Bilder von den Gruppenmitgliedern kommen aber mit "alt" ins HTML. Das mit dem "longsc" klingt gut. Recherchier ich mal.

wie du die accessibility noch weiter steigern kannst ist wenn du die ladezeiten gering hältst, und indem du die navigation durch tabulator shortcuts ermöglichst (ist jedoch dank firefox nicht mehr so dringend notwendig, da der browser schon nette features für das ansteuern von links bietet...mit type-and-find

Mach ich das mit "tabindex" für die Links richtig, oder gibts noch bessere Methoden?

ich hoffe es hat dir ein bisschen weiter geholfen...

Das hat es

mit gruß. godn

 

[HAL]

Das kann man z.B. so lösen (Als Beispiel ein Logo, kann
aber auch für andere Bilder benutzt werden):

Quellcode:

<div class="logo">
<h1>
<a href="index.php" title="Startseite">Startseite</a>
</h1>
</div>

CSS:

#logo {
	width: 120px;
	height: 16px;
	margin-left: 25px;
	text-decoration: none;
	position: absolute;
	margin: 0px;
}

h1	{
	text-indent: -9999px;
	margin: 0;
	border: 0;
	padding-left: 38px;
	color: #336699;
	text-decoration: none;
	position: absolute;
	padding-top: 7px;
	width: 100px;
	height: 16px;
}
	
h1 a:link, h1 a:visited	{
	display: block;
	background: #FFF url(pixel/logo.gif) top left no-repeat;
	border: 0;
	margin: 0px;
	color: #336699;
	text-decoration: none;
	padding-top: 7px;
	padding-left: 38px;
	width: 100px;
	height: 16px;
}
	
h1 a:hover, h1 a:active	{
	background: #FFF url(pixel/logo.gif) top left no-repeat;
	border: 0;
	margin: 0px;
	color: #336699;
	text-decoration: none;
	padding-top: 7px;
	padding-left: 38px;
	width: 100px;
	height: 16px;
}

Wobei Ausrichtung, Schriftgrösse und Farben natürlich anpassbar sind.

 

[mikne64]

Hallo godn,

auf deutsch heißt "Accessibilty" barrierefrei. Da hatten wir auch schon folgenden Thread
https://www.macuser.de/forum/showthread.php?t=35431&highlight=barrierefrei

Wegen Firefox:
Hier habe ich vor kurzem eine Diskussion bei Mozilla gelesen, ich weiß die Adresse nicht mehr. Es ging darum, daß für alternative Beschreibungen das ALT-Attribut benutzt wird, während viele Web-Entwickler dies jedoch dafür nutzen um Schaltlfächen alternativ zu beschreiben. Es gibt noch ein anderes Attribut neben ALT, welches eigentlich für Befehle gedacht ist. Der Firefox scheint hier im Vergleich zu anderen Browsern ALT etwas anders zu interpretieren. Diese Diskussion war aber auch sehr akademisch und vom eigenen Geschmack der Entwickler/Betroffenen bestimmt.

Versuche doch mal Deine Seiten mit Lynx zu testen. Ich habe es spasseshalber mal auf meinen Seiten versucht, die waren, kein CSS, lesbar, lediglich die Tabellen wurden zerrupft.

Viele Grüße
Michael

 

[HAL]

Versuche doch mal Deine Seiten mit Lynx zu testen. Ich habe es
spasseshalber mal auf meinen Seiten versucht, die waren, kein CSS, lesbar,
lediglich die Tabellen wurden zerrupft.

Dann solltest Du "Links" probieren, das ist die weiter entwickelte
Variante von "Lynx" und kommt wunderbar mit Tabellen zurecht.

 

[defect]

Vielen Dank für eure Antworten

@mikne21: Danke für Deinen Link, der Thread ist interessant. (...Ich hab hier doch tatsächlich nur nach Accessibility gesucht...)

Was lynx/links angeht, ich bin leider Terminal-Idiot... und das läuft doch über die Kommandozeile, oder? Erziele ich mit FireFox und dem Stil ausschalten nicht denselben Effekt?
mit gruß. godn

 

[defect]

Bleiben noch zwei Fragen:
Tabindex für die Navigation mit Tastatur?
Kann ich darauf vertrauen, dass Menschen mit Sehschwächen Browser benutzen, die sie unterstützen oder wäre es angebracht, meinerseits das Ausschalten der Stylesheets anzubieten?

 

[defect]

So... Der Ersttest des Ganzen ist über die Bühne.
Hab das Gewünschte "Bobby AAA" bekommen

(@HAL: In der Tat hatte Bobby mich aber zuerst ziemlich klein gemacht...)
Ich danke Euch nochmal Allen für eure Hilfe... und wenn die endgültige Version (also mit Inhalt) draußen ist, melde ich mich bei euch zur Design-Hinrichtung
mit Gruß. godn


<edit>
Oh, jungejunge, damit bin ich doch noch nicht durch. Kaum die "Approved" und "Valid"-Bildchen eingefügt, straft mich Bobby wieder "repair needed"... *lol* schon lustig, die Seite ist nicht mehr Voll-Barrierefrei, weil ich mit einem Icon zeigen wollte, dass sie Barrierefrei ist...
</edit>