An FAQ page is almost necessary for a website, and popular within intranets, where almost every department seems to want one.

Amateur publishers tend to just create a paragraph for the question and a pragraph for the answer. But what’s the ’standard’ for FAQs?

Well, FAQs are a list of Frequently Asked Questions with the answers beneath. Online, sometimes you’ll see the answer smoothly slide out when one clicks on the question. Other times there will be so many FAQs that the surfer is presented with a list of the questions, and clicking on the specific question will either ‘jump’ you down the page to the answer, or take you to a new page with the answer.

I was wondering how best to present FAQs on my intranet, and got a good deal of feedback via Twitter.  I knew I wanted a numbered list, using standard ‘ordered list’ HTML code, but I was prompted to look into the lesser known ‘Definition List. It’s standard HTML code and with some styling via CSS it can become whatever you need.

I decided on the following FAQ format. Unfortunately I don’t know how to make a Definition List auto-number itself like an Ordered List, so the numbers you see are written by hand. Sorry if this isn’t ideal!

FAQ format

1. How can I gain access to Data that has been archived?

In the event that you require access to the archived data you will be required to request access.

2. How long will it take to restore my data?

The service level to restore data is 3 working days (30 Hours).

In the event the data is required urgently, we will attempt to restore your data as quickly as possible.

FAQ HTML and CSS code

<dl>

<dt style=”font-weight:bold; font-size: 0.9em; color: #333; margin-top: 1.5em; margin-bottom: 0.4em”>1. How can I gain access to Data that has been archived?</dt>

<dd style=”font-size: 0.8em; margin-bottom: 0.2em; margin-left: 2em”>In the event that you require access to the archived data you will be required to request access.</dd>

<dt style=”font-weight:bold; font-size: 0.9em; color: #333; margin-top: 1.5em; margin-bottom: 0.4em”>2. How long will it take to restore my data?</dt>

<dd style=”font-size: 0.8em; margin-bottom: 0.2em; margin-left: 2em”>The service level to restore data is 3 working days (30 Hours).</dd>

<dd style=”font-size: 0.8em; margin-bottom: 0.2em; margin-left: 2em”>In the event the data is required urgently, we will attempt to restore your data as quickly as possible.</dd>

</dl>

The bit that was new to me was to have more than one <dd> lines with the answer.

The styling should be done in the CSS; I’ve done it ‘inline’ within the code so you can see the style I’ve used.

If you’re a coder, this should be plain and simple to you, and you’ll know how to improve it. If you’re a writer and you like the format, just let your web / intranet publisher know you’d like your FAQs it use a ‘Definition List’.

I’m a busy writer, editor, publisher and web-coder, so the code above get’s the job done but may not be perfect. Your comments may well help me and others understand how best to improve such FAQs list. Fire away!

[Wedge]

If you would like to share or tweet this article, the Short URL is: http://kilobox.net/1058

kilobox communiqué discusses the theory and practice of 'Internal Communications', touching on all aspects of good communication including writing, channels (e.g. intranets), best practices, technologies and the needs of the audience. I re-launched kilobox communiqué in July 2008, and I'm thrilled to have met so many communication professionals and practitioners online. I read every comment.
If you're new here, you may want to subscribe to my RSS feed. Or maybe you'd prefer
to subscribe by email? You can even follow me on Twitter for updates.