-webkit-text-size-adjust is harmful about skeleton HOT 8 CLOSED

It's done to prevent mobile Safari from resizing when you change orientation from portrait to landscape. Not the best solution in terms of usability, but it's the most reliable.

from skeleton.

Well it basically renders the zoom feature useless and turns it into a tool of layout destruction. My vote is to disable this CSS, at least comment it out with a note about portrait/landscape orientation.

from skeleton.

AFAIK, -webkit-text-size-adjust:100% does not disable zooming. However, a value of none does.

from skeleton.

Right, Necolas hit the nail on the head. What does disable zooming is the meta tag in the head of Skeleton's HTML:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

This is to avoid the Safari scaling bug and while it is quite a consolation, for me it has been worth it to use until the issue is resolved. There are JS alternatives, but none that I have found to be reliable. Hope that addresses your concern and thanks for asking!

from skeleton.

I'd just accept the Safari scaling bug rather than disabling zooming by default. It's a crucial feature for people with not-great eyesight, which includes a lot of our parents! I don't think a base framework should ever knowingly introduce such significant usability problems, especially if people visiting the site are used to being able to zoom webpages.

from skeleton.

I know this is an old discussion, but I very much agree with @necolas that zooming is a crucial feature -- I often do it myself on my iphone (my vision isn't terrible, but it's not great either). A lot of people use this framework and I think it causes great harm on users that it is the default. It seems like you've made up your mind about this though, but at the very least could a comment be added in the source noting what the upsides and downsides of maximum-scale=1 are?

Thanks.

from skeleton.

On Mar 2, 2013, at 5:21 PM, Jordan Lev wrote:

I know this is an old discussion, but I very much agree with @necolas that zooming is a crucial feature -- I often do it myself on my iphone (my vision isn't terrible, but it's not great either). A lot of people use this framework and I think it causes great harm on users that it is the default. It seems like you've made up your mind about this though, but at the very least could a comment be added in the source noting what the upsides and downsides of maximum-scale=1 are?

Any time you make a "responsive" page, you need to set this so that the response can happen. If you allow zooming, then you also allow zooming out, which means that you end up seeing the "desktop" layout squeezed down really tiny rather than your nice responsive phone layout.

Walter

Thanks.

—
Reply to this email directly or view it on GitHub.

from skeleton.

Hi Walter,
I do not believe this is true -- just setting content="width=device-width, initial-scale=1" handles responsive designs appearing at the proper layout. The "maximum-scale=1" is the part that prevents zooming, and its purpose is to address issues when the orientation changes or a form field is entered -- but it has nothing to do with the appropriate responsive layout being displayed in the first place.

from skeleton.