Navigation horizontal gleichmäßig verteilen

[marctrix]

Hej Gunnar,

<figure>
  <img src="…" alt=""/>
  <figcaption>Fig. 42: …</figcaption>
</figure>

Das Bild hat eine zugehörige Bildunterschrift. Es wäre sinnlos, dasselbe noch mal ins alt-Attribut zu schreiben und doppelt vorlesen zu lassen.

Auf keinen Fall dasselbe! Das nervt!

In der Praxis ist es aber oft notwendig, etwas über das Bild zu wissen, um die Bildunterschrift zu verstehen.

Heißt: eine Bildunterschrift kann einen Alternativ-Text überflüssig machen, sicher ist das aber keineswegs...

Sollte es noch einer genaueren Beschreibung des Bildinhalts bedürfen, wäre nicht das alt-Attribut, sondern ein per aria-describedby verknüpfter Bereich (visually hidden) der geeignete Ort dafür.

Welche Screenreader unterstützen das denn bereits? Und wozu so, wenn es ein oder zwei Worte im alt-Text ebenso gut erledigen. Zumal ich (mal wieder) davor warnen möchte, nur für Blinde die Zugänglichkeit zu garantieren. Wenn diese nötigen Informationen auf visually hidden gesetzt werden, fehlen sie Sehenden, die CSS aktiviert haben, Bilder aber nicht...

Ein weiterer Anwendungsfall wird in der Spec genannt:

<img src="self.png" alt="SELFHTML"/><img src="html.png" alt=""/>

„SELFHTML“ sollte nicht in alt="SELF" und alt="HTML" getrennt werden.

Unbedingt! - Logos, die den Seitenbetreiber bzw. die gesamte Internet-Präsenz repräsentieren sind ohnehin ein Sonderfall.

Blinden ist - genau wie Sehenden - sehr wohl klar, dass ein Klick darauf in der Regel zur Startseite führt. Hier muss also die hinterlegte Funktion (Link zur Startseite) nicht unbedingt in den alt-Text.

Führt der Link aber wo anders hin, als man gemeinhin erwartet, muss diese Informationen Blinden und Sehenden zugänglich sein.

Werden Bilder mit einer Funktion versehen (Button, Anker) muss im alt-Text angegeben werden, was bei einem Klick passiert (zum Impressum, Berechnung, durchführen, Kostenpflichtig bestellen usw)

Wenn das nicht schon anderweitig (Linktext, Buttontext) angegeben wird.

Wobei value, title oder placeholder nicht ausreichen...

Ist der alt-Text entsprechend sinnvoll vergeben, würde ich auf weiteren zusätzlichen Text verzichten. Also nichts wie so was:

<a href="…"><img src="img/vita.png" alt="">Vita</a>

Doch, genau das.

Bisher war ich selber - dummerweise - ausschließlich bei der Unterstützung der Blinden.

Habe dann aus Faulheit (um den Text nicht umzuschreiben), diese Info unten angehängt. Gut aufgepasst! ;-)

Damit ist der Link übrigens NUR für Blinde zugänglich und für Menschen, die Bilder abgeschaltet haben. Bei Sehenden Menschen kann man NICHT voraussetzen, dass sie verstehen, was mit den Symbolen gemeint ist!

Eben. Deshalb steht ja „Vita“ neben dem Symbol – für Blinde und Sehende.

Rrrrichtig ;-)

Das bedeutet dann, dass die beste, für alle zugängliche Lösung dann so aussieht:

<a href=#"><img src="img/vita.png" alt="zum Lebenslauf">Vita</a>

Nein. Es besteht kein Grund, dass Screenreader „zum Lebenslauf Vita“ vorlesen. Das alt-Attribut sollte hier leer sein.

Ist wahrlich kein geeignetes Beispiel, um zu demonstrieren, dass beides Sinn machen kann.

Als Prediger für Barrierefreiheit plädiere ich natürlich dafür, blinde Menschen nicht mit Keywordstuffing zu nerven.

Andererseits kann ich der Versuchung nicht immer widerstehen, aus SEO-Gründen in den alt-Text etwas zu schreiben, wodurch (auch Blinde) meine supertolle Webseite leichter finden können.

So plump wie in dem Beispiel mit Lebenslauf und Vita mache ich das im echten Leben aber nicht und du hast hier im Forum zu recht darauf hingewisen, dass es ein blödes Beispiel ist. So was sollte niemand nachmachen!

Meine Devise ist: sich in andere hineinversetzen und alles zu unterlassen, was ich selber nicht möchte.

Lebenslauf und Vita hintereinander weg vorlesen zu lassen geht zu weit, führt womöglich zu einer hohen Absprung-Rate und ist damit auch aus SEO-Sicht nicht empfehlenswert!

Marc