Breakdown of Site Elements
Building a website can be a daunting experience when faced with the initial task of what, where and how. This guide aims to help highlight key areas to consider when building a site by breaking it down into smaller, more managable pieces.
Whatever your websites purpose, there are a number of characteristics that all sites share. These will be the focus of this guide to which you can build upon to suit your own needs. These basic characteristics and the ways to present them are as follows:
Sections or Pages
- Although the Home page is usually made up of blocks of key content from other areas of your site, there are a couple of pieces of content to include. These are:
- An overview plus number of years of service to the area(s) you serve
- Showcase of key products, services, latest work e.g. awards, latest news, seasonal promotions
- Location and map with basic directions (if appropriate) plus contact numbers, social links
- High quality images representing what you do
- Call to action e.g. read more, sign up, buy now, call us, contact us etc.
- An About page should contain at least some details about the people who own the site be it a personal overview or a business overview and include:
- History of business, owner, staff, training, experience, notable jobs, charity work, service, support etc.
- Associations, memberships, awards,
- The Contact page should include all points of access for your visitors to get in touch with you and may also provide directions and parking information.
- point of contact e.g. "Call Louise"
- address street and postal (where applicable)
- Details of the Products and Services you offer are a very important element to include on your site. Putting a lot of effort into these pages will benefit any website. Including high quality images along with customer testimonials or reviews will give credibility and show professionalism in what you are offering.
- Support pages can include resources such as links to documents, videos, tutorials and guides as well as contact forms so a visitor can send you comments, questions, and suggestions. For larger sites categorising your support pages into subjects or sections can assist with easy access for visitors to find what they are looking for.
- The Frequently Asked Questions page, in conjunction with any Support pages, are a great way to provide visitors with answers to the most commonly asked questions about you, your products and or services. A well thought out and well-designed FAQ's section can help provide your visitors with a better understanding of information, products and services you offer and can reduce the strain on support staff.
- A Resources section can be for downloadable content, such as documents, ebooks, articles, whitepapers, as well as links to videos or other sites of authority (e.g. Wikipedia) or within industry. Consider these to be an extension of support or as help files for your visitors.
Presentation - a guide to style
Elements that each of the above pages share are unique to every site and should be structured and grouped accordingly keeping the following in mind for presenting your content:
- Following a theme based on brand or personal preference. Can be taken from an existing logo.
- Content headings are sized according to importance and use six levels as defined in HTML markup: h1, h2, h3, h4, h5, h6
- ordered - used for sequential list of items e.g. steps in a process
- unordered - used for non-sequential lists of items e.g. bullet points, navigation
- definition - group of terms and their corresponding descriptions (now known in HTML5 as description lists) e.g. frequently asked questions
- Tabular Data
- Tables are useful for statistical content where displaying in a grid of rows and columns makes sense e.g. team statistics
- Used on forms and call to action areas
- Font Icons
- A visual aid to common elements on a site e.g. users, telephone number, star rating, calendar
There are many other elements to consider but the above should be enough to get started and then having a better understanding you can then add to and build upon.
As an example, Vendhost.com have used the following specific elements for specific content. These can be viewed across their website as well as in their style guide.
Hopefully this article has given you some key points to consider and think about when getting down to building your website. If you would like to discuss any areas in greater detail please contact us with your questions.