-webkit-text-size-adjust

by graham

A while back the Webkit team introduced a (non spec as of writing) CSS property for adjusting the text size. This was to allow 'control [over] the text size that Safari on iOS uses when rendering a block of text', especially with double-tap zooming. By default this is set to none on the iPad and auto on all other iOS devices.

-webkit-text-size-adjust: none;

Now one use of this property is none. This prevents text being resized by anything, whether your zoom is set to text only or your fonts sized by ems. This is A Bad Thing.

Being able to override user preferences in such a way is the start of a slippery slope. It's a given that some people will have their computer or phone set up differently, which is why the majority of developers and designers create sites with flexible layouts. It's not just people who use assistive technology who are hampered by this property, a lot of short or long sighted people increase the resolution or default font size as small text (especially on similarly coloured backgrounds) can frequently be hard to read. Removing the ability to change this is unfair on the user and will inevitably drive people away from your site.

-webkit-text-size-adjust: 200%;

Comparison of text-size-adjust on iOS devices

But this is not to say the property itself is a bad idea. Setting the adjustment to a percentage can make content easier to read when set above the auto value. Just remember to be respectful when applying this.

Comments are closed