I am currently thinking “redesign” for Today in Web Design and trying to consider it from all angles. One of these angles is speed. Speed is an important aspect of our work that we rarely consider seriously when designing. I would bet that most of us do our design work, do the coding work and then try to address speed at the tail end of our process. And, in a world of theme happy design, I would also be willing to bet that many folks do not consider speed at all.
I recently wrote a couple of articles about speeding up your website, SPEED UP MY WEBSITE, TURN OFF ETAGS and SET YOUR EXPIRES HEADERS, SPEED UP YOUR WEBSITE. Each of these address things that we can do after the design to speed up delivery time, but what can we do before? Tim Kadlec has a post, “Fast Enough,” that outlines goals, how to set and what to test. Mentioned in this post is the idea of Speed Index, which is the perceived speed of the page loading. The idea is load time is less important if you can get content up that a user can begin interacting with. The logical first step here is to determine what our performance budget should be.
So, Where Am I?
Determining where I should go
Ok, so my site takes about 5 seconds to load, depending on which page is loading. This is not to bad, but I am certain it can get better. But, how much faster should it be? I like Kadlec’s suggestion of 20% faster than our competition. So, in my case, I do not really have any competition to speak of. But, there are plenty of similar sites out there that discuss web design.
Here are some speed details on the sites I chose (sorry I am not sharing which ones):
- Site 1: 2.5 seconds – first readable 1.9 seconds
- Site 2: 7.2 seconds – first readable 6.5 seconds
- Site 3: 6.5 seconds – first readable 2 seconds
- Site 4: 2.4 seconds – first readable 1.5 seconds
Designing for the speed
Now I know the goals and it is time to shoot for speed. It is important to know how fast the site needs to be up front because this knowledge will affect design choices along the way. So here is my plan to increase the speed of this site.
- Combine and minify all CSS.
- Breakup the layout to use smaller images below the scroll.
- Use a smaller or no background image.
- Load fewer resources overall.
That’s it! My plan to speed up the load time of todayinwebdesign.com. I hope sharing my thoughts on this process helps and I would love any insight you have about this.
Oh, that cool photo above is by Brandon Lim.
A Monthly Roundup of Articles and a Sweet Deal
Get the latest tips, tricks, tutorials and freebies in your inbox once a monthly.
Join our growing community of front-end web developers and designers. We are constantly publishing new industry tips, tricks and tutorials to help you take your game to the next level. We are also going to include a freebie or deal on something cool each month. Enter your email below and you will only receive this email once a month, nothing else.