Tiny fonts on websites

My main browsers (FF and Chrome) are set to 12 pixel font. In both browsers, the font selector shows a preview of the font, and in both cases they are the same size and convenient for reading websites. My IE does not allow me to set the font size, but it seems that by default something is slightly larger than Chrome.

On my personal website, I use XHTML and CSS and have designated the page font as “medium” and use this font size for all the body text (“content” text). When I browse the site in IE 7, FF 3, and Chrome 0.4, the font displays as expected and matches the font selections (except IE, where it is slightly larger).

BUT , I visit almost any other site (Google, StackOverflow, DailyWTF, CodingHorror, Microsoft, Sourceforge, even W3C, etc.), and they all appear in tiny microscopic fonts - which I estimate 5-7 pixels.

This is true on three different computers: 2 different O / S (Vista and XP) and 4 different monitors (laptop, CRT and the new WS LCD).

What's up with that? I don’t notice something fundamental in website design that I need to know? Or is it just that all of these websites have such dumb things as setting the font to 50%, or to 0.5 em or x-small ??? Why website developers cannot read my choice of font for content text (I understand the sidebars and footers, and this can be reasonably small or x-small).

I will be tempted to think that these are just uninformed website designers, but hell, these are some big name sites!

EDIT: To be clear, I am not saying that using em or% is unwashed, I wonder why many sites use about 50% of my configured size. Of course, my configured size is the size that I would like to see in the text.

EDIT: From the W3C CSS Specification: “The following table provides user agent recommendations for comparing the absolute size for the HTML header and the absolute font sizes. The value“ medium ”is the user's preferred font size and is used as a reference average. ” - emphasis is mine.


There is consensus, coming through these websites, regarding the relative font sizes in the standard browser standard 16px, which is unsuccessful, but "what life". But what about other systems - can we expect all browsers to be default?

At least I understand the problem now.

I want to leave this question open for a while to see if others have different views before I choose the final answer.


Conclusion: I have reset all my browsers to 16px (18px on my machines with 125 DPI), and set my site to use font size: 90%. This gives a good display size, and of course, all of my favorite sites are now readable. Thanks for all the constructive answers and lively work.

This is a great community.

+3
source share
9 answers

Most browsers - if not all - set the default font size to 16 pixels. Many websites also use relative font size. This will cause a problem if your browser size is below this.

Consider the case when the default font size is set to 16px in your browser. When the website font is 1.0, it will display as 16px. Perhaps some other text may be 0.7em, so it will be smaller. However, if the default browser font size is 12 pixels, then 1.0em will be 12px, and 0.7em will be unreadable because it will be so small.

The solution is to keep the default browser font size to 16 pixels, which will give you a real idea of ​​what others see when viewing your site. Oh, and using relative font size is best practice, not a mistake.

+8
source

In most modern browsers,% age allows dynamic rendering. Ctrl-and Ctrl + are your friends.

At least most developers realized that installing a font with a fixed size is bad.

+2
source

I don't care what font size , while I can change it . This is the biggest reason I hate flash sites. Not so long ago I was looking at a career page for some large company, and the font was TINY. My instinctive reaction is to press Ctrl- + (in firefox), but the text displayed in Flash cannot be changed! I immediately left the site. I do not have better vision, so I need to make the small text bigger.

Another issue that I often encounter is fixed width sites. I use monitors with high resolution (1600x1200, 1280x800 or higher), and there is nothing that I hate more than half a space on the screen. Worse, some sites, fixed widths do not increase when I make fonts larger! After I tried to read the article, making the text larger, and he had THREE WORDS ON LINE and LOADING a blank screen to the right ...

+2
source

Monkey software is about to fight the world. He completely disagrees with how browsers display font sizes, main websites, and the way their font size is, and tries to insert hot arguments with every poster of this stream.

I have a simple guideline in life. When you think everyone else is wrong, you may be wrong.

In addition, even if you are right, it is often smarter to go along with the outside world, rather than fight with each other.

Here is a thought. If you are a web designer and you know that more than 99% of visitors will not bother with the default browser size, you certainly want your site to look good for this majority. This pragmatism explains the current situation.

In any case, good luck in your search.

+2
source

I had this problem with Chrome, but not to the extent you speak. However, some pages display really tiny fonts that look normal in other browsers. On some forums, the font actually gets smaller for each post - so I can usually read the first post and maybe the second, but the rest is just pixels :)

+1
source

Setting the font to% or measuring em not mute, this is actually recommended by W3C!

0
source
  • Use css to control font size
  • Specify the font size in em
  • Use cheat codes (for example, #, _) for different browsers if the fonts are rendered in different sizes on different browsers.
0
source

To answer your EDIT: the reason is obvious. The page designer must convey a set of information with various properties and vary the sizes of real fonts - one of the (earliest) tools in the printing house and layouts available to him.

You, as a viewer, can determine a convenient baseline for yourself, but if the designer wants to emphasize or destroy the importance of the section of the text that suits him, and this is for you. You should no longer regret it at 50% height than you should # 999 or italics.

It all depends on whether the designer should appreciate its salt, and not abuse it, which can be sad.

0
source

I would say that since there are different standards for each browser, there will be different rendering modes for the fonts.

0
source

All Articles