Was haben Achtsamkeit und Web- Usability gemeinsam

Transkript

1 Was haben Achtsamkeit und Web- Usability gemeinsam Welche Rolle spielt Achtsamkeit bei der Entwicklung von Webseiten? Was bringt die Konzentration auf das Wesentliche für das Nutzererlebnis? Und wann ist mehr besser? Berlin, stiftungen.org

2 Agenda TOP 01 Userverhalten 02 Usability 03 Start- und Webseite 05 Usability-Tests

3 Vorab: Achtsamkeit Hier steht Text Hier ebenfalls für eine Auflistung Nur ein Trend? Ausdruck unserer heutigen Zeit? Text 1 Text 2 Text 3 Versuch Kontrolle zurück zu gewinnen

4 Userverhalten 01 Wie nutzen wir das Web 02 So entscheiden wir 03 Wie entscheiden wir 04 Zwing mich nicht zum Denken 05 Wie erfassen wir eine Webseite? stiftungen.org

5 Wie nutzen wir das Web? Hier steht Text Hier ebenfalls für eine Auflistung Wir lesen nicht, wir überfliegen Wir wursteln uns durch und haben keine Ahnung, was wir machen oder was wir nutzen Text 1 Text 2 Text 3

6 So entscheiden wir Hier Wir steht treffen Text innerhalb von Millisekunden Hier unsere ebenfalls Entscheidung für eine Auflistung Text Ändert 1 sich nicht, wenn wir uns mehr Zeit Text nehmen 2 Text Ist der 3 erste Eindruck negativ, bleibt es dabei

7 Wie entscheiden wir Hier Wir steht haben Text ein Ziel oder Vorhaben Hier Wir ebenfalls treffen für keine Auflistung optimale Wahl Text Wir 1wägen nicht ab Text Wir 2wählen die erste annehmbare Option Text Wir 3wissen, dass wir nicht alles lesen müssen Falsche Entscheidungen haben keine Konsequenzen

8 Zwing mich nicht zum Denken Hier User steht will Textnicht (nach)denken Hier User ebenfalls wollen für eine es intuitiv Auflistungkapieren Text 1 Text 2 Je offensichtlicher desto besser Text Selbsterklärend 3 ist ok

9 Wie erfassen wir eine Webseite? Hier Skimming steht Text Scanning Text Reading 1 Hier ebenfalls für eine Auflistung Text 2 Text 3 Usability-Optimierung ist Suchmaschinen-Optimierung

10 Usability 01 Usability, User-Experience 02 Noch ein Wort zum Design 03 Warum ist das wichtig? 04 Der einfachste Weg zu guter Usability 05 Typische Usability-Fehler stiftungen.org 06 Nutzloses Weglassen

11 Usability, User-Experience Hier Usability: steht Text Gebrauchstauglichkeit oder Hier Benutzerfreundlichkeit ebenfalls für eine Auflistung Text Ist Qualitätsattribut: 1 Text Wie 2effektiv ist ein User-Interface Text User 3 Experience: Erweiterung um ästhetische und emotionale Faktoren (Joy of use)

12 Noch ein Wort zum Design Hier steht Text Hier Design ebenfalls ist für keine Auflistung Dekoration Text Design 1 erfüllt eine funktionale Aufgabe Text Stimmiges 2 Zusammenspiel von Funktion, Text Inhalt 3 und Design ist Voraussetzung gelungener Usability

13 Warum ist das wichtig? Hier steht Text Hier Usability ebenfalls für entscheidet eine Auflistung über Erfolg und Text Nichterfolg 1 Text Macht 2 alles einfacher, angenehmer, schneller Text Sorgt 3 für ein positives Erlebnis Baut Vertrauen auf

14 Der einfachste Weg zu guter Usability Hier steht Text Agile Entwicklung Hier ebenfalls für eine Auflistung Text 1 Text 2 Text 3

15 Typische Usability-Fehler Schlechte Suche Hier PDFs steht anstatt TextHTML-Seiten Hier Linkfarben ebenfalls wechseln für eine nicht Auflistung Links sind als solche nicht zu erkennen Text 1 Feste Schriftgrößen Text Ungeeignete 2 Schriften Text Inhalte 3 sehen wie Werbung aus (Bannerblindheit) Konvention werden ignoriert Neue Browser-Fenster/Tabs User-Fragen werden nicht beantwortet Nicht Plattform und Geräte übergreifend optimiert

16 Nutzloses weglassen Füllwörter Hier steht Text Happy Talk Hier Anleitungen ebenfalls für (besser: eine Auflistung kleine Tipps, Toolboxen, rechtzeitig) Text Strukturierende 1 Elemente (Linien, Ränder, Schatten) Text Kategorie-Icons 2 Text Verschiedene 3 Farbwelten Rauschen minimieren Nur Mehrwerte zählen

17 Start- und Webseite 01 Fokus auf die Startseite? 02 Was muss eine gute Startseite erfüllen 03 Benutzbare Webseite 04 Wann ist mehr besser? 05 Inhalte für das Web aufbereiten 06 Konsistenz stiftungen.org

18 Warum Fokus auf die Startseite Urknall der Seite Hier In steht der Regel Text am häufigsten besucht Hier Nach ebenfalls Einstieg für über eine Unterseite Auflistung erfolgt häufig Text Besuch 1 der Startseite Text 2 Text 3

19 Was muss eine gute Startseite erfüllen Identität und Auftrag (Slogan) Hier Hierarchie steht Text (Navigation) Hier Suchen ebenfalls für eine Auflistung Text Inhalts-Teaser 1 News-Teaser Text Features 2 vorstellen Text Registrierung 3 Abkürzungen Zeigen wonach (nicht) gesucht wird Vertrauen schaffen (Anzeigen)

20 Benutzbare Website ist Verständlich Hier steht Text Navigierbar Hier Durchsuchbar ebenfalls für eine Auflistung Text Browser- 1 und Geräte-Neutral Text (Mobile 2 First als Chance) Text Setzt 3auf Konventionen Barrierefrei

21 Wann ist mehr besser? Hier steht Text Hier (Anmelde)-Formulare ebenfalls für eine Auflistung Text Vorteile 1 (Mehrwerte) anzeigen Text Aufsplitten 2 in Schritte Text Wenn 3 Viel ein wichtiges Argument ist

22 Inhalte für das Web aufbereiten Einfache, klare Sprache Hier Viele steht Überschriften Text Kurze Absätze Hier ebenfalls für eine Auflistung Kurze Sätze Text Gliederungen 1 (Aufzählungen) Hierarchien nutzen Text 2 Hervorhebungen Text User führen 3 Was zusammengehört, verbinden Überschriften gehören an den Absatz Bilder, Grafiken zu Strukturierung nutzen Keine kleinen, kontrastarmen Schriften Keine Labels in Formularfeldern Links klassisch auszeichnen

23 Konsistenz Einheitliches Raster Hier steht Text Logikbrüche vermeiden Seitentitel wie in Link Text Breadcrumb 1 Text Bilder 2 konsistent einsetzen Text Klar 3definierte Bereiche Hier ebenfalls für eine Auflistung

24 Lösung für alle Usability-Fragen: Hier steht Text Hier ebenfalls für eine Auflistung Text 1 Die Realität Text 2 Text 3

25 Usability-Tests 01 Kofferraum-Test 02 A/B-Test 03 Design-Sprints 04 User-Test stiftungen.org

26 Kofferraum-Test Testperson wird in den Kofferraum gesteckt, durch die Gegend gefahren Hier steht Text und irgendwo auf der Webseite (Ausdruck) ausgesetzt. Hier ebenfalls für eine Auflistung Soll Text folgende 1 Fragen beantworten: Wie heißt die Seite Text 2 Wo bin ich Text In welcher 3 Hauptsektion (Navigation) bin ich Welche Optionen habe ich Gibt es einen Übersichtsplan Kann ich eine Suche starten

27 A/B-Test Ein Element/Funktion wird an einer Stelle geändert Hier steht Text Klare Abtrennung der Unterschiede Hier Entweder ebenfalls als für Lab-Test eine Auflistung oder über Software Text Auch 1als Multivarianten-Test möglich Text 2 Text 3

28 Design Sprint Design Thinking-Ansatz Hier steht Text von Google Ventures Hier Innerhalb ebenfalls von für einer eine Auflistung Text Woche 1 Ideen entwickeln und Testen Text 2 Text 3

29 User-Test Einfach selbst durchführbar Hier steht Text Sofort hochwertige Ergebnisse Hier Keine ebenfalls Software/Lab für eine nötig Auflistung Text 3 Teilnehmer 1 reichen Text 2 So geht s: Text Aufgabe 3 stellen Tester beim Lösen beobachten und begleiten Tester denkt laut

30 User-Test Beispielaufgabe Erstellen Sie ein Nutzerkonto Hier Loggen steht Sie Text sich mit einem existierenden Passwort und Hier Benutzernamen ebenfalls für ein eine Auflistung Rufen Sie ein vergessenes Passwort ab Text Rufen 1Sie einen vergessenen Usernamen ab Ändern Sie die Antwort auf eine Sicherheitsfrage Text 2 Text 3 Informieren Sie sich, welche Fördermöglichkeiten es gibt Wer kann Förderung beantragen Was wird für einen Antrag benötigt Wie stelle ich einen Antrag An wen kann ich mich wenden, wenn ich weitere Informationen benötige

31 User-Test Ablauf Hier Willkommen steht Text Einführung in den Test Hier ebenfalls für eine Auflistung Fragen stellen Text 1 Um den Tester kennenzulernen Text 2 Startseitentour Text Tester 3 schildert seinen Eindruck Die Aufgaben Der eigentliche Test

32 Danke Bundesverband Deutscher Stiftungen Mauerstraße Berlin Telefon +49 (0) stiftungen.org