Spring is in the air (at least for those of us in the Northern Hemisphere). It’s that magical time of the year when the promise of nice weather outside makes necessary spring cleaning indoors all that more difficult.
With summer just around the corner, I’d like to offer some simple and easy “speedy” spring cleaning tips to improve your website’s performance.
A surprising number of page templates load giant images into tiny display spaces. Does it work? Technically, yes, the browser will down-size the image to fit the available space.
With optimization out of the way, you can finally hit those summer beaches, able to fully enjoy yourself with the knowledge that your website is running to perfection.
PROPERLY SIZE YOUR IMAGES
Everyone repeat after me: “I solemnly swear that I will not use a 1,000-pixel image when there are only 50 pixels to display it.” A surprising number of page templates load giant images into tiny display spaces. Does it work? Technically, yes, the browser will down-size the image to fit the available space. Unfortunately, using a graphic that’s the wrong size has several adverse effects.
First of all, the browser downsizing will often create a poor-looking image since “dumb” auto-resizing will not be as good as using proper photo editing software. Secondly, it just costs you more money! We’ve seen 5MB and larger images on home pages, being served thousands or millions of times per month, only to display as tiny thumbnails. In extreme cases, this can add up to thousands of dollars a month in unnecessary bandwidth charges. Perhaps most importantly, using the wrong sized image will slow down your page loading times significantly, especially on mobile devices, leaving your users hanging while they wait … very … impatiently … for … your … page … to … load.
The best way to produce small images is to generate them in the right size as part of your workflow. There are lots of great Photoshop settings available to optimize for web display. If you have a handful of images that need resizing, check out Mozjpeg.com for a free website that lets you drag and drop images into a webpage that will automatically optimize them.
If you have many photos being uploaded to your site by third parties, consider installing the Pngquant and Mozjpeg software libraries on your server, to harness the same algorithms that power the image processing tool available on the Mozjpeg.com homepage. These two image compressors will save you both storage and bandwidth costs without visually compromising image quality.
USE A CONTENT DELIVERY NETWORK
If you just woke up from being cryogenically frozen, let me be the first to welcome you to 2021 (don’t go back and read any of the old news headlines from 2020). Also, it’s time to add a Content Delivery Network to your site. A CDN is a global system that caches copies of your files on servers spread across the globe. Since your files are getting delivered from a location proximate to the end-user, there will be reduced latency and increased delivery speed.
These speed improvements used to come at the expense of increased complexity and extremely high costs. Modern CDNs solve both of these problems while offering simple URL-based integration, typically requiring only a handful of small site changes. While many providers still charge for CDN like it’s the 2010s, most reputable companies will charge broadly similar CDN bandwidth rates as they do for any other bandwidth and servers.
Using a CDN can also radically simplify your core infrastructure. Since the CDN alleviates the load on all the storage, CPUs, RAM and other server processes necessary to deliver your files, implementing a CDN will decrease your core servers’ resource usage. Indeed, content heavy sites can often reduce the number of core servers by 50% or more when switching to CDN.
OPTIMIZE CSS AND JS
Don’t skip this section! I know you’ve seen this advice many times before. It seems so complex and complicated; something for more advanced site owners (not for you). Just getting CSS and JS to work is often incredibly hard, and with the fast-paced changes to keep up with a site, there’s rarely any time to dig in and solve these. Plus, how bad can it be? What’s a few extra KB of data (especially compared to unoptimized images)?
Opening the developer tools should be your starting point whenever you want to speed up your site a little bit, followed by some of our suggestions above. Lastly, consider running the occasional free test on Webpagetest.org to get a well-respected external overview of your site speed.
Jim Rohn once said, “Successful people do what unsuccessful people are not willing to do. Don’t wish it were easier; wish you were better.” By ensuring that speed and performance checks become a part of your routine, your site will stay fast with high performance. As a bonus, there is a myriad of evidence that fast sites convert better than slow sites. All of this speed spring cleaning won’t just leave you enjoying your summer beaches with peace of mind; you’ll be making money with happier customers.
Brad Mitchell is the famed founder of MojoHost, which has won numerous XBIZ Awards for Web Host of the Year and earned many loyal clients for nearly two decades. Known for his dapper style and charismatic wit, Mitchell is a regular fixture at trade shows, where he frequently shares hard-won wisdom while striking profitable deals. And because he really loves clients, he offers protection against DDoS for free as part of his service. Contact him at firstname.lastname@example.org to learn more.