A website is like a building. The structure is your code and database, the land it is on is your server, and its address is your domain name. In order for a user to have a good experience, the structure needs to be sound, space and utilities need to be adequate, and the address needs to be accessible. A fault in any of those parts will lead to a subpar or even unusable experience, in addition to serious WordPress performance issues.
Performance Testing
In order to know where your site is slowing down, you need to test it objectively with tools that give you sizes and load times. If you are using a modern browser like Chrome or Firefox, these tools are sitting right in front of you. While in either browser click on the Help item in the menu and type in Developer. You will see options that open a new window that show all the information about the page you are on. The Network tab allows you to see how long the page takes to load and the size of various files involved.
Website Structure
The code that builds your website is based on html, css, images/videos, javascript, and php/mysql, in WordPress’ case. Using best practices here requires as little of each language to create a speedy experience. The benefit of using a tool like WordPress is that most of the architecture is taken care of for you. The downside is that you can all-to-easily build something that is too big, cumbersome, and distracting for your user. Let’s explore some of the ways we can avoid creating a bad structure. We’ll start where the biggest issue facing the majority of current websites lies: images.
Impact of Images on your Website
In the last eight years, the overall size of an average website has grown over 300%. In the same timeframe, bandwidth has not kept up. This has resulted in sites that look nice, but users never get to see them since they take too long to load. The average user gives a site three seconds to load before hitting the back button and going somewhere else. While many website testing tools give you a lot of information about other technical issues, the overall image size remains the number one way to improve user experience.
Image Optimization
The best way to optimize images is by reducing the size. After adjusting image size accordingly, take a hard look at each page and it’s use of images. Do you need all of the images that are there? Do you need multiple, or any, for that matter, full-size images? Can text convey what your image conveys? Anything you can remove means an immediate reduction in load time. Although the image type is important, the method you use to deliver those images is just as big of a deal.
CDN, Caching, and Lazy Loading
The three main methods for optimizing images involve a Content Delivery Network(CDN), caching, and plugins/code.
CDN—the Shock Absorber for the Internet
Content Delivery Networks have been around for a while, but it has only been in the last five to 10 years that access and cost have allowed them to become available to the majority of websites. Today your web host should include a CDN service out of the box like Pressable does.
When your site is connected to a CDN, two things happen: 1) Your images are delivered from a number of servers across the globe, reducing strain on your main server, and 2) users get images delivered from a location that is closer to them from a speed perspective. This allows your server to focus on processor-intensive tasks like database requests. It also delivers your images faster.
Inherently in any CDN scenario, caching has to be involved. This allows an image to be kept on the various CDN servers for longer periods of time. There are a number of configurations for caching but your managed WordPress hosting should take care of most of them for you.
Lazy Loading For the Win
After your CDN caches images, the next step is considering how to further optimize image delivery to your users. Lazy loading should be on the top of your list. When an image is lazy loaded on your site, it is not actually loaded until the user can see it on their screen. This offers a significant advantage and should be implemented at all times.
There are two ways to lazy load images on a WordPress-powered website: by using custom code or a plugin. In many situations, it is advised to use custom code for optimizing your site in WordPress; however, in the case of lazy load images, there are a number of great plugins available that have a number of additional benefits. Jetpack is free and comes with the lazy load capability. Jetpack Security, a paid version of Jetpack, gives you video hosting, backups, and a lot of other great features. At Pressable, all websites get Jetpack Security available at no extra cost.
Putting it All Together
Optimizing your site involves looking at your site’s structure and the resources available through your website host. Images are the number one area to focus on if you want to speed up your site, improve your users’ experience, and increase revenue. Whether it’s image size or the manner in which you load the images, it’s important to do a regular site audit to make sure your images are optimized properly.
If your site is still experiencing performance issues after you’ve tackled image size, type, and loading, Pressable has a team of WordPress experts ready 24/7 to help you with anything that occurs on your site. Just log in to your Pressable account and submit a ticket. Our average response wait times are less than two minutes, so your site will be up and running before you know it.
Zach Wiesman
Zach brings a wealth of knowledge to Pressable with more than 12 years of experience in the WordPress world. His journey in WordPress began with creating and maintaining client websites, fostering a deep understanding of the intricacies and challenges of WordPress. Later, his knack for problem-solving and commitment to service led him to pursue a role at Automattic, where he excelled in providing customer support for WooCommerce. His expertise extends beyond technical proficiency to encompass a deep understanding of the WordPress community and its needs. Outside of work, Zach enjoys spending time with his family, playing and watching sports, and working on projects around the house.
