Mobile Friendly and Site Speed – Two Important Items to Consider When Designing a Website?

In today’s web 2.0 world everything revolves around the Internet. If you are looking for a plumber you go to the web. If you are looking for local restaurant you go to the web. If you want to buy a home, guess what? You go to the web.

No more are people using the yellow pages to find a business for a need or want. They are going to the web as it provides the most accurate and quickest information.

To get this information five to seven years ago, a person would go to their home or business desktop or laptop computer, pull up a web browser and search engine and do a search.

Today, the landscape has completely changed as people aren’t just going to laptops and desktops to get information – they are using mobile devices including smartphones and tablets.

Is Your Website Mobile Friendly?

That means a website that looks great on a desktop or laptop computer probably doesn’t look very good when viewed via a hand-held mobile device. The copy is way to small, the links are tiny and you have to scroll sideways to see all the content. Not only is the site not user-friendly but it also now could also have an impact (a very important – potentially extremely negative impact) with the search engines – especially Google.

What exactly does that translate too? Basically if your website isn’t adaptive for a mobile device, it can lose organic rankings with the search engines. That means when someone visits Google on their phone or tablet and does a search for a plumber there is a good chance you won’t be coming up and if you do it will most likely not be on first page of the results.

In addition, Google is now putting a “mobile-friendly” label on its mobile search results. A website is eligible for this label if it meets the following criteria as detected by Google’s algorithm:

  • Avoid software that is not common on mobile devices such as Adobe Flash.
  • Use text sizes that is readable without zooming.
  • Links are placed far enough apart so the correct one can be easily tapped for the user.
  • The content fits the screen so uses don’t need to scroll horizontally to view.
The Mobile-Friendly Test

A Webmaster or business owner can check how mobile friendly their site is by visiting Google’s Mobile-Friendly Test page. If the site fails the test, Google will provide you with information and tips on how to make the site mobile-friendly.

Google’s Mobile-Friendly Test

Many Content Management Systems (CMS) such as WordPress, Drupal and Joomla now offer assistance on how to migrate your desktop friendly website into an adaptive, mobile-friendly site.

Before you do this though, you will want to make sure you backup your current site and update your current CMS to the latest version. In some situations, an update to the latest version will automatically apply needed security upgrades and make your site mobile-friendly. If the process is not automatically triggered, make sure to push the update manually to prevent security breaches.

If the CMS you use offers custom themes, make sure the version you choose is mobile-friendly. If not, you may have to start over again.

How Fast Is Your Website Loading?

In addition to making your site mobile-friendly another big item to consider when designing your website is its site-speed. If a website takes to long to load, there is a good possibly the user will bounce off and go to one that loads faster. In fact according to numerous surveys and studies nearly half of web users expect a site to load in two seconds or less. Those same people will abandon a site that isn’t loaded within three seconds. To make matters even greater 79% of web shoppers who have trouble with web site performance say they won’t return to the site to buy again and around 44% of them would tell a friend if they had a poor experience shopping online.

In addition to losing potential customers because your load time is long, a slow website can actually hurt your ranking with Google as well. That is because Google has indicated that site speed is one of the signals used by its algorithm to rank pages. A slow web page speed also means the search engine can crawl fewer pages, which could mean less pages being indexed by Google. Essentially this all means that you are losing business if your website loads slow.

Google’s Page Speed Insights Test

Similar to the mobile-friendly test, Google offers a free Page Speed Insights Tool. This tool measures the performance of a webpage for both desktop and mobile devices.

Google's Page Speed Insights Tool

Once you copy and paste the URL into the tool a score between zero and a hundred points will appear. The higher the score the better your site is for Google’s algorithm and a score of 85 or higher indicates that page is performing well.

With Page Speed Insights you learn how your website can improve on various key aspects including the elapsed time from the moment a user requests a new page through the moment the above the fold content of the new page is rendered by the browser. It also measures the elapsed time from the moment a user requests a new page to the moment the page is fully rendered by the browser.

Since the users network could greatly impact this speed, Page Speed Insights only considers the network-independent aspects of the page performance. That includes the server configuration, HTML structure and the use of external resources such as images, CSS and JavaScript.

For example, by optimizing your code (including removing spaces, commas, and other unnecessary characters), you can dramatically increase your page speed. Also remove code comments, formatting, and unused code. Google recommends using YUI Compressor for both CSS and JavaScript.

The reduction of redirects will also improve site speed. That is because each time a page redirects to another page the visitor faces additional time waiting for the HTTP request-response cycle to complete. For example, if your mobile redirect pattern looks like this: “ABC.com -> www.ABC.com -> m.ABC.com -> m.ABC.com/home,” each of those two additional redirects makes your page load slower.

Webmasters should always leverage browser caching. That includes items like images, style sheets and others. This occurs so a visitor who comes back to your website doesn’t have to reload the entire page. By using a tool like YSlow you can see if you already have an expiration date set for your cache. Once that is found out you can set an “expires” header for how long you want that information to be cached. Unless your site changes frequently, a year is a reasonable time to set it at.

YSlow

Always look for ways to improve your server’s response time. To do this look at various performance bottlenecks like slow database queries, slow routing or a lack of adequate memory. Optimal server response times should be under 200 milliseconds.

Images could also play a big role in the speed of your website.

PNGs are usually the best file format for graphics with fewer than 16 colors. JPEGs are generally the ideal format for photos. Make sure they are also compressed for the web and is completely not necessary to be uploading 200 and 300 DPI photos.

CSS sprites

One tip you may want to try is to use CSS sprites to create a template for images that you use frequently such as icons, your logo and other commonly used buttons. CSS sprites will combine your images into one larger image that loads all at once. That means fewer HTTP requests, which equates to saving on load time by not forcing users to wait for multiple images to load.

Lastly, one other option to increase your sites loading speed is by utilizing a content distribution network or CDN. These network of servers are used to distribute the load of delivering content. Basically this means copies of your website are stored in multiple, geographically diverse data centers so that users have faster more reliable access to the website wherever in the world they physically are.

While creating a great website can be exciting and rewarding, you will want to make sure it is properly optimized. That includes making sure it is mobile-friendly and site-speed friendly. If not there is strong possibility you can lose potentially new and repeat business.

Like it? Share it.

3 Comments

  1. Awesome

  2. Mobile speed analysis with Google’s PageSpeed tool is an absolute important thing every optimizers must use. It lists errors and also tells us how to make the site faster on mobile devices. I recently used this tool for couple of sites as a training assignment, made the necessary changes and now the sites are getting around two times more organic visitors than those were getting before.

    Best Regards
    Nidhi Samuel – SEO trainee

  3. Some really useful information here that is easy to understand. Thanks for taking the time to share your thoughts

Leave a Comment Yourself

Your email address will not be published. Required fields are marked *