Designing Effective FAQ Pages

May 24 2011 by Mohammad Moradi | 23 Comments

Designing Effective FAQ Pages

FAQ stands for "frequently asked questions." As the name implies, it is a type of web page (or group of web pages) that lists questions frequently asked by users, usually about different aspects of the website or its services. The answers are typically shown with the questions.

FAQ pages aim to make finding answers easy for users. The ideal FAQ page helps people use the website without the need for outside assistance. More often than not, unfortunately, this ideal is not realized.

This article explores various aspects of FAQ pages, from design to efficiency issues. We will also look at some examples (and counter-examples) of great FAQ pages.

Where FAQ Pages Go Wrong

Here are a few things that detract from the usefulness of an FAQ page.

The Questions Aren’t Frequently Asked

Imagine that you’ve just launched a new website and have included an FAQ page. Why? If you don’t have any users yet, then you certainly haven’t received any questions (much less frequently asked ones).

Without user feedback, questions on this page are simply the site owner’s assumptions of what his users might want to know.

The Questions Are From Left Field

We’ve all seen FAQ pages that have bizarre questions — questions that have probably never entered anyone’s mind. Such questions are ones that website owners would like to be asked (e.g., "Why is this website so amazing?", "Who are the talented people running this website?").

The Page Label Isn’t Intuitive

The first time I saw an "FAQ" link was 10 years ago. I wondered about it for a while and eventually learned its meaning. Designers must be considerate of users who don’t understand technical terms. "Frequently asked questions" is clearer than "FAQ."

Also, descriptive and standard labeling is important. For example, California Court uses the label "Q&A," but that’s even more ambiguous than FAQ. Unless you have a good reason, stick with the standard label of "FAQ" or "Frequently asked questions."

The FAQ Page Isn’t Really Needed

Many websites have an FAQ page, but some don’t need one at all. Sometimes users find all the information they’re looking for and have no further questions. This means that the information architecture was designed well.

Imagine an online shop that presents prices and shopping instructions in one particular location; say, on a separate page or part of the home page. But if the FAQ page addresses pricing, it will be redundant; yet some users might seek it out to find pricing information. Link to the main pricing page instead.

Here’s a rule of thumb: if one type of information can be relayed in many ways on one website, there is something wrong with the information architecture of  the website. Everything should be placed in its proper location.

How to Design an Effective FAQ Page

A good FAQ page lightens the load on help desks and customer support calls, which translates to cost savings and convenience for the user (since they don’t have to send a help ticket or pick up the phone to have their question answered). Thus, the importance of a well-crafted FAQ page can’t be denied.

When designing FAQ pages, have the following tips and strategies in mind.

Say "No" to FAQ Pages

Start by saying "No" to FAQ pages. In web design, you should strive for simplicity and you should constantly eliminate things that simply aren’t needed. The FAQ page supports the rest of the website’s content; if it doesn’t enhance what’s already there, it shouldn’t be a priority.

When an FAQ page is needed, it will be your users indicating the need for it. Perhaps you’ll start getting the same questions over and over again or a reoccuring feedback you get is the need for an FAQ page. Let users determine whether they need an FAQ or not.

Gather the Right Questions

The questions on the FAQ page must be real. For a new website, choose a timeframe (say, one month), and then survey and categorize the questions that users ask during that time via direct calls or email. You could even announce your open question period on the website.

If patterns emerge, it probably indicates a topic that should be addressed on the FAQ page. In this way, you can update the FAQ page regularly. This method is effective because users are actually participating in the page’s creation.

For example, The Invoice Machine invites questions, thus showing off its desire to create an FAQ page filled with useful questions.

Providing Good Entry Points

To use an FAQ page, users must be able to find it. Provide an obvious entry point: a distinct, clear and well-positioned link will do the trick. The two most common places for an FAQ link is in the primary navigation or site footer; these sections are separated from the rest of the web layout (often by color, hue, solid lines or white space) and thus stand out. Visitors are used to checking the navigation menu and footer for important links.

Bet Your Followers links twice to its FAQ page, once in the header and once in the footer. Users won’t have any trouble finding it.

GoSiteWave puts their FAQ links in the primary navigation menu and footer, providing two entry points.

The Resumator has a well-positioned and clear link to its FAQ page.

Readability

FAQ pages are generally text-based, so readability is important.

Readability can be achieved in different ways: text decoration (always minding the contrast between text and background), as well as line- and letter-spacing. Good CSS typography applies here.

Bet Your Followers uses contrasting colors to good effect.

As a counter-example, Vegas Uncork’d loses on legibility because of the lack of contrast between background and text, as well as the small font size.

Categorization of Questions

Users who are looking for an FAQ page probably got confused somewhere else on the website. Don’t make it worse with tangled topics.

Basic categories increase readability — a major building block of efficiency. Name the categories intuitively to avoid further confusion.

AGIA displays categories in a tree schematic, with a short description of each.

Here’s one idea: put the most important questions and answers in a distinct category. IMDB puts its top questions in their own category, no doubt increasing findability.

Mint has a well-categorized FAQ page. The categories are named well, too. In addition, they list the most frequently viewed questions.

Notable also has good categories, as well as a list of top FAQs.

Using icons can be effective in supporting categories, as Vertical Response does here.

While ABA English categorizes relatively well, the naming is inappropriate, so readability suffers.

Search

For ease-of-use, search functionality is essential for longer FAQ pages. When an FAQ page has many categories and subcategories, each described in detail, search becomes more important than ever.

FAQ search should differ from the general search system of the website, and this difference must be denoted in order to reduce the amount of search results and make finding the right questions easier.

IMDB adds a heading to indicate that the search will retrieve helpdesk topics only.

The label of the search feature on the FAQ page of SurveyMonkey works well.

Providing Visuals with Answers

Often, a picture is worth a thousand words. If images can help solve a user’s question, don’t hesitate to use them.

For example, The Bank of Washington offers screenshots to illustrate the answer to a question like, "How do I recover my lost password?"

Tips For Structuring an FAQ Page

If you have only a few questions and answers, put them together rather than on separate pages.

Of course, page length must be considered. Endless scrolling will tire users and cause them to leave before finding answers to their questions. Keep the page as short as possible. Make sure each question and answer pair is valuable.

Some circumstances make long pages unavoidable; linking to the top of the page after each answer is a good solution.

For the sake of readability, distinguish questions from answers, whether by color, size, typeface or decoration.

ETS has a well-structured FAQ page. Questions and answers are organized by topic, and the topics are collapsed by default, thus saving space.

CrazyEgg puts its questions on one page and answers on another, which is not very convenient for users.

Despite the wealth of material on NASA‘s website, the difference between the questions and answers isn’t very clear.

The way NetFaqs separates questions and answers is problematic.

PodShop indicates questions with a different background, a simple and effective way of creating a distinction between questions and answers.

The "Back to top" links on Rapid XHTML allow users to return to earlier sections of the page without having to scroll up.

Conclusion

Designing FAQ pages, amid all the other pages of a website, can be complicated work. Keep in mind that "FAQ" is a general name for the type of page that answers real questions and guides users. Most users have had trouble somewhere else on the website and are looking for a specific answer, so design the page in a way that actually helps them.

Related Content

About the Author

Mohammad Moradi is an undergraduate in computer engineering. He spends his free time studying and researching web-related topics such semantic web and search engines. Moreover, he is a web/graphic designer. Contact him via moradi.c85@gmail.com. (He likes email among others!)

23 Comments

louise

May 24th, 2011

a really useful article on the shape and design of FAA’s. We are launching a new trasactional website so this will go a long way in helping us design and fill our FAQ pages.

Tom Ross

May 24th, 2011

Great tips, thanks Mohammad! I agree that a lot of website’s simply don’t require an FAQ page. I haven’t integrated one yet as I haven’t had users email me questions frequently.

Arturo

May 24th, 2011

I was actually waiting to read an article about this topic for so long! Good points there!

TheAL

May 24th, 2011

“Without user feedback, questions on this page are simply the site owner’s assumptions of what his users might want to know.” Until you can add questions directly asked, this is really your best bet. Think of it as questions that are frequently asked…by anyone…to anyone like you…ever. Kind of a stretch, but it could still be helpful to visitors.

Vladimir

May 24th, 2011

Good point :)
I don’t think I needed a FAQ page yet :/
…but, we’ll see in the future if it will be needed.

Mainual

May 24th, 2011

Agree, useful article and great examples

S.K. (Insfired)

May 24th, 2011

Say No to FAQ pages is probably the best tip given here. Excellent article on an overlooked aspect of navigation & design.

Melody

May 24th, 2011

I wish people would enter their business kind of like they already have a huge following, and avoid those awkward moments when the audience realizes they dont have one lol. I don’t know whether to buy something, or feel sorry for them O.o
FAQs are like double checking, you just put it out there so there isn’t a question about it later.

Vesa

May 24th, 2011

The NASA link leads to some sort of bogus website. It should be nasa.gov, not nasa.com

Matt

May 24th, 2011

I noticed that all of your examples say FAQ and not frequently ask questions. I think it is safe to say that users understand what FAQ means

Bogdan

May 25th, 2011

Great post and I really liked the examples. Thank you!

Josh

May 25th, 2011

Good post — I appreciate the examples. I agree that questions need to be driven by the actual customer base / website visitors.

dedenf

May 26th, 2011

you’ve got the link wrong for Mint, it’s http://haveamint.com

fael

May 26th, 2011

great article, but you could use PNGs instead of JPEGs for the screenshots.

Jim

May 26th, 2011

Thanks for the summary on FAQ pages.

It would’ve been nice if you linked directly to the individual FAQ pages you showcased (via the image thumbnails) because trying to find many of them from each site’s respective homepage was a hassle.

Frederik

May 26th, 2011

a good faq there http://maespirit.fr/fr/#faq don’t need anchor.

Robin Jennings

May 31st, 2011

Once again a great article on the complexities of great web design.
FAQs have become so standard these days that i just expect to set up a FAQ page for clients and often it isn’t necessary.

James W Dunne

May 31st, 2011

Pretty cool article. Well written but I don’t like the concept of FAQs in general.

I’ve outlined a little further why why FAQs suck on my blog.

Luc

June 1st, 2011

Interesting Post! Thanks for sharing! FAQ are unfortunatly most of the time abandoned in the footer next to the “Legal information” link which is to bad because this customer self-service is really powerful when used properly..

I will add a feature to make the FAQ more interactive: Natural Langage Processing.

At Inbenta, we are specialized in “Dynamic FAQ”. The objective is to use Natural Langage Processing technology to answer users’ questions with high relevancy and detect through these interactions missing contents in order to adapt and optimize over the time the database.

More information on http://www.inbenta.com/en/products/dynamic-faq.html

GoodCitizen

June 1st, 2011

Oh Mohammad,
Well said…
You’ve made me a serious fan with this one.
I just had to explain to my colleagues these very same principals.

Personally, I think if you can’t answer the “FAQs” on the homepage you’re not doing a very good job communicating your purpose.

ItsBuiltForYou

June 7th, 2011

Been hearing from some other sources that FAQ pages are actually getting a bit played out! The actual FAQ’s are making it more to pricing pages and as additional content on other user pages. Just my two cents.

sami kumar

September 19th, 2011

What if I don’t like the site you have designed?

Cha

June 24th, 2013

Thank you for the great insights! Currently trying to draft my online shop’s FAQ page but it seems it won’t be necessary, for the meantime.

Leave a Comment

Subscribe to the comments on this article.