Do you ever click the font size up button in your browser? (If not, enjoy your young eyes while they last! When you click that button, do you ever lose your place? Do you have to scroll down to find where you last left off?
Have you gotten into the habit of selecting a block of text before you click that button, so you have a distinct point of reference to look for after the zoom?
Browsers are doing something strange when you increase or decrease the font sizes.
For example:
- In Safari, scrolling to the middle of an article and repeatedly clicking the font up button to zoom in progressively scrolls to the top of the article until its headline is visible at the top.
- Clicking font down repeatedly scrolls down until the bottom of the article is visible.
- Firefox and Internet Explorer do something similar.
Does it have to be this way? Not every app has this problem: Microsoft Word’s zoom feature, for one, keeps the content where you expect it when you zoom in and out.
Designs to steal
The effect should be akin to moving closer and farther from the screen.
Here are three possible heuristics to try out:
Alternative 1. When the user clicks the font size up/down, keep the line at the top of the page where it is after the zoom.
Alternative 2. Keep the line of text at the center of the page where it is after a zoom.
Alternative 3. If there is a selection active, keep its top edge where it is after a font up/down
I expect number 2 to feel most natural because it should give the brain the effect of zooming in and out.
[Readers: do you notice this too? Are there any browsers who do this well? Anyone know why most browsers have this issue?]
Sadly, two years later, the major browsers still do not keep the scroll position when the user zooms in and out.