- Getting started with navigation
- Becoming acquainted with your readers
- Seeing what your all-important readers see
First things first, how fast does your blog load?
|The colored bars show how |
long each element takes to load.
|A Pingdom full page test report|
So... How fast should your blog load? "Expert" opinions range from 2 seconds to 8. Even though 10 seconds is fast if you are waiting in the checkout line at the supermarket, 10 seconds waiting for a webpage is more akin to the 10 seconds it takes you to haul your screaming toddler from a pin-drop silent church meeting: it feels like an eternity. A 10-second-plus page load time is delay that is visible to your readers--they're watching your sidebars or your header image or your posts load.
Even if your loading time is low (under 8 seconds), you can lower it to make sure that your readers aren't waiting on your blog to load. The load times from Pingdom and Stopwatch are based on your browser and internet connection speed--if your readers' browsers or connection speeds are slower than yours, they'll wait longer. So it's always a good idea to make sure that your blog is loading as quickly as possible.
As you consider these suggestions for your blog, keep this in mind: page load time and aesthetics (visual appeal and layout) have a give-and-take relationship. Generally, visual elements on your blog require some time to load. The key is to decide which aesthetic elements are most important to you, remove the unimportant elements, and streamline the important ones. That's where you find the happy medium between a bare-bones UG-ly blog that loads very quickly and a very aesthetically involved blog that requires a significant amount of time to load.
Minimize image size and/or resolution. Hopefully you don't have a lot of unnecessary images on your blog; if you do, remove them! But we all know that blog posts with images are so much more fun to read, so don't feel like you have to get rid of every image. Instead, help the images load faster by reducing the image size and/or resolution of each of your images using a desktop image editor such as Photoshop (following this tutorial) or Picasa (following this tutorial) or using this online image optimizer from Dynamic Drive.
Reducing the image resolution saves your browser from loading more information than it needs to. If you upload a full-size print-quality image to your blog, Blogger will automatically change its display size to fit in your blog layout, but your browser will still load all of the information for the full-size image. Basically your browser is loading a full-size image and then just shrinking each part (or pixel) of the image. Reducing the resolution of the image reduces the number of parts (or pixels) in the image so that your browser isn't loading information unnecessarily.
Remove unnecessary widgets and other unnecessary elements. Some elements--especially music and video--take a lot of time to load and aren't necessary or important for your readers. Ditch the music playlist (most readers find it annoying anyway). Switch a video in the sidebar to a text link to a video on YouTube. If you can, reduce or remove the ads, too--they can slow down your page load more than you might think. If you have a hit counter, consider using your blog statistics (like we talked about two weeks ago) instead of the widget.
Once you've whittled down your widgets to the ones you deem necessary (such as followers), organize them so that the widgets that take the longest (shown in your Pingdom test) load last. Most blog layouts (those that aren't extremely customized) load from left to right and top to bottom, so place the slower-loading widgets in the right sidebar or at the bottom of your blog.
Reduce the number of front-page posts. If you write wordy posts (like I tend to) or lengthy tutorials with photos, you're better off to have 3 or 4 posts show on your front page. If, on the other hand, your posts are shorter and use fewer images, you can have 6 or 7 posts on the front page without slowing down your blog-load time. Reducing my front-page posts from 7 to 3 reduced my blog's already-low loading time by a full second. You'll find the front-page post setting (titled Show at most) for Blogger in the Formatting section (under the Settings tab).
Those are the top three ways to reduce your blog's loading time. If you're interested in learning more, see one of these articles:
- Blogger Buster: Top Tips for a Faster Loading Blog
- Webweaver: Speed Up Website Load Time
- Vandelay Designs: Designing Pages to Load Quickly
If you have any questions, now or ever, leave me a comment or email me at firstname.lastname@example.org. Don't fret - even though this is the end of Usability 101, I'll be back next Wednesday (and every Wednesday for the foreseeable future) with more inspiring, useful, or just plain fun web goodness. Until then...