17.09.26

Ein Theme entsteht nicht über Nacht

Sysiphusarbeit

Die Entstehung des neuen Webauftritts des Humanistischen Verbands Österreich

Heute mal in eigener Sache 🙂

Ein neues WordPress-Theme beginnt selten mit einem fertigen Design. Meist beginnt es mit einer Frage: Was soll eine Website eigentlich leisten?

Beim Humanistischen Verband Österreich war die Antwort von Anfang an deutlich: Die Website sollte nicht bloß schöner aussehen. Sie sollte die Organisation sichtbar machen, ihre Positionen verständlich vermitteln, Veranstaltungen auffindbar machen, Menschen zur Mitarbeit einladen und gleichzeitig technisch, datenschutzrechtlich und barrierefrei auf einem zeitgemäßen Stand sein.

Aus diesem Anspruch entstand das neue Theme für humanismus.at.

Warum wir die Entwicklung selbst übernommen haben

Für die technische und gestalterische Umsetzung der Website lagen Angebote von Agenturen zwischen 4.800 und 12.000 Euro vor. Diese Kosten wären für den HVÖ erheblich gewesen – zumal damit zunächst nur die Website selbst abgedeckt gewesen wäre.

Deshalb fiel die Entscheidung, die Entwicklung selbst zu übernehmen.

Das bedeutete allerdings nicht, dass die Website nebenbei an einigen Abenden zusammengestellt wurde. Die Entwicklung, Planung, Recherche, Programmierung, Fehlerbehebung und laufende Überarbeitung beanspruchten rund zwei Monate intensiver Hintergrundarbeit.

Viele Stunden davon waren später nicht sichtbar. Sie steckten in Abfragen, Datenstrukturen, mobilen Darstellungen, Formularlogik, Weiterleitungen, Zugriffsrechten, Barrierefreiheit, Testläufen und der Frage, wie einzelne Systeme zuverlässig miteinander kommunizieren können.

Vom ersten Entwurf zum eigenen Theme

Die ersten Überlegungen entstanden im Sommer 2026. Zunächst wurde mit einem bestehenden Hueman-Child-Theme gearbeitet. Der Vorteil lag auf der Hand: Viele Grundfunktionen waren bereits vorhanden. Gleichzeitig zeigte sich rasch, dass die Anforderungen des HVÖ damit nur begrenzt umzusetzen waren.

Der neue Webauftritt sollte eine eigene visuelle Sprache erhalten. HVÖ und Humanistische Akademie Österreich sollten als zusammengehörige, aber eigenständige Bereiche erkennbar sein. Das Humanismus-Blau sollte eine zentrale Rolle spielen, ergänzt durch Schwarz, Weiß und großzügigen Weißraum. Trennlinien und überladene Gestaltungselemente sollten vermieden werden.

Aus diesen Überlegungen entstand schließlich ein vollständig eigenes Theme mit dem Namen humanismus.

Die technische Grundentscheidung war ebenso wichtig wie die gestalterische: Das Theme sollte schlank bleiben, ohne Page Builder auskommen und möglichst viele Funktionen direkt in WordPress abbilden. Dadurch bleiben Aufbau und Inhalte langfristig wartbar. Die Website sollte nicht von einer Ansammlung einzelner, voneinander unabhängiger Werkzeuge abhängig sein.

Viele kleine Schritte statt eines großen Relaunches

Die Entwicklung verlief nicht linear. Sie bestand aus zahlreichen Versionen, Tests, Korrekturen und erneuten Prüfungen. Aus den ersten Entwürfen mit einem dreispaltigen Markenraster wurden Schritt für Schritt vollständige Seitenvorlagen, Inhaltsbereiche und Verwaltungsfunktionen.

Zu den frühen Bausteinen gehörten:

• der gemeinsame Kopfbereich für HVÖ und HAÖ,
• eine eigene Navigation,
• ein Hero-Bereich auf der Startseite,
• Themen- und Schwerpunktbereiche,
• Beiträge und Kategorien,
• Kennzahlen,
• ein Mitmach-Bereich,
• responsive Darstellungen für Desktop, Tablet und Smartphone,
• Tastaturfokus und Skip-Link,
• lokale Einbindung der Schrift Titillium Web,
• sowie die Vorbereitung einer strukturierten Startseite mit Gutenberg und theme.json.

Schon dabei zeigte sich, dass ein Theme nicht nur aus Farben, Schriften und Abständen besteht. Jede visuelle Entscheidung hat technische Folgen. Ein Logo muss auf dem großen Bildschirm ebenso funktionieren wie auf einem Mobiltelefon. Ein Menü muss mit der Maus, dem Finger und der Tastatur bedienbar sein. Ein Inhaltsraster muss auch dann stabil bleiben, wenn ein Text länger oder ein Bild anders zugeschnitten ist als ursprünglich geplant.

Die Startseite wird zum eigenen System

Ein besonderer Schwerpunkt lag auf der Startseite. Sie sollte nicht aus einer starren Sammlung hart codierter Inhalte bestehen, sondern redaktionell bearbeitbar sein.

Dafür wurden unter anderem eigene Bereiche für folgende Inhalte entwickelt:

• Humanismus und Selbstverständnis,
• aktuelle Beiträge,
• Projekte,
• Positionen,
• Publikationen,
• Veranstaltungen,
• Akademie,
• Mitmachen,
• sowie verschiedene Informations- und Handlungsbereiche.

Die Startseite erhielt dadurch eine modulare Struktur. Inhalte können verändert, ausgetauscht oder neu angeordnet werden, ohne dass dafür jedes Mal direkt in den Theme-Dateien gearbeitet werden muss.

Gerade diese Umstellung war nicht immer problemlos. Leere Metafelder, falsche Hauptabfragen oder unklare Zuständigkeiten zwischen Theme und Plugin führten zeitweise dazu, dass Inhalte verschwanden oder nicht an der erwarteten Stelle erschienen. Auch die Zuordnung von Startseite, Menüs und Footer musste mehrfach korrigiert werden.

Das waren keine spektakulären Fehler. Aber genau solche Details entscheiden darüber, ob eine Website im Alltag zuverlässig funktioniert.

Die Vereinsverwaltung ist Teil des Gesamtsystems

Parallel zur Website wurde eine vollständige Vereinsverwaltung entwickelt und nahtlos mit dem Webauftritt verbunden.

Damit entstand nicht nur eine neue öffentliche Website, sondern eine integrierte digitale Arbeitsumgebung für den gesamten Verein.

Ein Mitgliedsantrag wird nach seiner Freigabe automatisch in die Vereinsverwaltung übernommen. Die Daten müssen nicht mehr händisch aus einem Formular kopiert und an anderer Stelle erneut eingegeben werden.

Auch die Buchhaltung wurde direkt eingebunden. Kontoauszüge können eingelesen und automatisch verarbeitet werden. Jede einzelne Buchung aus den Kontoauszügen wird kontrolliert und einer passenden Kontierung zugeordnet.

Grundlage dafür ist der aktuelle österreichische Einheitskontenrahmen, der in der Vereinsverwaltung nach KFS/BW 6 abgebildet ist. Fehlen für eine Buchung notwendige Konten, werden diese automatisch angelegt. Die Kontierung erfolgt damit nicht pauschal, sondern nachvollziehbar und differenziert.

Für Belege wurde eine Drag-and-Drop-Funktion eingerichtet. Rechnungen und andere notwendige Unterlagen können direkt in die Vereinsverwaltung eingelesen und der jeweiligen Buchung zugeordnet werden.

Diese Belege bilden zugleich die Grundlage für die Kassenprüfung. Die Prüfungsabläufe wurden so weit automatisiert, dass die relevanten Buchungen und Unterlagen systematisch kontrolliert werden können. Die Kassenprüfer:innen müssen die Prüfung nicht mehr aus einer unübersichtlichen Sammlung einzelner Dateien und Tabellen zusammensetzen, sondern erhalten eine strukturierte Prüfoberfläche.

Auch der Prüfbericht wird aus den vorhandenen Daten automatisiert vorbereitet. Die Kassenprüfer:innen prüfen und bestätigen das Ergebnis anschließend selbst.

Dabei gilt ein wichtiger Grundsatz:

Fehlen notwendige Belege, kann keine Kassenprüfung durchgeführt werden.

Das System verhindert damit, dass Buchungen einfach als geprüft gelten, obwohl die dazugehörigen Unterlagen nicht vollständig vorliegen. Die Automatisierung ersetzt nicht die Verantwortung der Kassenprüfer:innen. Sie schafft vielmehr eine verlässliche Grundlage, auf der diese Verantwortung ausgeübt werden kann.

Warum eine saubere Kontierung wichtig ist

Nach dem Vereinsgesetz muss ein Verein zumindest eine ordentliche Einnahmen-Ausgaben-Rechnung samt Vermögensübersicht führen. Außerdem sind mindestens zwei Rechnungsprüfer:innen zu bestellen.

Die Rechnungsprüfer:innen prüfen nicht nur, ob Rechenfehler vorliegen. Sie prüfen auch, ob die Mittel statutengemäß verwendet wurden und ob die Finanzgebarung des Vereins ordnungsgemäß ist. Grundlage dafür sind insbesondere die §§ 20 bis 22 des Vereinsgesetzes 2002.

Zum Vereinsgesetz 2002 im Rechtsinformationssystem des Bundes

Für einen größeren oder wirtschaftlich umfangreicheren Verein kann darüber hinaus eine umfangreichere Rechnungslegung oder eine Abschlussprüfung erforderlich werden.

Eine präzise Buchhaltung ist daher nicht bloß eine technische Bequemlichkeit. Sie schafft die Grundlage dafür, dass die finanzielle Tätigkeit des Vereins nachvollziehbar, prüfbar und statutengemäß dokumentiert werden kann.

Sie ist damit auch eine wesentliche Voraussetzung für die gemeinnützige Arbeit. Die technische Umsetzung allein ersetzt zwar keine steuerliche Anerkennung der Gemeinnützigkeit. Sie sorgt aber dafür, dass die dafür erforderlichen Abläufe und Nachweise ordentlich geführt werden können.

Vier Bereiche statt einer einzigen Einnahmenkategorie

Jede Buchung sollte einem steuerlich und organisatorisch klaren Bereich zugeordnet werden. Eine gemeinsame, undifferenzierte Kategorie „Einnahmen“ oder „Veranstaltungskosten“ reicht dafür nicht aus.

Die Vereinsverwaltung unterscheidet deshalb zwischen vier grundlegenden Bereichen:

Diese Trennung ist entscheidend, weil Einnahmen und Ausgaben steuerlich unterschiedlich behandelt werden können.

Auch Zahlungen, die auf den ersten Blick ähnlich aussehen, müssen deshalb differenziert erfasst werden. Ein Zahlungseingang kann beispielsweise gleichzeitig Mitgliedsbeitrag und Spende sein. Eine Veranstaltung kann dem ideellen Bereich, einem Zweckbetrieb oder einem wirtschaftlichen Geschäftsbetrieb zugeordnet werden – je nachdem, wie sie konkret ausgestaltet ist.

Die Buchhaltung muss diese Unterschiede abbilden können. Genau deshalb wird jede Buchung einzeln geprüft und kontiert.

Gestaltung mit klarer Haltung

Im Lauf der Entwicklung wurde die visuelle Linie immer genauer.

HVÖ und HAÖ sollten gleichberechtigt erscheinen. Das Logo der Akademie sollte nicht mehr hart im Theme hinterlegt sein, sondern aus der Mediathek beziehungsweise aus einer Einstellung geladen werden. Die Darstellung der Logos, Schriftgrößen, Zeilenhöhen und Blockhöhen wurde wiederholt angepasst.

Auch der zentrale Bereich der Startseite wurde mehrfach überarbeitet. Farben, Abstände, Überschriften, Schaltflächen und die Größe der Logos wurden aufeinander abgestimmt. Die Farben wurden bewusst reduziert: Humanismus-Blau als identitätsstiftende Farbe, Schwarz für Text und Links, Weißraum für Ruhe und Orientierung.

Das Ziel war keine dekorative Website. Die Gestaltung sollte die Inhalte unterstützen und ihnen Raum geben.

Die Website wird funktionaler

Parallel zur Gestaltung wuchs der funktionale Umfang des Themes.

Die Veranstaltungsdarstellung wurde erweitert und erhielt unter anderem:

• Monats- und Jahresfilter,
• eine Auswahl nach Bundesland,
• eine Listenansicht für die kommenden drei Monate,
• Kennzeichnungen für Online- und Hybridveranstaltungen,
• sowie eine verbesserte Darstellung auf mobilen Geräten.

Auch die Positionen des HVÖ wurden neu strukturiert. Die Positionen sollten nicht länger nur als einzelne Seiten erreichbar sein, sondern als zusammenhängender Bereich sichtbar werden. Dazu gehören Menschenrechte, Wissenschaft und Bildung, Umwelt und Biodiversität, Religion und Staat, Technologie und KI, Selbstbestimmung sowie Menschenpflichten.

Mehrfach mussten dabei hart codierte Inhalte entfernt werden. Einzelne Seiten wie „Menschenpflichten“ oder „Menschenrechte“ waren zunächst direkt im Theme verankert. Das war für die Entwicklung praktisch, langfristig aber nicht sinnvoll. Ein Theme sollte nicht selbst entscheiden, welche konkrete Seite als Position angezeigt wird. Diese Inhalte gehören in die redaktionelle Verwaltung.

Auch die Dashboard-Anbindung wurde überarbeitet. Die Konfiguration der Startseite und der Positionen sollte im WordPress-Backend leicht erreichbar sein. Gleichzeitig mussten Weiterleitungen und Admin-URLs so angepasst werden, dass sie zuverlässig auf die tatsächlichen Bearbeitungsseiten führen.

Der Wechsel von design.humanismus.at zu humanismus.at

Ein weiterer wichtiger Schritt war der Wechsel von der Entwicklungs- und Designumgebung design.humanismus.at auf die eigentliche Adresse humanismus.at.

Dafür mussten nicht nur sichtbare Links geändert werden. Auch interne Verweise, Metadaten, Weiterleitungen, Startseiten- und Website-Einstellungen sowie einzelne hart codierte URLs wurden geprüft und angepasst.

Die alte Umgebung sollte während der Umstellung weiter funktionieren. Gleichzeitig durfte die Entwicklungsdomain nicht versehentlich von Suchmaschinen als eigentliche Website behandelt werden. Deshalb gehörten auch Fragen wie home, siteurl, Suchmaschinenindexierung und spätere Such-und-Ersetzen-Läufe zur technischen Arbeit.

Ein solcher Domainwechsel klingt zunächst nach einer einfachen Änderung. In einem gewachsenen WordPress-System betrifft er jedoch zahlreiche Ebenen: Theme, Plugins, Datenbank, Medien, Menüs, Verlinkungen und externe Weiterleitungen.

Barrierefreiheit als Entwicklungsziel

Ein zentraler Bestandteil der Arbeit war die Orientierung an WCAG 2.2 AA.

Barrierefreiheit wurde nicht als nachträglicher Zusatz behandelt, sondern als Qualitätsmaßstab für die Entwicklung. Dazu gehören unter anderem:

• ausreichende Farbkontraste,
• sichtbare Tastaturfokusse,
• verständliche Überschriftenstrukturen,
• ausreichend große Klickziele,
• funktionierende Formulare,
• eine sinnvolle mobile Darstellung,
• klare Fehlermeldungen,
• und der Verzicht auf unnötige visuelle oder technische Hindernisse.

Dabei zeigte sich auch, dass Barrierefreiheit nicht nur eine Frage des Themes ist. Inhalte, Bilder, Plugins und redaktionelle Entscheidungen spielen ebenfalls eine Rolle. Dennoch kann ein Theme die Grundlage dafür schaffen, dass Barrierefreiheit im Alltag nicht ständig neu erkämpft werden muss.

Die Website soll deshalb nicht einfach mit dem Hinweis versehen werden, sie sei „modern“. Sie soll nachvollziehbar geprüft und weiter verbessert werden.

Warum so viele Versionen notwendig waren

Die zahlreichen Versionen des Themes sind kein Zeichen dafür, dass die ursprüngliche Idee gescheitert wäre. Sie zeigen vielmehr, wie viele Ebenen in einer Website zusammenwirken.

Eine Änderung an der Startseite kann Auswirkungen auf mobile Geräte haben. Eine Änderung am Logo kann die Höhe des Headers verändern. Ein neuer Filter kann die Abfrage der Veranstaltungen beeinflussen. Eine Korrektur im Backend kann eine Weiterleitung beschädigen. Ein scheinbar kleiner Abstand kann auf einem Smartphone dazu führen, dass eine ganze Seite horizontal scrollt.

Deshalb wurde das Theme in vielen kleinen Schritten entwickelt und geprüft. Versionen wurden installiert, getestet, korrigiert und erneut bereitgestellt. Fehler wurden nicht nur optisch, sondern auch im tatsächlichen Bedienablauf gesucht.

Das betrifft beispielsweise die Frage, ob ein Menü wirklich mit der Tastatur bedienbar ist, ob ein Formularfeld korrekt beschriftet ist, ob ein Filter tatsächlich filtert oder ob ein Link im Backend auf die richtige Bearbeitungsseite führt.

Was am Ende entstanden ist

Am Ende steht nicht bloß eine neue Website und auch nicht bloß ein neues Theme.

Entstanden ist eine integrierte digitale Infrastruktur für den Humanistischen Verband Österreich:

• eine öffentliche Website,
• ein eigenes, wartbares WordPress-Theme,
• eine strukturierte Darstellung von Positionen, Projekten und Veranstaltungen,
• eine Mitgliederverwaltung,
• eine integrierte Buchhaltung,
• eine differenzierte Kontierung nach dem österreichischen Einheitskontenrahmen,
• eine digitale Belegverwaltung,
• automatisierte Abläufe für die Kassenprüfung,
• automatisch vorbereitete Prüfberichte,
• und eine gemeinsame technische Grundlage für die laufende Vereinsarbeit.

Website, Mitgliederverwaltung, Buchhaltung, Belegverwaltung und Kassenprüfung sind damit nicht länger voneinander getrennte Bereiche. Sie greifen ineinander und verwenden – soweit sinnvoll – dieselben Daten.

Die sichtbare Oberfläche ist dabei nur der Teil, den Besucher:innen unmittelbar wahrnehmen. Darunter liegen Templates, Abfragen, Einstellungen, Datenstrukturen, responsive Regeln, Barrierefreiheitsanforderungen, Weiterleitungen, Buchungslogik und unzählige kleine Entscheidungen.

Die Entwicklung hat rund zwei Monate intensiver Hintergrundarbeit gekostet. Verglichen mit den vorliegenden Agenturangeboten konnte der HVÖ dadurch erhebliche Kosten einsparen. Wichtiger ist aber vielleicht etwas anderes: Die Website wurde nicht als isoliertes Fremdprojekt gebaut, sondern aus den konkreten Anforderungen des Vereins heraus.

Der wichtigste Schritt ist nun geschafft: Das Theme ist in seiner grundlegenden Entwicklung abgeschlossen. Die Website kann damit weiterarbeiten, wachsen und inhaltlich gefüllt werden.

Ganz fertig ist eine Website allerdings nie. Neue Inhalte, neue Anforderungen und neue technische Standards werden weitere Anpassungen notwendig machen. Aber die Grundlage steht.

Und sie folgt einem einfachen Grundsatz:

Eine Website für Humanismus muss nicht nur gut aussehen. Sie muss funktionieren, zugänglich sein, Verwaltungsarbeit erleichtern, finanzielle Abläufe nachvollziehbar machen und Haltung sichtbar machen. Und sie muss für die Mitglieder transparent sein.