Why You Should Optimize Your Site

November 26, 2014

Blog | Development | Why You Should Optimize Your Site
Why You Should Optimize Your Site

Internet speeds have risen dramatically since the birth of the Internet and it’s pretty routine to stream video at home. The pipes, so to speak, are much bigger, so all that worry about file size doesn’t make business sense.  Although, it does. There’s a confounding variable in the mix and it’s called the iPhone.  Before the iPhone, internet connectivity on a phone was a sort of novelty act, but now it’s standard.  Remember, it was only 2007 that the iPhone appeared, and now, the entire web industry supports mobile web.  We have terms like “responsive design” and “mobile first” to help lead the way.  It hasn’t been a painless ride and we’re far from done.


You’re likely keenly aware that mobile phones don’t always have the best connections. Under the hood is an insidious little problem: cellular networks have a lot of latency.  What that means is for every image, every JavaScript or CSS file, every connection to the server, you are eating up time.  As much as an entire second for every connection.  Desktops don’t suffer this, so web developers may never see the problem until the site is out in the public. By then, it’s too late.  I wrote last week about code quality and its impact on search ranking, and the reason for that is that sites with minified CSS and JavaScript assets are much faster on mobile devices. This is one instance where following coding best-practices nets business results.

To break it down, your development should have: ONE file for JavaScript, ONE file for CSS, and as many of those little icons and graphical candies jammed into ONE sprite file.

One of the lessons we learned back in the day was to optimize graphical content- shrink everything to as small a file size as you could without sacrificing too much clarity.  It seems we need to review this lesson, because the payload-size for websites keeps growing, and is now more than 1.5 Megabytes.  That’s 1.5 Mb for the average site, so now pipe that into your phone and expect a great experience.  Go ahead, I dare you.

There are a couple reasons for the bloat, besides faster connections.  First, the rise of high-resolution screens, even on phones, makes designers a little giddy.  Second is a little bit of laziness that can be addressed by bundling and minifying your code and following best-practices.  The third is in the spec: the HTML specification doesn’t allow web developers to choose between high or low resolution images based on connection speed or type.  You can specify one image per IMG tag, and that’s it.

Said another way, your image content still needs to be optimized.  It’s good business sense and the end result is a better user experience.

Dan Clouse

Senior Developer
Tags
  • Best Practices

Recent Work

Check out what else we've been working on