Sail Tonina
The owners of this new catamaran had already designed their own website. While it looked pleasant and worked well in Internet Explorer (with default settings) there were a lot of problems with the site when viewed with other web browsers.
Accessibility and compatibility
The original site was built using Microsoft Publisher. Although this is good software for paper publishing, the code it produces for web use is limited and generates large files, slow loading times, and incompatible with most browsers. The code is fine for use in some intranets, where the environment is highly controlled but can’t be considered ‘correct’. In particular, the site failed accessibility and compatibility tests, meaning that key site visitors were excluded from viewing the site content.

The old site when viewed in the Firefox web browser didn’t work correctly
After reviewing the complex and oversized code produced by Publisher we decided that the best approach would be to start the build process again from scratch, using some of the original graphical elements and text wherever possible.
Mockups and design process
We supplied a series of mockups to the clients, showing our ideas for the site design and incorporating the graphic design they’d already created. The clients then provided feedback, showing which elements they favoured or disliked. From this we were able to reach agreement and start on the site build. We were also able to agree the budget, which by necessity was relatively limited due to the client’s other startup costs.

A design style which we proposed and was possible within the budget
We were constrained by some design decisions that had been made prior to our involvement, for example the colour scheme and general look and feel. We were able to apply subtle effects to make these decisions (which were better suited to print media) work on a website - for example, subtle highlights and shadows on certain site features. Ultimately we were able to create a design with which we were happy, managed to conform to accessibility requirements, and validated with W3C standards whilst keeping within the budget given.
The build
The build went smoothly and quickly as the signed off design was fully agreed by all parties. The structure of the site was kept simple and consistent throughout to make navigation simple and quick.
A small amount of custom code was written to give a quick and easy to use image gallery of the boat. It relies on Javascript, but degrades gracefully in the relatively rare event of a visitor’s site not supporting this feature. The site was also designed with accessibility and mobile phone usage in mind and should work well with all features.
Implementation
The code was tested thoroughly on all the key browsers in use, including Apple and Linux platforms as well as the more common Windows operating systems.
Indexing was rapid, in part helped by the use of XML sitemaps which allow the search engines to quickly understand the structure and semantics of the website.
Summary and Interconnect IT’s opinion
There was only one problem post-implementation, this being that one charter agent uses an iFrame fixed to just 800px wide in order to show charter websites. The Tonina site is wider than this as it was designed to look good on the larger screens used by people in the target market. However, because of the importance of this charter agent the site will soon need to be resized to accommodate the iFrame. From this we learned of an added requirement that can be worth asking during the design process, ie. “Are there any websites within which this site will be contained?”
The clients were pleased that the design brief had been fully met, with no compatibility issues and a pleasant yet compliant and accessible website. In particular the visitors who were previously excluded from using the old site were now able to explore the site fully.
At Interconnect IT we would like to spend some time working on some visual elements of the site, where we feel we could improve on the client’s original brief and give a more luxurious feel to the site at relatively low cost. Otherwise we’re pleased with the design and our conformance to the design brief we were supplied.




TrackBack Address.