There are many tools out there that can tell you your Ping time, load times, and other interesting information presented through colorful graphs and pie charts. Most of us, beyond running these tests are clueless as to what they really mean.
Well, if your page is loading slowly, many people on mobile or web will just cancel out and leave altogether – but you paid for the click already so you lose out not ONCE but potentially multiple times because of opportunity costs.
Why does this happen? The answer is not complicated if you think about it…
Imagine this, you are browsing the web – wanting to read the latest breaking news for example on the tragic Germanwings plane crash that just happened recently.
You click on an image on news.google.com that has a picture of the blackbox, it opens in a new tab, but after a few seconds nothing, it still says page is loading. You close the tab, go back and click on another news article on the page.
See what just happened? You never, ever saw what you wanted to because the image you clicked on (that got your interest) never materialized in form of a web page due to some connection issue. This happens more often than you think.
From an affiliate marketing standpoint, what just happened was you had a high CTR banner, someone clicked it because they wanted to learn more about what they saw on the banner with that shocking picture; but when they did click, they could see NOTHING. Maybe due to a connection issue, NO PAGE came up so they closed the screen. BUT, you as the affiliate marketer were charged for the traffic regardless.
So let me teach you what you can do to lower your load time, and also your lost traffic and increase your profits.
Here we go…
How to optimize your landing page so they load FAST (and Make You More Money!) [readers digest version]
1. Go to www.webpagetest.org
2. Enter the Lander URL and select the same geo as where your hosting is (so if your site is hosted in france,select paris, france or another test location from france)
3. Press START TEST & Wait for it to complete
4. After it’s done, you will see the results.
The results will appear as letter grading above these 6 criteria.
First Byte Time
Keep Alive Enabled
Cache Static Content
Effective use of CDN
What do these mean?
First Byte Time
This is a hosting related thing you can’t do much about personally. Ignore it, usually it’s A if the host is good anyway. But it can be another mark too if the host is configured separately. That does mean it’s bad. I just ignore this.
Keep Alive Enabled
This is the use of persistent connections, which is also a host related thing. I wouldn’t worry much about this personally because it’s not where we can make the most impact.
There’s something called GZIP, which automatically zip’s up the website a viewer has requested and the server sends it to them in compressed zip file format, which then their web browser (may that be mobile or web) automatically unzips and shows them the website. This is a must, it can save you a lot on hosting bandwidth charges, but it can also help you deliver the website faster to people on slower connections (say mobile smart phones). Adding a few lines in a .htaccess and uploading it to the same location as your index html or php file can do the trick to get compression working for you.
Many of the JPG, PNG and GIF files we create and use on our landers are uncompressed. This means that they aren’t optimized for speed and contain a lot of extra junk like thumbnail, meta data, and other technical stuff we can strip to compress their sizes down.
You probably heard of lossless image compression, and maybe even used some tools to get the image sizes down. There are many out there that can help you compress images, one of which is to do it in Photoshop either one by one or using Batch processing.
There are also batch automation tools which can take care of optimizing and compressing your images in bulk. The tool of choice for me is Caesium, which is a 100% free software available right here
Cache Static Content
This is also another neat hack you can implement very simply in a manner of seconds by adding some special lines of
code into the same .htaccess as the compress transfer part.
Effective use of CDN
CDN’s are content distribution networks – basically you upload your static content like images, css files, etc to a server and it will sync it with all its nodes all around the world. So if you have a central landing page/tracker server, and you decide not to buy one for every single country – you can host your index files on that central server and throw everything up on the CDN, so if someone from germany accesses the site, it will load as fast as if they are accessing it from Hong Kong as the static images are served from the closest server to the visitors location.
HERE WERE MY INITIAL RESULTS: (not bad, but can be optimized!)
5. Now it’s time to take care of the problems.
I got an F on 3 things: Compress Transfer, Compress Images, Cache Static Content. Here’s what I did to fix them..
We can address the Compress Transfer, and Cache Static content by opening notepad, or another text editor; then creating a .htaccess file, and putting the following code into it:
ExpiresByType text/css A604800
ExpiresByType image/gif A604800
ExpiresByType image/x-icon A604800
ExpiresByType image/icon A604800
ExpiresByType image/jpg A604800
ExpiresByType image/jpeg A604800
ExpiresByType image/png A604800
After you’ve pasted this text, press save but make sure you aren’t saving it as a text file. Rather a file with no extensions (no .txt on the end)
Then upload it into the same directory as your landing page.
I’ve re-ran webpagetest and here are my results after implementing the above “HACKS” (Loving what the mainstream word on the street is at the moment’)
Sidenote: You can use http://checkgzipcompression.com/ to quickly check if your site/landing page domain is gzip enabled. If it’s not you can enable it on cpanel under the cPanel – Software and Services – Optimize Website section. Alternatively, you can email and ask your host to enable it for you.
6. Next we want to compress images.
If you don’t have a copy of the landing page’s images on your hard drive already, download it into a folder from your host via FTP and then open Caesium and click Add Folder.
After doing so, select all, and click on Preview. This is going to trigger the tool to automatically parse everything and calculate how much it can or can’t be compressed.
Remove anything where the difference is a +% as shown below and leave only the images that Caesium was able to reduce in size.
After you are done removing the files Caesium cannot compress, select what folder to export to, and click the Compress button
I ended up saving 936kb’s by optimizing my images with this app!! That’s HUGE!!
Upload the new images and replace the old ones on the server
7. Now re-run the test on webpagetest.org and you should immediately see an improvement in your load time, and also on your over all score.
Here’s my result
I was able to get my over all score to be A,A,A,A,A,X
Reduce load time, and also reduce the total size needed to be loaded which means CR and CTR will go up on mobile and web.
That’s it, happy optimizing!
NOTICE: The following information is a method practiced and in use by my staff, there’s probably many other ways you can accomplish the same thing. Let this serve you as ONE of the many methods out there.