If zooming is better than having a properly designed layout for the device you are using, how did all the app developers get it wrong? Nearly every app on my phone is formatted for a small touchscreen, and not simply a desktop-sized program on a desktop shrunk to fit my phone screen (allowing me to zoom in and push a tiny cursor around). Form follows function, and so an app designed for a mobile device would look different than an app designed for a desktop computer. The hardware and capabilities are very different.
The great part is, with recent support in CSS we can build one site and target desktop users and mobile users with entirely different hardware, and give them a unified experience and layout that's tailored to their device. When they use the desktop it's the same website, fit to their screen and ready to be used with a mouse and keyboard. When it's from a mobile device - all of the same information and actions are still there, just presented in a way that's intuitive and natural to users of a mobile device.
If you've ever used a mobile simulator on a computer you'll know how awkward it is to emulate the most natural and smooth fingertip gestures with a mouse. It's clunky! Well trying to pretend you're a desktop with a mouse when youve got a tiny screen and a big mouse (fingertip) is just as awkward and useless.
With zooming enabled, every tap you make takes 300ms longer to register because it's listening to see if that tap is a tap or going to be part of a zooming gesture.
I design my stuff to look good well beyond normal tolerances for screen sizes, and trust me - I am not your enemy here. I do what I do to give the best experience and if zooming ended with an easier-to-use experience then for sure I would enable it.
I do a lot of other things to make it easy for mobile users too:
- use tel inputs for numerical entry (mobile users get a keypad instead of a keyboard)
- user email inputs for emails and turn off autocapitlize (mobile users get a keyboard with an '@' symbol)
- use retina graphics, or render imagery in code for retina and pixel-dense displays
- every layout I create works from 300px-1500px, and some of the more important elements in the layout I may get working from 200px-2000px to be certain they will work everywhere.
- I use a massive wish-list of fonts that includes great defaults for OS X, Windows, Linux, Android, and iOS
- I use the least amount of JavaScript that makes sense to accomplish what I need to do (I hate sites that constantly crash the tab on mobile)
- I add offline and web-app tags according to the project to help users who may add the site to home screen have the best experience (not all sites are built for web app mod)
- I also add in special icons just for mobile users so if they bookmark the site they will have a nice icon as well
- I disable text-selection or pointer-events for items that may be errantly tapped on, or to help you be able to more easily select text you are trying to select on mobile. Text selection, copy, and paste on mobile is a magnitude more difficult than for a desktop user
So I'm not just disabling it because somebody told me to, or showed me that's how it's done. I work hard and develop, and use these devices, and building a desktop site you can pan around does not provide as good an experience as a properly designed responsive site.
I'm a mobile user too, trust me when I say I fight for your experience to be the best there is!
Nothing in my list was meant to be a justification for disabling zoom. My justifcation for that is: I am a formally trained designer and I design UI properly for the devices and hardware my projects are intended to be accessed with.
The other stuff I mentioned were just other examples of things 'from the frontline' that I do to optionally enhance the site for mobile users with no effect on desktop. I design everything with two very different targets in mind.
Please please stop disabling zoom. I beg of you, I have to abandon sooo many sites because they are unreadable because I can't zoom.
>I am a formally trained designer and I design UI properly for the devices and hardware my projects are intended to be accessed with.
If designers were actually licensed, I think that disabling zoom should be an offense that results in a 2-year revocation of design license. It's so user hostile that it's unacceptable. That you are trotting out your "formal training" in response to user pleas shows that you really don't have many legs to stand on.
> any low-vision users have software-based screen magnifiers. Sometimes they augment the magnifier with text-to-speech software when reading longer passages of text.
[...]
> to be truly accessible, a website must allow individual preferences in colour, size and typeface to override the author’s suggested design.
The website you provide to support your position tells you not to do what you're doing.
(Ironically, the accessibility guidelines are in an unaccessible PDF).
>Does it change your mind at all that you linked to a zoomable site?
No, I said I decide based on the needs of the project and which devices will be supported which META tag makes the most sense. Not 100% of my projects disable zooming, and I don't believe 100% of sites should disable zooming. Zooming is a useful feature added to mobile browser that does serve a purpose: to allow the user to navigate a site that was designed without their device/hardware in mind. It's good at what it does, but it's not better than a properly designed site (whatever that means). My job is to figure out for each project what a properly designed site means, and for the big web-app type projects that make the most money, having zooming disabled allows me to deliver a better experience I couldn't with zooming enabled.
But I didn't link to the RGD.ca site to help prove my case, my learning comes from actually doing web development, not what an organization says is best practice. Mine comes from hundreds of hours of specializing in making sites that dont support mobile convert more users. People hire me because I help them reach more mobile customers, and I make a fraction of the money I make for my clients by supporting mobile better.
I posted the link to the Registered Graphic Designers site because the commenter above me said:
> If designers were actually licensed, I think that disabling zoom should be an offense that results in a 2-year revocation of design license.
Here where I live if you're RGD you get letters after your name like a dentist or reverend. So a little education before speaking can help keep the conversation on a contructive path.
I listen to my users and none have complained about zooming where zooming has been disabled. There are voices here offering opinions and I do actually care about their reasons.
Please, tell me the reasons why zooming on a legible, usable design is necessary. Explain your side of things, downvotes and ad hominems aren't constructive, and there is value in this conversation being had. Why is this conversation being treated like spam? Here's your chance to tell the guy who makes mobile sites the way they are how you wish they were different and all you want to do is stop others from seeing that I'm listening here on HN?
I'd appreciate any constructive input on the pain points of using mobile sites. Today's work includes taking a credit card form designes in 2009 and making it work on mobile. Seriously, if there's valuable insight you have that I can use to make this easier for you I'm all ears.
> Please, tell me the reasons why zooming on a legible, usable design is necessary
Because what is "legible, usable" to most users still isn't to some. Not all of us have good eyesight. Some of us have horrendous eyesight. You may think that 16pt text is "legible", but for some users, nothing less than 32pt is readable.
I have no idea why you would add css that diasbles zoom.
Do everything you currently do, but don't add "user-scalable=0" to the css. Doing so provides no benefit to anyone, but does make your pages harder to use for a large section of users.
You still haven't listed the benefits of disabling zoom.
User scaling is more than just the zoom gesture, it's a different way of controlling the web page in Mobile Safari, and because of these differences the user experience is quite different. With User Scaling enabled, you can use the zoom gesture, pinch gesture, or double-tap gesture to scale the viewport.
But how does Mobile Safari know the difference between a single-tap and a double-tap? By waiting 300ms after the first tap to see if you tap again!
By disabling user scaling, yes the zoom gesture (and pinch gesture) no longer scale the viewport, BUT Mobile Safari also stops delaying all tap input 300ms to wait for a double-tap. that means every link you tap, every button you press, every field you highlight, and every other interaction with the site goes much faster and smoother.
Faster tap response time = a better user experience. Even if the site was 100% responsive, when I turn user scaling off Mobile Safari just works faster than with a fully responsive, scaled and accurately displayed site where Mobile Safari is waiting to tell single-taps from double-taps.
I know for some people 300ms doesn't sound like a lot, but for us it would translate into a loss of at least $,$$$ annually if not $$,$$$ due to the loss of those mobile users due to a 'non-responsive' site in a different way: time.
Stop being user hostile. It's illegal in your jurisdiction; your customers do not know what you're doing and almost certainly wouldn't want you to do it if they did understand; and the users hate it.
I am aware of this, but most iOS users do not use Chrome. I am also aware of FastClick and Google's FastButton as well, and I have even used them where the need applied.
You seem to not accept that what is usable for you may not be usable for others.
By disabling zoom you are actively chosing to exclude people from your products. Depending where you are that's illegal, but where ever you are it's a really unpleasant thing to do.
Further: you are actively preventing people using assistive technology.
Do you have any examples of your websites?
Do you have any sources that say disabling zoom is a good idea?
My training was in graphic design, and the web training we got in college was behind where I was self-taught in web before getting to college, they only covered the basics.
By leaving the User Scaling on, the browser slows down all of your taps 300ms to wait and see if your single-tap is really a double-tap to scale the page. By disabling User Scaling, your interactions are read as soon as you make them, leaving you a much improved experience due to 'page reposnsiveness'. With user-scaling on, and a proper responsive design, there's no need to slow down every tap every user makes on the site 300ms just in case some users want to occasionally scale the page instead of finding another way to accomplish what they want.
> and the web training we got in college was behind where I was self-taught in web before getting to college, they only covered the basics.
As I thought so no formal training in design for screens.
Screens are not paper. Please be responsive yourself, be a life long learner and stop disabling zoom. Can google analytics or somesuch look for failed pinch to zoom events followed by someone leaving your website?
P.S. responsive means that the website responds to the screen size and looks fine on a 40" wide screen or on a 4" smart phone. It does not mean anything about speed of response (which is a nice thing to have obviously but not at the expense of basic function).
P.P.S. there are two responses to a non-zooming website:
1. That of someone that knows what the web-designer did: "Why on earth did the * web developer disable zooming. I'm closing the tab."
2. Non-techy people: "Grunt aaahhh why is this * website not working. I'm closing the tab and never coming back".
The assertion "responsive = 300ms = no zoom" discredits any resume with written "responsive" on it. Because, if you remain stubborn even after a crowd tells you they need to zoom, then you lack the basic skills to drive user interviews.
Not everyone has the same eyesight or the same size phone.