Home / Wordpress / 10 Killer Tips To Increase WordPress Blog Page Speed

10 Killer Tips To Increase WordPress Blog Page Speed

Howdy Geeks, Today talking on page speed, having a good page speed increases your blog seo. A blog that takes less than 2 secs to load gets lower bounce rate and also more preference by Google and Visitors.

Most bloggers work day and night to improve their blog page speed and reduce their bounce rate. We at Caffinegeeks are working hard too to improve our page speed and bounce rate to 2 secs which will not be that easy for us.

lets know the basics infomation first..

if a blog page speed reachs 5mb and has a bounce rate above 50% such owner or contributor to that blog is advised to improve their blog page speed/ bounce rate, why did  say so because the blogs become very slow to load and when your visitors tend to see your website loading slow they either quit visiting your blog or just find another blog to visit that why this is very important to bloggers.

what makes your blog page speed increase is when you add too much widgets, Javascript, Css, High quality images and too long Html codes.

The basics

For starters, the key to faster pages is reducing the front-end load time. For the end-user, 80% of the response time is tied up in HTTP requests. This is the performance golden rule. That means you have to minimize those requests.

Here’s how to do that:

  • Simplicity – Make the page design simple. One or two images and text. But you probably want richer components on your site.
  • Combination – Taking all the scripts and piling them into a single script and, similarly, combining all CSS into a single stylesheet.

The rest of the performance techniques I’ll share with you will also render HTTP requests lower.

1.Combine images with CSS sprites

If you have many images on your page, you are forcing multiple roundtrips of the server to get all the resources secured. This slows down page speed.

Sprites combine all background images on a page into one single image. The proper image segment will be displayed because of the CSS background-image and background-position properties.

CSS sprites reduce:

  • Delays caused by roundtrips made as the server is downloading other resources.
  • Request overhead.
  • Total number of bytes a page downloads.

You can use a service like SpriteMe to make this process easy. Otherwise, you can follow the sprite recommendations made by Google.

2.Enable compression

You can compress resources by using deflate or gzip to actually lower the number of bytes a page is sending over a network. Using the GZIP compression algorithm, popular web servers like Apache and IIS do this automatically on HTML, CSS and javascript.

You still need to optimize your content for compression. There are two things you need to do to make sure your web content compresses effectively:

  • Create consistency across your HTML and CSS code. This happens when you:
    • Order the CSS key-value pairs in a common sense way, e.g., alphabetically.
    • Do the same with your HTML attributes.
    • Be consistent with your casing and use lowercase as often as possible.
    • Make sure you are consistent with your HTML tag attribute quotes.
  • Minify JavaScript and CSS. By getting rid of unnecessary line breaks, extra space, etc, you will speed up parsing, downloading and executing.

I recommend using one of these tools to minify JavaScript: JSMin, Closure Compiler or Yahoo’s Compressor.

3.Spread your static content with CDNs

Because the location of the user impacts page load speed, spreading your content across servers will speed up this process. You can use a content delivery network (CDN) to make this happen.

What exactly is a CDN? It’s just a collection of servers that exist at different places in the world. CDNs do two things:

  • Send files faster – Cached files are sent from locations that are closer to the specified user.
  • Shrink file size – CDNs deliver content that is without cookies. No bloated files.

For example, a CDN service provider could have servers in California, New York, Sweden and Hong Kong. When a user accesses your site, the server with the fastest network hops or quickest response time delivers the content. Someone in the Philippines might get served from Hong Kong. Someone in Mexico might get served content from California.

Using a CDN is a pretty simple code change, but it can be expensive. And while some large Internet providers have their own CDN, it’s best to use a service provider devoted to CDNs.

4.Leverage browsing caching by using “expires” headers

Any time someone visits your website, his or her browser will store a ton of files like stylesheets, scripts and images onto that persons’ hard drive. That will reduce the number of HTTP requests and speed things up next time that person visits your site.

Those files have an expiration date in the header. This is known as “expires” headers. By default, that expiration date could be set to 24 hours, meaning it will update every day. Very few, if any, websites need that short of an expiration date.

There are two things about this rule you have to keep in mind:

  • Static components – Set a “Never expire” policy far into the future. These components become cachable, avoiding time-consuming and unnecessary HTTP requests. “Expires” headers should be used for images, Flash, scripts and stylesheets.
  • Dynamic component – Use a cache-control header to help the browser with conditional requests.

The “expires” headers will tell a server for how long to cache an item. Most static files should be set to one year into the future.

Expires: Thu, 20 September 2013 20:00:00 GMT

Apache servers should use the ExpiresDefault command to set the date in the future compared to absolute time. Using the example above, the command would look like this:

ExpiresDefault “access plus 1 year”

You will have to change the component’s filename when you change that component in the future. From Google, you can see what cache response headers HTTP/1.1 provides.

5.Enable HTTP keep-alive response headers

HTTP requests are simple: they grab and send a single file and then close. That may be simple, but it isn’t very fast.

Keep-alive is a trick that basically says the web browser and server agree to use the same connection to grab and send multiple files. In other words, the server holds the connection open while you are on the site instead of opening a new connection with every request. This way your processor, network and memory don’t have to work too hard.

6.Three performance testing tools

Besides the tools that I shared throughout this article to help you with each performance-improving technique, here are three basic tools that will evaluate your site and then give you recommendations for improving it.

Pingdom Website Speed Test

pingdom

This free page test tool from Pingdom will test the speed of your website. The results will match what real users experience because the test is done with real web browsers, including Chrome, where Pingdom tests load speed, records the performance data and so on. The results will show you what about a particular page is fast, slow or too big.

YSlow

This Yahoo tool grades a web page based on rules for high performance pages, gives you a summary of a page’s components, shows you stats on a page, offers performance analysis tools like Smush.it and JSLint, and then gives you a summary of what you need to do to improve your page performance.

 

Page Speed Insights

This is Google’s slick tool for web developers to help improve your website performance. With a simple drop of a URL into the text box and a click of a button, you’ll get your report:

page speed insights

Suggestions for performance are broken down into high, medium, low and experimental priority. This is the tool I used to come up with the recommendations above.

7. Use Google AMP

Accelerated Mobile Pages (AMP) is the blessing of 2017. Google AMP is designed to make your blog load fast on mobile devices and also on laptop devices.
With AMP, you can add lazy loading iframes, carousels, accordions, images, videos, audio players, advertisements etc and all these won’t affect your blog loading time.
Google AMP is officially the best way to add widgets and speed up any blog. It is very easy to setup and quick to use. I am currently making my blog AMP ready.

8. Use Less Widgets

As a blogger wanting to speed up your blog, you should start prioritizing widgets by removing widgets that are not necessary. By adding too many widgets at the sidebar and blog header, you are killing your site load speed.
Important widgets tend to be subscription box, Popular post, about author widget and a few more. This will help to increase your blog load speed. Aside from using fewer widgets, Use little or no widget in your mobile template.
Mobile sites can only make smaller requests, adding too many widgets on mobile templates will kill not only your site mobile friendliness but also the speed.

9. Reduce Number Of Post On Homepage

The higher the number of post on the homepage, the more images, CSS, JavaScript requests your site will make. Reducing the number of posts per page will improve your blogger blog loading speed.
You can easily do this by going to Layout >> Blog >> Edit >> Number of posts on main page

10. Use Automatic Read More

Adding a jump break (read more) helps to cut off a buck of work for your browser. Assuming you have 3 posts on the homepage, each post with at least 3 images.

While websites get richer and cooler, page speed slows down. So, each time you are getting ready to implement a new plug-in, code or rich media, you have to ask yourself:What is going to be the impact on page and site speed?

What is going to be the impact on page and site speed?

Sacrificing site speed to have the newest tool is probably not worth the money you may lose because of latency issues. So, until a tool proves itself as a money maker, it’s probably best to hold off.

What other ways or tools have you used to improve your site performance?

About Ayorinde Ayodeji

Ayorinde Ayodeji is the CEO of caffinegeeks. When he’s not busy making Caffinegeeks Products better, you can find him Biking, Coding, and Making researchs.Web developer and SEO Expert by heart.

Check Also

How to Create WordPress .Htaccess File

You can set many security settings using Wp .htaccess file, add rules for redirection, block …

Leave a Reply

Your email address will not be published. Required fields are marked *