Wikipedia wird gerade überarbeitet, um die Benutzererfahrung zu verbessern.

Jeder kann eine Vorschau dieses Redesigns von Erstellen eines Kontos, Einloggen und dann auf den Link "Test Beta" oben rechts auf jeder Seite klicken.

Die "Wikipedia Usability Initiative" wurde in zwei Phasen unterteilt. Phase 1 war die Prototyp-Phase und endete im Sommer 2009.

Das Projektteam befindet sich derzeit in der zweiten Phase, der Entwicklungs- und Testphase.

Das Projekt wurde ebenfalls in vier geteilt Releases ; Zum Zeitpunkt der Abfassung dieses Artikels befindet sich die zweite Veröffentlichung (Babaco) in der Entwicklung.

In diesem Artikel werden wir über die Designänderungen von Wikipedia und die Gründe dafür diskutieren.

Die Wikipedia Usability Initiative soll im Frühjahr 2010 fertig sein. Weitere Informationen zum Projekt finden Sie hier Hier .

Das Redesign ist auf Benutzerfreundlichkeit ausgerichtet . Obwohl keine drastischen Änderungen vorgenommen wurden, ist das gesamte Erscheinungsbild der Website viel sauberer und moderner. Die überarbeitete Bearbeitungsschnittstelle ist ein wichtiges Upgrade, auf das sich die Wikipedia-Redakteure sicherlich freuen werden.

Wie bei vielen kleinen Operationen verfügt Wikipedia nicht über das Budget, um systematisch zu testen, wie Besucher die Website nutzen. Stattdessen stützt es sich auf Feedback von Benutzern, um Probleme zu lokalisieren und zu beheben.

Aufgeräumt

Unser erster Eindruck vom Beta-Redesign ist, dass es ziemlich scharf und ordentlich aussieht. Das Layout ist immer noch das gleiche; Dieses Redesign wird wahrscheinlich nicht die gleiche Empörung hervorrufen Facebook gerührt mit seiner Neugestaltung im März 2009.

Die offensichtlichste Änderung besteht darin, dass die verschiedenen Komponenten auf der Seite nicht länger auf ihre eigene Box beschränkt sind. Die Bereiche für Navigation und Hauptinhalte sind nicht geschlossen und erstrecken sich bis zum Rand des Browserfensters.

Die andere offensichtliche Änderung ist, dass Wikipedia das Hintergrundbild des offenen Buches zurückgezogen hat. Dies räumt das Design deutlich auf und lässt das Logo deutlich schärfer aussehen.

Altes Design:


Neues Design:

Leichte Farbänderung

Insgesamt sieht das neue Design weicher aus . Die Navigationslinks in der linken Seitenleiste sind jetzt etwas größer und leichter zu lesen. Die Link-Farben wurden leicht verändert, um sie weniger dynamisch zu machen.

Die alte Linkfarbe (links) im Vergleich zur neuen Linkfarbe (rechts):


Die alte besuchte Linkfarbe (links) gegenüber der neuen (rechts):

Wenn Sie die Farbe des besuchten Links von Violett nach Dunkelblau ändern, wird die Website moderner. Es vereinfacht auch das Farbschema und macht den Auftritt professioneller.

Suche nach Relocation der Suche

Die einzige Änderung, die regelmäßige Besucher stolpern könnte, ist die Verlagerung der Suchleiste.

Es ist nicht mehr in der Mitte des Navigationsbereichs eingebettet. Es wurde oben rechts auf der Seite verschoben. Dieses Placement ist auf vielen Websites zum Standard geworden und dort, wo Menschen zuerst suchen, wenn sie eine Suche durchführen möchten.

Der neue Ort der Suchleiste:

Reorganisierte Registerkarten

Die Registerkarten wurden ebenfalls neu organisiert. Sie haben ein neues Aussehen bekommen und sind jetzt leichter zu erkennen. Die Aufteilung in zwei Gruppen macht ihre Struktur logischer. Die verblasste Oberseite der Registerkarten öffnet auch die Seite.

Altes Design:


Neues Design:

Seitenbearbeitung

Die neue Seitenbearbeitungsoberfläche ist wunderbar. Die Mischung aus Text- und Grafiksymbolen und die Gruppierung von Bearbeitungsoptionen erleichtern die Bearbeitung erheblich.

Um herauszufinden, was jede Schaltfläche zuvor getan hat, musste der Benutzer über das nicht intuitive Symbol fahren und warten, bis der Tooltip angezeigt wird. nicht länger. Und das neue Feld rechts neben dem Textbereich hilft Benutzern beim Navigieren durch die Seite.

Alte Bearbeitungsschnittstelle:


Neue Bearbeitungsschnittstelle:


Um die neuen Funktionen zu aktivieren, gehen Sie zu "Einstellungen" und klicken Sie dann auf die Registerkarte "Bearbeiten". Ganz unten finden Sie einige Kontrollkästchen mit der Aufschrift "Experimental".

Aktivieren der experimentellen Funktionen:


Die neueste Version enthält neue Dialogfelder zum Einfügen von Links und Tabellen. Da der Textbereich ein wenig überladen sein kann, sind diese Dialogfelder hilfreich, um Benutzern zu helfen, sich jeweils auf eine Aufgabe zu konzentrieren.

Das Tabellendialogfeld könnte mehr Funktionalität bieten (z. B. das Bearbeiten des Inhalts von Tabellenzellen), aber diese Version befindet sich noch in der Entwicklung. Daher werde ich abwarten, ob noch weitere Features hinzugefügt werden, bevor Features auf meine Wunschliste hinzugefügt werden.

Das Dialogfeld zum Einfügen eines Links:

Das Dialogfeld zum Einfügen einer Tabelle:

Was fehlt?

Da das Projekt noch im Beta-Stadium ist, ist jetzt die beste Zeit, um Vorschläge zu machen, was noch getan werden kann, um die Benutzeroberfläche von Wikipedia zu verbessern. Hier sind meine Ideen:

  • AJAX BeautyTip Vorschau auf Link-Hover
    Es wäre nett, wenn ein Tooltip erscheint, über die BeautyTip jQuery-Plug-in, wann immer Sie über einen internen Link schwebten. Der Tooltip würde den ersten Absatz des verknüpften Artikels enthalten. Die Erhöhung der Bandbreite von dieser Funktion könnte zu groß sein, aber ich würde es trotzdem gerne testen sehen.
  • Syntax-Färbung im Bearbeitungstextbereich
    Mit Code in der gleichen Farbe zu arbeiten ist sehr schwierig. Das menschliche Auge muss den Text linear scannen, um ihn zu finden. Visuelle Hinweise wären eine große Hilfe. Während wir dabei sind, sollte der Textbereich auch eine horizontale Bildlaufleiste haben, damit Dinge wie Tabellen im Code schöner aussehen.
  • Option, um Körpertext mit fester Breite zu haben
    Wenn ich eine lange Textpassage lese, maximiere ich gerne mein Fenster, um Ablenkungen zu minimieren. So wie es ist, kann ich das nicht, weil die Textzeilen breiter werden als mein Breitbildmonitor. Ich würde gerne in der Lage sein, die Breite von Absätzen auf etwa 600 Pixel festzulegen, um das Lesen zu erleichtern.
  • Erhöhen Sie das visuelle Gewicht des "Go" -Buttons
    Die einzige Änderung, gegen die ich bin, ist, dass der "Go" -Knopf das gleiche Gewicht wie der "Search" -Button hat. Das alte Design hat den "Go" -Button-Text etwas schwerer gewichtet, was deutlich macht, dass das Drücken der "Enter" -Taste dasselbe war wie das Klicken auf den "Go" -Button. Der Gewichtsunterschied war klein genug, dass die Benutzer den Unterschied nur sehen konnten, wenn sie direkt darauf schauten. Dies sollte zurückgebracht werden.

Versuch es!

Das neue Design sieht ziemlich gut aus, aber es ist noch nicht fertig. Ich bin mir sicher, dass das Team der Usability-Initiative von Wikipedia jedem gefallen würde, der die Beta ausprobiert und Feedback sendet.

Wikipedia ist von seinen Nutzern abhängig, um herauszufinden, wie die Website verbessert werden kann. Ich bin sicher, dass die Webdesigner-Depot-Community einige großartige Ideen einbringen kann.

Zuletzt, überlege Spenden an Wikipedia . Weil man darüber lesen kann alte Nintendo-Spiele ohne Evony-Werbung ist die Seite recht nett.


Geschrieben exklusiv für WDD von Eli Penner .

Was denkst du über das kommende Design von Wikipedia? Wie würdest du das Design verbessern?