Vereinswebseite mit Next.js: EHC Koppigen

Als Vorstandsmitglied des EHC Koppigen ist Nicola für die Kommunikation des Vereins verantwortlich. Im Zentrum stehen dabei der digitale Auftritt des Vereins mit der Webseite sowie die Pflege der Social-Media-Kanäle (Instagram und Facebook). Zusätzlich gestaltet er Printprodukte wie das Matchprogramm, Flyer und das Vereinsmagazin «Hockey-Brattig».

Viele Vereinswebseiten haben dasselbe Problem: Sie werden von Freiwilligen gepflegt, die wenig Zeit haben. Was kompliziert ist, wird nicht aktualisiert. Für ehckoppigen.ch war das unser Ausgangspunkt.

Die Ausgangslage

Der Verein brauchte einen Auftritt für Mannschaftsporträts, News, Sponsoren und Angaben zum Verein – aktuell, in frischem Design, schnell und einfach zu bedienen.

Was eine gute Vereinswebseite braucht

Bevor wir eine Zeile Code geschrieben haben, haben wir uns gefragt, wer die Webseite eigentlich besucht. Bei einem Sportverein sind das vor allem drei Gruppen:

• Fans und Mitglieder – sie wollen Resultate, Spielplan und News, meistens unterwegs auf dem Smartphone.
• Sponsoren – sie wollen sichtbar sein und einen Verein unterstützen, der sich professionell präsentiert.
• Interessierte und neue Spieler – sie suchen Informationen zum Verein, zu den Teams und eine Kontaktperson.

Daraus ergeben sich die Grundregeln: Die wichtigsten Infos gehören auf die Startseite, die Seite muss auf dem Smartphone einwandfrei funktionieren, und neue Inhalte müssen sich mit wenig Aufwand veröffentlichen lassen.

Eine statische Webseite

Wir haben die Seite als statische Next.js-Seite gebaut. Das heisst: Alle Seiten werden einmal im Voraus erzeugt und als fertige Dateien auf einem Webserver bereitgestellt. Der Browser muss sie nur noch anzeigen. Die Inhalte werden lokal gepflegt und mit jeder Aktualisierung neu veröffentlicht.

Für einen Verein bringt das handfeste Vorteile:

• Schnell – es gibt keine Datenbank, die bei jedem Aufruf abgefragt wird.
• Sicher – ohne eigenes Backend gibt es wenig Angriffsfläche.
• Günstig – einfaches Hosting reicht völlig aus.
• Gut auffindbar – Suchmaschinen erhalten sauberes HTML ohne Umwege.

Statische Seite oder CMS?

Viele Vereine setzen auf ein Content-Management-System (CMS) wie WordPress. Das hat seine Berechtigung, wenn viele Personen regelmässig selbst Inhalte einpflegen. Es bringt aber auch Pflichten mit sich: Updates für das System und die Plugins, Sicherheitslücken, die geschlossen werden müssen, und ein Hosting, das mehr kann – und mehr kostet.

Bei einer statischen Seite fallen diese Aufgaben weitgehend weg. Wird die Seite von einer oder zwei Personen gepflegt, wie beim EHC Koppigen, ist das oft die bessere Wahl. Braucht ein Projekt dagegen Buchungen, Logins oder eine Datenverwaltung, ist eine Web-App die richtige Lösung – wie bei dampfwage.ch mit Buchungssystem und Dashboard.

Design und Medien aus eigener Hand

Der grösste Unterschied zu vielen Vereinsseiten: Bilder und Layout entstehen zusammen. Ein einheitliches Design in den Vereinsfarben sorgt für einen erfrischenden Auftritt. Zusätzlich rücken Bilder unserer Mannschaften unsere geliebte Sportart Eishockey wieder mehr ins Zentrum.

Farben, Typografie und Bildsprache sind mit dem Instagram-Auftritt des Vereins abgestimmt. Wer von einem Post auf die Webseite kommt, erkennt den Verein sofort wieder.

Bilder und Code in einem passenden Grundgerüst lassen den Verein für sich sprechen.

Genau diese Verbindung aus Webdesign und Sportfotografie bieten wir auch anderen Vereinen und Betrieben an.

Nicht einfach ein neues Design

Die Anforderungen sind erfüllt – doch die Ideen gehen uns nicht aus. Die statische Webseite bietet seit letzter Saison zahlreiche Funktionen, die über die reine Darstellung von Vereinsinformationen hinausgehen:

• Landing-Page – unsere 1. Mannschaft prominent auf der Startseite
• Live-Resultate – alle Spiele unserer Aktivmannschaften in der Übersicht
• Tabelle – die Aktivmannschaften und ihre Platzierung in der jeweiligen Gruppe
• News – Neuigkeiten inklusive Bildern und Autor
• Sponsoren-Banner – unsere Sponsoren auf jeder Seite in einem laufenden Banner
• Newsletter – Anmeldung auf der Webseite, Neuigkeiten zum Verein per E-Mail
• Themes – Light-, Dark- oder Kontrastmodus zur Auswahl
• Vereinsinformationen – Vorstand, Geschichte, Allgemeines und Kontakt
• Teams – 1. und 2. Mannschaft mit Teamfoto und Porträts, Senioren mit Turnierfoto

Was wir mitnehmen

Für Vereine und kleine Betriebe ist eine statische Seite oft die bessere Wahl als ein grosses CMS. Sie ist schneller, braucht weniger Pflege und kostet im Betrieb wenig. Entscheidend ist aber nicht die Technik allein: Eine Vereinswebseite lebt von aktuellen Inhalten und guten Bildern. Wenn beides aus einer Hand kommt, bleibt der Auftritt stimmig – auf der Webseite, auf Instagram und im Matchprogramm.

Wie aus dem Eishockey schliesslich SB Works wurde, erzählen wir im Beitrag über unsere Gründung. Weitere Arbeiten findest du unter Projekte.

Du überlegst dir eine neue Webseite für deinen Verein oder hast Feedback zu unserer Arbeit? Schreib uns – wir zeigen dir gerne, was möglich ist.