top of page
Search
  • Writer's pictureZsolt

WordPress blogs: are they even capable of mobile friendly design?

Updated: Aug 16, 2019

Bloggers are commonly anxious about their blog's SEO, their social media coverage, the relevance of their content, but how about user experience? UX is crucial when posting any sorts of content on the Internet. Users decide whether they like your site in less than a second, they only feel the site's responding instantaneously if the interaction-to-action time is no more than .1 second and these are only the most well known time indicators of a well designed website. Developers / editors should also consider the site's design & performance on mobile devices, or e.g. what and how should they show on these smaller screens as most visitors will be probably reading their posts on one such screen.

Luckily, most bloggers don't have to go the extra mile to have a great UX as the content providers do it for them, but it's still worth paying attention to. Why? Let's see WordPress' performance for mobile browsers, and the potential problems creators might face, on some real-life examples.


As the first example there is an article about 10 great sample WP sites. Opening one of these great samples, the first thing I can recommend for anyone developing absolutely any kind of website: please use HTTPS, not HTTP, it's 2019, and it's free. Then there's the load time: the first thing readers will see of the site is it's loading for ages. Not a great experience.


Use Chrome audit

Just open Chrome, press Ctrl (Cmd on Mac) + Shift + I, or F12 select the audit tab and run a test for mobile performance yourself

These tests were run on two of the 10 sites. It's clear that the one on the left is way slower. They are both hosted by WP, they both should be great sample sites, what's the difference? The key in these two is the right not being flooded with extra large images. Having images on the landing page is more than common, but why downloading multiple HD pictures on a phone? It potentially eats up the users' mobile data, it loads slowly, and doesn't even make sense in some cases when the device isn't capable of such high resolutions. Best practice for images is making them responsive, so every device size is served with the proper resolution. For more on WordPress image handling, read this.


Open the blog on an actual phone

The one thing content creators could and should do is taking a look at the site on their smartphone. This way they could see if there is an overuse of spacing elements on their menubar, or if their blogpost doesn't start with a 150 pixels of purple nothing (also 3 spacer elements in this case, but could've been anything). A similarly common mistake is word wrapping gets messy on smaller screens. Imagine how the reader's experience is effected when you see wrapping like this:

Also worth a mention: creators should check if scrolling from the top of to post's page to the start of the actual content of the post is fast, for example having a header, the site's photo, a social bar, an advertisement banner might add up to 2-3 scrolls.


Good examples?

For good examples, I went and checked techcrunch.com, and the WordPress blog, as they are big, high traffic sites both built on WP's platform. TechCrunch failed miserably on the performance test, as I suspect they use many plugins and those run synchronously on the main thread and that's causing that unexpectedly high JavaScript execution time on their pages, at least that's what the results suggest. On the other hand WordPress blog has as decent performance as any of the visited WP blogs. This also means that it has wrong sized images all over and that WP has difficulty finding a systematic solution to this problem.


Good example!

Where else than Google. Take a look at the angular.io documentation page: it's fast, responsive, uses all the best practices available to date and is even a Progressive Web App. This is how every site's audit should really look like:




Summary


Building a blog on WordPress is still, as always, easy and a sound choice. They have really great SEO tools and tutorials, thus none of the analyzed sites had lower SEO score than 85. The performance and responsiveness of these pages are at best a C-, as none had better performance score than 70 and the mode was rather in the mid 20s. Anyone blogging on the platform (on any platform really) should keep an open eye on page load times, image sizes and how the site look on a mobile device, WP won't do all for them in this case.



18 views0 comments

Comments


bottom of page