What are your reactions to a site loading in 2 seconds versus 4 seconds? What about 6 seconds? For a lot of people this is tough to think on, it’s more a background service of our minds. After reading this article you probably will start taking notice however, so here we go.

Speed & Conversions

Conversions are your end-goal successfully completing of whatever you want your website users to do. More on this is available in the “Kill Your Brochure Website” article. A study by the Aberdeen Group found that “a 1-second delay in page load time equals 11% fewer page views, a 16% decrease in customer satisfaction, and 7% loss in conversions.” telling us the bottom line of site-speed.

Nearly all wordpress themes on the market are so bloated that businesses choosing them shoot themselves in the foot without knowing it. This is why when we at Jon Craig Design create a website in wordpress we code everything from scratch, instead of cutting time down by picking someone else’s theme and tailoring it for a client. Third party themes will always have bloat as they’re built to cater to the masses, not your specific site.

This also gives us full control over every size aspect, large and small, with no surprises or hacks needed at the end.

Speed & Organic Traffic

Organic traffic is traffic from search results. The better your standing is in these results; directly correlates to the amount of organic traffic your site receives. This is obvious. So why do I put speed in the title? Glad you asked! Speed now directly contributes to your websites ranking in search results. It’s not the only contributor, but a big enough one to markup as another reason to monitor your website speed.

Speed & User Experience

We’ve already covered this a bit earlier if you were paying attention, and it could almost be chalked up to common sense. If someone arrives at your site to get directions, hours of operation, a phone number, etc and they end up waiting 14 seconds on their smart phone for your responsive website that was never optimized for phone, they’re going to hit that back button.

That is a perfect example of poor user experience. Another example is a users actual speed on your site, meaning how fast they can find the info they’re looking for on a fully loaded site. Many of these small things add up to online market success.

So Whats Next?

The absolute first place to start, if you haven’t already, is image compression. This is by far where you will find your biggest speed gains. The two most commonly used image formats on the web are jpg (or jpeg) and png. In most cases the best image format to use is jpg because it allows you to adjust quality, which equates to file size. If you have a working version of photoshop you will find a “save for web” feature with a sliding quality scale to the right ranging from 1 to 100, 100 being the highest quality and biggest size.

I find for less detailed images, 35 – 55 is a good range. For more important images or images with a lot of detail I usually go around 65 depending on levels of artifacts that show. As you can see in the figure above, artifacting can make or break you. Too much and your user experience is thrown off in visuals, too little and its thrown off in load time. Finding the balance is what image compression is all about. You would be amazed at how many “graphic artists” don’t know this.

When to Use JPG or PNG

The important thing to understand about PNG is it allows for transparency. Because of that you will find a lot of inexperienced web designers overusing it with little to no regard for site size. PNG is great for basic 4 or less colored graphics, give or take. Think logos, single colored shapes, etc. The PNG can actually win the file size war in these battles, and because there is no compression they always come out shining exactly as they’re meant to.

JPG’s should always be used for photos, most background elements, and anything else with tons of colors and details. As you can see in the figure, they first start artifacting around sharp lines, in this case text, though it isn’t super noticeable. This gives you a lot of leeway in the overall file size dance that is your website.

Content Delivery Networks

After that, look into a Content Delivery Network or CDN. CDN’s build a cached version of your site and deliver it lightning fast around the world. Cloudflare is a pretty popular CDN and offers a free option that will also minify html, css, and javascript for you if you don’t have a tool for doing it yourself. Minifying is the process of removing all formatting and spaces in code to cut down on total code file-size. Something that really should always be done as well.

It is very important to have a fast host for your website. If you’re using wordpress, which is based on PHP, I would recommend using a host which can run PHP 7. Benchmarks have shown PHP 7 to be up to twenty percent faster than PHP 5x. There are many hosts out there that do not yet offer PHP 7 as the workload would be too great for them. If you have a host like this we recommend jumping to another. The process isn’t all that difficult really and if done properly can be done in little to no downtime.

Speed Testing

There are lots of tools to test out site speed. Many of them take way more into account than a standard business website would need, but all of them are good as a standard benchmark. We like to use Pingdom, and mostly pay attention to overall page load speed.

Interested in boosting your conversions like this? Our company is here. Feel free to give us a ring or drop us a line.