Wir alle wissen intuitiv, was eine Website schlecht aussehen lässt: überbeanspruchte Fasen-Effekte, kitschige Cliparts, überfüllte Layouts. Diese Unannehmlichkeiten lassen sich leicht beheben, wenn man sich an Designgrundlagen orientiert, die von professionellen Designern und Künstlern gleichermaßen verwendet werden.

Tolle Websites bringen Form und Funktion zusammen. In der Tat werden gut gestaltete Websites als glaubwürdiger angesehen, a Stanford-Studie und sind tatsächlich einfacher zu bedienen (wie von Forscher untersucht Don Norman ). Hier sind fünf Grundlagen, die Ihnen helfen, das Qualitätsdesign an der Spitze Ihrer Praxis zu halten.

1) Befolgen Sie die Regeln ... meistens

In der Designschule geben sie dir eine Liste von Prinzipien, nach denen du Schönheitselementen wie Layout, Ordnung und Symmetrie Regeln zuordnen kannst. Aber wenn Sie fortschreiten, werden Sie aufgefordert, die Regeln ein wenig zu durchbrechen, um Orte zu schaffen, an denen die Augen eines Betrachters aussehen, indem Sie Elemente wie Vielfalt, Spannung oder Kontrast verwenden.

Hier ist ein Beispiel einer Seite Ich habe in Edge Reflow CC getan. Kannst du die verschiedenen Gestaltungselemente erkennen und mit ihnen spielen?

2) Verwenden Sie Bilder und Symbole, um nach Möglichkeit zu kommunizieren

Es gibt einige universelle Symbole, auf die Leute trainiert sind, um darauf zu reagieren. Die Lupe (Suche), das Haus (Homepage) und die Diskette (speichern) sind bereits in Ihren Benutzern verankert. Nutzen Sie diese Vorteile visuelle Verknüpfungen ; Alle diese Verkehrszeichen sollten für Sie sofort erkennbar sein.

3) Farbe als Gestaltungselement, nicht als Dekoration

Farbe macht den Unterschied, zumal unsere Bildschirme auf unseren Telefonen und Tablets besser werden. Es ist eine Facette des Designs, die ein wirklich wichtiger Teil der Geschichte Ihrer Website sein kann. Verwenden Sie einfach Farbe, um Inhalt zu unterstützen, nicht um eine Seite zu dekorieren. Und oft, wenn Sie ein Foto verwenden, sollten die Farben im Design aus den Fotos gesampelt werden, so dass Ihr Design ein schönes einheitliches Gefühl hat.

Ich mag es, Farbbeispiele mit Farbfeldern zu ziehen - und das Adobe Kuler Web-App ist eine gute Möglichkeit, mit verschiedenen Themen zu spielen und sie dann in Ihre Design-Tools zu importieren. Eine der besten Regeln, um mit zu gehen, ist, höfliche Farben zu verwenden. Das verwendet im Grunde warme Farben und kühle Farben zusammen, um Balance zu bieten.

4) Wählen Sie Schriftarten, die Inhalt unterstützen

Es gibt buchstäblich Tausende von Schriftarten zur Auswahl.

Es liegt an Ihnen zu mischen und anzupassen - aber denken Sie daran, dass es am besten ist, nur bis zu drei Zeichensätze gleichzeitig zu verwenden - eine schöne Überschriftenschrift, eine für den Haupttext, dann eine für jede Art von Aufruf brauchen. Das bedeutet oft, dass Sie eine serifenlose Kopie für den Text verwenden müssen, und für Überschriften können Sie mit serif oder serifenlos interessanter werden.

5) Hilfe von anderen

Alles klar, Sie haben Ihre grundlegenden Design-Elemente, mit hübschen Icons und Bildern, mit einem Sound-Farbschema und lustigen Schriftarten. Was kommt als nächstes?

Hilfe von anderen bekommen, natürlich! Und nicht nur zufällige Leute auf der Straße, sondern konstruktive Kritik von Leuten, die ihre Sachen wirklich kennen, wie andere Designer / Entwickler. Dies kann entscheidend sein, um von einer OK-Website zu einer, die wirklich knallt. Wenn Sie Behance noch nie benutzt haben, um einen Work-in-Progress zu veröffentlichen, empfehle ich es zu versuchen. Die aktive Community wird mehr tun, als nur zu sagen, "um das Logo größer zu machen" - aber geben Sie Ratschläge, die den Unterschied zwischen einer guten und einer guten Website ausmachen können.

Um mehr darüber zu erfahren, wie Sie Designelemente auf die Webentwicklung anwenden können, schauen Sie sich meine Präsentation von SXSW an: