In Summer 2003, following positive feedback for the IT Centre website work, I was asked to redesign the ITCS website in totality.
- I went through the old site to define the information that appeared most useful.
- I visited different sections of ITCS to assess their requirements for information to be available on the ITCS website, to ensure that the information would be relevant and up-to-date, which would mean that students would use it, and thus stuff would feel it worthwhile posting information.
- I designed the design/structure as illustrated here, in PhotoShop, for someone else to build (using XML). I was concerned to provide various entry points to the information, whilst making categories clear, and a useful search function.
- Large sections of the site were intended to be relatively static, with notes to be made of sections that would need constant revision and updating.
- The central area was provided for content, with pages intended to be short/subdivided where possible in accordance with the fact that web content is harder to read than print content. The width of the page was set so that all information appearing in the content area printed on A4 paper.
- The top bar contains static links to the main sections of the site, as they appear on the front page.
- The ‘How do I…?’ bars on the left hand side were designed to change according to which section staff/students were in, with some questions applicable to all areas.
- The right hand side bars contain a search function (desired by approximately 50% of visitors), a system status bar which was intended to run on a ‘traffic light’ colour code, a monthly article (‘Focus On…’), and information on current viruses.
The end product, as designed by one of the College web developers, is as on this screendump, with the basic structure largely remaining as planned, although some constraints were imposed for various reasons.
- Management decreed that grey was too ‘dull’, and wanted a more ‘cheery’ blue.
- A fixed-width site structure was used, for small screens, rather than the usual fluid structure that I prefer from table layouts.
- The system has been used for extensive testing, and was eventually designed to form the basis of the College internal portal.
Due to developments within the ITCS department, a new portal design is being used, but the content and structure already provided on this site will be re-used for the ITCS section of the new portal, which encompasses the whole College.
- The top bar maintains the same number of fields, but has the flexibility that these fields can be changed. A warning exists that it is not a good idea to change this once the site has ‘gone live’.
- In the ‘How do I…’ section, an extra field was added at the base to ensure that all entries for that section could be seen, as every time refresh is pressed, the choices change.
- The ‘System Status’ became too complex a project, and has never been developed.
- Each content area has the capability to have links added at the base of the main text (links are still possible within the text), leading to sub-information for that section, or related areas..
The front page of the custom built web content management system.
- Links are provided to each main content area, which then offers sub-menus.
- Optional sections are provided for overall areas of the site, including the main content structure, home page, the ‘Focus On…’ page, virus alerts, and the ability to upload images and documents.
An example of the internal pages for the web content management system.
- The content areas are subdivided to provide a consistent ‘look-and-feel’ for the content areas of the website. A title area, a summary area, and a main content area are provided (which can also be worked on it HTML – a method I use is to write the content in Dreamweaver, tweak any errors, and then transfer the HTML to this area).
- At the base of the page, an field option is offered to provide keywords (providing the same function as meta tags).
I think you can still see some of that influence in the current University of Winchester site, which is currently in plans for a new site!