2

For mobile optimization I've read that you should include all the following meta tags:

<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="320" />
<meta name="viewport" content="width=device-width">

Are they all doing slightly different things or is there a hierarchy (e.g. the later tags overwriting the previous ones)?

As MobileOptimized includes a pixel width, is it possible to use width=device-width instead and is it advisable to do so? Will something like the iPhone scale to 320px or ignore this?

1

Those tags seem to apply to Blackberry browsers and the older AvantGo browser in Palm Devices. The browsers found in iPhone (safari) and Android (including FireFox) use CSS media queries for determining which styles to apply to a web page. Since Blackberry does support them, too, I would say it is not necessary to use those meta tags and they should be considered obsolete.

| improve this answer | |
  • I think your wrong. The last tag is needed to make my media queries be used on an iPhone. The iPhone by default acts as if its around 980px and scales the content down. The tag is needed to make the iPhone display smaller or its true resolution. – Evanss Oct 14 '11 at 10:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.