The Apple UX team have spoken. Here’s why we disagree.

The moment it hit me..

While busy testing the responsive behaviour of a website I was working on, it occurred to me that there was something not quite right in the way the website was being rendered. The website was indeed responsive and had adjusted itself based on set media queries. The issue was that I was able to pinch and zoom despite the fact that I had disabled this feature and as mentioned the site and content was displayed as it should. This happened on the iPhone. I then proceeded to try on my wife’s Android phone to verify that I’d slipped somewhere in my code only to discover that for the first time ever (and likely to be the last), the Android shun a more forgiving light on my development than my trusted iPhone. Pinching and zooming was disabled.

After having a little search on Google as you do, I found that this was an issue that many had already saught a solution to. This lead me to believe that either the iOS 10 release contained software with bad code, or the Apple UX team have decided to wreak more havoc in the world of design for the web. Having read various articles on the subject, it appears as though the latter was the case.

“If it ain’t broke..”, yes, well they’ve broken it.

Pinch and zoom is a feature expected on websites that are not responsive, understandably, you’d want to zoom in to view the little details. The purpose for having a responsive website is to ensure that mobile/tablet users are given a more compact view of the full website on desktop. Typically, hover states are disabled, divs, sections and other block content become stacked. Font sizes and images change in size amongst other layout modifications as a result of having to fit in to a smaller space.

Developers have been building responsives websites for years, it’s no longer considered a feature to pay for and is very much expected when viewing a website. The ablility to pinch and zoom is usually disabled in the meta tag used:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

Pay attention to the segment in the code ‘user-scalable=no’, this is what disables the gesture. Now to my point. For the Apple UX team to decide that now is the best time to bend the rules by enabling the gesture to overwrite the developers code, seems to me a step too far. Responsive sites exist, so the user cannot AND should not see a broken layout. Content has already been modified, so users can clearly view what they are after.

To further support my case, see the following attached image. It portrays what a broken layout looks like. A broken layout being a responsive website zoomed in.

Apple UX Team

Contrary to the above ‘pinch and zoom’ (which does happen), see how the actual content is smaller than the window? This is the result of an inadvertent ‘pinch and shrink’, quite possibly a glitch as I’m not aware of why a user would want to perform this kind of action. Another issue I’ve come across is the inability to highlight the text in a textbox thats beyond the overflow (title field in screen attached).

There are possibly more problems that have reared their ugly heads as a result of the decision that the Apple UX team have made. Hopefully they’ll see sense and restore power to developers code.