Re: [WSG] webpatterns and patternquiz
Richard, I think you're right on both counts... Yes, in order for this to be effective the more professionals who contribute, the better it will be. And yes, absolutely, it's not about stating this is the ONLY way you can do this but presenting a set of choices. I look forward to seeing the next stage ;o) it's begun already! Get along to http://webpatterns.org/wordpress/?p=4 and start adding some patterns :-)! everyone is welcome, and its easy john John Allsopp style master :: css editor :: http://westciv.com/style_master blog :: dog or higher :: http://blogs.westciv.com/dog_or_higher Web Essentials web development conference :: http://we05.com WebPatterns :: http://webpatterns.org ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Swf - google
I have a swf file in my page.Google will not index. I can print the content of swf in a div with display:none.Is it a good practice ? Does anyone have a better idea ?This is the url: http://www.victoriabratberg.com/betaThanks and sorry
[WSG] Re: Swf - google
Hi, if you put some textlinks to other parts of the site in your home page under or over the flash, google will index it. ** 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] Swf - google
Elton, on Tuesday, December 20, 2005 at 15:33 wsg@webstandardsgroup.org wrote: I have a swf file in my page. Google will not index. I can print the content of swf in a div with display:none. Is it a good practice ? Does anyone have a better idea ? Yep! Use standards and some proprietary IE Conditional Comments ;-) !--[if IE] object width=89 height=13 type=application/x-shockwave-flash codebase=http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0; param name=movie value=/swf/audio.swf / param name=flashvars value=code=Van_Vorst_Park / ![endif]--!--[if !IE]-- object type=application/x-shockwave-flash width=89 height=13 data=/swf/audio.swf?code=Van_Vorst_Park !--![endif]-- div Alternate Content for google to index. /div /object regards Martin ** 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] Swf - google
Put a sitemap on your index page down the bottom so that Google et al can follow the html links. Validate your page also. You are using an xhtml doctype and yet have upper case tags on your page. Regards, Ric Elton Okada wrote: I have a swf file in my page. Google will not index. I can print the content of swf in a div with display:none. Is it a good practice ? Does anyone have a better idea ? This is the url: http://www.victoriabratberg.com/beta Thanks and sorry ** 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] Swf - google
Thanks !!!RegardsEltonOn 12/20/05, Martin Heiden [EMAIL PROTECTED] wrote: Elton,on Tuesday, December 20, 2005 at 15:33 wsg@webstandardsgroup.org wrote: I have a swf file in my page. Google will not index. I can print the content of swf in a div with display:none. Is it a good practice ? Does anyone have a better idea ? Yep! Use standards and some proprietary IE Conditional Comments ;-)!--[if IE]object width=89 height=13 type=application/x-shockwave-flash codebase="" http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0param name=movie value=/swf/audio.swf / param name=flashvars value=code=Van_Vorst_Park /![endif]--!--[if !IE]--object type=application/x-shockwave-flash width=89 height=13 data="" !--![endif]--div Alternate Content for google to index./div/objectregardsMartin** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help**
Re: [WSG] Swf - google
Thanks Ric !! Regards Elton On 12/20/05, Ric Raftis [EMAIL PROTECTED] wrote: Put a sitemap on your index page down the bottom so that Google et alcan follow the html links.Validate your page also.You are using an xhtml doctype and yet have upper case tags on your page.Regards,RicElton Okada wrote: I have a swf file in my page. Google will not index. I can print the content of swf in a div with display:none. Is it a good practice ? Does anyone have a better idea ? This is the url: http://www.victoriabratberg.com/beta Thanks and sorry**The discussion list forhttp://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfmfor some hints on posting to the list getting help**
Re: [WSG] Swf - google
What about this:http://blog.deconcept.com/2005/03/31/proper-flash-embedding-flashobject-best-practices/Regards EltonOn 12/20/05, Ric Raftis [EMAIL PROTECTED] wrote: Put a sitemap on your index page down the bottom so that Google et alcan follow the html links.Validate your page also.You are using anxhtml doctype and yet have upper case tags on your page.Regards, RicElton Okada wrote: I have a swf file in my page. Google will not index. I can print the content of swf in a div with display:none. Is it a good practice ? Does anyone have a better idea ? This is the url: http://www.victoriabratberg.com/beta Thanks and sorry**The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] search box(text area) form width
this might be a bit of dumb question anyideas on how to get this keyword search box any narrower in ie? something like it is in firefox http://www.mcmonagle.biz/mockup/final6.htm http://www.mcmonagle.biz/mockup/index3.css (ie code for search box at bottom of stylesheet) -best kvnmcwebn ** 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] Site Critic
Hi everyone: I apologize for sending this site critic too early, I definitely jumped the gun asking for a critic. I will be making a bunch of changes and make sure to validate all my code before I ask for a site critic in the future. Thank you so much to those of you who, very graciously, gave me some very useful comments and suggestions. If I offended anyone, please accept my apology. Sincerely, Cheree -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of James O'Neill Sent: Saturday, December 17, 2005 7:49 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Site Critic Cheree, One of the first things I will say it looks like you might be writing this in MS Frontpage! You have a lot of inline javascipt: Your may want to take a look at Unobtrusive Javascript http://www.onlinetools.org/articles/unobtrusivejavascript/ Keeping your javascript in an external file will be more efficient and make it easier to maintain. Sierra Pacific Counties: This can be done in all CSS (AlistAPart has great examples).A CSS solution will be more search engine friendly and accessible. Nevada Industrial Parks sections: You can create this using headers and Paragraph tags instead of multiple br tags. This type of solution will be more semantically correct. h2 a href=industrialparks/index.htmNevada Industrial Parks/a/h2 pView a list of industrial parks within Nevada./p h2a href=taxes.htmNevada Taxes/Incentives/ah2 pThe incentives of doing business in Nevada are expansive. Nevada boasts one of the most liberal tax structures in the nation and from a tax-planning perspective, the return on investment in the form of tax saving dollars can be enormous. Explore the numerous advantages of doing business in Nevada./p h2a href=documents/overview.pdfNorthern Nevada Overview/a/h2 . Contact Info Section: A similar solution of using headers would be good and more semantically correct. Also a definition list would be a good set of tags to use here for the pictures and associated information. h2CONTACT INFO/h2 dl dta href=about.htm#simsimg src=images/grant.gif alt=Grant Sims align=left border=0 height=57 width=45Grant Sims/a/dt ddManagerbr 775.834.5742br a href=mailto:[EMAIL PROTECTED][EMAIL PROTECTED]/a/p /dd dta href=about.htm#woodringimg src=images/brad.gif alt=Brad Woodring align=right border=0 height=57 width=48Brad Woodring/adt ddExecutivebr 775.834.3716br a href=mailto:[EMAIL PROTECTED][EMAIL PROTECTED]/a/p /dd /dl I will not go into the multiple h1 issue. Some believe that there should only be one H1 per page, like me, and the rest believe that it is OK! The specification sure does not help. My opinion is that there should only be one h1 per page, take it for what it is worth. =) Just some thoughts to get you going! Similar things can be said of the other site as well! Good luck, Jim! -- __ Bugs are, by definition, necessary. Just ask Microsoft! www.freexenon.com (Consulting) www.arionshome.com (Personal) __ Take Back the Web with Mozilla Fire Fox http://www.getfirefox.com Making a Commercial Case for Adopting Web Standards http://www.maccaws.org/ Web Standards Project http://www.webstandards.org/ Web Standards Group http://www.webstandardsgroup.org/ Guild of Accessible Web Designers http://www.gawds.org/ ** 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 **
[WSG] css print help
http://home.alltel.net/omen/schedule.htm Looks great until you try to print in landscape. Can someone please help me with adjusting the css so that the print preview looks the same as it does in the browser. We're on a IE standard intranet.. sucks I know.. but I appreciate your help in advance. Thanks! -- Auxilium meum a Domino ** 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] Site Critic
Return Receipt Your RE: [WSG] Site Critic document: wasDennis Lapcewich/R6/USDAFS received by: at:12/20/2005 12:28:39 ** 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] Site Critic
Return Receipt Your document: RE: [WSG] Site Critic was received by: Susannah Marks/MOH at:21/12/2005 09:37:17 a.m. Statement of confidentiality: This e-mail message and any accompanying attachments may contain information that is IN-CONFIDENCE and subject to legal privilege. If you are not the intended recipient, do not read, use, disseminate, distribute or copy this message or attachments. If you have received this message in error, please notify the sender immediately and delete this message. * This e-mail message has been scanned for Viruses and Content and cleared by the Ministry of Health's Content and Virus Filtering Gateway * ** 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] Dropped DIV dilemma
Thanks Samuel. I'd actually considered the fixes quite minimal. Apart from a couple of IE hacks, the only 'fix' in place is the mighty clearfix class for float clearing. If you have any suggestions on how the CSS can be minimised I'd be very grateful if you'd share them. Almost everything I know about CSS can be attributed to positive feedback from this list. -- Paul A Noone Webmaster, ASHM [EMAIL PROTECTED] -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Samuel Richardson Sent: Tuesday, 20 December 2005 4:24 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Dropped DIV dilemma If you have to have that many fixes in place for a page that is that simple then your doing something wrong. Paul Noone wrote: Cheers all. I know there's a lot to wde through but most of the fixes, widths and relative positions in place were put in to fix other problems in the first instance. As you say, getting rid of the clearfix solves that particular problem but causes others. Definitely a clearing problem then. What's bugging me is that it was all working just fine until recently. Now...what the hell did I change? Will keep slogging away at it. I've closed the input tags and all validates again. Thanks. -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Bert Doorn Sent: Tuesday, 20 December 2005 3:49 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Dropped DIV dilemma Paul Noone wrote: Problem: http://d81314.i50.quadrahosting.com.au/index.php?module=Newsid=cntnt0 1cntn t01action=detailcntnt01articleid=8cntnt01returnid=11 The Site Updates div gets pushed way down the page. And I've got no idea why/ Strangely all is well in IE (with all the hacks in place I'd hope so!). There's a lot of css to wade through, but as far as I can tell, your clearfix class is the cause of the problem. Removing that class (in Firefox dev toolbar, to test my theory) stops it dropping down, although it causes problems elsewhere. With so many divs, classes and id's that's about the only thing I can figure out. Regards -- Bert Doorn, Better Web Design http://www.betterwebdesign.com.au/ Fast-loading, user-friendly websites ** 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 ** ** 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] Dropped DIV dilemma
I've found the majority of IE hacks can be avoided by nesting padded boxes inside boxes with widths rather then trying to combine them, it does create extra markup but it is easier to read and understand if you or someone else has to make changes later. The only IE bug I seem to run into regularly now is the extra 3px float gap (when a float : left; sidebar and margin-lefted content to create the illusion of a dual column layout pushes the content div over and extra 3px from what is specified in the margin-left) this actually one of the more common reasons for a float drop in IE when you have pixel perfect layouts. I've also seen an alternative to the div style=clear : both; / method of doing columns, I think it involved overflows set on your floated divs, I could dig it up for you if you want to have a look at it but like most new CSS hacks it often interferes with other things on the page. It's always been my experience that it is better to have extra markup on your page that avoids the need to use hacks, sure your page size will be a bit bigger but your code will be easier to read and you'll avoid the need to pile hacks upon hacks to get your page to look correct. Paul Noone wrote: Thanks Samuel. I'd actually considered the fixes quite minimal. Apart from a couple of IE hacks, the only 'fix' in place is the mighty clearfix class for float clearing. If you have any suggestions on how the CSS can be minimised I'd be very grateful if you'd share them. Almost everything I know about CSS can be attributed to positive feedback from this list. -- Paul A Noone Webmaster, ASHM [EMAIL PROTECTED] -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Samuel Richardson Sent: Tuesday, 20 December 2005 4:24 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Dropped DIV dilemma If you have to have that many fixes in place for a page that is that simple then your doing something wrong. Paul Noone wrote: Cheers all. I know there's a lot to wde through but most of the fixes, widths and relative positions in place were put in to fix other problems in the first instance. As you say, getting rid of the clearfix solves that particular problem but causes others. Definitely a clearing problem then. What's bugging me is that it was all working just fine until recently. Now...what the hell did I change? Will keep slogging away at it. I've closed the input tags and all validates again. Thanks. -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Bert Doorn Sent: Tuesday, 20 December 2005 3:49 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Dropped DIV dilemma Paul Noone wrote: Problem: http://d81314.i50.quadrahosting.com.au/index.php?module=Newsid=cntnt0 1cntn t01action=detailcntnt01articleid=8cntnt01returnid=11 The Site Updates div gets pushed way down the page. And I've got no idea why/ Strangely all is well in IE (with all the hacks in place I'd hope so!). There's a lot of css to wade through, but as far as I can tell, your clearfix class is the cause of the problem. Removing that class (in Firefox dev toolbar, to test my theory) stops it dropping down, although it causes problems elsewhere. With so many divs, classes and id's that's about the only thing I can figure out. Regards -- Bert Doorn, Better Web Design http://www.betterwebdesign.com.au/ Fast-loading, user-friendly websites ** 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 ** ** 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 ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Setting Up Font Sizes
What's the best, cross-browser supported way to setup font sizes in CSS
documents?
I've been using
body
{
font-size .8em;
}
then
p
{
font-size : 90%; (adjust per design to get the correct sizes etc)
}
the problem I've found with this is that I'll sometimes set a 90% on a
td element (or something similar), then if I place a p tag inside the
td it gets reduced by two lots of 90%, so then I wind up setting
td, p
{
font-size : 110%;
}
to counteract that, as you can imagine things quickly become a mess of
font-sizes going up and down to counteract each other. Is their a better
method of looking after this?
Samuel
http://www.geminidevelopment.com.au | http://www.seasonstravel.com.au
**
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] search box(text area) form width
On 21 Dec 2005, at 7:47 AM, kvnmcwebn wrote:
how to get this keyword search box any narrower in ie?
.searchbox input{
width: 10em; /* desired width */
}
kind regards
Terrence Wood.
**
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] Setting Up Font Sizes
On 21 Dec 2005, at 11:57 AM, Samuel Richardson wrote: What's the best, cross-browser supported way to setup font sizes in CSS documents? http://css-discuss.incutio.com/?page=FontSize kind regards Terrence Wood. ** 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] Setting Up Font Sizes
I have had good luck with the Owen Briggs Method across browsers-- just watch out for the cascade: http://www.thenoodleincident.com/tutorials/typography/index.html Paula Paula Petrik Professor Department of History Art History Associate Director Center for History New Media George Mason University http://www.archiva.net On Dec 20, 2005, at 6:48 PM, Terrence Wood wrote: On 21 Dec 2005, at 11:57 AM, Samuel Richardson wrote: What's the best, cross-browser supported way to setup font sizes in CSS documents? http://css-discuss.incutio.com/?page=FontSize kind regards Terrence Wood. ** 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] Setting Up Font Sizes
So setting the font size for the html element to 100.01% and then adjusting it in the body (or elsewhere) is no longer recommended? I tried to find fault with Owen Briggs' Text Sizing http://www.thenoodleincident.com/tutorials/box_lesson/font/index.html article which uses a simple declaration of font-size: 76% in the body. But no amount of nested lists in nested tables could reduce the usual array of inherited sizing that I recall from not so long ago. So now I can cut yet more dead wood from my CSS. Samuel will be so proud. :) -- Paul A Noone Webmaster, ASHM [EMAIL PROTECTED] -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Terrence Wood Sent: Wednesday, 21 December 2005 10:48 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Setting Up Font Sizes On 21 Dec 2005, at 11:57 AM, Samuel Richardson wrote: What's the best, cross-browser supported way to setup font sizes in CSS documents? http://css-discuss.incutio.com/?page=FontSize kind regards Terrence Wood. ** 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] Setting Up Font Sizes
Where did you get that from in that article? Setting the font size to 100% and then setting individual elements to ems is how I do all my pages. As far as I know it is the recommended method so users have control of their own viewport. Regards, Ric Paul Noone wrote: So setting the font size for the html element to 100.01% and then adjusting it in the body (or elsewhere) is no longer recommended ** 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] Setting Up Font Sizes
Where I got it from was the supplied stylesheet. The comments within also explain why 76% was chosen as a figure. The 100.01% size for html or body elements was/is a much practiced method which was expounded on this very list not so long ago. Is it just me or is there some underlying agression on this list of late? -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Ric Raftis Sent: Wednesday, 21 December 2005 1:08 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Setting Up Font Sizes Where did you get that from in that article? Setting the font size to 100% and then setting individual elements to ems is how I do all my pages. As far as I know it is the recommended method so users have control of their own viewport. Regards, Ric Paul Noone wrote: So setting the font size for the html element to 100.01% and then adjusting it in the body (or elsewhere) is no longer recommended ** 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] Setting Up Font Sizes
SamuelYou wrote: body { font-size .8em; } p { font-size : 90%; (adjust per design to get the correct sizes etc)}That is asking for trouble, you really need to watch out for the cascade. Get a p inside a p, an li inside an li or a li inside a p and suddenly instead of being 12px text ( 16px - default font size 16px *
0.8em (80%) * 90% (0.9em) = 11.52px ) it is 10px text (16px * 0.8 * 90% * 90% = 10.37px )personally it isbody { font-size 76%}the font size I will be using the great majority of my text. Default text size in all modern browsers is 16px and very few people change it. So 16px * 76% =
12.16px rounds to 12px p, table, td, ul, li, a, button { font-size: 1em }because some browser like to set their own values for certain elements. (and for IE that is in pixels, well that was my recent experience with the button element)
Also initially setting your font-size to ems can produce tiny text in some versions of IE, don't know which ones, but I have never really tested it.Nick Cowie
http://nickcowie.com
Re: [WSG] Setting Up Font Sizes
Nick Cowie wrote:
Samuel
You wrote:
body { font-size .8em; }
p { font-size : 90%;
(adjust per design to get the correct sizes etc)
}
That is asking for trouble, you really need to watch out for the cascade.
Get a p inside a p,
It's very rare that p elements would be nested like that and under
normal HTML conditions almost impossible, at least to do so
accidentally. It can be done using this, for example, but rare.
pobjectp.../p/object/p
(object can also be replaced with other elements like ins and del for a
similar result)
an li inside an li or a li inside a p and suddenly
Again, li inside p is difficult to achieve, but nested lis are a good
example.
personally it is
body { font-size 76%}
That's extremely small for the main body copy. Such sizes should be
reserved for relatively unimportant footer text like copyright notices,
etc. I don't recommend anything below 80%, but I also don't recommend
using % (or em or ex) for setting font sizes for the reasons you gave above.
Personally, I recommend using the font-size keywords because they don't
suffer from such problems.
body { font-size: small; }
is generally acceptable and is approximately the same as 80% of the
default font-size. 'medium' is best for body-copy although many
designers would likely object. There are some obsolete browsers that
get the sizes wrong, for which there is a hack [1], but I don't bother
with it.
[1] http://diveintoaccessibility.org/day_26_using_relative_font_sizes.html
--
Lachlan Hunt
http://lachy.id.au/
**
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] Setting Up Font Sizes
Not from me Paul. If my msg came across that way, please accept my apologies. It was not intended. Regards, Ric Paul Noone wrote: Is it just me or is there some underlying agression on this list of late? ** 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] Setting Up Font Sizes
Paul Noone wrote:
Ric Raftis wrote:
Paul Noone wrote:
So setting the font size for the html element to 100.01% and then
adjusting it in the body (or elsewhere) is no longer recommended
I tried to find fault with Owen Briggs' Text Sizing
http://www.thenoodleincident.com/tutorials/box_lesson/font/index.html
article which uses a simple declaration of font-size: 76% in the body. But
no amount of nested lists in nested tables could reduce the usual array of
inherited sizing that I recall from not so long ago.
So now I can cut yet more dead wood from my CSS. Samuel will be so proud. :)
Where did you get that from in that article? Setting the font size to 100%
and then setting individual elements to ems is how I do all my pages. As
far as I know it is the recommended method so users have control of their
own viewport.
Where I got it from was the supplied stylesheet. The comments within also
explain why 76% was chosen as a figure.
The 100.01% size for html or body elements was/is a much practiced method
which was expounded on this very list not so long ago.
100.01% on body serves multiple purposes. First it's to avoid a serious
IE inheritance bug often seen when setting a size in body in ems.
Second, some old Opera browsers have a rounding problem with inherited
sizes that the fraction fixes. Third, it ratifies the fact that the
default size is the user's preference size, a statement of respect for
the user.
Briggs is really no one deserving the status of example to repeatedly
point people to. Early on he says most browsers default to a text size
that I have to back up to the kitchen to read, which he follows shortly
with it's easier to read text that's smaller than default, and a little
larger than the toolbar font, but without any indication what he means
by a little. His latter I agree with (see
http://members.ij.net/mrmazda/auth/defaultsize.html#note1 ), but then he
goes on to elaborately recommend body be set to 76%.
First note the impact of 'body {font-size: 76%}'. CSS sizes are
nominal. Real sizes are multi dimensional. As applied to screen fonts,
there are two applicable dimensions, height, and width. Anything you
make 76% shorter you also make 76% narrower. The effect then is
multiplied. If your default initially (100%) is 16px, your character box
should have 16 vertical pixels, and about 8 horizontal pixels, for a
total of 128 pixels. Applying the 76% rule, you get roughly 6 horizontal
by 12 vertical, for a total of 72 pixels. That's 72/128 - 9/16 (56.25%)
of the original 16px _size_. See
http://members.ij.net/mrmazda/auth/area76.html to visualize the area vs
nominal size concept.
Now let's apply some math to what he says, using my two most used
systems as a singular example. Both have the toolbar/menu text set to
10pt, and a default size that equates to 12pt, or 20% larger nominally,
which is a bit less than 44% larger in area. Hopefully, this would fit
within Briggs' definition of little larger than the toolbar font. Now
apply his 76% to my 12pt default, and guess what happens? 9.12pt
(12.16px @ 96 DPI), or _smaller_ page text than toolbar text!
Browser makers provide users with a preference adjustment precisely so
that they can optimize to the size that best suits them. This
personalization is one reason why the machines most use are called
personal computers. 76% is totally arbitrary, in spite of Briggs'
supposed rationalization, and applies no matter what the default,
however larger or small, happens to be.
Designers should instead defer to whatever the users prefer, leaving
content P text unsized, respecting that personalization, however many or
few actually do it. Too small text is the #1 complaint from web users:
http://www.useit.com/alertbox/designmistakes.html
Make the web accessible. Use your visitor's pref size for most of your
content. It's something they have a right to expect you to respect.
http://members.ij.net/mrmazda/auth/accessibility.html
--
Jesus Christ is the reason for the season.
Team OS/2 ** Reg. Linux User #211409
Felix Miata *** http://members.ij.net/mrmazda/auth/
**
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] Setting Up Font Sizes
Samuel Richardson wrote: What's the best, cross-browser supported way to setup font sizes in CSS documents? Watch out for this one... http://www.gunlaug.no/contents/wd_additions_13.html ...and this one... http://www.gunlaug.no/contents/wd_1_03_04.html regards Georg -- http://www.gunlaug.no ** 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] Setting Up Font Sizes
Lachlan Hunt wrote:
body { font-size: small; }
is generally acceptable and is approximately the same as 80% of the
Definitely not acceptable to me for content paragraphs. :-(
default font-size.
Actually whether small matches 80% or not depends on browsers and
rounding and the default size and sometimes DPI too. In Gecko, the size
comes from an internal table at
http://lxr.mozilla.org/seamonkey/source/layout/style/nsStyleUtil.cpp#117
if the default is 16px or less, but is 89% if the default is anything
larger:
http://lxr.mozilla.org/seamonkey/source/layout/style/nsStyleUtil.cpp#199
. Take a look here to confirm and see how other browsers compare:
http://members.ij.net/mrmazda/auth/Font/font-rounding.html
http://members.ij.net/mrmazda/auth/Font/font-rounding120.html
http://members.ij.net/mrmazda/auth/Font/fonts-pt2px.html
http://members.ij.net/mrmazda/auth/K/pt2pxKHTML.html
http://members.ij.net/mrmazda/auth/absolute-sizes-MvE.html
--
Jesus Christ is the reason for the season.
Team OS/2 ** Reg. Linux User #211409
Felix Miata *** http://members.ij.net/mrmazda/auth/
**
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] Setting Up Font Sizes
Felix Miata wrote:
Lachlan Hunt wrote:
body { font-size: small; }
is generally acceptable and is approximately the same as 80% of the
Definitely not acceptable to me for content paragraphs. :-(
I have to agree with Felix here as well. In the end, I have to abide my
clients wishes or otherwise I'd be kick out on the street for the lack
of money! I generally use the disclaimer -- Browsers aren't word
processors and argue for a middle of the line approach.
--
Peter J. Farrell :: Maestro Publishing
http://blog.maestropublishing.com
Rooibos Generator - Version 2.1
Create boilerplate beans and transfer objects for ColdFusion!
http://rooibos.maestropublishing.com/
- Member Team Mach-II
- Member Team Fusion
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
