(2002/January/31) In the following, i point some usability problems with wikipedia and suggest solutions for them. Please:
- Take it with a grain of salt. Usability is not my main area.
- Some programmers get angry when other comment their works, hope it's not the case for wikipedia programmers.
- I've seen you don't like newbies to criticize the system. I'm not criticizing the whole thing, just the ui.
- Feel free to answer or add items in this page. Please put your name and the date.
The anatomy of a Wikipedia Web page seems to be the following:
TITLE USERNAME LOGO CREDIT MENU_USER_OPERATIONS MENU_ARTICLE_OPERATIONS SEARCH_BOX ... MENU_NAVIGATION MENU_SIDEBAR_1 ... MENU_SIDEBAR_2 CONTENT ... LINK_OTHER_NAMESPACES MENU_NAVIGATION PAGE_STATISTICS LINK_OTHER_NAMESPACES LAST_EDITED SEARCH_BOX VALIDATE_LINK
Most of the usability issues i've seen are related to visual cluter, specifically because not all visual zones in the page are distinctively separated from other areas.
MENU_NAVIGATION too close to CONTENT
Problem: It's very close to the CONTENT, it tends to create a poor visualization, specially when the first or last lines of the text contain links.
Solution: Use a different color, or a different background, or a different font, or don't put it so close, or separate it with a hrule.
Problem: The MENU_NAVIGATION includes items that are independent from context (main, recent, random, specials) and one item that is dependent from context (edit this page)
Solution: Move "edit this page" to MENU_ARTICLE_OPERATIONS. It should be in bold there, as the first item (or as the last item) to be very prominent. The link should disappear from MENU_SIDEBAR_1, or be put there as a separate, prominent item.
Everything below the bottom MENU_NAVIGATION is poorly spaced
Problem: Below MENU_NAVIGATION, everything looks like a pudding of letters.
Solution: Some whitespace will greatly improve it. The "Validate this Page" is not necessary (you can take the parser output, then pass it through HTML tidy and then parse it back to wiki tags, that way you are sure pages are valid if your templates are valid). The search box at the bottom is not necessary, because the top search box is very prominent. At the very bottom of the page (separated from the rest, in small font and/or italics) a short statement about policies can be put like "This is a community project, see: Welcome to Wikipedia" or something like the bottom bar in dmoz.
- I don't think that HTML Tidy always works very well as an automatic device. I agree with you about the community project explanation. -- Toby Bartels 2002/05/14
Links to other namespaces should be underlined
Problem: the "other namespaces" link is not underlined, and it's red, indicating something dangerous or wrong.
Solution: It should be underlined and in a different color: blue, magenta, orange, or anything but not red or green).
- This link looks the same as links within the article. Depending on how you've set your user preferences, this may be blue and underlined if it exists, and red and ununderlined if it doesn't exist. I like this feature of knowing whether or not an article exists yet. -- Toby Bartels 2002/05/14
Watchlist usability be improved
Problem: "Watch this article for me" and "My watchlist" labels are not consistent. Watchlist is a user-associated feature but it appears in a global menu.
Solution: Change "Watch this article for me" to "Add to My Watchlist", move "My Watchlist" to the MENU_USER_OPERATIONS. This way, all in MENU_SIDEBAR_2 is not user-dependant.
Editor bottom has too much cluter
Problem: The copyleft notice is not clearly separated from text, i think sometimes can be "unnoticed". The Save and Preview buttons plus the Return without saving changes link are inconsistent.
Solution: Separate the copyleft notice, or put it with a different background. There should be a SAVE, PREVIEW and CANCEL button. That is easy to understand for all users.
Some inconsistencies in MENU_SIDEBAR_1 and MENU_SIDEBAR_2
Problem: MENU_SIDEBAR_1 looks very similar to MENU_NAVIGATION, but sometimes differ. That is confusing. MENU_SIDEBAR_2 labels are not consistent.
Solution: Make MENU_SIDEBAR_1 equivalent to MENU_NAVIGATION, or different. MENU_SIDEBAR_2 could be something more related with "Pages", like "Pages: All, Most Wanted, Newer, Random, All, Wikipedians"
Clean look is a good thing
In my opinion, the clean, iconless look Wikipedia has is a good thing, keep it this way in future. Don't put too much features, icons, or text.
Eliminate features that take too much CPU
Performance is bad in the newer release. Maybe is some special page that is taking too much CPU, sacrifice for the sake of performance.
Customize through stylesheet
Customizing the user interface through a stylesheet is very easy. In particular,there could be a stylesheet for visually impaired people, another for heavy editors (that need many text in a single page), etc.
The upload thing is an important feature
I supose the idea of a global upload is a quick-and-dirty solution to something more deep, that is the idea of attach resources to particular articles. I think this is important, as it will be easier for a user to upload a file to a space that is more associated with a single article than global.