New Zealand Artificial Limb Service
Website: nzals.govt.nz (site has since been redesigned) - view screenshots
Size: 13 template pages for a 120+ page website
Government status: Crown Entity
My professional status: independent web designer/developer
Website client: New Zealand Artificial Limb Service
Dates: February - June 2012, with ongoing support after delivery
Brief: the NZALS is a Crown Entity that helps meet the rehabilitation needs of New Zealand amputees and is the national provider of artificial limbs in New Zealand. They had developed the concept of a 'health hub' to act as a first place to come for New Zealand amputees and needed a new website in order to achieve this.
Their existing website was old and tired, providing very little practical information for amputees and their families - and contained not a single image of an amputee or person with an artificial limb.
On the recommendation of our clients at the Ministry for the Environment, the NZALS asked us to quote for a completely new design, new HTML/CSS templates, and a new CMS. At the same time they took the opportunity to completely re-write the content for the website, which we managed and edited for them.
Ali & Tom - I was having such fun working on the website - you guys have been awesome to work with and the extra effort and passion has not gone un-noticed - we are raving fans of WebWeaver.Gaye Forster, Finance and Administration Manager, NZALS
- Developed the "Our stories" concept with the client, which has resulted in the inclusion of a collection of truly inspiring real-life stories from amputees around the country, that make up the true heart of this website
- Managed the content re-write and editing process, ensuring that this ran smoothly for the whole team, and that the website re-write was completed on time and within budget - I offered this service for the first time with this project, as I could see the client had a real need for it
- Took the website from a dry and dusty few pages with not a single photo of an amputee to be seen anywhere, to a vibrant and informative photo-rich website that supports and enables New Zealand amputees, while at the same time celebrating their courage and positivity.
My responsibilities included:
- Writing the pitch for the website fixed-price contract
- Creation and refinement of the information architecture and site schematics, including template wireframes and sitemap
- Project management and ongoing liaison with the NZALS team in order to achieve all their aims for the site, and to work through a range of technical and implementation issues with them
- Project management of the WebWeaver team (myself, developer Tom St George and content editor Alice Masters) including the development of design/development timelines within a programme of work and ensuring that we achieved all our project milestones in a timely fashion
- Design of the site - including the look & feel, graphics, and navigation - beginning with a couple of different designs in order to give the NZALS team an overview of two different design directions
- Development of a set of 13 templates in pure CSS and XHTML 1.0 Transitional, which Tom then integrated into the SilverStripe CMS
- Hand-coding in XHTML 1.0 Transitional to a very high level of accessibility and e-government compliance
- Testing the site for e-govt compliance using Firebug, the Firefox Web Developer toolbar, Wave, Ask Cynthia and the Juicy Studio Luminosity Colour Contrast Ratio Analyser, and with reference to the new NZ e-govt guidelines and WCAG online documentation
- Testing all the templates against the 62-point WCAG 2.0 checklist to ensure that the website was fully e-government compliant, and providing test documentation to this effect
- Building and styling an image map of New Zealand for the Limb Centres page which displays the address of each Limb Centre on hover - all-CSS, no jQuery required
- Incorporating a range of CSS3 effects within my stylesheets including border-radius and box-shadow - which had to work in (almost) all the browsers on our test list
- Ensuring that IE6 styling/display was as close to the original design as possible without the CSS3 enhancements
- Extensive testing of the site at all stages of the development process, ensuring complete consistency across the following browsers and platforms:
- PC: Internet Explorer IE6, IE7, IE8, IE9; Chrome, Firefox
- Mac: Chrome, Firefox, Safari
- The creation of a sitewide CSS print stylesheet also tested across the full range of browsers and operating systems
- Ensuring that every template had been validated using the W3C Markup Validation Service and that it conformed to XHTML 1.0 Transitional requirements
- Managing the NZALS's content re-write, including creating and populating a comprehensive content audit document as an Excel spreadsheet and providing content templates for the team to use in order to save the content required for each page in a consistent and trackable format
- Setting up a shared Dropbox folder and sub-folder system in which all the content (text and images) was kept, and which all members of the team could access and work on together
- Managing and overseeing the progress of Alice Masters, my web editor, to ensure that all the content supplied by the NZALS would be fully edited by the date we had agreed
- Writing and editing some of the content myself, particularly the more technical pages
- Building the skeleton site in SilverStripe so that all the pages would be ready for the NZALS web editors to input content quickly and efficiently
- Training the team of five web editors at NZALS to use the CMS, together with ongoing support as they developed their SilverStripe skills
- Selecting and resizing a large number of photographic images to be used on the site, sourced from the NZALS's extensive image library, and providing Gaye Forster at the NZALS with Photoshop training and support so that she could make her own images as well
- Helping the NZALS team to content-load the site within SilverStripe
- Ongoing liaison with the NZALS team, to ensure that the new templates and backend functionality were working as expected, and to provide additional HTML, CSS and content graphics as required
- Carrying out a full content QA of the site once the team had completed the content-loading, to ensure that all content was properly formatted and that the site was looking its best before go-live.
This was a three-person job - I did the initial quote, information architecture, site schematics, ongoing project management and client liaison, design, HTML and CSS, testing, accessibility and e-govt compliance, CMS training, QA and ongoing support - as well as content production management and some writing and editing. Tom integrated my templates into SilverStripe and programmed all the site functionality. Alice was responsible for editing the majority of the content.
One of my most successful suggestions has been the introduction of a new section of the website called "Our stories". The NZALS approached a number of amputees and caregivers with whom they have worked, and asked them to send us their story, together with some photos to put up on the website. The stories are amazing. They're so full of hope and inspiration, with so many of the amputees saying that they never let their amputation define them, and that they see every new challenge as one which has a solution - and what they need to do is to search for and find that solution. We're hoping that new amputees will read these stories and come away with the understanding that losing a limb isn't the end of your life - it's simply the beginning of a new one.
I've loved being part of this project and I love the website we've created together. The team at the NZALS has been a dream to work with, and the work they do with amputees and their families has been really quite inspiring. The feedback (from both the team and amputees themselves) has been very positive and enthusiastic.