OnlineMarketing13, 29.5.2013
„Jakob was right“
The top 10 mistakes in webdesign
revisited
Ein kurzer Zeitsprung
• 1995 Jakob Nielsen startet Useit.com
• 2000: Usability ist doof und spießig
• „Aber es gibt doch den Browserkrieg“
• 2005 Browserkrieg ist vorbei …. es beginnt
der Mobile-Krieg
• 2007: Usability ist doof, wir machen
Conversionrate-Optimierung
• 2013: Multiscreen, Multiplattform, schon
wieder viele Browser und sehr mächtige User.
Fehler passieren
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Bad Search
– Platzierung der Suchbox
– Falscher Standardwert
– Suchbutton deutlich genug
– Entertaste
– Type-ahead – Autocomplete
– Und natürlich Umlaute/Sonderzeichen
– Übersichtliche Ergebnisseite
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
PDF-Dateien und andere verbotene Formate
– Flash
– Silverlight
– Word
– PNG
– ZIP
– MOV, AVI
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
• Versteck den Hyperlink
– Formatierung wie Fließtext
– Keine Hand bei Mausberührung
– Keine Unterstreichung
– Minipfeil statt Verlinkung
– Ausgegraute Interaktionselemente
– RollOver (mobile?)
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
„User entscheiden in den ersten drei
Sekunden, ob sie auf einer Seite
bleiben.“
Graham Carlton
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
„Responsive Design ist mehr als
beweglicher HTML-Code, es ist eine
Inhaltsstrategie, die den Nutzer in
den Mittelpunkt stellt.“
Vitaly Friedman
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Vorsicht vor Betriebsblindheit
Vorsicht vor Bannerblindheit
Vorsicht vor starren Regeln
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Einige Gesetze
• Nähe (Position & Farbe!)
• Kontrastprinzip
• Konsistenz
• Konventionen
– Warenkorb rechts oben
– Suchbox oben Mitte
– Service-Spalte rechts
– Checkout von links nach rechts
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
• Links in neuem Fenster öffnen
– Kontext geht verloren
– Daten gehen verloren
– Ich komme nicht zurück
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
Bonusmaterial
http://conversionoptimizing.eu/
conversion-toolkit/
Top 10 mistakes in webdesign
• Bad Search
• PDF-Dateien und andere verbotene Formate
• Versteck den Hyperlink
• Überfüllte Seiten, nicht scanbare Texte
• Feste Seitenformatierung
• Keine oder schlechte Seitentitel
• Inhalt sieht wie Werbung aus
• Designgesetze brechen
• Links in neuem Fenster öffnen
• Die Nutzerfragen nicht beantworten
danke
frank@puscher.de

„Jakob was right“ von Frank Puscher auf dem Online Marketing Kongress 2013

  • 1.
    OnlineMarketing13, 29.5.2013 „Jakob wasright“ The top 10 mistakes in webdesign revisited
  • 2.
    Ein kurzer Zeitsprung •1995 Jakob Nielsen startet Useit.com • 2000: Usability ist doof und spießig • „Aber es gibt doch den Browserkrieg“ • 2005 Browserkrieg ist vorbei …. es beginnt der Mobile-Krieg • 2007: Usability ist doof, wir machen Conversionrate-Optimierung • 2013: Multiscreen, Multiplattform, schon wieder viele Browser und sehr mächtige User.
  • 3.
  • 4.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 5.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 13.
    Bad Search – Platzierungder Suchbox – Falscher Standardwert – Suchbutton deutlich genug – Entertaste – Type-ahead – Autocomplete – Und natürlich Umlaute/Sonderzeichen – Übersichtliche Ergebnisseite
  • 14.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 20.
    PDF-Dateien und andereverbotene Formate – Flash – Silverlight – Word – PNG – ZIP – MOV, AVI
  • 21.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 27.
    • Versteck denHyperlink – Formatierung wie Fließtext – Keine Hand bei Mausberührung – Keine Unterstreichung – Minipfeil statt Verlinkung – Ausgegraute Interaktionselemente – RollOver (mobile?)
  • 28.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 31.
    „User entscheiden inden ersten drei Sekunden, ob sie auf einer Seite bleiben.“ Graham Carlton
  • 32.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 37.
    „Responsive Design istmehr als beweglicher HTML-Code, es ist eine Inhaltsstrategie, die den Nutzer in den Mittelpunkt stellt.“ Vitaly Friedman
  • 38.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 42.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 44.
    Vorsicht vor Betriebsblindheit Vorsichtvor Bannerblindheit Vorsicht vor starren Regeln
  • 45.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 49.
    Einige Gesetze • Nähe(Position & Farbe!) • Kontrastprinzip • Konsistenz • Konventionen – Warenkorb rechts oben – Suchbox oben Mitte – Service-Spalte rechts – Checkout von links nach rechts
  • 50.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 56.
    • Links inneuem Fenster öffnen – Kontext geht verloren – Daten gehen verloren – Ich komme nicht zurück
  • 57.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 67.
  • 72.
  • 73.
    Top 10 mistakesin webdesign • Bad Search • PDF-Dateien und andere verbotene Formate • Versteck den Hyperlink • Überfüllte Seiten, nicht scanbare Texte • Feste Seitenformatierung • Keine oder schlechte Seitentitel • Inhalt sieht wie Werbung aus • Designgesetze brechen • Links in neuem Fenster öffnen • Die Nutzerfragen nicht beantworten
  • 75.