SitePoint Sponsor

User Tag List

Page 2 of 3 FirstFirst 123 LastLast
Results 26 to 50 of 71
  1. #26
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Hi Tommy,

    That screen shot is a little misleading don't you think? I assume that's a screen shot taken from an IE browser? Well yes of course - IE does not change pixel size. Maybe I'm dense, but therefore we are talking about the relationship between px and ems in other browsers that do increase px size on fonts.

  2. #27
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    Yes (see attached screenshot).
    Maybe I'm dense, but I don't understand why you need to do that. Could you explain?

    The usual reason when people set the font size to 62.5% is that they believe it's the same as 10px and use it to compute container dimensions in pixels. That may work for a lot of visitors, but not all of them.
    Oh I don't know... it just always seemed a little easier for me to throw numbers together with out having to first go and check the yahoo font-size chart. Bottom line - as long as I'm then increasing the size back up p{font-size:1.3em} then when it's all said and done we are all sitting at the same size right? So as far as I see it, and like I said a little earlier, all the methods are sound, so I would suggest to others to just use which ever one you can wrap your brain around easier.

  3. #28
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Rayzur View Post
    As Paul has stated, and as most people are aware of, is that at the end of the day the user is still the one that is in total control of text size.
    I've already controlled it, before I visited your site. You over-ride my choice and make me do something more, something extra, to enlarge the fonts. Why should I have to do extra work to override your ideas about what is "good". Why shouldn't I just go somewhere where they treat me better?

    With all of the methods described above it is just an effort to create a layout that will hold together and look decent through various font size changes on the users end.
    So this is about your convenience, you the designer? Your visitor's convenience doesn't matter to you?

    I guarantee you it takes a lot more time and trouble to develop a website that is accessible to all people and there have already been two examples posted so far.
    I've never had much of a problem with it from the designer's standpoint, but as a developer and pro's, aren't we supposed to do that work? Why make it the visitor's problem?

    With most modern browsers supporting zoom features now there is no one with eyesight that has been left out. Those using FireFox can just press the Ctrl key and scroll the mouse to increase font size.
    I've already made that choice and communicated to my browser the font sizes I want. Now you choose to override my choice and make me do extra work to read your site. Why should I do that? Why wouldn't I just go to another site that honors my preference without making me do extra work?

    What statistics do you have about how many people even know about ctrl-+?

    In my opinion Elastic layouts are the most user friendly as the whole site scales with font changes.
    Why should I hang around long enough to bother changing your fonts when you've already overriden the choice I made in the first place?

    Do you design your site to work for you and save you design time, rather than to work for the visitor and give him a good experience? I so then I question your attitude toward design.

    In my opininon it's irrational go to all the work of designing a scaleable site and then undo all that good work by overriding the preferred font size of the visitor. Design your site so it works for all your visitors. It is perfectly possible and really not all that hard to do. If you depend on a web page for income, to do otherwise is to throw money away.
    Ed Seedhouse

  4. #29
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Ed Seedhouse View Post
    Why shouldn't I just go somewhere where they treat me better?
    Then go already - jesus! I know I won't miss you!

  5. #30
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ewwatson View Post
    Then go already - jesus! I know I won't miss you!
    So you would willingly alienate and drive away a significant and growing percentage of your visitors? That's a strange business model if you plan to make money off your web page, don't you think?

    Or don't you want money from people with less than perfect eyesite?
    Ed Seedhouse

  6. #31
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ewwatson View Post
    That screen shot is a little misleading don't you think? I assume that's a screen shot taken from an IE browser?
    Why is it misleading? It clearly proves that 1em≠10px @ 62.5% except in one special case: when the browser default size is set to 16px and the user hasn't changed the text size from the default setting.

    Yes, it's taken from IE, because my main browser is Opera which will zoom the page, rather than change the text size.

    Quote Originally Posted by ewwatson View Post
    Maybe I'm dense, but therefore we are talking about the relationship between px and ems in other browsers that do increase px size on fonts.
    What I'm trying to get across is that there is no relationship between px and ems! (Sorry about shouting!) You're claiming that a metre is equivalent to a kilogram because you happen to have a metal rod that is 1m long and weighs 1kg. It's a coincidence, not a relationship.

    If you set the font size to 62.5% and rely on that being equal to 10px, then set the container width to 250px to fit in 25 characters, your layout will fall apart once a user starts increasing the font size (in browsers that do that, rather than zoom the page). Perhaps you don't, but lots of designers do.

    Quote Originally Posted by ewwatson View Post
    Bottom line - as long as I'm then increasing the size back up p{font-size:1.3em} then when it's all said and done we are all sitting at the same size right?
    Right. Except you have to do it for all block-level elements. And then you end up having a paragraph in a list element and all of a sudden your font size is 17px instead of 13px. So you have to add yet more CSS rules to cover the nesting problem.

    Again: why is that better than setting the desired normal font size as the base size to begin with?

    Quote Originally Posted by Ed Seedhouse View Post
    So this is about your convenience, you the designer? Your visitor's convenience doesn't matter to you?
    That does indeed seem to be the case for many designers, unfortunately.

    Quote Originally Posted by ewwatson View Post
    Then go already - jesus! I know I won't miss you!
    Will you miss a few thousand other potential customers who do the same thing? Or the tens of thousands of friends of Ed's and those others who won't even go to your site because they've heard that it's badly designed?

    The old saying about being penny-wise and pound-foolish is still relevant.
    Birnam wood is come to Dunsinane

  7. #32
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    I'm not arguing with you - you guys will always be much smarter than I in the field of web design - I'm just giving another opinion. Web Design is not my one and only - I rely on other things for my income, pride, productivity, etc. Well, to a certain degree at least.

    Why is it misleading? It clearly proves that 1em≠10px @ 62.5% except in one special case: when the browser default size is set to 16px and the user hasn't changed the text size from the default setting.
    Maybe I'm missing something here - or one of us is? Because all my link is showing is that 1em does equal 10px. It obviously does not reflect that however if your using IE because it does not resize pixels. But if viewed in firefox and safari you will see that they do indeed correspond with one another. And again - I am only talking about with font-sizes - not divs sized in ems. I know that divs sized in ems do not match up with pxs. http://www.visibilityinherit.com/pro...size-test.html


    Will you miss a few thousand other potential customers who do the same thing? Or the tens of thousands of friends of Ed's and those others who won't even go to your site because they've heard that it's badly designed? The old saying about being penny-wise and pound-foolish is still relevant.
    Don't kid yourself or chastise me - we are all doing the same thing. My method just decreases the base size a little bit more than your guys. But you are still decreasing it as well ya know?

    Right. Except you have to do it for all block-level elements. And then you end up having a paragraph in a list element and all of a sudden your font size is 17px instead of 13px. So you have to add yet more CSS rules to cover the nesting problem. Again: why is that better than setting the desired normal font size as the base size to begin with?
    That's true Tommy! and I'm not saying it's better, just a different way of doing things. The way I do it is easier to wrap my brain around, but as you've stated, I may have to then add a few more rules. So that is a negative to mine - your right! Paul's method is good to - but then you have to use conditional comments. There is absolutely nothing wrong with them - It's just me, I try to avoid those, it's a personal preference. 75% or 81.25%, or whatever method is good but then not quite as easy to size up all the values (not as intuitive at least). So, as far as I see it, they each have their pluses and negatives. To each their own! Maybe someday I'll try the 75%, 81.25%, 85% methods. They each seem good. Mine is just a different method - the one that happens to work for me for time being.
    Last edited by PicnicTutorials; Aug 14, 2008 at 12:15.

  8. #33
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ewwatson View Post
    Maybe I'm missing something here - or one of us is? Because all my link is showing is that 1em does equal 10px.
    No, it doesn't. It shows that under certain circumstances they happen to result in the same size, by coincidence. There's no equality involved.

    Quote Originally Posted by ewwatson View Post
    It obviously does not reflect that however if your using IE because it does not resize pixels. But if viewed in firefox and safari you will see that they do indeed correspond with one another.
    Have a look at the attached screenshot from Firefox 2.

    Quote Originally Posted by ewwatson View Post
    I know that divs sized in ems do not match up with pxs.
    Nothing sized in ems is ever guaranteed to match up with something sized in pixels. Not text sizes, not div sizes, nothing.

    Quote Originally Posted by ewwatson View Post
    Don't kid yourself or chastise me - we are all doing the same thing. My method just decreases the base size a little bit more than your guys. But you are still decreasing it as well ya know?
    That's not what my comment was about. It was about the attitude you show towards Ed and the large group of people who, like him, need to adjust their settings. Chances are you will too, sooner or later, since most of us do get poorer eyesight when we reach middle age.

    Quote Originally Posted by ewwatson View Post
    That's true Tommy! and I'm not saying it's better, just a different way of doing things.
    Oh, good! Then we agree. Your method is a different way of doing the same thing I do, which is different from Paul's method. "Best" is subjective, anyway. I thought you were arguing that your method was somehow objectively superior to the other alternatives shown here.
    Attached Images Attached Images
    Birnam wood is come to Dunsinane

  9. #34
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Oh no no no - I wouldn't dare argue with you guys. I'm still a couple years away from being able to confidently do that. Plus I need your guys help to much still. I couldn't risk burning any bridges.

    I have FX3 but I highly doubt that matters. How are you getting that screen shot to look like that??? Are you changing something else on my test page? When I increase the font size (well actually it's called zoom-in now) they each stay exactly the same regardless of how many times you increase it.

  10. #35
    SitePoint Evangelist Karpie's Avatar
    Join Date
    Jul 2007
    Location
    Perth, Australia
    Posts
    445
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ewwatson View Post
    When I increase the font size (well actually it's called zoom-in now) they each stay exactly the same regardless of how many times you increase it.
    And here might be where the problems are coming from - text resizing and zooming are completely different kettles of fish. Firefox 3 is capable of doing both.

  11. #36
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ewwatson View Post
    How are you getting that screen shot to look like that??? Are you changing something else on my test page?
    I didn't touch your page. That would be cheating!

    I just went to the Preferences dialog box and set the preferred font size to 24px, like thousands of middle-age users with high-resolution monitors might do. I could do the same in Opera or FF3.

    The point is that you cannot rely on 62.5% text being 10px. That only happens in one special circumstance, and although that circumstance may be very common it's still a special circumstance.
    Birnam wood is come to Dunsinane

  12. #37
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,892
    Mentioned
    123 Post(s)
    Tagged
    1 Thread(s)
    I have to say that there's a lot of rubbish being posted in this thread. (Some good stuff as well, but a lot of rubbish!)

    FACT - you can't control the size of text on your readers' screens.

    FACT - you shouldn't try to control the size of text on your readers' screens.

    People with different setups and different systems will find that text renders at different sizes, and there's nothing you can do about that, short of saving the whole page as an imagemapped GIF. It's simply not possible.

    And more to the point, a lot of people have changed the settings on their computer to suit their own preferences, so that text will render larger or smaller than its default setting. If you mess around with the size of text too much, it messes up their browsing experience.

    I have very good eyesight, and I browse with a smaller-than-default text size. But every now and then (depressingly frequently) I come across a site that has reduced the text so much that I struggle to read it. And I don't have it showing at the smallest size I can comfortably read - I can cope with a reduction to about 80% OK, but some designers think they know best and take it way smaller than that.

    NO! I have set my font size at the size I want to read text. Nudge it up or down a little way if you want to, but don't change it any more than that. Body text on a website should always be between 90% and 110% of the browser default.

    The best way to do this, as other people have said, is, eg
    body {font-size: 95%;}
    This means that all text is reduced to 95% of its default size, so you don't need to worry about setting it on individual elements. Headings will still be larger than body text in the same ratio that they normally are - you can then adjust these individually as needed. Don't nest font sizes if you can avoid it, because it gives more opportunities for different browsers to interpret it differently!

    That's all you need to do. Don't worry about whether that translates as 10px or 11px on your screen at your settings, because it won't be the same on other people's. ("This page best viewed using my computer")

  13. #38
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stevie D View Post
    FACT - you shouldn't try to control the size of text on your readers' screens.
    Well no, that isn't a fact, it's an opinion. An opinion I strongly agree with, and wish devoutly everyone would follow without exception, but an opinion nevertheless.

    The best way to do this, as other people have said, is, eg
    body {font-size: 95%;}
    After much good sense you say this, which seems to me to contradict all that good sense. Why 95% for heven't sake?
    Ed Seedhouse

  14. #39
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stevie D View Post
    FACT - you shouldn't try to control the size of text on your readers' screens.
    Quote Originally Posted by Ed Seedhouse View Post
    Well no, that isn't a fact, it's an opinion. An opinion I strongly agree with, and wish devoutly everyone would follow without exception, but an opinion nevertheless.
    Control on the web is an illusion. All we can do is provide hints about how we'd like things to look.

    I agree with Stevie and Ed that the ideal way, from an accessibility point of view, would be to always specify the base font size as 100%. It should be up to the user to change the browser setting if he or she desires smaller or larger text. That's the theory, but things are different in real life. Joe and Jane Average don't want to have to fiddle with browser settings; things should 'just work'.

    The combination of the most common browser default size (16px) and the most commonly used font face (Verdana) is not aesthetically pleasing. However much we may wish it to be otherwise, this is a major concern for most sites – not only commercial ones.

    Right now I think an acceptable compromise is to use CSS that gives a decently aesthetic yet legible size for the common case (16px browser default). Users like Ed, who require larger text, can change their browser defaults. They may not be able to set it to exactly what they need, since most sites use <100%, but they can compensate by setting a 20-25% larger size than what they require.

    Yes, it's an extra inconvenience for this group of users. But the alternative – always using 100% for all sites – would require an even larger group of users to change their settings.
    Birnam wood is come to Dunsinane

  15. #40
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,481
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Control on the web is an illusion. All we can do is provide hints about how we'd like things to look.
    Well said Tommy

    I find myself agreeing and disagreeing at the same time with many parts of this discussion.

    For accessibility the best option is to do nothing of course and let the browser display the text at whatever size is set. I agree with that in principle but in many cases (especially working commercially) it's not always that easy.

    Leaving the text size alone may be good for accessibility but very often it's not aesthetically pleasing and may indeed hinder readability in some cases if text was all the same size everywhere.

    Typography and readability go hand in hand and isn't a simple matter of leaving the text alone. If we want to highlight certain blocks of text or lines of text then adjusting the size is one way of doing this. Whatever we do will possibly upset someone so we must make a choice and do the best we can to please as many people as possible.

    As long as we don't make the size too small or too big so that browsers adjustments become impossible then I think that's its fine to tweak it up and down a bit so that the design is more aesthetically pleasing.

    Of course pixels should be avoided because of the IE6/7 resizing issues but as said above many times that ultimately we have no control. Even in IE6 with the font size set in pixels I can click one check box and have all font sizes specified in all web pages ignored. That's with just one click. Or I can use my own stylesheet.

    The compromise is making a site that is accessible to as many people as possible while still be allowed some design flexibility.

    There is no definitive answer to this question (which is why it always creates debate (as with many web design issues)) it's something you have to consider, look at both sides of the argument and then make a choice you can live with taking all into account.

    Threfore I agree with nearly all that's been said but...

  16. #41
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    Control on the web is an illusion. All we can do is provide hints about how we'd like things to look.
    That's pretty much a fact. It is an observable.

    That setting the default text size to 100% is the best response is not a fact, it is an opinion, one that I strongly agree with and will argue vigerously for, but nevertheless still an opinion.


    The combination of the most common browser default size (16px) and the most commonly used font face (Verdana) is not aesthetically pleasing. However much we may wish it to be otherwise, this is a major concern for most sites not only commercial ones.
    Given the recent success of the Mac and the growing use of Linux there is a strong minority to whom this does not apply, and surely we want to cater for them as well.

    Right now I think an acceptable compromise is to use CSS that gives a decently aesthetic yet legible size for the common case (16px browser default).
    Which we can do by using a default font size of 100% or 1em.

    Yes, it's an extra inconvenience for this group of users. But the alternative always using 100% for all sites would require an even larger group of users to change their settings.
    Explain why this would be so, if you don't mind. I don't think it would be so, I think the opposite, but I am prepared to have my mind changed by reasons.

    I imagine we both share the desire for the dissapearance of Verdana, though...
    Ed Seedhouse

  17. #42
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Ed Seedhouse View Post
    That setting the default text size to 100&#37; is the best response is not a fact, it is an opinion, one that I strongly agree with and will argue vigerously for, but nevertheless still an opinion.
    All right, let me rephrase that. Setting the base font size to 100% is – theoretically – the most user-friendly way, since it gives the user full and exact control over the font size. It respects his or her settings, rather than deliberately making the text a certain percentage smaller.

    Quote Originally Posted by Ed Seedhouse View Post
    Given the recent success of the Mac and the growing use of Linux there is a strong minority to whom this does not apply, and surely we want to cater for them as well.
    I run GNU/Linux (Fedora 8), and both Opera 9.51 and Firefox 2.0 use 16px as the default size on my system. I think Safari/Mac uses 14px, though. That's another reason why the 62.5% method is a fallacy.

    Quote Originally Posted by Ed Seedhouse View Post
    Which we can do by using a default font size of 100% or 1em.
    Only if you accept 16px Verdana for a huge majority of the surfing population.

    Quote Originally Posted by Ed Seedhouse View Post
    Explain why this would be so, if you don't mind. I don't think it would be so, I think the opposite, but I am prepared to have my mind changed by reasons.
    Because I believe that most users think that 16px Verdana is way too big and ugly. I can't prove it, but I'm fairly sure that there are a lot more users who haven't changed their browser default settings for font size than there are those who have. Thus there'd be more people who'd have to reduce their base font size settings, provided I'm right about people disliking 16px Verdana.

    Quote Originally Posted by Ed Seedhouse View Post
    I imagine we both share the desire for the dissapearance of Verdana, though...
    Verdana may not be pretty, but it's legible even at fairly small sizes (depending on one's eye-sight, of course). I think it's a good choice for sites that don't want to be too different. But it needs to be a bit smaller than 16px, or it will look grotesque.
    Birnam wood is come to Dunsinane

  18. #43
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    Because I believe that most users think that 16px Verdana is way too big and ugly.
    If they think that then let them change their default font face as browsers allow. Web sites shouldn''t specify verdana in their font families anyway.

    On the other hand if they don't change it presumably it is acceptable to them, and who are we to argue with their choice?

    I don't believe any browser but IE actually defaults on install to Verdana, and if so there's a good big group who will see the text as too small with your method. I think it's fairly obvious that too big and a bit ugly as a result is better than too small and unreadable as a result.

    Verdana may not be pretty, but it's legible even at fairly small sizes (depending on one's eye-sight, of course). I think it's a good choice for sites that don't want to be too different. But it needs to be a bit smaller than 16px, or it will look grotesque.
    So you will make anyone who doesn't use Verdana, a good large segment, fit your procustean bed? Why not just over-ride their font-face to, say, arial? That will have much the same effect, but only for the Verdana defaulters.
    Ed Seedhouse

  19. #44
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,328
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    All right, let me rephrase that. Setting the base font size to 100% is theoretically the most user-friendly way, since it gives the user full and exact control over the font size.
    that's pretty much my strategy, too, except i don't bother setting the font size equal to 100% of anything -- i don't set the font size at all!!!

    that's the same thing, right? so i'm using the most user-friendly way, since it gives the user full and exact control over the font size
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  20. #45
    SitePoint Evangelist Karpie's Avatar
    Join Date
    Jul 2007
    Location
    Perth, Australia
    Posts
    445
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wait, what's wrong with Verdana? I think it's a great font and it gets used on a lot of the sites I code...

  21. #46
    SitePoint Enthusiast AnalogPanda's Avatar
    Join Date
    Jun 2006
    Location
    sacramento, ca, usa
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    62.5%. If it's good enough for a CSS rockstar like Dan Cederholm, then it's good enough for me.

    It provides a base font size of 10px which is really easy to work with. Gee, I'm currently at 1em (10px), how do I give this h2 a 28px font-size? 2.8em. done. easy.

    I don't see any difference in starting at 75% or 62.5% except for the fact that working with a base of 10 is easier than working with a base of any other number. And if the user changes the font size, then everything scales proportionately regardless of using 62.5% 75% or any other %.

    Yes, inheritance can play tricks on you. If you set the LI and P elements both to 1.4em (14px) and then nest a P element in an LI element, then you get a P element at a font size of 1.96em (19.6px). That's definitely not desirable. That's why you have an extra rule in your css. Something like "li * { font-size: 1em; }" or "li p { font-size: 1em; }"

    With a little extra planning, these kinds of inheritance gotchas are easily avoided. The time you save not looking at the Yahoo font chart can go toward solving the occasional inheritance puzzle.

  22. #47
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Ed Seedhouse View Post
    If they think that then let them change their default font face as browsers allow. Web sites shouldn''t specify verdana in their font families anyway.
    Like I said, that's all well and fine in theory. But how many non-techie users even know that you can change that setting, let alone how? And in real life it wouldn't work, because most sites set a smaller-than-default size. It's a Catch-22.

    Quote Originally Posted by Ed Seedhouse View Post
    I don't believe any browser but IE actually defaults on install to Verdana
    I don't think any browser uses Verdana as the default font. Windows browsers tend to default to Times New Roman, but they use Verdana as the default sanserif. Most websites prefer a sanserif for body copy, and Verdana is the popular choice.

    Quote Originally Posted by Ed Seedhouse View Post
    I think it's fairly obvious that too big and a bit ugly as a result is better than too small and unreadable as a result.
    Agreed, but 13px will suffice for most people, while also being more aesthetically pleasing.

    Quote Originally Posted by Ed Seedhouse View Post
    Why not just over-ride their font-face to, say, arial? That will have much the same effect, but only for the Verdana defaulters.
    We're already overriding their font-face choice by specifying Verdana. If we were to leave the font setting alone completely we'd end up with 16px Times New Roman for most users, just like the good old '90s.

    Quote Originally Posted by r937 View Post
    that's pretty much my strategy, too, except i don't bother setting the font size equal to 100&#37; of anything -- i don't set the font size at all!!!

    that's the same thing, right? so i'm using the most user-friendly way, since it gives the user full and exact control over the font size
    It's gives the same size, but there's an important difference: specifying a percentage (any percentage) as the base size circumvents a bad font-sizing bug in IE.

    Quote Originally Posted by AnalogPanda View Post
    It provides a base font size of 10px which is really easy to work with. Gee, I'm currently at 1em (10px), how do I give this h2 a 28px font-size? 2.8em. done. easy.
    I recommend that you read all the posts in this thread. Jumping in and posting without reading what others have said is rather rude, don't you think? The myth that 62.5% makes 1em equal 10px has been debunked in the preceding posts.

    And why do you need to make a second-level heading exactly 28px? Isn't it enough that it's a certain factor larger than the body copy? Besides setting the size to 2.8em does not guarantee that it will be 28px, which you would have known if you had read the thread.
    Birnam wood is come to Dunsinane

  23. #48
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As Tommy said, the 62.5&#37; = 10px myth was already debunked in this thread... right here in fact: http://www.sitepoint.com/forums/show...81&postcount=2

    And Tommy, it is possible that he could be using the H1 (along with an empty SPAN) to serve the logo; even today I see a lot of designers mistakenly doing that. Especially in WordPress Themes.

  24. #49
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    I just went to the Preferences dialog box and set the preferred font size to 24px, like thousands of middle-age users with high-resolution monitors might do. I could do the same in Opera or FF3.
    Hi,

    OK I understand better what you mean now. So I have a question? If this is the case, then wouldn't the same hold true with the yahoo font size chart? Say you set the body to 75&#37;, and then later you say p{font-size:.85em;}, well wouldn't doing what you did to my demo do the same to this example here - throw everything off? So "if" that's the case, and you, meaning "I", realizes that it doesn't always equal 10px, then all 62.5% is is a different way to size things. Right? Or am I totally wrong? Basically, as long as someone let's go of the 10px idea then it's basically the same as the others. You just have to then say p{1.3em} instead of p{.85em} - yes, no, maybe so? Aside from the nesting issues that is. Or does this all not hold true because yahoo uses % sizes and not ems?

    Edit - I did use zoom-in (text only) when I zoomed me demo.
    Last edited by PicnicTutorials; Aug 16, 2008 at 06:28.

  25. #50
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AnalogPanda View Post
    62.5&#37;. If it's good enough for a CSS rockstar like Dan Cederholm, then it's good enough for me.
    Wrong is wrong no matter who advocates it.

    It provides a base font size of 10px which is really easy to work with.
    NO IT DOES NOT!!!

    But even if it did that's too small for me, and a growing group of ageing individuals, to read on the typical monitor. The boomers have accumulated rather a lot of money over their lives, and there are a whole lot of them around, why in heavens would you purposely throw that revenue away?

    HTML and CSS give you a way to make your site useable and easy to read for any visitor? Why in heavens name wouldn't you take advantage of that?

    The fact is that web pages aren't printed on paper. Any design techniques that assume it is are going to fail.
    Ed Seedhouse


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •