August 17, 2015

Make Your FAQs & User Guides Rock!

Categories: 
Published: 17 August 2015 

Having a frequently asked questions (FAQ) or User Guide page on your website is a great way to help answer the user’s questions and concerns, while making it clear that the organisation is listening to what the user has to say. If your FAQ section echos real questions from real customers, it’s likely it will help your SEO as well. Today people type their questions straight into Google and expect an answer that fits with their own terminology. Potential customers aren’t always using the same language to talk about your product that you are. If you put some extra time and effort into creating a good and up to date FAQ or User Guide page, you might actually end up minimising time spent on customer support!

But what’s the best way to structure your FAQ page or User Guide? There might not be a definitive answer, but there are several factors you should keep in mind while considering the structure of the page/s, and it might all come down to the category and complexity of your website. We’ve put together a guide for some different layout styles used by large, online companies to identify and evaluate the different approaches.

All on One Page

One of the standard ways to set up your FAQ page, and a layout structure that’s been around for a long time is having all the content on one page, using a table of contents style with questions on top, then the questions and answers linked further down the page. The online shop Zappos currently uses this straightforward approach – all the items in the question list include internal links to the specific questions and answers further down the page. Internal linking is important for SEO as it sends a strong signal to Google that your site is directing visitors to the areas of your site that are useful to them. At the end of each answer, there’s a ‘back to top’ link to quickly bring you back to your starting point.

zappos-screenshot

This layout style is fairly simple and there are a couple of items Zappos could improve on. By  differentiating each question more clearly from the answers, they could could make the page easier to scan. At the moment, almost all the text is the same size, and nothing really stands out – it’s important to have a good visual hierarchy on the page to guide how the user moves their eyes around the page. Another thing worth mentioning is that they have failed to include an FAQ on their mobile site at all, something that will make their SEO suffer.

The Nielsen Norman Group, experts on user experience, says that this type of traditional question list followed by the questions and answers is still the best underlying design for short and medium length FAQ pages. A list like this also makes it easy to search for your answer using the ‘find’ functionality in your browser.

Another site using a similar but slightly different approach is PayPal’s user guide for using their service ‘PayPal Here’. They’re listing the questions and answers all on the same page, but what they’re doing differently is that they’ve placed the table of contents on the left hand side in a fixed position. As a bonus, this navigation automatically expands and collapses each section based on where you are on the page. This helps the user navigate within each section or look through other sections without having to scroll all the way to the top of the page again. The page hierarchy is very clear through different sized headlines with varying colours. The content for each section is well structured and explains how to use the product in an easy to read, step-by-step manner with screenshots included when appropriate.

paypal-screenshot

The one main downside to PayPal’s approach is that they have decided to completely remove the navigation on mobile screens, and the user is left with having to scroll up and down a long page to get an overview of the topics covered.

Larger Pages, More Complexity

The article by the Nielsen Norman group also outline that for longer FAQ’s, the best approach is to use a list of questions that lead to separate answer pages.

The Dropbox User Guide have split their information into different categories, where each category spans across several pages covering the variety of questions and scenarios that might occur. The information presented on the page is structured using screenshots and step-by-step instructions on how to do a variety of tasks. On the bottom of each page you’ll be asked whether the information on the page is useful or not – this user feedback is a great resource for the business to customise and adapt the content to the user needs, which in turn makes for a better experience in the future.

dropbox-screenshot

Although the table of contents landing page has links to all the categories and sections within each category, you still have to navigate away from your current page to get a good overview of the different sections and topics covered. This has the potential of creating a tedious and time consuming process of finding the information you’re after. Having a search field somewhere on the page could potentially help this issue and speed up the process.

Airbnb also has a large help centre section on their website. The landing page gives you a couple of different ways to start navigating to the different sections, depending on what you’re after. The help centre is built up by a combination of introductory articles to get you started, as well as Q&A pages. Each Q&A page has a feedback option on the bottom of the page similar to what Dropbox is doing, letting the user voice their opinion on how helpful the content is.

airbnb1-screenshot

The big plus for the Airbnb help centre and how it differentiates from the other ones is how easy it is to find information and navigate through the pages. A big prominent search bar in the header follows you through to all the lower level pages, always giving you the option to search. In addition, the side navigation dynamically updates as you choose your category and delve deeper into the pages – to support this, the breadcrumbs updates along with it. The breadcrumbs is the navigation trail used in user interfaces to display where you are located in the site hierarchy. The page also has full functionality on mobile with the same content as on desktop, which is even more important since Google has put more emphasis on Mobile experience for SEO.

So, What’s the Best Approach?

One approach won’t fit all. Consider the category of your site and how much information the user would need before deciding on a specific layout for your FAQ or User Guide page. A website where you have to sign in to use a product or service might require a more detailed and complex user guide like Airbnb or Dropbox, whereas for less complex sites, a simple layout and functionality is usually sufficient and preferable.

Remember, don’t add complexity just to make it look good – finding the approach that best communicates the information should be your main goal. Google is always putting the experience of the user first, and so should you.

What’s your favourite approach for this type of page layout? Have you seen anything that is worth sharing? Let us know in the comments!

Having a frequently asked questions (FAQ) or User Guide page on your website is a great way to help answer the user’s questions and concerns, while making it clear that the organisation is listening to what the user has to say. If your FAQ section echos real questions from real customers, it’s likely it will help your SEO as well. Today people type their questions straight into Google and expect an answer that fits with their own terminology. Potential customers aren’t always using the same language to talk about your product that you are. If you put some extra time and effort into creating a good and up to date FAQ or User Guide page, you might actually end up minimising time spent on customer support!

But what’s the best way to structure your FAQ page or User Guide? There might not be a definitive answer, but there are several factors you should keep in mind while considering the structure of the page/s, and it might all come down to the category and complexity of your website. We’ve put together a guide for some different layout styles used by large, online companies to identify and evaluate the different approaches.

All on One Page

One of the standard ways to set up your FAQ page, and a layout structure that’s been around for a long time is having all the content on one page, using a table of contents style with questions on top, then the questions and answers linked further down the page. The online shop Zappos currently uses this straightforward approach – all the items in the question list include internal links to the specific questions and answers further down the page. Internal linking is important for SEO as it sends a strong signal to Google that your site is directing visitors to the areas of your site that are useful to them. At the end of each answer, there’s a ‘back to top’ link to quickly bring you back to your starting point.

zappos-screenshot

This layout style is fairly simple and there are a couple of items Zappos could improve on. By  differentiating each question more clearly from the answers, they could could make the page easier to scan. At the moment, almost all the text is the same size, and nothing really stands out – it’s important to have a good visual hierarchy on the page to guide how the user moves their eyes around the page. Another thing worth mentioning is that they have failed to include an FAQ on their mobile site at all, something that will make their SEO suffer.

The Nielsen Norman Group, experts on user experience, says that this type of traditional question list followed by the questions and answers is still the best underlying design for short and medium length FAQ pages. A list like this also makes it easy to search for your answer using the ‘find’ functionality in your browser.

Another site using a similar but slightly different approach is PayPal’s user guide for using their service ‘PayPal Here’. They’re listing the questions and answers all on the same page, but what they’re doing differently is that they’ve placed the table of contents on the left hand side in a fixed position. As a bonus, this navigation automatically expands and collapses each section based on where you are on the page. This helps the user navigate within each section or look through other sections without having to scroll all the way to the top of the page again. The page hierarchy is very clear through different sized headlines with varying colours. The content for each section is well structured and explains how to use the product in an easy to read, step-by-step manner with screenshots included when appropriate.

paypal-screenshot

The one main downside to PayPal’s approach is that they have decided to completely remove the navigation on mobile screens, and the user is left with having to scroll up and down a long page to get an overview of the topics covered.

Larger Pages, More Complexity

The article by the Nielsen Norman group also outline that for longer FAQ’s, the best approach is to use a list of questions that lead to separate answer pages.

The Dropbox User Guide have split their information into different categories, where each category spans across several pages covering the variety of questions and scenarios that might occur. The information presented on the page is structured using screenshots and step-by-step instructions on how to do a variety of tasks. On the bottom of each page you’ll be asked whether the information on the page is useful or not – this user feedback is a great resource for the business to customise and adapt the content to the user needs, which in turn makes for a better experience in the future.

dropbox-screenshot

Although the table of contents landing page has links to all the categories and sections within each category, you still have to navigate away from your current page to get a good overview of the different sections and topics covered. This has the potential of creating a tedious and time consuming process of finding the information you’re after. Having a search field somewhere on the page could potentially help this issue and speed up the process.

Airbnb also has a large help centre section on their website. The landing page gives you a couple of different ways to start navigating to the different sections, depending on what you’re after. The help centre is built up by a combination of introductory articles to get you started, as well as Q&A pages. Each Q&A page has a feedback option on the bottom of the page similar to what Dropbox is doing, letting the user voice their opinion on how helpful the content is.

airbnb1-screenshot

The big plus for the Airbnb help centre and how it differentiates from the other ones is how easy it is to find information and navigate through the pages. A big prominent search bar in the header follows you through to all the lower level pages, always giving you the option to search. In addition, the side navigation dynamically updates as you choose your category and delve deeper into the pages – to support this, the breadcrumbs updates along with it. The breadcrumbs is the navigation trail used in user interfaces to display where you are located in the site hierarchy. The page also has full functionality on mobile with the same content as on desktop, which is even more important since Google has put more emphasis on Mobile experience for SEO.

So, What’s the Best Approach?

One approach won’t fit all. Consider the category of your site and how much information the user would need before deciding on a specific layout for your FAQ or User Guide page. A website where you have to sign in to use a product or service might require a more detailed and complex user guide like Airbnb or Dropbox, whereas for less complex sites, a simple layout and functionality is usually sufficient and preferable.

Remember, don’t add complexity just to make it look good – finding the approach that best communicates the information should be your main goal. Google is always putting the experience of the user first, and so should you.

What’s your favourite approach for this type of page layout? Have you seen anything that is worth sharing? Let us know in the comments!

Ben Maden

Read more posts by Ben

Leave a Reply

Your email address will not be published. Required fields are marked *

Shares