The PIT

Home : The PIT

Charting success

Case study: Five years of quality Web design

A detailed account of The PIT, my personal website, 2000 - 2005

25 Nov 2000 - 31 Dec 2005

The PIT was my personal site for five years and my main canvas for the development of my Web design ideas and experimentation of new techniques I learnt. As such, it shows the progression of my design skills.

The most important development in the history of The PIT were significant code changes in version 6 to much easier and faster to maintain consistency with the look & feel of the site, thereby increasing the efficiency of development.

Image on left, left to right: v6, v8, v10

v10: Inked!

It was time to strip back the busy fussiness of v9 so I re-scripted the CSS to create this minimalistic design. I kept the floral navigation from v6 and incorporated pretty fonts, a stunning black & white combination and fuchsia highlights to make this high-contrast design dramatic in its simplicity.

The quill of v5 returned, this time with an original photograph I took of a pair of feathers and a bottle of ink. Heavily edited, this image became the main focus of this design - emphasising the black/white contrast.

v9: Pansy

A bold experiment, I used DIV tags extensively to create 3D-style boxes for text. Changed colour schemes and images, changed DIV tags to get 3D effect, changed style / rendering of the headings / way headings displayed

v8: Summer

I made a dramatic move away from the masculinity of v7 by re-using the navigation images of v6 and flooding the design with fuchsia, again, with more original photography. Thus I achieved a very different mood and feel to this design with minimal HTML and CSS re-writing, simply by making small (yet effective) changes to key areas - colour, fonts and images.

Whilst the mood changed significantly, the layout remained the same - even down to the same code and style for navigation - to maintain consistency between v7 & v8.

v7: Smithy

I increased my use of forest greens, with accents of grey-green and lilac to replace the warm hues of orange, yellow and pinks in v6. I retained the floral theme, using more original photography for a fresher look.

Having implemented external stylesheets in v6, I was able to make significant changes across the site quickly and efficiently. Whilst I kept a similar look to the navigation, I returned to a more textual-based panel in order to make the site more accessible for dial-up users.

v6: Nostalgic lilies

Heavily graphics-based design, I experimented with DIV tags and numerous image effects. This was my first design to use so many photographs original to me. I loved the look so much that it heavily influenced the next three designs and vestiges of it remained in navigation until The PIT closed.

My requirements for this site were based on making it easy to change images and colour schemes, which I achieved by writing HTML that facilitates this - for example, by the use of CLASS attributes and CSS.

v5

Primarily text-based design, I made use of colour to brighten the site and different font sizes to add visual interest, with graphical elements sprinkled liberally for added effect.

v1 - v4

No design changes.

jump to top of page by Kathleen Bright

Inspiration - Drive - Passion

Jump to...