public inbox for [email protected]
help / color / mirror / Atom feedFiles on their way
9+ messages / 3 participants
[nested] [flat]
* Files on their way
@ 2003-11-11 17:11 Michael Glaesemann <[email protected]>
2003-11-11 18:04 ` Re: Files on their way Josh Berkus <[email protected]>
0 siblings, 1 reply; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-11 17:11 UTC (permalink / raw)
To: pgsql-www
I've sent the files on their way to Andreas. I'm not foreseeing any
huge problems, but there are some things I'm concerned about and would
like to address. But perhaps a brief description of what I did will
make things a little clearer.
The great benefit of separating the presentation and content is that
you can use the XHTML file to define the document structure and the CSS
to dress it up, very much along the lines of using SGML and DSSSL. So I
looked at the page structure to think of a way to describe it.
There's the banner, consisting of the PostgreSQL masthead between two
ads. The masthead includes two images (PostgreSQL and the logo) and a
group of links arranged horizontally, and a background image to give
the striping.
There are two sidebars bracketing the page content. Each sidebar
includes a number of sections, such as the User Survey, Current
Versions, the Language selector.
In the most recent test*.htms, two boxes highlighting Latest News and
Upcoming Events have been placed at the top of the content section.
Though there are other ways to do this, I thought the most
straightforward was to use a very simple table structure to structure
the whole page. There were two primary reasons I choose the table: it
helps maintain the two sidebar columns perfectly below the ads, and it
provides an easy way to provide the gray background (using margins and
setting the body background color to gray). (As we'll see, this wasn't
the best choice, but one that we have a variety of ways of working
around.)
So I chose a three-row table consisting of four columns. The first row
is the banner. Each ad is in it's own cell, the PostgreSQL masthead and
the link bar are in another (with the links in their own div,
id="bannerlinks", and the logo is in it's own cell.
The second row is pretty straightforward: left side in a cell, content
spans the next two, and the right side in the final cell. The third row
is the blue link bar on the bottom. The first cell includes "top", and
the other links are in a 3-cell span.
That's it for the tables. The "cells" in the sidebars are divs. Each is
id'd so they can be specifically selected via CSS, but I only used that
in a two cases: survey and gborg, because (in this version: Andreas'
latest examples don't include this) I wanted to tweak the <form> and
<ul> presentation in ways that may not be appropriate elsewhere.
The Latest News and Upcoming Events boxes are also divs set to float
left and right, respectively. This might cause some problems, as some
earlier browsers might not handle float well, but I wanted to get some
feedback first.
(Similarly, Netscape 4 in particular might —okay, probably will—royally
screw up this page. Netscape 4.x was released before CSS really got
going, but late enough that it tried to implement it. However there's a
way to keep the CSS Netscape 4.x chokes on beyond it's reach, while
making sure later browsers that can handle it can read it. I haven't
done this yet, as I haven't tested it in Netscape. But it's something
definitely doable and worth doing. Just haven't done it yet.)
I think that pretty much covers it. I did rewrite some of the other
markup using your standard <p> and <h#> tags, and I used lists, both
<ul> and <dl> where I thought appropriate. Recently I've started using
<dl> more because it has the semantic meaning of holding the <dt> with
the <dd>. For example, I used them in the International and Websites
sections, as the blurb under each headline can be viewed an explanation
or description of the subsection. If you disagree, not a big deal. The
same presentation can be accomplished using <h#> and <p> (or any other
tags, for that matter). And I think I need to zero out the left margin
and left padding on the <dl>s in these sections, as the <dd>s don't
look properly centered. And another place I used a <dl> and need to fix
is in the points outlining the benefits of using PostgreSQL: a
straightforward <ul> would have given me the bullets (list-style: disc)
by default. Another way to fix this is in the CSS, by adding a rule
along the lines of
#content dl { list-style:disc }
Besides removing a bunch of nested tables and presentation markup, I
also got rid of a lot of <br /> tags, as the CSS gives us much more
control over things like paragraph spacing and headline margins.
Two things that jump out at me and need to be fixed/resolved:
1. Switching to German caused the right sidebar to gain some
not-so-nice width because longer German words wouldn't break and caused
the cell to widen beyond the 120px I defined it. (Of course this isn't
German's fault. Just a failing of the design in handling long words.)
Looking at the corresponding test*.htm, the current site isn't strict
about keeping the side columns exactly below the ads. One solution
would be to break the design into two tables: one for the banner (one
row, four columns), and one for the rest (two rows, three columns). A
few small modifications to the CSS, and we're good to go. Drawback:
lose the nice continuity along the sides. Practically, not really a
drawback.
2. When the browser window is narrower, the bannerlinks flows into a
second line. The result is white space under the ads (changeable to
another color, of course—blue might make this less obvious), and an
interesting background image effect. I haven't played with this enough
to find a solution. One of course is to just absolutely define the
width. My personal preference is to let the site flow as much as
possible, trying to find a solution that doesn't cause the image-repeat
problem. With an absolute width there might be problems with narrower
browser windows.
There are some smaller style things that I'd want to change as well,
but it's just personal preference and easily changed in the CSS.
What do you think? Any serious breakage problems?
Michael
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
2003-11-11 17:11 Files on their way Michael Glaesemann <[email protected]>
@ 2003-11-11 18:04 ` Josh Berkus <[email protected]>
2003-11-11 18:21 ` Re: Files on their way Michael Glaesemann <[email protected]>
0 siblings, 1 reply; 9+ messages in thread
From: Josh Berkus @ 2003-11-11 18:04 UTC (permalink / raw)
To: Michael Glaesemann <[email protected]>; pgsql-www
Michael,
> What do you think? Any serious breakage problems?
Give us a URL when it's up, and I'll test multiple browsers.
--
Josh Berkus
Aglio Database Solutions
San Francisco
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
2003-11-11 17:11 Files on their way Michael Glaesemann <[email protected]>
2003-11-11 18:04 ` Re: Files on their way Josh Berkus <[email protected]>
@ 2003-11-11 18:21 ` Michael Glaesemann <[email protected]>
0 siblings, 0 replies; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-11 18:21 UTC (permalink / raw)
To: Josh Berkus <[email protected]>; +Cc: pgsql-www
On Wednesday, November 12, 2003, at 03:04 AM, Josh Berkus wrote:
> Michael,
>
>> What do you think? Any serious breakage problems?
>
> Give us a URL when it's up, and I'll test multiple browsers.
Thanks. Andreas had me send them to him via email. I'm sure he'll let
us know when when and where they're available.
Michael
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
@ 2003-11-12 03:08 Michael Glaesemann <[email protected]>
0 siblings, 0 replies; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-12 03:08 UTC (permalink / raw)
To: [email protected]; +Cc: [email protected]; pgsql-www
On Wednesday, November 12, 2003, at 04:43 AM, Andreas Grabmüller wrote:
> Well, I have uploaded it, it's just not really working ;)
> http://wwwdevel2.postgresql.org/en/index.htm
>
> Didn't you get the (private) mail I sent you some hours ago about this?
It was in my inbox when I woke up this morning. Sorry I didn't get back
to you sooner. I live in Tokyo, and am usually active on the web
between midnight and 2am local time.
> Not sure if it's my fault or a problem with the files you sent me, but
> I got the following files:
<snip/>
> I kicked the ones with 0.07 KB (there was only some garbage in them,
> might be a problem with my email program) and uploaded the others, the
> result is what you see online now...
As I mentioned in the email I sent with the tgz package, I don't think
there's anything crucial in the small extra files. Annoying, though,
and I'll try to eliminate them in the future.
Michael
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
@ 2003-11-12 03:15 ` Michael Glaesemann <[email protected]>
2003-11-12 08:29 ` Re: Files on their way Jeroen Ruigrok/asmodai <[email protected]>
2003-11-12 17:39 ` Re: Files on their way Josh Berkus <[email protected]>
1 sibling, 2 replies; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-12 03:15 UTC (permalink / raw)
To: Jeroen Ruigrok/asmodai <[email protected]>; +Cc: Andreas Grabmüller <[email protected]>; [email protected]; pgsql-www
On Wednesday, November 12, 2003, at 04:48 AM, Jeroen Ruigrok/asmodai
wrote:
> -On [20031111 20:42], Andreas Grabmüller ([email protected]) wrote:
>> Well, I have uploaded it, it's just not really working ;)
>> http://wwwdevel2.postgresql.org/en/index.htm
I'd say it's not working at all! :) Hopefully some of this will be
fixed in in the files I resent.
> The CSS is messed up for Opera.
What version are you running?
> You have additional white pixels in the sidebars.
>
> Also the center column is shifted by about another column's breadth to
> the right.
There's also some buggy behavior in Mac IE5.2—it adds an extra blank
column width on the right.
> Advice, make hefty use of explicit:
>
> padding: 0px
> margin: 0px
<snip/>
> Not every browser treats missing/omitted padding and/or margin as 0.
Good advice. I added a quick body { padding:0; margin:0 } and for the
other non-id'd or unclassified tags as well. That should bring
everything down to 0 unless explicitly declared elsewhere, though there
might be inheritance issues that need to be addressed directly.
Michael
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
2003-11-12 03:15 ` Re: Files on their way Michael Glaesemann <[email protected]>
@ 2003-11-12 08:29 ` Jeroen Ruigrok/asmodai <[email protected]>
1 sibling, 0 replies; 9+ messages in thread
From: Jeroen Ruigrok/asmodai @ 2003-11-12 08:29 UTC (permalink / raw)
To: Michael Glaesemann <[email protected]>; +Cc: Andreas <[email protected]>; [email protected]; pgsql-www
-On [20031112 04:22], Michael Glaesemann ([email protected]) wrote:
[Opera]
>What version are you running?
7.2x
--
Jeroen Ruigrok van der Werven <asmodai(at)wxs.nl> / asmodai / kita no mono
PGP fingerprint: 2D92 980E 45FE 2C28 9DB7 9D88 97E6 839B 2EAC 625B
http://www.tendra.org/ | http://www.in-nomine.org/~asmodai/diary/
Honesty is the first chapter of the book of wisdom...
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
2003-11-12 03:15 ` Re: Files on their way Michael Glaesemann <[email protected]>
@ 2003-11-12 17:39 ` Josh Berkus <[email protected]>
2003-11-12 19:49 ` Re: Files on their way Michael Glaesemann <[email protected]>
1 sibling, 1 reply; 9+ messages in thread
From: Josh Berkus @ 2003-11-12 17:39 UTC (permalink / raw)
To: Michael Glaesemann <[email protected]>; Jeroen Ruigrok/asmodai <[email protected]>; +Cc: Andreas <[email protected]>; pgsql-www
Folks,
Report back:
(all of the below are on Linux):
Konqueror 3.0.3: bad. There is a broad white space in the center, with all
center elements shoved to the right, as if we have a 2-column table and all
content is in the right column. This is probably a CSS bug in Konqueror,
but bodes poorly for Safari.
Mozilla 1.0.1: Good, even when I shrink the browser. Only problem is that
"grey box" text is too small (it's not too small on Konqueror) -- it appears
about 7pt.
Galeon 1.2.5: Identical in appearance to Mozilla 1.0.1
Right Side Bar, all browsers: The link/headers for each item do not center
with the descriptive text; they are about 2 characters to the left.
Survery, all browsers: The survey radio buttons do not line up, instead
forming a zig-zag.
Will try on later versions of the same browsers, above, later today.
--
Josh Berkus
Aglio Database Solutions
San Francisco
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
2003-11-12 03:15 ` Re: Files on their way Michael Glaesemann <[email protected]>
2003-11-12 17:39 ` Re: Files on their way Josh Berkus <[email protected]>
@ 2003-11-12 19:49 ` Michael Glaesemann <[email protected]>
0 siblings, 0 replies; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-12 19:49 UTC (permalink / raw)
To: pgsql-www; +Cc: Jeroen Ruigrok/asmodai <[email protected]>; Andreas Grabmüller <[email protected]>
On Thursday, November 13, 2003, at 02:39 AM, Josh Berkus wrote:
> Folks,
>
> Report back:
Josh, thanks for taking the time to view these on the different
browsers.
> (all of the below are on Linux):
> Konqueror 3.0.3: bad. There is a broad white space in the center,
> with all
> center elements shoved to the right, as if we have a 2-column table
> and all
> content is in the right column.
There was a problem with the GBorg section on the left causing the
GBorg text to push the center column to the right. Does that look like
what you're seeing? I've fixed it (there was a misplaced </div>, if I
recall correctly.)
> This is probably a CSS bug in Konqueror,
> but bodes poorly for Safari.
Actually, Safari handles it quite well. (Though see notes below.) I
generally design initially using Safari and Mozilla. Am now using Opera
quite a bit more as I see Opera is handling the table quite differently
than Mozilla and Safari. There were large gaps between the columns:
seems like there's an extra half-column between the left sidebar and
the center, the center and right sidebar abut (which is good), and
there's an extra column width after the right sidebar but before the
border.
Got this pretty much fixed. There's still a 3px extra space between the
right sidebar and the black table border, but I'll get to the bottom of
that as well.
> Mozilla 1.0.1: Good, even when I shrink the browser. Only problem is
> that
> "grey box" text is too small (it's not too small on Konqueror) -- it
> appears
> about 7pt.
Too small text is a problem. The Latest News and Upcoming Events boxes
(those the ones you mean?) are set to "x-small". I've bumped them up to
small.
> Galeon 1.2.5: Identical in appearance to Mozilla 1.0.1
>
> Right Side Bar, all browsers: The link/headers for each item do not
> center
> with the descriptive text; they are about 2 characters to the left.
I'm assuming your speaking of the Websites section. I saw that in Opera
(among others) and fixed it by zeroing out the padding and margin on
the <dl>
> Survery, all browsers: The survey radio buttons do not line up,
> instead
> forming a zig-zag.
Fixed. They were centered with some left margin/padding. The
padding/margin has been zeroed and left-aligned.
> Will try on later versions of the same browsers, above, later today.
Unless Andreas wants me to send the files again, I'm going to work on
them locally. I should have a host where I can post the files as I work
on them.
Also, unless the Latest News and Upcoming Events are exactly balanced
in terms of text length, you'll notice that one box may have a greater
height than the other. What do people think of this? I'd like to
eliminate it if I can.
Thanks again for the details, especially Konqueror.
MIchael
^ permalink raw reply [nested|flat] 9+ messages in thread
* Re: Files on their way
@ 2003-11-12 03:34 ` Michael Glaesemann <[email protected]>
1 sibling, 0 replies; 9+ messages in thread
From: Michael Glaesemann @ 2003-11-12 03:34 UTC (permalink / raw)
To: Jeroen Ruigrok/asmodai <[email protected]>; +Cc: Andreas Grabmüller <[email protected]>; [email protected]; pgsql-www
On Wednesday, November 12, 2003, at 04:48 AM, Jeroen Ruigrok/asmodai
wrote:
> -On [20031111 20:42], Andreas Grabmüller ([email protected]) wrote:
>> Well, I have uploaded it, it's just not really working ;)
>> http://wwwdevel2.postgresql.org/en/index.htm
>
> The CSS is messed up for Opera.
Also, I believe (at least earlier versions) of Opera share a CSS
parsing bug with MSIE4/5. This bug is exploited to compensate for
MSIE's different interpretation of the CSS box model, and I may have to
massage the CSS a bit for Opera in this case. I don't know if this
particular behavior is responsible for what your seeing.
On a better note, the version I'm seeing at
http://wwwdevel2.postgresql.org/en/index.htm matches what I'm seeing
locally. May have been a cache issue on my end, as I don't know if
Andreas has had time to put up the files I sent. I'll do some testing
in Opera tonight after work.
Michael
^ permalink raw reply [nested|flat] 9+ messages in thread
end of thread, other threads:[~2003-11-12 19:49 UTC | newest]
Thread overview: 9+ messages (download: mbox mbox.gz follow: Atom feed)
-- links below jump to the message on this page --
2003-11-11 17:11 Files on their way Michael Glaesemann <[email protected]>
2003-11-11 18:04 ` Josh Berkus <[email protected]>
2003-11-11 18:21 ` Michael Glaesemann <[email protected]>
2003-11-12 03:08 Re: Files on their way Michael Glaesemann <[email protected]>
2003-11-12 03:15 ` Michael Glaesemann <[email protected]>
2003-11-12 08:29 ` Jeroen Ruigrok/asmodai <[email protected]>
2003-11-12 17:39 ` Josh Berkus <[email protected]>
2003-11-12 19:49 ` Michael Glaesemann <[email protected]>
2003-11-12 03:34 ` Michael Glaesemann <[email protected]>
This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox