Neuer Webauftritt für das offizielle Portal der Berufsbildung

SDBB | Abteilung Medien Berufsbildung

Das offizielle schweizerische Portal zur Berufsbildung richtet sich an alle Beteiligten der Berufsbildung: Berufsbildner/innen, Fachleute in kantonalen Ämtern, Prüfungsexperten und Lernende finden hier Informationen zur beruflichen Grundbildung. Abrufbar sind aber auch sämtliche benötigten Formulare und Dokumente, Richtlinien sowie gesetzliche Grundlagen – und das in den Sprachen Deutsch, Französisch, Italienisch und Englisch.

Wie haben wir es geschafft, eine Website für so unterschiedliche Bedürfnisse zu gestalten? Hier zeigen wir Ihnen unsere Lösung.

Kunde: SDBB | Abteilung Medien Berufsbildung
Kunde seit: 2019
Go-Live: Juni 2024
Website: www.berufsbildung.ch

Ausgangslage

Wer sucht, der findet?

Die Website Berufsbildung.ch war bereits seit einigen Jahren verfügbar. Allerdings war die Struktur veraltet und die Benutzeroberfläche nicht an die heutige, oft mobile Nutzung ausgerichtet. Im Zentrum des Relaunchs stand deshalb ein komplettes Redesign, mit einer völlig neuen Architektur.

Lösung

Eine Suche, die mitdenkt

Zuerst wollten wir verstehen: Wer nutzt die Website wofür? In Interviews und Workshops haben wir die Bedürfnisse der verschiedenen Zielgruppen kennengelernt. Mit der Card-Sorting-Methode und dem Fachwissen unserer Kund:innen konnten wir die Inhalte neu strukturieren.

Screenshot der Suchmaske, mit Filter- und Themen-Wahl

Clever filtern statt lange suchen

Die neue Suchfunktion ist das Herzstück der Website. Wir haben gemeinsam alle Inhalte strukturiert erfasst und «vertaggt»: Lexikonartikel, Dokumente, FAQ-Beiträge, News und Pages. Damit können wir neu automatisiert passende Inhalte auf Inhaltsseiten ausspielen, also z.B. zum Thema passende News oder nützliche Downloads.

Im Suchfenster können User neben dem gewünschten Stichwort entsprechende Felder auswählen und zusätzlich nach Themenbereich eingrenzen. So erhalten sie je nach Bedürfnis gezielt Informationen, erforderliche Dokumente, aktuelle News, vertiefende Hintergrundinformationen oder finden bei den FAQ Antworten auf brennende Fragen.

UX-Writing & Typographie-Konzept

Wenn eine Webseite praktisch ausschliesslich aus Fakten und Informationen besteht, ist ein attraktives Schriftbild unerlässlich. Um die Lesbarkeit sicherzustellen und ein visuell ansprechendes Design zu erarbeiten, haben wir einerseits die Titel- und Untertitel-Struktur optimiert und die Auswahl und Anordnung der Schriften sorgfältig berücksichtigt:

Titel und Untertitel führen das Auge und verbessern die weiterführende Navigation.
Schriftart, Schriftgrösse, Abstände und Hierarchie haben eine hohe Priorität, wenn es darum geht, User in einem textlastigen Umfeld Fokussieren zu helfen und Ermüdungserscheinungen abzuwenden. Die verwendete Schriftfamilie IBM Plex Sans und IBM Plex Serif ist so konzipiert, dass sie sich gut ergänzt, jedoch Flexibilität und Konsistenz auf der gesamten Benutzeroberfläche gewährleistet. 
Die Berücksichtigung der Zeilenhöhe ist ebenfalls von entscheidender Bedeutung, da sie die Lesbarkeit und den visuellen Reiz erheblich beeinflusst. Angemessene Abstände verbessern die Lesbarkeit und die Gesamtästhetik des Textes.
Um die optimale Lesbarkeit sicherzustellen, wurde auch auf die Breite der Textkomponente auf dem Raster geachtet: User sollen eine ganze Zeile bequem lesen können, ohne den Kopf zu bewegen, einfach, indem sie ihre Augen bewegen.
Für Abwechslung sorgt die Kombination von Serifen und serifenlosen Schriften, der gezielte Einsatz von Wörtern in Grossbuchstaben sowie Schriftschnitte von Light bis Semibold. Sie alle dienen der Orientierung und schaffen Anreiz, viel Text auf einer Seite attraktiv und gut lesbar zu konsumieren.

Schritt für Schritt zum Ziel

Nach der Strukturierung haben wir ein neues visuelles Design entwickelt. In agilen Sprints entstanden Wireframes und Templates. Das neue Designsystem haben wir als MVP (Minimum Viable Product) live geschaltet.

Nutzen

Alle finden, was für sie in dem Moment wichtig ist

Die neue Struktur orientiert sich konsequent an den Bedürfnissen der User:innen:

Einfache und logische Navigation nach Phasen der Berufsbildung.
Berufsbilder:innen finden allgemeine Infos im Lexikon mit über 200 Einträgen.
Arbeitgebende und Prüfungsexpert:innen gelangen direkt zu wichtigen Dokumenten.
Fachleute finden vertiefte Informationen in 30 Themendossiers.
News informieren alle zeitnah über Aktuelles.
Weiterführende Informationen, Formulare, Service-Leistungen und Shop werden gezielt angeboten und entsprechend verlinkt.
Ergänzende Themen am Seitenende bieten sinnvolle nächste Schritte an.

Damit ermöglicht die neue Webseite den Betrieb einer umfassenden Informationsplattform zur beruflichen Grundbildung für alle definierten Zielgruppen und Beteiligten.

Screenshot «Weitere Themen», mit Vorschlägen zu passenden Services, Downloads oder Kontaktmöglichkeiten

Für berufsbildung.ch brauchten wir kein Facelift, sondern einen von Grund auf neu konzipierten Webauftritt. Mit Unic hatten wir dafür einen Partner, der die Bedürfnisse verstand, Ideen/Ziele konstruktiv hinterfragte und kreative Lösungen entwickelte. Wir sind sehr zufrieden mit dem Resultat.
Alexander Graf | Abteilungsleiter Medien Berufsbildung 