It is obvious now that your site has to be mobile friendly. One of my sites, for instance, has the following proportion of visitors from mobile devices within a couple of days:

So, here are the tips from various sources on how to make your site more appealing to the mobile users out there. The first take is from site CBSNews.com, written by Jeff Haden.

Eight Simple Tips to Make Your Website Mobile-Friendly

(MoneyWatch)  My neighbor is 72. She uses her iPhone for shopping.
Do I have to say more about ensuring your small business website is mobile friendly? It’s fairly easy, and you don’t need to develop an app or spend thousands on programming and site redesign. Just take care of a few basics:

• Focus on critical needs. Mobile users typically won’t browse for more than a few minutes. Most just want a specific piece of information. Make sure major services, major products, phone numbers, addresses — the basics of what you do and who you are — are easy to find and view. A friend who runs a chain of retail stores estimates that at least 30% of mobile visitors to his site only come for locations, phone numbers, and store hours.
• Take out the Flash. Flash is cool in normal browsers but won’t display on many mobile devices. Consider removing Flash on pages mobile users are likely to visit; if you can’t, use Javascript, embed YouTube links, or ask your Web designer for other possible workarounds.
• Limit images. While product photos are important, “atmosphere” images are irritating to mobile users and typically increase page load times. Mobile users are more interested in the fast food approach to website visits: They know what they want, they want it fast, and they won’t pay (in this case, in terms of time and use of browsing) for ambiance. Make sure critical pages are to the point and clutter free.
• Simplify navigation. Links are not always easy to “click” on a smart phone, so a cluttered navigation scheme is definitely frustrating. (Admit it; you’ve occasionally struggled to click the right link on your mobile device.) Keep the number of links to a minimum and make overall navigation easy and intuitive. Don’t expect any mobile users to “figure out” how your site works; they’ll leave instead.
• Avoid forms when possible. Forms are a pain to fill out on smart phones (at least they are for me.) If you must use forms, only ask for the information you absolutely need.
• Take advantage of plugins. If your website was built using a CMS (content management system), check out the mobile plugins available. Some are free, others cost less than $50. A good plugin will optimize your site for mobile viewers without the need for a manual re-design.
• Use CSS. Cascading Style Sheets can control the look and feel of your site, ensuring it appears the way you want it to across multiple browsers and platforms. If your site wasn’t built using CSS, it makes sense to do so even if you aren’t worried about being mobile-friendly. Your content can stay the same, but how it is displayed will change based on the device and browser used to view it.
• Test. Check out your site on a number of devices. And try some of the online testing sites, like this one. Never assume your site looks great or works well across multiple platforms and devices, because it probably doesn’t — and if it doesn’t, you may lose potential customers.

Here is how to get your feet wet with PHP and .htaccess on your site. The following quotation is from a site called Mike Industries, from this post called Make Your Site Mobile-Friendly in Two Minutes, written by Mike Davidson.

Make Your Site Mobile-Friendly in Two Minutes

Four easy steps

Outlined below are the four steps to get this done in a matter of minutes, provided you are in an Apache environment and can run PHP. If you’re not, these steps can easily be adaptable to other technologies.

Step 1: Set up a domain mirror

If your site lives at www.myawesomeblog.com, you’re going to want to set up a subdomain at mobile.myawesomeblog.com. How you accomplish this is usually pretty straightforward but differs depending on your host. I use Dreamhost and from their control panel, I can add subdomains effortlessly until I pass out from excitement. You want to set up your subdomain as a “mirror” of your main site, meaning the subdomain is really just pointing to your existing site.

Step 2: Create global_prepend file

The next thing we’re going to do is a create a PHP file which will be automatically prepended to every page of our site. Call this file something like "global_prepend.php" and throw it at the root of your server:

<br /> <?php<br /> function callback($buffer) {<br /> if ($_SERVER['SERVER_NAME'] == 'mobile.myawesomeblog.com') {<br /> $buffer = str_replace('http://www.myawesomeblog.com', 'http://mobile.myawesomeblog.com', $buffer);<br /> $buffer = preg_replace('/[\n\r\t]+/', '', $buffer);<br /> $buffer = preg_replace('/\s{2,}/', ' ', $buffer);<br /> $buffer = preg_replace('/(<a[^>]*>)(<img[^>]+alt=")([^"]*)("[^>]*>)(<\/a>)/i', '$1$3$5<br />', $buffer);<br /> $buffer = preg_replace('/(<link[^>]+rel="[^"]*stylesheet"[^>]*>|<img[^>]*>|style="[^"]*")|<script[^>]*>.*?<\/script>|<style[^>]*>.*?<\/style>|<!--.*?-->/i', '', $buffer);<br /> $buffer = preg_replace('/<\/head>/i', '<meta name="robots" content="noindex, nofollow"></head>', $buffer);<br /> }<br /> return $buffer;<br /> }<br /> ob_start("callback");<br /> ?>

This code uses a PHP function called ob_start() to read in your entire HTML source, run some rules on it, and then send the output to users’ web browsers… all in real time. The first "if" statement simply checks to see if the user is coming from our special “mobile” URL, and if so, runs seven replace statements on the code. Here’s what each line does:

1. Changes all URLs to “mobile”-ized URLs.
2. Strips all linefeeds, carriage returns, and tabs.
3. Trims multiple spaces down to one (HTML doesn’t recognize more than one space in a row).
4. Changes any anchored images with alt text to plain text anchors.
5. Strips all stylesheets, images, inline styles, scripts, and comments (including RDF).
6. Tells search engine robots not to index or crawl the mobile version of the site so as to not create duplicate listings.

Step 3: Create global_append file

Next, we need to create a tiny PHP file which will automatically get added to the end of every file on our site. This is the code that actually outputs the page to the browser. So the flow is like so: Suck code into buffer, siphon fat away, spit contents of buffer into browser.

The code for the global_append file is below. Call it something like "global_append.php" and throw it at the root of your server:

<br /> <?php<br /> ob_end_flush();<br /> ?>

Step 4: Enable prepends and appends using .htaccess

If you don’t already have an .htaccess file at the root of your server, open up a new text file and add these lines to it:

php_value auto_prepend_file /localfilepath/global_prepend.php
php_value auto_append_file /localfilepath/global_append.php

Then save it to the root of your server with the filename ".htaccess". If you already have an .htaccess file, just add the above lines to it.

* Important Note: If you copy these two lines from your web browser, you might need to delete the carriage return and make your own. Sometimes a browser’s carriage return will cause your .htaccess file to fail (you’ll know immediately if it has failed because your site won’t come up).

Assuming your subdomain is live, you should now be able to hit your site in a web browser using the special mobile URL and see a nice, compact, imageless, styleless, scriptless version of your site. Voila!

Here is in an excellent infographic for the above process:

How To Make Your Site Compatible For Cell Phones