Ihr Browser untersützt kein Javascript! Bitte aktivieren Sie dies, um die Website nutzen zu können.

Website

Realschule Fürstenfeldbruck

Responsive Webdesign Website Realschule Fürstenfeldbruck

Externe Kommunikation für Schulen einfach gemacht.

Projekt ansehen

Abgeschlossen

Januar 2020

Komponenten

  • Joomla! CMS
  • personalisierter Page Builder
  • AWS Cloud
  • AWS Serverless Image Handler

Der Kunde

Im Jahr 1964 hat die Realschule Fürstenfeldbruck als erste im Landkreis Fürstenfeldbruck erstmals ihre Pforten geöffnet und seit 1978 trägt sie offiziell den Namen „Ferdinand-von-Miller-Realschule“. Heute werden täglich 1145 Schülerinnen und Schüler von nahezu 90 Lehrkräften ganz unter dem Motto „Fairness. Vielfalt. Miteinander.“ unterrichtet.

Im Sommer 2019 beauftragte die Realschule Fürstenfeldbruck uns, eine neue Website zu entwickeln, die auf moderne Art und Weise den Charakter der Schule und die Menschen dahinter der Öffentlichkeit präsentiert.

Lösungen für Probleme

Betrachtet man die alte Website aus konzeptioneller Sicht, war das Offensichtlichste die fehlende konsistente Struktur und ein einheitliches Seitenbild. Einige der Seiten hatten lediglich eine Überschrift und ein paar Verlinkungen, die keinerlei Bezug zueinander und dem Kontext bildeten. Andere Seiten waren lediglich als PDF-Datei vorhanden.

Außerdem wichtige Punkte waren die mobile Optimierung und Indexierung bei Suchmaschinen: Einige Komponenten der alten Website spielten hierbei bereits mit, andere, wie der Header, aber nicht. Hinzukommend war die Indexierung der Website von Suchmaschinen auf der kompletten Website blockiert.

Desktop- und Mobil-Ansicht der Website

Damit wir wissen, mit wem wir sprechen

Bei der Analyse der Zielgruppe lagen besonders neue Schülerinnen und Schüler mit ihren Eltern, aber auch Pressvertreter und Interessenten im Fokus. Ein breites Spektrum entstand, das viele Knack-Punkte in der Kommunikation, Usability und dem Design mit sich brachte.

Die Idee hinter der Website

Bevor wir über Lösungen gesprochen haben ging es erst einmal darum, die bestehende Website der Realschule Fürstenfeldbruck zu analysieren. Dabei wurden Ursachen für die Probleme gesucht und Lösungen evaluiert. Außerdem wurden die Ziele, Anforderungen und Visionen für die neue Website diskutiert.

Der erste Schritt war es eine Seitenstruktur zu entwickeln, die die Inhalte sinnvoll gliedert. Dabei entstanden Überbegriffe, welche als Themenbereiche fungieren und von Unterpunkten ergänzt werden. Außerdem haben wir Seitenlayouts entworfen, welche den Inhalten feste Positionen auf einer Seite zu weißen. Das hilft dem Nutzer nicht nur sich besser zurechtzufinden, sondern schafft auch eine einheitliche Struktur über die gesamte Website.

Tablet-Ansicht der Website

Lassen wir die Bilder sprechen

Weil alleinstehende Texte auf einer Website nicht wirklich spannend sind, entwickelten wir eine eigene Bildsprache für die Realschule Fürstenfeldbruck. Ganz nach dem Motto „Weniger ist mehr“. Die Bildsprache gibt den Inhalten einen persönlichen Touch und lässt den Nutzer emotional an den Inhalten teilhaben.

Gemacht, um zu beeindrucken

Der nächste Schritt beim Website-Relaunch der Realschule Fürstenfeldbruck war das Webdesign. Die Basis dafür schaffen die neuen Inhalte und das Seitenlayout, aber vor allem die bestehende Corporate Identity der Realschule. Mit den Richtlinien der Corporate Identity entstand ein persönliches responsive Webdesign, welches perfekt für alle Endgeräte optimiert ist. Besonderen Wert legten wir auch auf die User-Experience. Das schaffen wir durch zahlreiche Micro-Interactions bei Buttons und Animation der Inhalte. Ein einzigartiges Nutzererlebnis schafft aber erst das Zusammenspiel aus UI- & UX-Design, sowie der Inhalte und Bildsprache.

Responsive Webdesign der Website

Niemals war es einfacher

Das CMS „Joomla!“ bildet nur die Basis für eine komplett auf die Realschule Fürstenfeldbruck abgestimmte Verwaltungsoberfläche, die größtenteils über einen Page-Builder einfach per Drag-and-Drop funktioniert. Die einsetzbaren Module wurden komplett für den Einsatz auf dieser Website entwickelt und lassen so den Administrator mit wenigen Mausklicks eine Seite bearbeiten.

Zusätzlich wurde auch eine automatische Bildoptimierung eingebaut, die es erlaubt, Bilder in zahlreichen Endformaten passend auszugeben. Das spart beim späteren Content-Management Zeit und Ressourcen.

Wie auf Wolken

Die komplette Bereitstellung der neuen Website läuft über die AWS Cloud ab. Grund dafür ist u. a. die extrem hohe Ausfallsicherheit der Dienste und leistungsstarken Komponenten. Aber auch die enorme Skalierbarkeit und Flexibilität der Systeme spielt hierbei eine große Rolle. Vor allem, wenn es um die Entwicklung eigener Lösungen, wie z.B. der automatischen Bildoptimierung geht.

Diese Technologie aus der AWS Cloud kommen zum Einsatz:

  • AWS Route 53
  • AWS Elastic Compute Cloud (EC2)
  • AWS Lambda, AWS S3, AWS CloudFront und AWS API Gateway zur automatischen Anpassung von Bildern
  • AWS CloudFront als CDN für alle statischen Inhalte
Auf unserer Website verwenden wir Cookies, auch von Drittanbietern, um Informationen über die Nutzung des Angebots zu sammeln. Diese helfen uns dabei, Anpassungen an der Usability und dem Inhalt vorzunehmen. Du kannst der Verwendung dieser Cookies widersprechen. Weitere Informationen und Details zu den verwendeten Cookies und dem Datenschutz erhältst du in der Datenschutzerklärung. Weitere Informationen