I’m putting the finishing touches to Scroll Gates web site, spotting those gremlins and beating Internet Explorer into place.

The brief was to update an existing site for Scroll Gates, a wrought iron gate manufacturer based in Hampshire. After providing a ‘health check’ of the previous site, which was getting some traffic but looking very dated, I identified improvements on not only the look but also the content and on page search engine optimisation (SEO).


Draft Designs

Draft 1

Draft 2

The client received my changes positively and I began to build the new site. After putting together a couple of design drafts for the customers assessment we chose to create a contemporary web site with a strong focus on the high quality work undertaken by the company. Large images of the businesses best gateways would be used in the background of the pages, which would be best seem on the homepage but would hold the content on the remaining pages also.

Site Design
Scroll Mac

The home page focuses on the businesses skills and rich history as well a promoting the high quality customer list the company can boast as well as guide visitors with clear navigation to different appropriate pages.

Created with a flexible chassis which allows the page to be viewed down to 800px wide without losing clarity, the page also detects visitors using a mobile browser on a smart phone and reorganises the content to suit into a single column allowing mobile visitors to view the site in a suitable format without having to pinch and zoom around the pages.

Scroll iPhone

Techno Gubbins

Behind the scenes there are a few things going on. Firstly using a lightbox script, the gates page of the site injects more detailed information on gate styles into the existing window without taking users to a new page enabling simple browsing. The gates gallery page also uses the same script to allow visitors to browse the images with ease.

Secondly the detail on the gate styles offers a price estimate for visitors. The client wished to be able to alter these prices himself. As a simple solution I created a Google spreadsheet document containing each gates cost (there are around 300 in total). The client can access this spreadsheet from any computer to update the costs at any time. Using some shifty php magic, this file is accessed when a price page is loaded and inserts the latest cost in the correct place.

This allows the client the freedom to make changes instantly without needing to contact me for an update.

So if you’re after some electric gates hampshire then do check out Scroll and give them a ring!

Some Thumbnails

Scroll Screenshot

Scroll Screenshot

Scroll Screenshot