Hello- I’ve had to ignore my web site for a while and its awesome to get back into it.
But, this led me to question the content width of my web site @ 1070. Is this still a good width for the body content?
Did some quick research and found the following:
Any opinions on the best body content width?
Thanks!
I would say 1000+ is always a good bet…but what I worry about much more nowadays is all the Smart(or not so)Phones and tablets. I would figure that more people use handhelds than desktops generally…?
My 13.3-inch MacBook Pro has this: (2560 x 1600)
I approach this somewhat differently. I aim towards a maximum of 80 characters (including spaces and punctuation) per line. It’s an old-school rule from the print industry, but in somewhat of a rarity, it is a rule that is equally translatable across into responsive web design too.
Rules are there to be broken. But if I find the characters per-line measurement regularly exceeding 80, I’ll either adjust the theme settings to ‘squash’ the main content container narrower or interject the page design with a theme sidebar, columns or some floating content (like an image, pull quote or embedded video).
A width of 1070px might still be okay to use. But it depends what your characters per-line measurement is. That measurement itself is influenced by factors like font size, font weight, font family, letter spacing and CSS box model etc.
I normally go for 1400px with a all my content within a container (BWD BluePrint) that has a 5% padding left/right for widths below 1400.
With regard to what Will said about fonts; I use Joe Workman’s FontPro to change the font size at 4 breakpoints where I aim for the 70/80 chars per line.
All other content (images, graphics etc) is sized by %, I very very rarely use px unless its something tiny.
Hey Everyone- Thank you for your insights. The prospective clients that visit my sight are buyers within very large companies. Last I looked, most visitors during traditional work hours are visiting on a non mobile device with desktop taking up about 69% of viewers. But when I work on my site, I’m aggressively ensuring its very responsive and nice on mobile devices.
The main reason I ask is that at a width of 1070, it looks/feels very narrow on a larger display and I find mindself scrolling up and down which might be reduced with a slightly larger content width.
Guess I should dig down and look at the 80/20 rule of viewer display resolution and take it from there. Still wanted to get insights into what others are doing and so far, I’m glad I asked.
Thanks!
PS- As a 10+yr RW user, its great to see Will still active on this forum. Thanks for everyone’s time!
Hi Paul, I find this interesting as it is one aspect of presentation that for some reason I find challenging and sort of let it go. Do you use columns to break up text blocks? How do you keep it to 70-80. The posts above range up I00 chars and are bearable to read. I know its not a fixed thing. Whats the psychology behind it?
To keep it in the 70/80 range I simply change the font size to suit the width(s). FontPro makes it easy but it’s still a case of trial and error until the particular font you’re using hits the sweet spot.
It’s not an absolute rule but aiming for 70ish is easy enough, I can’t remember where I heard about it but I know it’s just one of many good typography principles to follow.
A quick G search came up with this http://webtypography.net/2.1.2
Piece on larger type http://mikeyanderson.com/optimal_characters_per_line
Could you post a link to one of your sites so I can see it visually?
I haven’t counted (as I said it’s a guide, not a rule) but this one should be 80’ish at various widths https://www.hometurf.dma-ni.com
Obviously it’s going to be more/less per line as you change browser width but as I said above I use a FontPro to change the font size as 4 breakpoints to try and sorta maintain the ratio.
Okay, thanx for the link- I will take a look. What Iam aiming at is more to get a visual feel - thats how I understand the idea of it. Im not really a ‘rule’ type!
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.