Léonie Watson

Léonie Watson (AKA Tink) began using the internet in 1993, turned it into a web design career in 1997, and (despite losing her eyesight along the way) has been enjoying herself thoroughly ever since.

Léonie is a Senior Accessibility Engineer with The Paciello Group (TPG) and owner of LJWatson Consulting. Amongst other things she is also a director of the British Computer Association of the Blind, writes for .Net magazine and SitePoint.com, and is a member of the W3C HTML and SVG working groups. She even appears every now and then on TV and radio to talk about technology.

In her spare time Léonie blogs on Tink.UK, talks on the AccessTalk podcast, and loves cooking, dancing and drinking tequila (although not necessarily in that order).

Panels and panel sets

Common patterns emerge from a variety of components.

Distribution room power panel

Picture a modern web application. It almost certainly uses interactive controls, perhaps a carousel at the start, probably a set of tabs or an accordion, or maybe it is based on a coverflow or deck. These are common user interface metaphors: if you use these terms, designers know what you mean, and people recognize and know how to use them. At first glance these design patterns seem to have quite different characteristics, but we’d like to convince you that they really aren’t so different after all.

Ok, convince me!

The idea of a panel of content comes from the printing industry. In printing, a panel is a single page of a brochure, or one face of a folded leaflet. A print panel might be visually unique, like the cover of a leaflet, or be like other panels in a set, like the inner faces of the leaflet.

The concept of a panel has been applied to web design multiple times, generally becoming interactive along the way. Panels of content can be expanded or collapsed, removed completely, or presented in collections. Each of these design patterns has a common purpose: display a collection or set of things, generally one at a time to save on screen space. They may cycle vertically or horizontally, or peel off in layers, but these transition effects do not change the fundamental purpose of the thing – to navigate effectively through some pieces of content.

Read more…