User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

Are there standard uses for it?

I see it most often when embedding example code...

As see on Twitter Bootstrap:

share|improve this question
up vote 5 down vote accepted

It's called a well element because it visually sinks into the surface of the page, like a well sinks into the surface of the landscape. It suggests that there is a (grey) level below the (white) one you're looking at currently.

Most appropriate uses therefore would be to show something that is a subset of what you're currently seeing, eg navigation for the next level down, or more details of the thing you describe. It should not be required to read the well content to make sense of the page therefore, it merely adds information that can easily be skipped. This could work for a block of code, but not so much for a block quote.

Don't overuse the effect though. A well should take up only little space on the page, and not be repeated often on the same page.

share|improve this answer

I have never heard the term well used for that. Huh. Maybe it's a Twitter term. Visually, I call it a box. Or maybe a frame. In terms of semantics, well context is everything. It could be used as a call out. Or a heading style. Or a block quote. Or, as in the example, a block of code.

It's appropriate to use it whenever it makes sense for you to use it...likely to emphasize or highlight some content.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.