HTMLPurifier.org redesign
Moderator: General Moderators
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
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.
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.
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
Wow. I see what you mean.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.
Although, that example would be quickly cured by moving one of the left bars to the right side and the content in the center.
- RobertGonzalez
- Site Administrator
- Posts: 14293
- Joined: Tue Sep 09, 2003 6:04 pm
- Location: Fremont, CA, USA
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
Yeah, but in the case of navigation, flowing around it is a bit unconventional.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.
In HTMLPurifier though, the boxes aren't navigation, just pretty. :-p
- RobertGonzalez
- Site Administrator
- Posts: 14293
- Joined: Tue Sep 09, 2003 6:04 pm
- Location: Fremont, CA, USA
- Kieran Huggins
- DevNet Master
- Posts: 3635
- Joined: Wed Dec 06, 2006 4:14 pm
- Location: Toronto, Canada
- Contact:
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.
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.
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
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.
I agree. The extra space focuses the text.
- RobertGonzalez
- Site Administrator
- Posts: 14293
- Joined: Tue Sep 09, 2003 6:04 pm
- Location: Fremont, CA, USA
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.
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".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.
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)
- Ambush Commander
- DevNet Master
- Posts: 3698
- Joined: Mon Oct 25, 2004 9:29 pm
- Location: New Jersey, US
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.
@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.
- RobertGonzalez
- Site Administrator
- Posts: 14293
- Joined: Tue Sep 09, 2003 6:04 pm
- Location: Fremont, CA, USA
- Ambush Commander
- DevNet Master
- Posts: 3698
- Joined: Mon Oct 25, 2004 9:29 pm
- Location: New Jersey, US
- Ambush Commander
- DevNet Master
- Posts: 3698
- Joined: Mon Oct 25, 2004 9:29 pm
- Location: New Jersey, US