Page 2 of 3
Posted: Mon Jun 04, 2007 5:17 pm
by jayshields
I don't know whether I prefer the Safe Clean Open boxes horizontally or vertically, but if you're going to keep them vertical it would be better if the text wrapped around them.
I dislike websites which have all the text crammed across the screen after you scroll down past the outer columns.
A website I recently checked out which does this to the extreme is d11's actually. Check out
this page and scroll down a little. Your page obviously isn't this bad but it's the same effect.
Posted: Mon Jun 04, 2007 6:08 pm
by superdezign
jayshields wrote:I don't know whether I prefer the Safe Clean Open boxes horizontally or vertically, but if you're going to keep them vertical it would be better if the text wrapped around them.
I dislike websites which have all the text crammed across the screen after you scroll down past the outer columns.
A website I recently checked out which does this to the extreme is d11's actually. Check out
this page and scroll down a little. Your page obviously isn't this bad but it's the same effect.
Wow. I see what you mean.
Although, that example would be quickly cured by moving one of the left bars to the right side and the content in the center.
Posted: Mon Jun 04, 2007 6:12 pm
by RobertGonzalez
That would just move the space to the sides. You can always make floating divs for the navigation so that the content flows around it when rendered.
Posted: Mon Jun 04, 2007 6:31 pm
by Weirdan
That would just move the space to the sides. You can always make floating divs for the navigation so that the content flows around it when rendered.
I'd prefer 'position:fixed' added to navigation boxes.
Posted: Mon Jun 04, 2007 6:43 pm
by superdezign
Everah wrote:That would just move the space to the sides. You can always make floating divs for the navigation so that the content flows around it when rendered.
Yeah, but in the case of navigation, flowing around it is a bit unconventional.
In HTMLPurifier though, the boxes aren't navigation, just pretty. :-p
Posted: Mon Jun 04, 2007 6:43 pm
by RobertGonzalez
And unconventional is not always bad, especially when produced correctly.
Posted: Mon Jun 04, 2007 9:22 pm
by Kieran Huggins
I, too, like it. Very nice job!
the only snag for me is the lack of a giant download button. Maybe shrink the side boxes a little and put it under there?
Posted: Tue Jun 05, 2007 3:36 am
by matthijs
I don't understand why people want the text to take up the full width of the screen at all times. I have my browser opened at a fairly regular resolution, 1000- 1200px, like most people. (I say most, not all! Window sizes is another discussion).
Text taking up that much space horizontally is very hard to read.
When I sit at my table and open up a book, I wouldn't want the book to take up the full width of my 2m (6 ft) wide table. Besides the negative effects it would have on the readability and the pain in my neck it would cause, a bit of empty space left and right helps me focus on the book. A table full of crap and other stuff just distracts.
Really, a bit of whitespace left and right only helps improve the usability and experience of your readers.
Posted: Tue Jun 05, 2007 8:20 am
by superdezign
matthijs wrote:I don't understand why people want the text to take up the full width of the screen at all times. I have my browser opened at a fairly regular resolution, 1000- 1200px, like most people. (I say most, not all! Window sizes is another discussion).
Text taking up that much space horizontally is very hard to read.
When I sit at my table and open up a book, I wouldn't want the book to take up the full width of my 2m (6 ft) wide table. Besides the negative effects it would have on the readability and the pain in my neck it would cause, a bit of empty space left and right helps me focus on the book. A table full of crap and other stuff just distracts.
Really, a bit of whitespace left and right only helps improve the usability and experience of your readers.

Reminds me of how we complained about Everah's PHPBeginner website not having enough margin.
I agree. The extra space focuses the text.
Posted: Tue Jun 05, 2007 10:23 am
by RobertGonzalez
I think there needs to be a balance though. Imagine reading a book (or a newspaper or magazine) where the page is 5.5 inches wide and the margins are 2 inches on each side. That whole fixed width 760px crap looks like garbage on a 1024 X 768 res monitor. Even worse on larger resolution.
I like space as much as the next guy, but it also needs to work with the page and the content. Cramming it all into a single skinny column when there is a bunch of unused space around it looks unprofessional to me.
Posted: Tue Jun 05, 2007 11:57 am
by matthijs
Everah wrote:That whole fixed width 760px crap looks like garbage on a 1024 X 768 res monitor. Even worse on larger resolution.
I like space as much as the next guy, but it also needs to work with the page and the content. Cramming it all into a single skinny column when there is a bunch of unused space around it looks unprofessional to me.
How can it "look unprofessional"? The basic rule is that text needs a bit of design to be optimized for reading. So choosing the right font, enough line-height, and a not-too small or not too wide line-length. I wouldn't call a 1024px wide single column of text "professional".
I just counted the amount of characters of 16 px default text on a 1024px screen: 168.
Optimum is around 40-50 or so? (10-14 words)
Posted: Fri Jun 08, 2007 10:55 pm
by Ambush Commander
Sorry about letting this thread languish a little. I'm trying to implement all of your suggestions before posting again, but I've gotten bogged down by a little problem.
@matthijs: I will reduce the header size slightly. However, I think I already have summary-text in it.
@Everah: CSS error fixed, thanks!
@jayshields and co.: Line length is a complicated issue, and I think the way I'm going to work around excessively layouts is to implement something similar to
Switchy McLayout. The idea is that the layout should adapt to screen-sizes, which I find quite attractive, since one layout does not fit all. I currently code all my layouts for an 800 x 600 screen, which marginalizes those with big monitors (I actually do have a large monitor, but I can't stand surfing it maximized.)
I did a bit of independent study of typography while I was learning to use LaTeX, so I appreciate the importance of reasonable line-lengths. Don't worry: your calls for change are not lost upon me!
@Kieran Huggins: The download button is the snag that I have hit. I will elaborate:
The whitespace still bugs me, mainly because it's not uniform: the text is weighted towards the right side of the page. In my working copy, I have set clear:left to the "Background" header so it is now takes up the entire page width, which opens up a bit of white-space underneath the leading text. I would like to put the download buttons here, but what I currently have looks UGLY!
I'm probably going to add an arrow gradient to the background, but that won't fix the funky borders. Soliciting recommendations to beautify this. Also, is there any way to make this "fill up" the remaining space? I don't think it looks too good on wide screens.
Posted: Sat Jun 09, 2007 10:37 am
by RobertGonzalez
Why don't you make the layout fluid instead of fixed width? As for the download buttons, you can always wrap them inside a <p> or <div> inside the content area where the text is at.
Posted: Sat Jun 09, 2007 11:28 am
by Ambush Commander
It is fluid! Well, to be more precise, the summary boxes are fixed with and the main content is fluid.
I'm not looking so much for technical solutions as ideas on what would look "good" for a download button. I can probably implement any design you throw at me, but I need to know what to implement.
Posted: Sun Jun 10, 2007 10:04 pm
by Ambush Commander
Alright, after fiddling around with the download box for the better part of the hour, I've made a modified version of it live. Comments?