[Design-team] Thanks for another great meeting today; here are the minutes!

Marc Stewart marc.c.stewart at googlemail.com
Fri Oct 8 21:05:53 UTC 2010


On Tue, 2010-10-05 at 16:40 -0400, Máirín Duffy wrote:
> - Schendje, sijis, and mizmo have been hard at work on our new websites;
> check out the progress in staging and let us know what you think:
> 
> - http://stg.fedoraproject.org

Hello website designers,

By and large, the website looks great, and it's good to see that the
logical page order is sensible for those browsers that don't use CSS.
All your hard work has produced excellent results. I have some
constructive criticism for you to consider though. Mostly it's small
stuff, but there is one bigger problem. I'll stick to page order as it
appears with CSS & JS so I don't forget anything.

Query: Are all visitors expected to know the code for their language?
This may be common knowledge—I honestly don't know. However, might it be
better for language choices to be stated more explicitly? Particularly
for languages with another script, for example, Chinese, would it not be
more polite to show "简体字" (I think) rather than the Latin-scripted
"zh_CN"?

Suggestion: Javascript could remove the "OK" button, then automatically
redirect if the language selection is changed. This would save a click
and make the site feel more responsive. I don't believe it would pose an
accessibility problem, since the OK button would remain if javascript
was turned off, but do correct me if I've overlooked something.

Layout (small-medium problem): The German version of the site uses
"Homepage" in place of "Home" for the link bar. As a consequence, in
Firefox, "Contributors" drops down a line and overlaps the slideshow.
This doesn't happen in Chromium though, because the letterspacing is
non-existent, keeping it bunched on the same line. In any case, this
highlights a potential l10n problem, in that longer translations risk
causing an unhandled overhang.

Graceful degradation (biggest problem): Without javascript, the
slideshow is a mess, and one that blocks the language change dropdown.
Non-JS browsers are a minority, but plenty of people using extensions to
selectively turn it off are the kind of tech-savvy people that Fedora
might appeal to. A broken site would not go down well.
Fortunately the solution is simple. Use relative positioning to stack
the slides over the same area with CSS. Non-JS viewers will then see a
single slide, correctly displayed. Use javascript to alter the z-order
only, bringing the current slide to the top, and sending the others
down.

Accessibility: I know that I read slowly, but I think the slides might
progress too quickly even for average readers. Has this been tested? I'd
suggest average reading time plus two seconds per slide for normal
progress, but then if one of the numbered buttons is pressed, hold the
slide for twice as long, before resuming normal timing with the next
slide.
Also, extend the on-hover pausing (an effect I only just noticed—it's
clever but not intuitive) to hovering over the buttons, which is where a
cursor is likely to be if clicking back a slide to try to read the rest
of it. This would keep things moving while also giving us slowcoaches a
chance.

Graceful degradation: As they stand, the numbered buttons are only
effective if javascript is on. Therefore, they should be inserted with
JS, rather than be hard-coded in the HTML.
The alternative is to keep them in HTML, but link to the same page with
a querystring ?slide=2 etc. in order to display another slide (e.g., by
reordering the HTML with PHP). Then use JS to replace that link with the
normal slide change functions instead.

Style and consistency: Slides 1, 2, and 4 have a full stop at the end of
their headings. Slide 3 does not. In my opinion, slide 3 has it right:
headings shouldn't be terminated by full stops (periods). Either way,
there should be consistency across the four slides.
Additionally, slides two and three use title case, ending "Learn More".
Slide 4, though, has small-m "Learn more", with slide 1 also using
sentence case "More options". I'd pick sentence case, but, again,
consistency is key.

Accessibility: slide 2's white text is in places difficult to make out
against the lighter background areas. Darker text might improve things.
Similarly, slide 4's background interferes a little. Increasing the
black rectangle's opacity a notch should help while still keeping the
crowd visible.

Style and consistency: The bullet-points are indented in "Your Life on
Fedora" and "What makes Fedora different?" but hang in "Do It With
Fedora". Typography purists would demand hanging punctuation in all
cases, but I'm not sure if that's possible in the left-most column, and,
as ever, I think consistency is all that's really important.

L10n: In the footer, the "Join Fedora" link's URL hasn't been translated
so always points to /en/join-fedora

Style/grammar: Again for nitpicky purists, there's an argument for a
hyphen in "community maintained" as a compound adjective for "site",
although it's probably sufficiently well understood as it is.
The "well-known" in "Fab[...] is well-known in the Linux community
[...]." definitely shouldn't have a hyphen, however.

That's taken me a while (I write even more slowly than I read), but I
don't think that it represents very much to worry about. Each issue is
small, easy to change (if it should be changed at all) and—even
cumulatively—doesn't add up to a whole lot to detract from what looks to
be a fantastic update to the website.

If I can carve out some extra time over the weekend I'll try to put into
code what I've said above and send it on.

Marc



More information about the design-team mailing list