| Allgemeine Tipps |
|
|
| Tipps und Tricks - Webdesign-Tipps |
|
Wir möchten Ihnen mit diesen einleitenden Worten zeigen, worauf es beim Webdesign ankommt. Was sollte man tun, was besser nicht? Viele der nun folgenden Tipps sollten eigentlich selbstverständlich sein. Leider werden sie nicht immer beachtet oder ganz und gar ignoriert. Wer aber eine gute und eventuell auch mal erfolgreiche Webseite haben möchte, sollte beim Gestalten seiner Webseite an die folgenden Kniffe denken. 1. Technische Optimierung1.1 Browser-KompatibilitätHeutzutage gibt es unzählige Browser auf dem Markt. Internet Explorer, Firefox, Opera, Konqueror, Safari, Chrome - nur um mal ein paar Beispiele zu nennen. Jeder Browser hat seine Vor- und Nachteile. Jedoch interpretiert auch jeder Browser HTML und besonders CSS teilweise auf seine eigene Art und Weise. Manche können mehr, manche können weniger Befehle darstellen - je nach Konformität.
Daher sollte man beim Gestalten seiner Seiten darauf achten, eine möglichst breite Auswahl an Browsern zu unterstützen. Die mit Abstand meist genutzten Browser sind sicherlich der Internet Explorer von Microsoft und Firefox von der Mozilla Foundation. Diese beiden Browser sollte man auf alle Fälle unterstützen. Nützlich ist es daher, mehrere Browser auf dem Rechner installiert zu haben. So kann man schauen, wie sich welcher Browser beim navigieren auf den eigenen Seiten verhält. Es ist wichtig, dass die eigene Webseite auf möglichst vielen Plattformen funktioniert. Denn nur so lässt sich sicherstellen, dass niemand ausgeschlossen wird. 1.2 HTML-KonformitätBleiben Sie bei den allgemeinen Regeln für HTML bzw. XHTML. Verwenden Sie möglichst keine "Eigenschöpfungen", wie sie es beispielsweise für den Internet Explorer zu Hauf gibt. An sich spricht natürlich nichts dagegen, kleinere Spielereien (z.B. Bookmarks mittels JavaScript, etc.) einzusetzen. Bieten Sie aber Alternativen an! Sie sollten sich an die Web-Sprachstandards des W3-Konsortoums (deutsches Büro des "W3C") halten. Wie Sie HTML "richtig" einsetzen, erfahren Sie zum Beispiel auf SelfHTML von Stefan Münz.
Denken Sie daran: Je standardisierter Sie arbeiten, desto größer ist auch die Wahrscheinlichkeit, dass Ihre Seite in jedem Browser richtig angezeigt wird. 1.3 AuflösungHaben Sie Ihre Seiten schon mal in einer Auflösung von 640x480 betrachtet? Eine Auflösung, so möchte man meinen, die in Zeiten von 24-Zoll-TFT-Monitoren nicht mehr zum Einsatz kommt. Aber diese Annahme ist falsch. Niedrige Auflösungen kommen gerade dann zum Einsatz, wenn alte Hardware verwendet wird oder der Surfer eine Sehschwäche hat.
Probieren Sie also, Ihre Seiten möglichst so anzupassen, dass man auch bei niedrigen Auflösungen noch ohne Probleme über Ihre Seite navigieren kann. Dies ist zwar nicht immer möglich, aber es sollte möglichst nicht unversucht bleiben. Prozentuale Angaben für Höhe und Breite der Frames und Tabellen, relative Angaben zur Schriftgröße sind hier gute Mittel, die eigenen Seiten sowohl für hohe, als auch für niedrigere Auflösungen kompatibel zu machen. 2. SchriftManchmal wird das Problem übersehen, dass der Web-Browser nur die Schriftarten darstellen kann, die auch auf dem Computer des Surfers installiert sind. Schuld daran sind aber auch häufig HTML-Editoren, die dem Nutzer die Wahl über das komplette Angebot an installierten Schriftarten wählen lassen. Wenn Sie keine bösen Überraschungen erleben möchten, achten Sie darauf nur Standard-Schriftarten zu verwenden.
Für Windows-Computer sind diese: Arial, Courier New,Tahoma, Times New Roman, und Verdana. Wenn Sie dennoch gerne exotischere Schriftarten verwenden möchten - beispielsweise für Überschriften - erstellen Sie lieber kleine Grafiken. 3. Frameset oder TabellenVereinzelt findet man noch den Hinweis, dass Framesets schlecht wären, da nicht jeder Browser diese auch darstellen kann. Das ist jedoch Irrglaube. Jeder halbwegs moderne Browser kann Framesets interpretieren, zumal Frames seit HTML4.0 mit zum Standard gehören.
Jedoch können Frames durchaus kleinere Unzulänglichkeiten beinhalten. Beim Ausdrucken einer Webseite muss darauf geachtet werden, dass richtige Frame auszudrucken. Sonst hält man hinterher das Menü der Webseite in der Hand und nicht den Artikel, den man eigentlich lesen wollte. Auch bei der Bildschirmauflösung können Frames hinderlich wirken - gerade bei kleinen Laptops oder Handhelds. Mit Tabellen hingegen lässt sich das Design der Webseite sehr genau steuern. Aber auch Tabellen haben Nachteile: Manche Browser zeigen eine Tabelle erst dann an, wenn alle sich in ihr befindlichen Inhalte geladen wurden. In Zeiten von DSL ist dies zwar nicht mehr allzu schlimm, aber ein Webserver kann auch mal überlastet sein - und so muss man schlussendlich doch warten. Was schlussendlich nun besser ist und was nicht - das bleibt jedem selbst überlassen. 4. GrafikenGrafiken sollten mit Angabe der Parameter für Höhe und Breite versehen werden. Wenn diese angegeben sind, zeigt der Browser einen leeren Rahmen um die noch nicht fertig geladene Seite. Dies wiederum hat den Vorteil, dass Ihr Design nicht aus der Bahn geworfen wird.
Wenn Sie ein Hintergrundbild für Ihre Seite verwenden möchten, achten Sie bitte darauf, dass ein Browser eine Grafik kachelt. Das heißt, ist die Grafik "zu Ende", wird direkt daneben das Bild erneut angesetzt. Dies zieht mitunter einen sehr unschönen Kacheleffekt mit sich, sollte die Grafik nicht groß genug sein. Verwenden Sie daher Hintergrundbilder, bei denen eine Kachelung nicht auffällt. 5. Animierte GIFsAuch heute noch finden sich auf vielen privaten Homepages unzähliche animierte GIF-Bilder. Als Webmaster sollten Sie jedoch auf den Einsatz von animierten Grafiken verzichten. Ein oder zwei, an der richtigen Stelle platziert, können ja noch ganz nett aussehen - aber wenn es überall blinkt und zappelt muss man sich schon fragen, ob das so sinnvoll ist.
6. Überladene StartseitenDie Startseite Ihres Internetauftrittes sollte klar definiert, übersichtlich und nicht zu überladen sein. Unzählige Bilder, Buttons, Werbebotschaften und dazu noch jede Menge Text gehören einfach nicht zum guten Ton. Die Startseite ist Ihr Aushängeschild. Vergraulen Sie Ihre Besucher also nicht schon direkt am Eingang.
7. LinksFür Surfer besonders ärgerlich sind Links, die auf nicht (mehr) existierende Seiten verweisen. Auch Scheinlinks (unterstrichene Wörter) können für den unerfahrenen Surfer ärgerlich sein, wenn er versucht den vermeindlichen Link anzuklicken. Benutzen Sie zum Hervorheben von wichtigen Textstellen lieber Kursiv- oder Fettschrift. Alternativ ist es natürlich auch möglich, einfach die Links per CSS anders zu gestalten.
8. Schlechter KontrastAchten Sie darauf, dass die gewählte Schriftfarbe im Kontrast zur Hintergrundfarbe steht, damit der Text leserlich bleibt und nicht irgendwann in den Augen schmerzt.
Beispiel für guten Kontrast: Schwarzer Text auf weißem Hintergrund Beispiel für schlechten Kontrast: Grüner Text auf gelbem Hintergrund Auch sollte eine Hintergrundgrafik wirklich im Hintergrund bleiben. Sonst lässt sich auch hier Text nur schwerlich erkennen. |