Startseite

Shopware 6 und Barrierefreiheit

Shopware Barrierefreiheit

Barrierefreiheit Online Shop

Shopware 6 und Barrierefreiheit: wichtige Maßnahmen jetzt umsetzen

Online Shops sind nicht erst seit Corona zu einer tragenden Säule des Handels geworden. Mit In-Kraft-Treten des Barrierefreiheitsstärkungsgesetzes (BFSG) am 28. Juni 2025 müssen Shop-Betreiber*innen jedoch umso mehr darauf achten, dass ihr Online Shop für alle Nutzer*innen zugänglich ist. Sonst drohen rechtliche Konsequenzen.

In diesem Artikel werfen wir als langjähriger Shopware Business Partner einen detaillierten Blick auf die Möglichkeiten, Shopware 6 barrierefrei zu gestalten. Wir zeigen Ihnen zusätzlich, welche konkreten Vorteile, insbesondere mit Blick auf SEO und Usability, Barrierefreiheit für Online-Shop-Betreiber*innen hat und zeigen Maßnahmen, die Shopware selbst in Bezug auf Barrierefreiheit ergreift.

Barrierefreiheit in Shopware 6: Shop BFSG-konform umsetzen

Als starke Open-Source-Software bietet Shopware 6 tatsächlich eine Vielzahl an Funktionen, die es ermöglichen, den eigenen Online Shop barrierefrei im Sinne der Web Content Accessibility Guidelines (WCAG) zu gestalten.

Stefan Hamann, Co-CEO und Mitbegründer von Shopware drückt es so aus:

„Es ist uns ein großes Anliegen, ein integratives und barrierefreies Einkaufserlebnis zu bieten. Deshalb verpflichtet sich Shopware uneingeschränkt, eine digitale Umgebung zu fördern, die einladend und für jeden zugänglich ist.“

Kein Wunder also, dass bei der neuen Shopware Version 6.7. vor allem auch Stellschrauben im Bereich Barrierefreiheit gedreht werden. Damit Sie beim Thema barrierefreier Online Shop jetzt schon bestens informiert sind, haben wir für Sie die wichtigsten Bausteine und Aspekte in der Übersicht.

Illustration eines Online Shops mit Welle.
Fragen? Wir beraten Sie gerne!

1. Verwendung von semantischem HTML

Viele Menschen mit Behinderung sind darauf angewiesen, Websites mit Hilfe eines Screenreaders zu erfassen. Semantisches HTML ermöglicht es diesen Screenreadern, den Inhalt einer Website besser zu interpretieren.

Shopware 6 bietet hier die Möglichkeit, geeignete HTML-Tags zu setzen, die Informationen zur Struktur und Bedeutung des Inhalts liefern. So können Shop-Betreiber*innen beispielsweise ihre Produktdetailseiten so gestalten, dass Überschriften (h1, h2, h3 usw.) die logische Struktur des Textes widerspiegeln. Der Benefit: Die Seitennavigation, vor allem für Blinde und Sehbehinderte, wird erheblich erleichtert.

Darüber hinaus können Entwickler*innen durch die Anpassung von Templates und IDX (interne Design-Templates) sicherstellen, dass die richtige Semantik verwendet wird.

Semantisches Web hat hier jedoch nicht nur Vorteile für Screenreader. Online Shops profitieren vielmehr insgesamt von einer besseren Struktur und einer eindeutigen Seitennavigation. Vor allem, was SEO betrifft wirkt sich eine Optimierung in diesem Bereich meist positiv auf das eigene Ranking aus, was wiederum mehr Besucher*innen in den Shop bringt.

2. Alt-Texte für Bilder

Ein weiterer essentieller Baustein in Sachen Shopware 6 Barrierefreiheit ist die konsequente Verwendung von Alt-Texten für Bildern. Alt-Texte beschreiben den Inhalt von Bildern und werden von Screenreadern vorgelesen. Das hilft z. B. blinden Nutzer*innen, die Inhalte eines Online Shops besser zu verstehen.

Wenn Sie als Shop-Betreiber*in beispielsweise Kleidung verkaufen, dann sollten Ihre Alt-Texte Aufschluss z. B. über Farbe, den Stil oder das Material der Kleidung geben, damit Nutzer*innen im wahrsten Sinne bestmöglich im Bilde sind. Das steigert übrigens nicht nur die Barrierefreiheit Ihres Online Shops, sondern ganz nebenbei auch die Auffindbarkeit in Suchmaschinen.

Shopware 6 ermöglicht es Benutzer*innen, Alt-Texte für jedes hochgeladene Bild hinzuzufügen.

Aber mehr noch: Zuletzt wurden ebenfalls sogenannte „Icon-Only“-Schaltflächen, also solche, die ausschließlich auf visuellen Symbolen basieren, wie die Herzschaltfläche für die Wunschliste oder die Plus/Minus-Schaltfläche für Mengenangaben mit Alt-Texten versehen. So können Screenreader auch Sinn und Zweck dieser Schaltflächen verstehen.

So pflegen Sie Metadaten in Shopware 6 ein

Alt-Texte werden in Shopware 6 in der Medienverwaltung unter „Inhalte“ und „Medien“ eingepflegt. Hier können im ausgewählten Bild unter “Metadaten” die Informationen bei den Feldern „Alt-Text“ und „Titel“ eingegeben werden.

Mehr über uns erfahren!

3. Tastaturnavigation und Fokuszustände

Zur Barrierefreiheit Ihres Shopware-6-Shops gehört natürlich auch die Möglichkeit, durch den gesamten Shop via Tastatur zu navigieren. Shopware hat hier in letzter Zeit ordentlich nachgelegt und sowohl die bereits erwähnte HTML-Semantik als auch die Tastaturnavigation verbessert.

So verfügt beispielsweise das Filterpanel seit neuestem über sichtbare Fokuszustände, so dass Nutzer*innen durch die entsprechenden Filter navigieren und mit diesen problemlos interagieren können.

Aber auch das Bewertungssystem oder die Sprach- und Währungsauswahl sind jetzt via Tastatursteuerung im Shopware Shop besser bedienbar.

Hinzu kommen eine verbesserte Tastaturnavigation, was den Bildschieberegler und das Zoom-Modal betrifft. So lässt sich letzteres jetzt durch Drücken der Eingabetaste öffnen und mit der ESC-Taste schließen.

Das sind nur ein paar Beispiele dafür, wovon Shop-Betreiber*innen profitieren können, wenn es darum geht, die Tastaturnavigation innerhalb Ihres Online Shops barrierefrei zu gestalten.

4. Anpassbare Schriftgrößen und Farben

Shopware 6 bietet ebenfalls die Möglichkeit, responsive Designs zu verwenden, die für verschiedene Gerätegrößen optimiert sind. Zudem können Betreiber*innen durch Custom CSS spezielle Anpassungen vornehmen.

Ein barrierefreier Shopware-6-Shop sollte es Nutzer*innen ermöglichen, Schriftgrößen und Farben nach ihren individuellen Bedürfnissen anzupassen. Hier können Shop-Betreiber*innen beispielsweise auch ein Plugin einsetzen, das es Nutzer*innen besser ermöglicht, auch Schriftgröße innerhalb eines responsiven Webdesigns anzupassen

Shopware 6 selbst hat zudem seine Farbkontraste mittlerweile in der gesamten Storefront deutlich angepasst, um eine bessere Lesbarkeit und damit die Einhaltung der Zugänglichkeitsstandards zu gewährleisten. Damit gehören unter anderem zu helle Hilfetexte und zu geringe Kontraste (z. B. bei den Warnmeldungen) der Vergangenheit an.

Die Farben können allerdings auch via Theme oder von dem Nutzer*innen selbst überschrieben werden. Was die meisten Themes, wie z. B. Themeware anbieten, ist die Möglichkeit, die Farbwerte selbst zu definieren.

Gut, zu wissen ...

Durch die responsive Umsetzung von Shopware 6 sind Inhalte bei einer Vergrößerung von 200 Prozent immer noch gut les- oder erkennbar und der Shop weiterhin vollumfänglich bedienbar.

5. Untertitel und Transkripte für visuelle Medien

Damit die Barrierefreiheit Ihres Shopware-6-Shops auch bei visuellen Medien überzeugt, sollten Sie darauf achten, Untertiteln oder Transkripte für Videos bereitzustellen, die Informationen zu Produkten oder Dienstleistungen enthalten.

Das gilt auch für Audioinhalte, damit auch hörgeschädigte Nutzer*innen Produktinformationen und wichtige Kern-Benefits aufnehmen können.

Unser Deep Dive ins Thema!

Warum die Barrierefreiheit in Shopware 6 optimieren?

Die Optimierung der Barrierefreiheit im eigenen Shopware-6-Shop geht mit zahlreichen Vorteilen einher, denn: Verbesserungen in diesem Bereich kommen nicht nur wenigen, sondern allen Nutzer*innen zugute. Warum das so ist? Niemand schätzt unübersichtliche Formulare, umständliche Checkout-Prozesse oder schwer navigierbare Warenkörbe.

Wenn Sie als Shop-Betreiber*in also Wert legen auf die Umsetzung der Barrierefreiheit in Shopware 6, führt das meist automatisch zu einer Verbesserung der Nutzererfahrung, da sich alle besser und schneller in Ihrem Online Shop zurechtfinden.

Jetzt digitale Expedition mit der PRinguin Digitalagentur starten

Darüber hinaus wirken sich viele Optimierungsmaßnamen in Sachen Barrierefreiheit in Shopware 6 positiv auf das Google-Ranking Ihres Online Shops aus. Google bevorzugt nämlich Seiten, die barrierefrei gestaltet sind, z. B. was Alt-Texte sowie semantisches HTML betrifft.

Und nicht zu vergessen: Barrierefreiheit wird 2025 zur Pflicht. Wer mit seinem Online Shop folglich rechtlichen Problemen und Beschwerden aus dem Weg gehen möchte, der sollte auf die Barrierefreiheit seines Shops achten und entsprechende Optimierungen vornehmen bzw. vornehmen lassen.

Checkliste: Barrierefreier Online Shop

Jetzt direkt von hilfreichen Tipps für mehr Barrierefreiheit profitieren!

Egal ob Online Shop, Internetseite oder App - barrierefreies Webdesign macht einen Unterschied und lohnt sich.

Unsere PRinguin-Expert*innen haben für Sie wichtige Tipps für Ihren Online Shop zusammengefasst.

3, 2, 1 ... Barrierefreiheit!

Schnelle Tipps für mehr Barrierefreiheit im Online Shop.

Bitte geben Sie Ihren Namen ein.
Bitte geben Sie Ihren Namen ein.
Bitte geben Sie Ihre E-Mail Adresse ein.

Besondere Vorteile von Shopware 6 beim Thema Barrierefreiheit

Shopware selbst legt, wie anfänglich erwähnt, großen Wert auf ein integratives und barrierefreies Einkaufserlebnis. Daher unternimmt Shopware mehrere Schritte, um sicherzustellen, dass Sie als Online-Shop-Betreiber*in Ihren Shopware-Shop barrierefrei gestalten können.

Starke Community und direkter Austausch

Damit User*innen Shopware 6 beispielsweise auf faire und integrative Weise nutzen können, können Barrierefreiheitsprobleme schnell und einfach an Shopware gemeldet werden. Hinzu kommt der Vorteil einer starken Community an Entwickler*innen, die besonders in Sachen Barrierefreiheit eine wertvolle Ressource darstellt.

 Shop-Betreiber*innen können sich hier über Foren und die einzelnen Kommunikationskanäle austauschen, um von den Erfahrungen anderer Nutzer*innen zu lernen und Lösungen für die Umsetzung der Barrierefreiheit im eigenen Shopware-6-Shop zu finden.

Flexibilität und konkrete Empfehlungen

Darüber hinaus gibt es mittlerweile etliche Plugins und Erweiterungen, um die Barrierefreiheit zu verbessern. Insbesondere, wenn unternehmensspezifische Anforderungen im eigenen Online Shop umgesetzt werden sollen. Dadurch lässt sich Shopware 6 an jedes Unternehmen optimal anpassen.

 Zusätzlich bietet Shopware eine umfängliche Dokumentation, die umfangreiche Informationen zur Barrierefreiheit enthält. Shop-Betreiber*innen finden hier unter anderem Best Practices und konkrete Empfehlungen zur Implementierung von Barrierefreiheit in Shopware-6-Shops.

Open Source als Vorteil für Barrierefreiheit bei Shopware 6

Shopware 6 als Open-Source-Software bietet eine Vielzahl von Vorteilen, die besonders relevant sind, wenn es darum geht, einen barrierefreien Online Shop zu realisieren.

Zum einen ermöglicht die Open Source-Natur von Shopware den Entwickler*innen, den Quellcode nach eigenen Bedürfnissen anzupassen und spezifische Barrierefreiheitsanforderungen individuell umzusetzen. Dies fördert die Flexibilität, die notwendig ist, um maßgeschneiderte Lösungen für verschiedene Benutzergruppen zu schaffen.

Darüber hinaus profitiert die Community von kontinuierlichen Verbesserungen und Updates, die auf die neuesten Standards der Barrierefreiheit ausgerichtet sind, da viele Entwickler*innen aktiv an der Optimierung der Plattform mitarbeiten.

Auch die Verfügbarkeit einer Vielzahl von Plugins und Integrationstools, die speziell für Barrierefreiheit entwickelt wurden, erleichtert die Einhaltung von Richtlinien wie den WCAG.

Insgesamt führt die Kombination aus Anpassungsfähigkeit, Community-Support und einem breiten Angebot an Ressourcen dazu, dass Shopware 6 eine hervorragende Wahl für die Entwicklung barrierefreier Online Shops ist, die den unterschiedlichen Bedürfnissen aller Nutzer*innen Rechnung trägt.

Textblockimage

Fazit: Shopware 6: Bestens geeignet für Barrierefreiheit

Barrierefreiheit ist mit dem Barrierefreiheitsstärkungsgesetz nicht nur eine rechtliche Anforderung, sondern vor allem auch eine wirtschaftliche Notwendigkeit. Die Möglichkeiten zur Verbesserung der Barrierefreiheit sind vielfältig und reichen von der Verwendung von semantischem HTML über die Implementierung von Alt-Texten bis hin zur Anpassung von Schriftgrößen und Kontrasten.

Shop-Betreiber*innen profitieren von einer größeren Reichweite, einer besseren Nutzererfahrung, verbesserten SEO-Rankings und rechtlicher Sicherheit. Indem sie die Möglichkeiten von Shopware 6 zur Barrierefreiheit nutzen, können Betreiber*innen ihre Geschäfte nicht nur inklusiver, sondern letztlich auch erfolgreicher gestalten.

Dabei gilt: Die Umsetzung von Barrierefreiheit in einem Shopware-6-Online-Shop ist ein fortlaufender Prozess, der technische und gestalterische Überlegungen erfordert und in der Praxis sehr aufwendig sein kann.

Sie benötigen Hilfe bei der Optimierung Ihrer eigenen Shopware-6-Barrierefreiheit? Sprechen Sie uns gerne einfach an. Gemeinsam identifizieren wir Barrieren in Ihrem Online Shop und unterstützen Sie bei der Beseitigung.

Illustration von Bergen vor einer Sonne.

Sie haben Fragen?

Wir beraten Sie gerne!

Bitte geben Sie Ihren Namen ein.
Bitte geben Sie Ihre E-Mail Adresse ein.
Bitte geben Sie eine Telefonnummer, unter der wir Sie erreichen können, ein.
Womit können wir Sie unterstützen?

Bitte beantworten Sie folgende Frage zur Spam-Vermeidung:

Wie lautet der dritte Buchstabe von "PRinguin"?

Bitte beantworten Sie die Frage
Ohne Ihre Einwilligung dürfen wir Ihre Kontaktanfrage leider nicht annehmen.

Empfohlene Beiträge

E-Commerce im PRinguin Magazin mit Meerwert