10 ms·
WebKit removes the 350ms click delay for iOS
- nailer 11y agoFinally. Typing this on an iOS 9 device and I, as a human, cannot 'fast tap' enough for iOS to register a 'fast tap' and not delay. Try it here: http://output.jsbin.com/xiculayadu http://output.jsbin.com/xiculayadu
- ksenzee 11y agoThe change applies only to unscalable viewports. That's a shame, because it means some developers will disable pinch-to-zoom to get a faster click response. That makes this yet another unfortunate conflict between usability and accessibility. The older I get, the more I appreciate being able to zoom (I'm viewing this page at 125% on desktop right now).
- nathancahill 11y agoEven worse, some sites disable scaling, but let their content overflow the width of the screen without any possible way to see it. If you're going to use user-scalable=no, at least make sure that your code blocks and images resize to fit on mobile screens (or viewable separately).
- PebblesHD 11y agoThis isn't necessarily a problem as more sites become responsive and make a proper effort to accomodate mobile browsers. Where this will be a problem is poorly written desktop only sites that just make the change to get faster mobile interactions. I hope this encourages more of the former and less of the latter. EDIT: If you don't agree why not explain your point instead of randomly downvoting. I believe this change is overall a good thing as it means designers and developers can stop using nasty hacks to get around the delay as they have been doing. Hopefully it will also mean more developers make the effort to make their sites work on mobile instead of the half efforts that seem to be common now.
- jeffehobbs 11y agoUnscalable != Responsive. One does not preclude the other.
- PebblesHD 11y agoI didn't say it precluded the other, Just that as more sites have a proper mobile view scaling becomes less necessary.
- Sophistifunk 11y agoAnd we're saying that's not your decision to make. The user should always be able to scale and zoom.
- achairapart 11y agoSo let's add pinch to zoom to native apps and the whole OS UI by default.
- UIZealot 11y agoiOS supports zooming the entire screen as part of its accessibility feature set. Though you have to turn it on, and the gesture is three-finger-tap and drag instead of pinch.
- leeoniya 11y agowhy would they not follow what browsers already do and solely rely on: <meta content="width=device-width, initial-scale=1.0" name="viewport"> this is basically a solved problem with pretty much all other vendors having already converged. instead, they're giving fastclick [1] a reason to live on to polyfill a single, non-conforming vendor :( [1] https://github.com/ftlabs/fastclick https://github.com/ftlabs/fastclick
- deleted 11y ago[deleted]
- nevir 11y agoEach browser tackles it in a different way (see https://github.com/ftlabs/fastclick#when-it-isnt-needed https://github.com/ftlabs/fastclick#when-it-isnt-needed): * Chrome checks the viewport meta, as you mention * IE looks for CSS (touch-action: manipulation) on elements The change being made to WebKit will allow it to honor the viewport meta approach (e.g. when it disables scaling), just like Chrome does. So, if anything, IE is the odd one out now.
- themartorana 11y agoThere are plenty of apps that are guilty of this as well. Instagram comes immediately to mind. Not allowing pinch zoom on pictures I'm viewing on a tiny pocket screen (when there's no good technological reason for it) is a shame. I've turned on assistive zooming on my iPhone to overcome the limitation.
- achairapart 11y ago> There are plenty of apps that are guilty of this as well. Instagram comes immediately to mind. For native apps it's a design choice. For whatever reason (good or bad) they don't want you to zoom in. For websites instead, pinch to zoom exists for a design deficency, mostly for web pages not optimized for small sized screen. Responsive web design is helping but the gap is not filled yet. Hopefully it's just a matter of time and we'll experience beautiful mobile websites. For all other needs, there is OS assistive zoom.
- somebehemoth 11y agoWhile I agree with what you are saying I have a minor nit: "For websites instead, pinch to zoom exists for a design deficency, mostly for web pages not optimized for small sized screen." I understand what you mean, but in the context of sites specifically disabling zoom it seems to me that pinch to zoom is a design feature and not a deficiency of traditional web pages. Responsive helps, but there are definitely times when I wish the developers would provide only a desktop view so I can use my browser features to optimize my own user experience. (I am not representative of the general public, I know).
- systoll 11y agoNon-zooming sites can (and should) honour your system-wide font-size setting, giving you the ability to use the system's settings to achieve uniformly comfortable reading experiences across websites and apps. Zooming doesn't do much to give users much control over the reading experience -- iOS does not let users set or change the viewport size, so everyone gets the same columns to zoom into/out of. If you want text bigger than the single size the designer decided on, you're forced to scroll along each line of text -- which is a terrible experience. If you wanted it smaller, zooming out won't 'reflow' the layout, so you'll just be losing screen real estate to peripheral content.
- kristopolous 11y agoI'm usually at 260%.
- saurik 11y agoIf you are going to do something active (disable zoom) you could also just modify click to be fast (which was always possible before, and for which there are drop-in solutions). Like, this seems to be a non-issue.
- Flow 11y agoI hope the UI team make going back, even if an ad opened a new windows, super easy. I often accidentally touch the screen while preparing my finger for a scroll or zoom. I see links get highlighted, but if I'm fast to complete what I actually wanted, iOS will understand it was an accidental touch. No longer it seems. Shame.
- eridius 11y agoIt's already super easy to go back. Just do an edge-swipe from the left, like you would in a normal navigation stack in most apps. And you can edge-swipe from the right to go forwards.
- thecatspaw 11y agothis is exactly the reason I sneaked in fastclick[1] at work when noone was looking [1] https://github.com/ftlabs/fastclick https://github.com/ftlabs/fastclick
- jordanlev 11y agoUgh... This change is of course totally logical in isolation, but I fear that this will motivate designers and developers to disable pinch-zooming on their sites (more than they already are). I hate when websites do this, and it is generally considered terrible for accessibility.
- glhaynes 11y agoHopefully the intersection of "knows/cares about things like the 350ms tap delay" and "cares about whether the site is too small to read" will be large.
- eru 11y agoUnless it becomes a bullet point on someone's feature list.
- thecatspaw 11y agothere's allways fastclick
- untog 11y agoWhile I do symapthise with those lamenting the lack of pinch-to-zoom, I'm confused: apps don't offer pinch to zoom, so how do you use them? If you can use an app fine without pinch to zoom, you should really be able to use a mobile website fine too. It seems to me that this is an either/or proposition: either you have a not-mobile, pinch-to-zoom-able web site, or you have a mobile-specific site with an app-like viewport that does not allow pinch to zoom. Both of these seem like fine options to me, and I don't think it's a huge loss to lose the middle ground.
- monochromatic 11y agoYou're right in principle, but in practice a lot of zoom-disabling websites have text that's smaller than it should be. Apps seem not to have this problem as much.
- briandear 11y agoI agree. I think the issue is that apps are purpose built for a device while web attempts to 'average' the experience across a range. Honestly, I think many designers don't actually preview their pages on real devices either.
- mattmanser 11y agoBecause the middle ground is what happens in real life. Many sites have poorly designed mobile experiences that zoom helps fix. I personally have my mobile Chrome set to over-ride site viewport settings to always allow zoom. For example wikipedia (used to?) disable zoom while making all their pictures small. But what if the picture has the information you want to see? This is because a lot of content on the internet is long form reading with pictures, and ideally you'd want the middle ground, responsive quick scrolling with the ability to zoom on pictures, infographics, etc. and then zoom out again to carry on reading. And before you say it, all picture viewers on mobile suck. We already have an amazing, built in solution.
- nathancahill 11y agoYou're talking about two fundamentally different things. Apps are designed specifically for mobile, so of course they will work well fine at the scale they were designed at. Ideally, websites would be designed to work fine at any scale from mobile to desktop (responsive design). However, many mobile websites are delivered today as downscaled/simplified versions of the desktop site. This means there's a lot of design that crosses over from desktop to mobile. When you add disabled scaling on top of that, many things break, like content being too wide or font sizes being too small.
- kristianp 11y agoCan someone explain what this means for the non-IOS developers amongst us?
- geofft 11y agoAs I understand it... If you're using Mobile Safari (or many other mobile browsers), and you double-tap something, it's interpreted as meaning "zoom in to this element". This is useful for pages with narrow columns and things on the sides, etc. However, in order to implement this, when you do a single tap, the browser has to wait to make sure that you don't do a double-tap. So there's a 350ms delay while it's waiting on your second tap, before delivering a single-tap event, e.g. to click on a link. There's a meta tag you can use to disable user control of the zoom level, e.g. with pinch-to-zoom. One of the things that this disables is the double-tap behavior. Given that double-tap is disabled on those websites, there's no need to sit around waiting for a second tap; you can treat it as a single tap immediately. This change removes the delay. (People are upset because this is an incentive to use that meta tag if you otherwise wouldn't need it, and being able to zoom on a mobile browser is useful.)
- toggle 11y agoAlso worth mentioning: Chrome for Android did this last year. GP was asking about iOS, but it's not an iOS-specific thing.
- stephengillie 11y agoTo continue the Chrome for Android tangent, you can re-enable zoom-in as an accessibility feature.
- jdavis703 11y agoIt means that un-optimized websites that have a certain meta tag set will feel (keyword here being "feel") faster when interacting with them.
- dkonofalski 11y agoWhat's the intended function of the previous functionality? Didn't double-tapping zoom in and out to a specific section? What problem does the delay solve that isn't present on unscalable viewports?
- nevir 11y agoThe delay allows webkit to detect a double tap. Otherwise, any element with a click handler would immediately fire, effectively disabling double tapping for their region.
- eru 11y agoAn interesting choice would be to retroactively undo the effects of the single click if a second one was detected.
- jamesrom 11y agoA lot of commenters here are afraid of developers disabling user scaling to get better performance. That is incorrectly making the assumption that user scaling is good thing for every kind of website. If a 350ms click delay is actually a performance bottleneck on the app you are building, it's very likely user scaling is something you want disabled anyway.
- nevir 11y agoIf you're building your website to behave well on mobile devices, you're likely implementing your own touch handlers and are not using click events to begin with.
- robocat 11y agoThis is actually very hard to implement. The underlying issues are that (a) it is hard to make touchstart/touchend act the same as a native click event (touch-scroll interactions, different fat finger slippage, text selection, press duration, etc). (b) you only want to do this for iOS and not any other browser (different browsers and OSes and pointing devices introduce a huge number of other issues: cant prevent the click on the touchend, mouse or pen support is difficult, avoiding ghost taps https://www.google.com/#q=ghost+click+tap https://www.google.com/#q=ghost+click+tap ). (c) you run into future compatibility problems (pen, force-clicks, other HIDs).
- nevir 11y agoTrue. But that's where http://www.w3.org/TR/pointerevents/ http://www.w3.org/TR/pointerevents/ comes in
- elpool2 11y agoEven if you use nothing but touch events on IOS, the 350ms delayed click can still cause problems. For example, suppose you want a button to pop open a small form over the top of the page and automatically focus the first input in the form. You can wire up a touch event so you don't have a delay, but then the input gets focused and then un-focused 350ms later, because a delayed click happened somewhere else on the page. Or maybe a different field gets focused because it's now directly above where that button used to be.
- outside1234 11y agoRemind me: They originally had the 350ms delay in there to distinguish between a tap and a pinch, correct?
- matthewmacleod 11y agoA tap and a double-tap, AFAIK. Since the latter is used for zooming, if the page is not scalable then the possibility that the user has double-tapped can be disregarded.
- bsimpson 11y agoAs I recall, it's waiting for a double-tap.
- fogisland 11y agoyeah, it is a mechanism of iOS gesture recognizer
- joeyspn 11y agoGood news for hybrid apps devs...
- lsorese 11y agoIncredible news for hybrid app devs. This has been a longstanding annoyance on iDevices that has only been superficially fixed with polyfills on iOS and dumping your app into Crosswalk on Android.
- escherize 11y agoI really don't understand the lamentation around pinch to zoom. There's a fantastic os-level zoom built into ios! Set it up and three-finger-click to activate. And it works great.
- blazespin 11y agoNice! Thanks.
- function_seven 11y agoI am a huge fan of the 3-finger zoom, but it's not exaclty the same as browser-provided zooming. The screen zooming provided by the 3-finger tap will not add resolution to downscaled images. If I'm looking at a site that presents a massive image scaled to my display, the browser zoom will add more information as you zoom in. The 3-finger zoom will make the existing pixels larger. Most of the time this difference isn't an issue, but it is a difference.
- memco 11y agoThree-finger zoom is more inconvenient and a little inconsistent in my experience on iOS9. It is inconvenient in that scrolling a page is sometimes difficult to accomplish when zoomed in. I feel like three-finger zoom is a last resort for when something is not properly accessible. I am visually handicapped and being able to zoom is essential for me. I have a hard time using sites that disable zoom already, this is only going to exacerbate the problem.
- wingerlang 11y agoThis is a little bit off topic (from standard iOS) but here's how I force zoom stuff with a little tweak I made http://imgur.com/1WXHoPv http://imgur.com/1WXHoPv (jailbroken devices only). The thing itself is not for zooming, but it is a happy little additional bonus feature.
- RoboTeddy 11y agoHow long until this makes it into the Mobile Safari on most people's iOS devices?
- mozumder 11y agoAny idea when this makes it into an iOS release? Does Apple usually implement this in point releases? Or do we wait until iOS10 next year?
- paulvs 11y agoAs I see it, the 350ms delay was added to support zooming via double-tap. What I don't understand is why double-tap zooming is necessary when we have pinch-to-zoom? Can't zoom via double-tap be sacrificed for instant clicks and everyone is happy?
- achairapart 11y agoI also never understood why you'd double tap on a link or a button.
- christianmann 11y agoYou might double tap near a button, to expand it and give yourself a larger target.
- creshal 11y agoFat fingers.
- stephenr 11y agoDouble-tap zoom is meant to be "smart" about what it zooms to, automatically. So if you're looking at a page with multiple regions and double tap one of them it will try to zoom to show you that region. I use this far more than pinch-to-zoom.
- TN1ck 11y agoYou can use double-tap zooming with the hand you're holding the smartphone with, im using it more often than pinch to zoom.
- awj 11y agoTry double tap zooming on a paragraph in a body of text. It should automatically zoom so that the paragraph occupies the full screen width. That's a pretty nice feature to just give up.
- yetanotherjosh 11y agoSeems like you'd still need the 350ms delay (or some amount of delay) for pinch-to-zoom because the two fingers don't touch the screen simultaneously. The sensor reads the first finger's touch and the software has to wait to see if a second finger touch comes in before it decides if the first touch is a tap or the start of a pinch.
- zkhalique 11y agoIn our framework, we have for a very long time had a Q.Pointer class which contained functionality to normalize things between touchscreens and non-touchscreens. Among other things, it had the "fastclick" event: https://github.com/Qbix/Platform/blob/master/platform/plugins/Q/web/js/Q.js#L8825 https://github.com/Qbix/Platform/blob/master/platform/plugin... There is far more than simply relying on a "click" in touchscreens. For example the "touchclick" event is for those times when the keyboard disappears because focus has been lost in a textbox, but the click will still succeed: https://github.com/Qbix/Platform/blob/master/platform/plugins/Q/web/js/Q.js#L8825 https://github.com/Qbix/Platform/blob/master/platform/plugin... Also, drag-drop is broken in touchscreens WebKit so you have to roll your own, and much more. You're better off using a library.
- tracker1 11y agoCool.. as a side note... 10k lines in that file, is it maintained like that? I know modularizing and things like browserify have an overhead, it just seems excessively large for a single source file (was scrolling up to the top, so that I could star the project to look at later). I'm not trying to attack or being negative here... just a bit surprised.
- fogisland 11y agoWill removing this 350ms delay really make user feel faster response?
- duncans 11y agoIt's what FT Labs fastclick tries to mitigate - try it for yourself: http://ftlabs.github.io/fastclick/examples/layer.html http://ftlabs.github.io/fastclick/examples/layer.html