I built the first web site for myself in 1995.

I implemented it in LML, a scripting language developed by Limitless, my former company.

In 2019, I relaunched a new site built from scratch using Drupal 7, PHP and MySQL.

I merged my Wordpress blogs into the site, wrote case studies for work projects and added my favourite photos from Flickr.

At launch, the site contained over 800 web pages.

I advocate what I call functional decoration.

This is the use of colour and imagery to style different site sections. It is based on the fact that people recognise colour and shape before they can read a text label.

Imagery is a back-up for people who are colour-blind.

Wayfinding

This visual signage helps visitors know, from page to page:

In addition, they can better find their way back to a previously-visited page.

I chose an icon from the FontAwesome font and colour for each site section in the main menu.

These attributes are carried through to the main page heading and sub-sections.

I have worked on a lot projects using skills ranging from user-centered design to software development.

I decided to show off my work and creativity by building a feature to display my CV based on skills used in projects.

The profile summary, list of achievements and project summaries are all generated based on the selected skills.

The visitor can print out my CV because there is a custom print stylesheet.

I wrote a custom function to find blog posts related to the current blog post for a sidebar panel.

It looks for other posts with the same tags.

It orders blog summaries by the most matches first - the matched tags are shown bold.

Posts which match only one tag aren't included. However, an exception is made for the 'cancer journal' tag.

There are a few parts of the site which includes collections of images, such as photos or decorative arts.

On each image page, I added thumbnails either side of the page heading to link to the previous and next images.

The links wrap around once you reach the first or last item in a set.

It is implemented by a single function that used the id of the current image then traverses the list of ids in the set to determine which are the previous and next ids.

The in-built Drupal site-wide contact form is quite basic and so I created a custom form to reproduce the features I had on my old site.

Once the mail form is successfully submitted, it displays an acknowledgement in the form of the message details.

In addition, I added a website field which is hidden by CSS to capture bots filling in the form.

If the form is submitted with the website field filled in, no mail is sent and the IP is blocked.