shelf

Our featured designs of the week display their content on shelves in very interesting ways. Playing with perspective and adapting a certain level of realism is always a good way to go.

Designs of the Week

Make Headway, make intuitive layouts, make it your WordPress theme of choice!

I love the animated tableau slash deconstructed slider. The geometric logo seems to change colors according to the focused slide as well. The rest of the site is more subdued but the subtle animations that fade and slide in the images/content into place, as well as the hovers on the buttons, are very much welcome.

I like how the site name appears to be furniture decor lettering sitting on the shelf. Using picture frames for author interviews is also clever. I just wish this site wasn’t unfinished: the Twitter feed is broken, and there’s greeking text in the footer, not to mention, tight leading and tiny font sizes.

Red text or as a highlight is a trend I’ve been seeing lately, often accompanied with lots of gray as seen here. There’s also a crack of whimsy via the floating astronaut illustration too.

Social Media Weekly

Want your site to be as good-looking and inspirational as these? Start by choosing a well-designed theme from ThemeForest.

Web Standards – Dealing with IE
“You could justifiably argue that IE7 users should upgrade their damn browser. But that same argument doesn’t really hold for IE8 if the user is on Windows XP: IE8 is as high as they can go. Asking users to upgrade their browser is one thing. Asking them to upgrade their operating system feels different.”

Accessibility, Semantics – Neutered Links: A.K.A removing the href attribute
“I’ve seen a new inaccessibility pattern appear with links that are not keyboard accessible. This article will explain the problem, solution, and provides a helpful bookmarklet for finding these neutered links on your page.”

Last week I mentioned a site that uses a shelf as a nice metaphor for holding content, so let’s look at several more in this week’s Friday Focus.

Designs of the Week

Big, bright, and shiny. This is a flawless design basically. My favorite part is the Twitter icon also getting the same tag treatment.

Love the contrast between the old style glass jars and the new media stickers and trinkets inside them. I think the only missing part here is better typography.

The book titles and shelf height could be bigger. I like the addition of the electrical outlet to the side even if it doesn’t really add much to the design. The browsing and sorting animations look great.

I would really love it if sites using the shelf metaphor take it all the way and support drag-and-drop, and other AJAX interactions.

The colors and details here are great, but I have to wonder if a kids-oriented site should use a lighter color palette. What’s stopping shelf designs from being pastel-colored instead of literally brown because of the wood? Is it the lighting?

It’s nice to see shelves on a more popular site such as Shelfari (the name begs that I guess). It’s probably the most well-done too: no skimping on features and the look blends well with the rest of the interface elements (tabs, buttons).

Social Media Weekly

HTML – Exploring Markup for Breadcrumbs
“So where are we at on this? I’d say that there is no super-ultimate best-possible-way to handle breadcrumb markup yet.”

Design – The Three Threats to Creativity
“Creativity depends on the right people working in the right environment. Too often these days, the people come ill-equipped, and their work environments stink.”

Accessibility – Accessibility myths in 2010
” Early this year, Ian Pouncey posted a few other Web accessibility myths. Here is a quick roundup of the myths from these two articles.”

HTML5 – HTML5 Outliner

Design Focus: Shelved

Designs of the Week

Social Media Weekly

About Devlounge

The Best of Devlounge

Vectr: a free graphics editor on your desktop and in the browser

Search