To analyse the mobile friendliness of your website, you can use Google’s Mobile Friendly Test, which checks the status of your website and provides insights as to how Google’s bots can see the page. It also tells you why your site is not mobile friendly, which gives you a starting point to begin working with.
Another tool for checking site optimization is Google’s PageSpeed Insights, an analyser that checks your site across all interfaces. All you have to do is enter the website or webpage URL and it determines the good, the bad, and the ugly areas of your website. There is also a WordPress plugin for PageSpeed Insights. Especially useful if you have a large number of pages to frequently optimize, the plugin features exclusive Reports that summarize Page Scores, best and least performing pages, and a comparative analysis across all the reports generated for Mobiles and Desktops.
Now that you have determined what exactly needs to be changed for your mobile version, there are multiple ways of going about it. Broadly speaking, there are two principal ways of optimizing your site for mobiles; you can either modify your current website design or create a new one from scratch. Both these methods have their individual quirks and vary in implementation. Let us discuss them in further detail.
Optimizing Your Current Website Design
WordPress, and by extension WooCommerce. Have several plugins that can make your current website mobile-friendly. These include:
WPtouch Mobile Plugin
One of the best plugins for optimizing your sites for smartphones, the WPtouch Mobile plugin is recommended even by Google. The way it works is, the plugin creates a new theme for the mobile interface which presents all your information, without disturbing your desktop layout and design. The plugin lets you control what pages can be displayed across mobiles and has several themes you can choose from, for the display.
The drawback here is that two different displays are created for the same website, one for the desktop, and one for mobile. This can create confusion amongst users who might be used to a particular layout and find it difficult to acclimatize to the variation on the other platform.
The redeeming factor here is that the website URL remains the same, and there is a ‘Mobile-Friendly’ tag added to the Search Engine results, which prepares the viewers to a certain extent.
Mobile Theme by Jetpack
Jetpack for WordPress comes with a host of extensions, one of which is the Mobile Theme Module. Developed by the guys at Automattic, all it requires is activation from the Jetpack dashboard. The plugin has several display customization options, such as modifying the Post outlook.
The Jetpack Mobile Theme Module keeps all of your primary desktop settings constant. It also adds a ‘View Full Site’ link to the mobile page, which displays the desktop version to the customers.
The one shortcoming here is that you cannot see a preview of your mobile-optimized site on the desktop, you have to check it from an actual smartphone. As a result, you need to keep going back and forth between the two devices, until you are completely satisfied with the results.
Any Mobile Theme Switcher
The Any Mobile Theme Switcher plugin lets you create different homepages across different mobile and tablet interfaces, i.e., you can have separate displays for Android phones, Iphone, Ipad, Blackberry, and Windows Mobile.
A noteworthy feature for the plugin is that it makes any contact number on your pages ‘clickable to contact’, for mobile visitors.
WordPress Mobile Pack
WordPress Mobile Pack goes all the way by creating a mobile version using the mobile web application functionality for your website. Not only does it make your theme responsive, but it also automatically syncs posts, pages, and comments.
The drawback of this plugin is that it is not completely compatible with all cache plugins, which are practically the lifeblood of WooStores. This can be an issue if a lot of bugs get thrown up due to the incompatibility. Also, user identification is not enabled in the mobile application, so anybody and everybody can access all the functions on your mobile website.
Optimizing your existing website using mobile-optimization plugins is a good idea if you already have an expansive website with a strong user-base. However, these are more of a quick-fix solution, and may not always live up to the expectations of your customers.
Often, when a potential buyer sees a disparity while shopping across two different user interfaces, alarm bells start going off in their heads and many a shopping cart can be abandoned, leading to lesser conversion rates.
To avoid this, it is a good idea to be proactive and begin designing your website using a responsive theme from the very beginning. Even if you have a stable website currently, doing it over with a mobile-compatible theme can be beneficial in the long run.
Creating a New Website Design
WooCommerce has a plethora of responsive themes that automatically reconfigure your website to function across multiple interfaces. Most of these are completely customizable and provide substantial support in the way of bug resolution.
Selecting one from the thousands of themes available can be rather intimidating. What you can do is, list out the priorities of the website, whether you prefer an image-oriented website, or is the content for the products your trump card. Based on the criteria of features, display, and pricing, here are some of the best responsive themes, developed by proficient coders, for WooCommerce.
Developed by ThemeIsle, ShopIsle Pro is a completely responsive theme that integrates with WooCommerce. It supports various browsers apart from Chrome, Internet Explorer, and Firefox and has a very admin-friendly interface, which makes customization easy. The ShopIsle Pro theme is offered in a bundle of themes by ThemeIsle which costs $99 per year.
Divi is an all-purpose, responsive theme that lets you customize your site in real-time. Not only can you can preview all the layouts before you wrap up the design, you can also edit the content on your Page itself, as opposed to navigating via the Settings? Appearance panel. Developed by ElegantThemes, Divi is a premium theme for WooCommerce.
Built especially for online shopping stores, Shopkeeper supports multiple layouts, high resolution product images, clean design, and sliders for product display. A drag-and-drop editor and parallax support are some of the strengths of the theme. Shopkeeper is a premium theme, starting at $59 per year.
WooMarket – Supermarket WordPress WooCommerce Theme
As the name suggests, WooMarket is designed especially for supermarket stores or shops that have a large number of items for sale. With optional multiple-column and full-width layouts for homepages, the theme has a built-in mega menu and a comprehensive admin panel.
The Voux is an elegant, multi-purpose WooCommerce theme that pays great attention to detail. It features full-page galleries, customizable headers to grab attention, and automatic URL updates as the visitor scrolls down the Page. A regular license for The Voux costs $61 per year.
Created for food websites, the Cafeteria theme features a semi-retro style in 6 different colours. There are shortcodes for practically every functionality and the plugin supports high resolution images. Available for sale at Themeforest, the theme costs $49 for a yearly license.
Another theme by ThemeIsle, BookRev is designed with book and/or magazine reviews in mind. Featuring a Slider Design and a Highlight of the Day panel, the theme is especially useful for online booksellers, as the theme enables selling with WooCommerce too.
The best theme for WooCommerce store owners with shops selling gadgets and electronic goods. The theme is packed with 7 different Homepage layouts, supports complete Product and category Page customization, and also offers a one-page checkout for visitors. The theme is available at $59 for a yearly license.
Developed by Cactus themes, Business Hub is the quintessential WooCommerce business store theme. It integrates with Easy Digital Downloads along with WooCommerce, and bbPress, which offers a huge scope for sellers online. You can sell physical as well as digital goods online and also develop a chat forum for your visitors using bbPress. Localization ready, with advanced display options, and RTL support are the additional features Business Hub offers, at a mere $49 per year.
Having a responsive WooCommerce theme ensures that you do not have to keep looking over your shoulder every time you make changes to your website, to check whether they are compatible with smartphones or not.
Choosing one from the milieu can be a bit difficult, but once you find the right fit, there will be no stopping you.
In today’s world, mobile optimization is an important metric that decides your ultimate site performance. Optimizing your site to load quickly across all interfaces, yet just as beautifully, takes some time, but the rewards are worth the effort!