Tipps zu Web Design

K.I.S.S.
Keep It Silly Simple
Mach es blödsinnig einfach

ist der beste und wichtigste Rat, den Ihnen irgendwer zum Thema Web Design geben kann.

Wenn man wie ich ein Hobbygraphiker ist, verliebt in die eigenen Schöpfungen, ist dieser Rat schwer zu befolgen. Es hat mich viel Überwindung gekostet alle unnötigen Graphiken rauszuschmeissen, aber ganz ohne wollte ich doch nicht auskommen.Sie sehen hier den Kompromiß, den ich mit mir mir selbst getroffen habe.

Wenn Sie die großen, vielbesuchten Seiten anschauen, werden Sie feststellen, daß diese alle sehr einfach gestaltet sind und das sicher mit guten Grund.

Einige wichtige Tipps:

Tipp Nr 1 - Inhalt ist König!

Das ist eigentlich kein (Grafik)-Design Tipp, aber wenn wir Design im weitesten Sinne verstehen, dann ist das der wichtigste Design-Tipp von allen.

Inhalt ist gleich Information. Wenn Sie selbst im Netz surfen, wollen Sie nicht nur ein paar schöne Bilder, oder ein paar tolle Effekte sehen, sondern normalerweise Informationen zu dem Thema, das Sie interessiert.

Sie interessieren sich für Nasenringe ? Dann sind Sie nicht nur an der Liste der verfügbaren Modelle interessiert, sondern auch an der Geschichte der Nasenringe, an nützlichen Tipps zur Wartung, an Quellen für gebrauchte Nasenringe, vielleicht eine Anweisung wie Sie sich selbst einen (einfachen) Nasenring herstellen können und so weiter.

Die Seite, wo Sie das meiste über Ihr Lieblingsthema finden, werden Sie in Ihre Favoritenliste aufnehmen und öfter besuchen. Das wollen Sie sicher auch für Ihre Site erreichen, odrr ?

Die Suchmaschinen bevorzugen Seiten mit Inhalt. Eine Seite nur mit Bildern, hat kaum eine Chance auf einen vorderen Platz in den Suchergebnissen. Wer gibt schon einen Link zu einer Seite, die keine Inhalte bietet ? Und Links von anderen Seiten sind das wichtigste Marketinginstrument im Internet.

Tipp Nr. 2 - Schlanke Seiten

KISS... (siehe oben) Sie können die schönste Seite der Welt haben, mit einem Inhalt der nobelpreisverdächtig ist, wenn die Seite endlos braucht um geladen zu werden, wird Sie niemand sehen.

Die meisten Leute brechen ab, wenn Ihre Seite nicht innerhalb von höchstens 20 Sekunden geladen ist. Und alle die werden nie erfahren, was sie versäumt haben. Sie klicken sich zur nächsten Seite, die schneller lädt (und auch nicht so schlecht ist).

Niemanden interessiert, daß Sie an der supercoolen Grafik (die alleine 30 Sekunden zum Laden braucht) einen ganzen Tag gearbeitet haben.

Also eine Seite ganz ohne Grafik ? Nein sicher nicht, aber sparsamst. Besonders die Startseite, sollte nicht stärker als 60 KB sein, je schlanker desto besser. Auf jeden Fall minimieren Sie die Größe Ihrer Graphiken. HIER finden Sie ein Instrument dafür. Es ist erstaunlich wie sehr Sie Ihre Grafik ohne Qualitätsverlust verkleinern können.

Tipp Nr. 3 - Hintergrund und Textfarbe

Schwierig, nicht wahr ?

Stellen Sie sich vor einen ganzen Artikel so lesen zu müssen. Wenn Sie schon einen gemusterten Hintergrund verwenden wollen, dann einen hellen nur mit leichtem Muster. Am besten einen Hintergrund mit linkem Rand, wie Sie sie hier finden können.

Viele Experten meinen nur schwarzer Text auf weißem Grunde käme in Frage. Dieser Meinung bin ich nicht. Ein wenig Individualismus sollte schon gestattet sein. Ich finde sogar, daß etwas weniger Kontrast zwischen Text und Hintergrund die Augen eher schont, aber das ist nur meine persönliche Meinung.

Textlinks sollten in einer anderen Farbe gehalten sein als der übrige Text, damit man sie auch als solche erkennt, wenn sie nicht unterstrichen sind.

Wenn Sie schon unbedingt einen gemusterten dunklen Hintergrund verwenden wollen, dann vergessen Sie nicht auch eine dunkle Hintergrundfarbe einzustellen. Damit bleibt der helle Text auch lesbar, wenn jemand bei seinen Browser die Bildwiedergabe ausgeschaltet hat.

Helle Schrift auf dunklem Hintergrund finden viele (besonders Amateure) cool, oder wie man so sagt. Ich finde es furchtbar. Auf vielen Seiten ist der Text nahezu unleserlich, also wozu überhaupt was hinschreiben ?

Tipp Nr. 4 - Text und Farbe

Auch hier wieder: weniger ist mehr ! Verwenden Sie auf einer Seite möglicht nur eine Schrifttype, höchstens 3 Schriftgrößen und höchstens 2 Textfarben.

Die Farben des Hintergrundes, der Graphiken und des Textes sollten aufeinander abgestimmt sein. Giftgrün auf Pink ist sicher nicht jedermanns Sache, aber das ist auch Geschmackssache.

Machen Sie kurze Absätze, mit viel Zwischenräumen. Ein Text, in einer Wurscht herunter geschrieben, ist schwer zu lesen.

Tipp Nr. 5 - Animierte Grafik

Wenn Sie auf Ihrer Seite einen intelligenten Text haben, sollten Sie Ihren Besucher nicht durch Unmengen wild blinkender Grafiken davon ablenken.

Eine Animation pro Seite ist schon fast zuviel und wenn Sie Banner auf Ihre Seite packen, dann haben Sie sowieso schon genug Unruhe.

Überlassen Sie die Blinkerei den Seiten wo sie vielleicht hinpassen. Auf einer auch nur entfernt geschäftlichen Seite haben sie nichts verloren.

Das gilt auch für Flash, an sich eine tolle Sache, nur wird es total übertrieben. Eine Intro die 2 Minuten zum Laden braucht und keine Möglichkeit bietet sie zu überspringen, wird wohl wenig Freunde gewinnen, so toll kann sie gar nicht sein. Ein fantastisches Instrument für jeden Kundenabwehrdienst!

Tipp Nr. 6 - Rahmen

Ich persönlich mag Rahmen nicht und es freut mich, daß die meisten Experten meiner Meinung sind.

Wozu sollen die gut sein ? Sie sind häßlich und nichts was sie können, etwa leichtere Navigation zu ermöglichen, kann nicht durch eine einfache Seite auch erreicht werden.

Außerdem können viele Roboter der Suchmaschinen nicht richtig damit umgehen.

Das war meine Meinung bis vor ein paar Monaten, jetzt verwende ich Sie selbst! Na, man wird ja wohl seine Meinung ändern dürfen! (Bruno Kreisky, österreichischer Sonnenkönig)

Daher ein Nachtrag, eigentlich auch kein (Grafik)Design Tipp:

Wenn Sie bei Ihrer Site Rahmen (Frames) verwenden, müssen Sie noch einiges zusätzlich beachten.

Wenn möglich gestalten Sie die Homepage ohne Frames und verlinken erst dann auf den (die) Frameset(s).

Unbedingt sollten Sie bei jedem Frameset den "noframe"-Bereich gestalten und wie jede andere Seite behandeln (MetaTags, Text, Links).

Wenn eine einzelne Seite (nach Listung in einer Suchmaschine, oder Ihrer lokalen Suchmaschine) aufgerufen wird erscheint sie ohne das entsprechende Frameset und daher ohne die dort befindliche Navigation. Dem können Sie mit einem Javascript abhelfen, welches dann automatisch das entsprechende Frameset nachlädt.

Doch noch ein Design-Tipp: Optimieren Sie Ihre Framesets unbedingt für Auflösung 800x600. Nichts ist häßlicher als eine Seite mit mehreren Scrollbalken kreuz und quer, wenn auf eine höhere Auflösung optimiert wird. Und immer noch sind ca. 40% aller Surfer mit einer Auflösung 800x600 unterwegs!

Tipp Nr. 7 - Unfertige Seiten

Eines der unnötigsten animierten GIFs ist das "under construction".

Wenn eine Seite nicht fertig ist, dann hat Sie nichts auf Ihrem Server verloren.

Ein Besucher, der auf Ihre Seite kommt und sieht, daß Sie nicht fertig ist, kommt wahrscheinlich nicht wieder.

Andererseits ist eine gute Seite nie fertig, weil es immer etwas geben wird, das man ändern will, Neues dazu, Überholtes weggeben wird, aber das ist ja was anderes.

Tipp Nr. 8 - Hintergrundmusik

Wenn ich im Internet herumsurfe, dann spiele ich in meinem Computer ein paar von meinen Lieblings-CDs und es war mir immer ein Ärgernis, wenn plötzlich eine Seite ungefragt Ihre Musik eingeblendet hat.

Jedenfalls sollten Sie Ihren Besuchern die Möglichkeit geben die Musik auszuschalten.

Tipp Nr. 9 - Durchgehender Stil

Es erleichtert die Navigation und ergibt ein geschlossenes Bild Ihrer Seiten, wenn alle gleich aussehen und die wichtigen Links bei jeder Seite auf der gleichen Stelle sind.

Machen Sie´s Ihren Besuchern so leicht wie möglich, dann kommen sie auch wieder.

Tipp Nr. 10 - Browser/Auflösung - neutral

Gestalten Sie Ihre Seiten so, daß Sie mit jedem Browser und mit jeder Bildschirmauflösung ordentlich dargestellt werden.

Derzeit verwenden ca. 85% den MS-Explorer, 40% Auflösung 800x600, 60% 1024x768, doch vielleicht sind ein paar wichtige Besucher auch anders unterwegs.

Am besten optimieren Sie für 800x600, verwenden nur ca 90% (~720px) der Bildschirmbreite und stellen die Seite in die Mitte.

Im übrigen sollte der Text nicht über die ganze Seite gehen, weil ein zu breiter Text schwerer zu lesen ist. Es ist anstrengend, wenn die Augen sich den langen Textzeilen entlanghangeln müssen. Eine Zeile sollte mit möglich nur einem Blick erfaßt werden können.

Tipp Nr. 11 - Suchmaschinen-Tauglichkeit

Im weitesten Sinne gehört auch die interne Gestaltung Ihrer Seiten zum Design. Gewisse Regeln müssen eingehalten werden, damit auch nur eine Chance besteht, daß Ihre Site von den Suchmaschinen gefunden wird und an vorderer Stelle in den Ergebnislisten landet. Lesen Sie dazu HIER ein paar Tipps.

Tipp Nr. 12 - Surfen

Surfen Sie wie verrückt ! Sammeln Sie Anregungen, aber kopieren Sie nicht. Lernen Sie von anderen, aber versuchen Sie Ihren eigenen Stil zu finden.

Soweit meine bescheidenen Tipps, vielleicht hat der eine oder der andere Ihnen geholfen, jedenfalls viel Spaß jetzt bei der Gestaltung Ihrer Seiten.

Ein paar Tipps wie man mit einfachen Mitteln (HTML, CSS) ganz nette Effekte erzielen kann finden Sie HIER.