43 Webdesign Fehler, die man vermeiden sollte
Daniel Scocco schrieb vor ein paar Tagen auf seinem Blog Daily Blog Tips den Artikel „43 Web Design Mistakes You Should Avoid“. Ich war so frei und hab die Liste ins Deutsche übersetzt – auch mit der Hoffnung, dass sich deutsche Webseiten davon anregen lassen ;-)
1. Der Besucher muss innerhalb von Sekunden wissen, worüber die Webseite ist: Aufmerksamkeit ist eine der wichtigsten Werte im Internet. Wenn ein Besucher nicht in kürzester Zeit erfährt worüber die Webseite ist, wird er sie wahrscheinlich einfach wieder verlassen. Deine Seite muss mir sagen, warum ich meine Zeit auf ihr verbringen soll. Und zwar schnell.
2. Mach den Inhalt abtastbar: Das hier ist das Internet und kein Buch. Vergiss lange Textabsätze. Vielleicht besuche ich deine Seite während ich an anderen Sachen arbeite, also sorg dafür, dass ich den gesamten Text überfliegen kann. Aufzählungszeichen, Überschriften, Subüberschriften, Listen – all das kann dem Leser helfen, das zu finden, was er sucht.
3. Benutze keine ausgefallenen, schlecht lesbaren Schriftarten: Natürlich gibt es Schriftarten, die deiner Seite ein elegantes Aussehen verpassen, aber sind sie auch lesbar? Falls es dein Ziel ist, eine dem Leser eine Nachricht zu übermitteln und ihn dazu bringen deine Texte zu lesen, dann solltest du es ihm auch leicht machen.
4. Benutze keine kleine Schrift: Das Gleiche, wie im vorherigen Punkt: Du willst die Besucher dazu bringen deine Texte zu lesen, also mach es ihnen nicht schwer. Wenn ich die Zoom-Funktion meines Browsers benutzen muss, war es wahrscheinlich auch der letzte mein letzter Besuch auf deiner Webseite.
5. Öffne keine neuen Fenster: Auf meinen ersten Webseiten habe ich das auch so umgesetzt. Der Logik ist leicht zu verstehen: Wenn bei einem externen Link ein neues Fenster geöffnet wird, verlässt der Besucher auch nicht meine Seite. Falsch! Lass den Besucher entscheiden, wo er die Links öffnet. Aus diesem Grund haben Browser einen großen „Zurück“ Button. Lass dich vom Gedanken, den Besucher auf eine andere Webseite zu schicken, nicht beunruhigen. Er wird zurückkommen, wenn er will.
6. Verändere nicht die Größe des Fensters: Der Besucher sollte die Kontrolle über die Fenstergröße haben. Wenn du sie änderst, verlierst du vielleicht seine Glaubwürdigkeit.
7. Verlang keine Registrierung, solange es nicht nötig ist: Wenn ich im Internet surfe, möchte ich Informationen bekommen und nicht andersrum. Zwing mir keine Registrierung und die Angabe der E-Mailadresse oder persönlichen Daten auf, solange es nicht absolut notwendig ist (es sei denn, dein Angebot ist so gut, dass ich die Registrierung aushalten kann).
8. Abonniere dem Besucher niemals auf etwas ohne seine Zustimmung: Abonniere den Besucher nicht automatisch auf Newsletter, wenn er sich auf deiner Seite registriert. Das unaufgeforderte Senden von Mails ist nicht der beste Weg sich Freunde zu machen.
9. Benutze nicht zu viel Flash: Abgesehen vom Verlängern der Ladezeit deiner Webseite kann exzessives Nutzen von Flash den Besucher nerven. Benutze es nur, wenn du Funktionen anbieten musst, die statische Seiten nicht unterstützen.
10. Spiele keine Musik ab: In den ersten Jahren des Internets versuchten Webentwickler immer erfolgreich Musik in Webseiten einzubauen. Sie sind gescheitert. Binde keine Musik ein. Punkt.
11. Wenn du eine Audiodatei abspielen musst, überlass dem Nutzer die Kontrolle: Manche Situationen erfordern eine Audiodatei. Vielleicht möchtest du dem Besucher eine Rede vorspielen oder deine Webseite hat ein Audiokommentar. Gut. Sorge nur dafür, dass der Besucher die Kontrolle hat, stell ihm lieber einen „Abspielen“ Button zur Verfügung, anstatt die Audiodateien zu starten, sobald er die Seite betritt.
12. Überfülle deine Webseite nicht mit Bannern und Abzeichen: Zunächst, Abzeichen von Communities oder Netzwerken lassen eine Webseite sehr unprofessionell aussehen. Auch wenn es sich um Awards oder Anerkennungen handelt, solltest du sie auf die „Über uns“-Seite packen.
13. Benutze keine Webseite, die die „echte“ Webseite startet: Je weniger Schritte der Besucher braucht um deinen Inhalt zu sehen, desto besser.
14. Sorge dafür, dass Kontaktdaten auf der Seite sind: Es gibt nichts schlechteres, als eine Webseite, die keine Kontaktdaten zur Verfügung stellt. Dies ist nicht nur für den Besucher, sondern auch für dich schlecht, denn du könntest wichtiges Feedback verlieren.
15. Beeinflusse nicht den „Zurück“ Button: Dies ist grundlegendes Prinzip der Benutzerfreundlichkeit. Zerstöre den „Zurück“ Button unter keinen Umständen. Das Öffnen von neuen Fenstern zerstört ihn zum Beispiel, oder auch ein paar JavaScript Links.
16. Benutze keinen blinkenden Text: Es sei denn deine Benutzer kommen direkt aus dem Jahr 1996.
17. Vermeide eine komplexe URL-Struktur: Eine einfache, Stichwort basierte URL wird nicht nur dein Suchmaschinen-Ranking verbessern, sondern wird es auch dem Leser leichter machen den Inhalt der Seite vor dem Besuchen zu erkennen.
18. Benutze CSS anstatt HTML-Tabellen: HTML-Tabellen wurden zum Erstellen von Layouts benutzt. Mit dem Beginn von CSS gibt es keinen Grund mehr weiterhin Tabellen zu benutzen. CSS ist schneller, zuverlässiger und bietet viel mehr Funktionen.
19. Sorge dafür, dass die Besucher auf der ganzen Seite suchen können: Es gibt einen Grund, warum Suchmaschinen das Internet revolutioniert haben. Wahrscheinlich hast du’s schon erraten: Sie machen es ziemlich leicht die Informationen zu finden, die wir suchen. Versäum das nicht auf deiner Seite.
20. Vermeide Drop-Down-Menüs: Der Besucher soll direkt die komplette Navigationsoptionen sehen. Drop-Down-Menüs können verwirren und Informationen verstecken, die der Leser sucht.
21. Benutze eine Text-Navigation: Eine Text-Navigation ist nicht nur schneller, sondern auch zuverlässiger. Manche Benutzer, zum Beispiel, surfen mit ausgeblendeten Bildern.
22. Wenn du auf PDF-Dateien verlinkst, weise darauf hin: Schon mal auf einen Link geklickt, nur um zu sehen, dass dein Browser einfriert während der Acrobat Reader startet, um (unaufgefordert) eine PDF-Datei zu öffnen?
23. Verwirre den Besucher nicht mit zu vielen Versionen: Vermeide es, den Besucher mit zu vielen Versionen der Webseite zu verwirren. Welche Bandweite willst du lieber? 56 Kbps? 128 Kbps? Flash oder HTML? Mensch, gib mir einfach den Inhalt!
24. Schalte keine Werbung im Inhalt: Werbeeinblendungen wie Adsense im Inhalt der Webseite können die Durchklickrate erhöhen. Auf Dauer wird es deine Leserschaft reduzieren. Ein genervter Besucher ist ein verlorener Besucher.
25. Benutze eine einfache Navigationsstruktur: Manchmal ist weniger mehr. Diese Regel gilt meistens für Personen und Wahlen. Sorge dafür, dass deine Webseite eine einzelne, klare Navigationsstruktur aufweist. Das Letzte, was du willst, ist es Leser zu verwirren, die gucken, wo sie nun ihre Information finden.
26. Vermeide „Intros“: Zwinge den Besucher nicht etwas anzugucken oder durchzulesen, bevor er zum richtigen Inhalt gelangt. Das ist einfach nur nervig, und er wird nur bleiben, wenn du wirklich etwas Einzigartiges anbietest.
27. Benutze kein FrontPage: Dieser Punkt gilt auch für alle anderen, billigen HTML-Editoren. Während sie vorgeben Webdesign leichter zu machen, wird die Ausgabe ein schlechter Code, inkompatibel mit verschiedenen Browsern und zahlreichen Bugs.
28. Sorge dafür, dass deine Webseite in allen Browsern gleich aussieht: Nicht alle Browser sind gleich gemacht, und nicht alle interpretieren CSS und andere Sprachen auf dem gleichen Weg. Ob du’s willst oder nicht, du musst deine Webseite mit den meistgebrauchten Browsern auf dem Markt kompatibel machen, ansonsten verlierst du auf Dauer Leser.
29. Sorge dafür, Ankertext in Links einzufügen: Ich gebe zu, ich machte diesen Fehler auch bis vor kurzem. Es ist leichter, den Leuten „Klick hier“ zu sagen. Aber das ist nicht effizient. Sorge für einen relevanten Ankertext in deinen Links. Es wird sicherstellen, dass der Leser weiß, wohin er kommt, wenn er auf den Link klickt, und es wird außerdem SEO Vorteile für externe Seiten schaffen, auf die verlinkt wird.
30. Verdecke keine Links: Neben einem klaren Ankertext, muss der Besucher auch in der Lage sein in der Statusleiste des Browsers zu erkennen, wohin der Link führt. Wenn du deine Links verdeckst, verliert deine Webseite an Glaubwürdigkeit.
31. Mache Links sichtbar: Der Suche sollte leicht erkennen, was man anklicken kann, und was nicht. Sorge dafür, dass sich deine Links farblich hervorheben (Das Standard Blau ist meistens optimal). Wenn möglich, unterstreiche sie zusätzlich.
32. Unterstreiche oder färbe keinen normalen Text: Unterstreiche keinen normalen Text, solange es nicht unbedingt nötig ist. So wie die Besucher erkennen sollen, was anzuklicken ist, sollen sie auch nicht auf die Idee kommen, dass etwas anzuklicken ist, wenn es in Wirklichkeit nicht ist.
33. Wechsle die Farbe von angeklickten Links: Dieser Punkt ist sehr wichtig für die Benutzerfreundlichkeit deiner Seite. Angeklickte Links, die die Farbe ändern, helfen dem Besucher sich besser zurechtzufinden und sorgen dafür, dass er nicht gleiche Seiten doppelt besucht.
34. Benutze keine animierten GIFs: Vermeide GIF-Animationen, es sei denn du hast Werbebanner, die Animationen benötigen. Sie lassen die Webseite unprofessionell aussehen und lenken vom Inhalt ab.
35. Benutze die ALT und TITLE Attribute für Bilder: Neben SEO Vorteilen, spielen die ALT und TITLE Attribute eine wichtige Rolle für blinde Besucher.
36. Benutze keine rauen Farben: Wenn der Besucher nach zehn Minuten auf deiner Webseite Kopfschmerzen bekommt, solltest du besser ein anderes Farbschema wählen. Wähle die Farben der Farbpalette um das Ziel deiner Webseite (Übermittle zum Beispiel eine bestimmte Stimmung, stelle den Inhalt heraus, und so weiter).
37. Benutze keine Pop-ups: Dieser Punkt bezieht sich auf alle Pop-ups. Selbst wenn der Benutzer Pop-ups anfordert, ist es schlecht welche zu benutzen, da die Anzahl der Pop-up-Blocker steigt.
38. Vermeide JavaScript Links: Diese Links führen ein kleines JavaScript aus, wenn ein Benutzer draufklickt. Halt dich von ihnen fern, da sie dem Besucher oft Probleme bereiten.
39. Platziere funktionsgemäße Links im Footer: Besucher sind dazu geneigt bis zum Ende der Seite zu scrollen, wenn sie eine bestimmte Information nicht finden. Auf jeden Fall solltest du einen Link zur Startseite und vielleicht einen Link zur Kontaktseite einfügen.
40. Vermeide lange Seiten: Wenn der Besucher immer runterscrollen muss, wenn er den Inhalt zu lesen, wird er wahrscheinlich den Inhalt überfliegen. Falls das auf deine Seite zutrifft, mach sie kürzer und verbessere die Navigationsstruktur.
41. Kein horizontales Scrolling: Während vertikales Scrollen toleriert wird, trifft dies auf horizontales Scrollen nicht zu. Heutzutage ist die meistbenutzte Bildschirmauflösung 1024 × 768 Pixels, also sorge dafür, dass deine Webseite da reinpasst.
42. Keine Rechtschreib‑ oder Grammatikfehler: Das ist kein Webdesign-Fehler, aber es einer der wichtigsten Faktoren, die die gesamte Qualität einer Webseite ausmachen. Sorge dafür, dass deine Links und Texte keine Rechtschreib‑ oder Grammatikfehler aufweisen.
43. Wenn du CAPTCHA benutzt, sorge dafür, dass die Buchstaben lesbar sind: Mehrere Seiten benutzen CAPTCHA Filter als Methode um Spam zu verringern. Es gibt nur ein Problem: Meistens muss der Benutzer seine gesamte Familie rufen, um die Buchstaben zu entziffern.
Feedback und Verbesserungen erwünscht.
na das ist doch mal klasse ;)
hab den artikel seit 2 tagen vor mir her geschoben weil ich keine lust hatte mein englisch rauszukramen! dein artikel ist gebookmarked
lg
Jared
btw:
wär es ok wenn ich mir für meinen nächsten Beitrag einige der übersetzten Punkte herausnehme? maximal 15 und natürlich mit link zu dir… wollte einfach mal fragen bevor ich mir die doppelte arbeit mache und die 15 punkte selber übersetze.
wollte den artikel morgen oder Sonntag veröffentlichen!
deshalb die etwas eilige anfrage
Jared
Hi Jared,
freut mich, dass dir der Artikel gefällt :-) hab natürlich kein Problem damit, wenn du ein paar Punkte übernimmst. Backlink wäre nett ;-)
Marcel
hallo marcel
anscheinend ist der backlink nicht angekommen :(
deswegen setze ich ihn jetzt einfach händisch – wenn du erlaubst!
http://www.jared2.de/2007–05⁄8-punkte-auf-die-ich-beim-webdesign-achte/
Hmm, keine Ahnung woran es liegt, aber danke! :)
Hey!
Vielen Dank für diese tolle Liste auf deutsch!
zu 27.:
Seit wann ist Frontpage bilig? Ich habe schon an verschiedenen anderen Stellen gefragt, was dann wenn nicht Frontpage??
zu 29.:
Ich ahbe erst gestern gelesen: »Hier Klicken« wird wieder modern!! Es sei eine Aufforderung und bringt ca. 8 % mehr Klicks?!
@ Gerd: Frontpage ist in der Hinsicht billig, dass es »schlechten« Code erzeugt und sich an keine Standards hält.
Gerade als Besitzer einer SEO Homepage solltest du wissen, dass »Hier klicken« total schlecht ist, da es keine richtige Linkbezeichnung ist! Es mag mehr Links bringen, aber es besser im Text unterzubringen ist eleganter und nicht so aufdringlich.