Was macht eine gute Website aus? Eine Kurzanleitung zum Website-Design

Fun Fact: Es existieren heute fast 2 Milliarden Websites auf der Welt.

Bei so vielen Websites kann es schwierig, gar unmöglich sein, sich von der Masse anzuheben

Es ist bereits schwierig genug, Traffic auf Ihre Website zu bringen. Und es ist noch schwieriger, die Leute zum Bleiben zu bringen, um mit der Website zu interagieren.

Was macht eine gute Website überhaupt aus?

Kurz gesagt, eine gute Website sollte sich in Form und Funktion auszeichnen. Diese muss einen Mehrwert für den Zuschauer bieten. Sie sollte optisch ansprechend und einfach zu navigieren sein. Eine gute performance ist ausschlaggebend! Kuzre Ladezeiten sowie stabiles workflow sind hier Must Haves! Zusammengefasst lässt sich sagen, dass eine gute Website attraktiv, nützlich und funktional sein muss.

Ihre Website ist manchmal das einzige, was Ihre Kunden sehen. Du möchtest, dass der Zuschauer mit der Seite interagiert. Er soll gewillt sein, Buttons zu drücken, sich durch die anschauliche Navigation durch zu klicken und Backlinks zu erkunden.

In diesem Beitrag werde ich dir alles beibringen, was wir über eine großartige Website wissen.

Und du brauchst auch keine Vorkenntnisse als Designer. Hurra!

Genug geredet! Lass uns in das Webdesign eintauchen.

Was macht eine gute Website aus?

Okay, das ist also ein ziemlich großes Thema. Es gibt Tausende von Büchern und Kursen zum Thema Webdesign.

Bevor ich anfange weit auszuholen, erkläre ich dir zuerst die Grundprinzipien. Ich möchte sicherstellen, dass du etwas nützliches mitnimmst und für dich verwenden kannst.

Das sind die 4 Grundprizipien, die eine gute Website vor der Neugestaltung und dem Start erfüllen sollten:

  1. Zweck. Gutes Design beginnt mit einem bestimmten Ziel. Frag dich: "Was möchte ich mit dieser Seite erreichen?" Wenn eine Seite keinen klaren Zweck hat, solltest du diesen vorerst definieren und die Seite überarbeiten.
  • Ästhetisch ansprechend. Die Website muss nicht nur gut aussehen, sie soll auch zeitlich ansprechend wirken – D.h wenn deine Website so aussieht, als wäre sie in den 90er Jahren erstellt worden, ist es Zeit für ein Update.
  • Relevanter und origineller Inhalt. Deine Website muss relevante Inhalte bieten können, die ausschließlich für den Zielmarkt bestimmt sind. Plagiate sind illegal und werden von Google bestraft. Außerdem ist es besser, eine erstklassige Version von sich selbst zu sein als eine zweitklassige Version von jemand anderem.
  • Klare Seiten Navigation. Das ist ein technischer Aspekt, der die Kontrolle und die Performance deine Seite bestimmt. Eine klar definierte Navigation ist ausschlaggebend für eine gute Gesamtübersicht. Jeder Beitrag deiner Website sollte innerhalb von drei Klicks von jeder anderen Seite deiner Website entfernt sein. Deine Navigation sollte intuitiv und einfach sein. Dies hilft sowohl Google für SEO als auch deinen Besuchern bei der Navigation.

1. Visuelles Website-Design (AKA „Prettiness“)

Stell dir für einen Moment ein Szenario vor.

Du suchst ein Geschenk zum Geburtstag deiner Schwester. Du bemerkst einen Tweet von jemandem, dem du folgst und der das neue Kleidergeschäft seines Freundes teilt. Du klickst drauf.

Dann siehst du eine Seite, die aussieht wie in den 90ern stecken geblieben.

Haha, nein. Du bist weg!

Das ist ein extremes Beispiel.

Ist das Design von Websites immer noch sehr wichtig? Selbstverständlich.

Ich werde dir Schritt für Schritt erklären was du tun sollst, damit deine Website gut aussieht!

Du siehst: Visualisierung ist in diesem Thema extrem wichtig! Von der Conversion-Rate bis zur Zeit auf der Seite, der Vertrauenswürdigkeit und den organischen Backlinks (die Ihnen helfen, Ihre Website bei Google zu bewerten) muss einfach alles visuell miteinander harmonieren.

Die Gleichung sieht also so aus: (Beipielbild einer visuell gut gestalteten website)

Wie lässt du deine Seite großartig aussehen? Beginne mit deiner Marke.

Branding durch Site Design

Deine Marke ist dein Image und dein Image ist die Marke! Von den Farben, die du verwendest, bis hin zu den Schriftarten, die du auswählst – all das beeinflusst die Wahrnehmung der Menschen.

Ein Leitfaden zum Branding von Sonia Gregory: „Als kleines Unternehmen konkurrieren Sie möglicherweise mit engagierten Kunden gegen große Marken. Deshalb muss man Wege finden, sich zu differenzieren - mit einem soliden eigenen Markenbildungsprozess. “

Was sollen die Leute denken, wenn sie deine Website sehen?

Nervös, modern, satirisch, professionell, etwas anderes?

Du kannst diese Dinge durch das Design vermitteln. Schau dir einfach die Psychologie der Farben an - verschiedene Farben vermitteln unterschiedliche Emotionen.

Tatsächlich ergab eine Studie mit dem Titel „ Einfluss der Farbe auf das Marketing “, dass bis zu 90% der Schnellurteile über Produkte, je nach Produkt allein auf der Farbe basieren können .

Über die Farbe hinaus hast du auch die Wahl der Schriftart. Und ja, hinter der Wahl der Schriftart steckt auch eine Psychologie . Ted Hunt von Crazy Egg hat diese coole Infografik darüber gemacht:

Unabhängig von der Schriftart, das du für dein Logo und deine Markenbemühungen auswählen, solltest du für Ihre Hauptüberschrift immer die Lesbarkeit gegenüber dem emotionalen Gefühl wählen. Einfache und klassische Schriftarten, lassen sich im Web am besten lesen.

Ein letzter Tipp zur Auswahl der Schriftarten: Verwende Sie im Designprozess nicht mehr als zwei Schriftarten. Wähle zwei Schriftarten, die sich gegenseitig ergänzen,  und verwende diese bei deiner gesamtem Marke.

Key Takeaway:  Wähle nicht mehr als drei Farben und zwei Schriftarten, um deine Marke darzustellen. Notiere dir die Schriftarten und Farbcodes und verwende diese für die gesamte Website.

Suchen, Entwerfen und Verwenden von Bildern

Bilder sind ein wesentlicher Bestandteil des Website-Designs. Und doch machen so viele Leute es falsch.

Großartige Bilder bieten dem Besucher einen Mehrwert. Sie helfen, einen wichtigen Punkt zu erklären und geben den Augen eine Pause. Sie helfen sogar beim Verkauf deiner Produkte und Dienstleistungen.

Wenn du beispielsweise eine E-Commerce-Website erstellst, möchtest du, dass deine Produktfotos eine hohe Qualität und unzählige verschiedene Blickwinkel aufweisen.

Denk an das Designprinzip Nr. 1: Großartiges Design hat einen Zweck.

Jedes Bild, das keinen Zweck hat, ist ein schlechtes Bild. 

Wenn du mehr Anreize benötigst, ist die Geschwindigkeit beim Laden von Seiten für SEO und Benutzerfreundlichkeit äußerst wichtig. Je mehr Bilder du verwendest, desto langsamer lädt die Seite.

Wie findest du die besten Bilder und wie verwendest du sie gewissenhaft?

Um dich zu inspirieren, findest du hier einige Beispiele für gute Bilder, die du verwenden kannst:

  • Diagramme und Grafiken von Datenpunkten
  • Screenshots
  • Hochwertige Stock-Fotografie (mit Bedacht wählen)
  • Kundenspezifische Designs und Vektorgrafiken
  • Professionelle (oder zumindest gut gemachte) Fotografie

Key Takeaway:  Verwende Bilder mit einem bestimmten Ziel.

Genug von Visualisierung, lass uns den technischen Aspekt vornehmen.

2. Technisches Website-Design

Technisches Webdesign umfasst Dinge wie:

  • Responsive Design und Handyfreundlichkeit
  • Schnelle Ladegeschwindigkeiten
  • Suchmaschinenoptimierung (SEO)
  • SSL-Verschlüsselung
  • Site-Architektur & Navigation

Mach dir keine Sorgen wenn dir bei diesen Begriffen nur Fragezeichen im Kopf herumschwirren. Ich erkläre dir das alle Schritt für Schritt.

Responsive Design und Handyfreundlichkeit

Laut dem Beitrag des Smashing Magazine Responsive Web Design: Was es ist und wie man es verwendet :

"Responsive Webdesign ist der Ansatz, der vorschlägt, dass Design und Entwicklung auf das Verhalten und die Umgebung des Benutzers basierend auf Bildschirmgröße, Plattform und Ausrichtung reagieren sollten."

Mit anderen Worten, eine reaktionsfähige Seite ist eine Seite, die auf allen Bildschirmen und Geräten gut funktioniert. Die Seite muss mobilfreundlich sein und richtet sich an das Gerät, auf dem Sie es anzeigt wird.

Das klingt kompliziert, ist es aber nicht!

Es ist wichtig! Tatsächlich machen Smartphones mittlerweile über 51% des gesamten Online-Verkehrs aus, und Tablets machten etwas mehr als 12% aus. Diese Zahlen wachsen stetig.

Außerdem legt Google großen Wert auf Handyfreundlichkeit. Tatsächlich legt man jetzt Priorität auf das Ranking mobiler Websites (ein Update namens „ Mobilegeddon “).

Mobile-Friendly sorgt schließlich für eine bessere Benutzererfahrung. Und letztendlich dreht sich alles um den Benutzer. Dein Geschäft ist abhängig von den Brieftaschen deiner Zuschauer.

Was kann ein Nicht-Designer tun?

Überprüf zunächst , ob deine Website von Google mit dem Test für Handys als mobilfreundlich eingestuft wird . Du kannst auch einfach mit deinem eignem Smartphone mal die Webseite im Browser suchen und gucken wie es auf dem Gerät aussieht. Wenn es nicht kompatibel wirkt, solltest du noch einmal Handanlegen.

Ja, wir sind mobilfreundlich!

Bei der Einstellung eines Desigs ist es ratsam, sich Vorlagen anzusehen. Dies ist der einfachste und kostengünstigste Weg, um deine mobilfreundlich und reaktionsschnell zu gestalten.

 

Schnelle Ladegeschwindigkeit der Website

Laut Umfragen von Akamai und Gomez.com erwartet fast die Hälfte der Webbenutzer , dass eine Website innerhalb von 2 Sekunden oder weniger geladen wird, Die Zuschauer sollen sogar dazu neigen, die Seite zu verlassen, ist diese nicht unter 3 Sekunden geladen.

Ungefähr 79% der Online-Käufer, die Probleme mit der Leistung der Website haben, geben an, dass sie nicht mehr auf die Website zurückkehren, um erneut zu kaufen, und rund 44% von ihnen würden einem Freund mitteilen, wenn sie schlechte Erfahrungen beim Online-Einkauf gemacht hätten.

Mit anderen Worten, wenn die Geschwindigkeit deiner Website schlecht ist, hast du verloren.

Wie stellst du eine schnelle Ladegeschwindigkeit sicher? Versuche dies:

Wie der Handy-freundliche Test hat auch Google einen Seitengeschwindigkeitstest . Einige glauben jedoch, dass es nicht sehr genau ist, so dass es nicht schaden kann, auch Pingdom  und GT Metrix auszuprobieren .

Alle drei geben Ihnen eine Vorstellung davon, was Ihre Ladegeschwindigkeiten beeinträchtigt, und geben Verbesserungsvorschläge.

Wie Sie sehen, gibt es viele Möglichkeiten, die Ladegeschwindigkeit Ihrer Website zu verbessern , z. B. das Zwischenspeichern des Browsers und das erstmalige Laden von Inhalten über dem Falz (den Inhalt, den Sie sehen, ohne die Seite nach unten zu scrollen).

Die einfachste und effizienteste Möglichkeit ist hier die Optimierung und Komprimierung der Bilder . Wie ich im visuellen Bereich sagte, beanspruchen Bilder viel Datenmenge und verschlechtern die Performance.

Du kannst das Tool Gimp verwenden, um deine Bilder kostenlos zu komprimieren. ( Hier ist ein Tutorial , um genau das zu tun.)

Suchmaschinenoptimierung (SEO)

SEO bedeutet, deine Website so zu optimieren, dass sie in Suchmaschinen wie Google angezeigt wird. Es ist das Öl und der Sprit für eine gute Website.

Bei richtiger Anwendung kann es jeden Monat Tausende von Menschen auf deine Website bringen, allein passiv!

Bei schlechter Anwendung findet dich keine Menschenseele bei Google.

  1. Wissen Sie, wen Sie ansprechen, und führen Sie Keyword-Recherchen durch .
  2. Optimieren Sie Ihre Webseiten mit On-Page-SEO, das auf diese Keywords abzielt.
  3. Erstellen Sie eine starke Sitemap für Google und Bing, um Ihre Website zu indizieren.

Dies ist nur stark vereinfacht – es gibt noch weitere SEO-Faktoren , aber diese drei Taktiken lassen deine Seite in den Suchergebnissen erscheinen.

Dieser nächste Ratschlag zum Webdesign hilft sowohl bei der Suchmaschinenoptimierung als auch beim Aufbau von Vertrauen bei deinen Besuchern.

Sichere deine Seite mit einer SSL-Verschlüsselung

Du hast doch bestimmt schon einmal das kleine grüne Schloss in deiner Adressleiste neben einer Website gesehen.

Dies wird als SSL-Verschlüsselung bezeichnet.

Google gibt verschlüsselten Websites einen kleinen SEO-Schub . Noch wichtiger als das, ist der Vertrauensfaktor für deine Besucher! Vorallem wenn du etwas auf deiner Seite verkaufen willst. Die Leute wollen wissen, dass ihre Informationen sicher sind, bevor sie ihre Brieftasche öffnen.

Seiten-Architektur & Navigation

Denk an das Designprinzip Nr. 4: Du brauchst eine klare Seiten-Navigation.

Die Navigation ist aus zwei Hauptgründen wichtig:

  1. Bessere Suchmaschinenoptimierung (weil es Google einfacher macht, Ihre Website zu indizieren).
  2. Bessere Benutzerfreundlichkeit (weil es für Besucher einfacher ist, sich zurechtzufinden).

Denk an die Drei-Klick-Regel: Jeder Beitrag deiner Seite sollte innerhalb von drei Klicks von jeder anderen Seite Ihrer Website entfernt sein.

Durch das Erstellen einer physischen Karte kannst du Verknüpfungen organisieren, die dir dabei helfen verpasste Strukturen zu erkennen.

Du solltest auch deine wichtigsten Handlungsaufforderungen oben auf der Seite behalten. Hier bleiben die meisten Zuschauer stehen, daher ist dies ein großartiger Ort für eine Schaltfläche "Jetzt einkaufen", eine Registerkarte "Kontakt" oder eine Schaltfläche "Weitere Informationen".

 

3. Website-Tools (Nützliches, um Ihre Website besser zu machen“)

Website-Tools können keine kaputte Seite reparieren, daher wird dieser Punkt zuletzt erwähnt. Ein Tool kann aber eine mangelhafte Website verbessern!

Hier sind einige unserer Lieblingswerkzeuge:

Formilla Live Chat

Live-Chat ist ein wesentlicher Bestandteil einer Business-Website. Zumindest denken wir gerne, dass es so ist. Wir bieten es schließlich als Service an. 

Ein Live-Chat kann dir helfen, exzellenten Kundenservice zu bieten und auch misstrauenden Kunden zu Frage und Antwort zu bieten.

Conversio Cart Abandonment Recovery

Wenn wir zeigen würden, was eine gute E-Commerce- Website ausmacht, würde Conversio unsere Liste anführen. Es sendet automatisch E-Mails wie die oben beschrieben, um verlassene Einkaufswagen wiederherzustellen.

Bei durchschnittlich 69% der Leute, die ihren Einkaufswagen verlassen, wird dieses Tool voll ausgenutzt.

Das Tool bietet auch Dienste wie das Versenden von Newslettern, Produktempfehlungen und eine stärkere Website-Suchleiste.

MailChimp-E-Mail-Anmeldeformulare

Hast du jemals ein Online-Anmeldeformular wie das folgende gesehen und dich gefragt, wie du so eins auf deiner eigenen Website erstellen kannst?

Dazu verwenden wir MailChimp  und ein Premium- MailChimp-WordPress-Plugin .

Hier ist ein 60-Sekunden-Erklärvideo:

AddThis Social Sharing Buttons

Siehst du die Freigabeschaltflächen links auf dem Bildschirm? Sie stammen von einem Plugin namens AddThis .

AddThis hat auch einige andere Funktionen wie eine Schaltfläche zum Folgen und ein Widget für verwandte Beiträge.

Yoast SEO

Wir haben darüber gesprochen, wie wichtig SEO für eine moderne Website ist. Yoast SEO macht On-Page-SEO super einfach. Du erhälst eine Checkliste, die dir zeigt, was du hinzufügen/bearbeiten musst, um deine Seite für das von dir ausgewählte Keyword zu optimieren:

W3 Gesamt-Cache

Die Ladegeschwindigkeit ist entscheidend für SEO und Benutzerfreundlichkeit. Eine Möglichkeit, die Ladegeschwindigkeit der Website zu erhöhen, ist das Browser-Caching. W3 Total Cache macht das Caching sehr einfach.

 

Google Analytics

Was ist kostenlos, einfach zu installieren und äußerst vorteilhaft? Google Analytics .

Google Analytics kann dir eine Vielzahl an Eindrücken vermitteln, woher dein Datenverkehr kommt, wohin er geht und wo er stoppt. Und da es kostenlos ist, gibt es keine Entschuldigung, es nicht zu benutzen.

 

Fazit

Nun sind wir am Ende einer guten Website angelangt, du kannst dir selbst applaudieren wenn du es bis hier hin alles durchgezogen hast.

Was haben wir also gelernt?

Grundsätzlich ist deine Website Ihre Visitenkarte. Es ist das, was jeder - deine Kunden, Aktionäre, Freunde, Familie und Katze - sieht, wenn sie daran denken, mit dir Geschäfte zu machen.

Indem du dafür sorgst, dass deine Website scharf aussieht, stellst du sicher, dass jeder, der sie besucht, dich als vertrauenswürdig, professionell und geschäftswürdig ansieht.

Zudem zieht eine starke Website den Verkehr über Google an, erhält Links von maßgeblichen Websites und wird häufiger geteilt.

Im Jahr 2020 ist eine großartige Website nicht länger ein „nice to have“. Es ist ein absolutes Muss.

Hast du deine Seite nach dem Lesen dieser Kurzerklärung selbst und erfolgreich gestalten können? Dann teile deine Erfahrung mit uns in den Kommentaren! Nutz die Gelegenheit auch für offene Fragen..

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.