10 lessons learned from the worst band website in the world | CDBaby.com

Chris Bolton

lessons learned from worst-websiteThe Lazer and the Beams website is a sight to behold. Flashing gifs, text marquees that scroll across the screen, head-bobbing cats, mixed fonts, tiled photos–it’s mesmerizingly bad. Luckily, they built a new website with HostBaby that looks totally awesome, but they’ve left the old site up so people can still gawk at — and learn from — the site that was dubbed the “worst band website in the world.”

If your stomach is strong you can view it here: www.lazerandthebeams.com

Once you’ve recovered, here are 10 things we can learn about web design from the worst band website in the world:

1. Where the hell is the nav?

Don’t reinvent the nav bar. As web users we have been trained to look for navigational items in the top third of the screen. We also look for particular words like “About, store, contact,” etc. This makes it easy for us to get the information we need. lazerandthebeams.com barely even has a nav. Instead, it has links about halfway down the page that are poorly organized. Keep your navigation simple — your fans will thank you.

2. It’s a rainbow of insanity

A color scheme is important to creating a well designed website. Choose your colors and stick with them: The fewer colors, the easier it will be to keep the look and feel of your site consistent. There are quite a few online tools out there for choosing a color scheme for your site. Here is one of my favorites.

3. This is fonting ridiculous

Using too many type styles will make your site look messy and hard to read. If you do use multiple fonts, make sure to use them in a consistent way. For instance, you could use one font for titles or headers and another for body copy.

4. One website please; hold the animation

Animation often gets in the way of the user experience. Lazer and the Beams is the perfect example. Way too many things are moving and flashing, distracting the visitor. Simple animations on a drop-down menu or when you click on something can be fun, but animations that bombard the visitor whether they like it or not are a bad idea.

5. Why is the background repeating?

Don’t let your background photo “tile”(repeat over and over in the background). Usually this means your image is simply too small to fill the background of you site. When this is the case, use a larger background.

6. The music! Make it stop!

There is nothing more annoying than landing on a website for the first time and getting blasted with music (especially if it’s past midnight and the kids are asleep). Give your fans the power to choose when they want to play your music and which song they want to listen to.  They know how to click the play button themselves. Give them that option.

7. I have no idea what you’re saying

Never sacrifice readability for style. Be careful not to use fonts that are so ornate you can’t read them. Also be careful of putting light text on a dark backgrounds. Definitely don’t let text and images overlap in confusing ways like the Lazer and the Beams site does.

8. Tell me what to do

Every website should have at least one clear “call to action.” You know, like “Sign up to my email list here.” What do you want people to do when they land on your website? Is it listen to your songs, buy an album, leave a comment? Make sure your biggest priorities are reflected on your site with clear calls to action.

9. Think before you link

Lazer and the Beams have some really random links on their website. That’s cool, but is it a good idea? Do you want people to leave your website and go somewhere else? Wouldn’t you rather they stayed on your site and bought some music? Think before you link.

10. “I came. I puked. I left.”

One of the great pioneers of web analytics, Avinash Kaushik, describes a website “bounce” as a visitor who comes to your site, pukes, and then leaves. This is what people do when they see bad website design: they leave in disgust. This is why design is so important: People no longer have the patience for bad design.