Website erfolgreich aufbauen – Teil 4: Anspruchsvolles Design

In der Serie Website erfolgreich aufbauen beschreibe ich den Aufbau einer eigenen Website und berücksichtige dabei alle wichtigen Schritte. Im 4. Teil der Serie erkläre ich, was anspruchsvolles Design bei einer Website ausmacht und gebe dazu auch einige Beispiele.

Im Artikel Welche Seiten sollte ein Blog oder eine Website haben? habe ich bereits beschrieben, welche Seiten in einem Blog oder einer Website nicht fehlen dürfen. In diesem Teil möchte ich beschreiben, welche Elemente ein gutes Website Design ausmachen und auf was man achten muss.

Inhalt der Serie Blog erfolgreich aufbauen

1. Teil 1: Vorbereitende Maßnahmen
2. Teil 2: Zielgruppe definieren
3. Teil 3: Auswahl der Plattform
4. Teil 4: Anspruchsvolles Design
5. Teil 5: Inhalt strukturieren
6. Teil 6: Ziele setzen
7. Teil 7: Artikel schreiben
8. Teil 8: Artikel und Website Promotion
9. Teil 9: Traffic Tipps
10. Teil 10: Suchmaschinenoptimierung
11. Teil 11: Mehrwert für die Besucher im Auge behalten
12. Teil 12: Statistiken auswerten
13. Teil 13: Social Media
14. Teil 14: Nachhaltigkeit anstreben
15. Teil 15: Website Wachstum ist das A und O

Teil 4: Anspruchsvolles Design

1. Den Inhalt im Fokus
   
   Eine Website oder ein Blog ist nichts ohne Inhalt. Ein gutes Design regt den Besucher an, sich auf die Inhalte zu konzentrieren. Die Leser zu sehr mit vielen Bildern oder anderen Elementen zu stören, kann sich negativ auswirken. Aus diesem Grund sind die meisten Blog Designs sehr einfach gehalten. Die Einfachheit ist wichtig, wenn man den Inhalt zur Geltung bringen möchte.
2. Leichte Navigation
   
   Die meisten Besucher kommen über Suchmaschinen, Links von anderen Seiten, RSS Feeds oder Social Media Seiten auf die Website. Nur ein kleiner Prozentsatz der Besucher besucht die Website durch Direkteingabe der URL. Das macht die Navigation zu einem sehr wichtigen Instrument. Die Sidebar (in Websites meistens links und in Blogs oft auch rechts) enthält typischerweise die meisten Möglichkeiten zur Navigation. Dazu zählen Links zu den Kategorien, letzte oder populäre Artikel und oft auch eine Tag Cloud (Stichwort Wolke). Im Footer (Abschnitt unten in der Website) sind oft auch Links zur Navigation enthalten. Ganz klassisch und sehr wichtig für die Navigation ist die Menüleiste, hier im Weblog-ABC wie auch in den meisten anderen Websites oben zu finden.
3. Schnelle Ladezeiten
   
   Bei den meisten Besuchern ist die Spanne der Aufmerksamkeit sehr gering. Laden die Seiten zu lange, verlassen diese Besucher die Website schnell wieder anstatt zu warten. Um das Verlassen der Website zu verhindern, muss die Website schnell angezeigt werden. In vielen Blogs sind unzählige Widgets installiert, welche das Laden der Seite extrem verlangsamen. Eine Website sollte einfach gehalten sein. Alle zusätzlichen Tools sollten gut überlegt werden. Kosten (Ladezeit…) und Nutzen sollten in einem gesunden Verhältnis zueinander stehen. Plugins zur Beschleunigung einer Website bringen nach meinen Erfahrungen eher nichts. Ich kann hier nur für die WordPress Plugins sprechen. Da muss man viel technisches Wissen mitbringen, um mit den Plugins wirklich die Ladezeiten zu verbessern.

4. Content nach oben
   
   Der Besucher sollte möglichst nicht scrollen müssen, bevor der eigentliche Inhalt sichtbar wird. Viele bevorzugen sogar Websites, die zumindest auf der Startseite ganz ohne scrollen auskommen. In einem Blog ist das schwer zu erreichen, zumal die zeitliche Anordnung der letzten Artikel ein wichtiges Kriterium für Blogs ist. Aber dennoch, die Seitenzugriffe werden steigen, wenn man es schafft, auf der Startseite ohne scrollen auszukommen. Davon bin ich überzeugt.
5. Einprägsam für die Besucher
   
   Die meisten Leser besuchen eine gewisse Anzahl an Websites jeden Tag. Design Grundlage sind oft ähnliche Themes. Macht es euren Lesern leicht, den Blog in Erinnerung zu behalten. Ein individuelles Design kann dabei helfen. Ein wenig technisches Verständnis vorausgesetzt, lassen sich die Themes sehr leicht anpassen und erweitern. Das führt zu Einzigartigkeit und lässt die Website in guter Erinnerung bei den Lesern. Hier im Weblog-ABC habe ich einige gute WordPress Themes aufgelistet.

6. Farbenwahl
   
   Am effektivsten ist es, mit Farben das Blog Design zu verbessern. Es gibt viele gute Artikel im Netz, die sich mit diesem Thema beschäftigen. Ein meines Erachtens herausragendes Beispiel für die Macht der Farben ist die Seite wordpress.org. Viele navigieren zu WordPress, um die neueste Version zu downloaden. Auch WordPress hat grosses Interesse daran, dass möglichst viele User die Software runterladen und einen Blog veröffentlichen. Der „Download Button“ rechts oben fällt sofort ins Auge. Perfekt gemacht!
7. Nicht zu viel Werbung
   
   Es ist in Ordnung, wenn man mit seiner Website Geld durch Werbung verdienen möchte. Wichtig für das Design einer Seite ist, dass mit Werbefläche nicht zu großzügig umgegangen wird. Der Leser ist König und sollte sich stets im Mittelpunkt fühlen. Dezent angebrachte Werbung stört nicht weiter und die Besucher kommen wieder.
8. Kompatibilität mit verschiedenen Browsern
   
   Die Besucher nutzen unterschiedliche Browser. Hier im Weblog-ABC nutzen die meisten Safari Firefox und an zweiter Stelle steht der Internet Explorer von Microsoft. Es kommen aber täglich Besucher mit den unterschiedlichsten (und sehr seltenen) Browsern. Es ist wichtig, dass die Seite auch mit verschiedenen Browsern gut aussieht. In meinen Artikel Website Analyse Tools habe ich mit dem Total Validator einen Dienst vorgestellt, der eine Website mit verschiedenen Browsern testet und Screenshots zur Verfügung stellt. Das sollte reichen.
9. Leicht zu lesen
   
   Hier geht’s mehr darum, den Inhalt eines Blogs zu formatieren. Weniger um das Design. In den Posts Blog Artikel richtig schreiben und 10 Tipps für das Schreiben eines Blog Artikels habe ich bereits beschrieben, wie gute Artikel aussehen sollten. Das Scannen von Artikel Inhalten ist sehr wichtig. Überschriften, Listen, Fettschrift etc. sind wichtig und machen es den Lesern einfacher.
10. Wichtige Elemente in die besten Positionen
    
    Effektives Design lenkte die Aufmerksamkeit der Besucher auf die wichtigen Stellen eines Artikels oder einer Website. Die wichtigsten Links, Bilder usw. sollten grundsätzlich auf der ersten Seite angebracht werden. Unnötige Elemente sollten entfernt werden, so dass die Aufmerksamkeit der Besucher auf die wirklich wichtigen Elemente gelenkt wird.
11. Content is King
    
    Der Inhalt ist entscheidend für den Erfolg einer Website. Das ist uns allen klar. Das Design sollte daher auch dafür sorgen, dass sich die Besucher tatsächlich auf den Inhalt konzentrieren können. Ich sehe immer wieder Websites, die z.B. farblich so schlecht gestaltet sind, dass man den Inhalt kaum vom drumherum unterscheiden kann.
12. Bilder für das Internet optimieren
    
    Eine schnelle Ladezeit ist wichtig. Das habe ich weiter oben schon geschrieben. Gerade bei grossen Bildern dauert es oft zu lange, bis die Bilder angezeigt werden. Die Besucher sind ungeduldig und verlassen daher oft die Seite schnell wieder.
13. Freien Platz lassen
    
    Eine Website wirkt viel aufgeräumter und professioneller, wenn man freien Platz läßt und nicht jede freie Ecke mit Informationen vollstopft. Wer auf seiner Seite freien Platz läßt, kann farblich abgestimmt auch gut auf bestimmte Informationen hinweisen.

Beispiele für gutes Webdesign

Ein gutes Beispiel für Webdesign ist meines Erachtens die WordPress Website. Alles wirkt sehr aufgeräumt, das Menü ist sofort ersichtlich und der wichtigste Inhalt „Download WordPress“ sticht sofort jedem ins Auge. Zudem hat es WordPress geschafft, tatsächlich ohne scrollen auszukommen. Hut ab!

Ein weiteres gutes Beispiel für Webdesign ist auch der Internetauftritt von Smashingmagazine. Alles wirkt etwas voller als bei WordPress, aber immer noch mit ausreichend Freiräumen. Die Navigation ist oben und auch in der Sidebar rechts zu finden. Smashingmagazine ist für mich der klassische Blog. Alle wichtigen Blog Elemente sind enthalten. Ob Menüleiste, Sidebar Navigation, Anmeldung zum RSS Feed, Newsletter oder einfach nur eine Blog Suche. Alle wichtigen Elemente sind vorhanden und gut übersichtlich angebracht. Wirklich nicht schlecht!

Noch ein gutes Beispiel für Webdesign ist der Internetauftritt von CMS-Testlabor. Alles wirkt sehr gut strukturiert und man erkennt klar, wohin die Aufmerksamkeit der Besucher gelenkt werden soll. Auf den orangenen Button „Finden Sie das richtige Tool“ in der Mitte. Über diesen Link werden die Besucher zum Kern der Website geführt, den Testberichten der Homepage Baukästen. Weiter unten gibt’s auf der Startseite noch die Möglichkeit, sich für den Newsletter anzumelden. Das ist auch geschickt gemacht. Wer nach unten scrollt bleibt automatisch mit den Augen am Newsletter hängen und meldet sich vielleicht auch an. Alles sehr durchdacht und gut gemacht.

Bücher und sonstige Tipps

WordPress – Das umfassende Training*
WordPress – Das Praxisbuch*
Webseiten professionell erstellen: Programmierung, Design und Administration von Webseiten*
Core Design Studio Berlin

Kennt ihr weitere Beispiele für gutes Webdesign? Dann schreibt doch einen Kommentar!