Serve images using a CDN on WordPress

You can optimize your code. You can make all of the changes you want to plugins.

At the end of the day, to attract the visual attention of a user, your landing pages and blog posts will almost certainly have images. And these images will take up space. A LOT OF SPACE. That means a lot of extra bloat and load time on your site.

The potential solution? The content delivery network.

Table of Contents

• What is a CDN?
• Image Optimization
• Benefits of a CDN
• Negatives of a CDN
• Add a content delivery network to WordPress

What is a Content Delivery Network (CDN)?

A content delivery network or CDN is a distributed network for your content. In the case of WordPress, a WordPress CDN usually refers to how your images are served as those will take up most the space on your site.

Real world example.

You are selling a product. You can either distribute it from your home shop, or you can send your product to multiple shops around the country and around the world. A content delivery network is the latter option, but involving servers and distribution of your site’s data.

Here are the positives and negatives of using a CDN.

Benefits of using a Content Delivery Network

Using the above real world example about product distribution, some of the benefits should become immediately obvious.

1. The first is server location. Having extra servers to distribute your content closer to other places means faster transfer of data. With the web we are talking about milliseconds, but still, the proximity matters.

A server in China will distribute faster to a Chinese IP than a server in the United States. In fact using, a content delivery network can cut your page load speed in half!

2. The next benefit to a CDN is the protection from attacks. While you are not always in direct control of the server using a third party content delivery network, having more servers generating content

In web terms, that fire can manifest itself as a DDoS (distributed denial of service). In this case, your server gets overloaded with requests and causes it to crash and cause an error.

The more places you have serving your content, the more difficult it is to attack them and shut the site down.

3. Similar to item number one, the other major benefit of using a content delivery network is that your main web server is no longer the primary loader for all of these images. Because of this, your overall page load speed will increase as other servers help your page load content.

It is a lot easier to lift heavy objects with more than one person. Apply that logic to CDNs and you have an idea of why this is beneficial.

Negatives of using a Content Delivery Network

The list of negatives for using a content delivery network is definitely shorter than the positives. But that being said, there will always be issues, so here are some negatives for using a CDN.

1. This is a more open ended negative, but some server configurations do not allow for Content Delivery Networks. If you have any questions, you can always ask your host for advice.

2. If your business is mainly local, you might not see a huge need to have a content delivery network. There is no need to have servers in California if all of your business is coming from your home location in Boston.

3. Finally, if a CDN sounds too good to be true, that is because it normally is. CDNs can cost a good deal of money as you have to pay for all of that extra space and service.

Add a Content Delivery Network to WordPress

While content delivery networks typically come at a cost, the reason we are so enthusiastic about WordPress CDN solutions are that there is a free and popular option available to you.

Photon by Jetpack

The plugin is called Jetpack, and it is the most popular plugin. After all, it is made by Automattic, the team that brought you WordPress in the first place. It is a totally free plugin.

One of the add-ons included with Jetpack is “Photon”, which is a pseudo-Content Delivery Network hosted on Automattic’s servers. Basically, all of the images are cached and stored with Automattic.

Here are the steps to start using Photon:

1. Install Jetpack in WordPress
2. Activate “Photon” under Jetpack > Settings
3. Login or create a WordPress.com account to set up your site with the CDN

That’s it.

Jetpack or Automattic servers will now be the source of your images as a content delivery network and you should see your page load speed increase, both locally and internationally. This is great for sites that don’t alter images often after posting.

Quick Note: Optimizing your images

It should be noted that content delivery networks and servers will not help to optimize an image. If you upload an image to WordPress that is gigantic, that image will take forever to load ANYWHERE.

Make sure that you are appropriately optimizing images so that you are optimizing page load speed on your end, BEFORE you start thinking about a Content Delivery Network.

We have another resource that spends more time introducing you to site specific image optimization, but the general rule of thumb is that most images should be under 100kb in size.

MaxCDN on WordPress with W3 Total Cache

Looking for a more complete solution for content delivery (beyond images)? Here is a tutorial to set up MaxCDN — the most popular solution for WordPress content delivery networks — with the W3 Total Cache plugin.

The WordPress CDN

We hope that this post shed some light on what a content delivery network is and what it does. If you have any questions or comments about WordPress CDN.