Commit 68006f93 authored by Hendrik Kahlen's avatar Hendrik Kahlen
Browse files

usability im Wandel aktulaisiert

parent 72401b12
......@@ -6,54 +6,40 @@ category: usability
author: Hendrik Kahlen
---
Ist die Usability von heute noch die gleiche wie vor 5 Jahren? –kurz „Nein“! Die Gründe dafür liegen überweigend in gestiegenen Nutzererwartungen und –Erfahrungen. In diesem Artikel soll daher einmal ein genauerer Blick auf den Wandel in der Usability geworfen werden. Wem noch die [Normen und Konventionen] der Usability noch nicht bekannt sind, der werfe einen Blick auf unsere Unterrubrik.
Ist die Usability von heute noch die gleiche wie vor 5 Jahren? –kurz „Nein“! Die Gründe dafür liegen überweigend in gestiegenen Nutzererwartungen und –Erfahrungen. In diesem Artikel soll daher einmal ein genauerer Blick auf den Wandel in der Usability geworfen werden. Wem die [Normen und Konventionen] der Usability noch nicht bekannt sind, der werfe an dieser Stelle zunächst einen Blick auf unsere Unterrubrik.
### Gründe für Usability-Änderungen
<img style="float: right;" src="http://www.usability.ch/fileadmin/Dateien/images/2007/changing-guidelines-pie.gif" alt ="Usability Änderungen"/>
Die Gründe für die Änderungen sind vielfältig, konzentrieren sich aber auf die technischen Veränderungen (Innovationen), dem Verändertem User-Verhalten und der weniger starken Nutzung von verbotenen Design-Elementen. Mit technischen Veränderungen ist hier gemeint, dass sich Browser, Leistung, usw. immer weiter verbessern, weshalb andere Design-Elemente möglich sind. Gleichzeitig ändert sich mit der Zeit das User-Verhalten, beispielsweise, weil eine beliebte Webseite ein Grundmuster für die Navigiation in die Köpfe der Masse gelegt hat (z.B. Google). Die weniger starke Nutzung von verbotenen Desigin-Elementen hat zur Folge, dass z.B. Pop-Ups nicht unbedingt "immer" verboten gehören, eben bei weniger starken Nutzung und nicht der exzessiven wie sie bei [Die schlimmsten Usability-Fehler] beschrieben wurde. Nachfolgende Grafik verdeutlicht dabei einmal den Anteil der ebene aufgeführten Gründe, an dem Wandel in der Usability (von 1990er bis 2007):<sup>1</sup>
> ![Usability Änderungen](http://www.usability.ch/fileadmin/Dateien/images/2007/changing-guidelines-pie.gif)
### Was hat sich geändert? - Neue und alte Usability Regeln
Die Nutzung von Flash-Inhalten oder Webseiten die auf das flash-Plugin angewiesen ist heute nach Usability-Richtlinien nicht mehr gern gesehen. Das liegt vor allem daran, dass flash-Plugins sicherheitskritisch sind, auf Apple-Geräten nicht funktionieren und man das Plugin exta installiert haben muss, die Webseite also nicht für jeden funktioniert. 2000 war dies aber noch anders, da es damals keine vergleichbaren alternativen für schnelle Animationen auf meist noch statischen Webseiten gab. Mit HTML-5 gibt es aber schnellere und ohne Plugin funktionierende Alternativen, weshalb Flash-Nutzung heutzutage auch verpöhnt. Auch aber wurde der Gebraucht von Flash-Teilweise auf schlechte Weise stark übertrieben, wie dies von [orrfelt.com](http://orrfelt.com/) gut illustriert wird. Wer mag kann diese Seite auch einmal auf dem Smartphone aufrufen. <sup>1</sup>
Auch haben sich die Positionen von Design-Elementen, Bedienelementen oder Content im Laufe der Jahre verändert, bzw. nähern diese sich einem Grenzmuster an. Mit Bezug auf [Einschränkungen der Werbung durch Usability] ist es interessant zu sehen, wie sich die Erwartungen über die Position von Werbung auf dem Webseite-Raster vom Kopf der Seite (2003) hinzu der rechten Seite (2009) der Webseite bewegt haben.
> ![Werbeposition](http://www.eresult.de/fileadmin/Bilder/forschungsbeitraege/Suchfunktion_2003bis2009.jpg)
Ähnlich sieht es bei der Suchfunktion aus. Bemerkenswert hierbei ist, dass die Erwartung einer Suchfunktion zurück geht, was wohl an der schnelleren Suche über Google oder die meist nur einmaligen Besuche liegt (ausgenommen sind Online-Shops). Die Position einer Suchfunktion von 2003-2009 wurde fast ausnahmslos in der oberen rechten Hälfte erwartet.<sup>2</sup>
<img style="float: right;" src="http://www.eresult.de/fileadmin/Bilder/forschungsbeitraege/Werbung_2003_bis_2009_links.jpg" alt ="Werbeposition"/>
Die Nutzung von Flash-Inhalten oder Webseiten die auf das flash-Plugin angewiesensind, ist heute nach Usability-Richtlinien kritisch angesehen. Das liegt vor allem daran, dass Flash-Plugins sicherheitskritisch sind, auf Apple-Geräten nicht funktionieren und eine explizite Installation erforderlich ist, die Webseite also ohne das Plugin nicht (komplett) funktioniert. Im Jahr 2000 war dies aber noch anders, da es damals keine vergleichbaren Alternativen für schnelle Animationen auf meist noch statischen Webseiten gab. Mit HTML-5 gibt es aber z.B. eine solche Alternative, weshalb Flash-Nutzung heutzutage auch nicht Usability-konform ist. Eine gute Illustration eines (auf schlechte Weise) übertriebenen Gebrauchs von Flash findet sich auf [orrfelt.com](http://orrfelt.com/).<sup>1</sup>
> ![Suchfunktionposition](http://www.eresult.de/fileadmin/Bilder/forschungsbeitraege/Werbung_2003_bis_2009_links.jpg)
Auch haben sich die Positionen von Design-, Bedienelementen oder des eigentlichen Contents im Laufe der Jahre verändert, bzw. nähern diese sich einem Grenzmuster an. Mit Bezug auf [Einschränkungen der Werbung durch Usability] ist es interessant zu sehen, wie sich die Erwartungen über die Position von Werbung auf dem Webseite-Raster vom Kopf der Seite (2003) hinzu der rechten Seite (2009) der Webseite bewegt haben.
Ein ähnlicher Wandel lässt sich bei der Suchfunktion feststellen, wobei hier noch zusätzlich bemerkenswert ist, dass die Erwartung einer Suchfunktion zurück geht. Ein Grund dafür könnte in der schnelleren Suche über Google und in den meist nur einmaligen Besuchen liegen (ausgenommen sind Online-Shops). Die Position einer Suchfunktion von 2003-2009 wurde fast ausnahmslos in der oberen rechten Hälfte erwartet.<sup>2</sup>
### Usability der Zukunft - eine Voraussage
Es gibt mehrere Usability-Design-Trends in 2016, einige davon waren auch schon in 2015 stark vertreten und werden auch noch weiterhin stark an Bedeutung gewinnen. Unter anderem ist dies das Responive Web Design. Mit zahlreichen und mehr oder weniger verschiedenen Browsern und Endgeräten, wie etwa die Smartphones und Tablets, braucht es für diese Unterschiedlichen Umgebungen das passende Design mit anderen Größenordnungen, Struktur und Bedienelementen. Damit nicht für jede Umgebung eine eigene Version der Webseite erstellt werden muss, wird die Webseite responsive entwickelt, d.h. eine Webseite für alle Plattformen mit anderen Layouts.<sup>3</sup>
> ![Responsive Web Design](https://think360studio.com/wp-content/uploads/2015/07/responisve-website-design-2016.png)
<img style="float: right; width: 30%" src="https://think360studio.com/wp-content/uploads/2015/07/responisve-website-design-2016.png" alt ="Responsive Web Design"/>
Es gibt mehrere Usability-Design-Trends in 2016, einige davon waren auch schon in 2015 stark vertreten und werden auch noch weiterhin stark an Bedeutung gewinnen. Unter anderem ist dies das Responive Web Design. Mit zahlreichen und mehr oder weniger verschiedenen Browsern und Endgeräten, wie etwa die Smartphones, Tablets und Laptops, braucht es für diese Unterschiedlichen Umgebungen das passende Design mit anderen Größenordnungen, Struktur und Bedienelementen. Damit nicht für jede Umgebung eine eigene Version der Webseite erstellt werden muss, wird die Webseite "responsive" ( engl, für reagierend) entwickelt, d.h. eine Webseite für alle Plattformen mit anderen Layouts.<sup>3</sup>
Bemerkenswert hierbei auch, dass Google nach Responsive Design filtert und für mobile Endgeräte die Seite benachteiligt, wenn sie durch den Test fallen. Google bietet zu diesem [Resppnsive Design Test] ein Tool.
Ein weiterer Trend sind die Card Style Layouts, womit sich sehr schnell und übersichtlich viel Content organisieren lässt. Dazu werden Bilder genutzt, die zum Thema des Contents passen, bzw. diesen bestmöglich zusammenfassen. Eine solches Card-Style-Layout findet sich auf unserer [Home Page]:<sup>4</sup>
Bemerkenswert ist hierbei auch, dass Google nach Responsive Design filtert und für mobile Endgeräte die Webseite benachteiligt, wenn sie durch den Test fallen. Google bietet zu diesem [Resppnsive Design Test] ein Tool, mittels derer man seine Webseite auf Googles Konventionsanforderungen prüfen kann.
Ein weiterer Trend sind die Card Style Layouts, womit sich sehr schnell und übersichtlich viel Content organisieren lässt. Dazu werden Bilder genutzt, die zum Thema des Contents passen, bzw. diesen bestmöglich zusammenfassen. Eine solches Card-Style-Layout findet sich auf unserer [Home Page], auch wenn damit nicht die Kategorien organisiert sind:<sup>4</sup>
<style>
#outerdiv {position: relative; width: 100%;
}
#innerdiv {
position: relative;
}
</style>
<div id="outerdiv">
<div id="innerdiv">
<iframe width="945" height="500px" src="http://www.informatik.uni-oldenburg.de/~iug15/ew/#portfolio" scrolling="no" frameborder="0"></iframe>
</div>
</div>
{% include members.html %}
Der mit am sapnnendste Design-Trend ist aber wohl das Story-Telling. Man überlege sich hierbei, wie wichtig Content für Webseites ist, aber lange Texte zu lesen meist sehr mühsam ist, wenn dieser nicht auf visuell aufbereit ist. Mit Story-Telling gibt es die Möglichkeit dem User mit auf eine Story-Reise zu nehmen, indes ihm mit kleinen Texten und zum diesen Texten passenden, erklärenden und beeindruckenden Bildern und Videos die Story erzählt wird. Der Hauptvorteil dabei ist, dass durch die Bilder und Videos die Aufmerksamkeit des Lesers nicht verloren geht. Vor allem geht mit den Bildern und Videos ein zum Content passender Hintergrund einher, was eine Forderung der Usability-Konventionen ist.
Zu beachten ist an dieser Stelle natürlich, dass die gewählten Bilder zu den erwarteten Content der Kategorie passen müssen.
Der spannendste Design-Trend ist aber wohl der des Story-Telling. Man überlege sich hierbei, wie wichtig Content für Webseiten ist. Folgt dieser Content als langer Text, der nicht auf passende Weise visuell aufbereit ist, so ist das lesen sehr mühselig. Mit Story-Telling gibt es die Möglichkeit dem User mit auf eine Story-Reise zu nehmen, indes ihm mit kleinen Texten und zum diesen Texten passenden und erklärenden Bildern und Videos die Story erzählt wird. Der Hauptvorteil dabei ist, dass durch die teils starken Bilder und Videos die Aufmerksamkeit des Lesers nicht verloren geht. Vor allem geht mit den Bildern und Videos ein zum Content passender Hintergrund einher, was eine Forderung der Usability-Konventionen ist.
Auch werden Texte so interaktiver, d.h. der Nutzer steuert interaktiv die Geschichte durch scrollen oder Mausbewegungen/Touchbewegungen<sup>5</sup>
Eine schöne Verdeutlichung von Story Telling bietet [story.glass](http://story.glass/), wo Story Telling noch einmal erklärt wird.
### Fazit
Gründe für den Wandel von Usability-Konventionen sind vielfältig. Im Zuge der technischen Möglichkeiten wird es auch zukünftig immer mehrere Möglichkeiten geben Web-Designs umzusetzen. Dabei wird es, wie in diesem Artikel beschrieben einige geben, die zukünftig nicht mehr Usability gerecht sind oder in anderer Gestalt auftauchen. Die Usability wird immer einen Wandel unterstellt sein, aber heutige Web-Designer sind gut aufgestellt, wenn Sie aktuelle Trends im Auge behalten und diese usability-konform umsetzen.
Die Vielfältigkeit der Gründe für den Wandel von Usability-Konventionen wurde nun kurz angerissen. Im Zuge der technischen Möglichkeiten wird es auch zukünftig immer mehrere Möglichkeiten geben Web-Designs umzusetzen, von den einige zukünftig nicht mehr Usability-gerecht sein könnten oder in anderer Gestalt auftauchen. Die Usability wird immer einen Wandel unterstellt sein, aber heutige Web-Designer sind gut aufgestellt, wenn Sie aktuelle Trends im Auge behalten und diese usability-konform umsetzen.
<hr id="sources">
#### Quellen
<hr id="sources">
<small>
<sup>1</sup> Jakob Nielsen (2007), deutsche Übersetzung [Veränderungen oder Stabilität bei Web-Usability-Richtlinien](http://www.usability.ch/news/veraenderung-oder-stabilitaet-bei-web-usability-richtlinien.html). Abgerufen: 23.11.2015.
</small><br>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment