Zum Hauptinhalt springen
„Works on my machine.“ — Jeder Entwickler
  • HTML/CSS
  • Oxygen Builder
  • PHP
  • SEO
  • WordPress

Allmandring 1 e.V.

Vereinsseite auf Oxygen 4.8 mit CF7 und hreflang de/en

Startseite von allmandring1.de: Wohnheim-Gemeinschaft Allmandring 1 e.V.

Allmandring 1 e.V. ist die Selbstverwaltung eines Studierendenwohnheims in Stuttgart-Vaihingen, Teil des VSSW Stuttgart und nach eigenem Anspruch „eine Gemeinschaft der Vielfalt“. 2024 habe ich die Vereinswebsite allmandring1.de konzipiert, gestaltet und in WordPress mit Oxygen 4.8 umgesetzt. Das Design ist mein eigenes. Die Arbeit war ehrenamtlich: Ich war im Wohnheim selbst Vorstand und IT-Tutor.

Die Aufgabe

Die Website muss zwei Gruppen bedienen. Nach außen zeigt sie, was das Wohnheim ausmacht: Tutorien, Freizeitangebote und das Leben vor Ort. Nach innen liefert sie Bewohnerinnen und Bewohnern das Praktische: eine Tutorien-Übersicht, die Informationen zur Untervermietung und einen Kontaktweg. Dazu kommen Verlinkungen zum VSSW, zu Selfnet und zu den Nachbarwohnheimen.

Die wichtigste Randbedingung ist der Wechsel der Verantwortlichen. Die Tutoren wechseln in Generationen. Die Seite muss deshalb so gebaut sein, dass nachfolgende Tutoren-Generationen sie ohne Vorwissen weiterpflegen können. Es darf keine Abhängigkeit vom Entwickler entstehen.

Die Umsetzung

Aufbau in Oxygen 4.8 mit Component Framework

Die Seite läuft auf klassischem Oxygen 4.8. Das Component Framework von Oxygen hält wiederkehrende Elemente an einer Stelle: Wer eine Komponente ändert, ändert sie überall, wo sie eingesetzt ist. Für ein Wohnheim mit wechselnden Verantwortlichen ist das der entscheidende Punkt, weil Pflege dann bedeutet, Inhalte zu tauschen, nicht Layouts nachzubauen.

Seitenstruktur und Inhalte

Die Struktur folgt den beiden Zielgruppen. Die Startseite stellt die Gemeinschaft in den Mittelpunkt. Die Seite Tutorien enthält die Tutorien-Übersicht. Untervermietung hat zwei Unterseiten, Mieten und Untervermieten, weil beide Parteien des Vorgangs eigene Fragen haben. Dazu kommen Kontakt, Galerie, Speakers/Speaker, ein Blog sowie Datenschutzerklärung und Impressum. Die Verlinkungen zum VSSW, zu Selfnet und zu den Nachbarwohnheimen ordnen das Wohnheim in sein Umfeld ein.

Zweisprachigkeit und hreflang

Die Startseite gibt es zusätzlich auf Englisch unter /en/startseite-english/. Die englische Startseite trägt hreflang-Angaben für de und en, damit Suchmaschinen die passende Sprachversion ausliefern und die beiden Seiten nicht als Duplikate werten.

Schriften, SVGs und Performance

Die Schriften Maven Pro und Oswald liegen lokal als woff2 auf dem Server. Das vermeidet Anfragen an externe Font-Dienste und hält die Auslieferung der Schriften unter eigener Kontrolle. Neun SVGs sind inline im Markup eingebettet. Das spart HTTP-Requests, und die Grafiken lassen sich per CSS einfärben.

Kontaktformular

Der Kontaktweg läuft über Contact Form 7 in Version 6.0. Das Plugin ist verbreitet, dokumentiert und ohne Builder-Kenntnisse bedienbar. Das passt zur Anforderung, dass spätere Tutoren das Formular selbst anpassen können.

Betrieb und Hosting

Der Server läuft auf Debian. Caddy nimmt als Reverse Proxy die Anfragen entgegen und reicht sie an Apache weiter. Auf Apache läuft WordPress 7.1.3 mit PHP 8.3.

Technik im Detail

  • WordPress 7.1.3 auf PHP 8.3
  • Oxygen 4.8, klassisches Oxygen mit Component Framework
  • Contact Form 7 6.0 für das Kontaktformular
  • Schriften Maven Pro und Oswald, lokal als woff2 eingebunden
  • 9 Inline-SVGs im Markup
  • Seiten: Startseite, Tutorien, Untervermietung mit den Unterseiten Mieten und Untervermieten, Kontakt, Galerie, Speakers/Speaker, Blog, Datenschutzerklärung, Impressum
  • Englische Startseite unter /en/startseite-english/ mit hreflang-Angaben de/en
  • Externe Verlinkungen zu VSSW, Selfnet und Nachbarwohnheimen
  • Server: Caddy als Reverse Proxy vor Apache auf Debian

Design und Rollen

Design: eigener Entwurf. Konzept, Gestaltung und technische Umsetzung stammen von mir, Tomislav Zecevic; im Impressum der Seite steht „Technische Umsetzung und Webdesign Tomislav Zecevic“. Ich habe die Arbeit 2024 ehrenamtlich geleistet, als Vorstand und IT-Tutor des Wohnheims.

Das Ergebnis

Die Website gehört dem Verein, nicht dem Entwickler. Sie bildet die Gemeinschaft des Wohnheims ab, liefert Bewohnerinnen und Bewohnern das Praktische und lässt sich von den nächsten Tutoren-Generationen ohne Vorwissen weiterpflegen. Mehr zu meiner Arbeit an WordPress-Seiten mit Oxygen unter Websites, mehr zu Ladezeit und Suchmaschinen unter SEO und Performance.

Projekt-Details

Jahr
2024
Kunde
Allmandring 1 e.V.
Rolle
Konzept, Design & Entwicklung (ehrenamtlich)
Stack
HTML/CSS, Oxygen Builder, PHP, SEO, WordPress

Interesse an so einem Projekt?

Ich baue Websites, Tools und Apps – schnell, sauber, pixelgenau.

Projekt anfragen