Redesigning the Information architecture of a large site
- Date:
- October 16th, 2008
- Category:
- Web design
Planning a large site, or reorganising an existing large site can present all kinds of problems. This article looks at some of the steps involved in transforming the information architecture of a site that was rather labyrinthine, and difficult to maintain. The existing site was in such a state that a complete overhaul was the best option. This was a huge undertaking consequently this article provides an overview of some of the work involved.
Existing site structure
The existing site had been built piece-meal over several years, with new sections being simply ‘bolted on’ where ever they would go. The accompanying sitemap (image left) gives an overview of the structure. Several sections could only be accessed by registering and signing in. However different registrations were required for each section. Some of the training workshops required attendees to visit one shop to purchase a ticket and another to purchase training materials. The architecture reflected the company structure, so making little sense to visitors. This made the site difficult to navigate. Finally, the site looked radically different as one moved around. As could be expected, incorporating new products and company changes was next to impossible.
Objectives
There was a weighty list of objectives, two of which are particularly relevant here: rebuild site focusing on the customer, and make the site as adaptable to future changes as possible. In this case focusing on the customer means making it easy to navigate, locate information and carry out tasks such as making a purchase. Adaptable to the future means being able to add and remove sections, move content around the site, and update branding, without the having to rebuild everything.
Step one – Information gathering
- Listed all the site sections, pages and applications (calendars, booking systems etc.)
- Listed visitor types (see image on left)
- Listed known current and long term company objectives
- Gathered desired improvements from company departments
Step two – evolving a new structure
Using filing cards as site sections and post it notes of various sizes to represent sub sections and pages, we built paper prototypes, recording the layouts as they evolved using a digital camera. During the process we identified multiple occurrences of pieces of functionality that could be combined into single applications. We then placed all the new applications on a notional ‘second layer’ of the site, leaving the ‘top layer ‘as a brochure. The advantage of doing this is that subsequent changes in brands or company structure can easily be incorporated in the top layer, without the need to carry out extensive rebuilding. Each layout was tested against our visitor personas, and improved.
The new structure
The new architecture was radically different from the existing one. Hopefully the accompanying diagram (image left) gives a flavour of what changed. Sections of the site that provided information on gym fitness programmes, a core part of the activities of the company in question, were gathered together in a ‘programming’ section. At the same time we rewrote the content of these sections so that they effectively became brochures. We separated out functionality that had previously been duplicated and branded specifically for a particular programme. The functional aspects were combined into single applications which do things like take bookings for courses, or provide event calendars. These applications can be referred to, and accessed from the new sections. The same was true of the document download facility. Where once there were several download sections, there is now just one, which displays only the documents a particular visitor is permitted to access.
Wireframe development and marketing input
As the structure evolved we started to test the options in greater detail, building wireframes (image left) and incorporating marketing requirements. The structure started to resemble a family of micro-sites, topped off with a set of section home pages, each focused solely on it’s own section. There are many benefits of working this way. Particularly relevant here is that the architecture, when presented for approval, survived detailed examination without the need for significant modification.
