Re: [WSG] font too small??
Thank you for the detailed reply, Felix. You've certainly given me
something to think about and work on.
~john
_
Dr. Zeus Web Development
http://www.DrZeus.net
"content without clutter"
on 11/27/2004 6:21 PM Felix Miata said the following:
john wrote on Fri, 26 Nov 2004 17:26:19 +:
For the most part, the debute of my "standards-friendly" redesign has
been met with great fanfare, but I've been receiving a few emails from
people saying that the text is "way too small." This, I do not
understand, as I've used em to specify font sizes, and they all look
good to most. Of course, I'm not striving for MOST...I want ALL.
So, what would be affecting these users who are saying the text is too
small? Default computer font size? What do I tell them, or is there
anything more I can do on my site?
http://cslewis.drzeus.net
From http://cslewis.drzeus.net/style.css I collected the following:
font-size: 0.7em; .new
font-size: 0.7em; .small
font-size: 0.8em; #tabmenu a, a.active
font-size: 0.8em; #content
font-size: 0.8em; #sidemenu li a
font-size: 0.85em; #footer
font-size: .9em; td
font-size: 100.01%; body
font-size: 1em; .introtext
font-size: 1em; .paper
font-size: 1em; #content ul
font-size: 1.2em; #qotd blockquote p
font-size: 400%; .drop
font-size: 12px; #secondarymenu
font-size: 17px; h2
font-size: 20px; h1
font-size: 36px; #banner h1
Are all the last four affiliated with images? If not, they too should be
sized in em, keywords, or percent.
and from http://cslewis.drzeus.net/forums/templates/peasoup/peasoup.css
font-size: 10px; .copyright
font: 11px input,textarea, select
font-size: 11px; .code
font-size: 11px; .gensmall
font-size: 11px; .name
font-size: 11px; .postdetails
font-size: 11px; .quote
font-size: 11px; .topictitle
font-size: 11px; input.button
font-size: 11px; th
font-size: 12px .cattitle
font-size: 12px; .forumlink
font-size: 12px; .gen
font-size: 12px; .genmed
font-size: 12px; .mainmenu
font-size: 12px; th.thHead,td.catHead
font-size: 14px; .postbody
font-size: 18px; .maintitle,h1,h2
Looking at the the homepage with Domi, I see some cascading ems e.g.:
#content .small = 80% * 70% = 56% Verdana(huge),Arial(large),helv(average)
#content .introtext = 80% * 120% = 96% georgia(average),tnr(small),times(small)
Visitor 1 with 800x600 and default (his preference) set to 13px arrives
and sees:
#content = 80% = 10.4px
#content .small = 80% * 70% = 7.28px
#content .introtext = 80% * 120% = 12.48px
#sidemenu li a = 80% = 10.4px
http://members.ij.net/mrmazda/tmp/Images/cslewis1.png
The minimum intelligible size for a PC display is 9px, so your #content
.small is clearly too small no matter how good the eyes and large the
display.
If it was me, I'd not let the cascade happen. Try using a keyword
instead in .small at least.
Visitor 2 with flat panel 1400x1050 and default (his preference) set to
22px arrives and sees:
#content = 80% = 17.6px
#content .small = 80% * 70% = 12.3px
#content .introtext = 80% * 120% = 21.1px
#sidemenu li a = 80% = 17.6px
http://members.ij.net/mrmazda/tmp/Images/cslewis2.png
Then he clicks the link "forums" and sees:
again http://cslewis.drzeus.net/forums/templates/peasoup/peasoup.css
plus inline styles:
font-size: 0.6em; #footer = 13.2px
font-size: 0.8em; #tabmenu a, a.active = 17.6px
font-size: 20px; h1
font-size: 36px; #banner h1
http://members.ij.net/mrmazda/tmp/Images/cslewis3.png
So, most of what he sees on arrival is smaller than his default, then he
clicks a link, and most of the new page shrinks more, which easily could
be the people complaining. Also, it shows a significant reason why I so
rarely try to use any web forum.
http://members.ij.net/mrmazda/tmp/Images/cslewis4.png shows result of
user above zooming the same page enough to restore the main content to
his preferred size.
If the site was one I frequent, it would probably look something like
this:
http://members.ij.net/mrmazda/tmp/Images/cslewis5.png
due to user stylesheet with rules something like:
@-moz-document url-prefix(http://cslewis.drzeus.net/) {
.small {font-size: smaller !important;} /* or font-size: small */
.new {font-size: x-small !important;} /* or font-size: small */
h1 {font-size: x-large !important;}
h2 {font-size: large !important;}
#tabmenu a, a.active {font-size: small !important;}
#qotd {font-family: Arial, Helvetica, sans-serif !important;}
#qotd blockquote p {font-size: medium !important;}
#content, #content ul {font-size: medium !important;}
#content blockquote {font-family: Arial, Helvetica, sans-serif !important;}
#footer {font-size: x-small !important;}
#sidemenu li a {font-size: small !important;}
#secondarymenu {font-size: x-small !important;} /* or font-size: small */}
Maybe your stylesheets could apply the Golden Rule (Matthew 7:12) wholly
(main content 100% based) instead of partially (merely resizable in browsers
lacking zoom).
See also http://members.ij.net/mrmazda/auth/defaultsize.html and URL below
*
Re: [WSG] font too small??
john wrote on Fri, 26 Nov 2004 17:26:19 +:
> For the most part, the debute of my "standards-friendly" redesign has
> been met with great fanfare, but I've been receiving a few emails from
> people saying that the text is "way too small." This, I do not
> understand, as I've used em to specify font sizes, and they all look
> good to most. Of course, I'm not striving for MOST...I want ALL.
> So, what would be affecting these users who are saying the text is too
> small? Default computer font size? What do I tell them, or is there
> anything more I can do on my site?
> http://cslewis.drzeus.net
>From http://cslewis.drzeus.net/style.css I collected the following:
font-size: 0.7em; .new
font-size: 0.7em; .small
font-size: 0.8em; #tabmenu a, a.active
font-size: 0.8em; #content
font-size: 0.8em; #sidemenu li a
font-size: 0.85em; #footer
font-size: .9em; td
font-size: 100.01%; body
font-size: 1em; .introtext
font-size: 1em; .paper
font-size: 1em; #content ul
font-size: 1.2em; #qotd blockquote p
font-size: 400%; .drop
font-size: 12px; #secondarymenu
font-size: 17px; h2
font-size: 20px; h1
font-size: 36px; #banner h1
Are all the last four affiliated with images? If not, they too should be
sized in em, keywords, or percent.
and from http://cslewis.drzeus.net/forums/templates/peasoup/peasoup.css
font-size: 10px; .copyright
font: 11px input,textarea, select
font-size: 11px; .code
font-size: 11px; .gensmall
font-size: 11px; .name
font-size: 11px; .postdetails
font-size: 11px; .quote
font-size: 11px; .topictitle
font-size: 11px; input.button
font-size: 11px; th
font-size: 12px .cattitle
font-size: 12px; .forumlink
font-size: 12px; .gen
font-size: 12px; .genmed
font-size: 12px; .mainmenu
font-size: 12px; th.thHead,td.catHead
font-size: 14px; .postbody
font-size: 18px; .maintitle,h1,h2
Looking at the the homepage with Domi, I see some cascading ems e.g.:
#content .small = 80% * 70% = 56% Verdana(huge),Arial(large),helv(average)
#content .introtext = 80% * 120% = 96% georgia(average),tnr(small),times(small)
Visitor 1 with 800x600 and default (his preference) set to 13px arrives
and sees:
#content = 80% = 10.4px
#content .small = 80% * 70% = 7.28px
#content .introtext = 80% * 120% = 12.48px
#sidemenu li a = 80% = 10.4px
http://members.ij.net/mrmazda/tmp/Images/cslewis1.png
The minimum intelligible size for a PC display is 9px, so your #content
.small is clearly too small no matter how good the eyes and large the
display.
If it was me, I'd not let the cascade happen. Try using a keyword
instead in .small at least.
Visitor 2 with flat panel 1400x1050 and default (his preference) set to
22px arrives and sees:
#content = 80% = 17.6px
#content .small = 80% * 70% = 12.3px
#content .introtext = 80% * 120% = 21.1px
#sidemenu li a = 80% = 17.6px
http://members.ij.net/mrmazda/tmp/Images/cslewis2.png
Then he clicks the link "forums" and sees:
again http://cslewis.drzeus.net/forums/templates/peasoup/peasoup.css
plus inline styles:
font-size: 0.6em; #footer = 13.2px
font-size: 0.8em; #tabmenu a, a.active = 17.6px
font-size: 20px; h1
font-size: 36px; #banner h1
http://members.ij.net/mrmazda/tmp/Images/cslewis3.png
So, most of what he sees on arrival is smaller than his default, then he
clicks a link, and most of the new page shrinks more, which easily could
be the people complaining. Also, it shows a significant reason why I so
rarely try to use any web forum.
http://members.ij.net/mrmazda/tmp/Images/cslewis4.png shows result of
user above zooming the same page enough to restore the main content to
his preferred size.
If the site was one I frequent, it would probably look something like
this:
http://members.ij.net/mrmazda/tmp/Images/cslewis5.png
due to user stylesheet with rules something like:
@-moz-document url-prefix(http://cslewis.drzeus.net/) {
.small {font-size: smaller !important;} /* or font-size: small */
.new {font-size: x-small !important;} /* or font-size: small */
h1 {font-size: x-large !important;}
h2 {font-size: large !important;}
#tabmenu a, a.active {font-size: small !important;}
#qotd {font-family: Arial, Helvetica, sans-serif !important;}
#qotd blockquote p {font-size: medium !important;}
#content, #content ul {font-size: medium !important;}
#content blockquote {font-family: Arial, Helvetica, sans-serif !important;}
#footer {font-size: x-small !important;}
#sidemenu li a {font-size: small !important;}
#secondarymenu {font-size: x-small !important;} /* or font-size: small */}
Maybe your stylesheets could apply the Golden Rule (Matthew 7:12) wholly
(main content 100% based) instead of partially (merely resizable in browsers
lacking zoom).
See also http://members.ij.net/mrmazda/auth/defaultsize.html and URL below
--
"Congress shall make no law respecting an establishment of religion or
prohibiting the free exercise thereof..." U.S. Constitution, Amendment 1
Team OS/2 ** Reg. Linux User #211409
Felix Miata *** http://members.ij.net/mrmazda/auth/wauth.html
Re: [WSG] font too small??
erm, yes font-size is usually a strongly debated topic, not only here
but on any list. I suggest checking out the css-d wiki which has a
pretty good explanation of the issues and answers most questions anyone
could have.
Start here: http://css-discuss.incutio.com/?page=FontSize
I also suggest that rather than debate the pros and cons of font-sizing
again, anyone interested in this issue should search the list archive of
the last couple of weeks.
Terrence Wood
Michael Kear wrote:
I had this same problem a short while ago, and some listers might recall a
spirited exchange that occurred from our friendly single-issue list member.
The solution is to put a percentage value in the body style. There are
differences of opinion as to what percentage you ought to have, but for me
the nicest result comes from having the body style in your CSS sheet have
the following:
body {font-size: 76%;}
For some reason, 76% works better than 75%. Don't ask me why. It was
explained to me at the time but to tell the truth I didn't understand. Just
take it from me that 76% gives you a better result than 75%.
Hope this helps you. It did help me a lot.
Cheers
Mike Kear
--
***
Are you in the Wellington area and interested in web standards?
Wellington Web Standards Group inaugural meeting 9 Dec 2004.
See http://webstandardsgroup.org/go/event24.cfm for details
***
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
RE: [WSG] font too small??
I had this same problem a short while ago, and some listers might recall a
spirited exchange that occurred from our friendly single-issue list member.
The solution is to put a percentage value in the body style. There are
differences of opinion as to what percentage you ought to have, but for me
the nicest result comes from having the body style in your CSS sheet have
the following:
body {font-size: 76%;}
For some reason, 76% works better than 75%. Don't ask me why. It was
explained to me at the time but to tell the truth I didn't understand. Just
take it from me that 76% gives you a better result than 75%.
Hope this helps you. It did help me a lot.
Cheers
Mike Kear
Windsor, NSW, Australia
AFP Webworks
http://afpwebworks.com
.com,.net,.org domains from AUD$20/Year
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of john
Sent: Saturday, 27 November 2004 4:26 AM
To: web standards group
Subject: [WSG] font too small??
For the most part, the debute of my "standards-friendly" redesign has
been met with great fanfare, but I've been receiving a few emails from
people saying that the text is "way too small." This, I do not
understand, as I've used em to specify font sizes, and they all look
good to most. Of course, I'm not striving for MOST...I want ALL.
So, what would be affecting these users who are saying the text is too
small? Default computer font size? What do I tell them, or is there
anything more I can do on my site?
http://cslewis.drzeus.net
Thanks again.
--
~john
_
Dr. Zeus Web Development
http://www.DrZeus.net
"content without clutter"
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
RE: [WSG] font too small??
John, Have you thought about running a JavaScript font resizer and storing preferences in a cookie. It won't work for whatever percentage (9-13?) of users who disable JavaScript but at least it will permit the majority of your audience to set and return. Something a long the lines of http://www.seowebsitepromotion.com/site_map.htm at the top of the screen. The code's pretty simple and I can sort it off-list if you wish. Mike Pepper Accessible Web Developer Internet SEO and Marketing Analyst http://www.seowebsitepromotion.com Administrator Guild of Accessible Web Designers [EMAIL PROTECTED] http://www.gawds.org -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of john Sent: 26 November 2004 17:26 To: web standards group Subject: [WSG] font too small?? For the most part, the debute of my "standards-friendly" redesign has been met with great fanfare, but I've been receiving a few emails from people saying that the text is "way too small." This, I do not understand, as I've used em to specify font sizes, and they all look good to most. Of course, I'm not striving for MOST...I want ALL. So, what would be affecting these users who are saying the text is too small? Default computer font size? What do I tell them, or is there anything more I can do on my site? http://cslewis.drzeus.net Thanks again. -- ~john _ Dr. Zeus Web Development http://www.DrZeus.net "content without clutter" ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ** -- No virus found in this incoming message. Checked by AVG Anti-Virus. Version: 7.0.289 / Virus Database: 265.4.2 - Release Date: 24/11/04 -- No virus found in this outgoing message. Checked by AVG Anti-Virus. Version: 7.0.289 / Virus Database: 265.4.2 - Release Date: 24/11/04 ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] font too small??
SJ> You define font-size for the #content text to 80% of my preferred SJ> font-size. For me that's too small for reading comfortably, especially SJ> if I don't use Verdana but another less huge font. And on the other hand, I find the 0.8em to be just fine. In fact, I set much of my font sizes to 0.75em or so. Obviously, that's what makes the zooming functionality useful. Of course, the big problem is that the vast majority of users aren't aware of that functionality and therefore, don't know to adjust the zoom when they encounter a page that is unreadable to them. SJ> Zooming the page in Mozilla breaks the positioning of the header and SJ> ends up in overlapping elements. I see this as well and I believe that's because John defines all his margins and paddings in px, which don't scale. If you want users to be able to zoom the page, you should define margins and paddings in em or % (though I believe em is the preferred method). -Sam ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] font too small??
Thank you, Sam. I agree...this is what I've been telling them. Admittedly, I was hoping for a better solution. It's not very good to have people leave your site and never return simply because they didn't realise they're brower's settings weren't optimised for their own needs. ~john _ Dr. Zeus Web Development http://www.DrZeus.net "content without clutter" on 11/26/2004 5:40 PM Sam Brown said the following: j> So, what would be affecting these users who are saying the text is too j> small? Default computer font size? What do I tell them, or is there j> anything more I can do on my site? I have encountered this many times on my site and EVERY time it's because the user has the text size on their browser set to something other than Medium or 100%. Because the whole point of that setting is to allow users to set the text size to their own preferences (and the whole point of using em is to allow for easy scaling), there is nothing you can or should do beyond suggesting they set their text size back to the default. -Sam ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] font too small??
john wrote: So, what would be affecting these users who are saying the text is too small? Default computer font size? What do I tell them, or is there anything more I can do on my site? http://cslewis.drzeus.net You define font-size for the #content text to 80% of my preferred font-size. For me that's too small for reading comfortably, especially if I don't use Verdana but another less huge font. Additionally there might be a special problem for some IE users. There are IE installations, that always default to font-size: smallest if sizes are only given in em. To help those users you need a base font-size in %. Try adding font-size: 100.01% to your body Style. The .01 part is for compenating possible rounding errors in Safari and Opera. Zooming the page in Mozilla breaks the positioning of the header and ends up in overlapping elements. hth Susanne -- Susanne Jäger http://sujag.de - Webentwicklung und -beratung ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] font too small??
j> So, what would be affecting these users who are saying the text is too j> small? Default computer font size? What do I tell them, or is there j> anything more I can do on my site? I have encountered this many times on my site and EVERY time it's because the user has the text size on their browser set to something other than Medium or 100%. Because the whole point of that setting is to allow users to set the text size to their own preferences (and the whole point of using em is to allow for easy scaling), there is nothing you can or should do beyond suggesting they set their text size back to the default. -Sam ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
