45

Zooming is common on mobile because sites aren't designed for it; you need to zoom, generally, you don't want to zoom around. Mobile sites are supposed to not need any form of zooming, and often disable zooming.

It seems against convention to allow zooming for mobile sites; they're supposed to be mobile optimized, and function/display more like mobile apps. You can't pinch to zoom in most mobile apps; the layout is fixed similar to these fixed viewport mobile sites.

Should mobile optimized sites allow zooming? I've heard this brought up as an accessibility/control issue, but accessibility options are generally set up in your browser--make the font larger ect. Pinch zooming is a hassle and on mobile layouts it doesn't make very much sense. But when should it be allowed? What benefits does it give the users or designers?

Improve this question
10
  • 1
    It's an excellent question. I have a hunch it will be very context-centric, but am looking forward to seeing answers. It is a bit of a paradox (zooming is a key aspect of mobile, but is also a feature originally implemented to get around the fact that not everything is designed for mobile...)
    – DA01
    Mar 29, 2012 at 17:30
  • 1
    @DA01 yeah, I'm not even sure where I stand. It seems like the whole point of Mobile optimized is to get rid of having to zoom. In fact, zooming should decrease the usability in most cases...but what if your text is too small?
    – Ben Brocka
    Mar 29, 2012 at 17:43
  • 1
    I've encountered mobile sites that disabled zooming and chose their defaults poorly, resulting in a font too small for me to read. Why would you ever want to take away an option when, demonstrably, one size does not fit all?
    – Monica Cellio
    Mar 29, 2012 at 18:25
  • 1
    What @MonicaCellio said. I'm the user; if I want to zoom, why on earth should the designer stop me? I've noticed on my own sites, my Android handset doesn't have the greatest precision on touching links, so being able to zoom if necessary is important. (obviously I need to add some padding; just sayin'.)
    – yitznewton
    Mar 29, 2012 at 20:54
  • 9
    What? Are you saying that those sites disable zoom on purpose? I thought it was a bug! It makes me furious when I try to zoom and nothing happens or I accidentally click on a prev/next button that only appears when you touch the screen. You may be asking why do I need to zoom if the site is mobile optimized? Well, if the site has photos, graphics, or comics (submitted by users, perhaps) it is most likely that I will need to zoom to see the details or read the text embedded in the picture.
    – marcus
    Apr 3, 2012 at 19:39

14 Answers 14

Reset to default
19

Based on my mobile user research, I would rather not to disable the zooming option.

People I have interviewed during usability studies were coming with the same mental models they had created while using desktop computers. It means their goals and habits do not change.

As long as people are used to zoom (especially in pictures and infographics), we should let them.

Improve this answer
3
  • 7
    True, infographics are painful on mobile.
    – Ben Brocka
    Apr 2, 2012 at 13:10
  • I totally agree on that observation (i.e. the users mental model is the same). But that is actually an argument to not creating a dedicated mobile solution? Those users would be better off with the ordinary desktop solution and zooming ability?
    – Jørn E. Angeltveit
    Apr 3, 2012 at 11:27
  • @JørnE.Angeltveit, no, you still want a design that works well on the small screen. Consdier SE, which hard-wires an assumed width of 1024px (I believe); that sucks on a phone, and zoom means horizontal scrolling. OTOH, the mobile version of the site works well -- and, by the way, supports zoom.
    – Monica Cellio
    Apr 3, 2012 at 18:32
17

I have missed the zooming ability on most of the mobile optimized sites I've seen. Mostly because links and buttons are too small or to close to each other (the text size haven't been a problem). I usually switch back to the ordinary desktop view.

BUT: A well designed app should not bump into such issues...

So, that brings us back to the essence of usability engineering:

1) A mobile optimized solution must have a purpose. Why create a dedicated mobile alternative? What is the main task for a user when he visits the site with a mobile device?

2) Verify actual use against predefined usability goals. This is more important than ever. Test test test. Badly designed mobile solutions can end up as a complete useless solution. (Desktop solutions are more forgiving (IMHO), and the user can usually figure it out or find a workaround).

This second point is really important. While the first point is about the vendors mindset, the second point is about the user. We don't know enough about mobile usage yet. We need to identify a whole new set usability issues here.

(In fact, the whole mobile world is still quite immature, and questions like this one - a good question indeed - proves that we're still fumbling a bit to figure out how we best can take advantage of all the possibilities).

Improve this answer
1
  • +1 the links/buttons issue. A good text size for reading isn't necessarily a good text size for tapping accurately, particularly if you have large fingers and/or a small mobile device. I almost always zoom in on links before clicking them, otherwise I tend to end up clicking something else / highlighting an unlinked bit of text, etc
    – Kai
    Jun 26, 2013 at 10:39
14

Please please please never disable zooming.

Ok, you might have thought you got your website design right, you might have thought that you got every font size right, and every photo was clear enough that your users never needed to zoom in on anything.

So your users would come to your site, the mobile version would kick in, and they would merrily scroll up and down, never even thinking of a need to zoom.

But just to make sure, you went and did it didn't you, you went ahead and blocked zooming, just to be really sure that they knew what your intent for the website was. Your zoom blocking code never gets used anyway because your website is so perfect, but it's there and that makes you feel better. Maybe it forces your testers to check the site in a certain way. Anyway, theres some reason that you've convinced yourself is valid.

Then some poor person tries to navigate to your website on their iphone in the car. They are just trying to find a postcode. They want to copy and paste it into their satnav app. The kids are screaming. The wife is getting impatient, and your user is desparately trying to zoom in. Some crazy formating or other weirdness makes him keep selecting the whole block of text. He just wants the postcode. He tries to zoom, again and again. He just wants to zoom in enough so that he can get the whole postcode HUGE on the screen, to make it as easy as possible to drag a box round the text he wants. No, that wasn't in your usecase. He tries rotating his phone, no better. The wife starts crying now. Things are getting desperate. He finds a damn pen in the door pocket, buried in tissues and sweet wrappers and writes the postcode on his hand. It's a scratchy pen and it draws blood before any ink comes out. Then he angrily quits your 'web app', loads his satnav and types it back in, nervously hoping he doesn't confuse an L for a 1 and end up on the wrong side of the country.

He now hates your website and your organisation, he's closer to divorce, he's late for the wedding, his patience is drained, he hates his phone, and his wife thinks technology is a waste of time.

Just because you had to scratch that itch.

By all means, optimise your site for mobile if you want. Spend hours and convince yourself that it's lovely. But let your users decide whether they zoom or not. They know their needs better than your ability to predict the entire world's needs.

Improve this answer
1
  • 2
    Wow, that was... dramatic. Gets the point across though.
    – JonW ♦
    Dec 19, 2013 at 21:31
13

If it's a mobile site, you should enable zooming. It's true that native mobile apps don't allow zooming, but I think the users have different expectations for native apps vs mobile sites.

You may think the font size you picked for your mobile optimized site is... "optimized," but you can never guarantee that. People with eye sight problem would always prefer to zoom in. Sure, those users can use the built in screen readers, but why make it more difficult for them? Lastly, what do you have to lose by enabling user zoom?

We have disabled user zoom on Stack Exchange sites' mobile theme before, and recently enabled it due to a user complaint.

Improve this answer
2
  • For what it's worth, I noticed this change for the worse in that iOS now zooms into the comment text area instead of keeping the whole thing on screen as it used to, which makes it feel much more uncomfortable to me. I think it's a net positive but it's not without trade-offs.
    – Kit Grose
    Jul 6, 2012 at 3:48
  • People with eye site problems must hate native apps then. lol
    – Mike Milla
    Oct 8, 2015 at 14:58
7

My philosophy is to not purposefully block any existing functionality without a good reason. Mobile sites need to not require zooming, but since you don't have to develop it and you actually need to invest more in blocking than in allowing it - why not let users have it?

We block functionality when it's a matter of error prevention, of not letting the user get into a dead end or a loop, or of contradicting the system's goals (e.g. I won't let users hide ads on an ad-powered app, even if the infrastructure allows it). But here - if a user feels that zooming helps him use the website, then why not? Just because it doesn't match the way I intended the website to be used is not a good reason.

Improve this answer
4
  • There's nothing to remove if you do "Mobile First" ;-)
    – Jørn E. Angeltveit
    Mar 30, 2012 at 9:21
  • Don't you find "let's-have-it-all--just-in-case"-mobile-sites to be bloated?
    – Jørn E. Angeltveit
    Mar 30, 2012 at 9:23
  • 2
    @JørnE.Angeltveit That's completely not what I was saying, I tried to make this clear - I guess not very successfully. I hate featuritis and let's-have-it-all-just-in-case. I was referring to going out of your way to block existing, free functionality. Zooming is built-in in the device, so I say we need a good reason for blocking it. When it's a question of developing new functionality, then we'll be looking for a good reason for allowing it. In short, we need a reason to do stuff :). Re "Mobile First" - it has nothing to do with it - it's a feature of the mobile browser itself.
    – Vitaly Mijiritsky
    Mar 30, 2012 at 9:31
  • I thought you were talking about making changes from desktop version to mobile version. In that case, it was relevant to point out that you don't have any desktop version if you do "Mobile first"...
    – Jørn E. Angeltveit
    Mar 30, 2012 at 9:44
7

I realize this is a old question but I found it and wanted to add my option for future users that may find this, also this is somewhat personal.

I am legally blind and when I'm on my iPhone i often have to switch to the full version of a site if they don't offer pinch to zoom. Under accessibility setting the text size doesn't work for safari. I can't read the page content. This especially is frustrating on forums where the reader isn't available. I require pinch to zoom. Especially if I don't want to use the full screen zoom as that makes scrolling pages somewhat more difficult.

Anyways just my opinion :)

Improve this answer
0
3

For those wondering why NOT allowing pinch-to-zoom might (sort of) be becoming a convention, I can offer my opinion based on my current problem.

Fixed position elements.

The only way (as far as I have figured out) to get it to work nicely on older OS's is to disable pinch-to-zoom.

It would be awesome if mobile browsers did not essentially stop Javascript from running during scroll, but I can understand why they do.

Facebook is the perfect example, although I have no idea whether this is their reasoning? Lots of nice features, some (I am assuming) are fixed:position.

Improve this answer
3

I do not comprehend why zooming is suppressed. The whole purpose of zooming is to read what is on the site. If our eyes cannot read small print we need to zoom to prevent severe eyestrain. If it is suppressed to make sure we see the ads - keep in mind that we will not bother using the site at all if the print is too small. Also, why are so many people using light gray and blue fonts? These are also very difficult to see. Isn't the whole purpose of the site to enable people to read it? Obviously, those who make such decisions do not have these vision problems. And for some reason they are unwilling to consider the difficulty they cause other people. Zooming is a wonderful tool. Too bad it isn't always available. This makes me very frustrated and angry - too often. If it is younger people who are making these decisions I think they are very ignorant. Maybe someday it will be their experience, too.

Improve this answer
2

Pinch-to-zoom and swipe-to-swap, among other new touch conventions are not only useful but have become expected by users, as Steven Woods from Flickr explains in his YUI Theater seminar, Creating Responsive HTML5 Touch Interfaces.

Improve this answer
2
  • This is why I'm surprised NOT allowing mobile zoom has become a sort of convention. Perhaps I should ask the "why" in another question. Everyone seems agreed that it's good to allow it...so why are so many sites not allowing it?
    – Ben Brocka
    Apr 2, 2012 at 13:43
  • 1
    @Rarity Note that the pinch to zoom discussed in Steven Woods' piece deals with UI elements, such as a single photograph, rather than the entire page (which I believed was what you were asking about). The businessman in me wonders that since pinching-to-zoom on an entire page would hide ads, it may potentially break advertising agreements. At least one thing to consider...
    – msanford
    Apr 2, 2012 at 13:49
2

Pinch or not to Pinch.

The Pinch feature is by no means a must as is expressed within native apps - it is used as a specific enhancement to UX. For example: imagine trying to manipulate a photo on mobile without pinch zoom! I'm sure it would be cumbersome. However, reading apps for example RARELY have the feature as it doesn't fit with the task at hand i.e. reading a length of text.

So, if your web content is enhanced or even requires you to have this feature (to see a more detailed image for exmample) then BOOM, you've got it out of the box without having to include it.

My general feeling though, is that most of the time you're clicking and scrolling on a mobile site, and therefore don't require the zoom, as obviously your buttons will be nice and big, your text will be legible, and your images will flow like a pro. This being the case you don't need the zoom (and then can disable it, as it would be annoying to zoom when you don't need to right?!) or you could even hijack it for a fun web app (imagine a HTML5 game that takes advantage of the zoom for interactive purposes...), If you don't need a feature don't use it.

Improve this answer
1

Well, technically zooming only exists for the mobile browser so that sites not optimized for the screen size can be viewed by the user. Native apps don't zoom. They might zoom some content, such as an image, but the interface doesn't zoom. The user is stuck with the defaults. So, to me, the questing of some sites optimized for mobile needing zoom means that the creators of the site are not using the standard or recommended font size for the targeted mobile platform.

In general, if the default font size of a mobile app is too small for comfortable reading, the user can turn on the built-in assistive technology, such as a screen reader. As a mobile Web developer, I take time and effort in making screen readers work optimally with mobile sites.

Improve this answer
1
  • 2
    The solution to a small font should not automatically be a screen reader. Screen readers are disruptive to others (noise -- most smartphones leak noise), and forces the user to take in data through a different sense, which is a learned skill. If the user's vision is borderline and one more px would do it for him, why in the world should we not allow that?
    – Monica Cellio
    Apr 2, 2012 at 15:06
1

It's content dependent. Even after developing your site for mobile use, you may have some large images you'd like users to be able to zoom in on. Still, the whole purpose of developing a mobile version of your site is so users don't need to pinch and zoom. From my experience, it's best to disable it, making sure text and buttons are large enough to read and use with a touch screen, while providing an option to switch back to the desktop version in case some users are more comfortable with that layout and don't mind zooming.

Improve this answer
0

Totally agree with answers here that you should never disable zooming.

Luckily there is a way to deal with those nasty sites, forcing your into reading their uncomfortably small text, at least on the IOS:

https://stackoverflow.com/a/5932683/1614973

And yes, it also works for the native apps! Just as it should be.

Improve this answer
0

The W3C/Web Content Accessibility Guidelines (WCAG) version 2 Level AA 1.4.4 requires that sites be scalable without assistive technology up to 200%. This means that the mobile browser’s pinch zoom feature must allow for zooming up to 200% without using the assistive technology zoom on the mobile device.

W3C is law in most countries. If the ADA adopts it it will be law here as well, and it's expected to. If you can't follow international standards and make a site work then maybe you should rethink your approach.

You have no right to decide what functions will and will not work on my device when on your site.

Everyone on the planet who has ever used a smartphone or tablet knows how to pinch and zoom.

It's a function of my device. It's not a "feature" for you to do with as you wish.

This discussion makes it look like there's some uncertainty where there is none. Any developer worth his salt is developing by W3C and W3C/WCAG guidelines. And W3C/WCAG clearly states that mobile browsers must be able to zoom without using the devices assistive technology. It's not at a developers whim. As I pointed out, it's the law in all but a few countries.

1.4.4 has several other things in it that you should be following as well.

Improve this answer
4
  • You're getting down-votes because you phrased your answer in a way where it sounds like you treat the internet as a country. You know, with punishable laws and all. View it this way: it is MY website. I can do with it what I wish. If I want it to be un-zoomable (there might be good reason for it!) then I shouldn't be made to make it zoomable. The internet is a wild place, and while guidelines will certainly help, and I think there's good intent behind your thoughts, they shouldn't be made into laws.
    – Dirk v B
    Oct 7, 2015 at 21:51
  • calm down, a down vote isn't a slap int he face. It's just a number. Relax.
    – Glen Lipka
    Oct 7, 2015 at 22:31
  • 1
    If you're a professional then it's not your website. It's the customers. I would no more hire a web developer who does not follow W3C/WCAG then I would hire an engineer who does not follow ASCE 7.
    – rick
    Oct 8, 2015 at 11:15
  • 1
    Also, whether you believe they should be law or not is irrelevant. When the ADA adopts WCAG then it will be law and you will be required to follow it just like government agencies need to be 508 compliant. Laws are not "guidelines".
    – rick
    Oct 8, 2015 at 11:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.