Wiki Team/Roadmap/Wiki skin redesign

< Wiki Team‎ | Roadmap
Revision as of 02:28, 12 March 2010 by FGrose (talk | contribs)

Design goals

From Bernie in this discussion thread, "I'd like our linkbar to be:

  1. consistent in style across all webapps (maybe also in content)
  2. reminiscent of Sugar's UI elements or colors
  3. in harmony with the look of all our sites
  4. maybe well detached from the rest of the page (like the gnome one)
  5. written in very tidy html + css for easily maintainability
  6. free of frames/iframes, marquees and non-standard html crap
  7. perfectly readable in text-only browsers, even without css
  8. ordered the same way across all sites (= easy to memorize)
  9. wrapping nicely on small screens

These are just my personal wishes, not strict requirements. ...

wiki-devel test design

http://wiki-devel.sugarlabs.org/

Design discussion

Please use this space to share, respond to, and refine comments, in context within the topical areas.

Linkbar

  1. Consider using a larger/different typeface to better distinguish these inter-site links from the personal wiki navbar links on the same, top line and on the right of the page.
  2. Hover underscore length - some of the links match the text width exactly (wiki, activities, donate) the others are a bit longer as if including a trailing space character. Is this controllable?
  3. Hover underscore separation - the bolded wiki link text underscore is 2 pixels from the text baseline, the others are 5 pixels. Can we control this? 4 or 5 pixels looks good with the bold underscore strokes.
  4. Link sites - drop people, add translate, ideas?

Color

Underscores on links

  • show on hover only - like the Wikipedia MonoBook and Vector skins, I prefer not to clutter the content area with lots of horizontal lines that interfere with the typeface descenders, make reading the text more difficult, and tire the eyes.

[edit] section links

  • left or right position - I find the left position of these links, just preceding the section title, interferes with the clarity of reading and scanning the titles. I prefer that the [edit] section links be moved to the right like in the MonoBook and new Wikipedia Vector skins.
  • contrast - I also suggest that they be slightly less dense or grayed from the rest of the text, so that they are easier to ignore when one is concentrating on reading the content on a page.
  • underscores - like the other non-direct content links, if they only show an underscore when hovered with the mouse pointer, there will be less unessential 'ink' on the page that distracts and tires the eyes.