Silkenweb Example: Hackernews Clone

Please stop disabling zoom

620 points by zachflower 3 years ago | 303 comments

hallway_monitor 3 years ago
Yes it is silly. The article actually ends with some useful tips:
As a user, you can force allow zooming:
In Firefox find the settings, select “Accessibility” and activate “Zoom on all website”
In Chrome find the settings, select “Accessibility” and check “Force enable zoom”
- kevincox 3 years ago
  Unfortunately this also disables it on sites where it makes sense. For example I have a simple tool to pick a random person or split people into groups https://playerone.kevincox.ca/
  Without zoom disabled 5 people putting their fingers on a screen looks a lot like a pinch gesture. Disabling the default event handlers only works some of the time.
  This is a common problem with the web, we can't have nice things because people use them poorly.
  - iggldiggl 3 years ago
    Yep, exactly this. I have that setting enabled myself due to e.g. Blogspot inappropriately blocking zoom in its default mobile template — but on the other hand it does unfortunately mean that e.g. on openstreetmap.org I occasionally end up zooming the page instead of zooming the map…
  - pvorb 3 years ago
    That tool is a gem! I didn't have many situations where I could have used this during the past two years, but things seem to become a little better now.
    - kevincox 3 years ago
      Thanks for the kind words. The same for me, I used to use this at least weekly, but now I'm lucky if I open it in a month (although regular board games are coming back to my life).
      Pro tip: Double tap for a few more options.
  - rchaud 3 years ago
    At least the web offers a workaround.
    I've never been able to zoom on mobile apps.
  - fold3 3 years ago
    For whats it's worth, I'm trying to test the issue on your website with either chromium or Firefox on android 12 and it doesn't zoom.
  - tomtom1337 3 years ago
    This is a really creative website! Nice work!
- tobyjsullivan 3 years ago
  I kind of wish the author had lead with this instead of burying it at the bottom. For whatever reach the article gets, this is the part that's going to offer value to readers (it seems unlikely this article will sway a significant number of web developers to change their habits).
  - jeroenhd 3 years ago
    The goal isn't to help the readers though, it's to convince web developers to fix their websites.
    Anyone can find the secret override setting if they're motivated, but that's not a solution to the problem.
    I know web developers don't care, but they're still the ones that can actually solve the problem. It's possible that like many other abused web features, Google will eventually change the setting for this feature from "override website zoom settings" to "respect website preferences for zooming" with "off" as a default.
    - Johnny555 3 years ago
      The goal isn't to help the readers though, it's to convince web developers to fix their websites.
      It seems like that battle is already lost, this isn't some default setting that they are just accepting, web developers are doing it because they think they have a good reason, some random blog post isn't going to change their minds.
  - ziddoap 3 years ago
    Do you really consider it buried?
    The entire article barely scratches 250 words. I don't think anything can be considered 'buried' in what is basically a medium-sized paragraph.
  - ascar 3 years ago
    I dunno. This article is like a 2 minute read. Starting with a solution nobody asked for sounds like an unreasonable request, while I did like hearing about these options after realizing how big the problem is.
    - kwhitefoot 3 years ago
      > Starting with a solution nobody asked for
      At least one person wanted it: me.
- dlandis 3 years ago
  Yup but it seems to me like the default behavior should be reversed. It should be accessible by default, and for the few special cases sites where zoom interferes with their functionality, then the setting could be toggle to disable it.
- ibejoeb 3 years ago
  Would be nice to have a standard accessibility header that the client could send to request these kinds of things, like "always enable zoom."
  In lieu of that, maybe consider having an "accessibility options" cta on first interaction.
  - account42 3 years ago
    Additional headers on every request should only be considered if there really is no other option.
    For not disabling zoom the header does not even help because developers blindly copy pasting the <meta name="viewport" ...> line so that broken by default mobile browsers won't fuck up their responsive design are not going to handle that header.
    Like many accessibility issues, zoom is not something that only benefits a subset of the popultaion. The solution is to no disable zoom for anyone except the 0.01% of pages (only very specific web apps really) where zoom does not make any sense AND interferes with some other behavior (e.g. multi touch).
amluto 3 years ago
It’s not just accessibility. I’ve last track of the number of times I’ve seen a mobile website with a table that extends past the right side of the viewport and zoom disabled. You can’t scroll, and you can’t zoom, so you can’t read the table.
- PaulHoule 3 years ago
  Unfortunately people see accessibility as a burden that a small minority puts on the rest of us, but really it is something that benefits everyone.
  For instance, normally sighted people or even people with "normal" nearsightedness, farsightedness, or presbyopia benefit from adequate contrast.
  Text "size" is another thing because people should be able to control it, particularly given the wide range of different devices that are out there.
  - rootusrootus 3 years ago
    > ... a small minority ... presbyopia ...
    I think what you just indirectly pointed out is that software is largely written by young, ignorant people who don't appreciate that everyone will get to experience presbyopia, and it happens sooner than you think. Maybe we should require product owners to be at least 40 years old ;-).
    - kenjackson 3 years ago
      I've become "that guy" in presentations who constantly tells people "fonts too small", "can't read cause the contrast isn't enough", etc... My hope over time is that I stop being invited to meetings or people actually take the time to fix their presentations before it is presented to a wider audience.
    - PaulHoule 3 years ago
      For years my optometrist told me I would eventually get presbyopia and then finally I reached the point where I need two pairs of glasses.
      It is on my mind because one of my hobbies is a cyberphysical artsystem that has a small book of design rules and presbyopia is what sets the limits on feature size. (You can't just tell people "hold the card closer")
    - peterkelly 3 years ago
      And they're using the very latest macbook pro with a fast and reliable internet connection, on which the site/app seems to work just fine and must therefore be ok.
    - JJMcJ 3 years ago
      Also color blindness and low contrast.
    - nightski 3 years ago
      I don't think this is reality. There might be some truth to it, but in my opinion the real problem is the platform itself. I'm going to blame it on browsers and web standards.
      The web was not designed with accessibility as default. Instead it is a significant amount of work to make things accessible. Every project incurs huge cost in order to achieve it. I truly believe from an accessibility standpoint the web is simply broken. So sure, blame it on young programmers. But that's a poor excuse for where we are at today in my humble opinion.
  - WalterBright 3 years ago
    I have the default font size boosted slightly. A large percentage of web sites and applications don't work with it, the text is cut off. Even ones from Microsoft.
    The irony is you have to work to get this to not work. HTML by default will render just fine. Developers just can't resist customizing it so it doesn't work.
    My web sites use plain HTML as much as possible. They're derided for being "Web 1.0", but they work, load in a flash, can be resized by the user, are legible, etc.
    Even Apple went with pages that were light grey text on white with a tiny font. My eyeballs would just hurt trying to read it. This was a few years ago, maybe they fixed it, but I grew to avoid reading Apple's online docs because it was literally painful.
    - 3 years ago
    - anticensor 3 years ago
      I have Dark Reader installed, adding to that, I actually changed my browser's (Firefox) base font colours to light text on dark background to prevent white flashing issues in pages that ignore dark stylesheets.
    - lupire 3 years ago
      Android can't even render all of its own system UI widgets if you choose one of its larger built-in font size options on a Google phone.
  - scarby2 3 years ago
    > normally sighted people or even people with "normal" nearsightedness, farsightedness, or presbyopia benefit from adequate contrast.
    Makes me think of the oxo good grips kitchen utensils. They were designed designed for people with poor dexterity and as a result have become easier for everyone, this has made them extent l extremely popular
  - warning26 3 years ago
    > Unfortunately people see accessibility as a burden that a small minority puts on the rest of us, but really it is something that benefits everyone
    Depends on the individual case — I’ve seen entire projects get scrapped because it wouldn’t be feasible to make an “accessible” version. Some things just aren’t work for everyone and that’s okay.
    - ryandrake 3 years ago
      Accessibility is like performance, and security, and portability: You don't create the product, and then "spoon a little security in" right before shipping. You build it from the start as secure, with security as a first-class goal, and gate features on whether or not they are secure. Same for accessibility. You don't try to take an existing inaccessible project and wave a magic accessibility wand around it late in the game. It should be a first class design principle. If you are hiring a UI designer or interaction designer, pay attention to how seriously they take accessibility in their designs. If they're good, their designs are accessible by default, because as a Cousin Comment said, accessibility is not just "usable by the disabled" it's "usable by everyone".
    - briandear 3 years ago
      When building new commercial buildings (in the US,) accessibility is a non-negotiable requirement. And for good reason. If an accessible version wasn’t feasible in software, then it’s likely the project should have been scrapped just as a commercial building would never be built without accessibility as part of the core design. There shouldn’t be an “accessible version,” accessibility should be the default. Accessibility should be integral to everything built — especially software.
    - PaulHoule 3 years ago
      A flip side is that any bureaucratic mandate is a "free pass" to reject anything that's hard to find another justification for rejecting... In terms of institutional requirements it is a gift as much as a burden.
  - flavius29663 3 years ago
    also keyboard shortcuts, a compliant app needs to be accessible through predictable shortcuts. This benefits us all.
- zionic 3 years ago
  Maybe this is a good place to ask since there's a lot of web devs here:
  What is SO effing hard about drawing within the screen on web?! I can't tell you the number of times I've seen this issue. Just the other day I saw reddit's sign up form is totally broken on iOS, you have to swap between landscape/portrait multiple times and hope whatever garbage layout engine it uses redraws the button inside the screen.
  - astockwell 3 years ago
    It's because designers work with placeholder data. I worked full-time as a dev and saw this over and over and over again. The good designers would adapt, but some never learned.
    As soon as you put real data into a website, especially if the website is a CMS that you've handed-off to a _non-technical_ client, it's going to overflow every pretty, grid-based box.
  - dreamcompiler 3 years ago
    I think it's because almost all web design happens on computer screens, not mobile devices. More important, all web designers show their bosses their creations on a big computer screen in a conference room--the bigger the better so everybody can go "oooh!" and "aaaah!" and the designer can get a big fat raise.
    I expect it's fairly rare for the employer of a web designer to give a shit what the site looks like on a phone, which means the designers don't give a shit either.
    - HWR_14 3 years ago
      What's strange about that is that a collection of old devices is very cheap. It's trivial to have a box and test them.
  - robertoandred 3 years ago
    It starts with the fact that designs, and the development that uses them, usually think in terms of fixed rectangles. You've got a 1920x1080 desktop rectangle and a 375x812 mobile rectangle and rarely is much thought put in to what happens when your viewport is a different size. And what thought that is put in goes toward horizontal differences, since the assumption is that things will just scroll vertically.
    But, as you've noticed, with more complex UI (especially modals and toolbars fixed to the screen) it becomes more important that things are built to fit horizontally and vertically. It's not necessarily hard but it does take more thought to work out how things will shrink, grow, scroll, etc.
  - tshaddox 3 years ago
    > What is SO effing hard about drawing within the screen on web?!
    It’s because the web’s layout primitives don’t compose well. There’s no easy way to say “this is a full-width container and nothing inside it can go off screen.” As an obvious example, any descendant of that container can use fixed positioning and do whatever it wants. But there are subtler examples that are easier to fall victim to. The way to fix this is to built your own higher-level layout primitives and have conventions or tooling to enforce that you compose them only in approved ways.
    - account42 3 years ago
      > There’s no easy way to say “this is a full-width container and nothing inside it can go off screen.”
      overflow: auto;
      > As an obvious example, any descendant of that container can use fixed positioning and do whatever it wants.
      Fixed positioning is you explicitly opting out of composability.
      > The way to fix this is to built your own higher-level layout primitives and have conventions or tooling to enforce that you compose them only in approved ways.
      No, the way to fix it is to look at your DOM and CSS instead of adding more abstractions with broken edge cases on top of your abstractions.
- Daemon404 3 years ago
  This is a constant issue for me (Chrome on Android) on GMail's Web UI (yes, I insist on using the Web UI...). So many emails are entirely unreadable since they go right off the right side, and you can't zoom.
- civilized 3 years ago
  Wow. I had no idea that this was something explicitly imposed on us by developers! I thought it was some kind of inherent issue with mobile.
- dyingkneepad 3 years ago
  I know exactly what you're talking about. A lot of times those tables are sized exactly for a horizontal view, so always try tilting your phone 90 degrees and it may work.
- darekkay 3 years ago
  > you can’t read the table
  Which makes the table content inaccessible. It _is_ an accessibility issue.
  Here's the definition I prefer, that does not focus on "disabilities" (which many people equate "accessibility" with):
  > When we say a site is accessible, we mean that the site's content is available, and its functionality can be operated, by literally anyone.
  https://web.dev/accessibility/
- calvinmorrison 3 years ago
  It's just constant. I know I am an oddball but I use firefox, which at this point is basically unsupported online. Pages just _dont_ work right. Of course my 600 extensions, from tridactyl(vim kb) to no script tend to break even more.
  But it frustrates me to no end that a browser is no longer a "User" Agent and is now just seen as a... virtual machine for apps?
  - jandrese 3 years ago
    As a fellow Firefox user this is not my experience at all. Most stuff works fine once I allow the necessary subset in uMatrix. Some things are a pain in the ass, like embedded video widgets that need to load in dozens of scripts from all over the web before they'll finally get to the actual video frames, but I can pretty much always get stuff to work.
    One tip: Don't try to install too many general filtering extensions (uMatrix, Privacy Badger, uBlock Origin, etc...) at the same time because they will end up fighting.
    - GekkePrutser 3 years ago
      Same here..I don't even have another browser installed on my main machine. Never have the need for it, FF works great. I think the OP has too many plugins :)
- manholio 3 years ago
  Another maddening thing are tiny fonts on mobile devices and pinch zoom does not reflow text. So you can't read without zooming in, and you can't see the whole page when you do, so you need to put your phone in landscape mode and drag left and right to read each and every row.
  - bbarnett 3 years ago
    Even though loads of browsers support it on desktop, bizarrely not so much on mobile.
    Even better, one chrome issue/bug report, had google devs on the tracker explaining how it's fine, and how each website should just fix things.
    They were blathering on about how websites are broken, should be fixed, utter absurd.
    The sheer, unmitigated gall, of saying "screw users" is beyond comprehension.
    Google: unless you want another series of Professor Farnsworth posters around HQ, fix it!
  - account42 3 years ago
    This is mostly due to the broken by default rendering of mobile browsers that emulate a larger desktop browser window unless the website specifically opts into the sane responsive behavior via the <meta name="viewport" content="width=device-width, initial-scale=1"> tag. This is especially idiotic since mobile browsers now have an explicit desktop mode that forces this behavior.
- HelloNurse 3 years ago
  Hipster logic: if it works on my machine, you have the wrong machine.
- dheera 3 years ago
  Sometimes you need to prevent zoom in order to implement your own zoom though.
  For example if you're making a WebGL app, or if you're making a map zooming widget that needs to progressively load more local detail as the user zooms in on an area.
  If you don't disable zoom, the OS and your zoom logic will be fighting over the pinch gesture.
- Reason077 3 years ago
  maximum-scale and user-scalable=no seem like browser mis-features. Perhaps the OP would have more success appealing to browser developers to follow Apple and Samsung’s lead, and get browsers to ignore them?
  - account42 3 years ago
    It's definitely always a mis-feature for websites. It can make sense for webapps in rare cases [0]. Well, disabling the pinch gesture makes sense for those, ideally the browser would still provide another way to change the zoom.
    [0] https://news.ycombinator.com/item?id=31274454
- Reason077 3 years ago
  What mobile browser? On iOS Safari, all the example websites mentioned by the OP allowed me to zoom. I guess Safari doesn’t allow zoom to be disabled by websites? Maybe all browsers should work this way?
  - rectang 3 years ago
    I use iOS Firefox, because I love desktop Firefox and I have Firefo set up with account sync across all my devices. But there's a feature of desktop Firefox which isn't available on the iOS version: remember zoom setting for a domain.
    iOS Firefox does have pinch-to-zoom, but having to use it every time I navigate to a page is tiresome.
    iOS Firefox is a small niche choice and not the same codebase as desktop Firefox because Apple requires that you use their rendering engine. So I'm not sure it makes sense for Mozilla to dedicate the kind of resources to it to implement all the features I might want, and I don't have a lot of gripes. But as a datapoint in this thread, zoom is really important to me, and I miss it when it's not available. I shake my head every time I visit Google search results on my iPad because the text is so tiny.
  - Saint_Genet 3 years ago
    It says so in the article
  - bradlys 3 years ago
    I've had this happen on iOS Safari. It happens everywhere.
    - Reason077 3 years ago
      Weird. I don’t see this, or maybe I’m misunderstanding the problem. Do you have an example site?
- mc4ndr3 3 years ago
  Many websites have this problem with their main navigation bar.
- tomrod 3 years ago
  Wikipedia comes to mind for this!
- ruined 3 years ago
  that's accessibility
sph 3 years ago
My pet theory: I'm pretty sure this is because when HTML5 became a thing, some major tech blog showed us what an HTML5 page would look like (simplified doctype, meta charset) and they included the viewport settings that disabled zoom.
Then pretty much everyone copied from these guides, and here we are. I remember I had used HTML5 skeleton templates for a while before I learned that the "maximum-scale=1, user-scalable=no" they came with is not a good idea.
- _fat_santa 3 years ago
  Almost all major template for JS frameworks these days include that line. And there are tons of guides that specify adding that in.
  I get why it's there, if you're building a PWA that is supposed to mimick a mobile app, you have to enable that to override some annoying mobile browser behaviors like zooming on an input.
  The problem is that the above scenario is about the only time you would want to set the viewport in that way. Yet because the line gets included in boilerplates to make it easier to make PWA's, it ends up in a ton of stuff that definitely is not a PWA and should not have that.
  - toper-centage 3 years ago
    Fun fact: the reason why browsers sometimes zoom in on an input is because the input's font size is too small, less than 16px, which is considered not accessible. So it's ironic that to counter that behaviour some people make the page even less accessible by disabling use zoom.
    - account42 3 years ago
      To be fair, I don't think the current implementation of auto-zoom, at least in mobile Firefox, actually makes things more accessible. The zoom it choose is ridiculous so you lose all context (and often can't even see the whole input element) and the screen constantly jumps around when filling out a form.
  - cnity 3 years ago
    Interesting. I've seen the meta tag for the viewport for PWAs, but they don't usually prevent zooming. Most commonly I've seen:
    <meta name="viewport" content="width=device-width, initial-scale=1">
    Do you have links to examples of the major templates?
    - banana_giraffe 3 years ago
      I assume it's something some "website builder" site like wix.com does. For instance, wix.com itself shows "user-scalable=no" in the viewport meta tag if your user-agent is from an iPhone.
  - kijin 3 years ago
    > override some annoying mobile browser behaviors like zooming on an input.
    Yep, I've seen some people disable zoom in their webpages specifically to prevent Safari from auto-zooming all over the place as the user moves from this to that input. It gets really annoying if you have anything but the simplest form. And what webpage doesn't have at least one form on it, even just the search box?
    I fully agree with OP that disabling zoom is wrong. I also think it's wrong for browsers to mess with the zoom level without the user's instruction.
    Almost every weird workaround we still have today in webdev was originally written to compensate for inconsistent browser implementation of some standard. In the past, IE was the one that always did something weird. Now it's Safari. Until browsers stop trying to pretend that they know better than both the developer and the user, somebody somewhere will keep writing these workarounds that then stick around in boilerplates and tutorials for years.
    - freebreakfast 3 years ago
      > Until browsers stop trying to pretend that they know better than both the developer and the user
      I don't think browsers or users are really the problem. Browsers are paving cattle paths. Users are stuck with what they get.
      Developers on the other hand. They're the ones who insist on using a document markup language to describe and build user interfaces.
    - merrywhether 3 years ago
      Safari only zooms if your input text is too small (less than 16px). The answer to defeating autozoom is to not make inputs that many people would need to zoom manually.
  - lelandfe 3 years ago
    Call me highly skeptical. I have not personally seen disabling zoom recommended in a very long time.
    - rchaud 3 years ago
      The thing with defaults is that they don't have to be recommended.
  - FinalBriefing 3 years ago
    That's not true. They might include the tag, but I haven't seen one disable zooming by default.
    - madeofpalk 3 years ago
      A lot of this is because iPhone just no longer obeys the user-scalable tag any more, precisely because of this.
- floatrock 3 years ago
  Classic Hanlon's razor "never attribute to malice that which is adequately explained by ignorance"
  Copy-pasting a template and just not being aware of accessibility and functionality requirements is most likely explanation here. Or devs being given 4k UHD monitors and never looking at their work on a small laptop.
  - tragictrash 3 years ago
    It doesn't matter the intentions, only the outcome. Hanlon's razor doesn't apply here.
- IMSAI8080 3 years ago
  In the late 90s and early 2000s every second bank round these parts decided to do their entire website in Flash. Not just some animations and videos, but I mean the actual entire content of the site was Flash, no HTML. As well as being basically unusable search engines wouldn't index it either so you couldn't find anything.
  - jandrese 3 years ago
    Also fun was being deep in one of those "rewrite the web browser in Flash" pages and realizing you made a mistake so you hit the back button and lose all of your progress as the whole page is unloaded. Sometimes I look at web frameworks and think that these developers are nostalgic for the days of Flash.
  - Sxubas 3 years ago
    Sounds so dystopic, I glad I was not old enough to use online banking back then
- pvorb 3 years ago
  I can confirm that theory. I wrote my own HTML5 template for my blog when HTML5 was pretty fresh. I don't recall where I exactly got the boilerplate from. I thought it might have been html5boilerplate.com, but I just checked the v1.0 tag and that doesn't prevent zooming in. But I definitely took the tag from someone and just applied it without knowing what it does.
- javchz 3 years ago
  Yeah, and in those days there were an obsession to make websites to look as much as possible as native apps. Zoom included.
efitz 3 years ago
If we want a free and open internet, why is the current web designed to let server owners control our experience? This leads to accessibility fails like the inability for visually challenged people to control font size or contrast, but also leads to lots of other bad effects, like the fact that my browser gets more and more bloated every year and essentially has become a tool to let other people run programs (javascript and wasm) on my computer, and display content that they want (ads, etc.) rather than content that I want.
I really want an internet where servers provide structured content, but where I control my user experience.
- danuker 3 years ago
  > why is the current web designed to let server owners control our experience?
  Because the most popular web browsers ARE created by some of the largest server owners (i.e. Google).
  To address this, make sure your site works with simple browsers, like Links and lynx.
- krapp 3 years ago
  >If we want a free and open internet, why is the current web designed to let server owners control our experience?
  Because server owners have the freedom to publish whatever they like (within the bounds of the law) and design their sites however they wish. An internet on which servers are only allowed to provide "structured content" would be significantly less free and open.
  You may be interested in the Gemini Protocol[0], on which sites are built according to that general principle.
  [0]https://gemini.circumlunar.space/
  - barnabee 3 years ago
    They can send whatever data they like but they have no right of control over what I do with it or how it’s rendered. Browsers would be better if they prioritised user preferences over website designers.
    - krapp 3 years ago
      >Browsers would be better if they prioritised user preferences over website designers.
      The vast majority of users would prefer not to have to write an entire layout and stylesheet for each site they visit, nor would they consider having all sites conform to a single layout or style to be of any value. It's only very small minority of people (probably exclusive to HN) who would prefer the web was nothing more than JSON or raw bitstreams.
      But again - geminispace works the way you want. Gemtext doesn't use stylesheets and only has very basic markup. Everything is dictated and controlled by the browser. And the protocol is specifically designed such that writing a client for it is easy.
Sohcahtoa82 3 years ago
Don't disable zoom, and stop fucking with scrolling.
Browser scrolling works fine. You don't need to try to re-implement smooth scrolling, it never works and makes my scrolling bounce around like mad.
One website override my scrolling speed entirely. I like it so that 1 click = 2 lines of scrolling. That site changed it to that 1 click = 1/2 line, but for some reason the web dev thought they knew better than my preferences.
- commandlinefan 3 years ago
  It drives me crazy when I try to scroll up to re-read something and the header pops up and covers what I was trying to scroll to.
Ansil849 3 years ago
I don't understand why the functionality exists for websites to dictate how users can and cannot view a page in the first place. This is like if you were reading a book that detected if you were trying to use a magnifying glass and immediately caused a glare to appear to prevent you from being able to read it. It is fucked up.
- paulmd 3 years ago
  There was a fundamental shift about 15 years ago where webpages ceased to be markup documents (perhaps with some active elements for convenience) and became javascript applications that ran in your web browser.
  To use your book analogy - the web is no longer a bunch of books on a shelf, it's an AR device that shoots lasers into your eye. The net effect may be the same in many use-cases, but not necessarily, and malicious actors now have far more flexibility and power because we've all become accustomed to running random code we download off the internet with a single click.
  I am, obviously, not a huge fan of this shift and think a large majority of sites could operate perfectly well under the "markup document" model without needing actual code-execution privileges, or more than a minimal set of code-execution privileges for those actual simple document-related use-cases. Go back to being mostly just a book, basically.
  Almost all of the use-cases that javascript gets used for in a document context could really be replaced by navigation between sets of linked, static pages (perhaps embedded where needed) - boy, what an idea. If you delivered a site "as a gzip" then there should barely be any noticeable size difference from that anyway, especially compared to downloading mountains of JS embeds.
  The amount of things that truly, truly need interactivity is pretty low - things like chat clients come to mind, but does your bank need to be running javascript on your end? Probably not.
- detritus 3 years ago
  You don't understand why someone would want to create something the way they want to, really?
  How much choice do you have in the typesetting of any book you've ever bought?
  You could still use a magnifying glass on your monitor, as some Russian General was photographed doing recently... .
  .
  Obviously I think the choice to disable zoom, etc, is daft, but ultimately that is the creator's right to call, advisedly or otherwise.
  - ryandrake 3 years ago
    The choice to allow zoom, or scrolling, or window resizing, or even fonts and colors... basically anything that affects my web browsing experience, should belong to me as the user, not some web site developer 1,000 miles away from me. Browsers have taken way too much control from the user (or hidden it in Settings menus) and handed the controls over to web designers. Browsers have a setting to take back this zoom control, but really it shouldn't be a setting--it should be the default. The web developer should not have the ability to disable a feature of my browser any more than he should be able to reboot my machine.
  - Mordisquitos 3 years ago
    I don't understand this argument. Leaving aside the fact that the examples provided in the link are hardly works of art, the "creator" has already created something the way they wanted to, as has every other website designer. And just like there would be no good reason for an editor to stop me from using a magnifying glass on a book that I bought, nor from writing notes in the pages or highlight parts of the text (advisedly or not), neither does anything justify disabling zoom.
    For whatever reason, my Firefox was already ignoring these artificial restrictions intended by the creators, and I was able to zoom as normal. Does that affect the creators of these websites in any way whatsoever?
  - Ansil849 3 years ago
    It is the creator's right to dictate the original presentation, but it is not the creator's right to dictate a user's behavior. Just like it is a filmmaker's right to set the default framerate and playback speed for a film, but you can rewind or fastforward, or play the film at X speed if you so wish in your media player.
    Disabling or otherwise inhibiting user behavior is not a creator's right.
    - detritus 3 years ago
      Well, I don't believe it's not their right, but I am otherwise in agreement with you - it's daft to block such functionality.
      Ultimately, that's the creator's mistake to make and it's incumbent upon the end-user to read the content as they can, if they must.
      I'm not sure why people believe they have a right to dictate how someone else's content is created.
      I guess I'm more talking about individuals here, not organisations, but I think the problem lies more in individual's websites.
electroly 3 years ago
In the old days you needed to disable zoom in order to get click events immediately, rather than delayed a bit so it can tell whether it's really going to be a zoom operation. Is that still true?
- madhato 3 years ago
  No longer needed. From https://webkit.org/blog/7367/new-interaction-behaviors-in-io...
  1. There must be a meta tag of type viewport 2. The viewport must be defined to have width=device-width 3. The content must be at a scale of 1
- bennyp101 3 years ago
  Yea, still a 2-300ms delay, which is why I guess a lot of devs just disable zoom - that way they get that "instant native app" feel without actually having to think about it :)
  Edit: Having just tried the sites in the Safari ... they zoom in just fine with that set, so .. Im a bit confused
- nicoburns 3 years ago
  There's now a specific CSS property for this which I believes disables specifically double tap to zoom (while leaving pinch-to-zoom working).
rootusrootus 3 years ago
100% agree. I'd like to be able to tell mobile Safari to just ignore that setting. Maybe there's a way and I missed it. Wouldn't be surprised, these old eyeballs aren't what they used to be and that exactly why I want zoom to always work. Some of us actually need it.
Heck, back when I bought my mother her first iPad, this was the whole reason. She was getting eye surgery and wouldn't be able to see well, and would be stuck face-down for a couple weeks. I figured an iPad would be good, because she could pinch-zoom so the letters were two inches tall if necessary. It was a roaring success, but zoom=false defeats that.
- sorahn 3 years ago
  > I'd like to be able to tell mobile Safari to just ignore that setting
  Mobile Safari does ignore this setting. You have to go out of your way with stopping touch events on mobile safari to prevent zooming.
  Sometimes this is problematic for sites using "small" (< 16px) fonts for input fields because that will cause mobile safari to zoom in to show the input field whether you want it to or not.
- c-fe 3 years ago
  Im on mobile safari on an iphone and i can zoom on all the pages where you are not supposed to zoom
bluesmoon 3 years ago
> I don't know whether this is a trend
I posted this 11 years ago: https://tech.bluesmoon.info/2011/01/device-width-and-how-not...
It's not a trend, it's been around as long as it's been possible. Site owners dislike letting their users have control.
rhema 3 years ago
My mother-in-law has severe eye problems and MS type symptoms. 16 years ago, I showed her how ctrl shift +/- could make her fonts huge. This one tip that is not obvious to most folks improved and continue to improve her quality of life _drastically_.
- mc4ndr3 3 years ago
  Increase at OS level, instead of having to repeat this step manually for every app and website.
  - account42 3 years ago
    These days, setting a higher DPI system-wide is the best solution. In 2006 it probably was not.
alex3305 3 years ago
Thank you! As a visually impaired user, disabling zoom is just incredibly stupid, except for a few edge cases such as games.
As per theories in this thread why this meta tag is so popular. I know a few UX designers who explicitly asked the web developers (also me) to disable zoom so that there precious design could not be broken by users. I simply refuse to do so.
- Enginerrrd 3 years ago
  >I simply refuse to do so.
  Doing God's work.
es7 3 years ago
If you leave zoom enabled on mobile, then the browser tries to handle double-tap-to-zoom, which adds a surprisingly large delay to all taps while it waits to see if there is a second tap coming. This makes websites feel sluggish and unresponsive.
Is there a good way to get lightning-fast response times to tap events without disabling zoom in 2022?
- eyelidlessness 3 years ago
  CSS one liner:
```
  a, button, .etc { touch-action: manipulation; }
```
- aeternum 3 years ago
  Yes, this is really why most mobile sites disable it (at least it's the primary reason I do).
  Latency matters a lot and everyone taps, not everyone zooms.
err4nt 3 years ago
It should be fairly straightforward (1 line of JavaScript required to actually get the job done) to make a user-script, or even a browser extension that obliterates any offending `<meta>` tag like this. Something like:
```
    document.querySelectorAll('meta[name="viewport"][content*="user-scalable=no"]').forEach(tag => tag.remove())
```
And if you wanted to get really fancy, you could use window.setInterval or a Mutation Observer to watch for any dynamically generated `<meta>` tags and continue to remove them forever if they every show up.
While it's not ideal to have to use a snippet or an extension, you could fix this for yourself (or individual web users) in a way that 'fixed' literally every site on the internet for that person. So I wonder if that's a viable route to a solution!
- account42 3 years ago
  Wouldn't this remove the meta tag entirely and thus completely disable responsive rendering on mobile browsers, reverting to emulating a larger viewport.
  - err4nt 3 years ago
    This particular snippet would remove it entirely - if instead you had a default value you'd like to always apply to a tag if it's found, the code would be equivalently simple but just a little different.
chunkyks 3 years ago
But then the website might not look like the designer's glistening perfect vision, that only ever worked properly in their browser on their desktop in the first place.
- MrBuddyCasino 3 years ago
  The reason this is done is to get rid of extra latency when processing user input. I guess detecting zoom gestures needs some time to distinguish them from normal clicks?
  - _jal 3 years ago
    I wonder if it helps them detect when I leave and go search for something that works.
  - chunkyks 3 years ago
    Presuming you are correct:
    * Some number of people are sensitive to latency
    * Some people are unable to read my website
    You're gambling that there are more people who would walk away due to latency, than there are who would walk away due to being unable to interact with your site at all.
    Personally I suspect that to be a poor tradeoff.
    - iamsaitam 3 years ago
      Everyone will be affected by the latency vs a few will be affected by the lack of accessibility. This is what your tradeoff is.
godot 3 years ago
"width=device-width, initial-scale=1, user-scalable=no" seems like basically a setting that some tutorial had once posted many years ago, and all responsive sites just blindly took it as gospel; because it was supposed to give you one unified view for your site on mobile.
Understandably, back in the days (and maybe still the case now) the default behavior for web browsers on mobile were to load the same desktop site but zoomed out -- it wasn't a great experience, so devs looked for a way to avoid it.
I think it's fine to build a mobile responsive site with "width=device-width, initial-scale=1" (that gives you a default view that is built for mobile) but there is little reasons to have "user-scalable=no".
tshaddox 3 years ago
Apple gets a lot of criticism for its alleged hostility towards developers. I agree with some of that criticism! But this is a perfect example of Apple taking the side of the user when developers are hostile towards users. I’ve only used iPhones for years and I didn’t even realize this was still a problem for smartphone users!
- manderley 3 years ago
  You can force-enable zoom in pretty much all browsers, it's part of the accessibility settings. You don't need an Iphone.
  - Handytinge 3 years ago
    No, but the point was that they didn't even realise the issue existed, as iOS has this as a default behaviour.
    Reading the article I was surprised to hear of the issue and could not replicate. I am capable of finding the relevant setting in Android I'm sure, but many older and tech illiterate people in my life (who are more likely to need zoom) I think would struggle.
zwieback 3 years ago
Yes, please, I'm sad every time my 55+ year old eyes can't decipher something. Especially when I'm hands-free riding my bike on a sunny day.
0des 3 years ago
Sites that make the video port smaller when you zoom in... I hope you get whats coming to you.
- Enginerrrd 3 years ago
  Oh my, yes...
madhato 3 years ago
I once had a meeting were 3 coworkers and the CEO were all advocating for disabling zoom because, "other sites do it". I argued that it doesn't hurt anything to leave it enabled and refused to disable it. 3 months later Apple removed disabling zoom from Safari and I felt validated.
greggman3 3 years ago
I don't disable zoom but I'm sympathetic that mobile browsers SUCK at it.
here's a very simple SPA like page
https://decisive-spiral-blue.glitch.me
It's just an upper and lower vertical flexbox. fixed size toolbar on top, the rest is a textarea. Click in the text area. type "A"<enter>, "B"<enter>, "C"<enter> etc... and watch the cursor disappear below the virtual keyboard. WTF!
I've seen other issues where the browser auto-zooms when clicking in a textarea and while they are trying to be helpful they actually make the site practically unusable. Both because info the user needed is now offscreen and because finishing the input doesn't auto-unzoom so the user is left having to manually adjust to see the page again.
And then, there are random rules (like if the text is larger than 16px it might not auto-zoom). Might. AFAIK there is no spec that says "hey, don't auto-zoom" so your left with random hacks to try to make the site usable. (of course if the user wants to zoom that's fine)
The point is, the mobile browsing experience sucks by default and devs do the best they can to try to work around how much it sucks. They choose wrong but they wouldn't be reaching for solutions if the default experience wasn't so bad in the first place.
I'd personally like to be able to opt in to a mode where when the virtual keyboard appears the browser's size changes and I can fix my layout for the new available size via CSS media queries.
culturedsystems 3 years ago
"Safari seems to ignore maximum-scale=1 and user-scalable=no"
This is somewhat ironic because, if memory serves, the original reason people started adding this to their HTML was because of some dubious scaling behaviour on iOS Safari (I think, if you didn't disable zooming, Safari responded to rotation by zooming the page to fill the new width, rather than laying out the page again).
neya 3 years ago
My first reaction was "Who in their right mind would ask users to stop disabling zoo..oh wait, you meant THAT zoom" :))
Had a chuckle.
- _fat_santa 3 years ago
  HR: "Hey Santa can you please disable Zoom, don't want you getting distracted with meetings"
  Me: "ABSOLUTLEY!"
- GekkePrutser 3 years ago
  We still block it at work due to the many security concerns with it. So I thought this too
julianlam 3 years ago
We used to disable zoom, out of a sense of "our site doesn't need you to zoom", and partially because of cargo culting. Everybody just pasted the same meta tag everywhere.
In the end, it's nobody's business but their own whether they zoom or not, so why would I disable it?
We re-enabled zoom.
rmetzler 3 years ago
While we are at it: please stop changing the right mouse button in my browser. I‘m looking at you MS Teams. If you want to have context menus in your app, that’s ok, but please don’t put them in the browser. You break important use cases for me and other people.
- jeroenhd 3 years ago
  Firefox has an override for that, shift+right mouse should ignore the click handlers and show the browser context menu. This is something I really miss in other browsers, especially the ones that decide that they know better than me about how things like copy/paste are supposed to work.
  - tomcatfish 3 years ago
    I have never heard this before. Is there more stuff like this?
    Note: I can't test this right now because I don't have any sites that do this particular bad thing
    - jeroenhd 3 years ago
      This website [1] (actually, its codepen [2]) has a demo and even describes all the user-hostile reasons why developers might want to disable the right click menu.
      There are some other accessibility tricks that Firefox advertises [3] like ignoring website font and color choices.
      Firefox also has native support for overriding website CSS [5] but "modern" websites often come with impossible to understand DOM and CSS structures (if they even use CSS and not just forcefully insert style into the DOM directly because separation of concerns is for losers I guess).
      Then there are websites like Github and some shitty forum software that insist on hijacking keyboard shortcuts like Ctrl+F and Ctrl+K. You can go into about:config and set permissions.default.shortcuts to 2 (Services.perms.DENY_ACTION) to block websites from overriding shortcut settings by default. You can go into the site settings and manually enable them again by going to page info (ctrl+i), then tabbing over to permissions, and changing the value for "override keyboard shortcuts" from "default" to "allow". Or, you could simply block the websites that offend you from that screen without changing the default.
      [1]: https://www.codeinwp.com/snippets/disable-right-click-contex...
      [2]: https://codepen.io/impressivewebs/embed/zYYxepW?height=265&t...
      [3]: https://support.mozilla.org/en-US/kb/accessibility-features-...
      [4]: https://superuser.com/questions/318912/how-can-i-override-th...
dandigangi 3 years ago
Wild that people argue against a11y and usability. I'm sure there is some cases where it doesn't matter but for the rest, hard requirement. At DocuSign it would put us out of compliance if I'm not mistaken.
mamoriamohit 3 years ago
It's specially painful when the zoom is disabled, and then a pop up comes up with a teeny tiny X close button.
I agree I have fat fingers but 8 our of 10 times, I end up opening up the ad. :(
knorker 3 years ago
Also stop messing with scroll.
Absolutely everything that isn't default browser zoom is broken. It's the wrong speed, or cuts at the wrong place. Basically it's always surprising in an annoying way.
Then there's the "frustratingly slow scroll to navigate". E.g. go to https://cloud.google.com/compute/all-pricing and click on the last nav on the left.
3 years ago
gernb 3 years ago
It's not just websites. Youtube Music's app uses too small of a font on iPad and changing the system font size under accessability doesn't change the font size in the app (well, it changes a few headlines but leaves everything thing else too small for my eyes)
AND of course it doesn't support zoom because almost no native apps support zoom. (Why do they get a pass?)
login01 3 years ago
Could you add the watts, voltage & amperage, to each of the standards? https://en.wikipedia.org/wiki/USB.
USB Power Delivery Rev. 1.0 (V. 1.0) 2012-07-05 100 W (20 V, 5 A) USB Power Delivery Rev. 1.0 (V. 1.3) 2014-03-11 100 W (20 V, 5 A) USB Power Delivery Rev. 2.0 (V. 1.0) 2014-08-11 100 W (20 V, 5 A) USB Power Delivery Rev. 2.0 (V. 1.1) 2015-05-07 100 W (20 V, 5 A) USB Power Delivery Rev. 2.0 (V. 1.2) 2016-03-25 100 W (20 V, 5 A) USB Power Delivery Rev. 2.0 (V. 1.3) 2017-01-12 100 W (20 V, 5 A) USB Power Delivery Rev. 3.0 (V. 1.1) 2017-01-12 100 W (20 V, 5 A) USB Power Delivery Rev. 3.0 (V. 1.2) 2018-06-21 100 W (20 V, 5 A) USB Power Delivery Rev. 3.0 (V. 2.0) 2019-08-29 100 W (20 V, 5 A) USB Power Delivery Rev. 3.1 (V. 1.0) 2021-05-24 240 W (48 V, 5 A) USB Power Delivery Rev. 3.1 (V. 1.1) 2021-07-06 240 W (48 V, 5 A) USB Power Delivery Rev. 3.1 (V. 1.2) 2021-10-26 240 W (48 V, 5 A)
- lsaferite 3 years ago
  I feel like this comment is on the wrong thread maybe?
jhugo 3 years ago
IMO, all browsers should ignore these attributes. The browser is a tool of the user, not the website designer.
synthecypher 3 years ago
Not sure why this became a trend my guess is back when everyone was trying to update their website to support mobile devices, they want to deliver an 'app-like' experience and as native apps don't let you pinch zoom the native UI wherever you like and mobile sites followed suit.
I guess the issue now is it has become part of the cargo cult with people including these meta tags in their base templates without knowing what it does and failing to implement a suitable layout for all mobile device screen sizes and DPIs.
https://github.com/h5bp/html5-boilerplate/blob/main/src/inde...
realstacktrace 3 years ago
Who else read "zoom" and thought "Zoom"?
- hedora 3 years ago
  As, in "what does it mean to disable it, and how do I?"
  Some corporate training long ago had "I can't see videos" and "I can't hear things" toggles that were not mutually exclusive.
  If you set it to "Hellen Keller mode", you could just read the training at your own pace. It was glorious.
  Thank you, accessiblity advocates!
Anaminus 3 years ago
Vision: Game Boy Advance-sized website.
Problem: Very tiny.
Solution: Scale to viewport in integer increments.
Result: https://anaminus.github.io/
This disables zoom. In fact, it actively fights the zoom level to always fit the viewport. Have I committed a great sin?
- NDizzle 3 years ago
  Not sure what you're going for, but this probably isn't it.
  https://imgur.com/a/Kgktbvs
- Jaruzel 3 years ago
  Love it.
  To be honest, It makes me recall painful WAP[1] browsing on an old Nokia phone.
  ---
  [1] https://en.wikipedia.org/wiki/Wireless_Application_Protocol
- account42 3 years ago
  > This disables zoom. In fact, it actively fights the zoom level to always fit the viewport. Have I committed a great sin?
  Yes. Scaling to the screen size is fine, overriding the users's attempt at zooming in is not.
- akavi 3 years ago
  It's not scaled to the viewport for me. It's centered in the middle of it, but still tiny.
  - Anaminus 3 years ago
    I figured this would happen. I've also committed the even greater sin of testing in only one environment (my own). I guess we don't quite live in the future yet.
nicbou 3 years ago
Yes! I have good eyesight but still frequently zoom for various reasons. The main one is small images and diagrams on responsive websites. Another is clicking small clustered links.
In the same vein, if you use images on your responsive website, consider linking to the full size version.
- tombert 3 years ago
  I have decent eyesight post-LASIK, but I have a lot of trouble reading small text. I almost always read books in large-print if it's available, and the Kindle has been a godsend for this particular reason. I've been tested for dyslexia and I don't have it, I just have a weird brain that has trouble with small text.
  95% of the time this is a complete non-issue for me, since my monitor (for home and work) is a 50" 4k TV and I just abuse the zoom-in feature in Firefox and I'm good, but when the site actively disables zooming, it feels like an almost directed attack towards people like me: Tombert need not read this website.
  - nicbou 3 years ago
    Hey, this is an issue I'd like to work on. My eyesight is good but not as good as before, and it made me reconsider my font and contrast choices on allaboutberlin.com. I find myself zooming a lot more too.
    Can you tell me what you think of the font sizes? Is it readable enough? Is there room for improvement?
    - tombert 3 years ago
      I'll say that that it's fairly readable immediately, but I did find myself zooming to 170% in Firefox.
      I'm not a designer but I don't think it looks terrible at that percentage, and I personally found it a bit more readable.
- imglorp 3 years ago
  What's really weird is how some sites go out of their way to do this. IG for example, even on desktop, presents a fixed size image and prevents right-click operations on the image. Meanwhile, the full resolution image is actually available if you know how your browser works. Another example is video controls like scrub and speed being unavailable.
  I would buy this if they downscaled everything before storing it; that would actually make sense. But it seems like they just want to "curate" your "experience"?
  - kps 3 years ago
    > prevents right-click operations
    In Firefox, Shift-right always presents the browser context menu. It's one of the few distinguishing features they haven't screwed up yet.
aikinai 3 years ago
StopTheMadness[0] is a great Mobile Safari extension to help you take back control of your browser. It offers tons of great user-first overrides, but one of them is “Protect zoom.” It’s in the “Use with caution” section of the options, so I assume there are negative consequences though.
After installing this, I’ve had a much better experience with the web on iPhone and iPad. And I less often have to switch to a laptop to get around some user-hostile site.
[0] https://apps.apple.com/us/app/stopthemadness-mobile/id158308...
neoyagami 3 years ago
Oh god. this, yes please, I got a mild sight disability and the zoom helps doing my work fast, the amount of times zoom was disabled it was just awfull, and in some cases parts of the site (ex: big tables) cannot be read properly.
NDizzle 3 years ago
I just changed the daily life of one of my mechanics. They use Napa Parts Trails (or something along those lines) and when he clicked into something, it pops up a tab without any controls and they had no idea how to adjust the text size. Because it removes all the controls. New laptop, super high DPI, super tiny characters in a shop environment.
I taught him the nearly universal ctrl mouse wheel hotkey combo so that he can scale things, and then proceeded to adjust about a half dozen different areas in the various applications he uses for managing jobs and ordering parts.
egberts1 3 years ago
As a disabled person, I totally recoiled and revulsed at the OP’s audacity and emboldeness to demand how other should behave toward him.
I would never pull someone down to sit down to my eye level if in a wheelchair, never.
I would never pull someone closer to me so I can read lips better.
And certainly I would never remotely pull them to something that I want, as in this case, digital remote camera.
However, it is a courtesy to ask them to adjust for your sake. And only a courtesy.
This OP dude needs a proverbial slap across the face.
Just ask, curtly and nicely.
- zachflower 3 years ago
  I'm so sorry, I'm not 100% sure I understand this comment.
  Would you mind explaining what you mean by asking others to adjust for your sake in the context of mobile web accessibility? I'm having trouble connecting it to the content of the article. I'm not the writer, but would love to better understand your point of view here.
  - egberts1 3 years ago
    Ah, remote zooming is being given in a different context.
    I had thought it was about allowing other people to play with the gimbal and focus and that kind of “zoom” … of a remote camera variety. My bad.
    Still, asking others to adjust is a nice thing. Demanding to do things on their end, not so much.
    - zachflower 3 years ago
      Ah, I see. Thanks for clarifying!
PaulHoule 3 years ago
There's got to be some theory to balance aesthetics and readability.
I used to get into terrible arguments with a business partner about every web page I made. He'd say "the text is too big" or "the text is too small" and I'd point out that you shouldn't ever complain about that because you can use Ctrl + and Ctrl -.
I am thinking about UIs that work across desktop and mobile and would love to make peace with the scaling issues once and for all.
bhdzllr 3 years ago
Maybe a lot of people did this to prevent Safari on iPhone to zoom in when an input field gets focus.
But if I remember correctly the correct way to prevent this was to set the font-size of the input field to at least 16px.
EDIT: More infos: https://stackoverflow.com/questions/2989263/disable-auto-zoo...
renewiltord 3 years ago
Looks like a user agent concern.
- falcolas 3 years ago
  Defaults matter. Always have. And if there's one thing everyone is guaranteed to lose as they age, it's eyesight.
- emteycz 3 years ago
  No. Sometimes it's good to disable zoom (e. g. in web apps that function as a big canvas, like Figma). Pages should use the feature correctly. People shouldn't have to fiddle with browser settings just because someone can't CSS properly.
  - _moof 3 years ago
    If there's one thing that's true about web design, it's that pages won't use the feature correctly, no matter what the feature is.
  - runnerup 3 years ago
    I agree with the grandparent. While I believe it’s irresponsible for web developers to inappropriately lock zoom…I also believe it’s grossly irresponsible for the browser to not provide an override for this.
    One of the worst offenses for me is when the website dynamically resizes everything so that zoom “works” but a split second later everything goes back the way it was. I would also like browsers to have a quick/accessible workaround for that behavior too.
  - bartread 3 years ago
    I think this is where I have to point out that 50% of people who CSS are worse than average at CSS, depending upon exactly how you define "average". You're absolutely right: pages should use the feature correctly, but some won't (because of my previous point or, much less frequently, out of sheer stubbornness/malice/whatever), so I'm extremely glad that browsers offer a workaround via settings for situations where that's the case.
  - renewiltord 3 years ago
    I am convinced. I wish per-site zoom controls would show up as a setting somewhere in the browser chrome because I think that would make this a non-issue, but the differentiation is valuable since some sites should block zoom. Okay.
  - jhugo 3 years ago
    The user is zooming because what they see is not legible to them. If Figma can't work out how to handle that, that's Figma's failing.
    - emteycz 3 years ago
      Figma does it correctly, that's the point (they have custom zooming logic) - if user has to fiddle with their zoom-lock settings because of other pages, then pages like Figma which use the feature correctly and for the intended purpose will stop working.
  - 3 years ago
- jhugo 3 years ago
  To be fair, if those attributes had never been standardised it wouldn't need to be a user agent concern. But I agree, all browsers should follow Safari's lead and ignore them.
shahmeern 3 years ago
I actually prefer it when sites have zoom disabled on mobile. It's very jarring having the entire viewport zoom in on input elements on focus.
- Mordisquitos 3 years ago
  The simple solution for that would be for mobile browsers to provide an quick toggle to disable zoom.
  - account42 3 years ago
    Or to just not have crappy autozoom on input elements in the first place.
- jhugo 3 years ago
  minor inconvenience for you vs. completely unusable for others
zajio1am 3 years ago
There are plenty of evidently anti-user features like disabling zoom, disabling selection and so, i wonder why say Firefox even supports them.
nathias 3 years ago
> This can have serious negative consequences for people with low vision, elderly people and pretty much anyone who has to or wants to zoom in.
I disable it because there are bugs on mobile browsers where inputs can automatically hijack zoom and the default behavior really messes up the workflow. But yea you have to reimplement or replace it with a flow for your use case.
r00fus 3 years ago
I have setup for myself and my parents that all mobile Safari sites automatically go to reader mode. Reader mode does not prevent zoom, copying, etc.
It's just one click to remove it for form-based websites (a few steps to whitelist if you're going to use that web form a lot), but the readability for the vast majority of websites is drastically improved.
hedora 3 years ago
Ironically, the custom styling on the code snippets prevents them from fitting on my screen at any zoom level.
emptyparadise 3 years ago
I love websites which also set element scaling using vw and vh in addition to the tricks described in the article, meaning that not only pinch-zoom doesn't work, even the good old ctrl-scroll does nothing. It gets even funnier if your screen size is larger than a MacBook's.
noveltyaccount 3 years ago
1000% agree, one of my biggest pet peeves. Glad the article shares the (user-side) solution: force enable zoom in accessibility.
One of my other pet peeves is web sites that shrink the default text size. Why??? I set my browser and OS to a text size that is useable for me, please defer to me, your user.
Thanks muchly.
IE6 3 years ago
Sort of related - I like the way ChromeOS handles gesture zoom - it just zooms in the screen so everything is enlarged including Chrome OS UI elements. Then the browser can do its own zooming and finally the OS has a zoom level. Best of all worlds IMHO.
agust 3 years ago
What's the rational for not wanting websites and web apps to disable zoom, and not complaining about all native apps doing it?
Would these people want to be able to zoom in native apps as well? Or is there a reason it's fine in native apps but not on the web?
- dr_kiszonka 3 years ago
  I am not the author, but in native apps you can at least increase font size via system settings.
  - agust 3 years ago
    Yes, so I think advocating for a general solution for websites and web apps to either be able to respect OS font size settings, or to provide users with the possibility to adjust font size would be preferable I think.
    There are very legitimate and valid reasons to disable page zooming: it can break layout, it can be triggered accidentally causing usability issues because content then overflows, and it is a poor solution to increase text readability as you often then have to scroll to read a full line of text.
    Not allowing to do it is not the solution.
- pjerem 3 years ago
  You threw web apps and web sites in the same bucket. The problem is just that : websites are not apps and should be zoomed as you wish.
  - agust 3 years ago
    And what distinguish them exactly...? And why would disabling zooming be fine for one but not the other?
    - pjerem 3 years ago
      > And what distinguish them exactly...?
      Web app = interactive application Website = readable content
      If needed you may disable zooming in your web app because it could break your application’s user interaction.
      You have no reason to disable zoom on any "content" page because the possible interactions are basically scrolling and clicking links.
- Semiapies 3 years ago
  "Not being a concern troll."
- iamsaitam 3 years ago
  Great question.
nonfamous 3 years ago
FWIW, I can zoom on all of the listed example sites using the pinch action on an iPad. (My eyesight is poor, and this is something I do often to read small text.) Is this something that’s dependent on the browser?
- LegionMammal978 3 years ago
  As this post mentions at the bottom, Safari ignores this and allows zoom on all websites, and Firefox and Chrome have opt-in settings to ignore this.
elipsey 3 years ago
>As a user, you can force allow zooming:
>In Firefox find the settings, select “Accessibility” and activate “Zoom on all website” >In Chrome find the settings, select “Accessibility” and check “Force enable zoom”
OMFG, thank you.
fitzroy 3 years ago
Also sites where zooming in slightly causes the elements on the page to explode into layout-less CSS soup and then zooming back out puts you at a completely different location on the page.
coding123 3 years ago
Browsers, please stop respecting this setting and allow zoom always.
endlessvoid94 3 years ago
This is often boilerplate code for component libraries such as bootstrap or tailwind. So it's not always intentional exactly, but a prerequisite to using off-the-shelf UI code.
soheil 3 years ago
First I thought this is Zoom the video conf software; please, stop using easily misinterpreted wording.
Then I realized on iOS since about 6 years ago disabling zoom via meta tags takes no effect and you can still zoom; please, stop being lazy and not do your research before complaining.
Finally I realize on android and desktop this is still an issue but maybe those sites have valid reasons like they want the page look exactly as they intended for aesthetics or even in some cases functional reasons; please, stop assuming developers are just lazy and obviously want to annoy people with disabilities.
Lifescape 3 years ago
Thanks for including at the bottom of the article how to force your browser to enable zoom. Didn't know you could do this!
evo_9 3 years ago
Even more fun on Windows Outlook keeps uninstalling the Zoom calendar plugin and replacing it with Teams. Fucking Microsoft.
arbol 3 years ago
Great tips. I've now enabled zoom in my accessibility settings in Brave. I've often been annoyed by lack of zoom
teilo 3 years ago
Current versions of Chrome do not even have an Accessibility section. The referenced setting is nowhere to be found.
neoCrimeLabs 3 years ago
Rather than trying to convince web developers, how possible is this to get the feature depreciated in browsers?
tbranyen 3 years ago
Totally agreed for mobile websites, with the exception for PWAs and mobile sites that rely on specific view ports being unchanged, like games for instance.
With no scrollbars it's hard to tell if something is zoomed in or not and you might be missing parts of the UI without noticing. Native apps don't zoom and neither should mobile sites pretending to be apps. Build accessibility into the UI.
humanwhosits 3 years ago
Why does the web browser allow this?
mdb31 3 years ago
I've never experienced any zoom problems (as opposed to Zoom problems...), and I just had a look at all the sites mentioned in TFA.
In all cases, I can zoom all elements (text, images, the works) just fine, up to 500%.
Firefox 100 on Windows. Is this just another one of those "Safari on IOS is broken, so the Web is broken" things, or is there more to it?
- qubitcoder 3 years ago
  No, this is actually "Safari on iOS" isn't broken, and allows the user to remain in control (thankfully).
  - mdb31 3 years ago
    I'm still confused. So, can you zoom any site on Safari on iOS or not? And if you can't, what definition of 'control' is that, again?
timtas 3 years ago
If I can't zoom in on photos, the site is broken.
UltraViolence 3 years ago
I have no problems using Ctrl+ on those sites with Firefox. What seems to be the problem?
- mmatuzo21 3 years ago
  Mobile!
mensetmanusman 3 years ago
I hate websites that don’t allow zoom, I have to screenshot and zoom on that…
hello_io 3 years ago
I’ve literally had to screenshot things so I could see them on my phone.
- dandigangi 3 years ago
  So annoying to do that :|
donarb 3 years ago
iOS has a nice magnifying glass, accessible using a three-finger tap to bring up and dismiss. The little white button at the bottom of the glass allows you to change the zoom value.
revskill 3 years ago
Lol, i thought this is the video streaming software Zoom.
bdeshi 3 years ago
another annoyance is links that open in new tabs. if i want to open a link in a new tab, i can do it myself, websites don't have to decide for me.
sidcool 3 years ago
TechCrunch does this on mobile and I hate it.
happythebob 3 years ago
Oof, an article about accessibility with a headline using the term "disabling."
I'm otherwise with the article, and also for old IT updating their terms.
lkxijlewlf 3 years ago
No "please", just STOP.
tifadg1 3 years ago
yeah, I know a thing or two about zooming in, having set HN to 190%.
On an unrelated note, why is HN text so small? I understand if it were a hunting site, where you're naturally supposed to use a scope, but for an IT forum that's unusual, given half of us wear glasses!
- jandrese 3 years ago
  It's easily readable on my display, but I'm not using one of those fancy HiDPI displays.
  The bigger problem is when posts are printed with a 50% grey font on top of a 25% grey background. Like it's such an obvious usability issue that I have no idea why the developer who set it up didn't have a little laugh at their own expense for the mistake the first time they saw it and then immediately went back and fixed it. Why it it still like this in 2022?
  - tifadg1 3 years ago
    not sure I qualify for hidpi - 1900x1200 on a 24". Also I never had issues regarding different shades. Hah just goes to show - hard to please everybody!
    - jandrese 3 years ago
      1900x1200 on 24" is definitely not HiDPI. That's 93.625 PPI. HiDPI generally starts at 200 PPI and goes up from there.
ivan888 3 years ago
Can we edit the title to be "Please, stop disabling zoom" so that it doesn't look like this is about the Zoom product
- eganist 3 years ago
  Would it be better to editorialize and say "Please, stop disabling pinch-to-zoom" instead? Or would that be too specific? I still thought it had to do with the Zoom product even with the case change.
- zachflower 3 years ago
  Good catch. Fixed!
  - ekanes 3 years ago
    It still absolutely sounds like the Zoom product. :)
    How about: "Please, stop preventing mobile users from using the zoom function"
moffkalast 3 years ago
- shreshthmohan 3 years ago
  A great way to annoy a big chunk of your site's users too. Classic dig own grave.
etaioinshrdlu 3 years ago
My web app is in some sense a Figma-like design tool. It has built-in zoom functionality that conflicts with browser zoom. I have to disable zoom in order to make the app usable. iOS in particular is pretty hostile to this.
There's another angle here, which is that being pro-browser zoom is anti-web application, and implicitly preferring native applications.
This is actually playing into Apple's hands of enforcing their walled garden and the Apple tax. They are neutering web apps intentionally.