TEST FOR: greylizard.net
Your score was 2 out of 8!
Ouch! You're not mobile at all.
You didn't specify the viewport
The viewport tag tells the device to fit the web page to the width of the device (instead of scaling it down).
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
You didn't disable zooming
Using maximum scale and user scalable options in the viewport is bad form indeed, as it takes control out of the users hands.
<meta name="viewport" content="maximum-scale=1.0, user-scalable=no"/>
You didn't use the MobileOptimized tag
This tells the mobile browser which mobile width the site is best optimised for. It's an extra failsafe for mobile browser rendering.
<meta name="MobileOptimized" content="320">
You didn't use the HandheldFriendly tag
Similar to the MobileOptimized tag, this tells devices such as Blackberrys that the site is optimised for mobile browsing.
<meta name="HandheldFriendly" content="True">
You aren't using Modernizr
You don't have an Apple Touch Icon
If someone adds your website on their home screen, an Apple Touch icon will look far better than a shrunk down screenshot.
<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" />
You have no phone link
In the olden days mobile phones were used for calling people. The quickest way to connect with a potential customer is to include a clickable phone number.
<a href="tel:your number">
You haven't used tables for layout
Tables should only be used for tabular data. Using table tags for layout is naughty - they aren't semantic and they bloat your site with code.