It means “desk” or “work table” in french : how metaphoric for a blog discussing what my work's about. Get the RSS feed.


I'm Thibaut Sailly, an independant interface designer based in Paris. Say hello on twitter or by email at bonjour ✉ tsailly ◦ net.



© 2010-2014 Thibaut Sailly · Powered by Movable Type · RSS

For 3

It makes a lot of sense to agree on a icon for revealing a hidden navigation when browsing a website from a small screen. An icon needs to be iconic, doesn't it? The three lines navicon consensus Jordan Moore illustrated last week in his Smashing Magazine article is, from my point of view anyway, the ideal candidate. I will support it by implementing it in projects to come.

The advantage this representation has over the other candidates is that it can easily translate into different styles. The symbol is so essential that whatever style your site happen to live in, this icon will still be identifiable - baroque, modern, americana, caveman, you name it. Three horizontal strokes. Cogs, item lists and grids don't provide as much expressive flexibility.

On top of this ability, what I love about this choice is that it could also be a great indication for a gesture. It is very likely it will appear on screens that not only small, but also touch sensitive. Three horizontal lines tells the user "touch me and I'll show you the navigation". It could also be easily understood as "swipe three fingers horizontally and I'll show you the navigation". Knowing, because you saw the icon when the page appeared, that a three fingers horizontal swipe could lead you to the navigation without having to scroll scroll scroll to the top of the page could be of some comfort. Now, to trigger this sort of thinking in your day to day user, it would need to be implemented very widely and consistently.

three horizontal lines, and the three fingers swipe to the right symbol

What I'm trying to say here is, if we are to agree on a standard appearing on small touch devices, why not extend this standard beyond the button, to a gesture.

Right here, it would be awesome to point you to a demo I would have set up so we could see how and if it works in reality, but it looks like implementing it is still a little too hardcore for my javascript skills - working on it. In the meantime, let's think about it.

Happycog acknowledged the choice of this icon by replacing it on its blog. Swift.
jGestures seems to be the place to start, before this sort of multitouch event becomes available in touch devices browsers.

« past present »