John Mueller von Google und Lizzi Sassman erörtern das Erstellen von Alternativtext für Bilder Das ist gut für diejenigen, die Screenreader verwenden, und kurz ansprechen, was mit dekorativen Bildern zu tun ist und wie schwierig es ist, Alt-Text zu schreiben, der das Gleichgewicht zwischen SEO und Barrierefreiheit findet.
Contents
Alt-Text dient der Barrierefreiheit &Ampere; SEO?
Laut dem World Wide Web Consortium (allgemein als W3C bezeichnet), dem offiziellen Gremium für HTML-Standards, besteht der Zweck des Alternativtexts für Bilder darin, Bilder für Website-Besucher verständlich zu machen, die keine Bildinhalte anzeigen können und Bildschirmleseprogramme verwenden.
Alt-Text hilft auch denjenigen, die Screenreader verwenden, den Zweck des Bildes zu verstehen oder sich des Textes im Bild bewusst zu werden.
Das W3C sagt auch, dass Alt-Text auch einen SEO-Zweck hat .
In der Anleitung heißt es:
„…wenn Sie möchten, dass Ihre Website so gut indexiert wird, wie sie es verdient, verwenden Sie das alt-Attribut, um sicherzustellen, dass wichtige Abschnitte Ihrer Seiten nicht übersehen werden.“
Der Zweck von Alt-Text besteht darin, Bilder für diejenigen verständlich und zugänglich zu machen, die das Bild nicht sehen können, was Suchmaschinen-Bots einschließt.
Es erfordert überraschend viel Nachdenken, um den Alt-Text richtig hinzubekommen . Das W3C hat ein Alt-Text-Tutorial für sieben verschiedene Arten von Bildkontexten veröffentlicht.
Sagen Sie nicht, dass ein Bild ein Bild ist
Während SEO möglicherweise verlangt, dass der Alt-Text eines Screenshots besagt, dass das Bild ein Screenshot ist, wird es aus Gründen der Barrierefreiheit als überflüssig angesehen (und lästig, das an einer Stelle zu schreiben Bild ist ein Bild).
Lizz Sassman und John Mueller erörtern den Umgang mit diesem Problem:
“Also eine der Best Practices ist es nicht jedes Bild mit einem Screenshot von zu beginnen, ein Screenshot von, denn dann wiederholt es sich einfach.
Wir sind uns bereits bewusst, dass es sich um ein Bild handelt. Sie brauchen nicht zu sagen: ‘Es ist ein Bild von’ und dann das Ding.
Starten Sie einfach mit der Beschreibung ein. Und es muss auch nicht unbedingt ein ganzer Satz sein, denke ich.
John Mueller: Ja.
Lizzi Sassman: Es könnte auch nur ein beschreibender Satz sein. Es muss kein vollständiger Gedanke sein, denke ich.“
SEO-Anforderungen mit Zugänglichkeit in Einklang bringen
John Mueller führt in das Thema der Spannung zwischen der traditionellen SEO-Praxis in Bezug auf Bild-Alt-Text und Barrierefreiheitsanforderungen ein.
Mueller fuhr fort:
„John Mueller: Ja, ja. Ich denke, das macht sehr viel Sinn.
Ich meine, der knifflige Teil besteht wahrscheinlich darin, die beiden Seiten auszubalancieren. Die Art des Zugänglichkeitsaspekts. Was Leute von Alt-Text für Barrierefreiheit erwarten.
Und dann der SEO-Aspekt, bei dem Sie einige Dinge wie… Traditionell würden Sie einige Dinge tun, die etwas anders sein könnten.
Zum Beispiel würden Sie eine Reihe von Synonymen auflisten.
Wie: „Oh, das ist ein Strand am Ozean mit Wellen.“
Und das ist die Art von Dingen, bei denen es aus SEO-Gründen manchmal sinnvoll ist, dies im Alt-Text zu tun, aber wahrscheinlich nicht aus Gründen der Barrierefreiheit.
Und dieses Gleichgewicht zu finden, ist manchmal etwas schwierig.
Also ist es gut, darauf zu achten.“
Etwas ist besser als nichts
Ein wichtiger Punkt bei Bild-Alt-Text ist, dass es eine schlechte Praxis ist, das Feld für alternativen Text leer zu lassen.
Ein Grund dafür ist, weil Screenreader könnten beginnen, die Bilddateinamen zu lesen, was eine negative Benutzererfahrung darstellt.
Ein weiterer Grund ist, dass Besucher, die Screenreader verwenden, keine wichtigen Informationen erhalten, die möglicherweise in einigen der Bilder enthalten sind.
Dann gibt es SEO-Überlegungen in Bezug auf Alt-Text und dafür, dass Bilder richtig indexiert und in der Suche gefunden werden.
John Mueller empfiehlt, dem Alt-Text etwas hinzuzufügen, weil etwas besser ist als nichts.
Er schlug vor:
„John Mueller: Aber wenn Sie zum ersten Mal Alt-Text hinzufügen, dann ist manchmal sogar jeder Alt-Text besser als gar nichts .
Lizzi Sassman: Wie nichts.
Zumindest mit etwas anfangen, aber was kann man dann noch tun, um sich darüber hinaus noch zu verbessern.“
Alternativer Text und dekorative Bilder
Lizzi Sassman erörterte als Nächstes, was mit dekorativen Bildern zu tun ist.
Das erste Problem besteht darin, zu unterscheiden, ob ein Bild wirklich dekorativ ist oder nicht ob es konzeptionell ist und zur Bedeutung des Inhalts beiträgt. In diesem Fall besteht die Herausforderung darin, ein konzeptionelles Bild zu vermitteln.
Lizzi kommentierte:
< Blockzitat>
„Und das ist definitiv etwas,… Ich glaube, ich habe mit mehr zu kämpfen, zum Beispiel je mehr man sich mit dekorativen Bildern beschäftigt, oder mit Dingen, die nicht…
Ich weiß nicht… die Sache mit den Suchergebnissen ist ziemlich unkompliziert.
Aber sobald es um Dinge wie „Oh, das ist ein Konzept“ oder so: „Es ist dekorativ“ es ist also nicht…
Es gibt einige Stellen, die sagen: ‘Oh, Sie müssen Alt-Text nicht in ein dekoratives Bild einfügen.’
Wenn es zum Beispiel nur aus ästhetischen Gründen da ist, dann ist es besser, den Alt-Text einfach leer zu lassen.
Aber andererseits, warum hätte ich es dort platziert? Es gab einen Grund, es dort zu platzieren.
Sollten wir also nicht etwas haben, das diese Lücke für die Erfahrung von jemandem füllt, der das Bild nicht sieht?
Sollten wir nicht haben Sie ein Ersatzding? Es diente einem Zweck.
Wir haben es aus einem bestimmten Grund dort platziert, wie zum Beispiel, was eine alternative Erfahrung wäre, um diese Informationen trotzdem zu vermitteln, denke ich?
Also wie Googlebot, wie Dinge tun.
Manchmal haben wir diese, denke ich, was als dekoratives Bild kategorisiert würde.
Wo es so ist, als ob Googlebot das Web erkundet, oder etwas.
Oder als würde es eine Art von Idee vermitteln, und sollte sich der Alt-Text auf die Idee konzentrieren? Oder wie: ‘Oh, es ist Googlebot mit ein paar Freunden.’
Oder es ist Googlebot… wie Spam in einen Computer zu stecken und am Ende glücklich zu sein.
Wie zum Beispiel zu beschreiben, was dort passiert, so dass Sie immer noch eine Vorstellung davon bekommen, was dort sein sollte, ist, denke ich, eines der Dinge, die… Ja, es verwirrt mich.
John Mueller: Ja. Ich meine, aus persönlicher Sicht würde ich diesen Bildern auf jeden Fall Alt-Text hinzufügen, weil sie irgendwie einzigartig und besonders sind.
Es ist nicht… Ich weiß nicht… ein floraler Hintergrund oder so ähnlich.
Es ist tatsächlich etwas, bei dem die Leute viel Zeit damit verbracht haben, dieses Bild zu erstellen.
Und es ist auch etwas, das die Leute vielleicht in den Suchergebnissen finden möchten.
Also, wenn Sie’ ;Wenn wir nach dem Googlebot suchen, da wir so viel Zeit damit verbringen, all diese Bilder zu erstellen, wird es schön sein, auch für sie gefunden zu werden.“
Das W3C hat veröffentlicht eine ganze Seite mit Dokumentation darüber, wie man mit Alt-Text für dekorative Bilder umgeht.
Dies ist die offizielle W3C-Empfehlung:
„Dekorative Bilder fügen dem Inhalt einer Seite keine Informationen hinzu.
Zum Beispiel können die durch das Bild bereitgestellten Informationen bereits durch angrenzenden Text angegeben werden, oder das Bild könnte in die Website eingefügt werden optisch attraktiver.
In diesen Fällen sollte ein null (leerer) Alt-Text angegeben werden (alt=””), damit sie von Hilfstechnologien wie Screenreadern ignoriert werden können.
Textwerte für diese Art von Bildern würden der Bildschirmleseausgabe hörbare Unordnung hinzufügen oder Benutzer ablenken, wenn sich das Thema von dem im angrenzenden Text unterscheidet.“
Das W3C schlägt außerdem vier Möglichkeiten vor Identifizieren Sie ein dekoratives Bild.
Vier Tests, ob ein Bild dekorativ ist:
- Das Bild wird für die Gestaltung des Dokuments verwendet (das Erscheinungsbild). )
- Wenn es sich um ein Bild handelt, das den Linktext ergänzt
- Trägt keine Information zum Textinhalt bei
- Das Bild wird durch den umgebenden Textinhalt beschrieben
Letztendlich ist es Sache des Autors, zu entscheiden, was für Bild-Alt-Text am besten ist.
Wie Google sagte, ist etwas besser als nichts. Wenn also das Bild keine Informationen liefert, verwenden Sie einfach den Nullwert für Alt-Text, der mit alt=””
Zitat
kodiert wird Teil des Google Podcasts bei Minute 15:17:
Vorgestelltes Bild von Shutterstock/Roman Samborskyi