What are the basic things to do in order to make a web site iPhone-friendly or more mobile-accessible?

Question

What are the basic things to do in order to make a web site iPhone-friendly or more mobile-accessible in general?

Answer 1

For the iPhone in particular you should consider configuring the viewport, which controls the scale at which your page will get rendered. This is especially useful if your site is significantly narrower than the default viewport width of 980px. You can do this with a meta tag:

<meta name = "viewport" content = "width = 590">

You can also set the scale, and a bunch of other things. You can read all the details on Apple's site: http://developer.apple.com/safari/library/documentation/appleapplications/reference/safariwebcontent/usingtheviewport/usingtheviewport.html

Answer 2

With more and more phones with higher resolution, good browser scaling and normal javascript/css support it's much less needed to make a special version of your site for mobile. Make sure you don't rely on :hover and you will do fine I guess. There is a good article on A list apart about fluid layouts which fit for all devices, take a look: http://www.alistapart.com/articles/responsive-web-design/