How would I restrict visitors from changing the size of text on my web page?

Question

How would I restrict visitors from changing the size of text on my web page (like by means of Strl + +/- in Firefox)?

Answer 1

Avoid interfering with such user actions.

Answer 2

You can't, and most certainly you shouldn't.

Answer 3

There's no way -- HTML defines content first, so basing your layout on relying on this is a bad idea. There might be people with a high screen resolution who need to zoom. There might be people using a text-only browser or screen reader where the whole concept is different, thus you can't rely on anything.

There might even be people who don't have Arial (e.g.), so the text might render differently from how you saw it even with the same zoom settings. And I'm totally setting aside the different text layout engines in the different browsers.

If you need the degree of control that I interpret into your question: Use Flash, Silverlight, or even just graphics to present your content. I guess I don't have to tell you the obvious disadvantages of this approach.

Answer 4

This is really something you shouldn't do. Think about people with eyes trouble that needs to have large font.

If your website look ugly after you increased text size, it means your css is wrong/uncomplete.

Plus you can't prevent this.

Answer 5

I'm sure there are vile techniques that you could use to achieve this - but why would you?

Not everyone has good eyesight - without glasses, my eyesight is 3:56, but I'm lucky enough to have corrective lenses that bring me close to 20:20. Not everyone is so lucky - many users need to change font sizes to see your site at all.

Answer 6

One way that might get you this behaviour is to use images instead of text. Make a small image for each letter and write some code that converts a string into a list of those images.

This will not prevent users from zooming in to the page, but it will maintain your layout.

Note: I do agree with all other responses in that this is very bad practice and is probably evil as well. But, since SO is about answering questions and not ethics...

Answer 7

If you are worried about the look of your site when users use the zoom option, you should not eliminate that possibility. You should try to work with it, not forbid it.

The generally accepted guideline is that your site should work with:

1. The default font size
2. One size above the default
3. One size below the default

Answer 8

What will you do about people accessing the site via a text-only browser? They could be choosing to see your text in any typeface and size they like! MS Comic Sans 72 point!! The horror!!!

Answer 9

OK, as everybody else here have said, I don't recomment you restricting this.

That said, there are different methods in the web browsers that does the resising. IE is the only browser I know that allows you to lock the font size.

IE:

Text Size

Increases/Decreases texts only This is actually suppressed if you specify a fixed font size in CSS

Example:

font-size: 14px;

Zoom (new feature in IE7)

Increases/decreases the entire page, including all graphics and design features. This actually fits the content to the window as it would appear in 100%, and changes the size of that look (>100% causes scrollbars to appear). This cannot be influenced by anything you do in the web design.

---

Firefox:

You can set it to zoom only text, or zoom everything. Even when setting to zoom only text, you can not override it using the CSS style as in IE. When zooming everything, Firefox still tries to fit the page within the window.

---

Opera:

Does not have option to change only text size. Zoom everything. Like firefox, it tries to fit the page within the window.