.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Articles >> General >> Post New Resource Bookmark and Share   

 Subscribe to Articles

How to decorate a FAQ page in html

Posted By:ASPEvil       Posted Date: August 30, 2014    Points: 200    Category: General    URL: http://www.dotnetspark.com  

This article shows how we can make a well decorated FAQ page for the best user experience, in HTML.
 

Whenever we are making a website, several pages need to be developed to provide information and/or services, the client is going to provide. And a very important page among these all pages, is, the faq page. F.A.Q stands for "Frequently Asked Questions" which we can assume, the users of the website, is going to ask for a particular business. For example: if the website is going to be made for the garments seller, then the frequently asked questions of the users of this website, will be something:  can I return a garment after purchasing it? Is there any full cash back available at the time of returning the garment? Etc.

Now lets see how can we can make a faq page which is very easily accessible by the users.

First we put the Questions as follow:-

-----------------------------
<a href="#return" style="color: #660033"> Can I return a garment after purchasing it?</a><br />

<a href="#cash_back_at_return" style="color: #660033"> Is there any full cash back available at the time of returning the garment?</a><br />
------------------------------

Now we have put the two questions with some formatting, as above. With href="#return" and href="#cash_back_at_return" means, whenever the respective links will be clicked, then the href will point a html element with the id: "return" and the id: "cash_back_at_return", respectively. We also did some formatting of the same, using the: "style" attribute.


Now we need to create those html elements with those ids, we mentioned with the href attribute of the hyper links. We can do it as follow:-

-------------------------------

<label id="process" style="color: #660033; font-weight: bold; font-size: large"> Can I return a garment after purchasing it?</label><br />
Yes, surely you can return a garment after purchasing it and it should be returned within 30 days of the purchase and without any damage on the garment.
												
<label id="process" style="color: #660033; font-weight: bold; font-size: large"> Is there any full cash back available at the time of returning the garment?</label><br />
Cash back is only available if the purchased garment is faulty or damaged by our mistake. Else you will need to take any another garment of your choice as the replacement of the purchased garment.


-------------------------------

Now, we have put two html label element with the ids of those mentioned with href attribute of the hyper links, as we did it previously. We also did some formatting of the same, using the: "style" attribute.


But the question is why we again put the question with the label? The answer is: There may be a lot of questions put together with the format of the hyper links and if we will not put the question again, when the user come to the answer after clicking the hyper link for the same, then it would be difficult for the user to identify if they have arrived at the answer of the correct question, they were looking the answer for. And finally, I put some dummy answers with the questions as the sake of completeness.



Now your decorated FAQ page is ready to go.






Thanks.


 Subscribe to Articles

     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend