Labeling home screen bookmarks for iOS6

Speaking of proprietary Apple meta elements, here’s a little gem for labelling a site’s home screen icon on iOS.

If you add this site’s home page to the home screen on your iOS devices (which I hope you will to see my shiny new icons,) the default label under the icon will be just “Fashionably.” This is because “Fashionably.” is the first (and only word that fits) from the home page’s title element:

<title>Fashionably flexible website design by Stuff & Nonsense</title>

Hardly optimal.

Thanks to a tweet from @carlbert_, I discovered there is a way in to override the default title element and replace it with a custom short name. Add this meta element:

<meta name="apple-mobile-web-app-title" content="CUSTOM SHORT NAME">

I can’t find this meta element documented anywhere, but by crikey it works. In iOS6. My home screen label is now the much neater “S & N”. Apple really needs to do better helping web developers with their documentation.