SlideShare ist ein Scribd-Unternehmen logo
Usability in 
(geistes-)wissenschaftlichen 
Onlinedatenbanken 
Aline Deicke (Aline.Deicke@adwmainz.de) 
Akademie der Wissenschaften und der Literatur | Mainz 
www.digitale-akademie.de
Leitfragen Workshop 
1. Welche Anforderungen stellen Nutzer geisteswissenschaftlicher 
Forschungsinfrastrukturen an die Benutzbarkeit von Tools und 
Services? 
2. Welche Regeln oder Standards für gute Usability sollten 
zugrunde gelegt werden? 
3. Welche Verfahren für deren Überprüfbarkeit können von 
Betreibern und Entwicklern von Forschungsinfrastrukturen 
angewendet werden? 
4. Wie kann Usability einzelner Tools und Workflows im 
Vergleich zu einem neugeschaffenen Ökosystem einer virtuellen 
Infrastruktur bewertet und optimiert werden? 
5. Wie kann der Aspekt der Usability mittel- und langfristig 
stärker in DH-Projekten berücksichtigt werden? 
6. Wie stark werden Usability-Aspekte bei der Software- 
Entwicklung in DH-Projekten berücksichtigt?
Einleitendes
Usability - Definitionen 
http://www.germanupa.de/data/mediapool/germanupa_the-usability-ux-profession.pdf
Usability - Definitionen 
“Usability means making sure something works well, and that 
a person of average ability or experience can use it for its 
intended purpose without getting hopelessly frustrated.” 
Steve Krug, Don’t make me think 
• Don‘t make me think (Krug’s first law of usability) 
• KISS - Keep it simple, stupid
„Nutzeranalyse“ DH 
• Sehr variabel (digital native bis silver surfer) 
• Experten und Laien 
• Hochmotiviert, aufmerksamkeitswillig 
• bereit, sich auch bei Schwierigkeiten mit Seite/Anwendung zu 
beschäftigen 
Herausforderungen 
• Komplexe, oft neuartige Applikationen mit großen, komplex 
strukturierten Informationsmengen 
• Lange, intensive Beschäftigung mit Seiten gewünscht/notwendig 
• Einzigartige, vielfältige Inhalte
Usability in der Praxis 
http://www.webdesign.org/vital-website-usability-checklist-you-can-t-ignore.22304.html
Konzeption / Informationsarchitektur 
www.adwmainz.de
Methoden 
• Anforderungsspezifikationen 
• Flowcharts 
• Wireframes
Design - Layout 
• Einfachheit/simplicity (no clutter) und Konsistenz 
• Wichtige Informationen prominent platziert, Gruppierung von 
Informationen → visuelle Hierarchie 
• Navigation (main, secondary, breadcrumbs): klar, gut organisiert, 
nicht zu prominent 
• Boring is good → Bekanntes wird wieder erkannt, daher 
Konventionen nutzen (user patterns) 
www.sensible.com/dmmt.html
Design 
www.gluck-gesamtausgabe.de
Programierung/Interaction Design 
• Verhalten user agent nicht grundlegend ändern/beeinflussen 
• The small HTML-stuff: placeholder, title-tags, alle klar und 
konzise; meta-description; etc. 
• CSS3, HTML5 
• Progressive Enhancement oder Graceful Degradation 
• Sprechende URLS, URL-redirection 
• Keine kaputten Links 
• Dateigrößen reduzieren (Minimieren, sauberer Code, 
komprimierte Bilder, Sprites, Icon fonts, etc.)
Beispiel: Suchen 
www.regesta-imperii.de
Beispiel: Suchen
Accessibility 
• Usability = Accessibility 
• Inhalte: Klar, konzise, verständlich auch ohne visuelle Hinweise (z. B. 
Bildunterschriften, semantische Tabellen) 
• Design: Kontrast, Farbe nicht als alleiniger Informationsträger, 
Lesbarkeit 
• CSS/HTML: WAI-ARIA, semantisches HTML, Seite auch funktional 
ohne CSS und javascript, barrierefreies javascript, alt-Attribute, 
keine versteckten Inhalte, etc. 
• Keyboard-accessible Navigation, kein Override von keyboard 
shortcuts oder andere Änderungen im Verhaltens des user agents 
• Links, Buttons, Checkboxes sollten leicht klickbar sein 
• Erklärende Linktexte (Nicht “click here”) 
• …
Responsive Design 
www.controversia-et-confessio.de 
• responsive site vs. App: 
o Inwiefern kann meine Anwendung auch auf anderen Geräten 
funktionieren? Was sind mögliche use cases? Inwieweit kann 
ich Funktionalitäten übertragen? 
• Mobile First-Contentstrategien 
• CSS3/HTML5 + javascript 
• …
Außerdem… 
• Dokumentation 
• Performance (Mobile!) 
• Lokalisierung 
• Cross-Browser-Testing 
• … 
http://tophatwordandindex.wordpress.com/2013/11/ 
25/document-usability-pt-3-identifying-challenges-for-government- 
business/
Vielen Dank für ihre Aufmerksamkeit! 
Steve Krug, Don’t make me think (New Riders 2014) 
http://www.nngroup.com/topic/web-usability/ 
http://www.smashingmagazine.com/tag/usability/ 
http://alistapart.com/topic/usability 
http://alistapart.com/topics/user-experience 
http://www.usability.gov/ 
http://www.w3.org/standards/webdesign/accessibility 
https://uxpa.org/ 
http://www.uxbooth.com 
https://userium.com/

Weitere ähnliche Inhalte

Ähnlich wie Usability in (geistes-)wissenschaftlichen Onlinedatenbanken

JP│KOM:Relaunch Corporate Website
JP│KOM:Relaunch Corporate WebsiteJP│KOM:Relaunch Corporate Website
JP│KOM:Relaunch Corporate Website
JP KOM GmbH
 
Responsive Content Experience
Responsive Content ExperienceResponsive Content Experience
Responsive Content Experience
Peter Rozek
 
Wettbewerbsanalyse alle an Bord beim Relaunch
Wettbewerbsanalyse alle an Bord beim RelaunchWettbewerbsanalyse alle an Bord beim Relaunch
Wettbewerbsanalyse alle an Bord beim Relaunch
Alexander Keller
 
Fallstudie Card Sorting HKK
Fallstudie Card Sorting HKKFallstudie Card Sorting HKK
Fallstudie Card Sorting HKKeResult_GmbH
 
Usability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
Usability / Designtrends in Kommunalen Internetportalen - Nicole ArmbrusterUsability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
Usability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
City & Bits GmbH
 
Google Tools für Fotografen
Google Tools für FotografenGoogle Tools für Fotografen
Google Tools für Fotografen
PARX
 
Erfolgsfaktoren der Wikieinführung in KMU
Erfolgsfaktoren der Wikieinführung in KMUErfolgsfaktoren der Wikieinführung in KMU
Erfolgsfaktoren der Wikieinführung in KMU
Martin Koser
 
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
Ponton-Lab GmbH
 
Online besser-nutzerfreundlich
Online besser-nutzerfreundlichOnline besser-nutzerfreundlich
Online besser-nutzerfreundlichArno Karrasch
 
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AGCCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
Communardo GmbH
 
Collaboration Days 2011 - Document Management à la carte
Collaboration Days 2011 - Document Management à la carteCollaboration Days 2011 - Document Management à la carte
Collaboration Days 2011 - Document Management à la carteDavid Schneider
 
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 Zürich
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 ZürichVernetzte Organisation ICT Tweet’n Greet 9.4.2014 Zürich
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 ZürichAlexander Richter
 
Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010
SharepointUGDD
 
DNUG Dresden Blend
DNUG Dresden BlendDNUG Dresden Blend
DNUG Dresden BlendMartin Hey
 
GUIs mit Expression Blend
GUIs mit Expression BlendGUIs mit Expression Blend
GUIs mit Expression Blend
.NET User Group Dresden
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Stephan Hamberger
 
Benchlearning Projekt Social Intranet 2012 (#blp12)
Benchlearning Projekt Social Intranet 2012 (#blp12)Benchlearning Projekt Social Intranet 2012 (#blp12)
Benchlearning Projekt Social Intranet 2012 (#blp12)
Cogneon Akademie
 
Berufsbild Konzepter (2015)
Berufsbild Konzepter (2015)Berufsbild Konzepter (2015)
Berufsbild Konzepter (2015)
Stefan Freimark
 
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussenWebinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
kuehlhaus AG
 
Bozen Summerschool Digital Libraries
Bozen Summerschool Digital LibrariesBozen Summerschool Digital Libraries
Bozen Summerschool Digital Libraries
René Schneider
 

Ähnlich wie Usability in (geistes-)wissenschaftlichen Onlinedatenbanken (20)

JP│KOM:Relaunch Corporate Website
JP│KOM:Relaunch Corporate WebsiteJP│KOM:Relaunch Corporate Website
JP│KOM:Relaunch Corporate Website
 
Responsive Content Experience
Responsive Content ExperienceResponsive Content Experience
Responsive Content Experience
 
Wettbewerbsanalyse alle an Bord beim Relaunch
Wettbewerbsanalyse alle an Bord beim RelaunchWettbewerbsanalyse alle an Bord beim Relaunch
Wettbewerbsanalyse alle an Bord beim Relaunch
 
Fallstudie Card Sorting HKK
Fallstudie Card Sorting HKKFallstudie Card Sorting HKK
Fallstudie Card Sorting HKK
 
Usability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
Usability / Designtrends in Kommunalen Internetportalen - Nicole ArmbrusterUsability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
Usability / Designtrends in Kommunalen Internetportalen - Nicole Armbruster
 
Google Tools für Fotografen
Google Tools für FotografenGoogle Tools für Fotografen
Google Tools für Fotografen
 
Erfolgsfaktoren der Wikieinführung in KMU
Erfolgsfaktoren der Wikieinführung in KMUErfolgsfaktoren der Wikieinführung in KMU
Erfolgsfaktoren der Wikieinführung in KMU
 
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
Präsentation für den Workshop "Schreiben fürs Web/Optimierung der Usability"
 
Online besser-nutzerfreundlich
Online besser-nutzerfreundlichOnline besser-nutzerfreundlich
Online besser-nutzerfreundlich
 
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AGCCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
CCD 2012: Wissensmanagement @MPS - Sören Krasel, Daimler AG
 
Collaboration Days 2011 - Document Management à la carte
Collaboration Days 2011 - Document Management à la carteCollaboration Days 2011 - Document Management à la carte
Collaboration Days 2011 - Document Management à la carte
 
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 Zürich
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 ZürichVernetzte Organisation ICT Tweet’n Greet 9.4.2014 Zürich
Vernetzte Organisation ICT Tweet’n Greet 9.4.2014 Zürich
 
Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010
 
DNUG Dresden Blend
DNUG Dresden BlendDNUG Dresden Blend
DNUG Dresden Blend
 
GUIs mit Expression Blend
GUIs mit Expression BlendGUIs mit Expression Blend
GUIs mit Expression Blend
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
 
Benchlearning Projekt Social Intranet 2012 (#blp12)
Benchlearning Projekt Social Intranet 2012 (#blp12)Benchlearning Projekt Social Intranet 2012 (#blp12)
Benchlearning Projekt Social Intranet 2012 (#blp12)
 
Berufsbild Konzepter (2015)
Berufsbild Konzepter (2015)Berufsbild Konzepter (2015)
Berufsbild Konzepter (2015)
 
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussenWebinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
Webinar: Content UX - Wie Inhalte ihren Internetauftritt beeinflussen
 
Bozen Summerschool Digital Libraries
Bozen Summerschool Digital LibrariesBozen Summerschool Digital Libraries
Bozen Summerschool Digital Libraries
 

Usability in (geistes-)wissenschaftlichen Onlinedatenbanken

  • 1. Usability in (geistes-)wissenschaftlichen Onlinedatenbanken Aline Deicke (Aline.Deicke@adwmainz.de) Akademie der Wissenschaften und der Literatur | Mainz www.digitale-akademie.de
  • 2. Leitfragen Workshop 1. Welche Anforderungen stellen Nutzer geisteswissenschaftlicher Forschungsinfrastrukturen an die Benutzbarkeit von Tools und Services? 2. Welche Regeln oder Standards für gute Usability sollten zugrunde gelegt werden? 3. Welche Verfahren für deren Überprüfbarkeit können von Betreibern und Entwicklern von Forschungsinfrastrukturen angewendet werden? 4. Wie kann Usability einzelner Tools und Workflows im Vergleich zu einem neugeschaffenen Ökosystem einer virtuellen Infrastruktur bewertet und optimiert werden? 5. Wie kann der Aspekt der Usability mittel- und langfristig stärker in DH-Projekten berücksichtigt werden? 6. Wie stark werden Usability-Aspekte bei der Software- Entwicklung in DH-Projekten berücksichtigt?
  • 4. Usability - Definitionen http://www.germanupa.de/data/mediapool/germanupa_the-usability-ux-profession.pdf
  • 5. Usability - Definitionen “Usability means making sure something works well, and that a person of average ability or experience can use it for its intended purpose without getting hopelessly frustrated.” Steve Krug, Don’t make me think • Don‘t make me think (Krug’s first law of usability) • KISS - Keep it simple, stupid
  • 6. „Nutzeranalyse“ DH • Sehr variabel (digital native bis silver surfer) • Experten und Laien • Hochmotiviert, aufmerksamkeitswillig • bereit, sich auch bei Schwierigkeiten mit Seite/Anwendung zu beschäftigen Herausforderungen • Komplexe, oft neuartige Applikationen mit großen, komplex strukturierten Informationsmengen • Lange, intensive Beschäftigung mit Seiten gewünscht/notwendig • Einzigartige, vielfältige Inhalte
  • 7. Usability in der Praxis http://www.webdesign.org/vital-website-usability-checklist-you-can-t-ignore.22304.html
  • 9. Methoden • Anforderungsspezifikationen • Flowcharts • Wireframes
  • 10. Design - Layout • Einfachheit/simplicity (no clutter) und Konsistenz • Wichtige Informationen prominent platziert, Gruppierung von Informationen → visuelle Hierarchie • Navigation (main, secondary, breadcrumbs): klar, gut organisiert, nicht zu prominent • Boring is good → Bekanntes wird wieder erkannt, daher Konventionen nutzen (user patterns) www.sensible.com/dmmt.html
  • 12. Programierung/Interaction Design • Verhalten user agent nicht grundlegend ändern/beeinflussen • The small HTML-stuff: placeholder, title-tags, alle klar und konzise; meta-description; etc. • CSS3, HTML5 • Progressive Enhancement oder Graceful Degradation • Sprechende URLS, URL-redirection • Keine kaputten Links • Dateigrößen reduzieren (Minimieren, sauberer Code, komprimierte Bilder, Sprites, Icon fonts, etc.)
  • 15. Accessibility • Usability = Accessibility • Inhalte: Klar, konzise, verständlich auch ohne visuelle Hinweise (z. B. Bildunterschriften, semantische Tabellen) • Design: Kontrast, Farbe nicht als alleiniger Informationsträger, Lesbarkeit • CSS/HTML: WAI-ARIA, semantisches HTML, Seite auch funktional ohne CSS und javascript, barrierefreies javascript, alt-Attribute, keine versteckten Inhalte, etc. • Keyboard-accessible Navigation, kein Override von keyboard shortcuts oder andere Änderungen im Verhaltens des user agents • Links, Buttons, Checkboxes sollten leicht klickbar sein • Erklärende Linktexte (Nicht “click here”) • …
  • 16. Responsive Design www.controversia-et-confessio.de • responsive site vs. App: o Inwiefern kann meine Anwendung auch auf anderen Geräten funktionieren? Was sind mögliche use cases? Inwieweit kann ich Funktionalitäten übertragen? • Mobile First-Contentstrategien • CSS3/HTML5 + javascript • …
  • 17. Außerdem… • Dokumentation • Performance (Mobile!) • Lokalisierung • Cross-Browser-Testing • … http://tophatwordandindex.wordpress.com/2013/11/ 25/document-usability-pt-3-identifying-challenges-for-government- business/
  • 18. Vielen Dank für ihre Aufmerksamkeit! Steve Krug, Don’t make me think (New Riders 2014) http://www.nngroup.com/topic/web-usability/ http://www.smashingmagazine.com/tag/usability/ http://alistapart.com/topic/usability http://alistapart.com/topics/user-experience http://www.usability.gov/ http://www.w3.org/standards/webdesign/accessibility https://uxpa.org/ http://www.uxbooth.com https://userium.com/

Hinweis der Redaktion

  1. Grundsätze der menschzentrierten Gestaltung gemäß ISO EN ISO 9241: Die Gestaltung basiert auf einem umfassenden Verständnis der Benutzer, Aufgaben und Arbeitsumgebungen Benutzer sind während der Gestaltung und Entwicklung einbezogen Das Verfeinern und Anpassen von Gestaltungslösungen wird fortlaufend auf der Basis benutzerzentrierter Evaluierung vorangetrieben Der Prozess sieht Iterationen vor Bei der Gestaltung wird die gesamte User Experience berücksichtigt Das Gestaltungsteam vereint fachübergreifende Kenntnisse und Gesichtspunkte
  2. Strukturierung der Informationen Welche Inhalte kommen wohin? Welche Funktionalitäten und Aktionen soll es geben? Wieviele und welche Seiten/Ansichten soll es geben, wie sind sie verknüpft? Wie ist die Seite gegliedert (Hauptnavigation)? Sind wichtige Informationen entsprechend gekennzeichnet und einfach zu erreichen? (Kernangebot, Kontakt, Hilfe) Potentielle Fragen erkennen und vermeiden Orientierung (trunk test), z. B. durch klar benannte, übersichtliche Navigation, breadcrumbs Flache Hierarchien (2-/3-click-rule) Ist die Seite für Erst- und wiederkehrende Nutzer nutzbar? 404-Seite mit klaren Instruktionen
  3. Anforderungsspezifikationen: Zielgruppe festlegen Bedürfnisse des spezifischen Projekts ermitteln (je nach Fachdisziplin/Art des gewünschten Angebots/der gewünschten Applikation, etc.) Fachtermini definieren
  4. Typographie (Schriftgröße, Kontrast, Schriftenwahl, Weißraum, visuelle Hierarchie) Kontrast und Farbe (Informationen nicht nur durch Farbe/Ton gekennzeichnet) Buttons und links (einfach erkennbar, link states) Visuelle Hinweise bzw. Feedback (call to action, link states) Formulare: Labels (Benennung), placeholder, klare Fehlermeldungen, nicht komplexer als benötigt Make it easy to go home (z. B. durch Logo als Home-Link) Animation, video, audio, pop-ups sparsam einsetzen
  5. Einfache Suche, Expertensuche, Hybridversionen Relevanz von Suchkriterien AND/OR, „Google-Suche“ DB-Suche von allen DB-Seiten aus erreichbar Design Suchbox (groß genug, placeholder, Beispielsuchanfragen) Auto-correct/auto-complete Hilfe: Kurz, bei Bedarf, nicht zu übersehen