WordPress Speed Optimization – The Complete Guide

We live in the age of now! everything is at your fingertips thanks to technology. Browsing a website is no different and when you think of why you browse a website its usually to find information, feed a secret habit, buy something, stalk someone and so on and so on. When you browse or stalk what ever tickles your fancy, you have a subliminal time allocated to the task. The exception for this is FaceBook and the social media, like where you can be lured with flashy images and click bait titles to lose hours of your day. When the target website you want to visit has a loading  time over 3 seconds, you generally like me lose interest in watching the little page loader spin in circles waiting for the website to load.

In this guide we will cover some tips and techniques that you can use to optimize your website for speed.​

Google made it clear that having a fast loading website was one of 200 ranking factors. This is something that should not be ignored with the way we are heading with a mobile first browsing habit. Imagine your customers visit your web store to buy those brand new Nike KD9’s and your site takes 7.5 seconds to load but Larry’s most best nike store loads in 2 seconds. The truth is 9 times out of 10 you lose that customer to damn Larry for having a sucky slow website that takes forever to load. Larry on the other hand is balling thanks to his speed first website taking all the orders. Having a problem like this can kill a business that depends on online orders and that is the hard truth.

In order to perform surgery a doctor must know what is wrong with the patient, we will be taking the same approach. Firstly you need to know whats wrong with your website before you can fix it. This WordPress website speed optimization guide will show how to take steps to make your website load faster.

Execute a Website Audit

First lets identify your targets, use this speed testing tool to calculate your performance optimization budget, just input your desired load speed and connection type. All credit to Jonathon Fielding​ for this neat tool for planning out our performance budget. The tool is a little off but it is also very handy and gives you a guide of where you need to be focusing on for improvements.

Now we need to measure how far off you are from your target load speed. Use all six of these testing tools to identify your website speed problems, we will want to work on these with the techniques and tips outlined below. Use the tabs below to begin your website audit.

When you execute your speed tests with Pingdom, 90% of people who use this for this exact test only measure the home page. Understanding you also have other pages that need to be tested is website auditing 101, Now check your product and category pages make sure you dissect that report so that you know just what is slowing down your site and where it is. The data you will get returned by Pingdom will contain page size, page display load time and the overall performance grade. You will have the option to see what areas require action for improvement and a very handy page analysis feature that tells you in summary content type browsed, time spent per website and the domain, very useful for data nerds like me.

Next run your site through the other toolsets and record the data, some results may be different from different tools. If you have a competitor website that you want to see where they are and what the difference is between the two websites use Which Loads Faster for a side by side display of the two websites. This is very handy for competitor analysis.

Now you have your website speed optimization to do list, and you can work alongside this guide to fix the problems. For those that are more SEO inclined and looking for a beefy test tool to showcase problems to potential clients during video audits a popular website for this is GTMetrix very detailed reporting and easy to understand where the problems are. Another very popular tool for this is SEMrush, you can point out client and competitor traffic stats and some site problems if you have set projects up. 

Read our Ultimate guide on WordPress SEO​

Firstly this is a guide for WordPress websites and not shopify stores or magneto or other CMS websites. The information is applicable to websites developed on WordPress only some may work with other platforms so use at your discretion.

Page Load Speed

Getting 100 on the Google page speed testing tool is like catching a unicorn, extremely rare! but just how close can you get to 100? I haven’t seen a perfect 100 score from anyone in my communities that was legit and not photoshopped. If you have proof of a perfect 100 score with the Google page speed testing tool please post in the comments Id love to see this unicorn.

​Kissmetrics conducted a case study where they asked specifically about page speed load times and they found that 51% of users with mobile internet say that they’ve had a website that crashed, froze, or received an error while going to make a purchase. Every second past the ideal loading time of three seconds costs you a seven percent reduction in sales! If an e-commerce site is making $100,000 per day, a 1 second page delay can potentially cost your store $2.5 million in missed opportunity revenue each year.

Page Load Speed Key Points:​

  • Better UX
  • Lower bounce rates
  • Load speed is a ranking factor
  • Increase in organic traffic and conversions​

Look at your website speed score from your tests, If you have a score of 50 and above that average standard with a lot of room to improve. If you have a website score of 70 and above well done you are a Wiley web head but don’t get ahead of yourself you can still improve your score. 

​How many resources will a browser download from a given domain at a time? This all depends on your resource set up and the drain your website will be putting up to load. For an isight into browser resource requests visit this site for a sneaky tip.

Now you know page load speed is important enough but how do you measure the good speed from the bad apart from the obvious, ​

Use this as a guideline:​

  • Below 1 second perfect
  • Below 2 seconds above average
  • From 2-3 seconds decent
  • From 3 to 7 seconds is average
  • Above 7 seconds call a doctor

The above guidelines came about from a case study carried out by university students on peoples expectations regarding website load times and the amount of time that passes before they would bounce from that website. The study revels that 47% of people expected the websites to load within 2 seconds, and 57% of people said that they would bounce from a website if it took longer than 3 seconds to load and fair call on that. 

For everyone with slow loading websites now is your chance to target that 43 % that were not phased with the 3 second load time.

​John Mueller a webmaster trend analyst for Google stated on Twitter that his benchmark for page speed load times is around 2 to 3 seconds. He also stated his go-to testing tool was Google’s page speed insights test tool.

If you read this guide and action the items that you found as errors or warnings on your tests, you are going to have a head start. Your competitors might be web savvy but chances are they are not as web smart as you. Getting all your ducks lined up so that you can put the best website forward to Google for consideration as having a fast loading website​ puts you in a good place for getting those page 1 listings.

To understand where you sit and where your competitor sits on the speed dial a popular competitor research tool is WhichLoadsFaster ​

Neil Patel completed a case study on Walmart, in the case study they uncovered that customers would abandon cart when load times jumped from 1 second to a 4-second load. They also found that for every 1 second of increased page load speed that the conversion rate increased by 2%​. 

Just think of what 2% of sales for Walmart means, Walmart was recorded to have operational a total of 6,300 stores in March 2016.

Slow websites affect website visitors as shown in this example, if you optimize for speed you must include often overlooked association factors for your overall website speed optimization plan.

A wise habit to implement is weekly checks on not only the website but on your analytics. Measure and record the bounce rates and decrease in page views, that could indicate a problem.​

​ Why Ecommerce Store owners should read this guide

Hosting Success

To have a fast loading web page you need solid foundations, by this I mean having premium hosting helps considerably. Fun fact we actually recommend several hosting options right here on Bit Pak.​ 

If like me you have more than a couple of websites for whatever reason you will know the headache of increasing your hosting plan or managing multiple hosting plans. Ive tested a dozen or more hosting services and I can tell you the stand out’s for adding speed to your load times have been covered in our Top 10 Reviews.

Hosting Tips:

  • Cheaper hosting services will have down time
  • More expensive hosting services are up 100% of the time.
  • When Hostgator is down so is the support.
  • ​The more you can do to reduce server requests the better.
  • You have to spend money to make money.

When I took the dive into making a full time living from web marketing it was all about the budget making sure I didn’t spend to much on hosting and splurging on a premium hosting plan so I could have a lot of test sites for trying new techniques, themes and plugins. ​My point is the $2.95 monthly hosting fee and those 12 months free when we build your website plans are not up to scratch for helping your website and may be hurting your website.

Caching

A quick win for cutting load times in half is leveraging the power of caching. To set this up you can use one of many WordPress plugins that do this well, I recommend free downloads WP 3, WP Comet Cache, WP Total Cache and finally WP Super Cache.

When you utilize a caching plugin you don’t just get browser caching functionality if you have one of the good ones.​ Once installed it pays to actually visit the plugin settings section of the caching plugin to se what other hidden features they offer.

HTTP Cache Headers

Header caches work on freshness and by validating the content delivery. A cache will utilize a fresh replica of available content assets but a validated representation will send snippets of the entire representation if it is unchanged. 

Server Cache

Server side caching varies in performance based on the overall traffic of the websites it would be more common on higher traffic sites than smaller more local orientated websites.  When setup to respond like so cache control directives will control who caches the responses, how long for and on what conditions. Using a server side caching method allows for every resource to establish its own caching policy from the HTTP cache control header.

As the image to the right states, I was casually checking out some competitor blogs and came across a website where a guy was speaking about optimizing for speed and gave some props to his friend Matt who has a beast of a speedster website. I took the chance to check out this intriguing speed demon of a website and the below image is what I arrived to and I refreshed the browser twice.​

​I don’t know who Matt is and sorry Matt but that actually happened as I was writing this article. Timing is impeccable and I gave an extra chance to see if the website would reload but it took me all of 6 seconds to bounce off the website. 

If anyone wants to reach out to ​Matt by all means, go fourth and help a brother out.

Cache Control.

One of the most important HTTP cache headers is probably Cache-Control which is a header comprised of a set of directives that allow you define when / how a response should be cached and for how long. HTTP caching occurs when a browser stores copies of resources for faster access. This can be used with your HTTPS implementation

​Content Delivery Networks 

You might not of heard of a content delivery network in its entirety before as it is more commonly known as a CDN. What a CDN does is hosting of your media files across global servers all connected to the CDN. When your website is loaded the server nearest to the  geo location of the web page visitor​ is used to action the request therefore removing the strain on your website to load those media files. This type of delivery system is excellent at increasing web page load speeds by reducing the load that a single server would of endured. 

What kind of speed reduction could I see when I use a CDN? You can see a reduction in 40 to 60% of load times that alone is worth looking at. Some of the popular CDN’s are MaxCDN and Cloud flare.​

Another positive about using a CDN is they are handy at helping protect your website against sudden spikes in traffic for example your photo of you in a spiderman costume goes viral and 2 million people visit your website to see this picture your normal server may not be set up to handle that kind of traffic. Using a CDN you have the access to multiple servers that can spread out the load and handle large surges in website traffic.

You can add to the benefits of using a CDN protection against DDoS attacks ​

Load Testing

You should test your website stress load by checking to see what may be causing problems and forcing your site to react slow. This can also be used for testing your backend of your website especially on a WordPress website you should test your plugins and deactivate any that you do not use. 

WP Performance Profiler is very good at locking onto to plugin hogs that slow down your website.

Blitz is a good performance testing tool

  • Load Impact – Three things LI is good at 1 API testing, 2 Web & App testing, 3 Automated testing
  • Blaze Meter – Open source performance based testing, real user testing captures real mobile traffic.
  • Blitz – Test web apps, APIs and website performance

For load testing tools these websites have various testing features just pick the one that has the features you need to test away. 

Reduce Your HTTP Requests

The fancier you make your website with plugins and interactive media the more you call on your stylesheet and the build up of dependancy requests are made. These slow your page load speed considerably, every time you install a plugin or add an image to gallery that boosts the beefiness of the layers needed to display your web pages. Lightweight wins every time, 

How can we minimize HTTP and dependancy requests? well let us leverage CSS sprites, image compression, minify everything and utilize SVG (scalable Vector Graphics). Exhaust all methods of scaling down the requests, Using a CDN is another great way to remove some of the strain and we covered that in the above paragraph.

Checking Unused Requests

For the corporate and ultra professional websites you might want to remove a well known more suited to mobile texting friends feature. Emoji’s should be kept to the mobile phone text to text basis and not have a place on websites that are all about business.

To remove emoji’s from your website requests you can use this WordPress plugin to make it an easy actionable task.​

For those DIY types that love getting their keyboards dirty here is an excerpt for the removal of emoji’s from your functions.php file. Look in your header for the default, javascript file wp-emoji-release.min.js?ver=4.3.1 this should be in your header section, if you don’t see it you don’t have it. 

/**

* Disable the emoji's

*/

function disable_emojis() {

remove_action( 'wp_head', 'print_emoji_detection_script', 7 );

remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );

remove_action( 'wp_print_styles', 'print_emoji_styles' );

remove_action( 'admin_print_styles', 'print_emoji_styles' );

remove_filter( 'the_content_feed', 'wp_staticize_emoji' );

remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );

remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );

add_filter( 'tiny_mce_plugins', 'disable_emojis_tinymce' );

}

add_action( 'init', 'disable_emojis' );

​

/**

* Filter function used to remove the tinymce emoji plugin.

*

* @param array $plugins

* @return array Difference betwen the two arrays

*/

function disable_emojis_tinymce( $plugins ) {

if ( is_array( $plugins ) ) {

return array_diff( $plugins, array( 'wpemoji' ) );

} else {

return array();

}

}

​Take charge of your website and put a hold on requests for resources that are not being used and as outlined above do not work with the websites profile. Go through each page on your website and look at the code, as delightful as that sounds you could hire someone to do that for you and provide a report back.

Minify CSS and Javascript.

When I started web design it was like an Alice in wonderland trip, all this new information and a new world had opened up to me. That new world came with some scary terminology JS files and CSS. At the time I didn’t know what these were or how they interacted in web pages, it was a little scary going head first into the technical side of web design. There is no point and click web builder were we are going.

I managed multiple websites and a common problem regardless of the type or design of the website was the JS and CSS files. WordPress a serial pest with hoarding defunct information would hold onto chunks of unwanted javascript files and CSS files loading like dial up internet. I can touch on compression of files again to fix this issue, but there was a plugin made just for this called WP Minify.​

Minify will compress both the Javascript and the CSS files into one single file that reduces the load times instead of having the default setting that installs chunks of JS and CSS every time you instal a new plugin, and holds onto it.​ Use Minify to delete old files while reducing the load time, what a  genius.

What is CSS?

CSS stands for Cascading Style Sheets a language for describing how web pages should be presented. The description covers all design elements including how colours, layout, and fonts should display. This language can be used to change the adaptiveness of the presentation to different types of device sizes and screen lengths. The language used to identify fonts, colour, spaces and all style elements so that web pages can be properly interpreted and correctly displayed. The markup of CSS can be used when styling HTML, XML and XHTML.

What is JavaScript?

​an object-oriented computer programming language commonly used to create interactive effects within web browsers.

​Best practice for using JS and CSS is to have CSS sitting at the top of your page and then add Javascript near the bottom of your web page. The reason behind this is for loading, a browser needs the CSS file to begin loading the page. Javascript is placed lower as its mechanism is to prevent parsing of the browser before its loaded and after the tag.

Where you can use a CSS sprite, a sprite is a large image file that contains all of your web pages images. They work by being one image with 100 images within them and by hiding the other images. The usefulness of CSS sprites are that loading one item while a large size is faster than loading 50 items of smaller sizes. Think of it like this, One browser request one image item load request and you have a page load on one request while showing 50 images. The key is to minify the JS & CSS requests, Harness the Sprites to use one file instead of 50 and to cut out the need for a request heavy browser.

Word of advice is to check on requests that you don’t need. When I say this I mean why does your contact form need to be called on when on your blog pages, or why does your blog commenting system need to be called on while browsing the about us page. Reduce requests that are unrelated and help reduce the overall request profile.​

The website Spriteme.org is great for taking care of sprite business.​

RTT’s Optimize Your Round Trip Times

Round trip times are amount of time it takes for the client request to send and the server to answer with a response. When you really narrow down and think about what happens here the exchange it can be quite fascinating, in short if the requests are light then the response time is fast but if there are lots of requests then the response time is affected. Always minimize requests and minify files.

Monitor the use of any redirects with total RTT, if the total time is lacking measure the importance of the redirect verse page load speed.​

  • Minimize redirects
  • Combine all JS files into one. Tech heads read this.​
  • Change CSS @import to <link> tag for each stylesheet.
  • Combine CSS Sprites with your images. Merge smaller images into one request.

Render Blocking Resources JS

You may find some of you javascript interrupts content above the fold, that will be affecting how the web page loads. The javascript coding sends unclear messages during the download that slows down rendering. To correct this problem check your JS code for the “jQuery” from the header of the web page in HTML.

Move the location of where the jQuery  snippet appears in the HTML of the web page.

Database Management

Databases can sound organized ​but even the most structured of storage can get out of line occasionally. WordPress is known for hoarding expired information, imagine holding onto all the update information, deleted themes, deleted plugins, post drafts, saves, image uploads and code snippets. One super handy and reliable plugin that whips databases into shape is WP Optimize, what it does is scheduled maintenance and clearance of your WordPress database.

​When you reduce the pressure of collecting and returning files to and from the database you can expect to save a couple of megabytes depending on how big and how untidy your database is. Code Like a Boss or source someone that speaks code in their sleep. Messy code can add dead weight to your load speed, not like adding fat Albert onto your website load time but the devil is in the details.

Compression Session

Ill state the obvious here, if you want to speed things up you need to compress file sizes simple science. Large heavy loads make slow movements while smaller compact loads are faster. ​

Understanding why we need to be compressing helps us understand other aspects of optimizing for speed. Take the second sentence of this section and read it again that is your optimize for speed mantra. ​

One plugin you need to be using is Gzip to compress website files. Speeding up the load time of your web pages is our goal and by saving any bandwidth we can will help us reach our goals. ​The process of Gzip is when you activate the plugin it zip’s your websites files into a zip file, when a browser loads the web pages they unzip form your zip file its an effective way to to transfer information fast.

Feeling a bit nerdy? You can add the same code to your .htaccess file here:

# compress text, html, javascript, css, xml:

AddOutputFilterByType DEFLATE text/plain

AddOutputFilterByType DEFLATE text/html

​AddOutputFilterByType DEFLATE text/xml

​AddOutputFilterByType DEFLATE text/css

​AddOutputFilterByType DEFLATE application/xml

​AddOutputFilterByType DEFLATE application/xhtml+xml

​AddOutputFilterByType DEFLATE application/rss+xml

​AddOutputFilterByType DEFLATE application/javascript

​AddOutputFilterByType DEFLATE application/x-javascript

​# Or, compress certain file types by extension:

​SetOutputFilter DEFLATE

​Unsure if you nailed it? not a problem, use this website to test your skills to pay the bills. In english this website will test if your website has Gzip enabled.

WordPress Theme Selection

Before you think about your WordPress theme you should of already had your website hosting setup for optimal speeds, along with using a CDN and now you are ready to add the theme elements into the mix. Optimizing for speed is the goal of this guide but important factors to keep in mind is mobile responsive design & user experience. 

The problem comes into play when you need a beautifully designed, functional website that caters to speed, takes care of the responsive design and allows maximum UX. How do you combine each of these elements into one theme? you search long and hard looking for your own preferences. 

There is a disclaimer and this is for all those in web design if you are presenting to the public as a web designer please do yourself some justice and have a website that is amazing. 

My own personal dilemma is my website theme, I was 14 theme changes in before I reached out for support and asked for someone to choose a theme and set it up for me, I even had the password changed so i couldn’t tinker with the design while they were setting it up. Yes it was that bad a sucker for design punishment but the end result I loved it. My weakness was seeking improvement for my website weekly changing themes looking for the ultimate theme, It exists but if like me you have this problem get a friend to set you up with a theme and run with it.

As well as having some recommendations linked at the bottom of this guide, if you’re an affiliate you might find these affiliate marketing themes useful.

WordPress Plugins

Yes bloating your website with plugins is more common than you think. We have an obsession with shiny objects and one trip to the WordPress plugin repository can wind up adding 5 new plugins to your CMS dashboard. 

What is Plugin Bloating?​

Im guilty of plugin bloating at some stage we have all been there. Having a plugin that does one set task and not a plugin that handles 5 specific tasks. Always revisit your dashboard each week and review your plugin settings what you actually use and what you don’t use. Deactivating plugins that you don’t use often can help reduce your overall load times and is also a good habit to get into.

Plugins that are notorious for slowing down websites:

  • Google Analytics plugin 
  • Heatmap plugins
  • In Dashboard analytics

Using Images

What is the right way to upload images to WordPress? Read this guide top to bottom and then ask yourself that question again. This is a guide for helping you optimize for speed there is 101 ways to do it but use this as your measuring stick and you will be on the right path. Your website multimedia will be your number one drain on the load times of your web pages, if you optimize the images you can cut your weight problem in half.

What image file size is a good measurement to aim for? Peoples opinion differ’s but I want to keep my images under 100 Kb.​

The creative team I work with live inside Photoshop. When they save their work they save it oblivious to file size, I had to educate them that there is an option that enables image compress called “Save for Web” a simple solution to those crazy 9 Mb file sizes they usually produce. ​

Why bother editing them? Imagine Ronnie Coleman is your website first thoughts he is a beast of a man. Ronnie is a very big man, bulky, heavy and an authority on building muscles.

Ecommerce store owners will come across this more so as the product pages tend to grow and grow before you know it, your website is a beast of a website a couple of hundred pages deep.​ 

Imagine Ronnie trying to adapt to speed as the determining factor in the Arnold classic tournament, how do you think big Ronnie will do with speed? ​He won’t win that battle.

How can you use Ronnie’s supreme bulk and optimize for page load speed? You minify images, compress files and make everything you have on your website smaller in size and use less resources. ​

For the people using Shopify, I think this will help Shopify Image Guide.​

I have used WordPress plugin Lazy Load to help with reducing the load time of images and found it useful on sites not using a CDN.​

Do they really slow down a site that much? YES large images can slow down a website. Multimedia files are the biggest drain on a website load time, by reducing the size of these multimedia files you can shave seconds off your load times. Plus if you have an athletic website like Mr Coleman you might need to bring in the big guns…FAT BURNERS! 

Fat Burning for Images!

Our Fat Burners are plugins that reduce image file sizes and compress data into smaller more easily accessible bite sizes. How do you do this? You can take charge of your compression session by using any of the plugins and browser add ons mentioned above. When you smush it you reduce the file size but not the image quality.  Compressing the image will save space and result in savings of requests on the server. When you upload images to the media gallery of WordPress the plugin reads the files in the background and when you go to use the image at the bottom of the right info panel of the media section is an option to smush it! you should always smush it.

Auto Scaling your images is bad practise for the reasons that with everything automated they need to checked over by human eyes. The automation isn’t broken its the human settings that control the automation, example auto scaled images may show smaller than intended or stretched further ending up looking distorted and not like the original uploaded image. Using auto scale functions for larger images often triggers the error with the image being minimised in display size, while helpful for the content creators its not the best practise. 

Tip: Always be thinking about mobile viewers.​ The world is turning to their smart devices to browse the web, think mobile and device for your websites as well. I would also add that AMP the accelerated mobile pages is a real thing here is the details on it and here is a testing tool on how to check your AMP.

One common problem I come across working with web designers is the lazy upload. I refer to the lazy upload method when a content creator or the designer uploads an image and instead of uploading the variant sizes they use auto scale for the image and this is ok in some instances but for the serious craftsmen reading this it is not ok! The example is your header image is also being used for a side banner and when the large header image is being loaded in the sidebar that file is loading as the larger header image to be auto scaled into a smaller sidebar image if that makes sense, a shortcut by design but a negative to your page load speed. 

You should be using responsive themes for the benefit of display flexibility, but if you are not then you need to be. Not using responsive design practises means having your images set for desktop, mobile and tablet. Do you know what is the most enjoyable thing to do after you have set up a website and gone live? It most definitely is NOT having to look at the site through a responsive view tester to see you need to edit multiple images.

Be responsive and use themes that take the manual work out of your hands.​ Reducing image sizes wont improve your site alone it is a combination of these techniques that will improve the overall score but the attention to detail splits you and your competitor apart.

Web Fonts

Using a theme called EasyWeb I noticed the Fonts were using a higher than normal allocation of resources and upon a closer look into other websites in that heavy digital design space it appeared to be the standard that because of race for the competitive edge most websites that looked decent enough to take a enterprise web design contract were using excessive font requests. Over 68% of these firms websites were also running slower than those websites that had opted to take a slimline approach and focus on speed over flashy design.  Heavy Fonts add extra HTTP requests and slow down the system, look at compromising on either design or speed to work your way around this one.

  1. Choose only the styles you need
  2. Keep character sets down to a minimum
  3. Prioritize based on browser support
  4. Your preference but host fonts locally or on CDN

Google fonts perhaps the heavier of the most used font family drains the request line, but a smart man would offload this strain to his CDN for an improved delivery. You can download the fonts that you need from Googles Fonts Helper site. Use this open source application to help extract what you need and then hit the download button to get your goodies. Fonts Helper will zip file the font package for you so you have everything stored together.

You will need to be semi organized here with your FTP readily available for the font upload. ​ Hit the fonts folder with your zip file and then you will need to begin the CSS update. Now this can get confusing and people will get lost, to avoid this use a plugin called Simple Custom JS and CSS. The CSS custom copy will need to be added to the header. You will need to update and point source URLs  to your CDN. Test this and see if you have Google fonts working from your CDN and also test your website speed with Pingdom.

google-webfonts-helper

Look at Your Link Profile

Take a good look at your link profile to see if you have any broken links, using 404 error code. How does link profile affect speed optimization? great question. Have you ever been to a website where they had a 404 page and if they did what did you do? bounced right off that website didn’t you, I know I do.

I used screaming frog on this website to check on some broken links I noticed while filling my head with information, Ive since contacted John  and let him know that there were several 404 errors and that Bit Pak is kick ass, so please don’t bombard him with cold outreach scripts for broken link replacements.

Digital Marketer has a very clever 404 page tactic that they use where they say something funny and then direct you back to a page they want you to go to right back into their strategic little hands. ​Why didn’t you bounce off their website when you hit that 404 page? because of the way the page was constructed they hit you with humour, very smart indeed.

When you decrease page load speed you are doing the right thing but if you can limit the 404 error pages at the same time then you will be eliminating the potential for a high bounce rate from your website. ​ Fixing these small items can help add up to an improved load speed and lower bounce rate.

Ive left some tools in the resources section at the bottom of this page that will simplify this part of the process for you.​ 

​Avoid Redirects

Limiting the number of redirects on your website can have a slight impact on your page load speed.​ If you have read the Ultimate DIY WordPress SEO Guide I mentioned using 301’s was a good thing and it is, it can also be not so good for optimizing for speed. Using a 301 is much preferred than having a 404 error on your website and 404 is horrible for your visitors unless you are as clever as Ryan Deiss. When you place a 301 on a web page thats great for SEO usefulness, but a browser still needs to hit that page understand the redirection and then locate and connect with the 301 end page.

If you have missing files you are going to have a 404 page generated and this is when they start building up can start to put a load tax on your server.​I used to use broken link checker on my website but I pinpointed one of the main vein drains to be that plugin so I deleted it and did manual checks, a little bit more time consuming but I think you should get to know your website enough to know how many pages you have off the top of your head. When I have to check other peoples website there is no questions, I use screaming frog every time. 

Redirects contribute to the total RTT and should be used with caution.​

​Time to First Byte (TTFB)

​This is the measuring of the time duration from the client making the HTTP request to the time the first data byte of the web page is received by the clients browser. Another measure that TTFB is used is for is measuring the responsiveness of a web server and other network resources.

Use these 5 tips to minimize your TTFB​

  1. Reduce your HTTP requests​
  2. Use a CDN
  3. Organise & Optimize your database
  4. Use RFPL (respond first and process later) caching method
  5. Monitor your server response time and make improvements outlined in this guide

BitPak Speed Testing Case Study coming soon.

Videos on Page Load Speed

Resources

Here are the tools mentioned in this guide feel free to use them and provide feedback on your results I’d love to see your speed increases as a result of this guide.

Speed Testing

  • Which-Loads-Faster​ – Compare your website speed against a competitor’s.
  • Pingdom – The most popular speed testing website.
  • Web Page Test – The presentation looks out dated but this is a sold test site.
  • Gift of Speed – Uses 16 elements to test web pages for speed.

Websites Mentioned:

  • CSS Sprites – ​Use this to combine your requests into one request.

Plugins Mentioned:

  • WP Minify – Combines JS and CSS files into a compressed single file.​
  • WP Smush it – WordPress plugin that helps you minify image sizes without losing quality.

Responsive WordPress Themes:

  • The Retailer – $55.00 powerful ecommerce focused theme, complete tracking for sales of products. Built in tax, shipping and product reviews.​
  • Bellaina – $75.00 Great for Real Estate websites giving you power to add filtered search functions and add multiple display options.  Map display previews and property submissions the perfect theme for Real Estate’s.
  • Salient – $55.00  A very smooth theme offering support for video background, plug and play for WooCommerce and set for SEO.
  • Porto – $45.00 Premium WordPress multipurpose theme comes with the revolution slider, pricing tables and drag n drop builder, Custom layouts and parallax design options.
  • Medicenter – $45.00 Designed for medical professional services websites comes with six pre-defined colour sets, 

Site Health Checks

  • Screaming Frog – Use screaming frog to scan websites (Free for 500 links per site) find 404’s and unoptimized pages
  • SEMRush​ – Identify website traffic, website health reports and keywords
  • Ahrefs – Backlink analysis and crawl reports, paid membership
  • Google Webmaster Tools – Search Console – Crawl Errors 

​For the lazy, time poor and people who skipped to the bottom of the page, just do these 3 things for an increase.

  1. ​Compress your images
  2. Instal a caching plugin
  3. Utilize a CDN

Conclusion

The race to be the fastest will continue and the rules will change as Google updates processes and algorithms. The list is extensive and doing half of these will help you improve your website page load speed optimization. Take your speed report from the first task you did and work your way through those errors, post your end results in the comments. I would like to see an improvement in web browsers and Im watching this space right now for movement. Having a good looking website is only one part of the puzzle optimize for speed and you optimize for success.