Alt-Texte sind mir in letzter Zeit mehrmals begegnet. Ein Leser schrieb mir und fragte, ob die Leute sie überhaupt noch benutzen. Er tut es und sagte: „Ich fühle mich allein, wenn ich den guten Kampf führe.“ ALA veröffentlichte eine Erinnerung, wann die Verwendung von Alt-Texten unnötigerweise wiederholend ist. Ich stieß auf dieses Flussdiagramm in den Kommentaren dort. Das A11Y-Projekt hat eine Tippseite dazu. Also dachte ich, es wäre gut für eine Umfrage. Wenn nichts anderes, dann um etwas mehr Aufmerksamkeit zu erregen.
Die Umfrage (in der Seitenleiste der Website) fragt:
Wenn Sie für ein Bild, das für den Inhalt wichtig ist, einen
alt-Text schreiben, dann
- Geben Sie alles: alt=“Ein Diagramm, das zeigt, dass 347.985 Studenten im Jahr 2009 einen Abschluss erworben haben und 15.496 davon in Mathematik. Das sind weniger als 5 %.“
- Tun Sie etwas: alt=“Ein Diagramm, das zeigt, dass 5 % der Abschlüsse in Mathematik sind.“
- Tun Sie wenig: alt=“Diagramm“
- Tun Sie nichts: alt=“” oder gar nichts
Wir werden später eine Zusammenfassung mit weiteren Informationen und allem Interessanten, das wir erfahren, veröffentlichen.
Da es für Screenreader nützlich ist, um Blinden/Sehbehinderten zu helfen, sollten sie definitiv verwendet werden. Mit einem kurzen Satz, der das Bild zusammenfasst, für diejenigen, die es nicht sehen können.
Ich stimme zu, ich mache mir immer noch mehr Sorgen darüber, wie es sich auf Menschen mit Behinderungen auswirkt, als für SEO-Zwecke. Geben Sie alles!
Da Google Webmaster Tools dies dazu sagt, gebe ich alles.
Danke für das Teilen dieses Links! Ich fand ihn sehr interessant.
Hm, ja. Ich sollte anfangen, alles zu geben. Je mehr Kontext etwas auf einer Website hat, desto besser. Ich mag es nur nicht, wenn jemand auf der Seite anhält und wenn seine Maus zufällig über dem besagten Bild schwebt, ihm der gesamte Alt-Text angezeigt wird.
Alt-Text fügt Kontext für SEO-Zwecke hinzu, aber meiner Meinung nach ist er nicht sehr schön.
Danke für den Link-Share.
Sie brauchen eine fünfte Antwort: Verwenden Sie ‚alt=“”‘ und fügen Sie eine textuelle Beschreibung des Bildes im umgebenden Kontext ein.
Einverstanden!
Ich würde die Beschreibung des Diagramms nicht in den Alt-Text aufnehmen. Aus dem Stegreif würde ich
figureundfigcaptionverwenden, es sei denn, Recherchen deuten auf etwas anderes hin.Ich bin mir nicht sicher, ob
alt=“”verwendet werden soll, aber ich würde auf jeden Fall die „echte“ textuelle Beschreibung des Bildes im sichtbaren Seiteninhalt bevorzugen undaria-described-byverwenden.Bildschirmleser-Nutzer sind nicht die einzigen Nutzer, die Ihr Bild nicht sehen können oder von etwas mehr Details profitieren können. Zum Beispiel hosten viele Websites Bilder auf separaten Domänen, die von Unternehmens-Firewalls blockiert werden (z. B. imgur.com: unter der Kategorie Media Sharing gesperrt), und die meisten Browser zeigen Alt-Texte in diesem Szenario überhaupt nicht gut an.
Internet Explorer: Zeigt so viel von dem Alt-Text an, wie in den Bildplatzhalter passt, hängt also von der Größe des Platzhalters und des Alt-Textes ab. Mehr kann im Tooltip platziert werden, aber auch dies ist nicht unbegrenzt.
Firefox: Zeigt so viel von dem Alt-Text an, wie in den Bildplatzhalter passt.
Opera: Zeigt so viel von dem Alt-Text an, wie in die Breite des Bildplatzhalters passt (kein Zeilenumbruch).
Chrome & Safari: Zeigt überhaupt keinen Alt-Text an, wenn das Bild nicht verfügbar ist.
Außerdem kann der Alt-Text-Inhalt nicht formatiert werden, so dass keine Sprach- oder Betonungsänderungen kommuniziert werden können.
Ich neige dazu, ein paar Wörter anstelle eines vollständigen Satzes zu verwenden. Wenn ich jedoch in WordPress arbeite, ist es schön, den vollständigen Titel dort einfügen zu können.
Manchmal verwende ich alt=“ “, da einige Validatoren sich über das leere Tag beschweren.
(Es ist ein geschütztes Leerzeichen und wird hier in ein Leerzeichen umgewandelt.)
Mein Problem ist, dass ich in meinen Arbeiten noch nie „wichtige“ Bilder gezeigt habe, also habe ich es *nie* eilig gehabt, ein
alt-Attribut in meine<img>s einzufügen.Ich denke, ich werde die Umfrage nicht beantworten, um die Ergebnisse nicht zu verfälschen.
Ich konnte den organischen Traffic meines Unternehmens durch Hinzufügen von Alt-Tags zu seinen Bildern in kurzer Zeit um 12 % steigern (ein großer Betrag auf einer Website mit über 120.000 Besuchern/Monat). Diese bestanden normalerweise aus kurzen beschreibenden Sätzen dessen, was das Bild enthielt.
Längere Alt-Tags wären wahrscheinlich angebracht, wenn das Bild eine Infografik oder eine Art Datenvisualisierung ist.
Ja, der Kontext spielt hier auch eine Rolle. Ich würde sagen, mein *Ziel* ist es, „etwas zu tun“ (wofür ich gestimmt habe), aber manchmal ist das Bild so einfach oder so komplex, dass es zu „wenig tun“ oder „alles geben“ wird.
Ich verwende sie und schreibe eine Beschreibung des Bildes oder des Kontexts des Bildes. Mein SEO-Experte hat mir gesagt, ich soll sie verwenden, also tue ich es.
Ich werde im Allgemeinen „etwas tun“. Wenn der Kontext darauf hindeutet, dass ich „alles geben“ sollte, dann werde ich das wahrscheinlich tun. Wenn ein Kunde mich ausdrücklich bittet, „alles zu geben“, dann werde ich das tun. Ich neige auch dazu, das
title-Attribut auf den gleichen Wert zu setzen (normalerweise nur, wenn der Tooltip nicht störend ist, indem er das Bild verdeckt).Ich werde auf „etwas tun“ stimmen. Ich füge kurze beschreibende Texte oder nur einen Titel für das Bild ein. Ja, es hilft auch sehr bei SEO!
Ich mache die mittlere Variante, schreibe genug, um das Bild genau zu beschreiben. Wenn das Bild Text enthält, wie z. B. eine Anzeige, schreibe ich einfach den Text als Alt-Text.
Die A11Y-Tippseite deckt dies ziemlich gut ab. 508 und Barrierefreiheit sind meine Hauptverantwortung in meinem Team und ich arbeite mit diesen einfachen Regeln.
Wenn das Bild dazu dient, Informationen zu vermitteln, geben Sie alles und geben Sie eine vollständige Beschreibung der Informationen, die das Bild vermitteln soll. „Diagramm, das zeigt, dass 98 Prozent der Befragten JavaScript verwenden, 2 Prozent deaktivieren JavaScript.“
Wenn das Bild dekorativ ist und den Inhalt unterstützen soll, geben Sie eine kurze Beschreibung. „Hund sitzt auf einer Veranda.“
Wenn das Bild ein Abstandhalter ist, alt=“Abstandhalter“.
Ich persönlich befürworte nicht alt=“” einfach deshalb, weil Screenreader diese Bilder erkennen. Ich möchte lieber, dass der Benutzer weiß, dass es sich um einen Abstandhalter handelt, und ihn nicht fragen lassen, ob die Programmierer einfach keine Alt-Texte eingefügt haben und er etwas verpasst.
@John
WCAG rät davon ab: F39: Fehler bei Erfolgskriterium 1.1.1 aufgrund der Bereitstellung einer Textalternative, die nicht null ist (z. B. alt=„spacer“ oder alt=„image“) für Bilder, die von assistiver Technologie ignoriert werden sollen.
Sind Sie sicher? Der Link, den ich erwähnt habe (F39) besagt: „Die Bereitstellung einer null Textalternative (d. h. alt=“” oder alt=“ “) ermöglicht es assistiven Technologien, das Bild zu ignorieren […]“.
Ich frage mich, wie viele Leute, abgesehen von Webdesignern, wissen, was ein Abstandhalter ist. Ich glaube, das würde die meisten Leute verwirren.
Ich kann mir ehrlich gesagt keine Situation vorstellen, in der man heutzutage einen grafischen Abstandhalter verwenden müsste….
@Alan, das ist richtig, es wird davon abgeraten, aber wir hatten früher Probleme, bei denen JAWS die Bilder erkannte und die src-Informationen las, und ich spreche nur aus meiner Erfahrung. Das war unsere Abhilfe, bis wir endlich Projekte aktualisiert hatten, um unnötige Bilder zu vermeiden. Natürlich ist es immer noch lustig, Wackligkeiten zu finden, wenn man sich ältere Systeme usw. ansieht. Wir versuchen gerade herauszufinden, warum JAWS Bilder in Dokumenten überspringt (nicht liest), die Alt-Texte haben!
@Hilmon, einverstanden! Es macht Spaß, sich ältere Websites und Systeme anzusehen und sie langsam auf den neuesten Stand zu bringen :)
Sie sollen alt=“” bei Abstandhalterbildern verwenden, damit sie von Screenreadern ignoriert werden. Blinde Nutzer wollen nicht die 6 spacer.gif-Bilder auf einer Website durchlesen.
Da die Google Bildersuche dieses Attribut verwendet und meine Website häufiger in den Suchergebnissen erscheint, wähle ich immer „etwas tun“. Und wissen Sie, laut Statistiken: es funktioniert!
Ich habe keine große Kenntnis über Programmierung, aber es überrascht mich wirklich, dass es möglich ist, zu sehr günstigen Preisen zu üben und mit Codes zu spielen, wenn Sie ein Blogger-Konto haben. Natürlich müssen Sie die Domain ändern zu Ihrer eigenen Domain für diesen Zweck. Es ist also wirklich einfach, einen Blog zu üben oder anzupassen, indem Sie nur 10 $ pro Jahr ausgeben.
Ich schätze jeden Beitrag dieser Seite sehr, denn er ist wirklich hilfreich für einen Anfänger, der gerade anfängt, darüber zu lernen.
Weiter so. Viel Glück!
Ich habe für „alles geben“ gestimmt, muss aber hinzufügen, dass dies (für mich) bedeutet, dass ich Alt-Texte verwende, wie in den Spezifikationen beschrieben: http://www.whatwg.org/specs/web-apps/current-work/multipage/embedded-content-1.html#alt
Was auch Fälle einschließt, in denen alt=„“. Außerdem habe ich, nachdem ich ein Projekt in WordPress abgeschlossen habe, offensichtlich keine Kontrolle mehr darüber, wie der Benutzer Bilder hochlädt. Und sie nutzen den Alt-Text kaum (ich sollte sagen nie).
Ich muss hinzufügen, dass die Beispiele in der Umfrage sehr falsch sind. Alt-Text sollte keine Beschreibung des Bildes sein, sondern ein Text, den man (wie in den Spezifikationen angegeben) geschrieben hätte, wenn man kein Bild eingefügt hätte.
Der Text, der anstelle dieses Diagramms geschrieben würde, sind genau die Daten, die das Diagramm enthält. Wie ist „sehr falsch“?
@Chris: Es kommt auf den Kontext an. Aber die Idee ist, dass der Alt-Text natürlich mit dem umgebenden Text fließt und nicht genau die Daten sind, wie sie im Bild dargestellt sind. In diesem Fall kenne ich den Kontext nicht (er ist nicht angezeigt), aber ich bezweifle, dass der von Ihnen verwendete Text gut fließen würde. Ich würde etwas wie das Folgende vermuten: „Die Forschung ergab, dass 347.985 Studenten im Jahr 2009 einen Abschluss erworben haben und 15.496 davon in Mathematik. Das sind weniger als 5 %.“ und nicht „ein Diagramm…“. Die Tatsache, dass es in einem Diagramm gezeigt wird, sind keine Informationen für einen blinden Benutzer.
Der Hauptpunkt ist, dass dieser Text mit den Zeilen davor und danach im tatsächlichen Text natürlich fließt. ALT-Text ist eine textuelle ALTERnative zu einem Bild, keine Beschreibung des Bildes.
Ich möchte darauf hinweisen, dass ich nicht sagen wollte, dass die Formulierung „sehr falsch“ ist, sondern dass die Wahl des Beispiels falsch ist. Ein Diagramm ist normalerweise nur eine Randbemerkung zum Haupttext, daher wäre ein Alt-Text in den meisten Fällen nicht erforderlich (das Diagramm ist einfach eine visuelle Hilfe zur Erklärung des umgebenden Textes).
Ein besseres Beispiel wäre (zum Beispiel) eine Fotografie in einem Artikel.
@ Chris – Ich warte darauf, dass Sie meinen früheren Beitrag moderieren, der Links enthält, die erklären, warum er „falsch“ ist. Die Datenmenge in einem Bild, das so komplex wie ein Diagramm ist, übersteigt bei weitem einen nützlichen Alt-Text: Es gibt einen Grund, warum ich mich lange und hart für die Beibehaltung von
longdescin HTML5 eingesetzt habe. Andernfalls könnten Sie aucharia-describedbyverwenden (unter bestimmten Bedingungen und mit einigen Vorbehalten).Eine „Zusammenfassung“ eines Diagramms („5 % der Nutzer sind Foobar“) als Alt-Text lässt die restlichen 95 % bequem aus. …
Ein weiterer wichtiger Punkt ist, dass ALT-Text niemals aus dem Kontext gerissen werden sollte, ein Punkt, den wir bei Ihrer aktuellen Umfrage nicht beurteilen können.
Danke, dass Sie diese Konversation am Laufen halten, denn das Verständnis, wie man effektiven und nützlichen Alt-Text schreibt, ist tatsächlich einer der schwierigsten Aspekte der Web-Barrierefreiheit. Je mehr wir darüber sprechen, desto mehr können andere beginnen zu verstehen, wofür ALT wirklich gedacht ist.
Ich musste vor einiger Zeit überlegen, wie ich Diagrammdaten für Screenreader-Nutzer vermitteln kann. Das Diagramm verwendete jQuery Flot, um Hypothekenzahlungen über den gewählten Zeitraum anzuzeigen. Unabhängig von der verwendeten Technologie stimme ich zu, dass das ALT-Attribut für diesen Zweck nicht geeignet ist.
Meine Lösung war, die Daten in eine Tabelle zu schreiben, die außerhalb des Bildschirms ausgeblendet war. Die Tabellenzusammenfassung gab eine kurze Beschreibung des Diagramms, z. B. „Hypothekenzahlungen über einen Zeitraum von 25 Jahren“, und enthielt alle auf dem Diagramm dargestellten Daten. Ich mag die Idee nicht, einigen Nutzern alle Informationen und anderen einen Schnappschuss davon zu geben, besonders wenn die Daten im Diagramm leicht tabellarisch dargestellt werden können.
Bei Inhaltsbildern muss meines Erachtens überlegt werden, welche Auswirkungen es hat, „Bild eines Mannes mit Hund“ für jemanden, der einen Screenreader verwendet, einzuschließen. Ich fülle selten ALT-Attribute für Inhaltsbilder aus, es sei denn, sie stellen etwas dar, das nicht durch den zugehörigen Inhalt repräsentiert wird.
Übrigens kann dieses Argument auf das TITLE-Attribut angewendet werden, insbesondere wenn es auf A-Tags angewendet wird.
Wenig oder nichts. Ich bin mir über die Auswirkungen nicht sicher.
Ich arbeite jedoch an den Titelattributen.
Prost.
Meine Vermutung, noch bevor ich die Ergebnisse überprüfe, war, dass „etwas tun“ die überwältigende Wahl in dieser Umfrage sein würde. Das mache ich. Jedes Mal, wenn ich das Alt-Text-Feld in WordPress sehe, nachdem ich etwas hochgeladen habe, denke ich an dieses kleine blinde Mädchen, das versucht, Wissen im Internet zu erlangen, und mein Herz geht ihr nach, also beschreibe ich, was im Bild vor sich geht.
Ich habe einen interessanten Artikel über Alt-Texte gelesen, und wann sie überflüssig werden können – http://alistapart.com/blog/post/on-alt-text
Das ergibt Sinn, aber ich frage mich, ob es gültig ist?
Die meisten Bilder, mit denen ich arbeite, werden dynamisch für einen trivialen programmatischen Zweck erstellt, und ich tue alles, was ich kann, um reine CSS für visuelle Dinge zu verwenden.
Also… ich habe mich irgendwie vom Alt-Feld zurückgezogen.
Diese Kommentare zu lesen, hat mich dazu gebracht, es wieder benutzen zu wollen.
Die Formulierung Ihrer Umfrage enthält einen grundlegenden Fehler, den ich und andere AT-Nutzer, sowohl akustisch als auch per Braille, unnötig wortreich finden: Wir müssen nicht wissen oder wollen nicht wissen, welche Art von Bild (Diagramm, Foto usw.) es ist.
Ich kann verstehen, wie bei „Ein Foto von George Clooney, der schnieke aussieht“ das „Ein Foto“ ziemlich nutzlos ist. Aber ich dachte, als ich diese „Ein Diagramm“ machte, könnte das ein guter Anfang sein, da anderswo im Text auf das Diagramm Bezug genommen werden könnte und es auch so etwas wie heißt: „Warnung: Gleich kommen sehr spezifische Zahlen.“
Auch das ist die Meinung eines blinden Benutzers. Sie können Ihre Barrierefreiheitsentscheidungen nicht auf die Meinung eines behinderten Benutzers stützen.
Ich denke, Sie sollten angeben, ob es sich um ein Diagramm, ein Tortendiagramm, ein Gemälde, einen Comic usw. handelt. Sie müssen offensichtlich nicht „Bild“ sagen, aber wenn Sie sagen wollen, dass es sich um ein „Foto“ handelt, dann machen Sie das ruhig.
@Paul: Vergleichen Sie Folgendes. Dies ist der Text einer Seite, wie er von einem Screenreader vorgelesen wird. Der ALT-Text ist in eckige Klammern gesetzt. Um die volle Wirkung zu erzielen, lesen Sie die Beispiele laut vor.
Dies ist redundant und leicht informationslos.
Besser wäre kein Alt-Text
Dies gibt immer noch alle Informationen, ohne den Leser abzulenken. Ein weiteres Beispiel
Der Text „stottert“ und fließt nicht natürlich. Außerdem ist die Beschreibung informationslos.
Besser wäre
Dies beschreibt das Bild (ohne die redundante Information, dass es sich um ein Bild handelt) und lässt die Geschichte fließen und macht sie somit leichter verständlich.
Tatsächlich, Paul, ich bin nicht nur „ein blinder Benutzer“. Ich bin ein registrierter blinder Webentwickler, der im Bereich Barrierefreiheit arbeitet und regelmäßige Testsitzungen mit Gruppen von behinderten Nutzern, einschließlich Screenreader-Nutzern wie mir, durchführt. Das ist also viel mehr als „die Meinung eines behinderten Benutzers“.
Hallo Ade, sind Sie registrierter Blinder oder registrierter Webentwickler? Mir sind keine registrierten Webentwickler bekannt. Zumindest nicht in den USA.
Sagen Sie also, dass es Ihnen und all den anderen blinden Screenreader-Nutzern, mit denen Sie Testsitzungen durchgeführt haben, egal ist, ob ein Bild ein Diagramm, ein Tortendiagramm, ein Schwarz-Weiß-Foto, ein Gemälde, eine Aquarellmalerei usw. ist? Das fällt mir schwer zu glauben, und meiner Meinung nach ist es einfach Ihre Meinung ;)
WebAIM.org hat viel mehr Tests mit Screenreader-Nutzern durchgeführt als Sie, da bin ich mir sicher, und sie empfehlen, je nach Situation kontextbezogene Informationen über das Bild hinzuzufügen.
http://webaim.org/techniques/alttext/#context Sehen Sie Beispiel 4 mit alt=“Gemälde von George Washington, der den Delaware River überquert“ als Empfehlung.
Und ein weiteres Beispiel von WebAIM (die das schon VIEL länger machen als ich). http://webaim.org/techniques/images/alt_text#adding Die Empfehlung für ein Porträtgemälde ist alt=“Porträt von Silvia Alvarez“.
FYI zur Zeichenanzahl von Alt-Texten http://www.washington.edu/accessit/articles?1257
Sie würden sich wundern, wie schlecht die Unterstützung für Alt-Texte in E-Mail-Clients ist – einige Versionen von Outlook fügen Ihrem gesamten Alt-Text eine riesige Haftungsausschlussklausel zu jedem Bild voran… Sie könnten genauso gut nichts schreiben.
Das ist schade, denn Menschen, die E-Mails eher ohne Bilder betrachten, könnten die Bedeutung von Alt-Texten in diesem Bereich etwas mehr glänzen lassen.
In der Tat. Ich war gerade dabei, das zu posten, als ich Ihre Nachricht sah
http://www.campaignmonitor.com/blog/post/3280/displaying-and-optimizing-alt-text-in-popular-email-clients/
Ich habe von den Vorteilen gehört, die es Ihnen für SEO bringen kann.
Also versuche ich immer, es zu benutzen, selbst wenn es nur minimal ist.
Da es Bildverkehr bringt, warum nicht!
Also, was soll ich für ein Alt-Tag einsetzen, wo ich auf meiner Website Bilder von geschäftlichen Händedrucken und Glasgebäuden verwende? Sollte das für das Bild relevant sein oder für den Inhalt?
Es hängt (muss) vom Kontext des Bildes ab… wenn die Informationen bereits im Text vorhanden sind, ist es nutzlos, sie im Alt-Attribut zu wiederholen.
Sie haben
<figure>und<figcaption>nie erwähnt. Ist das Absicht? Es scheint, als wären diese für diese Diskussion ebenfalls absolut relevant.Ich bin überrascht, dass der ALA-Artikel (und dieser) nichts über SEO sagt. Ob es einen Unterschied für die Barrierefreiheit macht, ist mir egal, aber ich schreibe immer Alt-Texte für jedes Bild, da dies den Suchmaschinen ermöglicht, eine gewisse Semantik auf das Bild anzuwenden.
Große Auslassung.
Alt-Text ist nicht der einzige Faktor für SEO-Bilder: http://support.google.com/webmasters/bin/answer.py?hl=en&answer=114016
Ich wähle – Nichts tun: alt=“” oder gar nichts – weil visuell alles sagt :)
Mohamad, obwohl die visuelle Seite fast alles ausmacht, werden einige Leute die Website mit Sehbehinderungen betrachten und eine Audiobeschreibung benötigen. Für diese Leute ist ein
alt-Tag notwendig, auch nur ein kurzer Satz, aber nichts zu tun zeigt nur Faulheit.Wenn Sie nur das Bild allein geben, was ist es dann für die Suchmaschinen? Wenn für die Leute, ich denke, es ist ziemlich klar. Wenn Sie Faulheit sagen, ändere ich besser meine Wahl auf wenig tun: D
Entschuldigung! Ich versuche zu überlegen, was Sie meinen könnten, aber ich verstehe es einfach nicht. Daher könnte ich weit davon entfernt sein, Ihre Frage zu beantworten…
Wenn ein Bildelement keinen Alt-Attributtext hat, kann eine Suchmaschine das Bild immer noch indizieren, indem sie
Sein Dateiname (aus seiner URL).
Inhalt von den Seiten, auf denen das Bild erscheint.
Text, der in Links zum Bild verwendet wird.
Metadaten in der Bilddatei.
Ergebnisse aus der Durchführung von Optical Character Recognition über das Bild.
Vorhandene Informationen, die aus Bildern gewonnen wurden und als Duplikat oder ähnlich berechnet werden.
Ergebnisse aus Crowd-Sourcing-Beschreibungen der Bilder.
Es sind ja nicht NUR Suchmaschinen (obwohl ich dachte, dass es lohnenswert wäre, wenn Ihre Bilder auf der ersten Seite der Bildersuche für alles Relevante erscheinen würden?) Für meine Kunden ist es das jedenfalls!
Aber der andere Punkt, den wir machen, ist, dass Menschen, die das Bild wegen Sehbehinderungen nicht sehen können, auf gute ALT-Texte angewiesen sind, damit ihr Screenreader das Bild beschreibt.
Suchmaschinen können ein Bild nicht lesen, daher lesen sie den Alt-Text, um den Inhalt zu erfassen. (Besserer Inhalt, bessere Rankings)
Außerdem werden alle, die einen Screenreader verwenden, den Alt-Text vorgelesen bekommen.
Persönlich sehe ich keinen Grund, warum jemand die Alt-Tags weglassen sollte??
Stimme voll und ganz zu!
Einverstanden! Als UX-Designer setze ich mich für Alt-Texte für Bildschirmlesefunktionen, für Benutzer in Netzwerken mit Firewalls und für SEO-Zwecke ein.
Meine Stimme: Etwas tun
Grund: Mindestens ein einzeiliger Alt-Text macht für das Bild mehr Sinn, und es ist auch gut, da es manchmal in Bildsuchmaschinen gecrawlt wird. Mein Votum ist also: Etwas tun!
Ich finde, dass Bildschirmleser ein kleineres Publikum darstellen als beispielsweise ältere Versionen von IE, aber einige Leute hier machen Alt-Texte und kümmern sich nicht darum, Änderungen für andere Browser vorzunehmen.
Ja, aber bestrafst du lieber jemanden, der veraltete Browser verwendet, oder jemanden mit einer Sehbehinderung?
Ich wähle lieber die Bestrafung derer, die veraltete Browser verwenden :p
Ein Bestandteil wichtiger Suchmaschinen ist die „Bildersuche“. Es ist nur sinnvoll, einen kleinen Aufwand zu betreiben, um vollständig optimiert zu sein.
Wow, schon zu viel Betonung auf SEO!
Content-Autoren haben ursprünglich keinen Alt-Text für SEO verwendet. Suchmaschinen haben Alt-Text indiziert, weil er etwas war, das Content-Autoren bereits verwendeten.
Wenn jeder Alt-Text vernachlässigen (oder missbrauchen) würde, würden Suchmaschinenentwickler andere Wege finden, Bilder zu indizieren, was sie bereits tun.
Wahr, aber warum etwas ändern, das bereits vorhanden ist und funktioniert?
Außerdem sind es nicht nur SEO, es sind die Bildschirmleser, die auf ALT-Text angewiesen sind. Erwarten Sie, dass sie sich alle anpassen, nur weil sich einige Leute nicht darum kümmern, ALT-Text zu schreiben?
Was ist bereits vorhanden und funktioniert? Das Alt-Attribut? Ich glaube nicht.
Wenn Sie sich wirklich um SEO kümmern würden, würden Sie Image-Sitemaps verwenden und Suchmaschinenalgorithmen nicht hinterfragen. Dies stellt sicher, dass die Leute Ihre Bilder finden, wenn sie relevant sind, und nicht zufällig. Sie können Ihre Bilder auch mit reichhaltigeren Daten versehen, z. B. Geolocation.
Wenn Sie möchten, dass ein Bild für möglichst viele Benutzer zugänglich ist, sollten Sie sich nicht auf das Alt-Attribut verlassen, da der Inhalt verborgen ist. Die Unterstützung ist in Hilfsmitteln gut, aber die Browserunterstützung ist schockierend. Wenn der Bilddownload aus irgendeinem Grund fehlschlägt, haben normale Benutzer einen sehr schlechten Ersatz, wie in meinem früheren Kommentar behandelt.
Es ist doch kein Hinterfragen? Der Link, den Sie zuvor von Google gepostet haben, sagt, man soll guten ALT-Text in einem Bild verwenden?
Ich habe nie gesagt, dass es das Einzige ist, was man tun sollte. Ich habe nur gesagt, dass es verwendet und gut verwendet werden sollte!
Mein Punkt ist, dass das Alt-Attribut nicht für SEO gedacht ist (d. h. die HTML-Spezifikation sagt nicht, dass es dafür existiert). SEO sollte nie die Motivation für die Bereitstellung von Alt-Text sein.
Da Alt-Text „alternativer Text [sein soll, der] geschrieben werden kann, indem man berücksichtigt, was man geschrieben hätte, wenn man das Bild nicht hätte einfügen können“, bezweifle ich, ob man qualitativ guten Alt-Text liefern kann, wenn die Zielgruppe Suchmaschinen sind.
Es ist auch nicht nur für Bildschirmleser gedacht; Bildschirmleser sind nur ein Beispiel (das beste Beispiel, da Alt-Text in einem Bildschirmleser tatsächlich gut zu funktionieren scheint).
Wenn Ihr Grund für die Bereitstellung von Alternativtexten für Benutzer ist, die Ihr Bild nicht sehen können, gibt es praktischere, effektivere und inklusivere Techniken als die Verwendung des Alt-Attributs, da diese Annahmen falsch sind.
1. Jeder, der ein Bild nicht sehen kann, kann Alt-Text leicht sehen.
2. Jeder, der Bilder sehen kann, wird sie alle leicht verstehen und nie etwas Wertvolles im Alternativtext finden.
Ich denke jedoch nicht, dass das Alt-Attribut komplett leer sein sollte. Wenn ein Autor auf ein Bild verweisen muss, werden AT-Benutzer es zu schätzen wissen, wenn es eine gewisse Angabe gibt, dass ein Bild auf der Seite vorhanden ist.
Hallo Chris,
Nachdem ich hunderte von Wörtern hierzu bei ALA geschrieben habe (5 Links dort), nähere ich mich dem Thema jetzt mit einiger Ermüdung. Es ist äußerst wichtig zu verstehen, welche ROLLE das Alt-Attribut spielt, und auch die „Ausführlichkeit“ von Bildschirmlesern bei der Begegnung mit Bildern zu berücksichtigen.
Als extrem allgemeine Faustregel wende ich die Regel „so kurz wie möglich“ an, wann immer es möglich ist, und würde daher in Ihrer Umfrage Folgendes schreiben: alt=“Diagramm: 5 % der Abschlüsse sind in Mathematik.“
Ich bitte Sie und andere dringend, die Kommentare bei ALA zu lesen – das ist wichtig.
Danke!
JF
Hallo Chris, du musst für ALLE Informationen innerhalb des Diagramms eine Textalternative bereitstellen. Die einzig richtige Antwort in deiner Umfrage ist: Mach alles: alt=“Ein Diagramm, das zeigt, dass 347.985 Studenten im Jahr 2009 einen Abschluss erworben haben und davon 15.496 in Mathematik. Das sind weniger als 5 %.“.
Auch wenn dies nicht die beliebteste Wahl in der Umfrage ist, ist sie korrekt. Die beliebteste Wahl in der Umfrage ist, bestimmte Daten vom Bildschirmleser-Benutzer auszuschließen. Zugänglichkeitsentscheidungen können nicht durch Beliebtheitswettbewerbe getroffen werden. In Wirklichkeit ist die einzige Option für Zugänglichkeit, GLEICHEN Zugang zu bieten.
Alle Informationen, insbesondere alle textlichen Informationen innerhalb eines Bildes, benötigen eine Textalternative. Sie können entscheiden, wie Sie damit umgehen, indem Sie eine Textalternative im Alt-Attribut bereitstellen, wenn es passt, oder die Textalternative in einer Datentabelle unter dem Bild bereitstellen und dann diese Textdaten programmatisch mit dem Bild mit aria-describedby verknüpfen.
Es wäre wahrscheinlich am besten, eine Datentabelle als Textalternative zu verwenden, damit alle Benutzer die Daten für andere Zwecke kopieren/einfügen können. Mit einem Bild nicht möglich.
Wie aus der Diskussion hervorgeht, gibt es einige Meinungsverschiedenheiten unter denjenigen, die Richtlinien für bewährte Praktiken anbieten. Ich bin ermutigt durch viele Kommentatoren, die versuchen, zumindest einige beschreibende Informationen bereitzustellen. Es fällt mir etwas schwer, das spezifische Beispiel zu kommentieren, da kein tatsächliches Bild vorhanden ist. Nichtsdestotrotz sollten einige Dinge beachtet werden. Als Nutzer eines Bildschirmlesers und als jemand, der Bildschirmleser-Interaktionen studiert hat, kann ich mehrere Beobachtungen machen:
1. Der Alt-Text sollte relativ kurz sein. Zum Beispiel: „Foto einer Frau, die ein Kind hält.“ Er sollte nicht sein: „Foto einer großen, dunkelhaarigen Frau in einem grünen Kleid mit passenden Augen, die ein Kind hält, eingewickelt in eine gelbe Decke.“ Obwohl die zweite Art und Weise viel mehr Informationen liefert, wird sie wahrscheinlich ablenkend sein. Die vermittelten Informationen sollten kontextbezogen sein.
2. Verwenden Sie die Attribute Longdesc oder ARIA-describedby, um die Art von langen Beschreibungen bereitzustellen, die ich im obigen Beispiel vorgeschlagen habe, falls erforderlich. Longdesc ist meiner persönlichen Meinung nach der beste Weg.
3. Bitte verwenden Sie das Title-Attribut nicht als Ersatz für Alt. Aus vielen Gründen ist es nicht effektiv. Der wichtigste Grund ist, dass das Title-Attribut dazu bestimmt ist, einen Tooltip bereitzustellen. Darüber hinaus behandeln Bildschirmleser das Title-Attribut nicht auf die gleiche Weise wie Alt. Alt wird konsistent angezeigt und vorgelesen.
4. Oft können Datentabellen und anderer Kontext dem Leser zusätzliche Informationen liefern. Bedenken Sie, dass Schreiben eine subtile Kunst ist, bei der Bilder eine wichtige Rolle spielen, aber nicht das A und O der Darstellung sind. Menschen mit kognitiven und/oder Lernschwierigkeiten werden Ihre Präsentation auch ansprechend finden, wenn Sie mehr Kontext bieten.
5. Infografiken sollten niemals allein ohne Kontext, Interpretation und Beschreibung verwendet werden.
6. Dekorationsbilder können Sie überspringen. Wenn Sie sie einfügen, versuchen Sie, dies über CSS zu tun, damit sie nicht Teil des Inhaltsflusses sind. Wenn Sie ein Stockfoto oder eine andere Art von Bild einfügen, überlegen Sie, warum Sie es einfügen. Welche Bedeutung möchten Sie vermitteln? Liefert die Beschreibung dieses Bildes wichtige Informationen oder erhöht sie den Genuss Ihres Inhalts? Genauso wie Sie Stockfotos zur Verbesserung der visuellen Wirkung einfügen, sollten Sie einen kurzen Alternativtext für Benutzer in Betracht ziehen, die Ihren Inhalt nicht anzeigen.
Ich schäme mich zu sagen, dass ich meistens wenig bis gar nichts tue. Ich werde besser!
Ich mache etwas oder mache alles. Es hängt davon ab, wie wichtig die Informationen in der Grafik sind.
„Weniger tun“ mit Bedacht
Nur wenn das Bild Inhalte darstellt, die für sehbehinderte Menschen verloren gehen würden, füge ich einen Alt-Wert hinzu.
Wenn das Bild nur für Verzierungen oder Design ist, niemals.
Wenn das Bild Worte hat, aber immer noch nicht unbedingt notwendig ist, um den Inhalt zu verstehen, werde ich zumindest den Inhalt der verlorenen Worte hinzufügen.
Zufällige Stockfotos, die an Artikeln angehängt sind (die fast nie etwas zum Inhalt beitragen): leeres Alt-Attribut.
Was SEO angeht – bah. Wenn Sie Bild-Alts nutzen, um Ihre Rankings zu verbessern, gibt es andere größere Probleme mit Ihrem Inhalt.
Sonderhinweis: Ich verwende nie „Bild von“ oder Ähnliches in meinen Alt-Tags, da die Bildschirmlesersoftware bereits angibt, dass es sich um ein Bild handelt. Stellen Sie sich vor, Sie hören „Bild: Bild von…“ bei jeder Instanz eines Bildes (insbesondere bei denen, die für Designverzierungen gedacht sind: „Bild: Bild von grünem Gras Stockfoto“ oder „Bild: Bild von Speedboot, das über Wellen rast.“).
Sehr gute Artikel
Leider verwenden die meisten nur alt=“” zur Validierung oder ein wenig mehr, nur wenn sie danach gefragt/vom Kunden verlangt werden.
Lustig, am Anfang des Webs gab es Spezialisten. Dann kamen „multiskillierte“ (im Gegensatz zu nur multitaskingfähige) Individuen. Dann wurden die Bereiche irgendwie verschwommen, um anzunehmen, dass jeder mit HTML-Kenntnissen etwas über Backend-Technologien, Serverkonfiguration, IT usw. wissen sollte. Front-End-Entwickler begannen, in das Territorium von Back-Endern einzudringen, weil die, die es nicht wussten, so viel vom Titel „Front-End-Entwickler“ annahmen. Kommen wir gar nicht erst zu Webdesigner vs. Webentwickler vs. Interaktionsdesigner.
In den letzten Jahren sind die Spezialisten wieder aufgetaucht, hauptsächlich aufgrund der Diskussion zwischen dem, was UI im Gegensatz zu UX ist. Barrierefreiheit wird jetzt zu einem Stichpunkt auf Lebensläufen, zusammen mit „UI/UX“-Erfahrung. Oh, vergessen wir nicht den „Content-Spezialisten“ oder den „Usability-Experten“ (sollte das nicht einfach zu einer UX-Person gehören?).
Abgesehen von Drupal- und WordPress-Leuten sind die Back-Ender jedoch größtenteils von all dem verschont geblieben. Vielleicht zu Recht, aber die Ausgabe von Code sollte sicherlich auch von Belang sein, wo all dieser schöne, validierte Code durch ein CMS verschmiert wird, nur wegen eines netten Features oder um es den „Marketingleuten einfacher zu machen, Änderungen vorzunehmen“.
Wir alle haben in erster Linie einige Erfahrungen als Nutzer. Dann erwerben wir Erfahrung und Fähigkeiten als „Webmenschen“, nenne ich sie mal.
Alt-Tags haben sich seit meiner Anfängen im Web-Bereich 1997 nicht viel verändert. Sie beschreiben Inhalte oder identifizieren eine Grafik, wenn erstere nicht zutrifft. Vielleicht beides manchmal.
Auf jeden Fall scheint es, dass, was auch immer die Hauptfähigkeit einer Person ist, dies das Thema sein wird, das „dem Experten überlassen werden sollte“, um es zu kommentieren, zu regeln oder zu implementieren.
Ich denke, alles, was zählt, ist, ob Ihr Publikum die Informationen leicht und dort zugreifen kann, wo es sie soll oder muss, dann haben Sie Erfolg. Kommunikation ist immer noch wichtiger als Technologie und sicherlich Standards jeglicher Art. (und ja, ich erkenne an, dass „Standards“ dazu dienen sollen, die gerade erwähnte Kommunikation zu gewährleisten).
Ich verwende immer einen kleinen beschreibenden Text im Alt-Attribut. Nicht zu beschreibend, nur ein kleiner effektiver Text, der beschreibt, was im Bild passiert. Wie ‚Eine Katze, eingeklemmt zwischen einem Eisengitter‘.
Es ist einfach ein bisschen sauberer, wenn plötzlich Ihr Bild stirbt.
Mann. Ich habe immer vor, Alt-Texte zu erstellen, aber ich habe normalerweise so wenig Zeit, dass ich es nie tue. Ich glaube, es ist wichtig für Bildschirmleser, daher sollte es so gründlich wie möglich verwendet werden.
Es sei denn, Sie haben einen Kunden, der darauf besteht, dass er seinen Vertrag mit Ihrer Agentur kündigt, wenn die Website nicht in der nächsten Stunde online ist. Dann können Sie es für später aufschieben.
Ich würde alles tun, es sei denn, dasselbe wäre im umgebenden Text beschrieben worden. Für Bilder, die eher dekorativ sind, würde ich wenig tun oder etwas tun, und für Bilder, die nur dazu da sind, hübsch auszusehen, würde ich wahrscheinlich nichts tun.
Ich bin mir wirklich nicht sicher, warum man keine Alt-Tags verwenden sollte, das ist ziemlich schlecht. Sie sollten Websites so bauen, dass jeder sie nutzen kann und niemanden diskriminiert, weil er eine Behinderung hat. In einem Extremfall (zumindest in der EU) könnten Sie sogar gegen das Gesetz verstoßen oder verklagt werden!
Schauen Sie, was das Royal National Institute of Blind People (RNIB) dazu sagt: http://www.rnib.org.uk/professionals/webaccessibility/designbuild/wacimages/Pages/alt_text.aspx
Bezüglich langer ALT-Texte
„ALT-Texte für Bilder sollten auf ein Minimum beschränkt werden, ohne wichtige Informationen auszulassen. Dies betrifft normalerweise Bilder, die lange Textpassagen, Diagramme, Grafiken und Karten enthalten.
ALT-Texte sollten prägnant und auf den Punkt gebracht sein. Wenn mehr als ein Wort verwendet wird, sollten Schlüsselwörter am Anfang des ALT-Textes stehen, um ihn deutlicher zu machen. Typischerweise hört ein Bildschirmleser-Benutzer nur auf das erste Wort oder die ersten paar Buchstaben des ALT-Textes, um die Bedeutung zu erfassen. Wir empfehlen, dass die maximale Länge nicht über einen kurzen Satz hinausgeht.“
(Ihre Website ist eine wirklich gute Ressource für den Bau barrierefreier Websites.)
Ich denke, dass der ALT-Text nur dann relevant ist, wenn er Schlüsselwörter enthält, die auf der Webseite verwendet werden. So versteht Google die Verbindung zwischen ihnen.
(Entschuldigung für mein schlechtes Englisch)
Sie haben die richtige Antwort aus der Liste der Optionen vermisst, nämlich: „Das hängt ganz davon ab, was sonst noch auf der Seite steht“.
Wenn dieses Diagramm das Einzige auf der Seite ist, dann machen Sie alles: Wenn das Bild tausend Worte wert ist, brauchen Sie die tausend Worte. Wenn das Diagramm jedoch neben Text steht, der die Daten detailliert und erklärt, ist es rein illustrativ und leerer Alt-Text ist angebracht.
Wenn ich die Formulierung der Frage als den ersteren Fall interpretiere, dann ist es fraglich, ob die Option „alles tun“ oder die Option „etwas tun“ angemessen ist, und das hängt vom Publikum und davon ab, wie rigoros die Erklärung der Botschaft sein muss.
Alles in allem wird die Option alt=„Diagramm“ nie angemessen sein. Sie fügt keinen Wert hinzu, aber sie fügt Rauschen hinzu.
Das Wichtigste, woran man sich erinnern muss, ist dies: Die Seite als Ganzes muss den gleichen Gesamtwert an Bedeutung haben, ob sie von einem Bildschirmleser oder von einem grafischen Browser gelesen wird. Nicht mehr, nicht weniger.
Natürlich wäre die ideale Lösung für dieses Beispiel tatsächlich, eine Datentabelle als Alternative im Dokument anzubieten, auch wenn Sie diese nicht auf dem Bildschirm für voll sehende Benutzer anzeigen. Es ist ein gutes Beispiel dafür, warum Alt-Text nicht immer die beste Alternative zu einem Bild ist.