jQuery Masonry

http://desandro.com/resources/jquery-masonry/

by twampss • 16 years ago

74 10 16 years ago

Although uniform spacing tends to look better from the macro view, I actually find this incredibly hard to read. My eye jumps all over the page, ignoring many of the articles because they are hard to skim. I went to a few of the demo sites and ended up leaving without reading anything.

mattcrest• 16 years ago

I completely agree. I implemented this on a site a few months ago, but ended up removing it because while it did in fact add a cool factor, it hindered readability (shocking coming from a designer, I know).

That being said, I'm sure there are use-cases where Masonry would add value; just not sure what those are.

evo_9• 16 years ago

Yeah, I think this sounds like a good idea until you actually use it. People scan pages in a somewhat orderly fashion and this is too chaotic on the eyes/brain.

Maybe if a designer created a layout with this 'chaos' factored in it could work. But as a general layout plugin I don't think this is an ideal solution.

mikepurvis• 16 years ago

For some kinds of content, you want that skim-and-skip effect, for example the display of reviews on RottenTomatoes (which is in two columns nowadays, but used to be either three or four, I forget).

I think it's really the execution here that's problematic. Compare those examples, with say, http://37signals.com/, which has a similar look, but where each piece has been fit together by hand, rather than by an algorithm just stuffing everything where it seems to fit best.

I know that hand-arranging is often not possible, especially with dynamic content, but that's my take on it.

cedsav• 16 years ago

Maybe the examples aren't great, but it's a very nice tool, and certainly useful if used wisely.

Reminds me of The New York Times app on the iPad. When you changing the orientation, the content is reorganized to fit the available space.

Great work.

ErrantX• 16 years ago

Don't forget that's quite a tightly controlled space (they know the 2 screen layouts exactly and editorially control the content).

So for sites like that I imagine it would work well (less so for sites with widely varying content etc.)

marknutter• 16 years ago

This is how newspapers have been laid out for centuries. As long as the headlines are effective and the typography is well thought out, this type of layout works.

phoboslab• 16 years ago

I did something similar some years ago. It works a bit like playing a simple version of Tetris: http://www.phoboslab.org/files/grid-solver/demo/

I have to admit though that masonry looks much more flexible. My solution was specifically crafted to display images in different sizes, based on their "importance".

gabrielroth• 16 years ago

Try zooming in by one click in Safari or Chrome. The whole Masonry layout totally falls apart. This seems like a showstopper to me ...

(FYI, I'm not just bitching -- I reported this as a bug six weeks ago.)

Firstmate• 16 years ago

This man is correct.

jQuery Masonry

Related Stories