8 praktische Tipps um das UI-Design deiner Webseite zu verbessern
Einfache Tipps & Möglichkeiten wie du dem UI-Design deiner Webseite das gewisse Etwas verleihst und dich so von anderen Webseiten abheben kannst.
Die Entwicklung ästhetischer, benutzerfreundlicher und effizienter UI-Designs braucht Zeit und viele Korrekturschleifen. Man muss ständig daran feilen, um etwas zu schaffen, mit dem die Kunden, Benutzer und man selbst als Designer wirklich zufrieden sind. Ich weiß das. Ich habe das selbst schon viele Male durchgemacht.
Im Laufe der Jahre & meiner Karriere als Webdesigner herausgefunden, dass man mit ein paar einfachen visuellen Tricks die visuellen Ergebnisse schnell verbessern kann.
In diesem Artikel habe ich eine kleine, leicht umzusetzende Auswahl an Tipps zusammengestellt, mit denen du ohne viel Aufwand deine UI-Designs deutlich verbessern kannst. Hoffentlich helfen dir diese Ratschläge auch bei deinen zukünftigen Projekten weiter.
Extra Platz & Weissraum
Ein zuverlässiger Weg das User-Interface deiner Webseite zu verbessern ist genug Abstand zwischen den Elementen und Sektionen. Weniger Informationen auf einer Seite sind manchmal mehr. Denn wenn zu viele Bilder und Inhalte auf kleinen Raum platziert werden, ist oft nicht klar worauf man sich wirklich konzentrieren soll. Durch den bewussten Einsatz von Weissraum wird die Aufmerksamkeit des Users automatisch auf bestimmte Elemente gelenkt. Ausreichend Platz ist ein wirksames Mittel um Inhalte jeder Art zu betonen und dem Design mehr Klarheit zu verschaffen.
Verbessere Kontrast zwischen Bild und Text
Auf vielen Webseiten wird weißer Text einfach auf Bilder gelegt, ohne dabei auf die Lesbarkeit zu achten. Wenn helle Bildstellen auf weißen Text treffen, ist dieser nicht mehr lesbar und die Bedeutung geht verloren. Die Lösung ist ein dunkler, transparenter Verlauf, der zwischen Bild- und Textebene gelegt wird. Der Verlauf erhöht den Kontrast und verbessert so die Lesbarkeit.
Verwende hochwertige Bilder/Stockfotos
Jeder kennt das Stockbild eines Service-Mitarbeiters, der mit Headset und mit übertriebenen Grinsen in die Kamera lächelt. Schlecht inszenierte Stockfotos werden auf vielen Webseiten verwendet. Klar, sie sind kostenlos und schnell runtergeladen. Das falsche Motiv zeigt aber nicht nur schlechten Geschmack und nicht vorhandene Kreativität. User verbinden das visuelle der Webseite oft mit der Vertrauenswürdigkeit des Unternehmens. Hochwertige Stockfotos oder professionelle Bilder aus einem Fotoshooting können daher einen riesigen Unterschied auf die Wirkung des Designs haben.
Vermeide zu lange Textabschnitte
Ein Weg die Aufmerksamkeit deiner Besucher zu verlieren ist, die Inhalte deiner Webseite als viel zu lange Textabschnitte abzubilden. Heutzutage ist die wichtigste Währung im Internet: Aufmerksamkeit. Unternehmen versuchen User auf ihre Webseite zu ziehen und sie dort möglichst lange zu halten. Niemand hat Lust sich lange Textabschnitte durchzulesen und zu versuchen die wichtigsten Informationen herauszufiltern. Texte sollten deshalb immer kurz und einfach konsumierbar dargestellt werden. Wichtige Fakten sollten durch Text
Nutze eine visuelle Hierarchie
Die Informationen auf deiner Webseite sollten gut organisiert und für User leicht zu erfassen sein. Eine Möglichkeit, das zu erreichen, ist die Verwendung einer konsequenten Schrifthierarchie. Das bedeutet, die Grössen der Überschriften sind logisch gegliedert. Dabei sollten die wichtigsten Informationen am meisten hervorgehoben werden. Zum Beispiel durch die Grösse.
Eine visuelle Hierarchie kann aber auch durch andere visuelle Techniken erreicht werden. Wichtig dabei ist, die Inhalte so zu designen, dass der User Informationen möglichst einfach aufnehmen kann. So erhalten Besucher eine benutzerfreundliche Erfahrung und sie finden gesuchte Informationen schneller.
Abgestimmte Farbpalette
Bei der Wahl der Farbpalette gibt es nahezu unendlich Möglichkeiten. Gerade Anfänger greifen gerne zu leuchtenden & kräftigen Farben. Grundsätzlich ist das nicht falsch, doch zu viele grelle Farben lenken eher vom restlichen Webdesign ab. Die richtige Farbwahl im Webdesign kann starke Auswirkungen auf die Webseite haben.
Für eine abgestimmte Farbpalette ist in der Regel weniger gleich mehr. Die meisten Designs kommen mit einer Primärfarbe und 1-2 Sekundärfarben aus. Die restlichen Farben sollten dann eher aus neutralen Farbtönen wie Weiß, Schwarz oder gedeckten Farben bestehen.
Highlights durch ansprechende Layouts
Im Internet sieht man sehr viele Webseiten, die langweilige Standardlayouts von vorgefertigten Templates verwenden. Eine Webseite von einem Template aufzubauen, ist natürlich völlig in Ordnung. Oft geht dabei allerdings viel Kreativität in dem Prozess verloren. Zusätzlich sieht das Design dann so standardmässig wie unzählige andere Webseiten im Internet aus.
Um sich wieder etwas Inspiration zu holen, hilft es sich, andere kreative Webdesign Beispiele anzusehen. Auf Seiten wie Awwwards, Siteinspire oder Behance gibt es tolle Beispiele, von denen du dir einiges abschauen kannst, um dein Layout ansprechender zu gestalten.
Vertraute Webstandards
Ein Weg, das UI deiner Webseite zu verbessern, ist auf vertraute Webstandards zu setzen. Ein gut gestaltetes Webdesign fühlt sich vertraut an. Das Navigieren fällt einem leicht und es funktioniert alles, wie man es erwarten würde. Wenn Webseite so funktionieren, wie es User von anderen bekannten Seiten gewohnt sind, wirft das automatisch ein gutes Licht auf das visuelle Design.
Das wohl bekannteste Beispiel für ein Webstandard ist die Navigationsleiste am oberen Bereich. Würde man die Navigation am unteren Ende des Browsers platzieren, wären die User im ersten Moment verwirrt. Die Besucher bekommen das Gefühl, als würde sich etwas komisch anfühlen und das Problem eventuell im Design sehen.
