How to Make Your Website Mobile-Friendly

By Phill Powell

What’s the point of building a great website if nobody can see it properly? That’s the real question behind Google’s recent announcement about the importance of designing websites that are properly formatted for mobile devices.

Different-Displays
Google’s guidelines will create a better user experience, no matter what type of mobile device is used.

Statistics indicate that as smartphones and tablets become more powerful, the amount of users accessing the Web on these devices is increasing. According to Google, soon there will be more web searches made on mobile platforms than on traditional laptop and desktop computers.

Serious Consequences

Google is determined in its support for mobile platforms and has announced that moving forward, any websites that are not mobile-friendly will pay a hefty price.

Currently, web pages that are not optimized for mobile devices will lose some percent of their Google ranking, which will have a negative impact on that site’s number of page views and, as a result, its ability to sell advertising space on the site. Non-optimized pages include problems such as:

  • The website’s width doesn’t match the screen width of smartphones.
  • The content appears way too small. Smartphone users may have trouble reading the text.
  • The graphics on the site have resolutions that are way larger than the device can accommodate.
  • The buttons used to navigate the site are way too small on smartphones.
  • Buttons are also crowded together, making it hard to use device without pressing wrong buttons.
  • The site loads slowly, resulting in an imperfect user experience.

How to Comply

Although some may view Google’s announcement as strict, it actually presents a golden opportunity: Since some websites will probably be slow in complying with the new guidelines, that means that if your website is compliant, by comparison it will leapfrog over similar sites that don’t heed Google’s ruling.

Mobile-Friendly
Web designers must create responsive layouts that change based on the user’s device.

And becoming mobile-compliant isn’t all that difficult. Google is even giving designers some diagnostic tools to check their site’s responsiveness, with specific suggestions for improving that site’s design and increasing its mobile-friendliness. To make your site mobile-friendly, follow the steps below:

Step 1: Check Your Site’s Mobile-Friendliness
Locate your site on Google with a mobile device.

Step 2: See if Your Site Complies
Go to Google’s Mobile Friendly Test page. Enter the URL for your site.

Step 3: Learn What Google Thinks
At this point, you could get an “Mobile-Friendly” rating from Google, shown in a tag directly beneath the title. If so, you don’t need to do anything else, although it would still probably be a good idea to see if you can improve your site’s loading speed. (Move on to Step 5.) If, on the other hand, your site is judged by Google to not be mobile-friendly, don’t despair. Google is also being very open in letting you know exactly what is wrong with your design and what needs to be fixed.

Step 4: Make Needed Repairs
You may be able to make many of the necessary changes to your web design. If not, you might want to enlist the services of a dedicated web designer, who will certainly know how to alter your design to make it comply with Google’s guidelines.

Step 5: Step on the Gas!
A big part of responsiveness involves loading speed. This is another diagnostic site, a Page Speed Test, which clocks the loading speed of your site. As with the other diagnostic tool, this one gives specific recommendations for speeding up your site’s loading time.

Master the Nuances

Properly formatting a site for all platforms is only one important aspect of good web design. Those interested in gaining a full understanding of how to build great websites that people want to visit should check out Digital Media Academy’s web design tech camps.

DMA tech camps feature world-class curriculum and instructors who are industry professionals as well as gifted teachers, and students use the latest in design software. This summer, mobile web design tech camps are being offered at select DMA tech camp locations.