Optimierung des Webauftritts einer NGO

Optimierung des Webauftritts einer Nichtstaatlichen
Organisation (NGO) am Beispiel von
Transparency International Deutschland e.V.

Präsentation des Konzepts von 31.05.2010
A. Ludwig, A. Matern, G. Thiede

Projektarbeit im Rahmen der Transnationalen Weiterbildung Wissens- und Contentmanagement 2009/10
C&Q Bildungszentrum Haberhauffe GmbH, Berlin

2
A. Ludwig, A. Matern, G. Thiede:
31.05.2010
Konzept zur Optimierung des Webauftritts einer Nichtstaatlichen Organisation (NGO)
am Beispiel von Transparency International Deutschland e.V.

Inhalt 1
• Aufgabe
• Ziele: Transparency Deutschland
• Kriterien für die Website-Analyse
• Kriterium Accessibility
• Kriterium Usability
• Kriterium Interestingness
• Fragebögen
• Ergebnisse der Website-Analyse

3
31.05.2010

Inhalt 2
• Von der Analyse zur Konzeption
• Layout
• Navigation
• Startseite
• Banner
• Suchfunktion
• Zusammenfassung
• Projektteam

4
31.05.2010

Aufgabe

• Optimierung der Website von Transparency Deutschland
• Kriterien dafür entwickeln
• Konkretes Konzept für Transparency Deutschland
erstellen

5
31.05.2010

Ziele: Transparency Deutschland

• Förderung der Kriminalprävention im Kampf gegen die
Korruption

• Öffentlichkeit über Erscheinungsformen und Probleme
der Korruption informieren

6
31.05.2010

Kriterien für die Website-Analyse

• Accessibility = Zugänglichkeit

• Usability = Gebrauchstauglichkeit

• Interestingness = eigentliche Inhalte
sind zentrale Bewertungsgrundlage für den Benutzer

7
31.05.2010

Kriterium Accessibility
„Darbietung der Inhalte an die menschliche
Aufnahmefähigkeit anpassen.“ ISO/TS 16071

• Erhöhte Zugänglichkeit schaffen
• Einhaltung von allgemeinen Richtlinien – z.B.
Web Content Accessibility Guidelines (WCAG) 2.0
des World Wide Web Consortium
• Prinzipien: wahrnehmbar, bedienbar, verständlich und
robust

8
31.05.2010

Kriterium Usability
„Usability eines Produkts ist das Ausmaß, in dem es von
einem bestimmten Benutzer verwendet werden kann, um
bestimmte Ziele in einem bestimmten Kontext effektiv,
effizient und zufriedenstellend zu erreichen.“ ISO 9241-11

Effektivität, Effizienz und Zufriedenstellung durch:
• gute Navigation
• gute Suchfunktion
• gute Gestaltung des Contents

9
31.05.2010

Kriterium Interestingness
Interesse über Inhalte wecken – die eigentlichen Inhalte
sind zentral. Sie werden zur Bewertungsgrundlage für
den Benutzer.

• Aktualität der Inhalte
• Stimmigkeit der Inhalte
• Glaubwürdigkeit durch seriöse Inhalte

10
31.05.2010

Fragebögen
• Aufschluss erhalten über Qualität der Usability
durch Auswertung von ausgesandten Fragebögen:

▫ Text ist verständlich, aber zu lang
▫ Farbgestaltung nicht zufriedenstellend
▫ Nutzer fühlen sich genügend informiert
▫ Finden über die Menüführung und die Suche nicht
ganz klar

11
31.05.2010

Ergebnisse der Website-Analyse
auf Basis der drei genannten Kriterien:

• Accessibility ist allgemein gegeben
• Gestaltung, Navigation und Suchfunktion sind nicht
zufriedenstellend
• Die Inhalte sind aktuell, stimmig und glaubwürdig

12
31.05.2010

Von der Analyse zur Konzeption
• vorher – nachher

▫ Layout
▫ Navigation
▫ Startseite
▫ Banner
▫ Suchfunktion

13
31.05.2010

Layout - vorher

 Statische Bildschirmbreite
800 x 600 Pixel
 Lesefluss ist gestört durch
Informationsfülle in einer
Spalte (Fließtext, Dokumente
und Hinweise)
 Herausfiltern der
benutzerrelevanten
Informationen ist erschwert

14
31.05.2010

Layout - nachher
 Minimale Bildschirmbreite
1024 x 768 Pixel (dynamisch)
 3-spaltiges Layout schafft
Raum:
- links: für Medienspiegel,
Pressemitteilungen und
weiterführende Informationen
(jeweils seitenbezogen)
- Mitte: Zentraler Fließtext
- rechts: in Banner ausgelagerte
Menüpunkte
 Meinungsbildung erleichtert

15
31.05.2010

Navigation - vorher

 Schriftgröße nicht veränderbar
 Vertikale Struktur der Menüleiste führt zu
Unübersichtlichkeit
 Auffinden der Inhalte erschwert durch
inkonsequente Benennung der Menüpunkte
 Wiederholung von gleichen Informationen
verwirren (z.B. Pressespiegel/-mitteilungen)
 Einzelne Menüpunkte stimmen teilweise mit
Inhalt nicht überein (Wissen, Mitgliedschaft/
Mitglieder, Pressespiegel/-mitteilungen)

16
31.05.2010

Navigation - Menüpunkte
Hauptmenü (vertikal) Hauptmenü (horizontal)
• Standpunkte • Start
• Wissen • Themen
• Regionen • Regionen
• Presse • Über Korruption
• Unterstützen • Über uns
• Über uns • Unterstützen
• Termine • Veranstaltungen

Hilfsmenüleiste (horizontal) Hilfsmenüleiste (horizontal)
• Home • Anmelden
• Suche • FAQ
• FAQ • TI International
• English • RSS-Symbol
• Kontakt • Kontakt
• RSS • Schriftgröße
• Mitgliederbereich • Suchformular

Fußzeile
• Impressum
• Datenschutz
• Sitemap

17
31.05.2010

Navigation - nachher

 Schriftgrößen-Button in Hilfsleiste platzieren
 Horizontale Menüleiste anlegen mit Breadcrumb-Navigation
 Neue inhaltliche Strukturierung der Menüleiste führt zu mehr Transparenz
und besserem Informationstransfer

18
31.05.2010

Startseite - vorher

 Accessibility 
 Kein Einführungstext auf
der Startseite
 Einstieg über aktuelle
Bezüge
 Relevanz durch aktuelle
Bezüge
 „Sender“ nicht sofort
erkennbar

19
31.05.2010

Startseite - nachher
 Links: Schlagzeilen als
Blickfang, Medienspiegel
und Pressemitteilungen
 Mitte: kurzer Text zu TI/D
und Zielen,
 ausgewählte aktuelle
Pressemitteilungen und
Veranstaltungen
 Transparenz durch kurze
Vorstellung des „Senders“

20
31.05.2010

Banner - vorher
Beispiel: Spende
 Verwirrende Angaben zum
Untermenü Spende
 Spendenbutton suggeriert
Zusammenhang zwischen
Spenden und Korruption

21
31.05.2010

Banner - nachher
Beispiel: Spende
 Zusammenfassung der wichtigsten
Informationen in einem Banner
 Banner ist auf jeder Seite zugänglich
(rechte Spalte)
 Das Untermenü Spende bleibt unter
Unterstützen erhalten.
 Keine Vermischung von Inhalt und
Spendenaufruf

22
31.05.2010

Suchfunktion - vorher
 Einfaches Formular
mit zwei Suchkriterien
 Keine Suchergebnisse
aus PDF-Dokumenten
 Separate Suche für
Pressespiegel und
Pressemitteilungen
 Suche nicht
ausreichend zum
Finden von allen
relevanten
Informationen

23
31.05.2010

Suchfunktion - nachher

 Größeres Suchformular
 Erweiterte Suchfunktion
▫ Zusammenfassung verschiedener Suchmöglichkeiten
▫ zielgruppengerechte Suche möglich
▫ Einbeziehung aller PDF-Dokumente
 Größere Transparenz durch effektivere Suche

24
31.05.2010

Zusammenfassung
Die Website sollte optimiert werden auf Grundlage der
drei benannten Kriterien Accessibility, Usability und
Interestingness:
• Horizontale Hauptnavigation: bessere Orientierung
• Erweiterte Suchfunktion: effektiv und zielgenau
• 3-spaltiges Layout: schneller Zugriff auf gewünschte
Informationen
• Neue Startseite: Organisation wird für Nutzer
transparent

25
31.05.2010

Herzlichen Dank…
für Ihre Aufmerksamkeit vom Projektteam:

• Angelika Ludwig
mail@kultur-scout.de, +49 30 883 96 23

• Andreas Matern
mail@andreas-matern.de, +49 30 61 30 78 92

• Gabriele Thiede
g.thiede@online.de, +49 30 775 99 14

26
31.05.2010

Quellen
• Transparency International Deutschland e. V.
• ISO/TS 16071, Web Content Accessibility Guidelines (WCAG) 2.0, ISO 9241
• useit.com: Jakob Nielsen's Website
• WAVE - Web Accessibility Evaluation Tool
• Institut für Software-Ergonomie und Usability
• Martin Beschnitt. Usability-Guidelines: Teil 1 – Definition & Abgrenzung.
Usabilityblog.de
• Jan Alexander & Marsha Ann Tate. Evaluate Web Pages. Wolfgram Memorial
Library, Widener University
• Felix Schwenzel. Vergessen Sie Suchmaschinenoptimierung - Optimieren Sie Ihre
Website. E-Marketing Forum, Xinnovations 2009
• 7 Factors that Separate Good Websites from Bad Websites. Vandelay Design Blog

Optimierung des Webauftritts einer NGO

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (16)

Optimierung des Webauftritts einer NGO