Gentoo Logo
Gentoo Spaceship




Note: Due to technical difficulties, the Archives are currently not up to date. GMANE provides an alternative service for most mailing lists.
c.f. bug 424647
List Archive: www-redesign
Navigation:
Lists: www-redesign: < Prev By Thread Next > < Prev By Date Next >
Headers:
To: www-redesign@g.o
From: Curtis Napier <curtis119@g.o>
Subject: Re: a couple of comments
Date: Sun, 11 Dec 2005 21:35:42 -0500
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


Replies:
RE: a couple of comments
-- Aaron Shi
headers, lists and more news
-- Curtis Napier
References:
a couple of comments
-- Aaron Shi
Navigation:
Lists: www-redesign: < Prev By Thread Next > < Prev By Date Next >
Previous by thread:
Re: a couple of comments
Next by thread:
headers, lists and more news
Previous by date:
Re: a couple of comments
Next by date:
headers, lists and more news


Updated Jun 17, 2009

Summary: Archive of the www-redesign mailing list.

Donate to support our development efforts.

Copyright 2001-2013 Gentoo Foundation, Inc. Questions, Comments? Contact us.