Google recently introduced a new search engine algorithm that basically prioritizes "mobile-friendly" websites. The change is so significant that some people have referred to it using the hashtag #mobilegeddon. According to research cited in this Mashable article and this Economist article, roughly 40% of websites - including those belonging to large enterprises - currently fail to meet Google's "mobile-friendly" standards.
This algorithm change is likely to provide the incentive many organizations need to upgrade and enhance their websites. That's a good thing. Having their hand forced to some degree gives organizations a chance to step back and reevaluate all aspects of the design and functionality of their most valuable piece of digital property - not just its mobile readiness. For many organizations, a website optimization and enhancement initiative is long overdue.
A website upgrade will certainly involve improvements to the site's look and feel, as well as user-oriented aspects like ease of navigation and promotional aspects like calls to action. But sometimes in an effort to make sites more attractive and sophisticated, we forget that they need to load quickly too. In fact, all things considered, a fancy site that's too slow is going to be far less successful than a simpler, faster site. With that in mind, I thought I'd share some guidance on the main website optimization testing tools, along with some recommendations for ensuring your website can pass them with flying (or at least acceptable) colors.
Website Optimization Tests
In addition to Google's Mobile-Friendly Test, here are some of the main website optimization testing tools you can use to evaluate your site:
If you're a non-technical person, the data produced by these testing tools can be overwhelming and confusing, especially when the different results appear to contradict each other. Keep the following in mind before and after running the tests:
- The software used to render a website page is hierarchical. At the core are files that contain the primary code. For websites that are built using a content management system (CMS), there's another layer of files that contain the CMS-related code. The next layer includes theme-related code, and the final layer includes the code for plugins, custom CSS and other add-ons. These layers get loaded in order, so the more layers you have - and the bigger those layers are - the longer it will take for a page to load.
- Not all website pages are equally important. Websites are comprised of primary, secondary and tertiary pages. Primary pages are those that are the most important and heavily trafficked, like the home page. Secondary pages include things like product and service descriptions and some dynamic elements like portfolio pieces and blog posts. Tertiary pages are the least visited, and include things like About Us and Contact Us. Google Analytics and other website metrics can help you determine which pages fall into each category. Test pages from each and compare the results, keeping in mind that the most important pages to optimize are the primary pages.
- Although fast load times are important on all websites, the optimal speed standard may vary based on your objectives and targeted demographic. If you have a consumer-oriented business and/or you conduct transactions via your website, speed is paramount. For business-to-business sites, however, slightly slower load times may be more acceptable.
Website Optimization Tips
First and foremost, you need to upgrade your website to ensure it is optimized for mobile. Rather than building a mobile version of your main website or a mobile app, you should rebuild your site using responsive design. Since most organizations don't have a cadre of coders available to create a custom site from scratch, the best way to do this is to use a website builder platform like SquareSpace (for simple websites) or a content management system (CMS) like WordPress.org, Joomla, or Drupal.
If you opt for a CMS-based redesign and/or your website is already built using a CMS, here are some additional website optimization tips:
- Make sure the theme you use for the core design and functionality is optimized for speed. What this basically means is that the code is lean, well organized and efficient, without a lot of extra junk. If the theme specifications don't explicitly mention speed optimization, ask the developer.
- Minimize the amount of site customization you do outside of the theme. The Custom CSS file that has to get loaded in on top of the theme adds extra time. Make sure all those extra customizations are vital before adding them. You could also create a child theme, but that adds a layer of complexity to both the design and maintenance - again, make sure it's vitally necessary before going this route.
- Minimize the number of plugins you use. Like the Custom CSS file, these extra pieces of code slow down the load time, so you want to make sure they add enough value to justify the extra time. Building your site using a sophisticated theme can reduce the number of plugins significantly, as many of the features and functionality that plugins provide are already built in. And for front-end plugins that add design elements and features to a site (e.g., forms), be sure they're optimized for mobile as well.
- Reduce image sizes. There's generally no reason to have 1 MB+ sized images on a website. Especially when you're adding photographs to the media library, be sure to reduce them first, and consider converting .png files to .jpg files. You can also use a plugin like WP Smush to further optimize the images when they're uploaded.
- Keep your heavily trafficked pages as lean as possible. It's really tempting to want to add lots of bells and whistles to your main website pages, especially the home page, but that's the last thing you should do. Make sure your most popular pages load quickly, and save the fancy stuff for secondary and tertiary pages.
- Employ site-wide caching, on both the hosting and user sides. Caching in effect saves page details in the computer's memory. Using a plugin like ZenCache means that website pages don't have to completely reload every single time someone visits them. You can also add "far future" expiration dates to media files to ensure they don't have to be continuously reloaded as well.
Be prepared to make trade-offs and set-up changes over time. For example, as noted above, you may have to choose between a desirable plugin or feature and the extra load time it adds to a page. And when you're adding lots of content and/or making major changes to a live site, it may be necessary to turn off caching for a while so that visitors are always seeing the most current content.
It's also important to make sure you're using a reliable website host, and that you have the right kind of hosting plan and/or the necessary add-on services to optimize load times in particular. The web host should also provide excellent customer service, with knowledgeable technicians who function with your best interests in mind. They should focus on helping you meet your website optimization needs without constantly trying to sell unnecessary add-on services. Don't make the mistake of assuming that web hosting is a commodity and that one web host is basically as good as another. Using the right hosting service is critical.
Finally, make an investment in some short-term technical help. Find someone who understands all the mumbo-jumbo that the website optimization test tools create and can help you make sense of the results and take the proper actions. For a relatively small investment, you can experience huge returns in website performance.
For additional details on some of these website optimization tips, as well as others, check out this article from BlueHost.
As always, I welcome your feedback. What questions has this piece raised for you? What would you add to, change, or delete from the recommendations provided?