8 minute read
Which WordPress theme would we choose for best mobile speed? You can’t judge by looking at the theme on a desktop screen – nor by a demo page. You have to test with either iPhone simulators or web tools like FireFox browser addon:
Web Developers Toolbar > Resize > View Responsive Layouts
Or real hardware devices. No one owns that much hardware.
And how a theme looks – the “Out Of the Box Experience” (the OOBE) – is nothing like the beautiful demo page. When you first install your new theme, disappointment!
Unfortunately, theme selection is often based solely on looks (aesthetics). Demo-page performance is deceptively “tuned and tweaked.” Premium themes are available for sale from marketplaces and individual WordPress developers. Purchaser speed-evaluation or testing is rarely done at all. It’s a faith-based buy. Speed is an after-the-fact repair job. This is “consumer-like” impulse buying. There’s buyers remorse for a non-returnable theme product. We’ve been there. We sympathize.
Our speed philosophy starts with a stripped-down, free theme. Then add only necessary features with free plugins. This is the foundation of good speed design. These kinds of themes are sometimes called: stripped-down, bare-bones, generic, basic, naked, essential, fundamental, or “bootstrap.” Those key phrases return pages full of affiliate links to theme-publisher houses. The blog author gets a kickback. Bloggers aren’t motivated to help you – as much as help their wallet.
We’ve found free themes in the WordPress directory often get a bad rap. Paid-theme publishers claim free themes have inherent flaws. This is advertising hype (aka lies). These imagined flaws include:
- Lack of Updates
- Security Problems
- Lack of Support
- Lack of Features
- Lack of Customization
Nothing could be further from the truth. You can get the same lousy service from paid authors. Some of the biggest and best authors in the business fall flat on their faces sometimes. Even WordPress makes security mistakes and suffers from favoritism and apathy. Don’t believe myths that “premium” themes are better – or delivers better guarantees.
Many blog thought leaders say the right web hosting is critical. Even more critical than theme and plugin selection. This isn’t true. And you can bet whatever host they recommend is an affiliate link, too. (More kickback money).
We’ve only seen short duration when hosts provide consistent and reliable services. And we aren’t just talking shared hosting. We mean all hosting. From SiteGround to BlueHost to HostGator to DigitalOcean to GoDaddy. It doesn’t matter if they’re solid-state disk drives or old, mechanical, magnetic drives. “Reliable and repeatable” speeds drift all over the map. Why? Ask them. They won’t give you a straight answer.
Worst-case performance today – is tomorrow’s average (poor) performance. Hosting companies get juggled around from owner to owner. With each new owner, comes policy changes. Different management brings either better or worse predictable performance. It’s hard to know. It’s always random. If you had a different experience, please email us.
So the answer is: build the best and fastest strategic website to run well even on crummy hosting. That way you aren’t disappointed. We’re convinced, with even expensive web hosts, you don’t get what you pay for. We want cheap, shared hosting. We prefer not to share our server with too many other people. (For example, PagePipe shares with 24 other web domains). Use yougetsignal.com to find how many domains are on your server.
Time to First Byte Specifications
We want to get a good TTFB (time to first byte). This is a measurement in milliseconds. It’s how long a user’s browser waits before receiving it’s first byte of data from the host server. It includes “network latency.” Data makes trips back and forth between server and browser. A long wait slows down seeing the page. Theme selection doesn’t affect TTFB. It is completely host dependent. But if your theme is too slow and your TTFB is slow, also, you’re doomed to always have a slow site.
- 100 to 200 milliseconds TTFB is excellent.
- 300 to 500 is good.
- 500 to 800 is average.
- 800 to 1000 milliseconds is poor.
- Above 1 second is not “happiness.”
One client using BlueHost shared a server with over 2,000 other domain names. They wondered why their TTFB was always 4 seconds. Ouch!
TTFB is not web speed. It’s server responsivity. You can measure TTFB online with WebPagetest.org or with http://www.bytecheck.com/
When you design a site for strategic speed, you use a performance budget. The industry-standard budget for best practice is under 2-second page load time. If your TTFB is 800 milliseconds, that server overhead reduced the amount of budget to 1.2 seconds. If TTFB is 100 millisecond, you have 1.9 seconds of pure luxury. That sounds like a small bonus. But believe us, you can add many extra features in 700 milliseconds.
Did we search for a shared host with 100 to 200 millisecond TTFB? Yes. And we found one. And even tested it: ipage.com We don’t get a kick back. We’re not an affiliate – so only click the link once. Save electricity. Did we switch to iPage? Nope.
Read about fast, web-hosting reviews offsite at: Woodstitch
More about TTFB improvement offsite at Kinsta.
NOTE: On these two links above, their reporting is honest. But it didn’t always match our experience in every regard. So test for goodness sake!
SPEED NOTE: After reading Brian Jackson’s article at Kinsta, we decided to try Cache Enabler plugin again. We saw no benefit before – as a caching plugin – and unknowingly tossed it. But Brian was claiming it improved TTFB. We found it hard to believe. This time we watched a video on how to set it up. TTFB dropped from 600 milliseconds to 350 milliseconds. That speed benefit happened across the board on every theme tested. Fantastic! We turned “GoDaddy-quality” into “iPage-quality” hosting with no extra cost! Thanks, Brian.
There are 4,476 free themes in the WordPress theme directory (1Q 2017). Of those, only 1,470 are responsive. All the rest are fixed-width junk. No one should design today with a theme that doesn’t adapt to small-screen size. That limitation immediately reduced the number of candidates.
We had three criteria for the remaining 1,470 free responsive themes.
- Updated in 2017. Too many changes occurred in WordPress during the last quarter of 2016 and the first quarter of 2017. Some were functional and some security issues. We only wanted current and active themes supported by conscientious authors.
- The zip package size must be under 1M download. An arbitrary cutoff based on our experience unpacking, examining, and testing themes. It’s our rule of thumb. Only theme authors who care about speed keep the download package small and tight.
- They can’t be a child theme.
That reduced our database or sample size to 155 themes. That’s all! Those 155 themes went into a spreadsheet and sorted by decompressed package size. We then examined the contents of the TOP 10 smallest packages. And we also considered the number of active installations (popularity).
These themes by nature are plain and unadorned. Boring but functional. The principle goal is communicating and publishing. We want web content readable on a small device. Expressive aesthetics are second priority. It boils down to reading. People rarely view portfolios seriously on phones.
Speed Strategy requires:
- Focus on content and interactions. Not on details, images and elements (space-filling prettiness).
- All elements must have purpose and value.
- Design for user experience – easier content consumption.
- Test on a small screen first and later a larger screen.
We loaded sample content “test-data.xml” from WordPress’ Theme Data Test page.
(Use WordPress Importer plugin and Dashboard > Tools > Import).
We installed the following free, speed enhancing plugins:
- Disable Emojis
- Far Future Expiration
- Remove query strings from static resources
- Rocket Lazy Load
- WP jQuery Plus
- WP Super Simple Speed
We installed the TOP10 themes candidates on a cheap, shared-hosting site (GoDaddy). And checked each resulting load time with Pingdom.com:
(Sharing with 25 other domains. TTFB: 500 to 600 milliseconds. Install Cache Enabler plugin and subtract 200 milliseconds from the load times below.)
|theme||installs||fonts removed||load time ms|
We stripped the webfonts using Remove Google Fonts References plugin. We prefer websafe fallback fonts instead. Removing webfonts reduces 160 to 260 milliseconds from the page speed. Those are the final speed numbers shown above. We recommend this extreme method for mobile performance. Most people can’t tell font differences on small screens anyway. It’s a waste of resources. Most designers are underestimating the effect web fonts have on mobile speed.
Google Fonts is an open-source, third-party, font directory. According to BuiltWith, over 44% of the top 10,000 websites use Google Fonts on their websites. Slow. They need linking to an external asset on a distant server. You might see errors or warnings that the resources are missing a cache validator. Or that they require expires headers. These are fixed at the server level, and when they are on a third-party server you have no control over fixing them. Don’t use Google Fonts. Easy speed solution.
We then focused on the TOP3 themes popularity: Pacify (1000), Basic (10,000), and Generic (500). Basic Theme had something the other two didn’t: 10,000 installs and lots of functionality. Popularity doesn’t count much in our book. But in this case, the theme will have a longer shelf-life potential. Basic Theme is our final choice.
Mobile WordPress Speed – without coding!
What others think of us: