Menü
Jede Homepage besteht aus einer mehr oder weniger großen Anzahl an teils sehr unterschiedlichen Bereichen, Unterseiten, Funktionen und optisch unterschiedlichen Sektionen. Auf dieser Website zeige ich Ihnen die wichtigsten Homepage Elemente. Ferner erfahren Sie, welche Elemente es gibt, wie man sie einsetzt und das ein sparsamer Umgang mit Website-Elementen durchaus zu berücksichtigen ist. Haben Sie zum Beispiel den farbigen Streifen oben auf der Seite schon gesehen? Diese „Farb-Animation“, die in regelmäßigen Abständen die Farbe wechselt, kann man als nervig empfinden oder als nettes Design Gimmick des Layouts. Fakt ist, dass es das Webdesign beeinflusst. Ob negativ oder positiv, hängt zweifelsfrei von der Zielgruppe einer Website ab.
Wie dem auch sei, nun kommen wir zum eigentlichen Thema – die Elemente einer Website.
Im Header befindet sich auf den meisten Webseiten eine mehr oder weniger lange Liste an Begriffen (oder Symbolen), die man anklicken kann. Über diese kann der Nutzer die Unterseiten erreichen. Neben dem Impressum oder der Datenschutzerklärung kann man hier auf vielen Seiten ctas und zur Startseite der Domain navigieren.
Die Navigationsleiste ist eben die zentrale Anlaufstelle, um bestimmte Informationen einsehen zu können. Beim Erstellen einer Navigation ist es sehr wichtig, die einzelnen Navigationspunkte mit üblichen und vor allem verständlichen Begriffen zu versehen.
Wenn man den rein wirtschaftlichen Aspekt betrachtet, ist das Element „Call-to-Action“ sicher der wichtigste Bereich des Website Layouts. Schließlich verfolgt man ja ein bestimmtes Ziel. Man möchte, dass der User Kontakt aufnimmt, ein Newsletter abonniert, an einer Umfrage teilnimmt oder schlicht etwas bestellt. Ein Website-Besucher ist in vielen Fällen ein potenzieller Kunde. Daher sollte eine gute Website dem Besucher klar signalisieren, was er über einen Button erreichen kann. Idealerweise kann der User ohne scrollen zu müssen, die CTA – Buttons klicken und die vom Webseite-Betreiber gewünschte Aktion ausführen.
Ein „Call to Action“ ist ein Handlungsaufforderungselement auf einer Website, das den Nutzer dazu animieren soll, eine bestimmte Handlung auszuführen. In der Regel handelt es sich dabei um einen Button oder einen Link, der den Nutzer dazu bewegt, ein Formular auszufüllen, ein Kauf oder eine ähnliche Aktion durchzuführen. Ein CTA sollte daher gut sichtbar und ansprechend gestaltet sein, um die Aufmerksamkeit der Nutzer zu erregen. Es ist wichtig, die Sprache und das Design so zu gestalten, dass der Nutzer versteht, welche Aktion er ausführen soll und welche Vorteile ihm es bringt. Eine gut gestalteter Aufforderung zum Klicken kann die sogenannte „Conversion-Rate“ auf einer Website erheblich steigern. Das Ziel sollte es sein, den Nutzer dazu zu bringen, eine positive Handlung auszuführen und letztendlich den Erfolg der Website zu steigern.
Es kann besonders auf kleinen Bildschirmen der Smartphones eine Herausforderung sein, die gewünschten Elemente ohne zu scrollen in das Website-Layout sichtbar einzubinden. Unter „above the fold“ versteht man eben genau diese Eigenschaft: Der Nutzer soll alle wichtigen Informationen auf ersten Blick sichtbar ohne scrollen (wischen) zu müssen, zu Gesicht bekommen. Es ist also beim Erstellen einer Website sehr wichtig, den Header (üblicherweise mit Logo und der Navigationsleiste), ein Titelbild und ein Button zur Klick Aufforderung so zu platzieren, dass diese ohne Weiteres sichtbar sind. Studien haben gezeigt, dass eine Berücksichtigung der „Oberhalb der Scrollgrenze – Regel“ entscheidend für den Erfolg sind.
Eine Webseite enthält üblicherweise verschiedene Inhalte, die sowohl visuell als auch textlich aufbereitet werden. Dazu zählen etwa die Startseite, die Über-uns-Seite, Produkt- oder Dienstleistungsbeschreibungen, Kontaktseiten und News oder Blogbeiträge. Die Startseite ist dabei oft das Aushängeschild der Webseite und sollte daher auf den ersten Blick einen guten Eindruck hinterlassen. Hier kann man oft die wichtigsten Informationen sowie Einstiegsmöglichkeiten zu anderen Bereichen der Webseite finden.
Die Über-uns-Seite gibt Auskunft darüber, wer hinter der Webseite steckt und was das Unternehmen oder die Organisation ausmacht. Produkt- oder Dienstleistungsbeschreibungen bieten dem Besucher Informationen darüber, was angeboten wird, welche Vorteile sich daraus ergeben und eventuell auch, wo oder wie man das Produkt oder die Dienstleistung erwerben kann. Kontaktseiten sind für den Besucher wichtig, um bei Fragen oder Anliegen schnell und einfach Kontakt aufnehmen zu können. Häufig sind auch FAQ – Bereiche sinnvoll da diese häufig gestellte Fragen schnell beantworten.
News oder Blogbeiträge wiederum ermöglichen es, aktuelle Themen und Trends aufzugreifen und den Besucher mit relevanten Inhalten zu versorgen. All diese Inhalte sollten dabei übersichtlich und leicht zugänglich gestaltet sein, um den Besucher auf der Webseite zu halten und ihm die Navigation zu erleichtern. Eine gute Nutzerfreundlichkeit ist hierbei von zentraler Bedeutung. Denn auch wenn es überheblich klingen mag: Niemand möchte seine Kundschaft überfordern.
Diese 4 Bereiche einer Homepage sind jedoch nicht unbedingt als eigentliche Homepage Elemente zu verstehen. Im Kern möchte ich hier moderne Homepage Elemente zeigen, mit denen man die Inhalte zumeiste innerhalb des Inhaltsbereiches strukturiert, gestaltet und präsentiert.
Es geht bei jeder auch noch so kleinen Homepage darum, den Inhalte so aufzubereiten, dass der Besucher diesen schnell erfassen, leicht verstehen und in guten Portionen konsumieren kann.
So sollte man den Text nicht nur mit Überschriften versehen, sondern auch in gedanklich sinnige Absätze und Kapitel unterteilen. Da man im Webdesign mehr als nur Text darstellen kann, kann es fast imer gut sein, die Texte mit Bildern, Videos, Infografiken oder sonstigen hilfreichen Elementen zu unterfüttern.
Diese Website ist eine Muster-Homepage und ein kleiner Webdesign Blog. Ziel dieses Webprojektes ist es, die unterschiedlichen Homepage Elemente, die auf Webseiten verwendet werden, zu beschreiben und zu erklären.