Design System · Komponenten-Bibliothek
Contentset
Bausteine für die FÖFA-Webseite. Alle Komponenten basieren auf nativen Elementor- und Elementor-Pro-Widgets — eingebettet in die Genossenschafts-Identität: rotes Akzentfeuer, ruhiges Grau, viel Weißraum.
Sektion 01 · 16
Überschriften
Sechs Hierarchie-Stufen — von Display-H1 bis Micro-Label-H6 — sorgen für klare visuelle Gliederung. Jede Ebene hat ihren Platz: H1 für den Haupt-Titel einer Seite, H2 für Sektion-Köpfe, H3–H4 für Sub-Strukturen, H5–H6 für Kleingedrucktes und Eyebrows.
H1 · Display
Genossenschaftliches Wohnen seit 1948
H2 · Sektion
Sicher und fair zuhause
H3 · Sub-Sektion
Mehr als nur ein Vermieter
H4 · Kapitel-Titel
Unsere Werte: Solidarität, Fairness, Verantwortung
H5 · Block-Headline
Wartungstermine im Quartier
H6 · Eyebrow / Label
ÖFFNUNGSZEITEN GESCHÄFTSSTELLE
Sektion 02 · 16
Headline-Kombinationen
Eyebrow, Headline, Subtext und Call-to-Action — das Standard-Trio für Sektion-Intros, Hero-Bereiche und Karten. Der Eyebrow setzt Kontext, die Headline kommuniziert, der Subtext erläutert, der Button öffnet den Weg.
Mitgliedschaft
Die Genossenschaft als Heimat
Wer Mitglied der FÖFA wird, erwirbt Genossenschaftsanteile ab 250 € und sichert sich faire Mietkonditionen, Mitbestimmungsrecht und eine starke Nachbarschaft.
Sektion 03 · 16
Textstile
Drei Textgrößen für unterschiedliche Lesedichten — Lead-Absatz für Sektion-Intros, Body-Absatz für Fließtext, Klein für rechtliche Hinweise und Bildunterschriften.
Lead · 20px / 1.5
Genossenschaftliches Wohnen bedeutet, dass Sie nicht zur Miete leben, sondern in Ihrem eigenen Anteil. 1.200 Mitglieder, 980 Wohnungen, 75 Jahre Tradition — die FÖFA steht für faires, sicheres und gemeinschaftliches Wohnen in Waldshut-Tiengen.
Body · 16px / 1.7
Anders als bei einem klassischen Vermieter sind unsere Mieter:innen gleichzeitig Eigentümer:innen der Genossenschaft. Sie wählen den Aufsichtsrat, bestimmen die Geschäftspolitik mit und profitieren von einem dauerhaft fairen Mietzins, der die Lebenshaltungskosten nicht aus dem Gleichgewicht bringt.
Seit 1948 stehen wir für genossenschaftliche Werte im südbadischen Raum. Heute betreuen wir 108 Objekte mit insgesamt 980 Wohnungen — von der barrierefreien Einzimmerwohnung bis zum Familien-Reihenhaus mit Garten. Erfahren Sie mehr über unsere Mitgliedschaft.
Klein · 13px
Stand: Mai 2026. Genossenschaftsanteile beinhalten ein einmaliges Eintrittsgeld von 100 €. Eine Mitgliedschaft endet frühestens nach zwei Jahren auf Antrag des Mitglieds. Vollständige Bedingungen siehe Satzung.
Sektion 04 · 16
Schaltflächen
Primary für Haupt-Aktionen wie ‚Mitglied werden‘, Outline für sekundäre Pfade, Ghost für textuelle CTAs auf gefärbtem Grund. Größenstufen XS bis MD decken Listenkontexte, Karten und Hero-CTAs ab.
Sektion 05 · 16
Bilddarstellung
Einzelbild für Hero-Bereiche und Inline-Illustrationen, Bild mit Bildunterschrift für Galerie-artige Anordnungen, Image-Box als Teaser-Karte mit Titel und Beschreibungstext.
Bild mit Caption
Image-Box-Widget
Quartier Tiengen-Süd
32 sanierte Wohnungen am Tiengener Südhang — energetisch optimiert, mit Balkon und barrierefreiem Zugang.
Sektion 06 · 16
Bildergalerie
4-spaltiges Grid mit Lightbox — ideal für Objektsammlungen und Quartiers-Übersichten. Klick öffnet das Bild in voller Auflösung.
Galerie bis zum Rand
Sektion 07 · 16
Icon-Boxen
Drei Layout-Varianten: Icon oben für klassisches 3er-Grid, Icon links für Feature-Listen mit Lesefluss, Icon rechts für asymmetrische Block-Anordnungen.
Mieten und Wohnraum
Mietangebote und Wohnraum für Menschen in
verschiedenen Lebenslagen
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Neubau und Sanierung
Unsere aktuellen Bau- und Sanierungsprojekte
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
FÖFA Waldshut-Tiengen eG
Genossenschaft
Jubiläum – 75 Jahre
Seit Generationen für Generationen
Wir sind die Baugenossenschaft FÖFA Waldshut-Tiengen – ein verlässlicher Partner für faires Wohnen und echte Gemeinschaft, fest verwurzelt hier am Hochrhein.
Eine Genossenschaft ist mehr als ein Vermieter – und ein Zuhause bei der FÖFA mehr als eine Wohnung. Bei uns sind unsere Mitglieder keine Kundschaft, sondern Mit-Eigentümer ihrer eigenen Genossenschaft. Das verändert alles: Wer bei der FÖFA wohnt, mietet nicht einfach Quadratmeter, sondern wird Teil einer Gemeinschaft, die seit 1950 zusammenhält. Fair . mieten . GUT – dieser Anspruch begleitet uns seit drei Vierteljahrhunderten. Tag für Tag, Haus für Haus.
Sektion 08 · 16
Icon-Liste
Vertikale Liste mit Icon-Bullets. Eignet sich für USP-Aufzählungen, Feature-Listen und Vorteilsdarstellungen in Karten und Beschreibungstexten.
- Faire Mietkonditionen ohne Spekulation
- Mitbestimmungsrecht bei der jährlichen Versammlung
- Langfristig sichere Wohnverhältnisse
- Aktive Nachbarschaft und Quartiers-Initiativen
- Energetische Sanierung statt Spekulationswert
Sektion 09 · 16
Counter — Zahlen, die wirken
Animierte Zähler bringen die wichtigsten Kennzahlen der Genossenschaft ins Blickfeld — beim Hineinscrollen werden sie hochgezählt.
Genossenschaftliches Wohnen.
Die Vorteile im Überblick
Sektion 10 · 16
Tabs
Themenwechsel ohne Seitenwechsel — Tabs gruppieren verwandte Inhalte und reduzieren die vertikale Scroll-Distanz. Ideal für FAQs und Service-Übersichten.
Wer Mitglied der FÖFA wird, erwirbt Genossenschaftsanteile ab 250 € und sichert sich damit langfristig faire Mietkonditionen sowie volles Mitbestimmungsrecht in der Generalversammlung.
Unsere 980 Wohnungen in 108 Objekten erstrecken sich über das gesamte Stadtgebiet Waldshut-Tiengen — von der barrierefreien Einzimmerwohnung bis zum großzügigen Familien-Reihenhaus mit Garten.
Schadensmeldung, Wohnungsanfrage, Ansprechpartner: Unser Service-Team in der Geschäftsstelle ist Montag und Donnerstag von 9:30–11:30 Uhr sowie Dienstag und Donnerstag 14:30–16:30 Uhr für Sie da.
Sektion 11 · 16
Accordion — FAQ-Stil
Aufklappbare Fragen-Antworten-Paare. Halten Listen kompakt und erlauben dem Lesenden, gezielt zu vertiefen, was relevant ist.
Eine Mitgliedschaft beantragen Sie in unserer Geschäftsstelle in der Alfred-Amann-Straße 16 oder per Formular auf unserer Webseite. Nach Prüfung Ihres Antrags und Zeichnung der Anteile erhalten Sie Ihre Mitgliedsbescheinigung — meist innerhalb von zwei Wochen.
Der Anteilswert beträgt aktuell 250 € pro Anteil. Hinzu kommt ein einmaliges Eintrittsgeld von 100 €. Die Mindestbeteiligung richtet sich nach der gewählten Wohnungskategorie.
Die Wartezeit hängt von Wohnungskategorie und Lage ab — von wenigen Wochen für kleinere Wohnungen bis zu mehreren Monaten für familienfreundliche Reihenhäuser in besonders gefragten Quartieren.
Ja, eine Mitgliedschaft kann frühestens nach zwei Jahren auf Ihren Antrag hin gekündigt werden. Die Anteile werden Ihnen zum Nennwert zurückerstattet.
Sektion 12 · 16
Mitglieder-Stimme
Authentische Zitate machen abstrakte Werte greifbar — Vertrauen entsteht durch Erfahrungsberichte.
Sektion 13 · 16
Pull-Quote
Hervorgehobenes Zitat im Lesefluss — bricht Textwüsten auf, betont eine Kernbotschaft, erhöht den Verweildauer-Effekt.
Genossenschaftliches Wohnen ist gelebte Demokratie auf vier Wänden.
Sektion 14 · 16
Call to Action
Großformatiger Aufruf mit Hintergrundbild, Headline, Description und Button — der Closer am Ende einer Sektion oder Seite.
Mitglied werden — sicher wohnen
Formular
Lorem ipsum dolor sit amet, consectetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Sektion 15 · 16
Formular
Schlankes Formular für Erstkontakt — Name, E-Mail, Nachricht. Bei Bedarf um weitere Felder erweiterbar.
Sektion 16 · 16
Divider & Spacer
Sichtbare Trennung mit Divider, unsichtbare Atempausen mit Spacer — die kleinsten Bausteine im Design System, mit der größten Wirkung auf Rhythmus und Lesbarkeit.
Divider · 1px solid
Divider · 2px FÖFA-Rot, kurz
Spacer · 48px (zwischen den Texten unten)
Text oberhalb des 48-Pixel-Spacers.
Text unterhalb des Spacers — 48 Pixel Abstand, unsichtbar im Frontend.