The issue of line length: style vs readability

[Haines Brown]

In another thread, the following comment was made:

I tried the following with Mozilla Firebird (using Gecko/20030712).

Isofarro wrote:

http://www.pga.com/openchampionship/

I found this site to be unimpressive. The design doesn't scale as I
size the browser window horizontally and so I either waste space or
I get an annoying horizontal scrollbar.

I publish thousands of plain longish documents, and my concern is much
more for their readability than aesthetic design. Consequently, I make
them all fixed width of 600px, with no border, and place them
horizontally in the middle of the browser window.

In publishing text, it is said that one must keep line length down to
40-60 characters to make the text easily readable. This is why text is
written in columns, but I don't want to confront the challenges of
doing newspaper style columns (balanced) in CSS (intimidating and
probably would slow document production).

Therefore I have compromised. A 600px page width gives me a line
length of 80 characters, which is on the order of the above
recommendation, and it is also a page size that can be seen on all
browsers. Because the page is centered and has no border, I don't
think it looks too badly even with higher resolution.

And yet Isofarro's complaint above remains valid. There is space
"wasted," although, with the centering and no border, perhaps that's
not so objectionable.

What do people think? Should I persist, or should I presume higher
resolution, make my page 1000px wide and struggle use two balanced
columns?

An example of current page design to illustrate my point:
www.hartford-hwp.com/archives/10/016.html

--
Haines Brown
br****@hartford-hwp.com
kb****@arrl.net
www.hartford-hwp.com

[Jim Dabell]

Haines Brown wrote:

[snip]

I publish thousands of plain longish documents, and my concern is much
more for their readability than aesthetic design.
Sounds fair.
[snip] In publishing text, it is said that one must keep line length down to
40-60 characters to make the text easily readable.
That's about right.

This is why text is written in columns, but I don't want to confront the
challenges of doing newspaper style columns (balanced) in CSS
(intimidating and probably would slow document production).
Fair enough.

Therefore I have compromised. A 600px page width gives me a line
length of 80 characters,
What it gives _you_ is irrelevant. It can and will give other people line
lengths of varying numbers of characters. 600px says nothing about the
width of the characters.

which is on the order of the above recommendation, and it is also a page
size that can be seen on all browsers.
I'm not sure what you mean by this. Are you saying that you think all
surfers are capable of 600px wide canvases? That's not true. And, as you
previously stated, the goal is for documents to be easily readable, so
avoidance of horizontal scrolling is a requirement too.

What do people think? Should I persist, or should I presume higher
resolution, make my page 1000px wide and struggle use two balanced
columns?

p { width: 50em; max-width: 60em }
html > body p { width: auto }

This will still not be the best when viewed with Internet Explorer, but at
least there will be some meaningful correlation between number of
characters and the width of the paragraph now.

--
Jim Dabell

[Stan Brown]

In article <m2************@hartford-hwp.com> in
comp.infosystems.www.authoring.stylesheets, Haines Brown
<br****@hartford-hwp.com> wrote:

I publish thousands of plain longish documents, and my concern is much
more for their readability than aesthetic design.
So your philosophy is right. But,
Consequently, I make
them all fixed width of 600px, with no border, and place them
horizontally in the middle of the browser window.

In publishing text, it is said that one must keep line length down to
40-60 characters to make the text easily readable.

Then why don't you specify your width in ems instead of pixels?

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
validator: http://jigsaw.w3.org/css-validator/

[Fredrik Jonson]

In <m2************@hartford-hwp.com> Haines Brown wrote:

I publish thousands of plain longish documents, and my concern is much
more for their readability than aesthetic design. In publishing text,
it is said that one must keep line length down to 40-60 characters to
make the text easily readable. I have compromised. A 600px page width
gives me a line length of 80 characters.

Well, 600px table width gives you 600px table width and aparantly 80
characters on the screen and software combo you've tested it on. You
cant say for sure how it looks on any other platforms, however.

I actually think it would be quite advantageous for you to use css
instead of fixt-pixel-tables.

In css it is possible to set the witdh of a row in the unit of
characters. So you could simply use:

p {
max-width: 66ex; /* or 66em */
line-height: 1.3em; /* See comment [0] */
}

To get row length of 66 characters maximum, if the browser window is
smaller than 66ex the line will wrap. This is better since people with
extremly high or low resolution monitors (as a example) then get your
texts dispayed more to your intent.

I think that you could actually make your text more visually appealing
with the help of css with quite little effort since you don't use too
much layout junk in your pages.

[0] = and while you're at it, consider increasing the row height a bit.
Personally I find increased line space makes text, especially long
paragraphs, easier to read on the screen. But maybe that is just me? =)

--
Fredrik Jonson

[Stan Brown]

In article <9c********************************@4ax.com> in
comp.infosystems.www.authoring.stylesheets, Steve Pugh
<st***@pugh.net> wrote:

Or better still, do nothing and let the user pick the font size/line
length combination that suits them best.

But that would mean ... (gasp!) ... giving up control!

Users can't be trusted to pick their own font sizes and line widths,
everybody knows that.

(No, I'm _not_ serious. But the above does seem to be the prevailing
attitude, and I feel that those few of us who want to see the Web
used the way it was intended are just dipping the ocean with a
fork.)

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
validator: http://jigsaw.w3.org/css-validator/

[Jacqui or (maybe) Pete]

In article <m2************@hartford-hwp.com>, br****@hartford-hwp.com
says...
....

I publish thousands of plain longish documents, and my concern is much
more for their readability than aesthetic design. Consequently, I make
them all fixed width of 600px, with no border, and place them
horizontally in the middle of the browser window.

In publishing text, it is said that one must keep line length down to
40-60 characters to make the text easily readable. This is why text is
written in columns, but I don't want to confront the challenges of
doing newspaper style columns (balanced) in CSS (intimidating and
probably would slow document production).

....
Personally I like predominantly text documents to fill my browser window
(with a slim margin to separate the text from the scrollbars etc). I
then slim my browser window down to whatever's comfortable.

For instance, if I was making a submission to zen garden then I'd do
something like:

http://porjes.haxorz.org/zengarden.html

and then read it at about 500px-wide. No chance of any designer awards,
but I find it easy to read.

Perhaps one should include a link to a short tutorial on resizing
windows somewhere on each document?

[Ian Rastall]

On Fri, 18 Jul 2003 15:55:06 +0100, Steve Pugh <st***@pugh.net> wrote:

As you have no control over how large the font is how can you set the
line length in pixels?

I do three sites in the style you're talking about (sorta), and I set
the right and left margins to 10%. Whether or not that's a good
solution, I have no idea. It seems to work well.

Ian
--
http://www.aspipes.org/
http://www.bookstacks.org/

[Stephen Poley]

On Fri, 18 Jul 2003 14:44:52 GMT, Haines Brown <br****@hartford-hwp.com>
wrote:

Therefore I have compromised. A 600px page width gives me a line
length of 80 characters,
As pointed out elsewhere, it may give your readers something totally
different.
which is on the order of the above
recommendation, and it is also a page size that can be seen on all
browsers.
No it can't.
Because the page is centered and has no border, I don't
think it looks too badly even with higher resolution.

And yet Isofarro's complaint above remains valid. There is space
"wasted," although, with the centering and no border, perhaps that's
not so objectionable.

What do people think? Should I persist, or should I presume higher
resolution, make my page 1000px wide and struggle use two balanced
columns?

No, definitely not. I suggest you set the max-width property of your
text in em units, erring slightly on the long side compared to what you
like yourself. I do the same on my site - see sig. Anyone who finds it a
bit too long can always make their window narrower. (Of course people
who use mediocre browsers like IE, which don't support max-width, will
have to do that anyway, but it's hardly a major problem for them.)

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Kim Scarborough]

> No, definitely not. I suggest you set the max-width property of your

text in em units

Shouldn't it be ex units for width?

--
----------------------------------------------------------------------------
Kim Scarborough http://www.unknown.nu/kim/
----------------------------------------------------------------------------
"Those who 'abjure' violence can only do so because others are committing
violence on their behalf."
-- George Orwell
----------------------------------------------------------------------------

[Andy Mabbett]

In message <9c********************************@4ax.com>, Steve Pugh
<st***@pugh.net> writes

A 600px page width gives me a line
length of 80 characters,

... at your font size. At another user's font size that might be 10
characters or it might 1000 characters.

Wow! 1.67 characters per pixel!
--
Andy Mabbett
USA imprisons children without trial, at Guantanamo Bay:
<http://news.bbc.co.uk/1/hi/world/south_asia/2970279.stm>
<http://web.amnesty.org/library/Index/ENGAMR510582003?open&of=ENG-USA>

[Andy Mabbett]

In message <MP************************@news.CIS.DFN.DE>, Jacqui or Pete
<po****@spamcop.net> writes

For instance, if I was making a submission to zen garden then I'd do
something like:

http://porjes.haxorz.org/zengarden.html

Please submit that.
--
Andy Mabbett
USA imprisons children without trial, at Guantanamo Bay:
<http://news.bbc.co.uk/1/hi/world/south_asia/2970279.stm>
<http://web.amnesty.org/library/Index/ENGAMR510582003?open&of=ENG-USA>

[Jacqui or (maybe) Pete]

In article <YL**************@pigsonthewing.org.uk>, usenet200305
@pigsonthewing.org.uk says...

In message <MP************************@news.CIS.DFN.DE>, Jacqui or Pete
<po****@spamcop.net> writes

For instance, if I was making a submission to zen garden then I'd do
something like:

http://porjes.haxorz.org/zengarden.html

Please submit that.

:0)

It says 'Participation: Graphic artists only please.' which certainly
rules me out.

Whilst I genuinely prefer my version to any on that site, they are
trying to reach out to deeziners, and I strongly respect that.

OK - the actual document they've got there would probably be best
presented without any presentational markup at all, but I take it as a
convenient example to be used to demonstrate fancy layout & graphics
using css only.

But there's been enough written on this subject...

[Stephen Poley]

On Sat, 19 Jul 2003 14:40:30 -0500, Kim Scarborough <sl****@unknown.nu>
wrote:

No, definitely not. I suggest you set the max-width property of your
text in em units

Shouldn't it be ex units for width?

Jukka has given you a good answer. I would go further. When I looked at
this a while ago, I came to the conclusion that, given how CSS is
currently defined, the ex unit doesn't do anything useful at all:
http://www.xs4all.nl/~sbpoley/webmatters/emex.html

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Andy Mabbett]

In message <MP************************@news.CIS.DFN.DE>, Jacqui or Pete
<po****@spamcop.net> writes

It says 'Participation: Graphic artists only please.' which certainly
rules me out.
OK; define "artist" ;-)
Whilst I genuinely prefer my version to any on that site, they are
trying to reach out to deeziners, and I strongly respect that.
They can always decline to sue it; from my PoV, it's as important to
show that a CS can give a "plain" presentation as it can a fancy one.
OK - the actual document they've got there would probably be best
presented without any presentational markup at all, but I take it as a
convenient example to be used to demonstrate fancy layout & graphics
using css only.
Quite.
But there's been enough written on this subject...

This is Usenet: that's never stopped anyone yet...
--
Andy Mabbett
USA imprisons children without trial, at Guantanamo Bay:
<http://news.bbc.co.uk/1/hi/world/south_asia/2970279.stm>
<http://web.amnesty.org/library/Index/ENGAMR510582003?open&of=ENG-USA>

[Jacqui or (maybe) Pete]

In article <E$**************@pigsonthewing.org.uk>, usenet200305
@pigsonthewing.org.uk says...

In message <MP************************@news.CIS.DFN.DE>, Jacqui or Pete
<po****@spamcop.net> writes
.... (plain versions of zengarden)
They can always decline to use it; from my PoV, it's as important to
show that a CS can give a "plain" presentation as it can a fancy one.

Then again:

http://www.csszengarden.com/?cssfile...020.css&page=0

by http://sophie-g.net/ is plain enough for me, and although I'm not
quite sure about the right-hand bar the rest is lovely.

How come I've never got IE6 to support first-letter?!