Commit 5866a2c2 authored by Adrian Jagusch's avatar Adrian Jagusch
Browse files

Merge branch 'master' of gitlab.uni-oldenburg.de:erwartungskonforme-webseiten/website

parents 9054a312 a3bc4165
......@@ -6,27 +6,27 @@ category: usability
author: Martin Sonntag
---
Um die Benutzerfreundlichkeit einer Internetseite zu überprüfen, gibt es viele verschiedene Testmethoden. Diese können einfache und professionell durchgeführte Tests sein. Die Anzahl der Werkzeuge zur Überprüfung von Usability ist groß, wobei je nach bestimmter Situation, Fragestellung oder auch Zielgruppe verschiedenste Techniken zum Einsatz kommen können.<!--more--> Im Folgenden wird ein kleiner Überblick gegeben, was für gängige Methoden eingesetzt werden können.<sup>1</sup>
Um die Benutzerfreundlichkeit einer Internetseite zu überprüfen, gibt es viele verschiedene Testmethoden. Diese können einfache und professionell durchgeführte Tests sein. Die Anzahl der Werkzeuge zur Überprüfung von "Usability" ist groß, wobei je nach bestimmter Situation, Fragestellung oder auch Zielgruppe verschiedenste Techniken zum Einsatz kommen können.<!--more--> Im Folgenden wird ein kleiner Überblick gegeben, was für gängige Methoden eingesetzt werden können.<sup>1</sup>
### Beobachtung von Personen
Eine leicht durchführbare Methode ist die persönliche Beobachtung von Testpersonen. Dabei werden den Probanden bestimmte Aufgaben zugeteilt, wie z.B. die Suche nach Produktinformationen auf ihrer Webseite oder eine Angebotsanfrage. Durch Beobachtung der Testpersonen bei dieser Aufgabe, wird erkannt, wie gut diese auf der Webseite zurechtkommen, wo Probleme auftreten können und ob die jeweilige Aufgabe gut gelöst werden kann. So sollten nur Testpersonen eingesetzt werden, die die Internetseite noch nicht kennen, um das Ergebnis nicht zu verfälschen. Nach dem der Test durchgeführt worden ist, kann von den Probanden noch ein Feedback eingeholt werden, welches zusammen mit den Erkenntnissen aus der Beobachtung zur Verbesserung der Webseite genutzt werden kann.<sup>1</sup>
Eine leicht durchführbare Methode ist die persönliche Beobachtung von Testpersonen. Dabei werden den Probanden bestimmte Aufgaben zugeteilt, wie zum Beispiel die Suche nach Produktinformationen auf ihrer Webseite oder eine Angebotsanfrage. Durch Beobachtung der Testpersonen bei dieser Aufgabe, wird erkannt, wie gut diese auf der Webseite zurechtkommen, wo Probleme auftreten können und ob die jeweilige Aufgabe gut gelöst werden kann. So sollten nur Testpersonen eingesetzt werden, die die Internetseite noch nicht kennen, um das Ergebnis nicht zu verfälschen. Nach dem der Test durchgeführt worden ist, kann von den Probanden noch ein Feedback eingeholt werden, welches zusammen mit den Erkenntnissen aus der Beobachtung zur Verbesserung der Webseite genutzt werden kann.<sup>1</sup>
### Onsite-Befragung
Eine Onsite-Befragung gehört zur Familie der Online-Befragungen und dient dazu in kürzester Zeit Feedback von vielen Benutzern einer Webseite zu generieren. Der Fragebogen wird dabei direkt auf der Internetseite eingebunden. Die Anwender werden meist über ein Popup oder einem Layer zur Teilnahme der Befragung eingeladen, wobei diese eigenständig entscheiden können, ob sie an der Befragung teilnehmen möchten.<sup>2</sup>
Eine Onsite-Befragung gehört zur Familie der Online-Befragungen und dient dazu in kürzester Zeit Feedback von vielen Benutzern einer Webseite zu generieren. Der Fragebogen wird dabei direkt auf der Internetseite eingebunden. Die Anwender werden meist über ein Popup oder einen Layer zur Teilnahme der Befragung eingeladen, wobei diese eigenständig entscheiden können, ob sie an der Befragung teilnehmen möchten.<sup>2</sup>
Durch eine Onsite-Befragung lässt sich unter anderem herausfinden:<br>
- Was für Inhalte dem Nutzer wichtig sind, <br>
- wie zufrieden er mit der Internetseite ist,<br>
- ob es Verbesserungsvorschläge für die Internetseite gibt, <br>
- welche Möglichkeiten der Benutzer vermisst und <br>
- was für Eigenschaften die Teilnehmer der Befragung besitzen.<sup>3</sup>
- Ob es Verbesserungsvorschläge für die Internetseite gibt, <br>
- Welche Möglichkeiten der Benutzer vermisst und <br>
- Was für Eigenschaften die Teilnehmer der Befragung besitzen.<sup>3</sup>
Vorteile der Onsite-Befragung sind dabei, dass echte Nutzer der Website angesprochen werden, die Methode sich regelmäßig durchführen lässt, um neue Erkenntnisse zu erlangen und zudem sich der Erfolg einer Webseite so gut messen lässt.<sup>3</sup>
Eine Grundvoraussetzung für fundierte Ergebnisse sind möglichst hohe Teilnehmerzahlen der Befragung. Dieser Punkt stellt eine Schwachstelle der Onsite-Befragung dar, denn die Teilnehmerzahlen liegen meist im einstelligen Prozentbereich. Dies kann z.B. daran liegen, dass die falsche Zielgruppe erreicht wird oder die Befragungen meist als störend angesehen und einfach weggeklickt werden.<sup>4</sup>
Eine Grundvoraussetzung für fundierte Ergebnisse sind möglichst hohe Teilnehmerzahlen der Befragung. Dieser Punkt stellt eine Schwachstelle der Onsite-Befragung dar, denn die Teilnehmerzahlen liegen meist im einstelligen Prozentbereich. Dies kann zum Beispiel daran liegen, dass die falsche Zielgruppe erreicht wird oder die Befragungen meist als störend angesehen und einfach weggeklickt werden.<sup>4</sup>
### Eye-Tracking
Eye-Tracking (Blickbewegungsmessung) ist eine professionelle Methode, um die Usability einer Website zu messen. Hierbei wird der Blickverlauf eines Benutzers sichtbar gemacht. Dies geschieht durch eine Infrarottechnik, die in einem Monitor verbaut ist und das Gesicht des Nutzers mit nicht gefährlichen Infrarotstrahlen abtastet. Zeitgleich wird er Nutzer von einer Augenkamera gefilmt, wodurch z.B. Augenbewegungen, Blickverläufe und Gesichtsmimik erfasst werden können.<sup>5, 6</sup>
Eye-Tracking (Blickbewegungsmessung) ist eine professionelle Methode, um die Usability einer Website zu messen. Hierbei wird der Blickverlauf eines Benutzers sichtbar gemacht. Dies geschieht durch eine Infrarottechnik, die in einem Monitor verbaut ist und das Gesicht des Nutzers mit nicht gefährlichen Infrarotstrahlen abtastet. Zeitgleich wird der Nutzer von einer Augenkamera gefilmt, wodurch beispielsweise Augenbewegungen, Blickverläufe und Gesichtsmimik erfasst werden können.<sup>5, 6</sup>
Durch Eye-Tracking kann erkannt werden, welche Stellen einer Website die Aufmerksamkeit eines Nutzers anregen und welche Elemente einer Website Blickfänger sind. Zudem ist einsehbar, welche Informationen einer Internetseite betrachtet oder auch wirklich gelesen werden. Ebenso wird die Reihenfolge, in welcher der Benutzer die Elemente einer Seite erfasst, aufgezeichnet.<sup>6</sup>
......@@ -36,15 +36,15 @@ Die Ergebnisse dieser Methode können in unterschiedlicher Weise visualisiert we
Heatmaps zeigen, welche Bereiche einer Webseite häufig und lange betrachtet wurden. Dabei werden Elemente, die am häufigsten und am längsten betrachtet wurden, wie bei einer Wärmebildkamera, rot angezeigt. Weniger relevante Elemente werden grün dargestellt.<sup>5, 7</sup>
**Gaze Opacity:**<br>
Hier werden alle nicht betrachteten Teile einer Webseite schwarz eingefärbt. Nur Bereiche, die die Benutzer häufig angesehen haben werden nicht eingeschwärzt. Je mehr solcher Einschwärzungen (enstanden aus den Testergebnissen) aufeinander gelegt werden, umso weniger sind helle Bereiche vorhanden und umso deutlicher wird das Testergebnis.<sup>5, 7</sup>
Hier werden alle nicht betrachteten Teile einer Webseite schwarz eingefärbt. Nur Bereiche, die die Benutzer häufig angesehen haben werden nicht eingefärbt. Je mehr solcher Einschwärzungen (enstanden aus den Testergebnissen) aufeinander gelegt werden, umso weniger sind helle Bereiche vorhanden und umso deutlicher wird das Testergebnis.<sup>5, 7</sup>
**Gaze Plot:** <br>
Gaze Plots zeigen den ganzen Blickverlauf einer Testperson. Visuell werden die Reihenfolge, Dauer und Sakkaden (schnelle und sprunghafte Blickbewegung) durch Kreise (Fixpunkte) und Linien (Blickbewegungen) dargestellt. Umso größer ein Kreis ist, desto größer ist die Dauer dieser Betrachtung. Durch die Nummerierung der Kreise ist es zudem möglich zu erkennen, welche Bereiche der Webseite, einem Nutzer als erstes aufgefallen sind.<sup>5, 7</sup>
### Card Sorting
Die Informationsstruktur einer Webseite ist ein wichtiger Faktor. Die ideale Methode, um eine benutzerfreundliche Navigationsstruktur zu entwickeln, ist Card Sorting. Bei diesem Verfahren werden Kategorien und Inhalte eines Systems auf Karten geschrieben. Die Teilnehmer fassen dabei die Begriffe in thematisch zusammengehörige Gruppen zusammen, wodurch sich z. B. Oberpunkte einer Menüstruktur erarbeiten lassen. Durch das Card Sorting ist es auch möglich Begriffe zu erkennen, die sich nicht so leicht in einen Kategorie packen lassen oder missverständlich sind. Card Sorting lässt sich online (tool-basiert) oder offline (mit Karten) durchführen. Online können größere Nutzergruppen teilnehmen, wohingegen offline in der Gruppe Argumente besser erfasst und diskutiert werden können.<sup>8, 9</sup>
Die Informationsstruktur einer Webseite ist ein wichtiger Faktor. Die ideale Methode, um eine benutzerfreundliche Navigationsstruktur zu entwickeln, ist Card Sorting. Bei diesem Verfahren werden Kategorien und Inhalte eines Systems auf Karten geschrieben. Die Teilnehmer fassen dabei die Begriffe in thematisch zusammengehörige Gruppen zusammen, wodurch sich zum Beispiel Oberpunkte einer Menüstruktur erarbeiten lassen. Durch das Card Sorting ist es auch möglich Begriffe zu erkennen, die sich nicht so leicht in einen Kategorie einfügen lassen oder missverständlich sind. Card Sorting lässt sich online (tool-basiert) oder offline (mit Karten) durchführen. Online können größere Nutzergruppen teilnehmen, wohingegen offline in der Gruppe Argumente besser erfasst und diskutiert werden können.<sup>8, 9</sup>
Generell lässt sich das Card Sorting in zwei Ansätzen unterscheiden:<br>
Generell lässt sich das Card Sorting in zwei Ansätzen unterteilen:<br>
**Geschlossenes Card Sorting:**<br>
Die Teilnehmer sortieren die Karten in schon vorgegebene Kategorien ein. Dadurch werden Inhalte erkannt, die nicht zugeordnet werden können.<sup>10</sup>
<br>
......@@ -52,7 +52,7 @@ Die Teilnehmer sortieren die Karten in schon vorgegebene Kategorien ein. Dadurch
Im Gegensatz zum geschlossenen Card Sorting erstellen hier die Teilnehmer die Kategoriebezeichnungen. Das Offene Card Sorting zeigt, wie die Karten aus der Sicht der Teilnehmer logisch zusammengesetzt werden sollten.<sup>10</sup>
### Fazit
Usability-Testmethoden können hilfreiche Werkzeuge sein, um eine Seite auf ihre Nutzerfreundlichkeit oder Fehler zu testen. Es gibt eine Vielzahl an Methoden und jede besitzt bestimmte Schwächen und Stärken. Somit ist die Auswahl des passenden Werkzeuges wichtig, denn nicht jede Testmethode lässt sich immer anwenden. Es kommt z.B. darauf an, was ich testen möchte, wie viel Zeit ich für die Methode habe oder ob mir Testpersonen/technische Hilfsmittel zur Verfügung stehen. Denn nur so kommt ein vernünftiges Ergebnis oder Feedback zustande, um die Webseite zu verbessern.
Usability-Testmethoden können hilfreiche Werkzeuge sein, um eine Seite auf ihre Nutzerfreundlichkeit oder Fehler zu testen. Es gibt eine Vielzahl an Methoden und jede besitzt bestimmte Schwächen und Stärken. Somit ist die Auswahl des passenden Werkzeuges wichtig, denn nicht jede Testmethode lässt sich immer anwenden. Es kommt beispielsweise darauf an, was getestet wird, wie viel Zeit man für die Methode hat oder ob Testpersonen/technische Hilfsmittel zur Verfügung stehen. Denn nur so kommt ein vernünftiges Ergebnis oder Feedback zustande, um die Webseite zu verbessern.
<hr id="sources">
#### Quellen
......
......@@ -21,15 +21,15 @@ Die Richtlinien sind gegliedert in 4 Bereiche, welche mehrere Regeln beinhalten:
Im folgenden sind die Regeln kurz erläutert:
Im Folgenden sind die Regeln kurz erläutert:
#### Richtlinien bezüglich Wahrnehmbarkeit
+ Nicht-Text-Inhalte, wie beispielsweise Bilder sollten ebenfalls als Text-Inhalte, zum Beispiel einer Beschreibung, verfügbar sein.
+ Für Zeitbasierte Medien, wie Ton- und Videoaufnahmen, sollten Alternativen zur Verfügung gestellt werden.
+ Nicht textbasierte multimediale Inhalte, wie beispielsweise Bilder sollten ebenfalls textuell, zum Beispiel in Form einer Beschreibung, verfügbar sein.
+ Für zeitbasierte Medien, wie Ton- und Videoaufnahmen, sollten Alternativen zur Verfügung gestellt werden.
+ Inhalte sollten auf verschiedene Weise darstellbar sein, ohne dass Informationen verloren gehen.
+ Inhalte sollten leicht erkennbar und hörbar sein, z.B. muss auf Kontraste geachtet werden und die Schriftgröße anpassbar sein.
+ Inhalte sollten leicht erkenn und hörbar sein, zum Beispiel muss auf Kontraste geachtet werden und die Schriftgröße anpassbar sein.
......@@ -37,7 +37,7 @@ Im folgenden sind die Regeln kurz erläutert:
+ Alle Funktionen der Webseite sollten per Tastatur zugänglich sein.
+ Den Benutzern muss ausreichend Zeit zum Lesen und Benutzen der Inhalte gegeben werden.
+ Auf anfallauslösende Inhalte sollte verzichtet werden (z.B. bei Epilepsie).
+ Auf anfallauslösende Inhalte sollte verzichtet werden (z.B. wegen Krankheiten wie Epilepsie).
+ Dem Benutzer sollten Mittel zur Verfügung gestellt werden, die ihm die Navigation auf der Webseite ermöglichen und ihn wissen lassen, wo er sich auf der Webseite befindet.
......@@ -63,7 +63,7 @@ Ob eine Seite konform zu den WCAG 2.0 ist, wird anhand von 5 Kriterien entschied
1. Konformitätsstufe: Es gibt drei Konformitätsstufen: A, AA und AAA. Diese sind abhängig davon, mit welcher Güte die Regeln umgesetzt wurden.
2. Die Konformität muss auf der ganzen Seite bestehen.
3. Ist eine Webseite Teil einer Folge von Webseiten ist, die einen Prozess darstellen, so muss die Konformität auf jeder dieser Webseiten gegeben sein.
3. Ist eine Webseite Teil einer Folge von Webseiten, die einen Prozess darstellen, so muss die Konformität auf jeder dieser Webseiten gegeben sein.
4. Informationen und Funktionalitäten, die nicht barrierefrei sind, müssen auch als barrrierefreie Alternative angeboten werden, die auch für Assistenzsysteme verständlich ist.
5. Wenn Techniken benutzt werden, die nicht barrierefrei sind, stören diese nicht den Zugriff auf den Rest der Webseite. Wenn ein Benutzer beispielsweise ungewollt ein Video startet, sollte er trotzdem auf den Rest der Seite zugreifen können
......
......@@ -14,7 +14,7 @@ Usability spielt eine wichtige Rolle, wenn es darum geht, Besucher auf eine Webs
### Auswahl von Schrift und Design
Die richtige Schrift und das richtige Design, spielen eine große Rolle für die Benutzerfreundlichkeit und Barrierefreiheit einer Seite. Das Design sollte so gewählt sein, dass der relevante Inhalt der Webseite im Vordergrund steht. Überschriften sollten auf Webseiten deutlich hervorgehoben, zum Beispiel durch größere, unterstrichene oder fettgedruckte Buchstaben, da Überschriften dem Benutzer bei der Navigation helfen. <sup>3</sup>
Die richtige Schrift und das richtige Design, spielen eine große Rolle für die Benutzerfreundlichkeit sowie Barrierefreiheit einer Seite. Das Design sollte so gewählt sein, dass der relevante Inhalt der Webseite im Vordergrund steht. Überschriften sollten auf Webseiten deutlich hervorgehoben werden, zum Beispiel durch größere, unterstrichene oder fettgedruckte Buchstaben, da Überschriften dem Benutzer bei der Navigation helfen. <sup>3</sup>
Auch die Auswahl der richtigen Farben spielt eine große Rolle, da sie entscheidend für die Lesbarkeit eines Textes sind, deshalb sollte ein Kontrast zwischen Text und Hintergrund sein. Gelbe Schrift auf weißem Hintergrund lässt sich beispielsweise schlecht lesen, dunkelblaue Schrift auf weißem Hintergrund bildet aber einen starken Kontrast und ist deshalb gut erkennbar.
......@@ -24,16 +24,16 @@ Im Allgemeinen gilt bei dem Design, weniger ist mehr, da eine Reizüberflutung b
### Ansprüche an die Navigation:
Für Benutzer ist es wichtig, sich schnell auf einer Seite zurechtzufinden, da er i.d.R. Keine Lust hat, sich lange mit der Navigation aufzuhalten. Falls dem Besucher eine Webseite nicht zusagt, kann er sich ganz einfach eine andere Webseite suchen, die ähnliche Inhalte hat.
Für Benutzer ist es wichtig, sich schnell auf einer Seite zurechtzufinden, da er in der Regel keine Lust hat, sich lange mit der Navigation aufzuhalten. Falls dem Besucher eine Webseite nicht zusagt, kann er sich ganz einfach eine andere Webseite suchen, die ähnliche Inhalte hat.
Deshalb ist die Navigation von großer Wichtigkeit, auch hier gibt es einige Sachen, die von den Benutzern mehr oder weniger erwartet werden. Wichtig ist, dass dem Besucher jederzeit klar ist, wo er sich auf unserer Webseite befindet, dazu gibt es verschiedene Möglichkeiten, man kann zum Beispiel in der Navigationsleiste die gerade ausgewählte Seite hervorheben oder sog. Breadcrumbs
Deshalb ist die Navigation von großer Wichtigkeit, auch hier gibt es einige Dinge, die von den Benutzern mehr oder weniger erwartet werden. Wichtig ist, dass dem Besucher jederzeit klar ist, wo er sich auf der Webseite befindet. Zusätzlich gibt es verschiedene Möglichkeiten. Man kann zum Beispiel in der Navigationsleiste die gerade ausgewählte Seite hervorheben oder sog. Breadcrumbs
einbinden, die praktisch einen Verlauf der verschachtelten Seiten anzeigen.<sup>4</sup>
![breadcrumb](http://www.informatik.uni-oldenburg.de/~iug15/ew/img/brotkruemel.png "breadcrumb")
Außerdem sollte der Benutzer von jeder Seite aus die Möglichkeit haben, mit einem Klick sowohl die Kontaktseite, als auch die Startseite zu erreichen, dies sollte unter Anderem durch einen Klick auf das Logo möglich sein. Falls Besucher trotz Allem Probleme haben, sich zurechtzufinden, wünscht er sich eine Suche, mit der er gewünscht Inhalte finden kann.<sup>2</sup>
Außerdem sollte der Benutzer von jeder Seite aus die Möglichkeit haben, mit einem Klick sowohl die Kontaktseite, als auch die Startseite zu erreichen, dies sollte unter anderem durch einen Klick auf das Logo möglich sein. Falls Besucher trotz allem Probleme haben, sich zurechtzufinden, wünscht er sich eine Suche, mit der er gewünscht Inhalte finden kann.<sup>2</sup>
Die Kontaktseite sollte eine E-Mail-Adresse, oder sogar ein Kontaktformular enthalten, sowie die Adresse, Telefonnummer und Öffnungszeiten enthalten. Ergänzend zur Adresse ist eine Beschreibung der Anfahrt hilfreich, entweder als Text oder als Bild.<sup>2</sup>
Bei Links ist darauf zu achten, dass diese durch unterstreichen kenntlich gemacht werden, sowie bereits besuchte Links farbig markiert werden.<sup>3</sup>
Die Kontaktseite sollte eine E-Mail-Adresse, oder sogar ein Kontaktformular enthalten, sowie die Adresse, Telefonnummer und Öffnungszeiten. Ergänzend zur Adresse ist eine Beschreibung der Anfahrt hilfreich, entweder als Text oder Bild.<sup>2</sup>
Bei Links ist darauf zu achten, dass diese durch Unterstreichen kenntlich gemacht werden, sowie bereits besuchte Links farbig markiert werden.<sup>3</sup>
......@@ -41,17 +41,17 @@ Bei Links ist darauf zu achten, dass diese durch unterstreichen kenntlich gemach
Das Wort Konsistenz kommt aus dem Lateinischen und bedeutet soviel wie Zusammensetzung oder innere Stimmigkeit. Auf Webseiten übertragen heißt das, dass Schrift, Navigation, Designelemente etc. nicht zu stark variieren sollten. Dies hat zum Einen den Sinn, dass der Benutzer sich immer bewusst ist, dass er sich noch auf der Webseite befindet, zum Anderen fällt es dem Benutzer leichter, sich zu orientieren. Zum Beispiel sollte die Navigation auf jeder Seite einer Webseite an der gleichen Stelle sein, Texte immer die gleiche Schriftart und -größe haben, sowie die Farben auf der Webseite gleich bleiben.
Das Wort Konsistenz kommt aus dem Lateinischen und bedeutet soviel wie Zusammensetzung oder innere Stimmigkeit. Auf Webseiten übertragen heißt das, dass Schrift, Navigation, Designelemente etc. nicht zu stark variieren sollten. Dies hat zum einen den Sinn, dass der Benutzer sich immer bewusst ist, dass er sich noch auf der Webseite befindet, zum anderen fällt es dem Benutzer leichter, sich zu orientieren. Zum Beispiel sollte die Navigation auf jeder Seite einer Webseite an der gleichen Stelle sein, Texte immer die gleiche Schriftart und -größe haben, sowie die Farben auf der Webseite gleich bleiben.
Bei größeren Webseiten kann es schwer sein, eine Konsistenz zu erhalten, dabei hilft das Festlegen von Formatvorlagen. <sup>5</sup>
### Hilfestellungen
Für den Fall, dass Besucher auf unserer Seite auf Probleme stoßen, bietet es sich an, bestimmte Hilfestellungen zur Verfügung zu stellen. Zum Einen wäre das ein FAQ (Frequently Asked Questions), welches häufig gestellte Fragen beantwortet und bereits einen großen Teil der aufkommenden Fragen oder Probleme löst. Eine weitere Hilfestellung wäre eine Hilfeseite, die die auf der Webseite verfügbaren Funktionen erklärt. Sollten auf der Webseite viele Fremdwörter vorkommen, bietet sich ein Glossar an, in dem die Wörter erklärt werden.<sup>2</sup><sup>,</sup><sup>3</sup>
Für den Fall, dass Besucher auf unserer Seite auf Probleme stoßen, bietet es sich an, bestimmte Hilfestellungen zur Verfügung zu stellen. Zum einen wäre das ein FAQ (Frequently Asked Questions), welches häufig gestellte Fragen beantwortet und bereits einen großen Teil der aufkommenden Fragen oder Probleme löst. Eine weitere Hilfestellung wäre eine Hilfeseite, die die auf der Webseite verfügbaren Funktionen erklärt. Sollten auf der Webseite viele Fremdwörter vorkommen, bietet sich ein Glossar an, in dem die Wörter erklärt werden.<sup>2</sup><sup>,</sup><sup>3</sup>
### Weitere Usabilityaspekte
Ein mittlerweile sehr wichtiger Aspekt der Usability bildet die korrekte Darstellung der Webseite auf mobilen Endgeräten. Dazu gibt es verschiedene Umsetzungsmöglichkeiten, zum Einen kann das „Responsive Design“ angewendet werden, bei dem sich alle Webinhalte an die Größe des Fensters anpassen, was allerdings auch einige Nachteile birgt, wie man unter „Nachteile von Responsive Design“ nachlesen kann. Zum Anderen gibt es die Möglichkeit, eine zweite Seitenversion zu erstellen, die speziell auf mobile Endgeräte zugeschnitten ist, dabei werden die Besucher auf die mobile-URL umgeleitet, die normalerweise eine der folgenden Formen hat: "http://m.webseite.de" oder "http://mobile.webseite.de". <sup>6</sup>
Ein mittlerweile sehr wichtiger Aspekt der Usability bildet die korrekte Darstellung der Webseite auf mobilen Endgeräten. Dazu gibt es verschiedene Umsetzungsmöglichkeiten. Zum einen kann das „Responsive Design“ angewendet werden, bei dem sich alle Webinhalte an die Größe des Fensters anpassen, was allerdings auch einige Nachteile birgt, wie man unter „Nachteile von Responsive Design“ nachlesen kann. Zum anderen gibt es die Möglichkeit, eine zweite Seitenversion zu erstellen, die speziell auf mobile Endgeräte zugeschnitten ist. Dabei werden die Besucher auf die mobile-URL umgeleitet, die normalerweise eine der folgenden Formen hat: "http://m.webseite.de" oder "http://mobile.webseite.de". <sup>6</sup>
Außerdem wird empfohlen, die Ladezeiten der Webseite möglichst kurz zu halten, da zu lange Ladezeiten die Geduld des Besuchers strapazieren und ihn unnötig Zeit kosten. <sup>3</sup>
......
......@@ -13,8 +13,8 @@ Im Folgenden werden einige der wichtigsten Techniken vorgestellt.
<!--more-->
### Screenreader - die Schnittstelle zum Inhalt
Ein Screenreader ist ein Bildschirmleseprogramm, welches Inhalte auf dem Bildschirm erfasst. Dies ist essentiell für Blinde und Sehbehinderte, da sie die Inhalte nicht selbst wahrnehmen können. Somit wird eine alternative Benutzerschnittstelle zur grafischen Benutzeroberfläche geboten.
Ein Screenreader erkennt alle Elemente, welche auf dem Bildschirm angezeigt werden. Es können nicht nur einfach Texte mittels Audioausgabe vorgelesen werden, sondern alle grafischen Elemente des Bildschirms. Der Nutzer kann also durch einen Screenreader alle Elemente auf dem Bildschirm wahrnehmen, denn die Software kann eine Vielzahl weiterer Informationen Ausgeben. Dies kann beispielsweise die Position eines Fensters, eines Buttons und dessen Beschriftung oder auch ein Menu sein, in dem der Nutzer navigiert.
Unter einem Screenreader versteht man ein Bildschirmleseprogramm, welches Inhalte auf dem Bildschirm erfasst. Dies ist essentiell für Blinde und Sehbehinderte, da sie die Inhalte nicht selbst wahrnehmen können. Somit wird eine alternative Benutzerschnittstelle zur grafischen Benutzeroberfläche geboten.
Ein Screenreader erkennt alle Elemente, welche auf dem Bildschirm angezeigt werden. Es können nicht nur einfach Texte mittels Audioausgabe vorgelesen werden, sondern alle grafischen Elemente des Bildschirms. Der Nutzer kann also durch einen Screenreader alle Elemente auf dem Bildschirm wahrnehmen, denn die Software kann eine Vielzahl weiterer Informationen ausgeben. Dies kann beispielsweise die Position eines Fensters, eines Buttons und dessen Beschriftung oder auch ein Menu sein, in dem der Nutzer navigiert.
Es kann also eine vollwertige Navigation gewährleistet werden.<sup>1, 2</sup>
Es gibt eine Vielzahl an Programmen auf dem Markt wie etwa JAWS, welches als Marktführer im Bereich der Bildschirmleseprogramm gilt.<sup>4</sup> Des Weiteren gibt es auch Programme die direkt im Betriebssystem integriert sind, wie VoiceOver von Apple, dass mit Mac OS ausgeliefert wird.<sup>5</sup>
......@@ -27,11 +27,11 @@ Eine Möglichkeit Texte, welche mit einen Screenreader erfasst wurden nicht visu
### Ausgabe in Braille-Schrift für Blinde
Falls eine Braillezeile vorhanden ist, kann der Text auch hierüber ausgegeben werden. Die vom Screenreader erfassten Inhalte werden an das Gerät weitergegeben und darauf ausgegeben. Wie bei der Blindenschrift wo die Zeichen mit 6 Punkten kodiert und erfühlt werden können, kann auf dem Gerät der Inhalt auf die gleiche Weise erkannt werden. Dazu werden bei Bedarf kleine Erhebungen aus dem Gerät geschoben, die haptisch erkannt werden.<sup>6</sup>
Falls eine Braillezeile vorhanden ist, kann der Text auch hierüber ausgegeben werden. Die vom Screenreader erfassten Inhalte werden an das Gerät weitergegeben und darauf ausgegeben. Wie bei der Blindenschrift wo die Zeichen mit 6 Punkten kodiert und erfühlt werden können, kann auf dem Gerät der Inhalt auf die gleiche Weise erkannt werden. Dazu werden bei Bedarf kleine Erhebungen aus dem Gerät geschoben, die haptisch erkannt werden können.<sup>6</sup>
Der Inhalt einer Webseite kann - im Vergleich zur Audioausgabe - durch eine Braillezeile genauer erfasst werden, da so alle Buchstaben einzeln ausgegeben werden, wodurch die Rechtschreibung erkannt werden kann.
Ein Nachteil einer Braillezeile ist die hohe Anschaffungsgebühr, die durchaus einige 1000 € betragen kann.<sup>11</sup>
Ein Nachteil der Braillezeile sind die hohen Anschaffungsgebühren, die durchaus einige 1000 € betragen können.<sup>11</sup>
### Inhalte in Gebärdensprache für Gehörlose Menschen
Gehörlose Menschen haben häufig den Nachteil, dass sie komplexe Texte nicht so gut erfassen können. Dies liegt darin begründet, dass unsere Sprache eine Lautsprache ist und das Textverständnis in hohem Maße von dem gedanklichen Mitsprechen des Textes abhängt.<sup>12</sup>
......@@ -40,7 +40,7 @@ Für gehörlose Menschen sind daher Inhalte in Gebärdensprache sehr wichtig. Al
### Die Techniken im barrierefreien Internet
Das World Wide Web Consortium (W3C), welches Techniken und Spezifikationen im Internet standardisiert, hat die Web Accessibility Initiative (WAI) gegründet.<sup>8</sup> Diese Initiative beschäftigt sich mit dem barrierefreien Zugang zum Web. Von ihr wurden mehrere Standards veröffentlicht, die zum Beispiel festlegen, dass es Alternativen zu Audio- und Visuellen Inhalten geben soll oder etwa das die Benutzung nicht auf ein Eingabegerät beschränkt ist.
Das World Wide Web Consortium (W3C), welches Techniken und Spezifikationen im Internet standardisiert, hat die Web Accessibility Initiative (WAI) gegründet.<sup>8</sup> Diese Initiative beschäftigt sich mit dem barrierefreien Zugang zum Web. Von ihr wurden mehrere Standards veröffentlicht, die zum Beispiel festlegen, dass es Alternativen zu auditiven und visuellen Inhalten geben soll oder etwa das die Benutzung nicht auf ein Eingabegerät beschränkt ist.
Barrierefreie Webseiten werden im Allgemeinen nicht durch Kompromisse beim Layout erreicht, sondern durch den webkonformen Einsatz von Auszeichnungs- und Stylesheetsprachen im Web.<sup>7</sup>
......
......@@ -16,7 +16,7 @@ Gebrauchstauglichkeit geführt werden kann. Im deutschsprachigen Raum ist die No
Grundsätzen zusammensetzt:<sup>2</sup>
### Aufgabenangemessen
Die Dialogwege zwischen Fenstern, Webpages und Internetseiten und die auf diesen dargestellten informationen, sollten Aufgabenangemessen sein
Die Dialogwege zwischen Fenstern, Webpages und Internetseiten und die auf diesen dargestellten informationen, sollten angemessen sein
und somit die Arbeitsschritte zur Erledigung einer Arbeitsaufgabe genau abbilden.<sup>1</sup>
Damit ist gemeint, dass der Benutzer bei einer Aufgabe, die er sich selbst stellt, genauen Schritten folgen kann um diese zu erfüllen. Dies
......@@ -25,42 +25,42 @@ Bestellung geleitet wird.
### Selbstbeschreibend
Alle Texte, Labels, Buttons, Meldungen und weitere Bestandteile der Internetseite sollten auf Anhieb vertständlich sein. Diese Bestandteile sollten
sich selbst so gut beschreiben, dass der Benutzer dieser Internetseite direkt weiß, was passiert wenn er diese Benutzt, beziehungsweise wenn diese
sich selbst so gut beschreiben, dass der Benutzer dieser Internetseite direkt weiß, was passiert wenn er diese benutzt, beziehungsweise wenn diese
auftauchen.<sup>1</sup>
### Steuerbar
Die Dialogwege auf der Internetseite, über Schaltflächen, Menüeinträge und Icons, sollten den Benutzer einfach und vor allem flexibel zum Ziel seiner
Aufgabe führen. Dabei sollten Arbeitschritte rückgängig und Menüeinträge aufgehoben werden können.<sup>1</sup>
Der Benutzer soll zum Beispiel beim ausfüllen eines Bestellformulares am Ende nochmal seine Anschrift überprüfen und ändern können und zwischen den
Arbeitschritten, bis hin zur endgültigen Bestellung, ohne weiteres wechseln können. Dabei soll der Benutzer auch selbst bestimmen können, wann und ob
Der Benutzer soll zum Beispiel beim Ausfüllen eines Bestellformulares am Ende nochmals seine Anschrift überprüfen und ändern können und zwischen den
Arbeitschritten, bis hin zur endgültigen Bestellung, ohne Weiteres wechseln können. Dabei soll der Benutzer auch selbst bestimmen können, wann und ob
er einen Schritt weiter in der Arbeitsreihenfolge machen möchte.
### Erwartungskonform
Bedienungsabläufe, Symbole und die Anordnung der Informationen auf der Internetseite sollten innerhalb dieser konsistent sein und für den Benutzer dem
gewohnten Muster einer Internetseite entsprechen.<sup>1</sup>
Der Benutzer soll also beim erstmaligen Benutzen der Internetseite, alleine durch seine Erfahrungswerte, wissen, wo er zum Beispiel die Suche findet oder
wie er sich im allgemeinen auf dieser Internetseite zurecht findet und sich durch diese Navigieren kann.
Der Benutzer soll also beim erstmaligen Benutzen der Internetseite, alleine durch seine Erfahrungswerte wissen, wo er zum Beispiel "die Suche" findet oder
wie er sich im Allgemeinen auf dieser Internetseite zurecht findet und sich durch diese navigieren kann.
### Fehlertolerant
In allen Situationen, insbesondere bei einer Arbeitsaufgabe, soll die Internetseite weitestgehend dabei helfen Fehler zu vermeiden und dem Benutzer im
nachhinein Möglichkeiten zur Kontrolle und zur Korrektur geben.<sup>1</sup>
So soll zum Beispiel bei einem Bestellformular darauf geachtet werden, dass bei dem Geburtsdatum gar nicht erst Buchstaben eingetragen werden können und falls
doch etwas Falsch gemacht wird, soll der Benutzer vor der Bestellbestätigung nochmal alles kontrollieren und korrigieren können.
doch etwas falsch gemacht wird, soll der Benutzer vor der Bestellbestätigung erneut alles kontrollieren und korrigieren können.
### Individualisierbar
Fenstereinstellungen, Spaltenanordnungen in Listen, Menüs und weiteres sollte vom Benutzer selbst einstellbar und somit individualisierbar sein.<sup>1</sup>
Ein Beispiel hierfür ist, dass der Benutzer zum Beispiel sein Profil auf einer Internetseite selbst einstellen kann, durch ein eigenes Foto und einer eigenen
Fenstereinstellungen, Spaltenanordnungen in Listen, Menüs und Weiteres sollte vom Benutzer selbst einstellbar und somit individualisierbar sein.<sup>1</sup>
Ein Beispiel hierfür ist, dass der Benutzer zum Beispiel sein Profil auf einer Internetseite selbst einstellen kann, durch ein eigenes Foto und eine eigene
Signatur. Außerdem sollte er Suchergebnisse Filtern und die Reihenfolgen ändern können.
<br>
### Lernförderlich
Alle Bedienungsschritte, Tastenkürzel, Menüeinträge, Funktionen und Fundorte der Informationen sollten für jede Webpage einem gleichen, schnell zu erlernbarem
Prinzip folgen, damit sich der Benutzer nach dem erstmaligen betreten der Seite auf auf den Folgeseiten komplett koordinieren kann.<sup>1</sup>
Die Webpages innerhalb einer Interseite sollten somit schlicht gleich aussehen.
Alle Bedienungsschritte, Tastenkürzel, Menüeinträge, Funktionen und Fundorte der Informationen sollten für jede Webpage einem gleichen, schnell zu erlernbaren
Prinzip folgen, damit sich der Benutzer nach dem erstmaligen Betreten der Seite auf den Folgeseiten komplett koordinieren kann.<sup>1</sup>
Die Webpages innerhalb einer Internetseite sollten somit schlicht gleich aussehen.
<hr id="sources">
......
......@@ -11,22 +11,22 @@ Durch das Bereitstellen bestimmter Funktionalitäten kann sich die Verweildauer
<!--more-->
### Welche Funktionalitäten sollte eine EW bereitstellen?
Bei der Auswahl der Funktionalitäten ist es wichtig sicherzustellen, dass diese mit dem Inhalt und Zweck der Webseite korrespondieren und dem Nutzer einen zusätzlichen Nutzen stiften. Denn dann wird diese Funktionalität von den Nutzern als hilfreich empfunden.
Bei der Auswahl der Funktionalitäten ist es wichtig sicherzustellen, dass diese mit dem Inhalt und Zweck der Webseite korrespondieren und dem Nutzer einen zusätzlichen Nutzen bieten. Denn dann wird diese Funktionalität von den Nutzern als hilfreich empfunden.
![Websitefunktionen](http://www.informatik.uni-oldenburg.de/~iug15/ew/img/websitefunktionen.png "Websitefunktionen")
In diesem Bild werden drei Bestandteile von Website gezeigt: Utilities, Sektionen, Navigationshilfen. Diese Gruppen von Funktionen unterstützen das erwartungskonforme Webdesign, indem sie dem Nutzer bei der Orientierung auf der Webseite helfen. Diese Funktionen können größtenteils frei kombiniert werden. Dabei sollte man sich an der Größe der Website, also aus wie vielen Webseiten sie besteht, und an dem Zweck der Website orientieren. <sup>2</sup>
In diesem Bild werden drei Bestandteile von Website gezeigt: Utilities, Sektionen, Navigationshilfen. Diese Gruppen von Funktionen unterstützen das erwartungskonforme Webdesign, indem sie dem Nutzer bei der Orientierung auf der Webseite helfen. Diese Funktionen können größtenteils frei kombiniert werden. Dabei sollte man sich an der Größe der Website, also aus wie vielen Webseiten sie besteht und an dem Zweck der Website orientieren. <sup>2</sup>
Beispielsweise ist eine Suche erst ab einer bestimmten Größe notwendig, da man bei kleinen Websites mit der Hauptnavigation deutlich schneller die Zielseite erreichen kann. Genauso schöpft ein Navigationspfad sein Potenzial erst dann aus, wenn viele Navigationsebenen auf einer Website vorhanden sind.
Weitere wichtige Funktionalitäten für Webseiten sind z.B. die Kontaktmöglichkeit, die Auswahl der Sprache, die Schrift vergößern/verkleinern, Anmeldebereich für registrierte Nutzer, die Datenschutzrichtlinien, die AGB. Je nach Zweck der Website sollten weitere Funktionalitäten bereitgestellt werden. Unternehmen sollten generell Links zu Über-Uns, Jobangebote in ihre Seite einbinden. Für das Beispiel Online-Shops kommen noch Funktionen wie Links zu Versand- und Verpackungskosten, Kundenkonto, Warenkorb und Zertifizierungen hinzu. <sup>3</sup>
Weitere wichtige Funktionalitäten für Webseiten sind beispielsweise die Kontaktmöglichkeit, die Auswahl der Sprache, die Schrift vergößern/verkleinern, Anmeldebereich für registrierte Nutzer, die Datenschutzrichtlinien, die AGB. Je nach Zweck der Website sollten weitere Funktionalitäten bereitgestellt werden. Unternehmen sollten generell Links zu "Über-Uns" und Jobangebote in ihre Seite einbinden. Für das Beispiel Online-Shops kommen noch Funktionen wie Links zu Versand- und Verpackungskosten, Kundenkonto, Warenkorb und Zertifizierungen hinzu. <sup>3</sup>
### Worauf muss ich achten, wenn ich Funktionalitäten erstelle?
Bei einer erwartungskonformen Webseite spielt nicht nur die Auswahl, sondern auch die Positionierung der Funktionalitäten auf der Webseite eine große Rolle, denn im Laufe der Jahre haben die Nutzer Erfahrungen beim Surfen im Internet gesammelt. Diese führen dazu, dass sie mehrheitlich Funktionalitäten in den gleichen Bereichen der Seite erwarten. <sup>3</sup>
![Positionierungsschema für Online-Shops](http://www.informatik.uni-oldenburg.de/~iug15/ew/img/Positionierungsschema_OnlineShops.jpg "Positionierungsschema für Online-Shops")
Auf diesem Bild ist ein Positionierungsschema für Online Shops zu sehen. Darauf lässt sich erkennen, dass Funktionen wie die Suche, der Hilfe-Link, der Login-Bereich im oberen rechten Seitenbereich erwartet werden. In der Bildschirmmitte wird der Content angezeigt. Im unteren Bereich der Seite werden Links zu Datenschutz, Impressum, AGB erwartet. Werbung wird hier als optionales Element am rechten Seitenrand eingeordnet. Anhand eines solchen Schemas kann ein Webentwickler einen erwartungskonformen Online-Shop erarbeiten.
Auf diesem Bild ist ein Positionierungsschema für Online Shops zu sehen. Darauf lässt sich erkennen, dass Funktionen wie die "Suche", der "Hilfe-Link", der "Login-Bereich" im oberen rechten Seitenbereich erwartet werden. In der Bildschirmmitte wird der Content angezeigt. Im unteren Bereich der Seite werden Links zu Datenschutz, Impressum, AGB erwartet. Werbung wird hier als optionales Element am rechten Seitenrand eingeordnet. Anhand eines solchen Schemas kann ein Webentwickler einen erwartungskonformen Online-Shop erarbeiten.
### Fazit
Für eine erwartungskonforme Website ist es wichtig eine Auswahl an Funktionalitäten anzubieten, die auf die Zielgruppe abgestimmt sind. Desweiteren ist es von Vorteil die Positionierung der Elemente auf der Webseite den Erwartungen der Nutzer anzupassen, um eine möglichst hohe Verweildauer auf der Seite zu erreichen.
Für eine erwartungskonforme Website ist es wichtig, eine Auswahl an Funktionalitäten anzubieten, die auf die Zielgruppe abgestimmt ist. Des Weiteren ist es von Vorteil die Positionierung der Elemente auf der Webseite den Erwartungen der Nutzer anzupassen, um eine möglichst hohe Verweildauer auf der Seite zu erreichen.
<hr id="sources">
#### Quellen
......
......@@ -7,7 +7,7 @@ author: Jörn Jürgens
---
Bei der Erstellung einer Website, gerade wenn diese öffentlich zugänglich ist, gibt es Gesetze, die Eingehalten werden müssen. In diesem Kapitel werden
hauptsächlich die Impressumspflicht und die Grundsätzlichen Gersetze des BITV behandelt.
hauptsächlich die Impressumspflicht und die Grundsätzlichen Gesetze des BITV behandelt.
<!--more-->
......@@ -21,9 +21,9 @@ In dem Impressum muss der Name, die Anschrift und eine Möglichkeit zur schnelle
Außerdem muss ein zweiter Kommunikationsweg eröffnet werden, welcher zum Beispiel die Telefonnummer sein kann. Als zweiter Kommunikationsweg reicht aber auch eine
automatisierte Kontakaufnahme, zum Beispiel durch eine elektronische Anfragemaske.<sup>2</sup>
Ist der Anbieter in ein Register wie das Handels- oder Vereinsregister eingetragen, muss auch diese Registernummer im Impressum aufgeführt werden. Des weiteren müssen Inhaber
deren Betrieb von Aufsichtsbehörden überwacht werden, zum Beispiel Spielhallenbetreiber, Angaben zur zuständigen Aufsichtsbehörde machen, damit der Benutzer die Möglcihkeit hat
dort Beschwerden einzureichen.<sup>2</sup>
Ist der Anbieter in einem Register wie dem Handels- oder Vereinsregister eingetragen, muss auch diese Registernummer im Impressum aufgeführt werden. Des weiteren müssen Inhaber
deren Betrieb von Aufsichtsbehörden überwacht werden, zum Beispiel Spielhallenbetreiber, Angaben zur zuständigen Aufsichtsbehörde machen, damit der Benutzer die Möglichkeit hat
dort Beschwerde einzureichen.<sup>2</sup>
##Geltungsbereich
......@@ -31,7 +31,7 @@ Grundsätzlich muss jede Internetseite ein Impressum führen. Es gibt allerdings
dient. Kein Impressum muss geführt werden, wenn:<sup>2</sup>
+ Inhalte Passwortgeschützt sind
+ Inhalte aus dem engesten Lebensbereich nur für mich selbst existieren
+ Inhalte aus dem engsten Lebensbereich nur für mich selbst existieren
Ein Impressum ist also Pflicht für alle geschäftsmäßigen und öffentlichen Internetseiten, also alle, die nicht nur dem persönlichen Zweck dienen.
......@@ -40,10 +40,10 @@ Ein Impressum ist also Pflicht für alle geschäftsmäßigen und öffentlichen I
<br>
###[BITV]
Die Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz, vom 12.09.2011, sorgt dafür, dass
Die Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz vom 12.09.2011 sorgt dafür, dass
behinderte Menschen bei der Benutzung der Internetseite nicht benachteiligt werden. Hierbei wird ein gesetzlicher Geltungsbereich
ebenso wie anzuwendende Standards definiert, nach denen gehandelt werden kann. Die Verordnung wird regelmäßig unter Berücksichtigung des technischen
Fortschritts überprüft und gegebenfalls überarbeitet und angepasst.<sup>1</sup>
Fortschritts überprüft und gegebenenfalls überarbeitet und angepasst.<sup>1</sup>
<br>
......@@ -54,7 +54,7 @@ zugänglich sind.<sup>1</sup>
<br>
##Handlungsbereich
Die Internetauftritte und Angebote müssen so gestaltet sein, dass behinderte Menschen im Sinne des §3 des BehindertengleichStellungsgesetzes<sup>4</sup>, die
Die Internetauftritte und Angebote müssen so gestaltet sein, dass behinderte Menschen im Sinne des §3 des Behindertengleichstellungsgesetzes<sup>4</sup>, die
Internetseite benutzen können. Da diese Menschen ohne weiteres die Informationstechnik nicht benutzen können, muss ihnen also eine Möglichkeit gegeben
werden, die Benutzung zugänglich zu machen.<sup>1</sup>
......
......@@ -9,30 +9,30 @@ author: Jannik Spieker
Eine Webseite wird mit dem Internet, also mit dem Begriff „*online*“ assoziiert. Was also haben *Offline*-Funktionalitäten im Bereich erwartungskonformer Webseiten zu suchen?
Webseiten erreicht man, indem man die URL, also die Adresse der Internetseite, in die Navigationsleiste seines Browsers eingibt. Ein Internetbrowser kann neben diesen Webseiten aus dem Internet auch Offline-Webseiten anzeigen, also solche, die sich nur lokal auf dem Gerät befinden und nicht mit dem Internet verbunden sind. Über eine Offline-Webseite kann man beispielsweise Multimedia-Präsentationen darstellen. <!--more-->
Ein weiteres Konzept komplett internetloser Webseiten sind offline „*Single Page Applications*“ (Einzelseiten-Webanwendung). Die Seite [TiddlyWiki][tiddlywiki]{:target="_blank"}<sup>3</sup> bietet beispielsweise eine dieser Single Page Applications zum herunterladen an. Hierbei handelt es sich um einen persönlichen Notizblock, auf den man über seinen Internetbrowser zugreift und Notizen hinzufügt. Diese Notizen gelangen aber nie ins Internet sondern werden lokal auf der Festplatte gespeichert.
Ein weiteres Konzept, komplett internetloser Webseiten sind offline „*Single Page Applications*“ (Einzelseiten-Webanwendung). Die Seite [TiddlyWiki][tiddlywiki]{:target="_blank"}<sup>3</sup> bietet beispielsweise eine dieser "Single Page Applications" zum herunterladen an. Hierbei handelt es sich um einen persönlichen Notizblock, auf den man über seinen Internetbrowser zugreift und Notizen hinzufügt. Diese Notizen gelangen aber nie ins Internet sondern werden lokal auf der Festplatte gespeichert.
Wirklich interessant aber werden Seiten, welche im Internet laufen, aber viele der Funktionalitäten auf den Computer des Nutzers verlagern und somit verschiedene Offline-Features anbieten. Somit kann der Besucher Teilbereiche einer Webseite auch dann benutzen, wenn er kurzzeitig die Internetverbindung verliert. Ein sehr praktisches Beispiel hierfür ist die beta-Version, also die nicht ganz fertiggestellte Seitenerweiterung [„Gmail Offline“][gmailoffline]{:target="_blank"}<sup>4</sup> von Google. Diese erlaubt es dem Nutzer - nach einer ersten Synchronisierung mit dem jeweiligen Gmail-Account - sämtliche Mails auch ohne Internetzugriff zu lesen oder darauf zu antworten (abgeschickt werden die E-Mails wenn wieder ein Internetzugriff vorhanden ist). Diese Funktion ist äußerst praktisch, da einem ein Mail-Entwurf, den man in der Internetseite eingibt nicht verloren geht wenn das Internet ausfällt bevor man auf „*Absenden*“ gedrückt hat.<sup>1</sup>
Wirklich interessant aber werden Seiten, welche im Internet laufen, aber viele der Funktionalitäten auf den Computer des Nutzers verlagern und somit verschiedene Offline-Features anbieten. Somit kann der Besucher Teilbereiche einer Webseite auch dann benutzen, wenn er kurzzeitig die Internetverbindung verliert. Ein sehr praktisches Beispiel hierfür ist die beta-Version, also die nicht komplett fertiggestellte Seitenerweiterung [„Gmail Offline“][gmailoffline]{:target="_blank"}<sup>4</sup> von Google. Diese erlaubt es dem Nutzer - nach einer ersten Synchronisierung mit dem jeweiligen Gmail-Account - sämtliche Mails auch ohne Internetzugriff zu lesen oder darauf zu antworten (abgeschickt werden die E-Mails wenn wieder ein Internetzugriff vorhanden ist). Diese Funktion ist äußerst praktisch, da einem ein E-Mail-Entwurf, den man in der Internetseite eingibt nicht verloren geht wenn das Internet ausfällt bevor man auf „*Absenden*“ gedrückt hat.<sup>1</sup>
Auch wenn die Anzahl der Breitbandanschlüsse in Deutschland in den Vorjahren [drastisch gestiegen][fazstatistik]{:target="_blank"}<sup>2</sup> ist, macht es dennoch Sinn, Teilbereiche einer Webseite auf das Endgerät des Nutzers ausuzlagern. Offline-Technologien können die Daten von jedem Besucher individuell *cachen* (zwischenspeichern), was der Webapplikation erlaubt, die für den Nutzer relevanten Daten noch schneller anzuzeigen als wenn dieser alles neu herunterladen müsste. Der Server, also dort wo die Internetseite und damit die Webapplikation die der Besucher benutzt liegt, bekommt nur die Veränderungen zu sehen, und passt die Daten dementsprechend an.
Auch wenn die Anzahl der Breitbandanschlüsse in Deutschland in den Vorjahren [drastisch gestiegen][fazstatistik]{:target="_blank"}<sup>2</sup> ist, macht es dennoch Sinn, Teilbereiche einer Webseite auf das Endgerät des Nutzers ausuzlagern. Offline-Technologien können die Daten von jedem Besucher individuell *cachen* (zwischenspeichern), was der Webapplikation erlaubt, die für den Nutzer relevanten Daten noch schneller anzuzeigen, als wenn dieser alles neu herunterladen müsste. Der Server, also dort wo die Internetseite und damit die Webapplikation die der Besucher benutzt liegt, bekommt nur die Veränderungen zu sehen, und passt die Daten dementsprechend an.
[Cookies][cookieswiki]{:target="_blank"} speichern auch einen Teil an Informationen offline, jedoch ist hierbei die Kapazität zu gering um derarte Seiteninhalte zu speichern. Auch *Plugins* (Zusatzmodule), wie Flash oder Java können Inhalte zwischenspeichern. Hierbei ist jedoch vorausgesetzt, dass das Plugin beim Benutzer installiert ist, sodass man durch benutzen dieser einige Nutzer von diesen Funktionalitäten ausschließt.
### Was sind moderne Methoden zum Zwischenspeichern?
Es gibt primär zwei relevante offline-Funktionalitäten in HTML5: Zum einen das „*application caching*“ und den „*offline storage*“ (auch „*client-side storage*“). Beim application caching werden Teile der grundlegenden Programmlogik und der Bedienoberfläche zwischengespeichert, und beim offline storage wird nutzerspezifische Inhalte und Daten gespeichert.
Es gibt primär zwei relevante offline-Funktionalitäten in HTML5: Zum einen das „*application caching*“ und den „*offline storage*“ (auch „*client-side storage*“). Beim application caching werden Teile der grundlegenden Programmlogik und der Bedienoberfläche zwischengespeichert, und beim offline storage werden nutzerspezifische Inhalte und Daten gespeichert.
Application caching ist zum Teil bereits durch den Internetbrowser möglich, welcher besuchte Webseitenlayouts zwischenspeichern kann um die Seite beim erneuten Aufruf schneller darzustellen. So würde bei dem oben genannten Beispiel „Gmail Offline“ das Layout und das Design der Seite (also die HTML- und die CSS-Struktur) zwischengespeichert. Die durch den Browser angebotene Funktionalität bleibt jedoch nicht für immer vorhanden, sondern wird irgendwann durch aktuellere Inhalte ausgetauscht. Ein richtiger application cache hat dabei sozusagen einen „Sonderstatus“, denn diese Inhalte bleiben auf der Festplatte vorhanden bis sie manuell gelöscht werden.
Mithilfe des application cache kann der Nutzer also die Seite sofort laden, aber was wenn er in seinem vorherigen Besuch der Seite eine E-Mail verfasst hat und als Entwurf gespeichert hat? Solche Daten sind nutzerspezifisch und deshalb nicht im application cache gespeichert. Stattdessen können diese Daten im offline storage gespeichert werden. Somit kann auch der Entwurf sofort absendebereit dargestellt werden. Würde der Nutzer nun Text zu der mail hinzufügen, würden nur diese Veränderungen an den Server übermittelt werden und gleichzeitig lokal gespeichert. Sollte das Internet erneut abgeschaltet werden, sind die letzten Änderungen immer noch vorhanden. Logisch wird dabei auch, dass der Seitenanbieter damit deutlich Bandbreite einsparen kann, da die Veränderungen viel kleiner sind als die gesamte Seite.
Mit Hilfe des application cache kann der Nutzer also die Seite sofort laden, aber was geschieht, wenn er in seinem vorherigen Besuch der Seite eine E-Mail verfasst hat und als Entwurf gespeichert hat? Solche Daten sind nutzerspezifisch und deshalb nicht im application cache gespeichert. Stattdessen können diese Daten im offline storage gespeichert werden. Somit kann auch der Entwurf sofort absendebereit dargestellt werden. Würde der Nutzer nun Text zu der E-Mail hinzufügen, würden nur diese Veränderungen an den Server übermittelt und gleichzeitig lokal gespeichert werden. Sollte das Internet erneut abgeschaltet werden, sind die letzten Änderungen immer noch vorhanden. Logisch wird dabei auch, dass der Seitenanbieter damit deutlich Bandbreite einsparen kann, da die Veränderungen viel kleiner sind als die gesamte Seite.
### Wofür kann man Offline-Speicher noch verwenden?
Mit lokalem Speicher kann man auch andere Resultate erzielen. Beispielsweise kann man dadurch Informationen auf den Nutzer soweit auslagern, dass man auf eine eigene Datenbank verzichten kann. Dies hat unter anderem den Vorteil, dass der Nutzer sich nicht zwangsweise registrieren muss, und trotzdem die Webseite mit seinen eigenen Daten benutzen kann. Logischerweise sollte dies nur für nicht-sensitive Daten geschehen, beispielsweise kann man so den Suchverlauf eines Nutzers auf einer Webseite darstellen.
Ein weiterer Verwendungszweck ist das sogenannte **Host-Proof Hosting**. Hierbei wird die Verschlüsselung von sensitiven Informationen auf den Nutzer ausgelagert. Das bedeutet, dass beispielsweise ein Passwort nie im Klartext den Browser verlässt, sondern vom Browser des Nutzers automatisch verschlüsselt wird. Würde ein potentieller Angreifer die Verbindung des Nutzers mit einer Internetseite abfangen, würde er also nicht das Passwort erlangen können, sondern nur die verschlüsselte Variante dessen, von der er nicht ohne Weiteres auf das Passwort schließen könnte. An dieser Stelle ist es aber wichtig zu erwähnen, dass diese auf den ersten Blick sehr sichere Art von Verschlüsselung [nicht absolut sicher ist][javascriptharmful]{:target="_blank"}<sup>5</sup>.
Ein weiterer Verwendungszweck ist das sogenannte **Host-Proof Hosting**. Hierbei wird die Verschlüsselung von sensitiven Informationen auf den Nutzer ausgelagert. Das bedeutet, dass beispielsweise ein Passwort nie im Klartext den Browser verlässt, sondern vom Browser des Nutzers automatisch verschlüsselt wird. Würde ein potentieller Angreifer die Verbindung des Nutzers mit einer Internetseite abfangen, würde er also nicht das Passwort erlangen können, sondern nur die verschlüsselte Variante dessen, von der er nicht ohne Weiteres auf das Passwort schließen könnte. An dieser Stelle ist es aber wichtig zu erwähnen, dass diese auf den ersten Blick sehr sichere Art der Verschlüsselung [nicht absolut sicher ist][javascriptharmful]{:target="_blank"}<sup>5</sup>.
### Fazit
Offline-Funktionalitäten haben viel Wachstumspotential. Dabei muss das Ziel nicht umbedingt sein, dass eine Webapplikation auch im Flugzeug oder im Zug benutzbar ist. Mit aktuellen Funktionen wie dem HTML5 offline storage hat ein moderner Entwickler viele Möglichkeiten um seine Seite nicht nur schneller sondern auch praktischer und für den Nutzer individueller zu gestalten.
Offline-Funktionalitäten haben viel Wachstumspotential. Dabei muss das Ziel nicht unbedingt sein, dass eine Webapplikation auch im Flugzeug oder im Zug benutzbar ist. Mit aktuellen Funktionen wie dem "HTML5 offline storage" hat ein moderner Entwickler viele Möglichkeiten um seine Seite nicht nur schneller sondern auch praktischer und für den Nutzer individueller zu gestalten.
<hr id="sources">
#### Quellen
......
......@@ -6,10 +6,10 @@ category: barrierefreiheit
author: Jan Philipp Hörding
---
Die Sprache ist ein wichtiges Kriterium bei der Übertragung von Informationen. Durch sie wird der Nutzer informiert und es wird ein Verhältnis vom Autor zum Leser aufgebaut. Doch was muss für Barrierefreiheit beachtet werden? <!--more-->
Die Sprache ist ein wichtiges Kriterium bei der Übertragung von Informationen. Durch sie wird der Nutzer informiert und es wird ein Verhältnis vom Autor zum Leser aufgebaut. Doch was muss für die Barrierefreiheit beachtet werden? <!--more-->
Englisch hat mit 1,5 Milliarden die größte Anzahl an Sprechern und ist international somit eine Verkehrssprache.<sup>3</sup> Danach folgen Chinesisch, Hindi, Spanisch, Französisch und Arabisch.<sup>3</sup>
Dies steht in einem leichten Gegensatz zur verwendeten Sprache im Internet. Zwar ist Englisch die am meisten verwendete Sprache im Internet, jedoch ergibt sich als weitere Reihenfolge eine Diskrepanz zwischen der Anzahl der Sprecher und der Anteil der Texte im Internet in der jeweiligen Sprache. Es sind etwa 56% der Inhalte in Englisch verfasst, danach folgen Deutsch mit 7,7%, Französisch mit 5,6 % und Japanisch mit fast 5%.<sup>1, 2</sup>
Englisch hat mit 1,5 Milliarden die größte Anzahl an Sprechern und ist international eine Verkehrssprache.<sup>3</sup> Danach folgen Chinesisch, Hindi, Spanisch, Französisch und Arabisch.<sup>3</sup>
Dies steht in einem leichten Gegensatz zur verwendeten Sprache im Internet. Zwar ist Englisch die am meisten verwendete Sprache im Internet, jedoch ergibt sich als weitere Reihenfolge eine Diskrepanz zwischen der Anzahl der Sprecher und dem Anteil der Texte im Internet in der jeweiligen Sprache. Es sind etwa 56 % der Inhalte in Englisch verfasst, danach folgen Deutsch mit 7,7 %, Französisch mit 5,6 % und Japanisch mit fast 5 %.<sup>1, 2</sup>
### Mehrsprachigkeit
Ein großes Hindernis sind Sprachbarrieren. Dies trifft nicht nur im wirklichen Leben zu, sondern auch im Internet. Daher ist es wichtig Inhalte mehrsprachig anzubieten. Dies erhöht nicht nur die Reichweite der Seite, sondern vereinfacht auch deren Nutzung, sofern eine passende Übersetzung vorliegt.
......@@ -21,24 +21,24 @@ Das Übersetzen der Webseite in eine weitere Sprache kann zuweilen aufwändig un
### Das Sprachniveau - Für alle leicht verständlich?
Nutzer haben - auch wenn sie alle die gleiche Sprache sprechen - ein unterschiedliches Verständnisniveau. Um Texte und Artikel für alle ansprechend zu gestalten, ist es behilflich sie in der Art zuschreiben, in der sie von allen verstanden werden. Dies ist auch insbesondere für Nichtmuttersprachler wichtig.
Nutzer haben - auch wenn sie alle die gleiche Sprache sprechen - ein unterschiedliches Verständnisniveau. Um Texte und Artikel für alle ansprechend zu gestalten, ist es hilfreich sie in der Art zu schreiben, in der sie von allen verstanden werden. Dies ist auch insbesondere für Nichtmuttersprachler wichtig.
Menschen mit Behinderungen können aus verschiedensten Gründen Probleme damit haben Texte zu verstehen. Dies kann an umständlichen Formulierungen, Verschachtelungen und Fremdwörtern liegen.<sup>4</sup>
Aufgrund dessen ist es naheliegend Regeln für ein besseres Verständnis von Texten aufzustellen. Der Verein „Leichte Sprache“<sup>5</sup> gibt seit 2006 ein Regelwerk für sprachliche Ausdrucksweisen im Deutschen heraus.<sup>6</sup>
### Die Regeln für ein leichtes Verständnis
Beim Schreiben von leicht verständlichen Texten gibt es einige Regeln, die beachtet werden sollten. Dies betrifft beispielsweise den Satzaufbau. Dieser sollte vor allem aus kurzen Sätzen bestehen, welche am besten nur über ein Aussage verfügen. Ein Satz ist am leichtesten zu verstehen, wenn er in der Form Subjekt, Prädikat und Objekt geschrieben ist und als Aktivsatz formuliert ist. Auch Möglichkeitsformen sollten nach Möglichkeit ausgelassen werden.<sup>6</sup>
Beim Schreiben von leicht verständlichen Texten gibt es einige Regeln, die beachtet werden sollten. Dies betrifft beispielsweise den Satzaufbau. Dieser sollte vor allem aus kurzen Sätzen bestehen, welche am besten nur über ein Aussage verfügen. Ein Satz ist am leichtesten zu verstehen, wenn er in der Form Subjekt, Prädikat und Objekt geschrieben ist und als Aktivsatz formuliert ist. Auch Möglichkeitsformen sollten vermieden werden.<sup>6</sup>
Die Aussage: „Wenn Sie noch Fragen haben, rufen Sie uns einfach an.
Kann in folgende leicht verständlichere Form umgeformt werden.<sup>7</sup>
Die Aussage: „Wenn Sie noch Fragen haben, rufen Sie uns einfach an“
kann in die Folgende, leicht verständlichere Form umgeformt werden:<sup>7</sup>
„Haben Sie Fragen?
Sie können uns anrufen.“
Für Fremdwörter ist eine Erklärung im Text nützlich, dass gleiche gilt im Falle von Abkürzungen, die beim ersten Vorkommen einmal zusätzlich ausgeschrieben werden. Bei Metaphern und abstrakten Begriffen ist es hilfreich eine alternative zu wählen. Wörter, welche zusammengesetzt sind, werden leichter verständlich, indem sie durch einen Bindestrich getrennt werden. Aus Bundestag wird so Bundes-Tag.<sup>6</sup>
Für Fremdwörter ist eine Erklärung im Text nützlich. Das Gleiche gilt im Falle von Abkürzungen, die beim ersten Vorkommen einmal zusätzlich ausgeschrieben werden. Bei Metaphern und abstrakten Begriffen ist es hilfreich, eine Alternative zu wählen. Wörter, welche zusammengesetzt sind, werden leichter verständlich, indem sie durch einen Bindestrich getrennt werden. Aus Bundestag wird somit Bundes-Tag.<sup>6</sup>
Beim Textaufbau gibt es ebenfalls Möglichkeiten, welche ein leichteres Verständnis ermöglichen. Eine übersichtliche Darstellung lässt sich erzielen, indem jeder Satz in einer eigenen Zeile steht, sinnvolle Absätze eingebaut werden und Überschriften sich vom restlichen Text abheben. Des Weiteren vermitteln Bilden und Grafiken schnell Informationen und tragen zum besseren Verständnis von komplexen Sachverhalten bei.<sup>6</sup>
Beim Textaufbau gibt es ebenfalls Möglichkeiten, welche ein leichteres Verständnis ermöglichen. Eine übersichtliche Darstellung lässt sich erzielen, indem jeder Satz in einer eigenen Zeile steht, sinnvolle Absätze eingebaut werden und Überschriften sich vom restlichen Text abheben. Des Weiteren vermitteln Bilder und Grafiken schnell Informationen und tragen zum besseren Verständnis von komplexen Sachverhalten bei.<sup>6</sup>
Viele dieser Regeln sind auch in Europäischen Richtlinien aufgeführt.<sup>8</sup>
......
......@@ -6,20 +6,20 @@ category: usability
author: Stephan Adolf
---
Responsive Design hat viele Vorzüge, wenn man bedenkt, dass manche Webseiten sowohl von mobilen Endgeräten, als auch von gewöhnlichen Desktop-PC oder Laptops aus aufgerufen werden. Als Beispiel kann hier eine Touristen-Webseite dienen, die sowohl im Urlaub von Smartphone, als auch zu Haus durch den Laptop o.ä. aufgerufen wird. Allerdings hat Responsive Design auch Nachteile.<!--more--> Neben einem signifikant erhöhtem Entwicklungsaufwand zählt auch eine Beeinträchtigung der Performance der Webseite dazu. Das liegt daran, dass zusätzliche Informationen auf dem Endgerät (durch zusätzliche CSS-Einträge) verarbeitet und ständig abgefragt werden müssen, sodass Interaktionen des Nutzers mit der Webseite verlangsamt werden. Während dieses Problem im Desktop-Bereich aufgrund mehr Rechenleistung kein allzu großes Problem darstellt, war und ist dies im mobilen Bereich anders.<sup>1</sup>
Responsive Design hat viele Vorzüge, wenn man bedenkt, dass manche Webseiten sowohl von mobilen Endgeräten, als auch von gewöhnlichen Desktop-PCs oder Laptops aus aufgerufen werden. Als Beispiel kann hier eine Touristen-Webseite dienen, die sowohl im Urlaub von Smartphone, als auch zu Haus durch den Laptop o.Ä. aufgerufen wird. Allerdings hat Responsive Design auch Nachteile.<!--more--> Neben einem signifikant erhöhtem Entwicklungsaufwand zählt auch eine Beeinträchtigung der Performance der Webseite dazu. Das liegt daran, dass zusätzliche Informationen auf dem Endgerät (durch zusätzliche CSS-Einträge) verarbeitet und ständig abgefragt werden müssen, sodass Interaktionen des Nutzers mit der Webseite verlangsamt werden. Während dieses Problem im Desktop-Bereich aufgrund mehr Rechenleistung kein allzu großes Problem darstellt, war und ist dies im mobilen Bereich anders.<sup>1</sup>
### Ist Responsive Design immer sinnvoll?
In vielen Fällen ist das Erstellen von responsiven Webseiten in Deutschland aufgrund des zu erwartenden Nutzerverhaltens wenig sinnvoll und steht in keinem Verhältnis zu den verursachten Kosten. Man denke hier an Online-Shops, welche Büroartikel vertreiben oder an Webseiten, welche auf die Bedürfnisse von Senioren zugeschnitten sind. Man kann bei solchen Webseiten davon ausgehen, dass weit über 90 % der Nutzer Desktop-User sind. Entsprechend wäre es dort wenig sinnvoll das wesentlich aufwendigere und kostenintensivere Responsive Design anzuwenden. Anders sieht es beispielsweise bei Routenplanern aus, die zu einem erheblichen Anteil von mobilen Endgeräten aus benutzt werden. Entsprechend ist hier ein gutes Responsives Design, welches eine Nutzung auf Desktop- sowie mobilen Geräten ermöglicht, unabdingbar.<sup>4</sup> Es kann auch hilfreich sein, sich anzuschauen mit welchen Betriebssystemen im Internet gesurft wird, um die Hauptzielplattform zu ermitteln und die Sinnhaftigkeit von Responsive Design zu evaluieren. Laut der [W3SCHOOLS](http://www.w3schools.com/browsers/browsers_mobile.asp){:target="_blank"} sind im Jahr 2015 gerade einmal 5 %! aller Geräte im Internet mobil.<sup>5</sup>
In vielen Fällen ist das Erstellen von responsiven Webseiten in Deutschland aufgrund des zu erwartenden Nutzerverhaltens wenig sinnvoll und steht in keinem Verhältnis zu den verursachten Kosten. Man denke hier an Online-Shops, welche Büroartikel vertreiben oder an Webseiten, welche auf die Bedürfnisse von Senioren zugeschnitten sind. Man kann bei solchen Webseiten davon ausgehen, dass weit über 90 % der Nutzer Desktop-User sind. Entsprechend wäre es dort wenig sinnvoll das wesentlich aufwendigere und kostenintensivere Responsive Design anzuwenden. Anders sieht es beispielsweise bei Routenplanern aus, die zu einem erheblichen Anteil von mobilen Endgeräten aus benutzt werden. Entsprechend ist hier ein gutes Responsives Design, welches eine Nutzung auf Desktop- sowie mobilen Geräten ermöglicht, unabdingbar.<sup>4</sup> Es kann auch hilfreich sein, sich anzuschauen mit welchen Betriebssystemen im Internet gesurft wird, um die Hauptzielplattform zu ermitteln und die Sinnhaftigkeit von Responsive Design zu evaluieren. Laut der [W3SCHOOLS](http://www.w3schools.com/browsers/browsers_mobile.asp){:target="_blank"} sind im Jahr 2015 gerade einmal 5 % aller Geräte im Internet mobil.<sup>5</sup>
### Bedürfnisse für unterschiedliche Endgeräte
Technisch gesehen ergibt sich das Problem, dass sich die Bedienung und damit die Bedürfnisse der Nutzer von Smartphones und Tablets stark von denen der Desktop-PCs, Laptops (im Folgenden Desktop-PC's) unterscheiden. Besteht Responsive Design primär darin dieselben Inhalte wie für die Desktop-PCs untereinander anzuordnen, so besteht das Problem, dass der Nutzer sehr viel scrollen muss. Das wiederspricht jedoch der Erwartung schnell auf Informationen zugreifen zu können. Insbesondere kann es durch das Umordnen von Elementen passieren, dass einzelne Elemente auf der mobilen Seite an Positionen erscheinen, wo sie vom Nutzer nicht erwartet werden.<sup>2, 6</sup> Des Weiteren werden bei responsive Design Elemente auf mobilen Geräten nicht angezeigt, ist der Nutzer jedoch an ein solches Element von der Desktop-Version gewöhnt, so wiederspricht dies seiner Erwartungshaltung.<sup>6</sup> Insbesondere beim Nutzen von Suchfunktionen kann es auf mobilen Geräten sinnvoll sein hierfür spezielle Seiten für eine bessere Nutzbarkeit einzufügen. Diese Seiten werden an einem Desktop-PC nicht benötigt. Da Responsive Webdesign jedoch das Aufbauen paralleler Strukturen verhindern möchte, ergeben sich hier Schwierigkeiten.<sup>6</sup>
Technisch gesehen ergibt sich das Problem, dass sich die Bedienung und damit die Bedürfnisse der Nutzer von Smartphones und Tablets stark von denen der Desktop-PCs, Laptops (im Folgenden Desktop-PCs) unterscheiden. Besteht Responsive Design primär darin dieselben Inhalte wie für die Desktop-PCs untereinander anzuordnen, so besteht das Problem, dass der Nutzer sehr viel scrollen muss. Das wiederspricht jedoch der Erwartung schnell auf Informationen zugreifen zu können. Insbesondere kann es durch das Umordnen von Elementen passieren, dass einzelne Elemente auf der mobilen Seite an Positionen erscheinen, wo sie vom Nutzer nicht erwartet werden.<sup>2, 6</sup> Des Weiteren werden beim responsive Design Elemente auf mobilen Geräten nicht angezeigt, ist der Nutzer jedoch an ein solches Element von der Desktop-Version gewöhnt, so wiederspricht dies seiner Erwartungshaltung.<sup>6</sup> Insbesondere bei der Nutzung von Suchfunktionen kann es auf mobilen Geräten sinnvoll sein hierfür spezielle Seiten für eine bessere Nutzbarkeit einzufügen. Diese Seiten werden auf einem Desktop-PC nicht benötigt. Da Responsive Webdesign jedoch das Aufbauen paralleler Strukturen verhindern möchte, ergeben sich hier Schwierigkeiten.<sup>6</sup>
Wird die Webseite weiter für den Mobilen Bereich (m./Domain/) getrennt entwickelt, sodass sie optimal auf einem Smartphone genutzt werden kann, so treten die oben genannten Probleme nicht auf. Allerdings impliziert dies die Notwendigkeit eine zweite Version für den Desktop-Markt zu entwickeln, sodass effektiv zwei Seiten entwickelt und gewartet werden müssten. Vorteilhaft bei zwei Versionen ist jedoch, dass bei der mobilen Version ein geringerer Overhead im Vergleich zur responsiven Seite entsteht, wodurch die Ladezeiten verringert werden können. Weiter sorgt dies auf leistungsschwächeren Endgeräten für einen Performance-Schub bei Interaktionen mit der Webseite. Solche Effekte auf die Erwartungskonformität sind nicht zu vernachlässigen. Wie Google 2009 auf der [O'Reilly Velocity Conferenz](http://conferences.oreilly.com/velocity/velocity2009/public/schedule/detail/8523){:target="_blank"} aufgezeigt hat, verringert sich die Zahl der Nutzer schon bei einer vergrößerten Wartezeit von etwa 400 ms um etwa 1 % in einem Zeitraum von 6 Wochen.<sup>3</sup>
Gerade bei Tablet-PCs sind heutzutage Bildschirmgrößen erreicht, die denen von (kleinen) Notebooks mehr gleichen als denen von Smartphones. Dadurch kann mit diesen Geräten auch auf „herkömmlichen“ Seiten wesentlich besser gesurft werden als auf Seiten, die für Smartphones optimiert worden sind.<sup>2, 4</sup>
### Fazit
Abschließend lässt sich festhalten, dass Responsive Webdesign Vor- und Nachteile hat. Je nach Leistungsfähigkeit der bevorzugten Endgeräte der Hauptzielgruppe sollte daher entschieden werden, ob auf Responsive Webdesign gesetzt wird. Zu beachten, sind ist dabei, ob es zu größeren Problemen hinsichtlich der Erwartungskonformität und Performance kommt, wobei im letzteren Fall die Entwicklung einer zusätzlichen mobilen Version der Webseite empholen wird.
Abschließend lässt sich festhalten, dass Responsive Webdesign Vor- und Nachteile hat. Je nach Leistungsfähigkeit der bevorzugten Endgeräte der Hauptzielgruppe sollte daher entschieden werden, ob auf Responsive Webdesign gesetzt wird. Zu beachten, ist dabei, ob es zu größeren Problemen hinsichtlich der Erwartungskonformität und Performance kommt, wobei im letzteren Fall die Entwicklung einer zusätzlichen mobilen Version der Webseite empholen wird.
<hr id="sources">
......
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