Other than this blog, the only part of my vast web empire which I regularly visit on a mobile device is the Weather Chart. The blog runs a Blogger dynamic template which has a mobile-friendly version, but the Weather Chart is desktop-focussed. Mobile browsers try hard to make it usable, but they need some assistance to avoid presenting tiny indecipherable text and impossible to click miniature links to mobile viewers. This is known as responsive web design, and it's really quite easy to do.
The first step is to decide whether any elements of the basic web page are not needed for mobile. I decided that the header and sidebar were extraneous, so if the browser is narrower than a certain number of pixels they are not displayed. You can see this in action with a desktop browser by visiting the Weather Chart and resizing the window. To achieve this I followed the instructions in the Responsive Web Design section of An Advanced Guide to HTML and CSS.
Secondly, I added the viewport meta tag. This is needed to ensure the site is not displayed too small. Although a mobile phone may have the same number of pixels as a desktop monitor, those pixels are much smaller, so you shouldn't try to fit the same amount of detail into them. This is explained briefly in the aforementioned Responsive Web Design, or in gory detail in device-width and how not to hate your users.
For a few minutes of effort the resultant page is much more usable on mobile devices, and completely unchanged on desktops. Sites which have a high proportion of mobile devices should consider adopting a mobile-first strategy, where the initial page layout is aimed at mobile, and desktops get added elements. This contrasts with the approach I took, where all devices start with all elements, but mobile have some elements removed.