Wenn Sie Websites entwickeln, wissen Sie, wie wichtig es ist, sie nützlich und interessant zu gestalten. Selbst mit den besten Online-Website-Design Tools, die Ihnen zur Verfügung stehen, kann dies eine entmutigende Aufgabe für jeden sein, der gerade mit dem Entwerfen von Websites begonnen hat. Um die Dinge zu vereinfachen, habe ich eine kurze Liste mit Geboten und Verboten zusammengestellt, die Sie bei der Erstellung Ihres nächsten Webdesign-Projekts beachten sollten.
Es gibt die Must-dos zuerst.
1. Halten Sie die Benutzeroberfläche konsistent.
Einer der wichtigsten Bestandteile einer großartigen UX ist die Einheitlichkeit der Benutzeroberfläche im gesamten Produkt. Das allgemeine Erscheinungsbild Ihrer Website sollte auf allen Seiten ähnlich sein. Die Aufrechterhaltung der Einheitlichkeit in Navigation, Farbschemata, Schriftarten und Schreibstil kann dazu beitragen, die Benutzerfreundlichkeit und UX zu verbessern.
Praktische Ratschläge: Machen Sie das Design in erster Linie nützlich. Konsistenz hat zwei Seiten. Wenn Sie Ihre Website nicht von Anfang an korrekt erstellen, führt die Beibehaltung anderer Teile davon zu einem durchweg schlechten Design. Priorisieren Sie daher, das Design hilfreich zu gestalten, bevor Sie sich auf Konsistenz konzentrieren.
2. Erstellen Sie ein benutzerfreundliches Navigationssystem.
Navigation ist die Grundlage der Benutzerfreundlichkeit. Es ist die am weitesten verbreitete Art der Kommunikation im Internet. Eine gute Website-Navigation ist entscheidend, damit Besucher schnell finden, wonach sie suchen.
Behalten Sie die wichtigsten Navigationsoptionen in der Top-Level-Navigation. Beschränken Sie die Navigationslinks der obersten Ebene auf sieben Alternativen (die durchschnittliche Person kann sieben Elemente im Arbeitsgedächtnis behalten) und stellen Sie eine Unternavigation mit klarer Kategorisierung bereit.
Verwenden Sie eindeutige Beschriftungen für Navigationsoptionen. Verwenden Sie Begriffe, mit denen Besucher vertraut sind, um ihnen das Verständnis der Menüoptionen zu erleichtern.
Reduzieren Sie die Zeit, die Benutzer damit verbringen, an ihr Ziel zu gelangen. Erstellen Sie ein Navigationssystem, das es Benutzern ermöglicht, mit der geringstmöglichen Anzahl von Klicks dorthin zu gelangen, wo sie hin möchten. Beachten Sie bei der Gestaltung einer Website die Drei-Klick-Regel: Ihre Besucher sollten nie mehr als drei Klicks davon entfernt sein, das zu finden, wonach sie suchen.
Fügen Sie Navigationsoptionen unten auf Ihrer Website hinzu. In der Fußzeile erwartet der Besucher Navigationsmöglichkeiten und Kontaktinformationen.
3. Ändern Sie die Farbe von zuvor besuchten Links.
Die Bedeutung von Links im Navigationsprozess kann nicht hoch genug eingeschätzt werden. Wenn angeklickte Links ihre Farbe nicht ändern, kehren Benutzer möglicherweise unbeabsichtigt zu denselben Websites zurück. Zu wissen, wo Sie waren und wo Sie jetzt stehen, macht die Entscheidung, wohin Sie als nächstes gehen möchten, viel einfacher.
Machen Sie einen sichtbaren Kontrast zwischen besuchten und nicht angesehenen Links.
4. Stellen Sie sicher, dass Ihre Inhalte gescannt werden können.
Wenn Benutzer Ihre Website besuchen, überfliegen sie eher, als dass sie die ganze Seite lesen. Wenn Besucher bestimmte Informationen erhalten oder eine bestimmte Aufgabe erfüllen möchten, durchsuchen sie die Seiten einer Website, bis sie sie finden. Als Designer können Sie ihnen helfen, indem Sie eine klare visuelle Hierarchie einrichten. Visuelle Hierarchie ist die Organisation oder Präsentation von Elementen in einer Weise, die Wichtigkeit signalisiert, wie z.
Reduzieren Sie die Textmenge, die Sie verwenden. Unterteilen Sie Ihr Material in Kategorien, um es visuell leichter verständlich zu machen. Textwände können durch Überschriften oder Aufzählungszeichen unterbrochen werden.
Wichtige Objekte sollten optisch stärker hervorgehoben werden. Stellen Sie kritische Elemente wie Call-to-Action-Buttons und Anmeldeformulare in den Mittelpunkt Ihrer Website, damit Besucher sie sofort sehen. Um bestimmte Komponenten hervorzuheben, können unterschiedliche Größen und Farben verwendet werden.
Berücksichtigen Sie natürliche Scanmuster. In der westlichen Welt wird von links nach rechts und von oben nach unten gelesen. Wenn Sie ein Design konstruieren, das von diesem Muster abweicht, müssen die Besucher ein neues Muster lernen. Der Inhalt gut gestalteter Websites ist oft in einem „F“- oder „Z“-Leseformat organisiert.
Pflegen Sie das Grid-System. Sie können Informationen in einem Rastermuster organisieren, damit Besucher die Inhalte auf der Seite müheloser lesen und aufnehmen können.
5. Behandeln Sie das Material sorgfältig.
Der Text auf Ihrer Website ist genauso wichtig wie das Design. Englisch wird verwendet, um mehr als 95 % des Materials im Internet zu veröffentlichen. Eine gute Website hat sowohl ein wunderbares Design als auch exzellenten Inhalt; Auch wenn Ihre Website ästhetisch gestaltet ist, ist sie nichts weiter als ein leerer Rahmen ohne hochwertigen Inhalt. Die Aufgabe eines Designers besteht darin, sicherzustellen, dass das Design den Inhalt ergänzt und verbessert.
Stellen Sie sicher, dass der Inhalt auf der Website relevant ist. Irrelevante Inhalte bieten Ihren Lesern keinen Vorteil und können leicht zu Verwirrung führen. Versuchen Sie in jeder Zeile, Inhalte zu produzieren, die für Ihre Zuschauer wertvoll sind.
Jargon sollte um jeden Preis vermieden werden. Der Inhalt Ihrer Website sollte für ein einfaches Verständnis so einfach und klar wie möglich formuliert werden. Das Schreiben für ein breites Spektrum von Lesern ist eine sichere Sache, also wählen Sie Sprachen, die einfach und leicht verständlich sind.
6. Stellen Sie sicher, dass Ihre Website fehlerfrei ist.
Ein kleiner Fehler kann ein ansonsten hervorragendes Werk schnell ruinieren. Im Folgenden sind einige der häufigsten Bedenken aufgeführt, auf die Sie achten sollten:
- Halten Sie die Augen nach unterbrochenen Verbindungen offen. Wenn ein Verbraucher auf einen Link auf einer Website klickt und eine 404-Fehlerseite erhält, kann dies frustrierend sein.
- Stellen Sie sicher, dass Ihre Website fehlerfrei ist.
- Stellen Sie sicher, dass alle Medien korrekt eingelegt sind und keine beschädigten Bilder oder Videos vorhanden sind.
7. Beschränken Sie die Auswahlmöglichkeiten auf ein absolutes Minimum.
Die Anzahl der den Menschen zur Verfügung stehenden Alternativen beeinflusst ihre Entscheidungen; Je mehr Optionen verfügbar sind, desto weniger Maßnahmen ergreifen sie. Wenn Sie Ihren Kunden zu viele Optionen anbieten, müssen sie zu viel nachdenken. Um die Beteiligungschancen zu erhöhen, ist es wichtig, die Zahl der Alternativen auf ein Minimum zu beschränken.
8. Ermutigen Sie die Leute, bis zum Ende der Seite zu lesen.
Das Scrollen leitet Besucher weiter auf die Website und ermutigt sie, dort mehr Zeit zu verbringen, was die Wahrscheinlichkeit erhöht, dass sie konvertieren, z. B. etwas kaufen, einen Newsletter abonnieren oder Sie kontaktieren. Auch wenn die meisten Besucher mit dem Scrollen beginnen, sobald die Seite geladen ist, ist der Inhalt oben auf der Seite immer noch wichtig. Was oben erscheint, beeinflusst die Ansichten und Qualitätserwartungen der Besucher. Die Leute werden scrollen, wenn es faszinierende Dinge über der Falte gibt.
Der obere Rand des Seiteninhalts gibt den Ton für den Rest der Seite an. Wenn eine Seite ihnen hochwertiges Material präsentiert, neigen die Benutzer dazu, nach mehr zu suchen.
9. Beschriften Sie jede Schaltfläche mit einer Beschreibung ihrer Funktion.
Jedes umsetzbare Oberflächenelement sollte immer eine Bezeichnung haben, die sich darauf bezieht, was es für den Benutzer ausführen wird. Benutzer werden sich wohler fühlen, wenn sie wissen, welche Aktion eine Schaltfläche ausführt. Vage Bezeichnungen wie „Senden“ oder abstrakte Bezeichnungen wie die untenstehende liefern nicht genügend Informationen über die Aktivität.
10. Lassen Sie es so aussehen, als wäre alles in Ordnung.
Überlegen Sie, wie das Design mithilfe von Schaltflächen und anderen interaktiven Funktionen das Angebot vermittelt. Denken Sie an das alte Sprichwort „Die Form folgt der Funktion“: Das Aussehen eines Objekts bestimmt, wie es verwendet wird. Benutzer können leicht durch visuelle Komponenten verwirrt werden, die Links oder Schaltflächen zu sein scheinen, aber nicht anklickbar sind, z. B. hervorgehobene Sätze, die keine Links sind, oder Elemente mit einem rechteckigen Hintergrund, die keine Schaltflächen sind.
11. Gestalten Sie Ihre Website mobilfreundlich.
Webbrowser sind mittlerweile auf über 5 Milliarden Geräten installiert. Besucher können mit einer Vielzahl von Geräten auf Ihre Website zugreifen, darunter ein PC, Tablet, Telefon, Musikplayer oder sogar eine Uhr. Ein großer Aspekt des UX-Designs besteht darin, sicherzustellen, dass alle wichtigen Informationen effektiv auf mehreren Bildschirmgrößen angezeigt werden, unabhängig davon, wie der Besucher Ihre Website betrachtet.
Designer müssen ihre Arbeit an unterschiedliche Bildschirmgrößen anpassen. Die Website sollte Informationen unabhängig von der Größe des Bildschirms auf einfache Weise anzeigen – von einem Telefon bis zu einer Uhr oder von einem Tablet bis zu einem Desktop.
Machen Sie es sich einfach, wichtige Informationen zu finden. Im Gegensatz zu Desktop-Benutzern suchen mobile Benutzer nach bestimmten Informationen wie Kontaktinformationen oder dem Preis eines Produkts, das sie kaufen möchten. Machen Sie es schwierig, diese Informationen zu übersehen.
Passen Sie die Größe der interaktiven Elemente an den Bildschirm an. Da mobile Benutzer mit ihren Fingern scrollen und berühren, müssen interaktive Funktionen wie Schaltflächen möglicherweise größer sein.
12. Stellen Sie Ihr Design auf die Probe
Sie mögen glauben, dass Ihr Design wunderbar ist, aber Sie werden nie wissen, wie erfolgreich es ist, bis Sie Feedback von echten Menschen erhalten. Sie müssen beobachten, wie Benutzer darauf reagieren. Selbst wenn Sie nur ein oder zwei echte, unparteiische Personen dazu bringen können, sich mit Ihrer Website zu beschäftigen und ihre Ideen mit Ihnen zu teilen, erhalten Sie viele wertvolle Informationen, die Sie sonst nicht hätten.
Behalten Sie Analytics als praktischen Vorschlag im Auge. Webanalysen sind effektive Tools, um Bereiche Ihrer Website zu identifizieren, die mehr Aufmerksamkeit erfordern.
Nun zu den Verboten.
1. Stellen Sie sicher, dass Benutzer nicht auf das Laden von Inhalten warten müssen.
Die Zeit, die zum Laden einer Seite benötigt wird, ist entscheidend für die Erfahrung des Benutzers. Mit fortschreitender Technologie werden wir immer ungeduldiger, und jetzt möchten 47 % der Verbraucher, dass eine Webseite in zwei Sekunden oder weniger geladen wird. Besucher können unzufrieden sein und eine Website verlassen, wenn das Laden zu lange dauert. Aus diesem Grund sollte bei der Entwicklung einer Webanwendung die Leistung im Vordergrund stehen.
Leere Seiten sollten während des gesamten Ladevorgangs vermieden werden. Erwägen Sie, einen Teil des Materials zusammen mit einer Art visueller Anzeige zu zeigen, z. B. einer Ladeanzeige, wenn das Laden lange dauert.
Verbessern Sie die Qualität Ihrer Fotos. Insbesondere große Hintergrundgrafiken können längere Zeit zum Laden benötigen. Durch die Optimierung Ihrer Fotos können Sie die Ladezeit drastisch minimieren.
Berechnen Sie die aktuelle Performance Ihrer Website. Die Tools Google PageSpeed Insights und Think With Google helfen Ihnen nicht nur dabei, Leistungsprobleme auf Ihrer Website zu erkennen, sondern schlagen auch Lösungen vor.
2. Erstellen Sie keine neuen Registerkarten für interne Links.
Interne und externe Links sollten sich je nach Benutzer unterschiedlich verhalten. Interne Links sollten alle auf derselben Registerkarte geöffnet werden, damit Benutzer die Schaltfläche „Zurück“ verwenden können. Wenn Sie in einem neuen Fenster auf externe Links zugreifen möchten, sollten Sie vor dem automatischen Öffnen eines neuen Fensters oder Tabs einen Hinweis bereitstellen. Dies kann erreicht werden, indem dem Linktext der Text „wird in einem neuen Fenster geöffnet“ hinzugefügt wird.
3. Beschränken Sie die Anzahl der Schriftarten auf ein Minimum.
Bei der Entwicklung einer Website ist es verlockend, viele verschiedene Schriftarten zu verwenden – fünf oder sechs verschiedene Schriftarten, vielleicht sogar Ihre eigene. Allerdings ist es am besten, solche Versuchungen zu vermeiden. Zu viele Schriftarten zu haben, kann ablenkend, verwirrend und sogar lästig sein.
Ein allgemeiner Ratschlag lautet, nicht mehr als drei verschiedene Schriftarten in nicht mehr als drei verschiedenen Größen zu verwenden. Denken Sie beim Erstellen einer Website darüber nach, wie Sie die Typografie effektiver gestalten können, indem Sie mit Gewichten statt mit verschiedenen Schriftarten spielen.
4. Beschränken Sie die Farbmenge auf Ihrer Website auf ein Minimum.
Es ist vorzuziehen, in Ihrem Design nicht zu viele Farben zu verwenden, genauso wie Sie es vermeiden sollten, zu viele Schriftarten zu verwenden. Farbe spielt eine wichtige Rolle bei der Ausgewogenheit des Designs, und je mehr Farben Sie verwenden, desto schwieriger ist es, Harmonie zu erreichen. Wenn Sie zu viele Farben in einem Design verwenden, ist es, als ob Sie versuchen, eine Million Gefühle und Botschaften auf einmal zu vermitteln, was für den Betrachter verwirrend sein kann.
Es ist ratsam, Ihr Farbschema auf wenige Farben zu beschränken und es auf Ihrer Website einheitlich zu halten, es sei denn, Sie möchten Farbe verwenden, um einen bestimmten Teil Ihrer Website hervorzuheben.
Denken Sie über die Emotionen nach, die Ihre Besucher haben sollen. Zu wissen, welche Gefühle Sie vermitteln möchten, kann Ihnen bei der Auswahl des richtigen Farbschemas helfen. Wenn Sie beispielsweise Meditationsprodukte auf Ihrer Website verkaufen, ist eine grelle, grelle Farbpalette nicht angemessen.
5. Zeigen Sie automatische Popups nicht zu früh.
Viele Websites zeigen Pop-up-Fenster mit Abonnementanfragen, sobald Sie auf einer Seite landen. Eines der irritierendsten Dinge, die Sie als Designer tun können, ist, den Benutzern Ihrer Website Popup-Fenster anzuzeigen. Pop-ups sind von Natur aus aufdringlich, und da sie oft zum Anzeigen von Werbung verwendet werden, neigen die Leute dazu, sie abzulehnen, bevor sie den Inhalt lesen.
Es ist eine gute Idee, Ihre Pop-ups zu timen. Bevor Sie Besucher bitten, etwas zu tun, müssen Sie zuerst zeigen, wie Sie ihrem Leben einen Mehrwert verleihen können. Verhindern Sie, dass das Feld angezeigt wird, bis die Besucher den gesamten Inhalt der Seite gelesen oder längere Zeit auf der Website verbracht haben.
6. Vermeiden Sie nach Möglichkeit die Verwendung von Stock-Fotos von Personen.
Bilder mit Menschengesichtern sind eine hervorragende Möglichkeit, Ihr Publikum zu begeistern. Unser Gehirn ist fest verdrahtet, um das Aussehen anderer Menschen wahrzunehmen. Wenn wir die Gesichter anderer Menschen sehen, anstatt nur ein Produkt zu benutzen, fühlen wir uns ihnen verbundener.
Andererseits sind viele Unternehmens-Websites berüchtigt dafür, dass sie sich stark auf gefälschte Grafiken verlassen, um „Vertrauen aufzubauen“. Die Usability-Forschung hat gezeigt, dass rein ästhetische Fotos das Design selten aufwerten und häufig von der Benutzererfahrung ablenken.
7. Lassen Sie nicht zu, dass Ihr Job Ihrem Aufstieg im Wege steht.
Zu viele Werbeaktionen oder Anzeigen auf einer Website können den wichtigen Inhalt schnell überfordern und es den Kunden erschweren, Aktivitäten durchzuführen. Wenn Sie zu viel Werbung auf einer Seite haben, wird alles um die Aufmerksamkeit Ihrer Leser kämpfen. Infolgedessen werden Sie einer Reizüberflutung ausgesetzt, die Ihre Absprungraten erhöht. Erwähnenswert ist auch, dass Menschen oft alles ignorieren, was Werbung zu sein scheint, eine Tendenz, die als Bannerblindheit bekannt ist.
8. Musik sollte nicht als Hintergrund oder in Autoplay-Videos verwendet werden.
Während Hintergrundmusik unter bestimmten Umständen angemessen sein kann, z. B. für eine Werbewebsite, ist sie für die meisten Websites nicht geeignet. Besucher können durch unerwartete Musik oder Geräusche irritiert werden, was zu Problemen führen kann. Sie besuchen Ihre Website möglicherweise bei der Arbeit, an einem öffentlichen Ort oder in der Nähe einer schlafenden Person, und unerwartete Musik könnte sie stören.
Menschen werden durch Autoplay-Videos, die in einen Inhaltsblock eingefügt werden, genauso irritiert wie Hintergrundmusik durch Hintergrundmusik irritiert wird. Sie sollten sparsam und nur dann verwendet werden, wenn es unbedingt erforderlich ist.
Geben Sie den Menschen die Kontrolle über ihre eigene Erfahrung. Stellen Sie die Musik standardmäßig auf stumm, aber geben Sie den Kunden die Möglichkeit, sie einzuschalten, indem sie die Play/Pause-Tasten des Audiomaterials drücken.
Videos auf Facebook sind auf Autoplay eingestellt, aber es ist kein Ton zu hören, es sei denn, die Zuschauer beschäftigen sich mit dem Video und signalisieren, dass sie es ansehen.
9. Es ist keine gute Idee, zuzulassen, dass Scrolling entführt wird.
Wenn die Bildlaufleiste einer Website so geändert wird, dass sie sich auf eine bestimmte Weise verhält, wird dies als Scroll-Hijacking bezeichnet. Viele Benutzer verachten gekapertes Scrollen, da es ihnen die Kontrolle entzieht und das Scrollverhalten völlig unvorhersehbar macht. Bei der Entwicklung einer Website ist es wichtig, Scroll-Hijacking zu vermeiden und dem Benutzer die Kontrolle über sein Surfen und seine Bewegung zu geben.
10. Verwenden Sie vertikales Scrollen statt horizontales Scrollen.
Um ihre Websites hervorzuheben, verwenden einige Webdesigner horizontales Scrollen. Leider ist horizontales Scrollen eine der wenigen Interaktionen, die durchweg negatives Feedback von Kunden hervorruft. Menschen sind sich oft nicht bewusst, dass sie möglicherweise Informationen erhalten, indem sie horizontal scrollen – die meisten Benutzer sind es gewohnt, auf Websites nach unten zu scrollen, und schauen selten nach links oder rechts. Infolgedessen ignorieren sie einfach alles, was durch horizontales Scrollen erreicht werden kann.
11. Lassen Sie nicht zu, dass das Aussehen der Funktionalität im Wege steht.
Die Fähigkeit eines Benutzers, Inhalte zu konsumieren oder mit einer Website zu interagieren, sollte niemals durch ein Design eingeschränkt werden, egal wie schön es ist. Die Verwendung von hellgrauem Text auf hellem Hintergrund ist ein klassisches Beispiel für Designentscheidungen, die aus ästhetischen Gründen getroffen werden und normalerweise zu einer schlechten UX führen. Diese Kombination wirkt sich auf die Lesbarkeit der Informationen aus. Wie im Bild unten zu sehen ist, wird empfohlen, überladene Hintergründe hinter Text oder schlechten Farbkontrast zu vermeiden.
Sehen Sie sich für realistische Ratschläge das Kontrastverhältnis an. Das Kontrastverhältnis misst, wie unterschiedlich eine Farbe von einer anderen ist. Mit dem Color Contrast Checker können Sie beispielsweise mit nur wenigen Klicks schnell feststellen, ob Sie einen ausreichenden Farbkontrast haben.
12. Verzichten Sie auf Werbung und blinkenden Text.
Verzichten Sie in Ihren Werbespots und Animationen auf flimmernde Blinkeffekte. Bei manchen Personen kann blinkendes oder flackerndes Material Anfälle auslösen, und es ist wahrscheinlich unangenehm oder ablenkend für normale Benutzer.
Fazit
Wenn Menschen mit Websites interagieren, erwarten sie eine positive Benutzererfahrung. Wenn Sie ihre Bedürfnisse nicht erfüllen, wenden sie sich an Ihre Konkurrenten, die möglicherweise nur einen Klick entfernt sind. Behalten Sie daher den Besucher im Auge, während Sie Designentscheidungen treffen, und bemühen Sie sich, das Erlebnis so angenehm wie möglich zu gestalten.
