37signals logo

This is Signal vs. Noise, a weblog by 37signals about design, business, experience, simplicity, the web, culture, and more. Established 1999 in Chicago. Visit the Product Blog for more information on our products.

Jobs:

Generous link targets in the library Ryan Jun 23

12 comments Latest by Michael

I love me some padded link targets and today’s provider is a Working Library.

The site is about books and their connections. Each post references one or more books and the referenced books are aggregated in the right-hand sidebar. When you hover over a book title, the crisp tiny type is immediately enveloped in a big cozy hover block.

I particularly like how the hover reinforces the column dimensions. It’s a sudden punch of structure to the otherwise airy layout.

(Found via JSM’s oddities)

Looking for a job? Got a position to fill? Check out the Job Board.
Over 1 million people use 37signals' simple web-based software to collaborate on projects, track contacts, and organize their business with an intranet.

12 comments so far

osmif 23 Jun 08

Nice UI. Nice clean, almost RESTful URLs too, courtesy of an Expression Engine backend.

Anonymous Coward 23 Jun 08

I like padded link targets too. It took some effort to do, but I think it was worth it: http://mizzouwire.missouri.edu/

Josh N. 23 Jun 08

Oops, I forgotto link to Mizzouwire and include my name. :-)

leethal 23 Jun 08

Wow, Josh N., that was actually really awesome =D

Brandon Durham 23 Jun 08

I always try to pad any kind of navigational links, for sure. I love the way it feels (and, in this case, looks). Such a small thing that makes a big difference.

Greg B 23 Jun 08

Where’s the impression of “it’s a link”?

And I’m not implying that it should have been blue underlined text but that is one of those ‘hover around and explore this site kind of thing’.

Bad design in my book.

Joshua Go 23 Jun 08

Greg B makes a good point that there’s no impression of “it’s a link” anywhere.

I’m a programmer and I mostly write back-end code and deal with the database, but being part of a small shop, it’s inevitable that I eventually touch some aspects of design. My designs have been called “boxy” in the past and so I’ve taken to removing explicitly visible borders.

Doing so will give the design an airy feel, but what you just wrote about the padded link reinforcing the column dimensions is worth making a mental note over. That way, a design can avoid being too boxy while still having some semblance of structure present.

Mandy 23 Jun 08

Greg B makes a good point that there’s no impression of “it’s a link” anywhere.

Links on the site are identified in boldface, which I think is clear if you look at the entire site (and not just this corner of it).

This is actually one of my favorite parts of the design; I wanted something intentionally restrained (and book-like) but this was one place where it seemed to need a little more oompfh.

Anonymous Coward 23 Jun 08

Looking at this design, I see a memory I never realized How happy it makes me. Go Mandy.

Well it’s clean and it gives without taking, but I’d send it away.

bucci 24 Jun 08

Although I agree how padded links are nice, to me, the hovered links were not padded as you have shown on the image. They were padded only when I hovered over the actual words.

I am not a pro about web UI, but could it be because I use IE6 ?

Although I like the stylish and minimal design of the link, I agree to Greg B about the low impression of “it`s a link”. You find out only when you hover over them.

Tory 24 Jun 08

Wow, that website is gorgeous.

Michael 24 Jun 08

It’s all about appropriate context.

Comments are closed