Top 25 Ways to Speed Up Your WordPress Website

web3.com.au

1. DEPLOY ON A CDN - USE MAXCDN OR CLOUDFLAREWHY SHOULD I CARE ABOUT SPEED?

• 47% of consumers expect a web page to load in 2 seconds or less.

• 40% of people abandon a website that takes more than 3 seconds to load.

• A 1 second delay in page response can result in a 7% reduction in conversions.

• If an e-commerce site is making $100,000 per day, a 1 second page delay could potentially cost $2.5 million in lost sales every year.

Source: KISS Metrics

1. DEPLOY ON A CDN - USE MAXCDN OR CLOUDFLAREWHAT WE’LL BE COVERING

• Quick and easy ways to speed up your website

• Tips on how to optimise images, media, audio & video for better performance

• Tips on how to make better decisions about your website to net better performance

• Tips on how to speed up your website for mobile devices

1. DEPLOY ON A CDN - USE MAXCDN OR CLOUDFLAREUSE MOBILE-FRIENDLY TEST TO SEE IF YOUR WEBSITE

IS MOBILE FRIENDLY (IN GOOGLE’S EYES) OR NOT

1. DEPLOY ON A CDN - USE MAXCDN OR CLOUDFLARE

2. CACHE YOUR SITE - USE W3 TOTAL CACHE OR WP SUPER CACHE

3. AVOID CHEAP SHARED HOSTING - USE PROPER WP HOSTING

4. APPLY THE 70/35 IMAGE COMPRESSION RULE

5. COMPRESS YOUR IMAGES (PT1) - USE PNGGAUNTLET

6. COMPRESS YOUR IMAGES (PT2) - USE IMAGEOPTIM

7. COMPRESS YOUR IMAGES (PT3) - USE IMAGEALPHA

8. AVOID IMAGES FOR GRADIENTS/PATTERNS/SHADOWS - USE CSS3

9. FOR SIMPLE, SMALL IMAGES, COVERT THEM TO BASE64 CODE - USE PATERNITY

10. CONSIDER USING FONT ICONS OVER IMAGES FOR BASIC UI

11. LIMIT FONT ICONS TO ONLY WHAT YOU NEED - USE ICOMOON APP

12. OPTIMISE YOUR CSS - RUN CSS THROUGH CODE BEAUTIFIER

13. CONSIDER DYNAMICALLY LOADING PREFIXES - USE PREFIXFREE

14. LIMIT USE OF GOOGLE FONTS FAMILIES AND WEIGHTS

15. FOCUS YOUR WEBSITE - USE MOBILE-FIRST DESIGN PRINCIPLES

16. PLACE YOUR MEDIA QUERIES MOBILE FIRST

17. PUT JAVASCRIPT AND CSS IN EXTERNAL FILES

18. CONSIDER USING INLINE JAVASCRIPT/CSS FOR SMALL ELEMENTSABOVE THE FOLD TO DECREASE ABOVE THE FOLD RENDER TIME

19. USE CSS ANIMATIONS RATHER THAN JAVASCRIPT FOR SIMPLE ANIMATIONS

20. USE CSS MEDIA QUERIES FOR LAYOUT OVER JAVASCRIPT DEVICE DETECTION

21. AVOID BLOATED PLUGINS - USE P3 PERFORMANCE PROFILER

22. LAZY LOAD IMAGES & SCRIPTS BELOW THE FOLD - USE UNVEIL.JS

23. HOST VIDEO AND OTHER LARGE FILES OFFSITE TO REDUCE SEVER LOAD AND BANDWIDTH

24. PERIODICALLY CLEAN UP YOUR WEBSITE’S DATABASE - USE WP OPTIMIZE

25. CONSIDER BUILDING YOUR NEXT WORDPRESS WEBSITE FROM A LIGHTWEIGHT FRAMEWORK

WEB3.COM.AU/SPEED-UP-WORDPRESS/