Information Architecture Documentation
When a business designs their website, it is important that they do so with specific goals in mind. These goals need to run alongside their general business aims, working in synchronisation to push the business forward.
Once that you understand what your goals are, you can start to work towards designing your website to create an excellent user experience and, ultimately facilitating the achievement of these pre-determined business goals.
Information architecture is all about understanding how to organise your website to both create the best user experience possible, and also achieve the business outcome that you are looking for.
Organising a website is much like organising a library. It is about the organising (usually a lot) of information so that people can get access to it what they want as quickly and easily as possible.
There are usually a number of different techniques which are employed by website designers to get a good understanding of how users would want to use a site. These include card sorting, interviews and the use of user personas. This information is then analysed and the information architect can begin to be organised within two general fields:
- The first is a library-like organisation, dividing categories into sub-categories, spreading out like a flow chart.
- The second is adapting the information according to what we know about how the brain – and more specifically, the user’s brain works. Cognitive psychology in website design is all about understanding the brain’s capacity to hold and process information, the assumptions that users already have in their heads, and the processes needed to make a decision.
It is vital to be able to present the information that you have found as collaboration is an important part of designing the layout of a website. By presenting site information, you can work together to adapt and fine tune the details to create a really effective website. There are two major ways of presenting information architecture with documentation – site diagrams and wire framing.Site Maps
By designing site diagrams, you have an excellent opportunity to visualise the organisational concepts and hierarchy of your site information.
Site diagrams are useful in a number of ways in addition to helping you to organise the information which is in your head, for you to communicate your ideas to other people. You can use them to show the development process over time, through to when you have a finished blueprint for your overall website.
The best way to go about creating a good site map is by starting simple and then gradually adding in the detail, in accordance to the information that you have found out from your user research and business goals.
You site diagram should include:
- Content organisation and structure
- Structural relationships and easy to understand grouping
- How many ‘clicks’ are required to reach any given page
- Page type (e.g. menu page, internal page, major section entry point)
- Dynamic data elements (such as RSS, databases or applications)
- Internal and external link relationships to the site
- Website directory and file structure
- Navigation terms and controlled vocabulary
- Levels of user access – log ins or prohibited areas
Site maps can be used to communicate with two specific groups of people and can be adapted to suit the information and amount of information which needs to be put across; The simpler, conceptual version to communicate with stakeholders and clients and the more complex, technical version to communicate with technical and design teams.
Throughout the building process, the directory which is built on the server should mirror the major divisions in content as shown on your site map. It is worth bearing this in mind when you are creating your technical site map.Wireframes
The whole idea of information architecture is to keep everything as general as possible, gradually adding more detail, but it can be very tempting to start thinking about how you are going to present the information on your website. Due to the fact that designers are usually visual people, they can begin to get caught up with the design on the actual web pages.
Wireframing allows you to put your general page design ideas down, without getting caught up with too much detail. Wireframes give you a chance to put your general ideas down (without talking about colours, fonts or other details) which can then be expanded on and discussed with the graphic design team.
A wireframe is a two-dimensional document which blocks off on the page a general layout of where you want specific elements to be placed. You will need to think about creating a wireframe for each type of page that you have – for example, the home page, content pages and product pages.
Think about including:
- Page titles or headlines
- Breadcrumb trail navigation
- Search bar
- Links to other organizations
- Local content navigation
- Global site navigation links
- Contact details – email and mailing address
- Primary page content
- Copyright statements
For most businesses, the only specific information which is on the wireframe is the organization logo, but even this isn’t absolutely necessary. Try to keep the rest as generic as possible, with no special fonts or colours.
Information architecture is about keeping things as general as possible, going down into more detail with time. It is important that the research is properly carried out, and that the process is properly documented to be able to create your website in the right way – so that it matches your website and business goals.
With the correct implementation of site maps and wireframing, you can ensure that you get the right amount of detail at the right stage of the process, allowing you to keep focused, whilst allowing your creativity to flow, as well as excellent communication between you and the design teams.
If you have any questions about information architecture, designing site maps and designing wireframes, get in touch with Studioworx either via email ([email protected]), telephone +44 (0)1482 659362 or the website (http://www.studioworx.co.uk).