Bilder
Last updated
Was this helpful?
Last updated
Was this helpful?
Um die Barrierefreiheit in deinem Shop zu optimieren, solltest du folgende Punkte bei der Verwendung von Bildern beachten:
Alt-Texte hinzufügen: Bilder, die wichtige Informationen vermitteln, sollten mit einem aussagekräftigen Alt-Text versehen werden. Dieser Text beschreibt den Inhalt des Bildes und stellt sicher, dass Nutzer mit Sehbeeinträchtigungen die Informationen ebenfalls erhalten. Du kannst Alt-Texte in den Metadaten der Medienverwaltung von Shopware hinterlegen.
Titel für Bilder verwenden: Zusätzlich zum Alt-Text kannst du jedem Bild im Medienbereich von Shopware einen Titel geben. Der Titel liefert zusätzliche Informationen und wird häufig als Tooltip angezeigt, wenn der Nutzer mit der Maus über das Bild fährt. Du kannst Title-Texte in den Metadaten der Medienverwaltung von Shopware hinterlegen.
Dekorative Bilder kennzeichnen:: Achte darauf, dass der Alt-Text nur dann genutzt wird, wenn er tatsächlich einen Mehrwert bietet. Vermeide es, Alt-Texte für rein dekorative Bilder zu vergeben – diese sollten als dekorativ gekennzeichnet werden. In unseren CMS-Elementen kannst du Bilder als dekorativ kennzeichnen. Dadurch werden diese Bilder von Screenreadern ignoriert, wenn sie keinen inhaltlichen Mehrwert bieten und nur der optischen Gestaltung dienen. Sobald ein Bild als dekorativ gekennzeichnet ist, erhalten sie leere alt- wie auch title-Attribute, sodass sie von Screenreadern übersprungen werden. Diese Einstellung entfernt nicht die in den Metadaten hinterlegten Informationen, sodass das Bild an andere Stelle auch weiterhin als Nicht-Dekoratives Bild eingesetzt werden kann.
Mit diesen einfachen, aber effektiven Maßnahmen stellst du sicher, dass deine Bilder auch für alle Nutzer zugänglich sind, unabhängig von ihren Fähigkeiten.