Webdesign & Frontend-Entwicklung: One-Pager
Projekt (Studium)
Ein One-Pager mit fiktivem Thema sollte mit folgenden Vorgaben umgesetzt werden:
- HTML- und CSS-Code sollen valide sein
- Das Design soll zum Thema passen
- Der Einsatz von interaktiven Funktionen (Slider, Bildergalerie oder ähnliches) ist gewünscht
Meine Arbeit
Konzeption, Branding, Logogestaltung, Screendesign, Coding mit HTML, CSS und JavaScript, Responsives Webdesign
Design Styleguide
Farben
Das warme Gelbgold erinnert an Honig, die erdigen Töne ergänzen den bodenständigen, ursprünglichen Charakter des Naturprodukts und stehen symbolisch für das Handwerk der Imkerei.
Typografie
Die typografische Gestaltung unterstreicht die schlichte Bodenständigkeit der Imkerei. Das klare Schriftbild ermöglicht eine leichte Informationsaufnahme, wodurch zudem das Umweltbewusstsein betont wird.
Bildsprache
Natürliche Fotos zeigen den Honig in seiner Verwendung und wecken die Lust auf das Naturprodukt. Zudem zeigen die Aufnahmen von Bienen und Blüten den Zusammenhang mit der Natur auf und bieten einen Übergang zu informativen Inhalten rund um den Honig. Abgerundete Bilder unterstreichen die sanfte Wärme des Produkts.
Responsive Webdesign
Die Webseite ist vollständig responsiv umgesetzt.
Interaktivität
Slider
Als interaktive Funktion habe ich mich für einen Slider entschieden.
Durch ihn können tiefergehende Informationen über die Entstehung des Honigs in kleine Häppchen unterteilt werden, ohne dass sie optisch zu viel Raum beim One-Pager einnehmen. Möchte man nur schnell zum Ziel gelangen und Honig bestellen, kann man einfach weiterscrollen. Interessiert einen aber die Entstehung, kann man sich die vier Slides anschauen und die kurzen Informationstexte lesen.
Screendesign
Leistungsschein
Learnings
Es gibt tausende verschiedener Schriftarten. Für jede gewünschte Wirkung findet man eine passende Typografie. Leider sind aber nicht alle Zeichen in jeder Schriftart vorhanden.
Und dann passieren natürlich auch noch Fehler. In der hier verwendeten Schriftart “Halant” wurden die deutschen Umlaute nicht sauber in die Lineatur eingearbeitet, sodass das “Ü” ein bisschen oberhalb der restlichen Buchstaben liegt.
Ich habe die Schriftart trotzdem verwendet, weil ich es ganz charmant fand und das Ü in den Überschriften nur ein einziges Mal auftaucht. In dieser einen Überschrift wirkt es verspielt und erinnert ein bisschen an eine umherschwirrende Biene.
Grundsätzlich würde ich aber keine Schriftart mehr verwenden, bei der ich nicht alle Zeichen genau geprüft habe.