Question about Zoom Size

HTML & CSS
1

Hmm… How to describe this?!

First off, I have an old 2008, white MacBook with like a 13" display, so that is how I “see” the world…

As long as I can remember, whenever I am working on and looking at my website on my laptop, I always like to do Command - - in FireFox to reduce the Zoom by two notches. (Not sure what % I’m looking at?)

Having a small display, I do this to be able to see a good portion of a webpage, while still being able to read things.

But herein lies the problem…

When I look at my website in the “default” Zoom, my website looks hunormous?! :eek: (Almost like a kids Big Print website?!)

At what size should I develop my website at as far as Font Sizes and all?!

In Debbie’s world, it seems silly to always have to Zoom-Down 2 notches so things are the size I like. I mean, why not just make the Font-Sizes smaller to begin with, so my site is good-to-go out-of-the-box?!

Of course, if someone has a 27" monitor, with a bizillion pixels, then I would be screwed either way, because my website would look like one of those cartoons that used to come with bubble-gum!!!

Not sure how to show this, but I am attaching 3 screenshots.

The first is how things look on my laptop by default. (Too big)

The next is how things look after I Command - -. (Just right)

The third is from Bloomberg.com and their default is how my site looks, after doing Command - - (Just right)

I am hoping that I am making sense, and someone can help me figure all of this out.

Put another way, I fear that I am choosing Fonts that are way TOO BIG, and that is adversely causing issues when I do spacing and page layout, when if I just chose a Font-Size that was smaller like “I” like to view, then things would be easier. Make sense?! :-/

Sincerely,

Debbie

2

Why is your first screen shot too big? It fits on screen and is readable. All the same, if you’ve used ems/% for your measurements, this should be as simple as reducing the font size on your body element—say to 85%.

3

Not sure there is anyway for you to see things as I do, unless you have the same sized MacBook, but I think the default zoom size (Attachment #1) looks gaudy or like something from a kid’s book. It just feels way too big…

It fits on screen and is readable.

It does.

All the same, if you’ve used ems/% for your measurements, this should be as simple as reducing the font size on your body element—say to 85%.

I did use em’s, and I understand that, but the point I was trying to make in my OP is, “Maybe my default font size is TOO BIG and instead of forcing people to have to Zoom Out so it looks more readable, I should choose a smaller default Font-Size??”

(Of course, you could argue that the way things are now looks fine on a large, high-resolution monitor, and that if I made my default Font-Size smaller, then everyone would have to Zoom In to make things readable?!)

Debbie

4

Dee, are you concerned that your page is too wide or that the text seems to be too large?

The text size on the first page looks nicely balanced to me. The smallest font is legible and the largest is very adequate and NOT gaudy at all.

This almost sounds like an “eye of the beholder” issue :). Remember that everyone doesn’t have excellent vision and a high rez monitor like you do.

5

No, everything fits on my monitor just fine (i.e. no spilling over).

But I think the font looks too big.

The text size on the first page looks nicely balanced to me. The smallest font is legible and the largest is very adequate and NOT gaudy at all.

I am probably exaggerating. It is more like this…

If I gave you an English paper written in 14pt font in MS Word, I bet you’d comment that it looks too big. Right? (Most people think between 10-12pt font looks “normal” on paper or in a word processor.

Well, same issue here as I see it. Follow me?

This almost sounds like an “eye of the beholder” issue :). Remember that everyone doesn’t have excellent vision and a high rez monitor like you do.

Actually, I probably have a low res monitor on my 2008 MacBook, but I follow you.

So what about looking at this from a more mathematical approach?

What should my <body> font-size be?

When I use FireBug and hover over the Top Menu Text, and look at the Computed Tab, it says…

Helvetica, 14.4px (Too big!)

Here is my style…


body {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #000000;
    font-family: Helvetica,Arial,Sans-Serif;
    font-size: 0.9em;
    font-weight: normal;
    line-height: 1.4em;
}

Sincerely,

Debbie

6

Dee, The height of the “H” in “Home” in the main menu is about 11px. The “mssing” 3.4 px would be in the descenders, if there were any. I would NEVER consider that Too Big, especially for a main menu item. That’s quite small… about 10.5 points.

I’m not sure what to say except that your choices so far render legibly and look good… not too big, not too small.

Too many sites nowadays apply a font size that renders small and forces the user to zoom larger. It sounds like you may be heading in that direction. Your choice, of course, but why? As a “designer”, I’m less interested in point or pixel numbers than in the way they are rendered in various browsers. Comfortable for the user is best. Well, you know that already… that’s why you opened this discussion. It’s just that your first screen shot looks “comfortable” to me and the others would likely require me to zoom a notch or two larger before I could read them comfortably… which is the opposite of what you are seeing.

Yes, a 14pt font in Word would look large… that would theoretically render at around 19px, depending on a slew of factors that makes pixels to points or ems comparisons almost meaningless.

7

Sounds like I have a good mix now, and should leave it alone! :blush:

(I guess that is why God created “Zoom” - so each of us could adjust things to fit how we see the world?!)

Thanks for the advice, and glad to hear that if you were a visitor to my soon-to-be website, that you would at least be happy with my Home Page.

Sincerely,

Debbie