Re: CSS changes

["Curtis C. Hovey" <sinzui cox net>]

On Mon, 2003-08-11 at 00:35, James Henstridge wrote:
> While playing round with the new site templates, I noticed that the size 
> of the header is specified in pixels, when its size should be relative 
> to the metrics of the text in the header.
> 
> At default font size, this isn't very noticable, but at large font sizes 
> and with small screens, the links in the header can wrap to a single 
> line, and overlap the main content of the page.  Similarly, with small 
> font sizes, there is a noticable gap between the header and the main 
> content.

I think we should explore using em units instead of px.  Since the
driver of this issue is the size of the text, the design should be using
the text's own dimensions in the solution.  I believe all gecko, IE 4+,
Opera 5+ handle em correctly.  Images are an exception, they only size
to pixels I think.

> I did a bit of hacking of the CSS to come up with the attached mockup.  
> With this design, the header CSS box is sized according to the text it 
> contains, and the main content starts just below the header.
> 
> Some downsides to these changes are:
> 
>    1. the header must come first in the document, rather than at the
>       end.  I don't see this as much of a problem. 
>           * Pro: the header will load and display very quickly when
>             people view a page, so they know something is hapenning. 
>             With the current setup, you get a large blank space at the
>             top of the page when viewing large documents over slow
>             connections.
>           * Pro: we can position the content below the header properly,
>             so people using large fonts or small screens don't see
>             overlapping text.
>           * Pro: the user won't see weird behaviour when selecting
>             regions of text that span the header and main content, since
>             the visual layout more closely matches the logical layout.
>           * Con: People using lynx or audio browsers will see the header
>             before the content.  Note that our header is much smaller
>             than most sites, so I don't personally see this as a big
>             problem -- the majority of navigation links are in the sidebar.
>    2. There is an extra DIV around the main content and sidebar.  This
>       was necessary to correctly position those elements relative to the
>       header.
> 
> 
> Any comments/suggestions?

I think we are using too much generic markup (div, p) to create the
document structure.  Your example is not necessarily representative of
GNOME Web content, but we should be using headings in banners, sidebars,
and content to distinguish the major sections of the document.  Granted
your example is a CSS proof, but it, like the developer homepage, is
inert, there are no headings, or meta content that reinforce the
important content of the page.

-- 
__C U R T I S  C.  H O V E Y____________________
sinzui cox net
Guilty of stealing everything I am.