Vom Website-Audit zu mehr Barrierefreiheit und Nachhaltigkeit
Business-Website
Auf einen Blick
Die Social Entrepreneurship Allianz Hamburg ist ein Verein zur Förderung von Social Entrepreneurship in der Hansestadt. In einem Website-Audit haben wir einige Baustellen entdeckt. Das Ziel dieses Projektes war es, Barrierefreiheit, Nachhaltigkeit und Performance zu optimieren – und das ohne große Änderungen am Design oder am Custom Theme.
Zur Website: socialentrepreneurship.hamburg
Worauf wir stolz sein können
Klingt nach dem, was du brauchst?
Lasst uns mit einem Audit für deine Website starten. Damit bekommt ihr einen schnellen Überblick zu:
Vorher: Die Audit-Ergebnisse
Tolle visuelle Identität, gutes UX – aber was steckt unter der Haube?
Mit dieser Frage bin ich in das Website-Audit für die Social Entrepreneurship City gestartet. Die Analyse zeigte Handlungsbedarf bei Barrierefreiheit, Ladezeiten und Nachhaltigkeit – und genau dort haben wir angesetzt.
Strategie: Optimieren statt neu bauen
Das Custom-Theme der Seite war für bestimmte Features (wie die “Hamburg wirkt”-Karte) sinnvoll, offenbarte aber Schwächen bei Barrierefreiheit und intuitiver Bedienung. Wir haben zunächst gemeinsam abgewogen, ob wir direkt auf ein barrierefreies und effizientes Block-Theme umsteigen. Hier war jedoch eine Optimierung im aktuellen Setup sinnvoller.
So sind wir vorgegangen:
- Audit-Ergebnisse analysiert und priorisiertes Maßnahmen-Backlog erstellt
- Abstimmung mit Redaktion & Entwickler zum Aufteilen der Aufgaben
- Redaktions-Guidelines erstellt, u. a. für SEO-Metadaten, Alternativtexte und saubere Überschriftenstruktur
- Wechsel des Hostings zu Raidboxes für bessere Performance, Nachhaltigkeit & eine separate Entwicklungsumgebung
- Technische Anpassungen direkt im Theme und auf der Seite umgesetzt
So konnten wir die wichtigsten Hürden abbauen – ganz ohne Redesign.
Barrierefreiheit gehört ins Design – von Anfang an
Ein Klassiker für mich: Das Corporate Design ist stark, die Farben einprägsam – doch beim Thema Farbkontraste hakt’s.
Auch hier war das so. Das Markenblau sieht luftig und frisch aus – aber interaktive Elemente wie Buttons heben sich nicht ausreichend vom weißen Hintergrund ab (im Bild links).
Meine Vorschläge für die Buttons:
- Dunkleres Blau-Türkis mit weißem Text: erfüllt Kontrastanforderungen, wirkt ebenso luftig wie der Rest (Bild: Mitte)
- Schwarzer Rand um die Buttons: erhält die Originalfarbe, wirkt etwas schwerer (Bild: rechts)
Die Kundin entschied sich für Option 2, da das mit viel Aufwand entwickelte Corporate Design bewusst auf zusätzliche Farben verzichtet. Verständlich – und so haben wir es gemeinsam umgesetzt.
Was ich jedoch häufig sehe: Das nachträgliche „Einbauen“ von Barrierefreiheit kostet Zeit, Geld und gestalterische Kompromisse.
Mein Wunsch an alle Brand Designer*innen: Lasst uns Barrierefreiheit von Anfang an mitdenken. Kontraste. Schriftgrößen. Interaktion. Das ist kein Add-on – es ist Teil eurer Haltung.
Von kleinen und großen Maßnahmen und ihrem Impact
Performance und Nachhaltigkeit
Mit dem Wechsel des Hoster laufen Caching, Code- und Bildoptimierung nun automatisch im Hintergrund. Der Seitenumzug wurde von Raidboxes übernommen – unkompliziert und kostenlos. Damit haben wir nicht nur die Ladezeiten massiv verbessert, sondern auch einen großen Schritt in Richtung Nachhaltigkeit gemacht. Und das alles, ohne das bestehende Corporate Design verändern zu müssen.
SEO
Mit einem professionellen und leichtgewichtigen SEO-Plugin sowie optimierten Seitentiteln und -beschreibungen stellen wir sicher, dass Social Entrepreneurs relevante Inhalte bei Google und Co. besser finden.
Barrierefreiheit
Durch zahlreiche kleine Anpassungen am Design, im Theme-Code und bei den Inhalten konnten wir spürbar Barrieren abbauen. Das bisher eingesetzte Barrierefreiheits-Plugin wurde damit überflüssig.
Auch für die Redaktion hat sich einiges getan: Sie verfügt jetzt über klare Guidelines, z. B. zur Überschriftenstruktur und zu aussagekräftigen Alternativtexten.
Hinweis: Noch ist nicht alles umgesetzt, aber mit der bestehenden Roadmap ist klar, was als Nächstes ansteht.
Zukunftsfähige Websites – kein Add-on, sondern Standard
Bei meinen Websites könnt ihr euch auf folgendes verlassen:
Inklusives Design
- Mit intuitiver Navigation und Seitenaufbau finden alle Nutzer*innen einfach und schnell, was sie suchen
- Barrierefreiheits-Anforderungen der WCAG werden von Beginn an mit berücksichtigt
- Responsives Design ermöglicht es, eure Website von allen Geräten aus fehlerfrei zu betrachten
- Eine nachhaltige Seite mit weniger Datenverbrauch lässt auch Menschen mit mit schlechtem Netz oder begrenztem Datenvolumen entspannt auf eurer Seite surfen
Nachhaltiges Design
- Performance-Optimierung erfolgt automatisch— das macht die Seite schneller und nachhaltiger und spart Plugin-Frust
- 100% grünes und verantwortungsvolles Hosting aus nachhaltigen Energiequellen
- Geringerer CO2-Ausstoß durch ein effizientes und professionelles WordPress-Theme
- Leichtgewichtiges Design mit weniger großen und schweren Elementen
Wie steht’s um deine Website?
Wenn dich die Erfolgsgeschichte der Social Entrepreneurship City neugierig gemacht hat, dann sprich mich an – gerne checke ich eure Website!