Just recently, Google changed their ranking algorithm for mobile search results. For users who access Google on their mobile devices, websites passing Google's mobile-friendly test will be nudged towards the top of the search results, while non-mobile friendly webpages are left in the dust.
What does that mean for businesses who have a space in the web sphere? Now, more than ever, is the time to start thinking about shifting towards a mobile-friendly mindset, if you haven't done so already.
Among the options that are available to you, the two most popular are:
- Employing responsive web design practices onto your website
- Creating a separate mobile-friendly version of the website, with its own dedicated URL, separate from the desktop experience (m.company.com for example).
Upfront, the less costly option is to create a new and separate mobile-version of a website. However, updates and general maintenance to the website now doubles in work, as web admins will have to manage both the desktop and mobile experiences, thereby increasing the cost of future updates and maintenance. There is also an issue with maintaining correct cross-links. If the desktop version of the homepage links to an About page, the URL will be different for the same page on the mobile-friendly website. The web admin will need to direct traffic to both the desktop version's URL and also the mobile version.
Everyone here at GRAYBOX recommends building a responsive website. The initial cost of rebuilding a website from the ground-up may seem like a daunting task, but the ease of maintenance down the road is significantly greater than maintaining two websites like in the option above.
Below is a list of some key points to keep in mind while designing for a mobile-friendly website (responsive or otherwise):
Be mindful of touch targets on buttons & links
Have you ever tried tapping on a 20x20px button on your phone, only to be taken to another page entirely because your too-big-of-a-finger accidentally tapped the button next to the one you intended instead? Save the usability gripes from your users and ensure a minimum touch target size of at least 44-50px high x wide.
Choose a typeface and font size that reads well
Got a magnifying glass handy? No? Neither do your users. While some websites allow pinching/zooming into content to increase the text size, why not save time and your users' patience by simply bumping up the text size so readers can easily consume your content. If you're worried about content living below the fold, rest-assured that users do indeed scroll to read below-the-fold content (Facebook, Instagram, and all of the other social-sharing based apps / platforms have trained users' brains to scroll down for more content).
Get rid of Flash on your website
If you're still using Flash on your website, then get ready to part ways when designing for a mobile experience. If you're using an iPhone, you already know that Flash will not be recognized when browsing page content. It is also very heavy to load and takes a toll on bandwidth. Because of this, Flash and other inaccessible content will negatively impact rankings on the search engine.
Streamline your content
Along with doing away with Flash, trendy design effects like video backgrounds or parallax scrolling will need to be heavily pared down on mobile experiences. Again, these elements consume massive amounts of data and also bog down the load time of your website, especially if users are not connected to wi-fi or another reliable connection.
If you are unsure if your current website is mobile-friendly or not, simply run it through Google's mobile-friendly test to check: https://www.google.com/webmasters/tools/mobile-friendly/.
What do you do if you aren't ready for a full re-design of your website?
Since the new algorithm will be applied on a page-by-page level rather than site-wide, you could potentially get away with optimizing only certain pages of your website for the time being. Focus on commonly visited pages like the homepage or contact page to have at least a couple of pages positively-impacted by the algorithm. Still, this is only a temporary solution until you get a chance to switch over to a website utilizing responsive web design (RWD).
Are you prepared for Mobilegeddon?