This is golden, and indeed the conversation we keep having:
“Ok, but between a plain-looking product that works, or a beautiful but annoying site, give me plain and functional any day.”
“Give me both.”
“No, I’m saying if you *had* to pick one. Are you saying you’d pick the pretty but annoying one?”
“I’m saying it’s a false choice. You can have both.”
“Maybe you can, but it’s rare. Designs fall on one side or another, and it takes special talent to strike the balance right in the middle. I’d say over 80% leans one way or another. Facebook and Quora are functional and plain. Most designer portfolio sites make a better first impression and completely wet the bed when it comes to actually using it. Horizontal scrollbars because they can. A mobile site that only uses Flash. One meg of content so it takes forever to download. Sub-pages that link out to PDFs. (restaurant sites do this too) Mystery meat navigation. Too clever layout. Embedded fonts that actually look pretty crappy in almost every browser. Print techniques that just don’t translate to the web, like all columns of text needing to be exactly the same height.”
I don’t know if anyone knows what I’m talking about when I say that the old del.icio.us (screenshot) was a great design. Things have gone downhill but luckily there’s pinboard.in now.
The design of the delicious login page is a great example of people not knowing what they are doing.
Look at the labels. There is no for="" attribute linked to the input IDs. Thus, you can’t click the labels to focus on the form fields.
And if you actually focus on the form fields there is no visible focus outline. I guess they disabled it “because it’s ugly”.
And there is no style for :visited links.
Read that again: this is a site all about making lists of links, used a ton by researchers and journalists alike, and the basic browser functionality of knowing whether you’ve already seen an article or not at a glance is omitted because some designer somewhere decided taking the one minute to define :visited in his CSS was too much.
Or maybe it was a marketing manager who didn’t get why all the links on his screen were purple when clearly the original site comps were designed with blue links?
If I see things like this on high profile websites I cry a little inside. These are the basics.
About the author: Johan Ronsse is a freelance interface designer living in Antwerp, Belgium. View his work, profile or ethos. He tweets as @wolfr_ and is available for exciting projects.
- Leave a comment
- Older post
- Newer post
- If you liked it, do share on: Twitter or Facebook
Del.icio.us didn’t delete the focus styles on purpose, they just used an old css-reset that includes input:focus { outline: none; } and then forgot to assign other styles. Not that that’s any excuse of course.
“I am a web designer. I neither concentrate on the party venue, food, music, guest list, or entertainment, but on it all. On the feeling people enter with and walk away remembering. That’s my job.” — Jon Tangerine, http://jontangerine.com/log/2011/09/we-who-are-web-designers
I know a ton of sites that are very functional, look horrible, and are impossible to use, because the developers are only thinking about the back-end. Graphic designers that don’t know about website design make horrible websites, but database developers that don’t know about websites make equally horrible websites. A good web developer HAS to know about both visual design and functionality.
And by the way, the Facebook website is fully and expertly designed, you don’t get a site like that by focusing on the functionality.
we all know the extremes don’t work here. Like making an amazing looking car that wobbles while you drive, and you can’t find the gearshift vs. making an incredible machine and sticking it into a makeshift unpainted shell – you can’t call either of them a success.
The job of a professional webdesigner is to understand the design ‘restrictions’ of good functionality and to produce geat looking websites WITHIN those parameters.
Id be interested to know how many joe publics know you can click the label to focus on the input. its nice, better and best practice but in the end is it more usable for most?. This seems like a trivial complaint then in light of that. :visited on the other hand would be really useful for delicious but lack of that is not what stopped me from using it. its the fact that in my county i HAVE to have a yahoo account to use it and more important the experience of using it is a drag. Why i now use instpaper which is still less than perfect but the experience is so fast i actually use it.
It’s not only about being able to click the label, it’s more that accessibility software won’t know which label is for which field, which in turn leads to an inaccessible website.