[www-redesign] Progress update

[www-redesign] Progress update

[Aaron Shi]

[-- Attachment #1: Type: text/plain, Size: 1297 bytes --]

Hi all,
 
I've finished 2 reference pages: More Headlines and Guide Page.  The Website
reference page essentially has the same stuff as the Guide Page, I don't
really see a reason to remake http://www.gentoo.org/main/en/about.xml with
the new design.  In terms of presentation there isn't anything new there.  
 
You can access the new pages and the latest snapshot here:
http://www.aaronshi.com/gentoo/
 
Is there a "master list" of all the CSS formatting required? I.e. code,
path, input, code listing, etc. etc.  while the Guide Page seemed to cover a
lot of stuff, I'm sure it doesn't have everything.  It appears that code and
input has the same formatting/colors (namely blue monospaced font) in the
current setup, it seems a bit ambiguous to me.  Any thoughts?  What do you
guys think about having line numbers appear on the side of the code
listings?  Usually I'd put something like that for long snippets of code,
but here it seems to be commands and console output less than a few lines
long so it's probably not useful...
 
At this point I've decided to skip browser testing every time I make
changes...we'll do that at the end as per the Roadmap: XHTML Code Cleaning.
For now I will only test in IE and Firefox to catch the major problems.
 
Any and all comments are welcome.
 
-Aaron

[-- Attachment #2: Type: text/html, Size: 2841 bytes --]

Re: [www-redesign] Progress update

[Blackace]

[-- Attachment #1: Type: text/plain, Size: 5890 bytes --]

On Tue, 2005-05-03 at 17:57 -0700, Aaron Shi wrote:
> Is there a "master list" of all the CSS formatting required? I.e.
> code, path, input, code listing, etc. etc.  while the Guide Page
> seemed to cover a lot of stuff, I'm sure it doesn't have everything.
> It appears that code and input has the same formatting/colors (namely
> blue monospaced font) in the current setup, it seems a bit ambiguous
> to me.  Any thoughts?  What do you guys think about having line
> numbers appear on the side of the code listings?  Usually I'd put
> something like that for long snippets of code, but here it seems to be
> commands and console output less than a few lines long so it's
> probably not useful...

The DTDs should contain all the elements we currently have, and you can
correlate them to CSS by checking the XSL, sorry but other than the
xml-guide which may not explain everything, that's the best way to find
out, if you have any questions or want any help with XSL/XML stuff,
please e-mail me or jump on irc and grab me, blackace in #gentoo, -dev,
-infra, -doc, or just PM me, I'm usually on :)

Now for comments aka destructive criticism ;)

On your guide page, I really feel like the author list would be better
off in the right bar, since for the handbook for instance, the list is
going to get really long.

In addition, the drop down in the top bar seems out of place, perhaps it
would better left aligned in line with the font size adjustment, e-mail,
and print buttons.  I do like the buttons though, especially the print
one to link to our ?style=printable, but the e-mail one is probably
unnecessary since we don't have it now, I doubt people would use it
much, and we'd have to implement a script and form behind it, exposing
ourselves to people using it to use our servers to spam people.

I think the links in the content of the guide page would be better with
solid underlines vs. dotted, since dotted usually implies contextual
help or a "tool tip" which explains an acronym, and the dotted underline
seems to disappear in that much text.

The background color on <c> and <i> elements is also much too faint, I
would either bolden it up a little or just leave it out, as a matter of
fact the body text seems a little too faint as well.

The tables I like very much, but the code listings and warnings just
seem very out of place, colors mostly...for the code listing the green
you use in chapter headings would look better, and I just don't like the
single line on the left, it seems like it's supposed to be an editor's
note or markup more than part of the document, maybe a similar style as
the tables, except a green header row, light blue background would look
better...as for notes and warnings, I'd go with a dotted border like
your author/document info box at the top has, and a light pastel colored
background keyed to what it is, purple for notes, red for warnings, etc.
And on the printable page, I'd drop the light background on the code
listings and everything else like you do for the tables.

In the top bar, I'd align the background of the search form cell to the
top so when the bar gets shorter the position of the content relative to
the image in the background doesn't change.

Since the top bar will get shorter, aligning the content of the search
form cell to the top with maybe an 8-10 pixel margin would keep it from
moving around, and that bar could use to be shorter in your guide page
as the amount of air around the text to the left of the search form
looks kind of odd.

We should also plan for more content in that search form cell, for
instance archives.g.o will need different text and a drop down to select
which list to search, packages.g.o will have different needs as well, as
will forums...one of my goals during this redesign is to abstract the
layout and design sufficiently from the content so as to allow different
global content alongside local content for each of our sites/top level
apps.

Part of that is the top bar once we leave the main index page, on your
guide page you show it containing bread crumb style navigation...I had
hoped we could use that space for secondary navigation that all our top
level apps will need, like forums, bugs, and packages...and archives
would benefit from it too.

Also in the top bar, in your main page, I was wondering if we could
change the Manage, Customize, Optimize, Interact, and Search to be
text...I can provide a patch to the code and the css if you want.
They're just another 1,902 bytes that have kind of a rough dark edged
transparency and look better as text, nearly identical when the primary
font is the same, Arial.

The "More Headlines" page seems a little redundant, if you want to see
more than the last couple on the main page, we might as well display the
entire list in a more condensed format, say, per month or something.

On your "jump pads" at the bottom of the main page, I don't really like
them all that much to be honest since the visitor should be able to
easily access everything listed in them from our primary navigation in
less than 3 (probably 2) clicks otherwise we've failed to make the site
usable, and they only exist to be used as a crutch...but regardless, I
liked them better when they were centered in the content area of the
page, and in your Documentation one, s/other cocs/other docs/ :)

Hopefully my critique hasn't pissed you off too much, but dancing around
what I think would only delay the first instance of me pissing you off,
and would prevent whatever useful thoughts I have on it from being made
known, err well, hopefully there are some in there :)

Once again, you can almost always grab me on IRC if you want help with
any of our XSL stuff, or want to discuss anything :)

-- 
Blackace
Gentoo Linux
Infrastructure Developer

[-- Attachment #2: This is a digitally signed message part --]
[-- Type: application/pgp-signature, Size: 189 bytes --]

Re: [www-redesign] Progress update

[Jan Dušek]

Hi, just a small note - in Firefox 1.0.3 in guidepageprint in the top 
right corner - there's the text "Rendering: text / print version" and 
link to www.gentoo.org and they quite overlap. Don't know about IE.

It all looks very nice, thanks for the snapshots.

--jd

Aaron Shi wrote:
> Hi all,
>  
> I've finished 2 reference pages: More Headlines and Guide Page.  The 
> Website reference page essentially has the same stuff as the Guide Page, 
> I don't really see a reason to remake 
> http://www.gentoo.org/main/en/about.xml with the new design.  In terms 
> of presentation there isn't anything new there. 
>  
> You can access the new pages and the latest snapshot here: 
> http://www.aaronshi.com/gentoo/
>  
> Is there a "master list" of all the CSS formatting required? I.e. code, 
> path, input, code listing, etc. etc.  while the Guide Page seemed to 
> cover a lot of stuff, I'm sure it doesn't have everything.  It appears 
> that code and input has the same formatting/colors (namely 
> blue monospaced font) in the current setup, it seems a bit ambiguous to 
> me.  Any thoughts?  What do you guys think about having line numbers 
> appear on the side of the code listings?  Usually I'd put something like 
> that for long snippets of code, but here it seems to be commands and 
> console output less than a few lines long so it's probably not useful...
>  
> At this point I've decided to skip browser testing every time I make 
> changes...we'll do that at the end as per the Roadmap: XHTML Code 
> Cleaning.  For now I will only test in IE and Firefox to catch the major 
> problems.
>  
> Any and all comments are welcome.
>  
> -Aaron
-- 
www-redesign@gentoo.org mailing list

Re: [www-redesign] Progress update

[Grant Goodyear]

[-- Attachment #1: Type: text/plain, Size: 3646 bytes --]

Blackace wrote: [Wed May 04 2005, 12:01:57AM CDT]
> On your guide page, I really feel like the author list would be better
> off in the right bar, since for the handbook for instance, the list is
> going to get really long.

I actually like the author list at the top, but to make it reasonable it
would need to list the authors as
  Joe Buck (Author), Homer Simpson (Editor), ...
instead of using one line per entry.  Of course, I might change my mind
if I actually saw an example w/ the authors from the Handbook.

> In addition, the drop down in the top bar seems out of place, perhaps it
> would better left aligned in line with the font size adjustment, e-mail,
> and print buttons.  I do like the buttons though, especially the print
> one to link to our ?style=printable, but the e-mail one is probably
> unnecessary since we don't have it now, I doubt people would use it
> much, and we'd have to implement a script and form behind it, exposing
> ourselves to people using it to use our servers to spam people.

I agree about the e-mail link, but I rather like the drop-down bar where
it is, since it seems reasonable to me that the drop down be part of the 
location bread-crumbs.  *Shrug*

> I think the links in the content of the guide page would be better with
> solid underlines vs. dotted, since dotted usually implies contextual
> help or a "tool tip" which explains an acronym, and the dotted underline
> seems to disappear in that much text.
> 
> The background color on <c> and <i> elements is also much too faint, I
> would either bolden it up a little or just leave it out, as a matter of
> fact the body text seems a little too faint as well.

Reasonable criticisms.

> The tables I like very much, but the code listings and warnings just
> seem very out of place, colors mostly...for the code listing the green
> you use in chapter headings would look better, and I just don't like the
> single line on the left, it seems like it's supposed to be an editor's
> note or markup more than part of the document, maybe a similar style as
> the tables, except a green header row, light blue background would look
> better...as for notes and warnings, I'd go with a dotted border like
> your author/document info box at the top has, and a light pastel colored
> background keyed to what it is, purple for notes, red for warnings, etc.
> And on the printable page, I'd drop the light background on the code
> listings and everything else like you do for the tables.

I actually really like the code listings and the warnings. That said, I
don't at all like the vertical scroll bar on the code listings.  (I 
absolutely loathe the horizontal scroll bar, since it's extremely rare
that the 80-character limit for <pre></pre> blocks needs to be 
violated, but that's a different issue.)

> Part of that is the top bar once we leave the main index page, on your
> guide page you show it containing bread crumb style navigation...I had
> hoped we could use that space for secondary navigation that all our top
> level apps will need, like forums, bugs, and packages...and archives
> would benefit from it too.

An example might be helpful.

So, how far are we from being able to process the whole doc tree to
create a full test version of the new site?  I'd love to have a
not-published version on one of the infra boxes that we can use to
really get a feel for how navigation is going to work.

-g2boojum-
-- 
Grant Goodyear	
Gentoo Developer
g2boojum@gentoo.org
http://www.gentoo.org/~g2boojum
GPG Fingerprint: D706 9802 1663 DEF5 81B0  9573 A6DC 7152 E0F6 5B76

[-- Attachment #2: Type: application/pgp-signature, Size: 189 bytes --]

Re: [www-redesign] Progress update

[Blackace]

[-- Attachment #1: Type: text/plain, Size: 3410 bytes --]

On Wed, 2005-05-04 at 10:09 -0500, Grant Goodyear wrote:
> I actually like the author list at the top, but to make it reasonable it
> would need to list the authors as
>   Joe Buck (Author), Homer Simpson (Editor), ...
> instead of using one line per entry.  Of course, I might change my mind
> if I actually saw an example w/ the authors from the Handbook.

Well, here's the current list (which will likely grow with each
revision)...let's see how it wraps just in an e-mail:

Sven Vermeulen (Author), Daniel Robbins (Author), Chris Houser (Author),
Jerry Alexandratos (Author), Seemant Kulleen (Gentoo x86 Developer),
Tavis Ormandy (Gentoo Alpha Developer), Aron Griffis (Gentoo Alpha
Developer), Jason Huebel (Gentoo AMD64 Developer), Guy Martin (Gentoo
HPPA developer), Pieter Van den Abeele (Gentoo PPC developer), Joe
Kallar (Gentoo SPARC developer), John P. Davis (Editor), Pierre-Henri
Jondot (Editor), Eric Stockbridge (Editor), Rajiv Manglani (Editor),
Jungmin Seo (Editor), Stoyan Zhekov (Editor), Jared Hudson (Editor),
Colin Morey (Editor), Jorge Paulo (Editor), Carl Anderson (Editor), Jon
Portnoy (Editor), Zack Gilburd (Editor), Jack Morgan (Editor), Benny
Chuang (Editor), Erwin (Editor), Joshua Kinard (Editor), Tobias
Scherbaum (Editor), Grant Goodyear (Reviewer), Gerald J. Normandin Jr.
(Reviewer), Donnie Berkholz (Reviewer), Ken Nowack (Reviewer), Lars
Weiler (Contributor)

That's a lot'a names :)

> I agree about the e-mail link, but I rather like the drop-down bar where
> it is, since it seems reasonable to me that the drop down be part of the 
> location bread-crumbs.  *Shrug*

Well, part of this is how ugly it looks with a gray outline in that nice
purple background, and part of it is how we need somewhere for subnav to
go, by subnav I mean the "FAQ | Search | Memberlist | Usergroups |
Statistics | Profile | You have no new messages | Log out" links the
forum has and the links we'll need under each toplevel section of our
site, say you click on "About"...at a minimum we need to link to
philosophy and social contract from there...and all our toplevel apps
could make use of this, bugs, packages, and archives for instance.

> I actually really like the code listings and the warnings. That said, I
> don't at all like the vertical scroll bar on the code listings.  (I 
> absolutely loathe the horizontal scroll bar, since it's extremely rare
> that the 80-character limit for <pre></pre> blocks needs to be 
> violated, but that's a different issue.)

Well, the horizontal scroll bar is ok with me since it allows us to
maintain the integrity of the design on the screen, but I don't
understand what vertical scroll bars are being displayed there for...we
should _never_ have vertical scroll bars, and only have horizontal
scroll bars when the content is too wide for the display area.

> An example might be helpful.

See above, sorry :)

> So, how far are we from being able to process the whole doc tree to
> create a full test version of the new site?  I'd love to have a
> not-published version on one of the infra boxes that we can use to
> really get a feel for how navigation is going to work.

I can create xsl from Aaron's code in about an hour and I'm sure we can
come up with a box to use for testing, I'd just need to talk to
Ramereth.

-- 
Blackace
Gentoo Linux
Infrastructure Developer

[-- Attachment #2: This is a digitally signed message part --]
[-- Type: application/pgp-signature, Size: 189 bytes --]

Re: [www-redesign] Progress update

[Sven Vermeulen]

[-- Attachment #1: Type: text/plain, Size: 2514 bytes --]

On Wed, May 04, 2005 at 09:28:57PM -0700, Blackace wrote:
> Sven Vermeulen (Author), Daniel Robbins (Author), Chris Houser (Author),
> Jerry Alexandratos (Author), Seemant Kulleen (Gentoo x86 Developer),
> Tavis Ormandy (Gentoo Alpha Developer), Aron Griffis (Gentoo Alpha
> Developer), Jason Huebel (Gentoo AMD64 Developer), Guy Martin (Gentoo
> HPPA developer), Pieter Van den Abeele (Gentoo PPC developer), Joe
> Kallar (Gentoo SPARC developer), John P. Davis (Editor), Pierre-Henri
> Jondot (Editor), Eric Stockbridge (Editor), Rajiv Manglani (Editor),
> Jungmin Seo (Editor), Stoyan Zhekov (Editor), Jared Hudson (Editor),
> Colin Morey (Editor), Jorge Paulo (Editor), Carl Anderson (Editor), Jon
> Portnoy (Editor), Zack Gilburd (Editor), Jack Morgan (Editor), Benny
> Chuang (Editor), Erwin (Editor), Joshua Kinard (Editor), Tobias
> Scherbaum (Editor), Grant Goodyear (Reviewer), Gerald J. Normandin Jr.
> (Reviewer), Donnie Berkholz (Reviewer), Ken Nowack (Reviewer), Lars
> Weiler (Contributor)
> 
> That's a lot'a names :)

A bit shorter would be to group the Author/Editor/Translator/... so you only
display that noun just once instead of at every e-mail address.

> Well, part of this is how ugly it looks with a gray outline in that nice
> purple background, and part of it is how we need somewhere for subnav to
> go, by subnav I mean the "FAQ | Search | Memberlist | Usergroups |
> Statistics | Profile | You have no new messages | Log out" links the
> forum has and the links we'll need under each toplevel section of our
> site, say you click on "About"...at a minimum we need to link to
> philosophy and social contract from there...and all our toplevel apps
> could make use of this, bugs, packages, and archives for instance.

If you're talking about the structure of the website, that's one part that
still needs a lot of discussion. I have a proposal at
http://dev.gentoo.org/~swift/www-redesign/structure.txt.

> I can create xsl from Aaron's code in about an hour and I'm sure we can
> come up with a box to use for testing, I'd just need to talk to
> Ramereth.

Backporting the new code to XSL isn't difficult, but continuously doing this
might get difficult if the code changes too much. Ideally, once the code is
finished, we should focus on the new XSLT code so that every additional
layout change happens in the XSL.

Wkr,
      Sven Vermeulen

-- 
  Documentation project leader

  The Gentoo Project   <<< http://www.gentoo.org >>>

[-- Attachment #2: Type: application/pgp-signature, Size: 189 bytes --]