When developing a new website, chances are high that you end up using WordPress. And that’s a great thing.
About 50% of all website are built with WordPress. And when using WordPress you’re on a good way when it comes to your website speed.
However, there might be some problems, caused by your WordPress template (and other plugins) which are slowing your website down.
Today, I’d like to share the journey we undertook in order to speed up our WordPress site. And the great news is: You can do it too! Pretty much without a lot of coding skills needed.
How fast is your WordPress site today?
In order to optimize your WordPress site speed, you need to know where you’re currently standing at. Anaylzing the current situation of your WordPress site speed is an absolute must-have.
Enter a URL of one of your articles or important pages of your website and Google will tell you how good (or bad) your website’s performance currently is.
Have a plan.
We analyzed our own page exactly a week ago and realized that our blog could need some improvements.
And to be totally honest here, we thought that those performance improvements would take us days or even weeks to conduct.
However, to all our surprise this wasn’t the case. It was way faster. We put our heads together and got started.
After about two hours we were done. Yep – we were done.
So, I’d like to give you some insights on what we exactly did in order to speed up our WordPress blog. And what you can do as well.
WordPress is your SEO friend.
WordPress comes with a lot of built-in SEO requirements and enables you to easily add further plugins to make your website faster.
Pre-conditions for optimizing your website speed
I do not want to go into too much detail here, but optimizing your WordPress site speed, requires some essential preconditions which must be met.
Be sure to:
- Have a caching strategy in place
- Make use of a CDN
- Have the SEO Yoast plugin installed
- Have Google Webmaster Tools installed
- Make sure to have the latest WordPress installed
So here we go. In less than two hours, we conducted the following optimizations in order to speed up our WordPress site.
Some key facts:
- Optimize our blogs usersnap.com/blog (English blog) and usersnap.com/de/blog (german blog)
- Optimization goal: Get a grading higher than 85 on mobile & desktop
And most importantly: We didn’t want to spend days and nights optimizing our blog.
Clean up your plugins
If you have your WordPress site running for a while, I’m sure you’ll have some old and deactivated plugins in place.
So, before digging into the real work make sure to delete all unnecessary plugins. If you’re not using a plugin, not only deactivate it, but delete it.
When working on a new website, most people focus primarily on the design and UI of a site. It’s just the natural way on how we look and perceive our visual world.
However, the hyper-complex, image-heavy interfaces require us to use a lot of CSS.
And here comes the big drawback: CSS files which must be loaded (for displaying your extravagant web design) add to the loading time of your website.
In order to speed up your WordPress site you need to get clean up your CSS file(s).
Things you can and should do when cleaning up your CSS:
- The fewer lines of code you use, the better (reduce the number of line breaks, use simple comments e.g.)
- The smaller the CSS file size is, the better. Try to minimize your CSS file to less than 10 bytes.
- The probably most important thing: insert your CSS inline
I know that most style sheets are inserted as an external style sheet. Though it makes sense to insert the most important styles inline for ensuring super-fast loading times.
However, you need to make sure to minimize your CSS file, because it doesn’t do any good if you inline a CSS file larger than 20kb.
If you can’t insert the entire CSS inline, make sure to insert the most important CSS inline.
Example: Comments in CSS
/************************************/ /* Content Page */ /************************************/
/* content page */
PS: I don’t think that I have to say that the more complex your CSS file structure is, the worse it is for your website performance.
PPS: I’m fully aware of the conflict of design vs. speed. Everyone has to find the right balance here.
Optimize your images.
Images are beautiful to look at. Especially on websites.
But here’s the thing: Images add to the size of your page, and therefore influences your loading time. So what should you do?
The answer can be found in the image optimization process.
- Format selection: PNG images work best for logos, illustrations and text. In every other case, simply use jpeg.
- File size: I guess there’s nothing more to say than: the smaller the better.
- Image compression: You have to strike a balance between the quality and the size of an image.
So what did we do in order to speed up our WordPress site?
First of all, we installed the Compress JPEG & PNG images plugin. This plugin allows you to optimize and compress all your image material.
Every image uploaded to WordPress will be first analyzed, then optimized and finally saved as a smaller version. It claims that on average JPEG images are compressed by 40-60% and PNG images by 50-80% without visible loss in quality.
After installing the plugin, we compressed all our blog post images – a total of 4.113 images. All in all this optimization took us 10 minutes and cost us $32.
Other content optimization
If you’re using other content formats – such as videos and gifs – I’d recommend embedding those visuals via 3rd party services.
In order to make use of GIFs we uploaded all our gifs to giphy.com and embedded the gif with a little code snippet. The same can be applied to all our video material which is uploaded and embedded via Youtube.
In the end, we made in the green zone on the Page Insights test, though there’s still some room for improvement:
And most importantly, we felt some relief and happiness after seeing how these speed improvements affected our organic traffic growth.
A continuous approach.
Let’s face it. Optimizing your website performance by conducting the mentioned speed improvements can be a quick and easy win.
Nevertheless, we need to be aware that our website performance is a continuous, ongoing project. It doesn’t stop with single improvements.
What’s your experience with WordPress speed optimization? Do you know any additional trick? Let us know in the comment section below!
Quick update: If you’re looking for a user feedback tool for your WordPress website, I’d love to recommend Usersnap, used by software companies like Facebook or Google. Feel free to give it a try. It’s free for 15 days.