Why Your Site Sucks
March 10, 2020
written by
Chantel Keith
As technology continues advancing and the web becomes increasingly capable, it can be difficult to keep your website from becoming susceptible to the dreaded “page bloat”.
At 300FeetOut, we definitely share your appreciation for colorful, high-resolution imagery and crisp, 4K video; however, Google – and your users – most likely do not. Of course, that’s not to say Google (and your users… but mostly Google) don’t have as great of an artistic appreciation as you do, but the frustration from your sites ever-loading pages far outweighs their desire to see your sites high-res assets. Now, we understand this isn’t a problem solely caused by bloated content and design. There’s also a plethora of marketing tools that can quickly steer your users right off to your competitor’s quick loading, optimized website.Why Your Site Sucks
We’re obligated, as your web design & development partner and friend, to let you know when your website might need an intervention and why.
Third-Party Pixels
We understand “why” marketing pixels are important, the issue lies in the “how” they’re being implemented. We’ve integrated many pixels from many companies and have found that, unfortunately, optimization is lacking. To start, almost all marketing pixel resources reside on a third-party server which adds additional requests to the overall page load. These resources can sometimes contain seemingly endless redirects to other pages and/or assets which are often unoptimized without the ability to optimize them as they’re on a third-party server. Lastly, these resources cannot be cached meaning your users browser will have to download these files each and every time they come to visit your site.
Unoptimized Images
Again, we love high-res imagery, too! It’s just too easy to take a raw, original image and upload it directly to a website without fussing with Lightroom or Photoshop. The problem with this process is that unedited, high-res image file sizes can be HUGE. By taking the time to scale down & crop images to fit their maximum container size on a website, you can shave tens or even hundreds of MB of a website’s overall size. You also don’t need any of the meta data that’s contained in the original image file so be sure to quickly run it through an optimizer tool before uploading to your site and consider converting to a modern image format like WebP as well.
Unoptimized Resources
The third most important, yet often overlooked, issue is the delivery of your website’s resources. By resources we mean CSS files, Javascript files, and any media such as image or video assets as well. Making sure your CSS and JS files are minified can easily reduce the overall size of your site. We prefer to use task runners to automate the minification process, but there are also several free tools online that you can use to copy & paste minified versions of your resources. On this same note, it’s also beneficial to combine your CSS and JS into the least amount of files as possible. The more files that a users browser needs to download, the more time your site will take to load. Ideally, these files would also be prioritized so that critical, above the fold resources are loaded before anything else. Last but not least, don’t forget to lazy load your site’s images and videos! Your visitors shouldn’t have to wait for an entire image slideshow positioned down in the footer to load before they can read your content.
If you’re curious to gain more insight into your site’s performance and where it may be lacking, we recommend using the following tools. Google’s PageSpeed Insights is a free tool that provides suggestions on how to make your website fast, though the feedback may be slightly biased. GTMetrix is another free tool that analyzes your page’s speed performance which we tend to prefer for performance benchmarking. Or you can give us a call.