Optimale Webseitenpräsenz Modern designte Webseiten in Deutschland: Das können Unternehmen von ihnen lernen

Eine optimale Internetpräsenz wird immer wichtiger. Auch das responsive Design, also die Optimierung für mobile Endgeräte, ist ein wichtiges Kriterium für eine gelungene Webseite. (Bild:  picture alliance / NurPhoto | Jaap Arriens)

Die Studie wird seitdem weitergeführt und aktuellere Daten zeigen, dass viele kleinere und mittlere Unternehmen in den letzten Jahren ihre Webseitenauftritte durchaus optimiert haben. Allerdings ist dies aufgrund der Pandemielage wenig verwunderlich.

Wer als Unternehmen überleben wollte und will, musste sich neue, vor allem digitale Strategien überlegen.

Doch was macht eine optimale Internetpräsenz aus?

Zu den wohl wichtigsten Kriterien einer optimalen Webseitenpräsenz zählen Aspekte wie schnelle Ladezeiten, eine gutstrukturierte Navigation, ein optimaler Ersteindruck durch die Startseite, Usability und User Experience, die Auffindbarkeit der Seite bei den gängigen Suchmaschinen wie Google, ein responsives Design, das Vorhandensein von Interaktionsmöglichkeiten und guter Content. Daneben muss eine Webseite aber auch optisch in seinem Design ansprechend sein.

Folglich sollen die wichtigsten Kriterien näher erläutert und anhand von Praxisbeispielen gezeigt werden, warum modern designte Webseiten mehr Erfolg im Marketing haben.

Wichtigsten Kriterien bei der Erstellung der Webseite

Im Vorfeld jeder Webseitenerstellung muss das Unternehmen sich darüber Gedanken machen, welche Zielgruppe anzusprechen ist und welche Ziele mit der Internetpräsenz verfolgt werden sollen. Neben diesen zwei zentralen Punkten spielt ebenso ein kurzer, prägnanter Domainname eine wichtige Rolle – insbesondere für den Ersteindruck.

Weitere wichtige Kriterien sind:

1. Schnelle Ladezeiten

Generell gilt, dass die Ladezeit nicht mehr als zwei Sekunden betragen sollte, bei einer Ladezeit unter einer Sekunde wird von einer sehr guten Performance gesprochen. Das schaffen laut einer Erhebung von Think with Google und MMA im Jahre 2019 mobile Seiten wie booking.com oder auch otto.de. Danach brauchen deutsche mobile Webseiten im Schnitt 2,625 Sekunden für die Ladezeit, Deutschland liegt damit weltweit im Mittelfeld. Das Problem: Lädt die Seite zu langsam, sinkt die Conversion-Rate (z. B. der Anteil an allen Besuchern einer Webseite, die auch einen Kauf vornehmen) signifikant.

2. Navigation

Wichtig ist hier eine intuitive sowie einfache Navigation zu realisieren. Nur wenn sich der Seitenbesucher ohne Probleme auf der Webseite zurechtfindet, wird er länger auf dieser verweilen und seinen Besuch nicht abbrechen. Unterschieden werden können hier grob vertikale und horizontale Navigationsstrukturen. Welche sich besser eignet, hängt von dem Umfang der Informationen ab. Neben der Bedeutung für die Usability der Nutzer spielt die Navigationsstruktur auch eine wichtige Rolle für die Suchmaschinen­optimierung. So sollten die Namen der einzelnen Navigationspunkte auch passend zu den wichtigsten Keywords des Unternehmens sein.

3. Startseite

Untersuchungen haben ergeben, dass Besucher von Webseiten innerhalb von nur 2,6 Sekunden entscheiden, ob sie sich weiterhin die Webseite ansehen oder den Aufruf derer abbrechen. Die Aufgabe eines Webseitenbetreibers liegt also darin, die Startseite so zu gestalten, dass sie kurz und prägnant über alle wichtigen Fragen zum Angebot der Seite informiert. Sie fungiert demnach als Schaufenster der Webseite. Weiterhin hat die Startseite aber auch eine wichtige Funktion für die Suchmaschinenoptimierung, da sie SEO-Inhalte über die Meta-Tags transportiert.

4. Usability

Mit Usability ist im Grunde die Benutzerfreundlichkeit der Webseite gemeint. Es geht also darum, wie gut sich der Besucher auf der Unternehmenswebseite zurechtfindet, wie intuitiv sich Nutzer durchnavigieren können und wie einfach die einzelnen Funktionen der Webseite von Usern ausgeführt werden. Hierfür können sich Betreiber von Webseiten beispielsweise an folgende Regeln halten: informative und eindeutige Überschriften, ausreichende Schriftgröße und Zeilenabstand, Layout passend zum Browserfenster uvm. – weitere Regeln finden sich auf der Informationsseite onlinemarketing-praxis.de.

5. User Experience

Unter dem Begriff User Experience wird das gesamte Nutzererlebnis von Webseitenbesuchern verstanden. Dieser Aspekt nimmt immer mehr an Bedeutung zu, da es durch die Fülle an Webseiten schwieriger wird, sich abzuheben. Ein entscheidender Punkt liegt dabei in der Usability. Kommt der Nutzer mit der Webseite gut zurecht, ist die Basis für ein Nutzererlebnis geschaffen. Ein weiterer wichtiger Aspekt dürfte die Möglichkeit zur Interaktion sein.

6. Mehrwerthaltiger Content

Bei den Inhalten der Webseite kommt es nicht auf den Umfang an. Vielmehr sollte auf hochwertigen Content geachtet werden, der dem Leser einen Mehrwert bietet. Vier Merkmale sollte ein Text beinhalten: er sollte einzigartig sein, einen Mehrwert bieten, qualitativ hochwertig sein und eine gewisse Anzahl an Keywords enthalten. Insgesamt sollten Informationen auch aus optischer Sicht optimal aufbereitet werden: Keine zu langen Absätze, Bilder, Videos oder Grafiken, ausreichend Zeilenabstand usw.

7. Responsives Design

Bei einem responsiven Design passt sich das Layout einer Webseite automatisch auf das Ausgangsmedium an. Dafür werden flexible Gestaltungsraster (Grids) verwendet. Die Webseite passt sich also auch auf mobile Endgeräte an. Das ist bei einer immer weiter steigenden Nutzung von Smartphones immens wichtig. Zudem ergaben Untersuchungen, dass Unternehmen, die keine auf Mobilgeräte optimierten Webseiten haben, sich nicht um diese kümmern würden. Eine moderne und professionelle Onlinepräsenz schafft demnach auch Vertrauen.

8. Suchmaschinenoptimierung

SEO bzw. die Suchmaschinenoptimierung stellt einen weiteren wichtigen Aspekt dar. Wer nicht über Suchmaschinen wie Google auffindbar ist, verschenkt letztlich wichtiges Potenzial. Maßnahmen, die auf der Webseite hinsichtlich SEO vorgenommen werden, werden Onpage-Maßnahmen genannt. Dazu gehören u. a. technische Voraussetzungen zu schaffen, Keywords zu integrieren, eine optimale Navigation bzw. Seitenstruktur aufzubauen, Meta-Tags als Markierungen im HTML-Code, Ladezeiten oder auch Verlinkungen.

9. Social-Media-Verknüpfungen

Insgesamt sollten auf allen Kanälen, egal, ob auf der Webseite, bei Facebook, Instagram oder anderen genutzten Social-Media-Plattformen immer Verknüpfungen zu allen Accounts, Profilen oder Onlinepräsenzen enthalten sein. Auf der Webseite selbst lassen sich zum Beispiel mit entsprechender Technik eine Vorschau von aktuellen Facebook-Beiträgen integrieren. So präsentieren Unternehmen ihren Nutzern über verschiedene Kanäle mögliche interessante Beiträge.

10. Interaktionsmöglichkeiten

Ein Call-to-Action (CTA) ist eine Text-oder Grafik-Schaltfläche auf der Webseite, zum Beispiel in Form eines Buttons oder Banners. Dieser kann beispielsweise genutzt werden, damit potenzielle Kunden einen Newsletter abonnieren oder zur schnellen Kontaktaufnahme.

11. Design

Schließlich muss auch das Design passen. Das ist immerhin das erste, was die Nutzer sehen. So basieren 94 Prozent der ersten Eindrücke von Webseiten ausschließlich auf deren Aussehen. Zudem würde laut Befragungen ein ansprechendes Design maßgeblich über die Vertrauenswürdigkeit eines Unternehmens entscheiden.

Möglichkeiten der Webseiten-Umsetzung

Abhängig von den jeweiligen Bedingungen eines Unternehmens gibt es unterschiedliche Möglichkeiten, eine moderne Webseitenpräsenz umzusetzen:

1. Beauftragung einer Agentur

Wer eine individuelle Webseite erstellen möchte, kann einen Experten hierfür beauftragen – das übernehmen in der Regel entsprechende Agenturen. Hier wird eine Webseite ganz nach den Wünschen des Kunden kreiert. Diese Variante ist zumeist am teuersten und auch am zeitaufwendigsten, dafür ist das Ergebnis auf die individuellen Bedürfnisse abgestimmt. Aber: Gerade in Bezug auf Neuerungen oder SEO ist mit Folgekosten durch Wiederbeauftragung zu rechnen.

2. Webseiten-Baukasten

Insbesondere für Einsteiger oder für spezielle Projekte ist die Nutzung von Homepage-Baukasten passend. Hier lässt sich mit Hilfe von fertigen Layout-Vorlagen die Gestaltung einfach umsetzen. Bei einem Homepage-Baukasten kommen weitere Leistungsmerkmale hinzu: Gestaltungsfreiheit, KI-Assistenten, Analyse-Tools, Verknüpfungen zu allen Kanälen. Der Vorteil liegt darin, dass kein Hosting gebraucht wird. Zudem ist der Preis meist niedrig. Allerdings sind Designanpassungen oder Funktionalitäten meist nur eingeschränkt möglich, wodurch vor allem die Erstellung von Landing-Pages hierüber interessant sind, weniger große Webseiten.

3. CMS

Sogenannte Content-Management-Systeme (CMS) sind Programme, mit denen Inhalte erstellt, verwaltet und bearbeitet werden können. Sie sind in ihrer Anwendung einfach und schnell. Eine mit CMS erstellte Webseite kann durch unterschiedliche Funktionen wie Plugins, Extensions und Widgets verändert und vergrößert werden. Durch die Flexibilität, die sich über CMS bietet, ist diese Variante für kleinere und mittlere Webseiten geeignet. Dennoch sind größere Anpassung meist ohne Programmierer kaum möglich.

Zusätzlich existieren auch kostenfreie Varianten wie WordPress.com, allerdings eignen sich diese nur für ganz kleine Blogprojekte.

Vier Beispielwebseiten mit modernem Design

Vier Best-Case-Beispiele werden hinsichtlich Designs, User Experience, Performance und Seitenstruktur vorgestellt:

1. HelloFresh

Bereits bei der Startseite wird klar, worum es bei der Webseite geht. Hier lassen sich Kochboxen bestellen. Das Design ist durch das große Bild modern und aussagekräftig. Zudem gibt es mit dem „Kochboxen ansehen“-Button einen CTA, welcher dem Nutzer eine Interaktionsmöglichkeit bietet. Beim Scrollen nach unten erhält der Nutzer alle weiteren wichtigen Informationen. Die Seite ist übersichtlich gehalten, die Informationen zielgruppengerecht formuliert.

2. mymuesli.de

Bei mymuesli stehen die Produkte im Vordergrund. Mit der horizontalen Navigationsstruktur hat der Nutzer sofort einen Überblick über sämtliche Produktkategorien. Da ein Fokus auf ein ansprechendes Verpackungsdesign gelegt wird, wirken die Produktbilder qualitativ hochwertig. Das kommt dem Design sehr zugute. Es gibt zahlreiche Interaktions-Buttons bereits auf der Startseite, um zum Beispiel direkt zum Warenkorb zu gelangen, um die Topseller zu entdecken oder mehr Informationen zu einzelnen Themen zu erhalten.

3. Surf Happy

Hier wird im Design das gelebt, was das Unternehmen aussagen will. Die Vermittlung einer positiven Einstellung. Das schafft die Webseite durch die Verwendung von hellen Farben, gutgelaunten Models und eine lässige Atmosphäre. Mehrere, klare CTAs sind auf der Homepage vorhanden, die den Nutzer direkt zu den Produktseiten führen. Insgesamt besticht Surf Happy durch seine Einfachheit, die klare Navigationsstruktur und der deutlichen Markenbotschaft.

4. WDR Zeitkapsel

Es handelt sich hierbei um ein interaktives VR-Webprojekt (Virtual Reality) des öffentlich-rechtlichen Senders WDR. Hier können sich Nutzer interaktiv auf eine Zeitreise machen. Bei diesem Projekt wird sichtbar, was online mittlerweile alles möglich ist. Das Projekt läuft mit einer maximalen Auflösung von 8k und das auf fast allen Endgeräten. Das Design der Webseite wirkt bereits wie der Beginn eines Films. Durch CTA läuft die Geschichte in die gewählte Richtung weiter. User werden ständig zu Aktionen aufgefordert, was ein einmaliges Nutzererlebnis verspricht.

Fazit: Darauf sollten Unternehmen bei der Design-Wahl moderner Webseiten achten

Die Praxisbeispiele verdeutlichen, dass ein ansprechendes Design enorm wichtig für den ersten Eindruck und für die Vertrauenswürdigkeit aus Sicht eines Webseitenbesuchers ist.

Dabei sollte das Design nicht einfach nur modern und ansprechend gewählt werden, sondern zur Marke, zum Projekt oder zum Unternehmen passen, indem es die Werte oder Kernbotschaft verdeutlicht.

Ihr Unternehmen zeichnet sich beispielsweise dadurch aus, dass es sehr nachhaltig agiert? Dann nutzen Sie die typischen assoziierten Attribute von Nachhaltigkeit im Design, beispielsweise durch die Verwendung von natürlichen Farben.

Weiterhin spielen CTAs eine immens wichtige Rolle bei allen angeführten Beispielen. Dieser Aspekt sollte unbedingt bei der Planung der Webseite miteinbezogen werden, um dem Nutzer eine User Experience bieten zu können.

Schließlich spielen Merkmale wie Einfachheit, schnelle Ladezeit und klare Navigationsstrukturen eine wichtige Rolle bei allen Beispielen – Attribute für eine optimale Usability.

Täglicher Newsletter der Insightsbranche

News +++ Jobs +++ Whitepaper +++ Webinare

Newsletter abonnieren

Wir beliefern täglich mehr als 9.000 Abonnenten

Datenschutz