Nachlese zum WordPress Meetup #126 – Mai 2025 – Barrierefreie Websites

Mit dem European Accessibility Act und dessen Umsetzung in nationales Recht als Barrierefreiheitsstärkungsgesetz (BFSG) kommt ab dem 28. Juni 2025 eine neue Anforderung auf uns zu. Allerdings mit vielen Einschränkungen, für wen das Gesetz überhaupt gilt.

Im Gegensatz zum letzten Meetup mit diesem Thema wurde dieses Mal gemeinsam Wissen zusammengetragen und praktisch an das Thema herangegangen.

Wichtige Ressourcen

Wichtiger Hinweis

Öffentliche Einrichtungen mussten schon vor dem BFSG Barrierefreiheit beachten!

Low Hanging Fruits – Schnell umsetzbare Maßnahmen

1. Skip to Main Content

  • Falls nicht vorhanden: Theme wechseln!
  • Nach dem öffnenden <body>-Tag gibt es einen Action Hook in WordPress
  • Wird oft auch von Google genutzt
  • Dort kann man den Skip-Link einfügen

2. Überschriften-Hierarchie

  • Korrekte Heading-Struktur einhalten (H1 → H2 → H3 etc.)
  • Keine Ebenen überspringen

3. Farbkontraste und klickbare Elemente

  • Ausreichende Kontraste sicherstellen
  • Klickbare Elemente anderweitig kennzeichnen (Unterstriche, Icons)
  • Nicht nur auf Farbe als Unterscheidungsmerkmal setzen

4. Alt-Texte richtig einsetzen

  • Logo auf Startseite: Welcher Text sollte es haben?
  • Alt-Texte können in den Media-Elementen customized werden
  • Alt-Texte dürfen gerne beschreibend sein
  • Dekorative Bilder: aria-label="hidden", role="presentation" oder leerer Alt-Text alt=""
  • Alt-Texte sind auch gut für SEO!
  • Entscheidungshilfe: W3C Decision Tree für Alt-Texte

5. Formulare barrierefrei gestalten

  • Checkboxen via aria-label auch über Text ansteuerbar machen
  • Labels für Suchleisten sind sinnvoll
  • Aria-Labels für Formulare korrekt einsetzen
  • ARIA Dokumentation: MDN aria-label | ARIA Landmark Roles

6. Typografie und Lesbarkeit

  • Schriftstärken beachten – mit und ohne Serifen
  • Schriftschnitte immer mit laden bei mehreren font-weights
  • Keinen Blocksatz setzen! (erschwert das Lesen)

7. Weitere wichtige Punkte

  • 404-Seiten auf Barrierefreiheit checken
  • Vermeiden von CAPTCHAs mit Bildern
  • ARIA richtig verstehen und einsetzen

Testing-Tools für Barrierefreiheit

Grundsatz: Es gibt viele Möglichkeiten barrierefreie Seiten zu testen, aber am besten ist es, selbst zu testen!

Browser-Extensions

Online-Tools

Zertifizierung

  • CPACCT – Testverfahren/Zertifikat für Audits

WordPress-spezifische Lösungen

Theme-Fixes

Fehlerhafte Themes können mit dem WP Accessibility Plugin gehotfixt werden.

Warum Accessibility-Overlays keine gute Idee sind

Experten im Bereich Barrierefreiheit

Weiterführende Materialien

Ausblick

Im Anschluss an die Präsentationen gab es wie immer Zeit für Fragen, Gespräche und Networking. Die Teilnehmer tauschten Erfahrungen und nützliche Tipps rund um das Thema WordPress und Barrierefreiheit aus.

Hinweis: Das WordPress Meetup Hamburg ist immer auf der Suche nach neuen Vortragenden und helfenden Händen, die Lust haben, bei der Organisation des Meetups mitzuwirken!

Nachlese zum WordPress Meetup #125 – April 2025 – Unsichtbare Fehler

Torsten begann seinen Vortrag mit einem Verweis auf das Buch „In the Beginning Was the Command Line“ und erläuterte die Evolution von der Command Line über User Interfaces bis zur heutigen Abstraktion. Er stellte die WordPress-Philosophie vor und wies auf RSS-Feeds als wichtiges Tool zum Abonnieren von Blogs hin. Seine zentrale Frage: Was passiert, wenn Technik zu sehr vereinfacht wird?

Die häufigsten unsichtbaren Fehler

1. Standard-Inhalte und Demo-Content

  • Der berüchtigte „Just another WordPress Website“ Untertitel bleibt oft unverändert
  • Der „Hallo Welt“ Standard-Post ist bei vielen Seiten noch live
  • Die Beispielseite wird häufig vergessen und bleibt öffentlich zugänglich
  • Demo-Inhalte von Themes und Plugins (wie /portfolio-demo3, /portfolio-demo4) werden versehentlich als öffentliche Posts statt als Entwürfe veröffentlicht

2. Grundlegende Einstellungen

  • Favicon: Oft wird das Standard-WordPress-Icon nicht geändert
  • Zeitzone: Falsche Zeitzoneneinstellungen können zu Problemen bei geplanten Beiträgen führen
  • Permalinks: Sprechende URLs (mod_rewrite) werden häufig nicht aktiviert, wodurch alles über index.php läuft

3. Anhangseiten-Problematik

Anhangseiten erstellen Einträge in der Post-Tabelle und sind immer als Attachment gekennzeichnet. Probleme:

  • Kommentare sind standardmäßig aktiviert, was zu Spam führen kann
  • Beste Praxis: Kommentare sofort deaktivieren oder Anhangseiten direkt auf das Medium weiterleiten
  • Diese Seiten werden für Google nicht benötigt

4. Plugin-Fallen

  • Akismet: Meist aktiviert, aber ohne API-Key funktionslos (zudem datenschutzrechtlich problematisch)
  • Hello Dolly: Wird von niemandem gebraucht
  • Geschlossene Plugins: Erhalten keine Updates mehr, zeigen aber auch keine Warnung an – das Plugin „Plugin Report“ kann hier helfen

5. Sicherheit und Performance

SSL und Weiterleitungen:

  • HTTP zu HTTPS Redirects fehlen oft
  • Wichtig: 301-Weiterleitungen einrichten und in der Datenbank umfassend ändern, um Loops zu vermeiden

PHP-Version:

  • Veraltete PHP-Versionen sind unsicher und hackbar
  • Kompatibilität mit WordPress-Version prüfen

Datenschutz und Sicherheit:

  • Gravatare sind datenschutzrechtlich schwierig
  • Display_errors sollte deaktiviert sein
  • Directory Index sollte deaktiviert sein
  • FTP-Server sind keine Dropbox: Keine .bak-Dateien oder ähnliches speichern

6. Technische Optimierungen

Autoload-Problematik:

  • In der Options-Tabelle wird alles gespeichert
  • Bei jedem Request werden alle Optionen mit autoload=yes geladen
  • Tool-Tipp: AAA Option Optimizer zum Debuggen
  • Transiente speichern Caches und können die Datenbank aufblähen

Health Check:

  • Der WordPress Website-Zustand ist eine wunderbare Übersichtsseite
  • Nicht alle Warnungen müssen beachtet werden

Veraltete Konstanten:

  • WP_MEMORY_LIMIT oft zu niedrig eingestellt
  • COMPRESS_JS, COMPRESS_CSS sind ressourcenfressend (besser serverseitig)
  • DEBUG_LOG kann versehentlich aktiviert bleiben und riesige Log-Dateien erzeugen

7. SEO und Sitemaps

  • Custom Post Types können ungewollt in XML-Sitemaps landen
  • Seiten ohne Inhalt (Daten über Custom Fields) sollten auf noindex gesetzt werden
  • Robots.txt: Seit WordPress 6.8 gibt es einen Check im Website-Zustand
  • WordPress-Suche nutzt MySQL Fulltext und findet auch HTML-Befehle und Block-Markup
  • Plugin-Tipp: Relevanssi für bessere Suchergebnisse

8. Weitere technische Details

  • Inode-Limits: Begrenzung der Dateianzahl auf Servern (Problem bei Caching-Plugins wie W3 Total Cache)
  • Links: Bei target=“_blank“ wird automatisch rel=“noopener“ gesetzt
  • htaccess: Cross-Site-Scripting-Schutz oft veraltet, Cache-Control-Einstellungen fehlen
  • Themes: Mehr als ein Standard-Theme ist unnötig – alle anderen löschen

Fazit

Torstens Vortrag zeigt eindrucksvoll, wie viele „unsichtbare“ Fehler sich in WordPress-Installationen verstecken können. Die meisten entstehen durch:

  • Vernachlässigung nach der Installation
  • Zu starke Abstraktion der Technik
  • Fehlende Wartung und Updates
  • Unkenntnis über Sicherheitsrisiken

Die wichtigste Erkenntnis: Regelmäßige Überprüfung und bewusste Konfiguration sind essentiell für sichere und performante WordPress-Websites.

Nachlese zum WordPress Meetup #124 – März 2025 – ChatGPT und PHP-/Plugin-Coding

Im März 2025 stellte Mark Max Henckel in seinem Vortrag vor, wie AI-Tools wie Claude und ChatGPT effektiv zur WordPress-Entwicklung genutzt werden können. Dabei zeigte Mark auf, wie diese Tools Entwickler unterstützen können, maßgeschneiderte Funktionen zu erstellen, ohne auf unnötige Plugins zurückzugreifen. Ein zentrales Beispiel war die Erstellung eines Custom Fields, in das ein Wert eingegeben wird. Je nach diesem Wert erhält der Body-Tag der Seite eine bestimmte Klasse, und der Hintergrund wird eingefärbt. Eine einfache, aber effektive Methode, um dynamische Designs umzusetzen.

Die Vorteile von AI in der WordPress-Entwicklung

Dynamische Design-Änderungen mit Custom Fields: Mark zeigte, wie AI dabei helfen kann, benutzerdefinierte Felder zu erstellen, die mit einer einzigen Eingabe dynamische Änderungen auf der Webseite vornehmen, wie zum Beispiel die Veränderung von Farben oder das Hinzufügen von Klassen im Body-Tag.

Vermeidung unnötiger Plugins: Statt für einfache Aufgaben wie die Erstellung eines Custom Post Types (wie „ShortNews“) ein zusätzliches Plugin zu installieren, kann AI hier den benötigten PHP-Code generieren. So bleibt die Website schlank und benötigt keine zusätzlichen Plugins, die die Leistung beeinträchtigen könnten.

Slider im MU-Ordner: Mark stellte außerdem einen Slider vor, der im Must-Use (MU) Ordner von WordPress gespeichert war. Dieser Ansatz wurde jedoch als problematisch angesehen, da MU-Dateien schwer zu debuggen sind. Stattdessen wurde in der Gruppe empfohlen, solche Funktionen lieber über Code Snippets oder ein Plugin zu lösen, das leichter zu warten und zu debuggen ist.

Die Diskussion über den besten Umgang mit AI-generiertem Code

Mark betonte, dass AI-generierter Code nicht in einem Vakuum existiert und es wichtig ist, diesen Code richtig zu verwalten. In der Gruppe wurde über verschiedene Möglichkeiten diskutiert, den generierten Code zu speichern und zu integrieren. Während Mark die Verwendung von Code im Theme-Ordner oder MU-Ordner bevorzugte, stellten andere vor, dass Code Snippets oder die Nutzung von Child Themes ebenfalls praktikable Optionen darstellen könnten.

Der Einsatz von AI zur Dokumentation

Ein besonders spannender Punkt war der Einsatz von AI-Tools zur Dokumentation von Plugins. In der Diskussion wurde vorgeschlagen, dass AI-Tools wie ChatGPT und Claude dabei helfen können, Dokumentationen zu erstellen, indem sie die wichtigsten Funktionen und Variablen aus den Plugin-Dokumentationen extrahieren. So kann AI auf Grundlage dieser Informationen eine übersichtliche, leserfreundliche Dokumentation generieren, die immer wieder genutzt werden kann, ohne dass man sich ständig wiederholen muss. Das spart Zeit und hilft, sich auf das Wesentliche zu konzentrieren.

Einfache WordPress-Funktionen sind kein Geheimnis

Da WordPress Open Source ist, sind einfache Funktionen und grundlegender Code keineswegs ein Geheimnis. Bereits vor der Einführung von AI-Tools gab es zahlreiche Foren und Communities, in denen grundlegende Codes geteilt und diskutiert wurden. AI-Tools bieten lediglich eine Möglichkeit, diese bestehenden Lösungen schneller zu finden und effizienter anzuwenden.

Der Unterschied zwischen privaten und kommerziellen Anwendungen von AI-generiertem Code

Es gibt einen wichtigen Unterschied zwischen dem privaten Gebrauch von AI-generiertem Code und der Nutzung in kommerziellen Webdesign-Dienstleistungen. Wenn ein Webdesigner einen Code erstellt, der auf AI basiert, und diesen an einen Kunden weitergibt, ist es wichtig, sich der rechtlichen Implikationen bewusst zu sein. Kunden sollten darüber informiert werden, dass der Code mit Hilfe von AI generiert wurde und die Qualität sowie Wartbarkeit des Codes entsprechend geprüft werden muss.

Haftung und Berufshaftpflichtversicherung

Wie bei jeder professionellen Tätigkeit ist es auch bei der Nutzung von AI-Tools in der Webentwicklung wichtig, eine Berufshaftpflichtversicherung abzuschließen. Diese Versicherung schützt vor möglichen rechtlichen und finanziellen Konsequenzen, falls Fehler im Code zu Problemen führen oder Kunden unzufrieden sind.

Prüfung und Kommentierung von AI-generiertem Code

Trotz der Unterstützung durch AI ist es wichtig, dass der generierte Code gründlich geprüft wird. Ein Schritt, den Entwickler immer durchführen sollten, ist, die AI nochmals zu fragen, ob der Code sicher ist. Zusätzlich sollte die AI gebeten werden, den Code mit Kommentaren zu versehen, um ihn für andere Entwickler besser verständlich zu machen oder um ihn später leichter an einen Kunden zu übergeben.

Es ist auch ratsam, den AI-generierten Code von einer anderen AI oder einer anderen Quelle auf Sicherheit und mögliche Probleme überprüfen zu lassen. Testumgebungen sind unerlässlich, um sicherzustellen, dass der Code unter realen Bedingungen funktioniert, ohne die Live-Website zu gefährden.

Als zusätzlichen Hinweis sollte man der AI auftragen, den Code zu prüfen, „als wenn mein Arbeitsplatz daran hängen würde“, um sicherzustellen, dass die Prüfung gründlich und mit höchster Sorgfalt durchgeführt wird.

AI hat nicht immer den aktuellsten Stand

AI-Systeme, auch solche wie ChatGPT oder Claude, können manchmal veraltete Informationen liefern. Ein Beispiel aus der Diskussion war die WordPress-Konstante COMPRESS_CSS, die in älteren AI-Antworten als noch nutzbar bezeichnet wurde, obwohl sie in neueren WordPress-Versionen nicht mehr verwendet wird. Dies zeigt, dass AI nicht immer den neuesten Stand eines Themas widerspiegelt, und es ist wichtig, Informationen zusätzlich zu überprüfen. AI kann sich auch mit spezifischen, älteren Fehlerberichten beschäftigen, die inzwischen behoben oder nicht mehr relevant sind, was zu Missverständnissen führen kann.

Ein konkretes Beispiel für einen LLM-Fail wurde in der Diskussion gezeigt: ChatGPT’s fehlerhafte Antwort im Vergleich zum tatsächlichen WordPress Core Trac Ticket #63017.

Fazit: AI als hilfreicher Partner in der WordPress-Entwicklung

AI-Tools wie Claude und ChatGPT bieten eine wertvolle Unterstützung in der WordPress-Entwicklung, indem sie einfache und effektive Lösungen für häufige Aufgaben bieten. Von der Erstellung benutzerdefinierter Felder bis hin zur Optimierung von Code und der Dokumentation von Plugins – AI kann den Entwicklungsprozess erheblich beschleunigen und vereinfachen. Wichtig ist jedoch, dass Entwickler den Code verstehen und darauf achten, wie sie AI sinnvoll in ihren Workflow integrieren.

Weiterführende Ressourcen:

Wir freuen uns bereits auf die nächsten Meetups und die spannenden Diskussionen, die dort geführt werden. Wenn du auch ein Thema präsentieren möchtest, melde dich gerne bei uns!

Nachlese zum WordPress Meetup #123 – Februar 2025 – Site Werkstatt

In der regulären WordPress Werkstatt kommen Nutzer mit verschiedenen Problemen und Fragen zusammen. Hier eine Sammlung der nützlichen Links und Plugins, die während des Abends besprochen wurden:

Übersetzungs-Plugins

  • Loco Translate – Übersetzt WordPress-Themes und Plugins direkt im Browser
  • Say What? – Ändert einzelne Textstrings in WordPress ohne Übersetzungsdateien

Medien-Management

  • Enable Media Replace – Ersetzt Mediendateien, ohne URLs zu ändern
  • Regenerate Thumbnails – Erstellt Thumbnail-Größen neu nach Theme-Wechsel
  • Imsanity – Verkleinert automatisch zu große Bilder beim Upload
  • Imagify – Optimiert und komprimiert Bilder für bessere Performance

Dokumentation und Ressourcen

Debugging und Wartung

Inspiration

Diese Tools und Ressourcen helfen bei den häufigsten WordPress-Herausforderungen – von Übersetzungsproblemen über Bildoptimierung bis hin zur Performance-Verbesserung.

Nachlese zum WordPress Meetup #122 – Januar 2025 – Mehrsprachige Websites mit WordPress

Beim letzten WordPress Meetup haben wir uns mit der Frage beschäftigt, wie man eine Website mehrsprachig machen kann. Es gibt dafür verschiedene Ansätze, die je nach Projektanforderungen Vor- und Nachteile haben.

Die einfachste Lösung sind Plugins wie Polylang oder WPML, die direkt in WordPress integriert werden können. Damit lassen sich mehrsprachige Inhalte verwalten, ohne dass eine zusätzliche Website-Struktur nötig ist. Eine Alternative sind automatische Übersetzungen über Google Translate oder Browser-Erweiterungen. Allerdings sind diese oft fehlerhaft, was problematisch sein kann, wenn es auf exakte Formulierungen ankommt.

Ein anderer Ansatz ist die Nutzung einer WordPress Multisite, bei der jede Sprachversion als eigene „Website“ innerhalb einer Installation läuft. Dies hat den Vorteil, dass keine zusätzlichen Plugins benötigt werden, da jede Sprache als eigenständige Instanz existiert. Dabei stellt sich die Frage, ob die Sprachvarianten in einem Subfolder (http://deine-seite.de/en/) oder einer Subdomain (en.deine-seite.de) angelegt werden sollen. Subfolder sind aus SEO-Sicht meist vorteilhafter, da Google alle Inhalte als Teil einer einzigen Website betrachtet, während Subdomains als eigenständige Seiten gewertet werden.

Eine Multisite benötigt eine sorgfältige Verwaltung, vor allem wenn viele Sprachversionen existieren. Hier helfen Plugins wie Multisite Language Switcher, um die Sprachversionen miteinander zu verknüpfen. Zur besseren Verwaltung von Medieninhalten innerhalb einer Multisite gibt es Multisite Global Media und Network Media Library. Wer eine bestehende Website innerhalb einer Multisite duplizieren möchte, kann dafür NS Cloner – Site Copier nutzen. Falls ein Theme oder Plugin nicht übersetzt wurde, lässt sich das mit Loco Translate direkt im WordPress-Backend anpassen.

Ob man eine mehrsprachige Website mit Plugins oder einer Multisite umsetzt, hängt vom individuellen Projekt ab. Plugins wie Polylang oder WPML sind eine einfache und schnelle Lösung, während eine Multisite für größere Projekte mit mehreren Sprachversionen sinnvoll ist, besonders wenn verschiedene Inhalte oder Designs benötigt werden.

Wichtige Erkenntnisse aus der Diskussion

Polylang Einschränkungen

  • URL-Struktur: Die Möglichkeit, dieselben URL-Slugs für verschiedene Sprachversionen zu nutzen (z.B. /team vs. /en/team), ist nur in der Pro-Version verfügbar
  • Benutzerrechte: Redakteure können nur mit einem kostenpflichtigen Drittanbieter-Plugin auf einzelne Sprachen beschränkt werden
  • Kompatibilitätsprobleme: Bei der Nutzung mit Customizer, Elementor und anderen Page Buildern werden zusätzliche Plugins benötigt

Polylang Kompatibilitäts-Plugins

Alternative Übersetzungs-Plugins

Multisite-Lösungen

  • MslsMenu – Menü-Integration für Multisite Language Switcher
  • MultilingualPress – Premium-Lösung für WordPress Multisite

Technische Hinweise

Multisite-Installation: Um Multisite in Subfoldern zu installieren, fügen Sie folgende Zeile zur wp-config.php hinzu:

define('ALLOW_SUBDIRECTORY_INSTALL', true);

Weitere technische Details zu Multisite und Cookie-Einstellungen sind wichtig für die korrekte Konfiguration.

Veraltete/Nicht mehr unterstützte Plugins

Wichtiger Hinweis zur Lokalisierung

Flags are not languages – Ein wichtiger Artikel über die korrekte Darstellung von Sprachoptionen in globalen User Interfaces. Verwenden Sie Sprachbezeichnungen statt Flaggen!

Genannte Plugins (Übersicht)

  • Polylang
  • WPML
  • Multisite Language Switcher
  • Multisite Global Media
  • Network Media Library
  • NS Cloner – Site Copier
  • Loco Translate
  • TranslatePress
  • MultilingualPress

Dieser Artikel bietet eine Übersicht über die verschiedenen Ansätze – welche Methode die beste ist, hängt vom individuellen Projekt ab.