Good content is sometimes not enough, the users must reach it so they can see it's good!

Friendly URLs

Posted: March 13th, 2009 | Author: | Filed under: Good practices, Patterns | Tags: , , , , | 1 Comment »

Friendly URLs are are usability patterns if you want. Let me explain myself for a moment here.

When a user sees in his browser example.com?index.aspx?action=art&id=7799&cat=52&p=2#a22 he simply ignores that. That URL doesn’t give him any information at all. It’s a bunch of numbers, parameters, crazy signs.

When he sees example.com/kitchens/a-article-about-nice-kitchen-furniture.html#comment-no-22 on the other hand, the user kindda’ guesses that he’s about to read an article about kitchen furniture, part of the kitchen articles category in the site. Hell, some computer-savy guys might know the browser will set on the 22nd comment to that article.

URLs can act like breadcrumbs. It’s a signpost, a “You are here” marker.

Bonus: they are great for SEO, everybody knows that, and they are much more appealing esthetically.


Usable pagination

Posted: March 11th, 2009 | Author: | Filed under: Good practices, Patterns | Tags: , , | 5 Comments »

You would think the most visited sites in the world would have perfect or close to perfect pagination systems, because let’s face it, the users browse a lot (that’s how the websites became most visited in the first place). Well… not really. Although there are good examples, none of them seem perfect to me. Some of them fit the content of the sites they’re on pretty good, google search for example – it doesn’t need anything else, it’s stripped to the skin.

pagination

My personal favorite is ebay. It is the only one which jas a “jump to” feature – very useful from my point of view when you have lots of pages (maybe filters too). What ebay lacks is links to first and last pages – a quick way to change the order of browsing.

The links on pages – it’s preferable to have well defined click areas with a few px of padding. It’s damn hard to click those little numbers. Many sites go with the square like links – they are very good, easy to click, follow, see.

Next – Prev buttons – should have indicators: arrows, < >, « » or anything suggesting the direction. The user sees and evaluates these things a lot faster than the word “Next” or “Previous”.

Positioning – bottom of the content is mandatory, but in sites with heavy browsing i suggest duplicating it at the top too. If you have 30 products on a page it takes more to load them and scroll down, so a pagination at the top will increase the speed of navigation.

Here are the examples.


Modals are killing the spirit

Posted: March 9th, 2009 | Author: | Filed under: Good practices, Patterns, To do | Tags: , , , | 1 Comment »

One of the worse things to put on your website/application is a modal alert. I’m not glad with the modal forms either. The only modal thing i can live with must be the lightbox style view of images, if the images are large, this is probably the best way to view them fast and with the smallest effort.

The javascript alerts are the mother of all modals. Why in God’s name would you want a box to pop, tell you something you already know and have to click ONE SINGLE BUTTON to get rid of it? This is sick.

And i’ll tell you why that’s so frustrating: once a modal alert pops in you cant do anything else, you cannot use any of the browser’s functions, cant see on another tab what the terms on the alert are meaning, can’t go back either. This is worse when the message is not clear and you have to confirm something with “OK” and “CANCEL”. “Ok what? Cancel what? Is this gonna ruin the work i’ve done so far if i get it wrong?”. Not funny.

I’m a little bit of a hypocrite. I use javascript confirmation when deleting something. You would think that’s a good thing but it’s not, try to delete 10 things one by one and you’ll know what i mean.

Solutions:
– instead of alerts use inline messages (see the yellow bg ones on Gmail) are the most elegant and usable solution to a problem i have ever seen, non intrusive, space saving, time saving. If the messages disappears after a while it’s perfect.

– Instead confirming a delete let the user delete stuff and provide a “UNDO” option. (It’s said that the undo functionality is the greatest way to let user explore, fuckup, recover, the best way to change the user from beginner to intermediate). Of course, this is no easy job for a developer. Providing such a feature is a real pain in the ass, that’s why you don’t see it on many web applications, that’s why i break the usability rules and ask users for confirmation when deleting.


Is your 404 page usable enough?

Posted: March 6th, 2009 | Author: | Filed under: Errors, Patterns | Tags: , , | No Comments »

There are lots and lots of articles on 404 pages and creative solutions for that. I was reading (looking at it to be more exact) today a post on Pattern Tap and i thought: What is a common user thinking when he sees online gaming:

404 – Please update your bookmarks

2009-03-06_1736

The common user has no freakin’ idea what “404” means.

The rest of the message is confusing also: “Please update your bookmarks“. Huh? bookmark? what bookmark? my bookmark? what’s a bookmark? Have i done something wrong? Is it me? Oh man, i fucked up LoL, didn’t I?

The 404 message must be clear: “The page you’re looking for does not exist, either you came on a broken link or the page was deleted in the meantime” or something like that, in plain english so your mother could understand it.