Webdesign-Portfolio
Webdesignerin
Schule

Schule
Projekt: Website Grundschule Bergstedt
Projektübersicht
Kunde: Schule Bergstedt Hamburg
Projekt: Gestaltung einer neuen Schul-Website
Projektziele
Die Website wurde mit dem Ziel gestaltet, eine übersichtliche und einladende Plattform für Schüler, Eltern und Lehrer zu schaffen. Der Fokus lag auf Klarheit, Zugänglichkeit und einer positiven Nutzererfahrung. Hier sind einige Schlüsselaspekte des Designs:
Design-Konzept
Logo Design
Ein zentrales Element des Projekts war die Gestaltung eines neuen Logos für die Grundschule Bergstedt. Das Logo vereint moderne Designprinzipien mit einer spielerischen und freundlichen Ästhetik, die die Werte und den Charakter der Schule widerspiegelt. Es wurde darauf geachtet, dass das Logo einfach, einprägsam und vielseitig einsetzbar ist, sowohl auf der Website als auch in anderen Medien der Schule. Die Farben und Formen des Logos wurden so gewählt, dass sie harmonisch mit dem Gesamtfarbschema der Website harmonieren.

Desktop mit der Darstellung eines Teils der Homepage inkl. Menü und Teil der Sitebar
UX-Design
Die Website besitzt durch ihr funktionales und benutzerfreundliches UX-Design, das sowohl Eltern, Schüler als auch Lehrer anspricht. Die klare Struktur der Navigation ermöglicht es den Nutzern, schnell und einfach die gewünschten Informationen zu finden. Die Hauptmenüs sind übersichtlich angeordnet und bieten direkten Zugang zu wichtigen Bereichen wie dem Stundenplan, aktuellen Nachrichten und Kontaktinformationen.
Die Integration von aktuellen Nachrichten und Veranstaltungen auf der Startseite, die dafür sorgt, dass Eltern und Schüler stets über die neuesten Entwicklungen und Angebote informiert sind. Auch die Bereitstellung von wichtigen Dokumenten und Formularen zum Download ist ein praktischer Service.
Farben und Typographie
Die Website verwendet ein freundliches und harmonisches Farbspektrum, das die Werte der Schule unterstreicht. Verschiedene Grüntöne mit Akzenten eines großen Farbspektrums schaffen eine fröhliche Atmosphäre, während die sorgfältig ausgewählten Schriftarten eine moderne, kindliche und leicht lesbare Präsentation gewährleisten.
Farbskala der Website
Visuelle Elemente
Durch den Einsatz hochwertiger Bilder und grafischer Elemente wird das Schulumfeld lebendig und einladend dargestellt. Die Fotos der Schule, der Schüler und der Lehrer wurden sorgfältig ausgewählt, um eine authentische und positive Darstellung der Schulgemeinschaft zu gewährleisten.

Desktop mit der Darstellung eines Teils der Homepage, wobei Logo, Icons und auch Bilder zu sehen sind
Funktionalität
Responsivität
Um den unterschiedlichen Bedürfnissen der Nutzer gerecht zu werden, wurde die Website responsiv gestaltet. Das bedeutet, dass sie auf allen Geräten – von Desktops über Tablets bis hin zu Smartphones – optimal dargestellt wird. Dies gewährleistet eine konsistente Benutzererfahrung, unabhängig vom Endgerät.

Desktop mit der Darstellung eines Teils des Termin-Sliders
INformationsbereiche
Informative Bereiche wie einen Veranstaltungskalender und aktuelle Nachrichten. fördern die Kommunikation und halten die Besucher stets auf dem Laufenden über die neuesten Entwicklungen und Ereignisse an der Schule. Der Terminkalender ist in mehreren Bereichen der Website zu finden, u.a. auch als Download PDF, da er für alle Nutzer das wichtigste Element widerspiegelt.
Kontakt
Neben der von mir erstellten Skizze der Lage bietet die Website Über verlinkte E-Mail-Adressen und von mir entworfenen Schnell-Kontakt-Buttons kann auf einfache Weise mit der Schule kommuniziert werden.
Lageplan der Schule Bergstedt
Barrierefreiheit
Besondere Aufmerksamkeit wurde der Barrierefreiheit gewidmet. Die Website erfüllt die grundlegenden Anforderungen für barrierefreies Webdesign, um sicherzustellen, dass alle Nutzer, einschließlich Menschen mit Einschränkungen, problemlos auf die Inhalte zugreifen können.
Fazit
Das Design der Website für die Schule Bergstedt kombiniert eine moderne Ästhetik mit praktischen Funktionen und trägt dazu bei, dass die Online-Präsenz der Schule sowohl informativ als auch benutzerfreundlich ist. Diese Webseite hilft der Schule, ihre Informationen klar und ansprechend zu präsentieren und bietet einen positiven Einstieg für alle Besucher.









