Site Speed Archives - SEO Services Agency in Manila, Philippines

How Accelerated Mobile Pages (AMP) Affects SEO – Why it’s Important and How to Implement it

Tue, 22 Dec 2015 09:47:28 +0000

Accelerated Mobile Pages (AMP) has been out for a few years now and it has become an integral part of SEO. When AMP was first launched back in 2015, there were speculations that it has two benefits for SEO. One is it will have a “Fast” label designation on search engine results pages, and the other is that it will be a ranking factor. AMP was huge for SEOs back then however, its impact to SEO was yet to be seen.

Five years later since it was released, AMP is arguably more important than ever.

It is now a known fact that AMP is not a direct ranking factor in itself and having AMP pages on your website won’t necessarily increase it’s rankings immediately. But, Google now gives higher importance on website speed and mobile-friendliness with their switch to mobile-first indexing and the introduction of Core Web Vitals which makes AMP an indirect ranking factor.

I’ll take you through what AMP is and how you can use it to benefit your site’s mobile visitors.

What is AMP?

Accelerated Mobile Pages is an open-source coding standard for publishers. The aim for AMP is for publishers to be able to load their sites quickly on mobile since mobile responsive could be clunky and slow because desktop resources are heavy and plenty. If we’re going to be honest with ourselves, most of the elements of a desktop website are unnecessary for a mobile site. AMP greatly reduces the elements of a webpage and serves users a stripped version of a webpage.

Until recently, AMP was just for User Experience. Now, Google has backed it up – and is encouraging websites to follow suit. Much like how they heralded Schema.org and laid-low Dublin Core for Metadata.

Why is AMP Important?

Although desktop is still the leading source for Google’s traffic, mobile traffic is quickly gaining ground and it is expected to be Google’s number one source of traffic in the next years to come. AMP makes websites load extremely fast, if not in an instant, on mobile. This gives users the best experience on mobile.

Ever tried to load your site on mobile? Are you happy with the load speed? I know I’m not. Heck loading my site in desktop is taking long and I have a respectable amount of speed for my internet connection – but mobile? All I have is usually a clunky data plan with the mobile providers here in the Philippines.

Simply put, browsing on mobile while you’re on-the-go will mean that your internet speed is not always fast. So it’s best to optimize the experience of mobile browsing for all users (at least that’s what Google wants to happen) by standardizing a mobile version of your site with AMP. I’ll show you how to do it below.

Who will Benefit the Most from AMP?

I don’t believe that you’ll want to make your services or product landing pages into AMP. It would be stripped down of its first-impressions. That would defeat the purpose of your original design. So I don’t believe that everyone will be adopting AMP.

Thinking about our SEO Services site and how it would look like with AMP is just unimaginable. I think I’ll leave it as it is, thank you.

The sites that will benefit the most from AMP are publishing sites. Sites that produce content. So how you’ll apply this to your client is not by making their entire site into AMP. That might affect conversions negatively. Rather, you can transition your client’s blog section or news and updates section into AMP.

What’s the Difference Between AMP and Non-AMP Mobile Browsing?

One of the starkest differences is that AMP pages does not have a lot of stuff for a more complex user experience. Everything is stripped-down.

AMP forces you to use a streamlined version of CSS.
Javascript is not allowed at all – in fact, I’m still trying to figure out how to make share buttons appear on my AMP pages.
You are forced to use an off-the-shelf Javascript library that AMP provides you with – which forces your images to lazy load.

That’s it. Basically when you integrate AMP to standardize your mobile responsive pages, you are putting speed and readability as top priority over anything else – even over shareablility.

How can I Make AMP Work for my WordPress Site?

Here’s where things get interesting because you can actually integrate AMP in about 5 minutes for your WordPress site. Simply follow these steps:

Install the AMP WordPress plugin by Automattic
Activate the plugin – what it will do is append /amp on all your pages but what it won’t do is redirect mobile visitors to your /amp pages
So the next step is to edit your .htaccess file – you could use an FTP program to do this. I personally use Filezilla.
(Optional) Just in case you want to check if your AMP pages are working across the board: In your .htaccess file, paste this code:

RewriteEngine On
RewriteCond %{REQUEST_URI} !/amp$ [NC]
RewriteCond %{HTTP_USER_AGENT} (android|blackberry|googlebot\-mobile|iemobile|iphone|ipod|\#opera\ mobile|palmos|webos) [NC]
RewriteRule ^([a-zA-Z0-9-]+)([\/]*)$ https://example.com/$1/amp [L,R=302]

Note that you have to change example.com to your site’s domain name. I explicitly made the redirect into a 302 because we don’t want all the to link equity to be passed on to your /amp pages since it’s merely an accelerated mobile page version.

Lastly, you will want to edit the CSS to make your Accelerated Mobile Pages look and feel more like your site. You can edit the CSS using FTP by going to your wp-content -> plugins -> amp -> template.php

You could see that SEO Hacker’s Accelerated Mobile Pages still look and feel like our desktop page design – without all the fluff.

That’s it! You should be rocking AMP in no time.

Oh and before anything else, make sure you’re using rel=”canonical” tags to your original pages. Just to be sure to keep anything Panda related off your back.

How can I Make AMP Work for my Site if it’s not WordPress?

It’s not as easy as installing a plugin but it’s definitely more rewarding. You will have to go to the AMP Project’s site and learn how to integrate it via hard-code, hands-on.

If you want to know more about AMP, Moz’ recent Whiteboard Friday does a swell job on explaining it further:

That’s all for now. If I find out how to finally add some scripts for sharing in AMP, I’ll definitely update this post and let you know.

Verifying your AMP pages on Google Search Console

Once you’ve set up AMP on your website, Google will start crawling and indexing them. In a few days, you should now see that there is an AMP section under Enhancements in your Google Search Console account.

Google Search Console will notify you if there are any errors in your AMP pages. Just like any other coverage errors, it is divided into 3; Errors, Valid with Warnings, and Valid. When you first apply AMP on your website, there is a high chance that most of your pages will fall under Valid with Warnings.

Don’t worry, your AMP pages will still be available to users. It’s just that there are missing data that could further enhance your AMP pages such as structured data or image sizes.

Structured Data on AMP pages

Aside from loading speeds and user experience on mobile, adding structured data on your AMP pages also makes them eligible for Rich Results.

If you’re using WordPress, there are plugins that enable structured data on AMP pages. Google highly recommends having structured data on both the original page and the AMP version.

The post How Accelerated Mobile Pages (AMP) Affects SEO – Why it’s Important and How to Implement it appeared first on SEO Services Agency in Manila, Philippines.

7 Most Effective Ways to Speed Up Your WordPress Website

Wed, 17 Sep 2014 04:41:22 +0000

According to a study done by OnlineGraduatePrograms.com in 2012, one out of four people abandon a website if it loads more than four seconds. Amazon, in another research, calculated that a page load slowdown of just one second could cost them to lose $1.6 billion in sales every year.

These are just two studies about page speed, but if you do a quick Google search, you can find thousands of similar studies showing how important speed optimization is to a certain website.

In this post, I’m going to share a few ways to improve your site speed and hopefully help you get some more visibility on search after you’ve implemented them.

1. Choose a Good Hosting Provider

This may look like the most basic step, but it plays a huge role when it comes to improving the site speed.

I used to rely on cheap shared hosting companies and it worked fine, but with the wisdom of hindsight, I have learned that if you are running an online business, then you should invest in a good web hosting provider.

If you want your website to load quickly, you can start using premium WordPress hosting providers like SiteGround or MediaTemple.

After getting a good hosting service and improving your website’s speed, your next focus should be its security. For this, you need to make sure that you have DNS security enabled.

Having DNS layer protection will help your website in advanced protection, domain categorization, content filtering, etc. thus, improving your website’s overall performance.

2. Use a Premium Cache Plugin: WP-Rocket

A lot of you may already know about the free caching plugins like W3 Total Cache and WP Super Cache, but I am pretty sure none of you know about this shiny new cache plugin – WP-Rocket. In fact, this is the first premium plugin that was released in the market. Now, it is the dominating cache plugin.

This plugin can improve the speed of your website in a number of ways:

Page caching
Gzip compression
Image optimization
HTML & CSS Minification
Caching for mobile devices
DNS prefetching
White label

WP-Rocket is super easy to use and only takes 1-2 minutes to install and configure the plugin to your website.

3. Use CSS Sprites

A sprite is one image that contains all of your images. If you have a dozen of images, you can easily pack them into one big image via SpriteMe or any other similar tool.

Using CSS, you can hide everything except for one image that you need, by specifying a set of coordinates.

Personally, I don’t use CSS sprite as I only have 2 images in my stylesheet (logo and header background), and for small icons I use FontAwesome script. But if you have a large website with several images attached to your every blog post, then you need SpriteMe to pack all your images and thus, increase your WordPress site speed.

4. Optimize Your Database

By default, WordPress adds a lot of unnecessary information that needlessly inflates the size of your database by retaining spam comments, post revisions, trash items, and deactivated plugins.

WP-Optimize is a fantastic free plugin that optimizes your site and deletes all unnecessary stuff that is cluttering up your database.

You can also set your site to automatically delete trash after 2 days (by default, it is set to 30 days) or disable the post revision option.

To limit the number of post revisions that are saved, you need to add a line of code in your wp-config.php file. And if you want to disable the post revisions completely, set the value in the below code to “0” or “false”.

define( ‘WP_POST_REVISIONS’, 3 );

Automatically remove the trash items after 2 days, add the below code in your wp-config.php file.

define(‘EMPTY_TRASH_DAYS’, 7);

5. Use P3 Profiler Plugin

P3 Profiler is a great plugin, created by Godaddy. This is one of my favorite plugins because it shows me the plugins that I need to remove from my site.

Often times, WordPress sites load slowly because of poorly configured plugins. By using this plugin, you can easily spot which plugins are slowing down your website.

Most of the time, it is a social sharing plugin that negatively impacts the website speed. However, you can easily replace it with a plugin such as Floating Social Bar or Digg Digg, which doesn’t bloat the loading time of your site.

That kind of change is only possible if you can see which plugins are making your website load slower.

6. Use a CDN

A CDN is a group of networked servers located around the world. These servers store your site files and will deliver them to your visitors. For instance, if someone in Ireland visits your site, instead of it being delivered from your server in America, they get the content from the closest server to them in that network (geographically).

Another advantage of using CDN is that it can give you up to 50% reduction in bandwidth usage. Setting up a CDN can take you a few minutes but it can have a huge impact on your site speed if implemented appropriately.

Here are some of the most popular Content Delivery Networks:

MaxCDN – This CDN is the industry standard when it comes to WordPress CDN services. I use this service on most of my websites.
Amazon CloudFront – This is the service that is used by sites like Imdb and 9Gag.
CloudFare – It is a free content delivery solution, used by hundreds of thousands of bloggers. It also enhances the security of the site.
Photon in JetPack – Another free CDN service that once activated, will upload all your images to WordPress.com’s servers (which run on the EdgeCast network).

7. Optimize the Images

If you have been blogging for a while, then you know how important it is to have images for a site that relies heavily on content. Putting visual graphics such as images and infographics to your website helps you attract more traffic (particularly search traffic on images).

The activity shouldn’t just end with including images because you also have to properly optimize them for search engines. WordPress plugins like Smush.it and desktop based application like Shrink-O-Matic can help you optimize your images, making your internal pages load faster.

The post 7 Most Effective Ways to Speed Up Your WordPress Website appeared first on SEO Services Agency in Manila, Philippines.

Does a Dedicated Server Help with Increasing Site Speed?

Mon, 27 Jan 2014 12:52:01 +0000

I know that the title sounds more like an FAQ but hey, I haven’t found out one specific resource here that approaches to answer this question in an SEO perspective. It’s a very interesting topic because not everyone could afford to maintain a dedicated server.

The Need for Speed

Let’s get one thing straight: Site speed is very important. Not just for SEO and rankings, but for people who are visiting your site. A slow loading site can mean a huge bounce rate and no real value added to your User Activity profile, social shares, links, etc.

It can be devastating.

In the long run, one or two seconds of delay can be a huge ranking factor.

The Big Question

I was one to wonder if there would be significant site speed increase when you switch on to a Dedicated server. When I looked into the prices of a managed dedicated server, I was taken aback. I didn’t have the money then.

So I went ahead and pooled some funds to be able to test out my website’s load speed if it ran on a dedicated server. After purchasing a dedicated server, I started migrating my sites there. And you know what I found?

It does have a significant increase.

In fact, I never went back.

How Does a Dedicated Server Increase Site speed?

Look at it this way, if you buy hosting space for just one website, you’re typically renting that specific space (usually 1 gigabyte worth) from a server that’s hosting perhaps hundreds or thousands of other websites.

All of these other websites eat up processing memory, bandwidth, disk space, etc. Of course, the owner of the server would need to make sure that all of the websites are running so he would allocate limits to each site in order for his business to be maximized and profitable.

What happens is, you get an unseen sanction from the server. You are given a limited disk space, processing memory and bandwidth. While this is completely fine when you are starting out, it is not at all okay as you grow.

There came a point when SEO Hacker needed to run more than a handful of plugins for performance, functionality, and a lot of other stuffs I wanted it to be able to do. We also added SEO School, SEO Services, Growth Hacks and a lot of other stuffs on top of it.

These other sites ran on their own separate instances of WordPress and plugins I wanted to integrate.

We needed more space, more bandwidth and more processing memory. It made a lot of sense for me to go and get a dedicated server to make sure my websites were running at optimum speed.

Speed Cheat

2 New questions entered my mind:

What if I just didn’t have enough funds to buy a dedicated server ahead of my competitors?
Why doesn’t Google just simply tell us that this is one great way of increasing site speed (hence, ranking)?

After digging through site speed and dedicated servers, here’s the nearest answers I can think about:

1) You don’t need a dedicated server for competition if you do well with other SEO factors such as off-site SEO. Yes, site speed is an SEO factor but it may not be enough of a factor to compete with a good, quality, juicy link (although it may have a bigger effect in the long-run).

2) Because you can increase your site speed in a lot of other cheaper ways than buying a dedicated server such as:

However, all else being equal, the one with the dedicated server will always have an ace over the one without.

I won’t keep it from you, SEO Hacker and some of my most important websites are now hosted in a dedicated server somewhere out there. It was a big decision for me to get one just for testing. I want you to know that it pays – for me and for some of my clients who have decided to allow us to host their websites.

If you are obsessed with your SEO and want to completely maximize your site’s performance, get a dedicated server now.

The post Does a Dedicated Server Help with Increasing Site Speed? appeared first on SEO Services Agency in Manila, Philippines.

How you can Speed up your Site’s Load Speed by 40%

Wed, 04 Dec 2013 04:27:28 +0000

There is a really easy way to increase your site’s load speed by an amazing amount. I took one of my longest pages in my God and You site – which is my proposal video to my fiancee – and ran a speed test on it before I applied this performance increase plugin. Here are the results.

Webmaster’s Note: This tutorial is part of the tutorial series “Ultimate Guide to Site Speed Optimization“. The previous lessons consists of as follows:

Disclaimer: I used my God and You site because SEO Hacker blog (this site) is already optimized in terms of performance. You can check out our speed and performance optimization using Pingdom and GTmetrix.

Sluggish

The page loaded really slowly – a whopping 7.29 seconds! Pingdom considerately told me that my site loads slower than 81% of all their tested websites. That’s horrible!

Next thing I did was to look at my GTMetrix report. The page size is pretty consistent with Pingdom. I figured I have to reduce this number. And what better way to reduce a page size than to take away chunks of kilobytes of images?

So I did a little research and I stumbled upon a term called “Lazy Load” – it’s a method of delaying the initialization of an object (images, videos, scripts, etc.) until it is needed. Sounds very efficient doesn’t it? So I went ahead and sought out a plugin that can effectively “Lazy Load” my images. I tried a handful of them. Some were not too cooperative and some lacked the smoothness I was looking for. So when I found out the perfect plugin, I figured I have to go ahead and share it with you. So without further ado:

Drumroll please!

Introducing…

Advanced Lazy Load! (Clap Clap Clap Clap….*)

Now while I don’t know what’s so “Advanced” about this plugin, I do know that it does lazy load pretty well. Let me run you through the options.

Well would you look at that! It only has 2 simple options for you to tinker with. The first one is Pixel. Set it as high as you want for the image below the fold to load. Meaning, if your user scrolls down, the next images 1,000 pixels below the visible screen of your user will already load ahead. This is so your users will not wait for the images to load with every down scroll they do.

The second option is ‘Fading in duration‘. I set it as low as possible because I’m not that fond of the images ‘fading in’ anyway. And I think my visitors share my fondness. I want the images to load as fast as possible so as not to waste time.

Here are the results of the speed test after I applied Lazy Load:

The load time was reduced by a whopping 40%! That’s pretty huge – even if I’m still slower than 71% of all tested websites. I’ll have to work on that some more.

Page size was significantly reduced on initial load. Although we all know that the entire page is still around 2.2mb when all the images in the page are completely loaded. Lazy load just helps save time in the initial loading. It’s a way to cheat your speed and to signal to your visitors that your site loads fast – even if it’s still loading the images during their visit.

Tips for Keeps

I’ll keep this post short and sweet. Download the Advanced Lazy Load plugin. Activate it. Set the options to how I set it. Run it and check your speed using Pingdom and GTmetrix.

Coming Soon on Ultimate Site Speed Optimization Guide: Database Optimization.

The post How you can Speed up your Site’s Load Speed by 40% appeared first on SEO Services Agency in Manila, Philippines.

How to Implement Self-Hosted CDN for Site Speed

Tue, 06 Aug 2013 12:03:13 +0000

CDN is an acronym for content delivery network. While a self-hosted CDN defeats the purpose of the acronym because it is no longer a network, there are advantages it can bring to further optimize your site speed.

This entry is the third installment to our series Ultimate Guide to Site Speed Optimization – the series is a complete run-through of what I did to optimize SEO-hacker.com’s site speed. Lowering it down to a minimum.

What Exactly is a CDN?

In simple terms, a CDN is meant to distribute your static content to your users from the nearest possible data center to their geographic location. This makes loading the heavy stuff quicker because it is retrieved from the nearest place. It keeps the data’s travel time to a minimum.

Other effects of CDN is that it lowers down your server’s bandwidth usage because you’re feeding a lot of your static content straight from the CDN’s servers. You are also lowering down the processing memory being used by your server/s because the static content is processed and fed through your CDN.

Now that you know that a CDN is served from several different servers (depending on which one is the closest to the user), what then is the purpose of a self-hosted CDN?

Advantages of a Self-Hosted CDN

To put things in an extremely simple way, the main advantage of a self-hosted CDN is that it will enable your users to draw your static media files from another, potentially cookieless server. This additional pipeline will ease the burden of processing from your main server and allows them to download all your files simultaneously.

Here’s an illustration:

How do you Set-up your Self-Hosted CDN in 11 Steps

For this tutorial, I’ll be using the local server’s subdomain as the origin of the CDN files. First, off you’ll need the W3 Total Cache plugin. Download it here.

1) Turn the CDN feature on in the General Settings section and select Generic Mirror in the CDN Type

2) Next, go to your W3 Total Cache’s CDN settings. Here’s a screenshot of what options I turned on and which ones I left turned off in my CDN options

As much as possible, I want the static files such as image attachments, theme files, CSS and JS files to be hosted in the CDN so I ticked them on.

3) Change your CDN Hostname to your self-hosted CDN’s address. In this case, I used SEO-Hacker’s subdomain.

4) Login to your website’s cPanel and go to the subdomains section

5) Fill up the Create Subdomain form with whatever you want to name your CDN’s subdomain. I named mine as cdn.seo-hacker.com

6) Make sure that you assign the CDN subdomain to your public_html folder so that it will function as a Generic Mirror

7) Go to your cPanel’s Advanced DNS Zone Editor

8) Edit the CNAME of the two new subdomains that you created. Click the edit button

9) Change the Type to CNAME and then put your domain name in the CNAME, thus completing the Generic Mirror settings

10) Next, go to your W3 Total Cache’s CDN settings and click on Modify Attachment URLS at the topmost part

11) Modify the Attachment URL to your subdomain and click on the Start button

Wait for it to load. Close the window and voila! You have your new self-hosted CDN!

From now on, your website should be loading your static files from your subdomain. This will help unclog your pipeline from users siphoning all those static files from your main DNS.

Resources:

http://wordpress.org/support/topic/self-hosted-cdn-benefit-of-using-another-server-as-opposed-to-a-sub-domain

http://wordpress.org/support/topic/w3-total-cache-self-hosted-cdn-how-to-setup-the-subdomain

The post How to Implement Self-Hosted CDN for Site Speed appeared first on SEO Services Agency in Manila, Philippines.

Optimizing Site Speed: Asynchronous and Deferred Javascript

Sat, 20 Jul 2013 05:42:58 +0000

Most, if not all websites today make excessive use of Javascripts. Your social media buttons? Your plugins? Even your theme? 90% of the time they will include scripts. You are running scripts. Scripts bog down your site speed. Here’s two easy plugins that will take care of that problem.

Webmaster’s note: This is our third entry of our series Ultimate Guide to Site Speed Optimization. Check out our previous entry about the Must-Have Site Speed Plugin for WordPress.

Asynchronous and Deferred… What?

Before we begin, keep in mind these three things:

Parser is basically your HTML in its loading state
Net is the time that your script is being loaded to life
Execution is the time that your script is brought to life in your user’s browser

Basically the normal behavior of a website is to pause the HTML parsing while the scripts are executing. If your website is anything like mine, it means that there will be a significant delay before users will be able to see your HTML (your website’s main code, design, content, etc.). Here’s how a normal script load looks like:

Deferring your script is simply letting all your HTML load on your user’s browser first before executing your scripts. The good thing about it is that your website will immediately appear on your user’s web browser – making it seem like your load speed is blazing fast. My advise is to use deferred in case some of your users don’t use browsers that support asynchronous script loading. Here’s how a deferred script will look like:

Asynchronous loading of scripts is the best choice. HTML parsing and loading of your scripts will go on but your scripts will only execute when it’s ready. Taking up the least amount of load speed. However not all browsers support asynchronous script loading. Here’s how asynchronous loading looks like:

My advise of course is to optimize your scripts as both deferred and asynchronous. This is possible as stated in: W3C Editor’s Draft (HTML 5.1 nightly)

There are three possible modes that can be selected using these attributes. If the async attribute is present, then the script will be executed asynchronously, as soon as it is available. If the async attribute is not present but the defer attribute is present, then the script is executed when the page has finished parsing. If neither attribute is present, then the script is fetched and executed immediately, before the user agent continues parsing the page.

Where do I Start?

Well since Asynchronous Javascript is the best choice, let’s head over to the best WordPress plugin for Asynchronous Javascript loading. Wha’ddaya know, it’s named exactly as Asynchronous Javascript!

Click here to go to the plugin page. Download it, install it and it should be good to go. It could mess with some of your plugins though – especially if you’re using a slider. There’s an option in the settings section of your WordPress back-end for that. You can exclude scripts you don’t want asynchronous javascript to tamper with there.

Next up is Deferred Javascript. I looked it up, and it seems like the plugins with the exact names make the top of the line. The winning Deferred Javascript plugin is named WP Deferred Javascript.

Click here to go to the WP Deferred Javascripts Plugin page. Download it, install it. It doesn’t have any options so as to make life easier for you. It should be running for your users whose browsers are not capable of running asynchronous javascripts.

Tell me how it works for you and if you encounter any problems!

The post Optimizing Site Speed: Asynchronous and Deferred Javascript appeared first on SEO Services Agency in Manila, Philippines.

Must-Have Site Speed Plugin for WordPress

Tue, 02 Jul 2013 07:56:03 +0000

It’s not too hard to optimize your site speed if you’re using WordPress. There’s this plugin called W3 Total Cache (W3TC). Let me teach you what to turn on and what you shouldn’t play with in the plugin’s settings. This is bound to increase your site speed by a good margin.

Note: This is the second post on our Site Speed Series. Read up on the introduction of this post – Ultimate Guide to Site Speed.

Let’s keep this short and simple. Here’s what improved from my end:

How W3 Total Cache Helped me out

While there are lots of features of W3 Total Cache, I’m currently just using these:

Page, Object, and Browser Cache
Minify
Self-Hosted CDN (I’ll discuss this in the next entry of our series)

Important: Download W3 Total Cache here and I’ll run you through on each of the options.

Page, Object, and Browser Cache

Your webpage probably contains images, content, scripts, php codes, AJAX, iframes, and what have you. If your site is serving a lot of visitors, know that your server recreates each of those little things every time a user requests to access them – again and again and again. This can bog down your server. That’s what happened to me. I’m running a lot of scripts that made a lot of DNS lookups.

Ate up a lot of my processing speed which drove me crazy on finding a solution. If you didn’t know, here are two main reasons why caching is used:

Caching Reduces Latency – A user will ping your cache (which is supposedly a representation of your website that is “closer” to them) instead of the origin server, it takes less time for it to get your webpage’s data and display it. This makes the Web seem more responsive.
Caching Reduces Network Traffic – Your page’s “cached representations” are reused. Consequently, it reduces the amount of bandwidth you are using and consumes less processing speed.

Browser caching lets your users set aside a section of their computer’s hard disk to store representations of your page that they’ve just seen. The browser cache works according to fairly simple rules. It will check to make sure that the representations are fresh – usually once a session.

This cache is especially useful when users hit the “Back” button or click a link to see a page they’ve just looked at. Also, if you use the same navigation images throughout your site, they’ll be served from browsers’ caches almost instantaneously.

Since Object cache does not have much options (you just have to turn it on under General Settings), I’ll just take you to how to set-up Page and Browser caching options:

Here’s my Page Cache Settings:

Cache front page – This one’s a no-brainer. Front page MUST be cached.
Cache SSL (https) requests – Just because I have an SSL
Cache 404 (not found) pages – Still testing this out. So far, works fine for me.
Don’t cache pages for logged in users – I left Administrator out of the cache. That way, I get to check all the stuff in my site live.

These are the only options I tampered with. The ones below, I left untouched.

Here’s my Browser Cache settings:

So far all of these has worked to my site speed’s benefit. Not all of these can work for you and some may even affect your design. The thing with W3TC options is that you will almost always have to go through trial-and-error. Because each website is unique in its own way.

Minify

Minifying HTML, Javascript and CSS isn’t something new. However it can be quite effective – reducing file size by up to 50%. Minifying code is simply the act of removing spaces and packing all of the codes in such a way that it’s read continuously by your server to hand out to your users.

The thing with Minify is, it’ll be harder for you to debug code because of the missing spaces and line breaks. So Minify your stuff only after backing them up. Here’s how the Minification process looks like:

For my W3 Total Cache’s Minify Settings, here’s how I set it up:

Minifying your code is really really easy with W3TC. The thing is, it might affect some of your site’s functionalities. If you noticed I ticked on ‘Don’t Minify feeds’ however my site’s feeds still got affected.

What if my RSS feed got affected by W3 Total Cache?

Mine did. Checked it on Feed Validator and I wasn’t able to have my feed validated successfully.

The good thing is, I found a workaround. Use Feedburner to validate your feeds. It’s really easy – just put in your existing feed URL.

Create a feed there even if your RSS feed fails validation, if you use Feedburner’s new feed URL for you (such as http://feeds.feedburner.com/seo-hacker) it will be validated successfully.
We still have a lot to talk about in the next parts of our series on site speed optimization but I want you to know that W3 Total Cache helped out big-time in the majority of the reduction in my site’s load speed. It’s a must if you want your site to load fast and consume less processing speed from your server. Apply it and test your site speed out on GTmetrix and Pingdom and see how your site speed fares.

The post Must-Have Site Speed Plugin for WordPress appeared first on SEO Services Agency in Manila, Philippines.

The Best Ways to Optimize Your Site Speed

Fri, 21 Jun 2013 18:31:05 +0000

Site speed is a part of On site optimization that can be really easily overlooked when you’re a busy internet marketer. You’ve got an overflowing email inbox, social media stuffs to take care of, and your next blog entry. Who has time for site speed? Well just so you know, site speed has increased my pageviews dramatically. (Not to mention it’s a ranking factor.) It’s a powerful, rewarding thing to optimize. In this series, I’ll take you through the best, easiest ways to optimize your site speed.

Note: This post is an introduction to our series on site speed. This is in no way meant to end our series on Breaking Down Content Marketing. In fact, it is meant to back it up.

[bq1]

Site Speed Optimization Series

Here’s the thing: I got utterly surprised when I saw my site speed shoot up to 30+ seconds and the ‘Waiting‘ for server response time (according to Gtmetrix) is more than 14 seconds. I was shocked and taken aback. My natural instinct: Find out more about site speed. This is basically a guide to teaching you everything I found out and how I improved my site speed to have a site that consistently loads at 3-5 seconds even with so many scripts running on each of my pages.

By the way, if your eyes are sharp enough, I was using Cloudflare during this time. It was their servers that were responding crazily slow. I got fed up. I needed to take things into my own hands. I turned off my cloudflare and unsubscribed my domain from their services.

And so started my painful toil for how to improve SEO Hacker’s site speed. By the way, did you notice that my site speed improved? Please do let me know if you did through the comments section below.

A Little Background

Just so you know, SEO Hacker blog runs on a lot of scripts – mostly java script. Here are some of the visible scripts that I’m running:

Scripts eat a lot of loading time and eats some processing speed. There are solutions in handling scripts to minimize their effect on your site speed.

Check with the Hosting

Of course, like any logical webmaster, if it’s the server’s response time that is crazily bogging down your site, you go to the server’s support. I contacted my webhost about this phenomenon. To their defense, they did investigate this and tried everything they could to lower it down – to no avail. Hence, the bigger question mark in my head. If the hosting’s support team themselves couldn’t put it down, what could be causing this?

I thought that upgrading to a dedicated server would instantly solve my problems. I was wrong.

I researched about processing speed and about reasons to upgrade to a dedicated server. I found out one very important thing: Your server processing speed accounts only for 10-20% of your entire site speed factor. All other factors are up to your front-end scripts and everything that an end-user downloads in his browser.

That slashed off upgrading to a dedicated server from my list.

Most Important Thing About Site Speed

If there is something that I’ve learned through all this, it’s that the most important thing in optimizing your site speed, it’s this: Consistency.

You can optimize your site speed all you want, you can upgrade to the best servers, employ the fastest CDNs, but if your site speed is not consistent, all these are just money down the drain. The problem with site speed is that most of the time, it becomes inconsistent because of all the additional scripts you’re going to add, because your CDN runs to a problem or experiences downtime. Because you installed a plugin that is in conflict with your caching plugin. And the list goes on and on.

An inconsistent user experience is frustrating. Optimizing your site speed should mean consistency for your users.

I rummaged around what I could improve with SEO Hacker. According to Gtmetrix, here are the list of things we need to watch out for with regards to site speed:

Specify Image Dimensions
Optimize Images
Remove Query Strings from Static Resources
Avoid Bad Requests
Defer Parsing of JavaScript
Avoid a Character set in Meta Tag
Optimize the Order of Styles and Scripts
Serve Scaled Images
Specify a Character set Early
Leverage Browser Caching
Minify CSS
Specify a Cache Validator
Specify a Vary: Accept-Encoding Header
Minify Javascript
Enable gzip Compression
Minify HTML
Avoid Landing page Redirects
Enable Keep-Alive
Inline Small CSS
Inline small Javascript
Minimize Redirects
Minimize Request Size
Put CSS in the Document Head
Serve Resources from a consistent URL
Avoid CSS @import
Combine Images using CSS Sprites
Prefer Asynchronous Resources

From YSlow

Add Expires Headers
Make Fewer HTTP Requests
Use a Content Delivery Network (CDN)
Reduce DNS Lookups
Compress Components with Gzip
Use Cookie-free Domains
Minify Javascript and CSS
Configure Entity Tags (ETags)
Avoid Empty src or href
Avoid URL Redirects
Make AJAX Cacheable
Put CSS at the top
Remove duplicate Javascript and CSS
Put JavaScript at Bottom
Avoid AlphaImageLoader Filter
Avoid HTTP 404 (Not Found) Error
Reduce the Number of DOM Elements
Do not Scale Images in HTML
Use GET for AJAX Requests
Avoid CSS Expressions
Reduce Cookie Size
Make Favicon Small and Cacheable
Make JavaScript and CSS External

I’m not gonna lie to you, I still don’t know what most of these mean and what they are for. But for what I know, I’ve improved – and it has reflected to a very improved site load speed for SEO Hacker. Here’s my current ‘Waiting‘ server response time.

And here’s my latest Pingdom site speed. It’s pretty consistent for the past few days that I’ve been testing it out.

Here are some of the things that I improved with my website that I’m aware of:

Optimize Images
Avoid Bad Requests
Defer Parsing of JavaScript
Optimize the Order of Styles and Scripts
Leverage Browser Caching
Minify CSS
Minify Javascript
Enable gzip Compression
Minify HTML
Inline Small CSS
Inline small Javascript
Put CSS in the Document Head
Prefer Asynchronous Resources
Add Expires Headers
Use a Content Delivery Network (CDN)
Use Cookie-free Domains
Reduce DNS Lookups
Compress Components with Gzip
Configure Entity Tags (ETags)

Here are the things I intend to do next:

Combine Images using CSS Sprites

I will be discussing with you in step-by-step what I did exactly, why I did it and what the results are as I did so – in the next entries of this series. Here’s the list:

Faster websites for everyone!

The post The Best Ways to Optimize Your Site Speed appeared first on SEO Services Agency in Manila, Philippines.