Previously, to achieve the effect of resizing for mobile, I have only ever used
width=device-width, initial-scale=1 which worked no problem.
I recently discovered
user-scalable=no as an option for the meta viewport. At first I thought it was a short-cut for setting
maximum-width=1, minimum-width=1, however it comes with, in my opinion, one huge advantage:
This allows them [the web browser] to get rid of the dreaded 300ms delay on touch events that the browser takes to wait and see if your single touch will end up being a double touch.
Brilliant, I thought. Some basic testing on mine and some colleagues phones does indeed seem to remove the 300ms delay and makes for a much faster feel.
user-scalable some more rings some alarm bells. The general consensus appears to be that it, along with
maximum/minimum-width, is "harmful" for accessibility. Some snippets from articles or posts written this year:
What interests me is both these references link to articles written two and three years old respectively, and the arguments in each:
By setting maximum-scale=1.0, you are disabling the functionality to use pinch zoom on mobile devices, and forcing users to view your page a certain way.
[...] but there are lots of cases when the user might need to zoom: small body font (at least, for the user’s needs), checking some details in a photograph, etc
This parameter removes the ability to zoom in or zoom out, and it’s even worse than maximum-scale. If there’s a really special reason to use it (e.g., you are coding a web app and need to avoid zooming in form inputs)
Whilst I understand some of the concerns raised, I wonder if some of the arguments are about things which aren't, or shouldn't be, problems.
For example, stating that it removes the ability to zoom on input fields, one could argue that if a user is required to zoom in on form fields on a mobile optimised site there is a different issue entirely which should be fixed by not requiring users to zoom-in in the first place.
Font size I can accept is a problem, although a workaround could be to include font size controls (used to see them a lot, possibly not so much any more).
With that in mind is possible that
user-scalable=no (or max/min width) isn't quite as horrific as it sounds, and with some thought/planning with regards to accessibility it could be safe to use and benefit from the advantages it brings?
For a fair argument and a small confession, I am probably thinking a lot more about mobile phone sizes than tablet sizes. With mobile phones I feel stuff is often zoomed in sufficiently (most things just set to 100% width), the same cannot always be said for tablets I'll admit. Also, I don't suffer from anything which affects my accessibility so I am probably naive to some of the problems other people face.