Gunnar Bittersmann: Das Wort "Placeholder image "wird in Google gelistet

Beitrag lesen

@@Matthias Apsel

Der Text kommt zum Beispiel aus dieser Zeile

<div class="col-lg-6 col-md-6 hintergrundContainer"><a href="index.html"><img src="Bilder/Logo.jpg" class="img-responsive" alt="Placeholder image"></a></div>

Das kommt wohl aus irgendeinem Bootstrap-Beispiel und wird gedankenlos so übernommen.

Bootstrap suggeriert ja den Leuten auch: ‚Leute, mit Bootstrap könnt ihr eure Seite mal eben schnell ohne viel Aufwand und ohne viel Wissen zusammenbasteln.‘ Und dann kommt eben sowas bei raus – Bootcrap.

Ich hab mal eben im Stylesheet ergänzt:

:root
{
	--error-color: red;
	--error-outline: 0.5rem solid var(--error-color);
}

img[alt="Placeholder image"],
img[alt="Responsive image"]
{
	ERROR: 'no useful alternate textual representation';
	outline: var(--error-outline) !important;
}

Für „Responsive image“ stand’s schon drin; das hatte ich im Projekt schon mal aufgespürt und gleich mal fett eingerahmt.

Verwende aussagekräftige alt-Texte. Sie helfen Leuten (und Suchmaschinen), falls keine Bilder angezeigt werden können oder sollen.

Oder Bilder angezeigt werden, aber nicht gesehen werden können.

LLAP 🖖

PS: Kaputte Syntax-Highlighter sind immer noch kaputt.

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory