The most crucial things in web design are:
- Whitespace: Stuff needs room to breathe. Don’t pack things too tight.
- Font size: Reading on a screen hurts. Make the smallest fonts big enough to read.
- Contrast: Don’t make small fonts worse with gray on white or vice-versa.
- Contrast 2: Visited vs. Unvisited links, and headlines vs. not headlines all need to be obvious.
- Relationships matter: Stuff needs to be grouped or “chunked” so the relationships and UI actions are clear. This also means you have to make good bold/unbold and headline font size choices.
- Don’t make targets tiny: Even if a clickable area is large, don’t make the part that looks clickable too small.
I love Delicious.com. It keeps my bookmarks safe, makes them available to me and my friends, and lets me publish interesting links to my blog sidebar with one click.
Too bad they really messed up their latest redesign:
Click for large version with and without comments
I submitted these comments on their design feedback page:
- Overall design: All the text and clickable items are LOW CONTRAST and SMALL. Things are generally hard to see, and specifically the relative importance and grouping of things is lost.
- Overall design 2: Why is everything so small and tightly compacted? See how tight the top navigation, “signed in as” bar, and search bar are? Why? The worst offender is everything from “my name’s bookmarks” down to the first bookmark. TOO TIGHT. Open up the design, let it breathe!
- “Inbox” sucks as a label. I’ve got a million inboxes. What was it before? “Links for you”? Much more descriptive.
- Hate the “type a tag” area. Before we had a nice big target to type into. Now I struggle to find it, let alone click into that tiny area.
- Hate the default “you haven’t uploaded a picture yet” profile picture. I know there’s this theory where you make default pictures ugly so users feel compelled to change it, but that is just too awful. Use Flickr’s please. Whoa, nevermind, that’s *not* a profile picture, it’s a “you are in your personal area” icon. It looks so awkward because it’s all negative space on the right. Steal the PBS logo or something to fill it out.
- The “heat” of popularity counts sucks. You need a color besides medium blue to dark blue.
- The bookmarks are too mashed together. I can’t tell which popularity number goes with which bookmark by the time my eyes scan from left to right. The whole bookmark area is just muddy. The structure is so unclear I can’t look at it.
- The main nav is weak. What’s with the light gray “bookmarks” main nav dropdown? Super tiny white text on light gray. Seriously?
- The available sorting in the “sort my bookmarks” dropdown is almost useless. Where’s “sort my bookmarks by general popularity”? I’ll give you a pass on things you’re still implementing.
- The difference between “viewing my bookmarks” and “viewing everyone’s bookmarks” modes needs to be more obvious.
- I wish del.icio.us still existed as a URL. Yeah, it was the worst URL ever, but it reminds us of the old days when delicious was an exclusive geek hangout.
- Overall design 3: Did I mention that everything is too small and tight? Click targets are just so small and I have a hard time reading text but also “reading” the structure and relationships of everything on the page.
- Wait, there’s a difference between visited and unvisited links? Haven’t been able to notice it yet.
Ok, rant over. I may not have been very polite in my points above, but I love delicious and its user interface is very dear to me. From what I’ve played with so far the new features you guys added are really cool and useful. You just need to make sure that all your hard development work is “discoverable” in the UI.
I’m usually very nice when I give design feedback, especially to my clients, solo bloggers, startups, and anyone doing the best they can with limited time and budget. However, if you’ve got a team of designers, QA people, and usability engineers, and you screw up something I rely on, the gloves come off.
See also: the Delicious.com developer blog has a movie that shows the difference between the old and new designs.
15 Comments ↓
Man, for the first time ever I’m actually glad I *don’t* have a team of designers, QA people and usability engineers (and “feedback groups”). You’re way nicer to me. :)
Well shredded.
I love how it’s so obvious that it’s loving them that’s making it miserable.
Anyway, should be interesting to see what, if anything, they do with all the reactions to the facelift.
I don’t have high hopes for positive change here. The tyranny of “sunk costs” thinking is bad enough for individuals, in BigCorp, big budget land, it’s insurmountable. They might tweak here and there, but collective egotism will ensure that this is what we’re stuck with.
Also, it doesn’t help that the creator of Delicious (and the creators of Flickr for that matter) are gone. Yahoo is just so so doomed. Sad really.
Good point about my loving them being the problem. Who always says “the opposite of love isn’t hate, it’s indifference”?
Wow. Other than that, how did you like the play, Mrs. Lincoln :-)
Gotta agree on most points (although I’m glad about the URL–try typing it into a browser that’s not yours). I’ll still cut them a lot of slack b/c…well, b/c I need them.
But just b/c I had a f*cked up childhood that left me struggling with Issues doesn’t mean everyone else did. GIVE IT TO ‘EM, BABY!
Hi CX,
I always hated the URL, and I’m glad they got delicious.com, I just wish the old URL didn’t force a redirect. There was something special about a URL that “normies” could never figure out. Delicious was our exclusive playground, and you could always tell how committed a user was when they took the time to spell out del.icio.us in blog posts.
Or maybe I just hate change for change’s sake. All the founders of Yahoo’s acquisitions are gone + Yahoo’s imminent demise = major bummer.
Found another problem: the left pointing tag labels on each bookmark imply some kind of hierarchical or breadcrumb relationship, but there is no such relationship. Terrible.
Did find a complaint that’s hilariously ignorant on the feedback forum:
“White requires more energy, aka, not fitting in with any sort of current ecological trend. Why not make the interface a darker color, if not just slightly?”
Dude, do you think the world still runs on CRTs?
Agreed. Hated it.
Hola from delicious complaint forum. You are right. I’ve been having a meltdown over this because I used my links so much right now for a writing/research process. The “change” went down while I was working on something. One minute a useable site, next minute borked beyond belief.
You forgot a few big problems mainly how hard to scan down one’s list with the blocky and interrupted effect of grouping things by date. The date is not the most important info..not what the eye should see first. Then there’s the matter of the tags being right-justified, again interrupting the eye flow as one reads left to right.
Too cluttered and now too much space is taken up displaying less information. On my laptop I can only see five links per screen.
Have you found a good alternative (assuming big changes aren’t made at delicious)?
Good point about the date Nettie. I haven’t found a good alternative bookmarking service, mostly because I’ve never needed one before. Not impressed with Ma.gnolia, mostly because they aren’t even on the first (or 8th) page of results for “magnolia”. Note: overly clever names are a great way to screw yourself.
Thanks…I looked at Netvouz and even imported all my links just to see what it would be like…eh…
The grey text is what makes me feel like I ‘can’t see’ anything when I look at my delicious links. Your post finally made me realize that’s what’s been bugging me so much. Looking at and absorbing my links and accompanying titles feels like it requires so much more energy than it used to. Unghhhhhhh.
Yeah, AFAICT the RSS is some degree of broken too. My Firefox Live Bookmark of the RSS feed from my items tagged ‘Daily’ suddenly has 11 items in it. I read more than 11 sites every day. When I go to delicious.com and click on my ‘daily’ tag, it shows way more than 11 sites; where’s the beef?
Hey, another Britta in the comments!
I read this a few days ago but finally decided it might be a good idea to comment. A couple notes - we’re actively working on improving contrast and font sizes, including visited/unvisited colors, based on feedback from the forums. Whitespace issues are tricky since we aim to keep the page’s information density reasonably high, like on the old Delicious, but it’s something we’re still thinking about. And unfortunately we couldn’t keep the del.icio.us domain except as a redirect, since cookies are domain-based. (We liked the dots too, but they were a big ol’ usability problem.)
Will: We recently limited RSS feeds to 15 items by default, but you can add ?count=[number] to the end of the URL to get up to 100.
Hi Britta G. The other Britta is my cousin. How will I keep track?! :-)
I’m all for informational density, but it needs more padding. A slightly more generous font size wouldn’t hurt either. The most obvious example of both of these needs is the input where you type a tag name to filter. It’s small and the band where it sits is tight. It’s just all so claustrophobic.
Also, in that tag name field I have to hit enter twice to activate it. Not a big deal, but still not what I expected.
Yes, we’re thinking about increasing the size of that “tag bar” a little; it is pretty small right now. The enter-twice thing is a known bug.
Anyone found a decent alternative for bookmarking? I already deleted my del.icio.us account because of the downgraded user interface.