The Pentagon Direct tabs were an interesting challenge as I had to have a different image if the tabs were selected, unselected, and being hovered over, but the colours also had to change depending on which section of the site the user was currently visiting. I tried several different solutions, including a transparent arrow area which sat atop a CSS coloured background — unfortunately, as I wanted to the web site to work in Internet Explorer 5, I had to use gifs which meant the edges looked jagged and ugly. I didn't want to put out different images for different browsers as I was dealing with a large site and I wanted to keep matters as straightforward as possible, so I decided to make the coloured arrows a part of the image. I made a single image for each tab with a set height on it and used background positioning to show different parts of the same image, depending on what part of the site the user was on.
To deal with the different styles used across the site, I set a different ID on each different section of the site and I created separate CSS files for the code which would change between the sections, such as the background and title colours, to keep track of everything in a straightforward way. Each line of code in the separate CSS files is prefixed with the section ID, so there is no chance of anything being overwritten. There is also a default style for everything in the main CSS file, which is attributed to the home and plain text pages, which do not belong to specific sections of the site.
As well as building the templates and managing the production side of Pentagon, I pitched in to help with the development work wherever I could. For example, I originally built a PHP script for the 'shop by brand' functionality of the web site which took the first letter of whatever you entered into the search text field and took you to the appropriate anchor link on the brand page. However, we decided before the site went live that this might confuse the customer journey and simply made the 'brand search' a link to the brand page.