Kleine Innovationen, großer Nutzen – der Weg zur perfekten Usability

Neben protzigen Grafiken gibt es auch noch die Usability. Dieser Beitrag zeigt Webseiten, die durch kleine Innovationen benutzerfreundlicher werden.

  • von Lennart Prange

Webdesign entwickelt sich ständig weiter – an der einen Ecke sehe ich immer wieder unglaublich detaillierte und interessante Webdesigns, an der anderen entwickeln sich durch CSS 3 und HTML 5 ganz neue Möglichkeiten. Eins bleibt meistens aber auf der Strecke: Der Nutzer.

Zwar haben viele Webseiten mittlerweile eine anständige Usability, aber die etablierten Grundsätze und Methoden bleiben Verbesserungswürdig. Immer. Momentan scheinen sich viele Webdesigner aber nicht damit zu beschäftigen, wie sie das Erlebnis für die Nutzer durch Innovationen bei Navigationsstruktur und Informationsstruktur verbessern können. Stattdessen gibt es Logos aus CSS und immer aufwändigere grafische Effekte.

In diesem Artikel geht es um Webseiten, die weiterdenken und mit kleinen Innovationen glänzen.

Die Aufgabe eines Webdesigners

Ein guter Webdesigner macht Webseiten, die sich verkaufen und Nutzer anziehen. Aber er ist auch dafür zuständig, das Web weiterzuentwickeln und seinen Kunden immer neue Lösungen zu bieten, mit denen er sich von seiner Konkurrenz abhebt. Ich habe viele Webdesigner gesehen, die außergewöhnliche Fähigkeiten mit Photoshop haben und einen eigenen Stil entwickelt haben, der einen hohen Wiedererkennungswert besitzt. Letztendlich ist das aber meistens nichts, was Webdesign an sich wirklich weiterbringt.

In diesem Beitrag werdet ihr Seite sehen, die nicht mit Lichteffekten oder außergewöhnlichen Texturen protzen müssen. Stattdessen stellen sie Informationen ins Zentrum und arbeiten mit kleinen Innovationen um ihren Nutzern den Zugang zu ihnen möglichst einfach und angenehm zu machen.

Es geht hier um Ideen, die vielleicht nicht abseits des Mainstreams sind oder das Rad neu erfinden. Ganz im Gegenteil: Sie entwickeln Vorhandenes weiter, verbessern es. Alles funktioniert so intuitiv, dass kein Nutzer Probleme mit der Benutzung haben sollte. Der Besuch wird aber spürbar angenehmer.

Techi

http://www.techi.com/

Den Anfang macht techi.com. Auf den ersten Blick ist das eine schöne, solide Seite. Das Kastendesign mit ordentlich White Space finde ich persönlich sehr angenehm, aber natürlich nicht unbedingt sehr neu.

Es fällt aber sofort auf, das Techi darauf achtet, seinen Besuchern eine funktionierende und angenehme Oberfläche zu bieten. Einzelne Artikel sind mit Farben gekennzeichnet und können sehr leicht sortiert werden, die Artikel sind dank Zwischenüberschriften und annehmbarer Typographie gut lesbar, es werden viele Bilder benutzt usw.

Wenn man ein wenig mehr auf der Seite surft, findet man aber sehr schöne kleine Details.

1. Die Navigation

techi-navi

Techi verzichtet auf die Standard-Navigation am Anfang der Seite. Stattdessen werden die Kategorien in der Sidebar präsentiert. Das sieht mit den Icons nicht nur sehr gut aus, sondern ist auch schön gelöst. Klickt man nämlich auf eine Kategorie, lädt die Seite nicht komplett neu. Stattdessen werden in der Box die letzten Beiträge aus der Kategorie angezeigt. Sofort. Erst wenn man auf See all klickt muss man die Seite neu laden.

Das ist extrem nützlich und sehr angenehm. Wir kennen Ähnliches vielleicht von Tabs, in diesem Fall wurde das Ganze nur etwas weitergedacht.

2. Die Tags

techi-tags

Wenn man mit extrem vielen Tags arbeitet, kann es schon mal unübersichtlich werden. Um das Problem zu lösen, sortiert Techi seine Tags nach dem Alphabet. So fällt es mir als Nutzer wesentlich leichter die Tags zu finden, nach denen ich suche.

Fazit

Die Navigation und die Darstellung der Tags habe ich so noch nicht gesehen, trotzdem sind sie selbsterklärend und daher ohne Probleme zu benutzen. Außerdem ist es nicht nur einfach anders, sondern auch besser. Ein zentraler Punkt. Ich würde mich freuen, ähnliches häufiger zu sehen.

BuySellAds

http://buysellads.com/

Auf BuySellAds.com bieten viele renommierte Blogs ihre Werbeplätze an. Die Plattform ist extrem bekannt und kann sich deshalb auch ein exzellentes Design leisten.

1. Die Eingrenzungsmöglichkeit

buysellads-eingrenzung

Wer als Werbetreibender hier nach passenden Partnern sucht, hat mehrere tausend Seiten zur Auswahl. Naheliegend ist deshalb, dass eine Sortierfunktion geschaffen wurde, mit der man die potenziellen Partner stark eingrenzen kann. Es handelt sich dabei allerdings nicht um Drop-Down Menüs, die mir die Möglichkeit bieten, aus verschiedenen vorgegebenen Eingrenzungen zu wählen. Ich kann mit einem Scrollbalken selber sehr effektiv und einfach eingrenzen. Das ist hervorragend gelöst, zwar nicht mehr ganz neu aber trotzdem selten gesehen.

2. Die Liste

buysellads-liste

Klickt man oben auf Buy Ads bekommt man erst mal eine Liste, die alle möglichen Partner auflistet und nach Impressions sortiert ist. Nun kann ich nicht nur diese Sortierung ändern und zum Beispiel nach Preis sortieren. Diese Liste bietet mehr.

Klickt man auf einen Namen wird man nämlich nicht zu einer Unterseite weitergeleitet. Es klappt einfach ein “Fenster auf”, das mir die wichtigsten Infos anzeigt. Das verkürzt die Wartezeiten enorm und macht die Plattform sehr effektiv.

Reuters

http://www.reuters.com/

Reuters.com ist ein recht beeindruckendes News-Portal mit einem sehr frischen und innovativen Design. Das habe ich auch bereits hier besprochen. Aber Reuters glänzt nicht nur mit einem sehr übersichtlichen und aufgeräumten Design.

1. Markets, Sector immer im Blick

Reuters hat offensichtlich viele Besucher, die irgendetwas mit dem Finanzsektor zu tun haben. Und für diese Zielgruppe hält die Webseite deswegen auch ein sehr nützliches Feature bereit, das ich so noch nirgendwo gesehen habe.

Schon auf der Startseite hat man auf der rechten Seite die Möglichkeit, auf Markets zu klicken und so den Finanzbereich mit verschiedenen Charts und wichtigen Informationen zu öffnen. Das ganze funktioniert wieder ohne einen kompletten Reload der Seite. Man kann auch schnell zwischen News und dem Modul hin und her wechseln.

Wer nun noch etwas weiter surft, wird feststellen, dass sich dieses Modul auch anpasst. Wenn ich mich also im Energiesektor bewege, bekomme ich nicht mehr die allgemeinen Charts von Dax & Co. sondern Informationen zu diesem Sektor.

Weiterdenken

Drei Beispiele sind für meine Verhältnisse zwar ungewöhnlich wenig, aber ich da sie ausführlich besprochen wurden, sollte das reichen. Und es zeigt euch definitiv, worauf ich in diesem Beitrag hinauswill.

Eine außergewöhnliche Webseite zeichnet sich nicht nur durch extrem gutes Design und exzellente Programmierung aus. Usability ist ein enorm wichtiger Faktor bei der Bewertung von Internetseiten und die Spitze ist einfach nie erreicht. Deshalb muss man etablierte Standards immer wieder überdenken, sie weiterentwickeln. Nur so kann man sich weiterentwickeln und bessere Webseiten erstellen.

Die obigen Beispiele zeigen nicht nur ein ansehnliches, schlichtes Design, sondern eben auch kleine Innovationen, die sie einzigartig machen und meiner Meinung nach auch benutzerfreundlicher.

Techi.com zeigt, wie man die richtigen Ideen bekommt: Versetzt euch in die Besucher hinein. Warum klickt man wohl auf eine Kategorie? Natürlich um mehr Beiträge aus dieser Kategorie zu sehen. Ist es dafür nötig, die komplette Webseite neu zu laden? Nein.

Die Navigation von ANidea zeigt einen ähnlichen Ansatz und ist genauso eine Weiterentwicklung. Das Rad wurde nicht neu erfunden, aber runder gemacht.

Weitere Beispiele?

Ich würde mich über weitere Beispiele von eurer Seite sehr freuen. Vielleicht wollt ihr ja auch eure Meinung zu meinen Ausführungen los werden. Das interessiert mich wie immer brennend. Ich freue mich auf Kommentare, Retweets und natürlich über jeden Besucher. Vielen Dank fürs Lesen 🙂

9 Kommentare

  1. Chrissy
    21. Oktober 2010 um 12:13 Uhr

    Ich muss ehrlich sagen, dass ich eigentlich schon lang keine Webseite mehr gesehen hab, auf der ich mich nicht zurecht gefunden hab.

    • Lennart Prange
      21. Oktober 2010 um 12:30 Uhr

      Das geht mir auch so. Aber wir sind ja auch geübt im Umgang mit Webseiten und finden deswegen wahrscheinlich einfacher zu den gewünschten Informationen.

      Letztendlich geht es in diesem Beitrag ja auch nicht darum, Informationen zugänglich zu machen, sondern sie noch zugänglicher zu machen. Kleiner aber feiner Unterschied 🙂

      • Chrissy
        21. Oktober 2010 um 13:13 Uhr

        Das ist natürlich dann, ja. Schwierig?
        Ist es so enorm wichtig die Informationen noch zugänglicher zu machen?

      • Lennart Prange
        21. Oktober 2010 um 13:36 Uhr

        Enorm wichtig? Nein. Für außergewöhnliche Webseiten – wie im Artikel erwähnt – aber schon. Wenn sich Webdesign weiterentwickeln soll auch.

        Es kommt auch auf die eigene Einstellung an. Will man eine solide Webseite erstellen, was völlig in Ordnung ist, muss man sich darum keine Gedanken machen. Die Nutzer finden sich zurecht und sind zufrieden, wenn die etablierten Standards verwendet werden. Aber wer sagt, dass sie nicht noch zufriedener sein können?

  2. Thomas Klose
    21. Oktober 2010 um 14:00 Uhr

    Danke für den klasse Beitrag.

    Ich habe mir vor Jahren mal das Buch „Missing Links: Über gutes Webdesign“ (http://www.amazon.de/Missing-Links-%C3%9Cber-gutes-Webdesign/dp/3446225544) gekauft und hatte beim Lesen einige Aha-Effekte.

    mfg,
    Thomas

  3. Pascal
    21. Oktober 2010 um 23:56 Uhr

    Über die Vorschläge in diesem Blogbeitrag freuen sich sicherlich all die User mit deaktiviertem JavaScript.

  4. Alexander
    29. Oktober 2010 um 19:14 Uhr

    Ich finde es sehr interessant, dass du interessante Link präsentierst; wenn sie auch manchmal eher unnütz sind.

    Hier zum Beispiel möchte ich auf Techi: Beispiel 2:Tags verweisen. Die Idee ist neu, die Idee ist gut -aber ich glaube sie würde nicht genutzt werden. Wenige Nutzer wissen überhaupt, dass es Tags gibt und das man da drauf klicken kann. In den allermeisten Fällen sind Tags nur für Google gut. (interne Verlinkung und sowas)

    Eine Alphabetische Sortierung fände insofern nur bei einer Art Lexika Verwendung. Bei einem Blog, Newsseite oder Gar normaler Page (falls mit Tags) finde ich es eher überflüssig; ich persönliche klicke so gut wie nie auf Tags. (Ausser: Tags = Kategorie! Wie zB es bei Nicht-Wordpress Blogs der Fall ist)

    Nun kurz zu den anderen Seiten, die allesamt gute Ideen haben, aber nicht wirklich gut umgesetzt sind:
    Bei Reuters sind die Markets zu klein – Ich würde sie für Werbung halten!
    BuySellAds setzt mir zu viel Auf Ajax. Ich bin kein Fan zu viel JavaScript! Ansonsten denke ich, der Standart-Amazon-Besucher würde bei einer solchen Suchmöglichkeit überfordert – er ist es einfach anders gewöhnt. An dieser Stelle aber ist durchaus eine andere Zielgruppe gefragt (die die ein bisschen mehr Ahnung von Internet haben, als eine 80jährige) deswegen ist es Ihnen zuzutrauen, dass zu schaffen; und bei einer breiteren Verbreitung in der Lage sind es anderen zu erklären.

Trackbacks/Pingbacks