Optimizing Your Website for Mobile and Tablet Devices

Guillaume Bouchard, October 20, 2011 

Is your site optimized for the mobile and tablet generation? There’s no such thing as being lost in the woods anymore thanks to mobile and tablet technology, which gives consumers the power to directly connect from the palm of their hands. This means your site has to visually evolve as technology shrinks.
Here’s how you minimize your site while maximizing your searchability.

Smarterphone, Smarterconsumer, Smartersite

Having a mobile version of your site gives you the advantage of reaching the instant consumer. In 2011, we’re no longer sitting at our desks waiting for a page to load; we can be anywhere when pages load. That’s why it’s crucial you make sure your site is available in the mobile world, and optimized properly for optimal searching and customer-site connection. Here’s how you do it:

• Google AdWords now lets you search keywords that are specific to mobile devices, helping you narrow down exactly what words you need to use to reach the instant consumer.
• Take the same SEO formula used for classic site optimization and optimize your mobile site – use your mobile keywords to create your meta titles, title tags, and headers.
• Don’t overload your reader. Keep your content short and simple, make sure images are smaller to help give the instant consumer the best mobile experience possible.
• Make sure fonts are nice and clear, and important direction buttons are bigger. Remember this is all being viewed on a small screen.

To help make sure the instant consumer lands on the mobile version of your site when they’re strolling down the street reading their smartphone, you have to do some quick website revamping to turn your site from computer-friendly to mobile-friendly.
Most sites have two URLs: one for mobile and one for computer. The SEO advantage to having a mobile version of your site is that Google now has a designated bot that crawls around looking for mobile versions of classic sites to index.
This means you have two pages of the same site indexed as one. This is a huge advantage for you because it means that if your mobile and classic site is optimized properly, you’re even more searchable.

Mobile To-Do Guide

Here are three key things you need to do right now to make your site mobile-friendly:

1. Optimize for Mobile: Know The Basics

• Make content visually appealing for limited screen viewing by using CSS in your coding. Reduce the image sizes and ensure fonts and content are simple enough to quickly scan and understand.
• Optimize your content and images by including the keywords found in your Google AdWords mobile search, and strategically sprinkle them throughout your pages. Best practice is to avoid using any ads – it’s hard enough to see your content.

Quick tip: If your site is e-commerce based, get an app developed. An app gives you the competitive edge you need to keep your customer from browsing the web and looking at your competition; instead it places them directly in your virtual store via your app.

2. Consider Your Design Options: Google Transcode and Mobile Subdomain

• Google Transcode: Using Google’s configuration tool to transcode your site from classic HTML to mobile HTML won’t give your user a unified experience. When you get Google to the do work you risk having images and content resized in unattractive ways, duplicate content/error pages, and overall bad user experience. How do you avoid this? Make a mobile subdomain.
• Mobile Subdomain: Make a subdomain specifically for your mobile site. You can do this by creating a subdomain txt files. This is a key factor for search direction and indexing. Having one distinct mobile URL keeps your mobile optimization from interfering with your classic optimization (keeping the same experience on the small screen), and allows the GoogleBot Mobile to visit and index the mobile version for mobile searches.

Quick tip: Avoid using Flash, Java, Ajax and Frames. Instead try XHTML (WAP 2.0), cHTML (iMode) or WML (WAP 1.2).

3. Mobile Preview: Don’t Be Fooled

• Run your site through WSC Mobile to ensure it is mobile-friendly and test, test, test it on multiple browsers and devices.

Quick tip: Not everyone has made the switch to a smartphone; there are still a number of users using classic phones. You’ve got to make sure your site looks good no matter what screen it’s on. Rethink your coding and design options, and look into apps.

The Rise of the Tablet

Now that we’ve covered why you need a mobile version of your site, let’s switch our minds over to tablets. Tablets are quickly replacing laptops and televisions – they’re lighter and easier to pack, making them more attractive for people on-the-go.
The top four ways consumers use tablets are:

• Organizing recreational activities
• Online shopping
• Reading news or blogs
• Social networking

Unlike the majority of mobiles, tablets rely mostly on Wi-Fi and 3G for connectivity. Making your site tablet-friendly means you’ve got to make it fast. Optimizing your site for tablet means you’ve got to make it familiar and simple.
Here’s what you need to think about:

• Offering your site in classic and mobile versions gives you the upper hand if the user is using an iPad. Remember iPads don’t use Flash. If you have Flash content on your site, simply redirect the user to the mobile version, and everyone’s happy. Also consider making your site in HTML5.
• If your site is primarily e-commerce based have an application developed that directly connects your products to the instant consumer in one tap. Apps easily store all your information in one place and remove the annoyance of waiting for a page to load. They also make the paying experience more enjoyable. The only disadvantage to an app is: it’s not picked up in organic search results.
• Having a content heavy site is great but it can be time consuming and irritating to scroll down for what seems like forever. Avoid this consumer pet peeve by including “Previous” and “Next” buttons for easy content navigation.

Tablet To-Do

Here’s a top 10 list of what you need to do right now to make your site tablet friendly:

1. Limit duplicate content by changing CSS so it’s optimized for tablet viewing.
2. No Flash, you’re good. Flash, make sure there’s a redirection to your mobile site from the tablet.
3. Don’t overwhelm visitors with scrolling fever - include “Previous” and “Next” buttons to help guide them through your content and web pages.
4. Consider creating an app for e-commerce pages and information storage to help avoid irritation and slow loading time.
5. Optimize check-out process for visitors by using cookies, postal codes, and PayPal.
6. Make it touchable: use HTML5 and CSS3 to create scrolling and horizontal navigation to put all content on one page, not giving the visitor a tab-attack.
7. Adding CSS to increase the size of buttons on your page to make your site more attractive and user-friendly from the tablet perspective. No one really wants to zoom in that close.
8. Offer downloadable content by creating PDF versions of your sites content or important information. This also gives them the option to store your content for future reading.
9. Remember the 5 viewing angles: Vertical and landscape in both mobile and tablet, and the straight desktop view. Take advantage of the viewing options available.
10. Test, Test, Test – test to make sure it’s good to go and makes a returning impression.

Devices might be getting smaller, but search opportunities and consumer-to-site connection is expanding. You now have indexing for mobile sites, instant purchasing and sharing, and individually developed apps that remove users from the browser and place them directly into a niche online store, keeping their attention focused on the most important goal: conversion.
It’s no secret that we’re moving away from our computer desks and looking for answers on the small screen – is your site ready?

 http://searchenginewatch.com/article/2118531/Optimizing-Your-Website-for-Mobile-and-Tablet-Devices