Building a Mobile Friendly Website That Will Rank

A website can never worry too much about the growing popularity of mobile browsing. There is no sign that this trend is going anywhere anytime soon, so it’s important that companies optimize their websites for the small screen. In fact, according to Search Engine Land, more than 1/5 of all searches will be completed on a mobile device in 2012.
In some ways SEO remains the same no matter where a user is looking at a website, but there are a few aspects that change. It’s important not only to consider what the website will look like for those who want to browse your site on their smartphones, but also whether or not that website will rank well on a Google SERP.
Tips and Tricks to Helping Your Mobile Website Rank
There are really two different ways to make sure your website is ready to go for smartphone users: responsive web design or different HTML for desktop versus mobile viewing. It is also possible to create two completely different sites for these two types of mediums, but the vast majority find that one site works just fine if created in the right way.
Below explains the two different options and some tips to help make sure that your site will continue to rank well even on a smartphone:
Responsive Web Design
This is probably the most popular way to build a website for the small screen because it is easy to create. This method of design changes the way a webpage looks using CSS3 media queries. Creating a responsive web design is all about customization, so many companies hire a web designer or developer to analyze how things should look—advertisements, number of images, font size, etc.—when viewed through certain screens. Below is an example that illustrates how responsive web design works:

As you can see from the example above, responsive web design manipulates the page so that a smartphone viewer will see text right away as opposed to half of a large picture. So how does this affect Google SERP rankings?

• Single URL – Responsive web design keeps all of your content on one URL as opposed to multiple URLs (which occurs if you were to create a new website strictly for mobile viewing). This helps the Google algorithms to index your company’s content easier and faster; thus helping you rank well on a Google SERP.
• Efficiency – Google has to crawl every webpage in order to rank it appropriately, and responsive web design makes this easier.

It is also recommended to try and resize images on a style sheet before letting the responsive web design do the work. In other words, create a different image that is already appropriately sized; this will help cut down on the downloading time for users.
Customized HTML
Responsive web design isn’t right for all everyone, because it generally takes a good deal of time to get right and creates the same user experience across the board (which isn’t ideal for some companies). In this case, Google recommends the use of device-specific HTML. This also allows you to use the same URL with different HTML depending on the screen size. Oftentimes this is known as “dynamic serving.”
Google recommends that companies give Google a hint that it needs to crawl the pages that are setup for a mobile device. Letting Google’s caching servers and algorithms know that content may change based on specific devices is extremely important when it comes to indexing and ranking a website. Google recommends you use Vary HTTP header to make this happen. Google explained that this tool does two very important things:

• Eliminates Cache Mistakes – Because a cache has to determine which version of the website to give which user, things can get a bit confusing. The Vary HTTP header helps the aching servers know that they need to consider the user-agent when making the decision.

Discover Content Faster – A Vary HTTP header is a great sign to Google that it should crawl your URLs that are setup for the small screen, which helps to move things along.