Five web design clichés never use again

Five web design clichés to never use again

Keith Butters, chief experience officer and co-founder of The Barbarian Group, lists his top five web design clichés that he would like to never see on the internet again

Disclaimer: I make no apologies if this reads like an early-80’s Andy Rooney bit from 60 Minutes: “What I really hate about all these phone books is…”

There are certain things I see over and over again in this business that make me cringe like I’ve been forced to chew on a tinfoil sandwich. Like the wireframe that’s nothing but a big rectangle with three equally-sized rectangles underneath it – “There’s your homepage” – or any other kinds of design that come from utter lack of inspiration.

The following are the short list of things we should never do again (or at least wait until they can be done with some semblance of retro-hip irony). I’m sure there are lovely examples out there of these elements or techniques being used tastefully, properly, or in inventive ways, but I’m going with the thought that 99 per cent of the time, if you’re doing this stuff, you just aren’t trying.

1. The page curl

In the early days of The Barbarian Group, while working out our processes and company documentation we created Form 9987AF234PC – The Page Curl Waiver. Essentially, we decided that any designer was allowed only one “page curl” for their entire design career. The waiver encompasses everything from the faux rolled-up corner of a piece of “paper” in a flat design (ValuPak style), to one of the all-time worst pieces of interaction design ever invented: the click-and-drag-the-corner-of-an-image-to-literally-turn-the-page Flash trick. Our waiver may say you get one “page curl”, but really, the web would be a much better place if none of us ever used one again.

Silverlight PageCurl 1.0 adds a page curl effect to any web page, shows a customisable image and opens any website in a new browser window when clicked...
Silverlight PageCurl 1.0 adds a page curl effect to any web page, shows a customisable image and opens any website in a new browser window when clicked...

2. The book metaphor

A not-too-distant cousin of the page curl is the (overused and misused) book metaphor. I’ve been guilty of having to work on a couple of these over my career, and I’ve reviewed comps of far too many journal, scrapbook, school notebook, newspaper, legal pad, moleskine, spiral-bound, trapper-keeper, 16 And Pregnant titles style high-school sketchbook metaphor designs. Every time I see one of these, all I can think to myself is, “Wow, they really didn’t try very hard”. Now, there may be some cases where a very talented designer can make this metaphor work, but as a general rule: don’t go there.

3. Doors

Using animated door-like panels to conceal and reveal content, including such classics as: Star Wars style spaceship doors, garage doors, revolving doors, elevator doors, etc, should go away and never return. Thankfully, the decline of the Flash microsite has helped make the use of “doors” all but disappear. With all the new JavaScript animation fanciness people are using these days, we could see a resurgence. Let’s not.

4. The 45˚ arrow

What to do to spice up that white, black and red, big-Helvetica based design? The drop-shadow isn’t working, and the fat horizontal bars don’t seem to be moving the eye across the page properly.

Enter the 45˚ Arrow. You know the one. The second slot in your Photoshop’s trusty custom shape tool menu. Hold down shift and rotate to 45˚. Stop it. There are plenty of other elements to poach from mid-century Swiss graphic design, yet somehow this little dingbat has been a go-to for web designers for as long as I can remember. Let’s call a moratorium on this one. Maybe in 10 years it can be retro once more.

5. The million sharing options

Content should be shareable, absolutely. The problem I see on so many sites now is that there’s more “sharing stuff” than stuff to share. Just today I was on a site that had 24 (twenty four!) sharing options not including Google’s +1 and Facebook’s Like buttons.

Now I don’t mean to disparage any other networks out there, but do we really need buttons for things like Plurk, Mixx, and Mister-Wong? (Perhaps those services are amazing, I just have absolutely no idea what they are.) If you don’t know enough about the users you’re designing for to choose a limited (targeted) number of sharing options, maybe the best move is to show the usual suspects and have an option to “show more”, the same way YouTube does.

Also, does every story excerpt in a list need their own Tweet, Like and +1 buttons? First impressions are important, but deciding to Like or share something probably takes a bit more personal investment than reading a headline and the first phrase of an article. And what a viscerally displeasing mess all that crap makes a page design.

I realise there are all kinds of usability studies and web standards and design guidelines and page level requirements out there that we need to be aware of. I also know there are times when you’ve got an hour to explore a second design direction. Even in those situations, I urge you to leave the tired clichés in the cellar and try a little harder. Keep your own list of things you never want to see again. Keep a list of your own go-to crutches (I’ve seen that button style on every comp you’ve done all year) that you need to stay away from in order to grow as a designer. The only way to create the new, is to stop relying on the same old tricks. Let’s stay inventive.

12 comments

Comment: 1

Re point five. Look at all the share options on meashamselfdrive.co.uk! Anyone use Windy City, Yardbarker or Fabulously40 as their preferred social bookmarking site?!

Comment: 2

Yes, the print/magazine metaphor and the page curl...That's grounds for doing things where insanity would be the plea. That said, let's keep in mind that there are probably more clients with "bad taste" than designers who prefer to flog overdone cliches. Portfolio damage aside, sometimes the good fight isn't worth fighting.

As for, "Also, does every story excerpt in a list need their own Tweet, Like and +1 buttons?" Actually, an SEO would probably answer, "Yes, it is necessary." These things factor into rank algorithms and if SEO is a top priority - either today or tomorrow - their use needs to be perfected at some point. Starting sooner is better than later.

Finally, I'd like to add one to this list - text-decoration: underline on links is probably something we should be moving past already. Alternatives like the dotted border (as seen in the footer here) are more tasteful and a more readable alternative. Nothing makes a page look more dated and more difficult to read than a load of underlined text. To this is add, underlined text that is not a link should also be grounds for public stoning :)

Comment: 3

Oh! And I don't mean to offend you Keith but use of the word awesome and its derivatives has been getting on my nerves for a couple years now. I'm just sayin'.

Comment: 4

"Also, does every story excerpt in a list need their own Tweet, Like and +1 buttons?"

Just a way to flaunt their popularity.

Comment: 5

Great article and valid points made. Being able to share stuff easily is really important but like you say, there's no need for every 'network' to have a button else it just becomes clutter, which is not design.

Comment: 6

The page curl is def something that is annoying. Even big companies like Enom have used it lately. I feel as long as it is not on every page then it is not that bad. But I agree we should all move on from this.

Comment: 8

Keith,
Great article! We're a web design company and my sales role is made easier when I see the design elements you describe here. It gives me the opportunity to explain how the site could improve conversions if these elements were dropped. The door and the page curls in particular just detract from the users experience, adding a complication that needn't be there.

I al;so liked your last point - I thought it was just me that hadn't heard of a good percentage of all the posible share options! I agree, if you know your target audience you should be able to really trim the list of share options to something meaningful.

Comment: 9

Keith,
Great Article! I really liked the 5th point you made, there is no point making that no. of sharing options visible on the first sight.

Comment: 10

Ugh .. I actually chose to go through the netmagazine.com Account Creation process with E-mail Validation process to reply .. (BTW: 2006 called - they wanted their user experience back)

IMHO this article is done by and for graphic design snobs. Luckily, the web has and will never be designed for you. Because sometimes, a page curl, a book metaphor, doors and sharing options JUST MIGHT be the design pattern you need for the audience you are designing for. Too bad if you don't like it yourself.

The 45 degrees arrow, I'll give you that one - looks like a design meme to me. Probably been thought up by the kind of readers/writers of this post them selves. But sooner or later I think I might find use for it somewhere, other than a logo, to point users down the easy path.

..

"Hmm quite handy, these sharing options below this article. I think I'll go for twitter this time."

Comment: 11

#6 - Wrap-around ribbons with the triangle notches. :-P

Comment: 12

I was participating on contest for one of the CEOs of a big software company, and he actually praised a design with coffee stain, tered notebook ( looks like the designer stole it from out f milk app or a bad stock image site) and a pen, as a refreshing, new concept.
Luckily, he came to his senses and didn't select that one.
July issue on sale now!

The Week in Web Design

Sign up to our 'Week in Web Design' newsletter!

Hosting Directory
.net digital edition
Treat yourself to our geeky merchandise!
site stat collection