[Systems] [IAEP] wiki design

[Frederick Grose]

On Sat, Apr 3, 2010 at 1:27 PM, Eben Eliason <eben.eliason at gmail.com> wrote:
>
> On Sat, Apr 3, 2010 at 1:14 PM, Bernie Innocenti <bernie at codewiz.org>
wrote:
> > On Sat, 2010-04-03 at 11:44 -0400, Eben Eliason wrote:
> >> I agree that sites which don't restrict the body column width are
> >> generally more difficult to read, and it can be frustrating to users
> >> who have a number of tabs open in a single window to continually
> >> resize that window to make those sites readable. I'd put in a vote for
> >> setting a max-width (instead of a fixed width), specified in ems, so
> >> that the line length is comfortable for readability regardless of the
> >> font size, and the layout can still scale down gracefully for narrower
> >> viewports, such as on mobile devices.
> >>
> >> I'd recommend something around 80–100 characters per line for best
> >> readability. (It looks like about 100 now, so no change needed there.)
> >> I'm happy to see you've already set the line-height to something
> >> reasonable, too. Anyway, I love the redesign. I think it's looking
> >> great! nice work.
> >
> > I totally agree. Josh, is anything that you'd like to change before we
> > move your work to the production wiki?
> >
> >
> >> One other note I had was that I'd like to see hover effects on links
> >> in the main articles, just like those in the menu to the left.
> >
> > I'm +1 on adding a hover effect, but -1 on removing the underlining
> > hint, which would make the links harder to distinguish.
>
> Yeah, that's fine. Maybe keep the underline in the default state, but
> remove it in the hover state when the background color changes.
> Eben

We should consider the design and accessibility problems of link underlines.

Insufficient contrast between the link color and regular text make them
difficult to distinguish on monochrome screens.  (With the back light off on
an XO-1, the wiki.sugarlabs.org links are less distinguishable as may be
desired, but some on the www.sugarlabs.org site, especially as the colors
change, are impossible to distinguish.)

Excess and heavy underlines of heavily-linked sections (navigation bars like
the sidebar and table of contents) or even regular content sections can
overload the page with horizontal forms that distract the eye and make
reading difficult.

The default placement of the underline rule intersects with typeface
descenders and this reduces the clarity of the text for reading.

I've found that the excess heaviness and horizontal lining of solid
underlines can be reduced by using a dotted, lightgray bottom-border
underline {text-decoration:none;border-bottom:1px dotted;border-color:
gray}.  This can be tested at wiki.laptop.org (which allows user .css and
.js customization on the monobook skin) by selecting the monobook skin and
entering this line on your User:Username/monobook.css, follow the 'Custom
CSS' link next to MonoBook on the Skin tab of your Preferences page:

#bodyContent a {text-decoration:none;border-bottom:1px dotted;border-color:
lightgray}

bugs.sugarlabs.org uses a similar link underline.

More discussion of the wiki skin redesign is at
http://wiki.sugarlabs.org/go/Wiki_Team/Roadmap/Wiki_skin_redesign.

           --Fred
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.sugarlabs.org/private/systems/attachments/20100403/464fe448/attachment.htm