Usability
Struktur und Navigation
- Alle Navigationselemente sind klar zu erkennen und leicht zu bedienen.
- Nicht-klickbare Elemente erwecken nicht den Eindruck, klickbar zu sein.
- Es gibt in der Hauptnavigation zwischen 5 und 9 Kategorien.
- Die Menüüberschriften sind kurz und eindeutig.
- Der Besucher sieht jederzeit, in welcher Kategorie er sich gerade befindet.
- Die Einteilung in Kategorien entspricht der Sichtweise der potentiellen Kunden.
- Jede Seite hat einen individuellen Titel.
- Die Linktexte sind sprechend, also nicht „mehr“ oder „hier“.
- Das Title-Attribut ist für alle Links gesetzt.
- Das Logo verlinkt auf die Startseite.
- Eine Sitemap ist vorhanden (ab 40-50 Seiten).
- Eine Breadcrumb-Navigation ist vorhanden (ab 40-50 Seiten).
- Eine Suchfunktion (ab 200 Seiten empfohlen) ist vorhanden und gut sichtbar.
- Es gibt keine unlogischen oder nicht-nachvollziehbaren Weiterleitungen.
- Alle Links sehen einheitlich aus.
Seitenlayout und Design
- Die Seiten haben maximal 3 Spalten.
- Die Website verwendet durchgängig ein einheitliches Farbschema.
- Die verwendeten Farben passen zueinander.
- Signalfarben kommen nur sehr sparsam vor.
- In eine Zeile passen maximal 90-100 Zeichen.
- Der Kontrast zwischen Schriftfarbe und Hintergrund ist ausreichend.
- Der wichtige Inhalt ist „above the fold“.
- Die einzelnen Inhaltselemente sind klar voneinander abgegrenzt, z.B. durch weißen Freiraum.
- Bilder haben einheitliche Designelemente, wie Schatten, Rahmen oder Untertitel.
- Es gibt keine „False Bottoms“ auf den Seiten.
Informationsbedürfnis
- Der Zweck der Seite ist innerhalb von wenigen Sekunden ersichtlich.
- Falls das Logo nicht eindeutig ist, gibt es einen Claim oder Slogan.
- Die Informationen über den Seitenbetreiber („Über uns“) sind vorhanden und leicht zu finden.
- Die Website enthält keine offensichtlich veralteten Inhalte.
- Die Kontaktinformationen sind von jeder Seite durch maximal einen Klick zu erreichen.
- Die Seite bietet den Besuchern mehrere Möglichkeiten zur Kontaktaufnahme.
- Das Impressum ist von jeder Seite durch einen einzigen Klick zu erreichen.
- Es gibt Bilder der Personen, die hinter der Website stehen.
- Die Website verwendet eine Form von „Social Proof“, zum Beispiel Testimonials.
- Hinweise zum Datenschutz sind vorhanden und leicht zu finden.
- Für Online Shops: im Checkout-Prozess sieht der User immer, wo er sich befindet.
- Für Online Shops: Versandkosten und Zusatzgebühren sind leicht sichtbar.
- Für Online Shops: der momentane Warenkorbwert ist immer sichtbar.
Texte
- Die Schrift ist linksbündig.
- Die Website verwendet eine weit-verbreitete, serifenlose Schriftart.
- Schriftgröße und Zeilenabstand machen es dem Besucher leicht, die Texte zu lesen.
- Texte sind klar gegliedert und leicht zu überfliegen.
- Textauszeichnungen (z.B. fett, kursiv, durchgestrichen) werden nur sehr sparsam eingesetzt.
- Die Abschnitts-Überschriften halten die HTML-Hierarchien (H1-H6) ein.
- Aufzählungen mit mehr als 3 Items sind als Liste mit Bullet-Points dargestellt.
- Die Website verwendet im CSS weitere Schriftarten als Fallback.
Bilder, Video, Audio
- Das Logo der Website ist auf den ersten Blick zu erkennen.
- Alle Icons sind eindeutig und klar zu erkennen.
- Die Social Media Icons haben die richtige Größe und sind klar zu erkennen.
- Die Bilder haben einen erkennbaren inhaltlichen Zusammenhang mit den Texten.
- Die Untertitel der Bilder, falls vorhanden, sind aussagekräftig.
- Alle Bilder haben aussagekräftige alt- und title-Attribute.
- Alle Produktbilder zeigen das aktuelle Modell und die relevanten Details.
- Die Bilder, Videos und Audios sind von hoher Qualität.
- Hintergrundbilder lenken nicht vom Haupt-Inhalt ab.
- Es gibt keine unbebilderten Produkte.
- Zu allen Audios und Videos bietet die Website eine Transkription.
- Zu allen Audios und Videos erfährt der Besucher die Dauer, bevor er sie startet.
- Audios und Videos starten niemals automatisch, sondern nur auf Wunsch des Besuchers.
Technik und Formulare
- Die Website verzichtet weitgehend auf Flash und Frames.
- Bei Downloads erfährt der Besucher vorab die Dateigröße, bevor er den Download startet.
- Alle Formulare sind klar beschriftet und nicht länger als nötig.
- Das aktuelle Formular-Feld wird optisch hervorgehoben.
- Die Formular-Felder sind groß genug für die gängigen Eingaben.
- Mit dem Tabulator können die User zum nächsten Formular-Feld springen.
- Die Formulare fragen keine unnötigen Daten ab.
- Der Besucher bekommt fehlerhafte Formular-Eingaben konkret angezeigt.
- Bei Google PageSpeed erreicht die Website mindestens 80 Punkte.
- Die Seite erscheint in den Browsern Internet Explorer, Firefox, Chrome, Safari und Opera richtig.
- Die Website setzt ein responsives Design ein.
- Die Website setzt nur in Ausnahmefällen, wenn überhaupt, Pop-Ups ein.
- Alle Links funktionieren.
- Links auf andere Websites öffnen sich in einem neuen Tab.
- Falls längere Wartezeiten nötig sind, bekommt der User darüber Informationen.
- Die Seite warnt die User, falls es einen Time-Out gibt, z.B. bei Formularen.
- Die Website hält individuelle Fehlerseiten bereit.
- Die Website hält alternative Stylesheets bereit, z.B. zum Ausdrucken.
- Die Suchfunktion, sofern vorhanden, liefert brauchbare Ergebnisse.