Mobile Delivery: The Challenge
Over half of website traffic is now on mobile phones, and yet, you may have not realize the extent of technical challenges posed by mobile delivery. I do.
Most WordPress websites use themes that are ‘responsive’, that is, the pages automatically resize to fit the screens on different devices, including mobile. That’s the easy part.
The challenge is delivery speed – a mobile site must load quickly, say within 1 or 2 seconds. For speed, mobile-optimized pages must have
- Streamlined content, achieved by eliminating background images, sliders, and anything that will increase the load time.
- Delivery by content delivery networks, caching programs, and other backend trickery.
Is Your Site Mobile-Optimized?
Do you want to know if your site is mobile-optimized? Go to https://testmysite.thinkwithgoogle.com and run you site. This test runs by very strict standards, so don’t freak out if your site grade is 40/100.
Recently, I was able to get a WordPress page to load in just over 1 second, and the grade was still ‘Fair’ (76/100). So, Google standards are set high.
Some Tech Notes on mobile optimization are below. Get in touch if you would like help with this.
Tech Notes (for WordPress)
Mobile-optimized websites must be specially designed for speed and delivery, with mobile versions designated to load when accessed on a mobile device. These notes pertain specifically to WordPress websites.
The fastest mobile-optimized websites (or home pages) run on a lean theme. Examples include websites powered by plugins such as AMP (accelerated mobile pages) or Mobilepress (see links below), both of which yield good results if properly setup, or deployment of an entirely different theme (use Any Mobile Theme Switcher).
The problem with lean themes is that you lose most of the flavor of your site, and sometimes control of the content. Another option is to redirect to a mobile-optimized page when accessed on a mobile device. Plugins such as WPTouch/
If your homepage is relatively simple, another option is to be tweak the design by loading only certain elements of a page on mobile platforms. The advanced editors in many themes contain settings that allow elements to be shown (or hidden) on mobile devices. Or, you can use the plugin Mobile Detect to add shortcodes that show or hide content on different devices.