You are here: Home > Patterns repository > FAQ

FAQ

Print versionEdit this page
Also known as: Frequently Asked Questions, Questions & Answers

Example from site xxx (date screenshot)

FAQ is a very common and deeply rooted web functionality. Together with other so called site-wide functionalities like Help and Contact it helps to answer any questions users might have about the website, about the entity behind it or about the products, services or information it offers.

Problem

FAQ pages lack overview and seem to force the user to a lot of scrolling or clicking.

Motivation

By providing a set of FAQ (frequently asked questions) plus the answers to those questions companies and institutions can significantly reduce the number of emails or phone calls.

FAQ pages come in two main species:

  1. A page that consist of anchors at the top linking to questions and answers lower on the page. This set up generally results in very long pages that lack overview.
  2. A page with questions that link to answers in a pop-up or on another page. This set up equally lacks overview and forces the user to a lot of switching between the list of questions and the detail pages with the answers.

Neither of these solutions seems satisfactory.

Solution

Provide a list of clickable questions which when clicked upon open up to reveal the answer directly beneath the question. The next question is pushed down in the process. Clicking on another question in the list causes this question to open while the question previously opened now closes. Thus the user always keeps the total list of questions in view, even when he's reading the answer to one of the questions.

Diagram

A drawing

Use when

The context in summarized form.

Implementation

Details and variations how this pattern is used in real life.

Discussion

Examples

put PNG image here
Example from site xxx (date screenshot)


Connections

Relations to lower patterns.

Literature

Books and articles that are used describing the pattern.


-- JoostWillemsen- 01 Jul 2003

Joost, it seems that the pattern you are describing is an example of Progressive Disclosure, with FAQ as a possible problem area!

If I understand it well, the problem you are describing is something along the lines of: "Presenting all information on the page at once is confusing and induces 'information overload'."

I found some links:

(just a few pages found with Google using: "progressive disclosure" interaction design)

Another excellent example is the print page of www.ns.nl after looking up a train trip.

Macromedia also has a Flash Component called Accordion (example)external link that is an implementation of Progressive Disclosure.

So my suggestion is to rename this page to Progressive_disclosure and change the text a bit :-)

If you still want to write about FAQ, here are some links:

-- ArthurClemens - 05 Sep 2003

Flash_intro_app.png Screenshot of Intro App, a "Rich Internet Application" built for FlashForward 2003 in San Francisco. This screen shows an Accordion Pane. The large horizontal bars are clickable, and disclose the steps in entering personal data.

Attachment: sort Action: Size: Date: Who: Comment:
us-faq.pdf action 181670 05 Sep 2003 - 22:44 ArthurClemens