Accordion Sites
1st edition — by Patrick McNeil — Nov. 6, 2007
The Design Element
Over the years I have created many accordion style sections on sites. Most often it is a tabbed section where the content changes via an accordion script. My favorite script is moo.fx, and quite a few sites I have built use this. What draws me to this group of sites though is that the entire layout of the site is built on the accordion In many cases, these are essentially single page sites that have been reduced in length via the accordion By reducing these sites to their major headings, the length is greatly reduced, and users are able to go straight to the information hey are looking for.
One of my favorites among this group is the keen.nl
site. I think this one sticks out to me because it somehow uses the style in a fresh way. Many sites have the standard blog format with headings and a flow of copy. This approach of headings only is very interesting to me. It sure puts a lot more significance on the titles, but as a user I find it incredibly easy to scan the articles for one I want to read. Considering the short attention span of most surfers, this is a really great way to cut through the clutter and connect with readers.

Sample Usage