Question: What market is going to grow in double digits through 2014?
Answer: The mobile market.
Next Question: Do you have a mobile presence?
Answer: If you have a “regular” website you also have a mobile presence.
That’s right: your existing site is a player in the mobile market, but chances are it’s not too mobile friendly. So, what easy changes can you make right now to better serve a mobile market? Keep reading and we’ll walk you through some.
How Desktop and Mobile Sites Differ
Mobile Site:
- Coded specifically for smaller mobile browsers. The most common languages for mobile sites are: cHTML (compressed HTML), XHTML Basic 1.1 XHTML MP 1.2 and WML 1.3 (wireless markup language).
- Less page content
- Fewer images
- Less navigation
- Designed with specific user-tasks in mind
Desktop Site:
- Designed to be viewed on a desktop/laptop computer
- More images
- More content
- Flash
- More navigation
Mobile Searches Return Non-Mobile Pages
Google dominates mobile search leaving Bing and Yahoo! with about 2% of that market, so we’re going to focus on Google SERPs only. Google has a unique bot for mobile sites (Mobile Bot), but not a different index. The pages (mobile vs. non-mobile) are just treated differently. Due to the lack of mobile specific pages, Google is “borrowing” desktop sites for mobile SERPs. That means if you don’t have a dedicated mobile page, you’ll still show up in mobile searches.
Google is about relevancy, so if a non-mobile page is the best result it will rank for now. Google will also adapt your desktop page to render in a mobile browser. Many desktop pages render decently in mobile browsers, but issues include overlapping navigation, non-functioning flash, pop up windows that cause browsing issues, and a page width that requires too much scrolling.
Does This Browser Make My Site Look Big?
View your desktop pages in a mobile emulator so you can see how it looks on different smartphones screen sizes/browsers. Compare this to the PC version of your site.
Mobile Phone Emulator is an excellent tool that lets you view pages on different screen sizes for different mobile phones/browsers. It shows you a working version of your site in mobile form. Click the links and navigate your site just as a mobile user would.
Easy changes to make your site mobile friendly.
After viewing your pages on different platforms you’ll begin to see page changes you can make that will improve mobile browsing without hurting desktop browsing. These may include:
- Eliminating pop ups.
- Creating front-loading content (like a journalist). Think of information like a triangle. Most important “need to know content” at the top, followed by second most important information, etc.
- Larger font–less text.
- Fewer images.
- Cleaner navigation–less navigation.
- Avoiding frames.
- Continuing to improve page speed. This is very important with mobile devices.
- Adding contact information, maps, directions, hours of operation.
- Limiting long heading tags.
- Avoiding flash.
- Thinking of what a mobile user–on the go–would be using the page for.
- Optimizing for tasks.
- Shorten meta descriptions if possible.
Plug-In and Mobilize Your WordPress Blog
If you run WordPress sites that aren’t rendering well, the following plugins will create a clean mobile version.
- WP Touch: If you’re site is a WordPress blog which doesn’t convert well in mobile browsers, install the WPTouch plugin. This will turn your blog into a very clean and organized app-style theme for iPhone, iPod touch, Android, Palm Pre, Samsung touch and BlackBerry Storm/Torch visitors (user agents Android, CUPCAKE, bada, blackberry9500, blackberry9520, blackberry9530, blackberry9550, blackberry9800, dream, iPhone, iPod, incognito, s8000, webOS, webmate). WPTouch will also put AdSense for mobile ads in your posts when you customize those settings. Takes just a couple minutes to set up.
- WordPress Mobile Pack: The WordPress Mobile Pack automatically detects when a visitor is on a mobile device and switches to a mobile theme. This toolkit has a barcode and mobile ad widget and mobile analytics.
Your Mobile SERPs
Use the Google Mobile Search page or the XHTML version and compare mobile SERPs vs. desktop SERPs for your important keyword phrases.
Redirecting Mobile Visitors
Now that you’ve seen what your site looks like in the mobile browser and what’s ranking in SERPs, you may want to redirect mobile visitors to a different (but similar) page. You can do that by adding the following to the head section.
<link rel=”alternate” media=”handheld” href=”redirectedpage.htm” />
Click to Call
Mobile users tend to seek information now–that they’re going to act on now. For example, finding a restaurant or shop nearby.
Make your contact information visible and clickable. Link phone numbers so mobile users can “click to call.” Use the following HTML on your phone numbers.
<a href=”tel:1-800-123-4567″>800-123-4567</a>
Replace the example phone number with your own and don’t leave out the “1” before your area code. I left it out of the actual anchor text, but you can include it there too.
Be More Accessible: Go Local
Mobile is very much about local, so make sure you register with local sites.
- Google Places: List your business, address, hours of operation, expanded directions, specials/coupons, images, and incentives like free parking.
- Bing Local
- Yahoo! Local
- Best of the Web
- Yelp
- Citysearch
- Hot Frog
The following are just a few tips for making your site more mobile friendly, until you have a dedicated mobile site up. Until then, remember to have contact information visible and easily accessible, keep the design clean and quick to load, and develop a local presence.
Sean Brady says
Interesting article. Is HTML5 not supported on the mobile market?
christina says
great article, you should also take a look to http://www.mobilova.com ,it’s one of the best solutions on the market to create and monetize mobile versions of websites.