RE: [www-redesign] a couple of comments

[Aaron Shi]

> I agree, we shouldn't change the order of the links. What
> about if the
> green arrow simply moves to whatever domain you are on and
> add a little
> padding around it to make it stand out without actually changing the
> location of the menu item? This would be consistant with the idea of
> "this is where you are" and still satisfy the color-blind
> problem of the
> light purple link color.

Let's try that.  I've got a few other ideas in mind, but don't have time to
make a proto right now.  If your idea works, we'll just go with it for now.
In any case, it'll be better than changing link orders.


> Sorry, I had the wrong color-code for the purple header. I also
> increased the font size for the green header to make it more
> prominent.

Yup, they look great now.  I noticed that the table headers seem to be a
different purple (darker), don't know if it's intentional, but it's ok with
me.


> I didn't notice the body overflowing under the content area
> there (I use
> moz and opera and only test with IE every once in a while). The light
> purple bar under the content area is an IE only bug and I fixed it.
>
> Ad bar being shifted by 1 pixel? I don't see that in any of the
> browsers. Can you take a screenshot?

Screenshot: http://www.aaronshi.com/gentoo/problems/onepixel.png (also
pointed out the adbar/footer bg difference).  The shift is actually large on
some other pages (just discovered after uploading that sshot), e.g. on
http://wwwredesign.gentoo.org/doc/en/handbook/handbook-x86.xml?part=1&chap=3
it's off by at least 5.

I think it's important that it looks good in IE, since this is more than 85%
of the market share on the net.  While Gentoo is Linux specific (where IE is
the minority), I think from a marketing perspective a lot of new/potential
future users might still be on IE/Windows.  E.g. 100% of Gentoo users I know
on campus went from Windows --> [some flavour of Linux they didn't like
(while retaining Windows as main OS)] or directly to --> Gentoo (but still
using Windows).  The pre-Gentoo OS has a great probability of being Windows,
whose user has a good probability of using IE.  

Those who visit from their workplace, i.e. potential future
enterprise/business users are likely to be using Windows/IE as well since
most businesses use Windows as their main platform and for easy maintainence
rollouts they'd probably only use IE which gets updated along with Windows.


Aaron


> -----Original Message-----
> From: Curtis Napier [mailto:curtis119@g.o]
> Sent: Sunday, December 11, 2005 6:36 PM
> To: www-redesign@l.g.o
> Subject: Re: [www-redesign] a couple of comments
>
> Aaron Shi wrote:
> > Wow, took a quick peek and everything looks much nicer.
> >
> > A couple of things (here it goes):
> >
> > --1--
> >
> >>When I saw the e-mail icon next to the print icon, my first thought
> >>was that it was a "send-a-link" button, since that's pretty
> common on
> >>news sites.  Having it represent a mailto:
> >>link instead might be potentially confusing.  Anybody else
> think that?
> >
> >
> > It is misleading and counter intuitive.  The original reference was
> > for "send-a-link," but to do that it requires javascript and hence
> > that's probably why it was changed to a static mailto: link.
> >
>
> A little picture of a mail envelope represents a send-a-link?
> If so many people think so then I'll just remove it. To me
> it's pretty intuitive that it means "send a mail" and since
> it's a gentoo page I assume it's sending a mail to someone at gentoo.
>
> Since the current gentoo website doesn't have that link and
> since it wasn't Aarons orginal intention for it to be a
> mailto link *and* because so may people have mentioned it I
> will just remove it.
>
> Fixed in CVS.
>
> > --2--
> >
> >>There are a few other minor changes as well. Link colors have been
> >>made more consistant: purple on white for content areas and
> white on
> >>purple in the menu bar. All links turn green on :hover. These color
> >>combinations pass the color-blind test, look really good and are
> >>consistant.
> >
> >
> > The green was intended for on the dark purple background on the top
> > bar or bolded text headings.  It is not intended for unbold
> > non-heading text on white background or on light purple
> background (especially hard to see, e.g.
> > hover ad links on the ad bar).  Also, the ad images have dotted
> > underlines under them, they shouldn't.
> >
>
>
> I tried to take your repeated advice to be "consistant" and
> apply it to the links. We have purple on white links, white
> on purple links. I think we can both agree that is good(?)
> Having a hover color is important for several reasons. Let me
> explain the full logic of why I choose the colors for the
> links, hopefully you will agree.
>
> 1. hover color is the standard for links and the green is one
> of the official theme colors. Using it for ALL links is "consistant".
>
> 2. we are using dotted underlines instead of solid ones. This
> confuses a lot of people who think they are <acronym>'s
> instead of <a href>'s so having a different color on hover is
> more consistant with a normal <a
> href>'s behaviour.
>
> 3. the light purple on the dark purple is invisible to
> color-blind people (this one is very very important)
>
> 4. the inconsistancy of links was the number 1 thing people
> had negative feedback on. This current link color theme has
> gotten thumbs up from everyone I have talked to about it.
> Especially color-blind people. The hover color is a great
> visual que that it is an <a href> and not an <acronym> since
> <acronym>'s don't have a hover color by default (the dotted
> line changing to a solid one helps too but isn't enough).
>
> The green is the normal green that is used for a lot of
> little things around the site so I used it since it's
> "consistant". It looks good on the white and on the purple. I
> agree it may be a *little* hard to read on the light purple
> background but it's a hover color and you only see that color
> if the mouse is over the word anyway. It's kind of hard to
> read with the mouse covering the word anyhow so what's the difference?
>
>
> > --3--
> >
> >>The top level menu (main, planet, forums, etc...) had an issue. The
> >>green arrow designates which site you are on. If you are on
> >>planet.gentoo.org then PLANET would be first in line with the green
> >>arrow. I spaced the first word out more to make it more
> obvious. The
> >>link colors were changed to white with green hover to be consistant
> >>with the site-wide color scheme and also to pass the color
> blind test.
> >
> >
> > Hmm...we shouldn't changed the menu order on the users.  It creates
> > confusion and slows down the workflow because they'd have
> to double-check
> > the position of the links before clicking due to them
> changing.  How about,
> > current site = white link, other sites = dimmer (i.e. light
> purple).  Also
> > the green arrow doesn't vertically align with the text as
> in the reference,
> > not sure why merely changing colors would also change the
> positioning.  The
> > font looks a tad different, maybe that's why.
>
> I agree, we shouldn't change the order of the links. What
> about if the
> green arrow simply moves to whatever domain you are on and
> add a little
> padding around it to make it stand out without actually changing the
> location of the menu item? This would be consistant with the idea of
> "this is where you are" and still satisfy the color-blind
> problem of the
> light purple link color.
>
> When those links were still light purple I had several color-blind
> people ask me "what is that little green arrow doing floating in the
> middle of the top bar?" They *literally* could not see the
> light purple
> links.
>
> I don't see an issue with the arrow lining up. It seems to be pretty
> consistant for me on every browser, except for IE which moves it up 1
> pixel for some reason I can't seem to figure out.
>
> It's not that big of a deal and I would say it's an acceptable bug (?)
>
> >
> > --4--
> >
> >>I like this version much better. It's all coming together, and
> >>I give my thumbs up for a release of this as soon as the minor
> >>bugs are worked out. (Not like it matters, but as an average gentoo
> >>user, I applaud you, and everyone else!)
> >
> >
> >>Yes, let's see this before X-Mas 2005! It would be a nice X-mas
> >>present to the community!
> >
> >
> > I'd strong advise against releasing an unpolished product
> and patching up
> > known-bugs later (i.e. pull a Microsoft).  Since this is a
> major event,
> > there will undoubtly be additional coverage and it would
> not look good if we
> > launched it at sub par quality (Gentoo critics would
> totally capitalize on
> > it).
> >
>
> I do agree that we shouldn't put up a sub-standard piece of work
> *however*, if everyone involved is OK with it and has the
> time why not?
> I would like to see it by at least the New Year. If that
> isn't possible
> then so be it but this project was started over a year and a
> half ago,
> is it ever going to end?
>
> </chomping at the bit> ;-)
>
> > --5--
> >
> >>Chapters are the green and a larger font size and sections
> >>are dark purple and a little smaller. It looks good at the
> >>moment and (more or
> >>less) matches the reference design.
> >
> >
> > Looks good, my only concern with this and the other color
> changes is where
> > the colors came from.  Are they part of the color scheme?
> The dark purple
> > sub headings, while the text is of higher contrast (is it
> necessary?), it
> > over shadows the green heading (even though the green
> heading is larger),
> > this is because the apparent brightness is inconsistent.
> The purple in the
> > reference looks more balanced.  The headings (green,
> purple, and doc heading
> > at top in the light purple box) could be a little bigger as
> our default text
> > is bigger.
> >
>
> Sorry, I had the wrong color-code for the purple header. I also
> increased the font size for the green header to make it more
> prominent.
>
>
> > --6--
> > On the front page, there's a light purple space below
> between the content
> > area and the footer bar.  To the right of the line where it
> says "#103610 -
> > yaboot-static claims incorrectly that /proc/device-tree
> broken is in the
> > 2.6.12 kernel series", the ad bar is shifted by 1 pixel to
> the right (this
> > is barely noticeable but very odd).
> >
>
> I didn't notice the body overflowing under the content area
> there (I use
> moz and opera and only test with IE every once in a while). The light
> purple bar under the content area is an IE only bug and I fixed it.
>
> Ad bar being shifted by 1 pixel? I don't see that in any of the
> browsers. Can you take a screenshot?
>
>
> > --7--
> > The front page looks over crowded, I think this is mostly a
> spacing issue
> > (or lack of).  Giving the purple bar headings a padding and
> putting more
> > space between each news item may help a little temporarily.
>  The "More News"
> > link needs to be more prominent, right now it just looks
> like part of the
> > last news item.
> >
>
> The spacing issue is because you are apparently using IE to view it.
> Spacing is not an issue on any other browser. I have added a
> padding to
> the <td>'s of that table to accomodate IE, this increases the already
> existing padding on non-IE browsers though and I'm not sure
> it looks good.
>
> I increased the padding of the header as you suggested but it looks
> horrible. The reference design doesn't have a padding either
> and I like
> the look of it much better. Look at it now with the increased padding
> between news items and see what you think. Also try using firefox or
> opera and see the difference between them and IE.
>
>
> > --etc.--
> > The table borders might look better in a purple (right now
> it appears black
> > or very dark gray).
>
> Grey at the moment. Which of the purples? Give me a color code.
>
> >
> > The XML buttons have dotted underlines, within a sentence
> it looks okay, but
> > on its own it looks strange (the underline sticks right to
> the bottom of it,
> > essentially same problem as ad images).  This is probably a
> line height
> > issue.
> >
> > The ad column's purple doesn't quite match the light gray
> portion on the
> > footer which connects to it.  The purple looks nice too, I
> can probably
> > change the footer graphic later to match the purple.
> >
>
> We are replacing the normal text-decoration:underline of <a
> href>'s with
> a border:dotted. This makes the line become a "border" instead of a
> normal "text-decoration" and so the border is "below" the text line
> instead of "part of" the text line. I had to increase the line height
> for the entire content area to 1.3em to make the spacing
> consistant with
> what a text-decoration would give us and to remove the overlapping of
> the border with the line below it.
>
> It's easy to get rid of the text-decoration on images that are a link
> with a simple "a img {text-decoration:none}" but it is more
> complicated
> to get rid of a border on an <a href> that contains an img. I
> would have
> to add a new class to the css and a filter in the xsl that would tag
> every image with that class in order to get rid of the
> border. This is
> overly complicated to do. If anyone knows of a simple way to
> do it that
> doesn't involve adding a new class to every single image contained
> within an <a href> let me know.
>
> Instead I added vertical-align:text-bottom to "a img" in the
> css. This
> doesn't get rid of the dotted border but it does move the
> border right
> up to the edge of the image. This isn't a perfect fix but it's better
> than nothing. What does everyone think of the way it looks now?
>
>
> >
> >
> > Overall good work Curtis, this is coming together nicely!
> The progress has
> > been huge in the last couple of weeks.
> >
>
> Thanks! :-)
>
> --
> www-redesign@g.o mailing list
>
>
>

-- 
www-redesign@g.o mailing list