This project was done in conjunction with i-hub/w-hub, (an excellent organisation that I often collaborate with) for a London electrical contractor. Whilst simple in terms of content and functionality, I wanted to give the site a simple but striking look. This was acheived using a combination of a fixed page background with a semi transparent header, navigation sidebar and content area, customs graphics on the navigation buttons with an electrical theme, and a specially designed logo – also with an electrical theme.
Screenshot of Website Homepage
The background position themselves either side of the page for irrespective of the size of the browser screen, so the site looks balanced and attractive for any screen resolution.
A simple contact form enables customers to get in touch…
Screenshot of contact form
… and the addition of two “Lightboxes” means that every page carries a full list of the services provided, and all the locations they serve. These are “tucked away” in Lightboxes, so that although these details are in every page, they do not show unless the viewer clicks on the relevant buttons.
Screenshot of a "Lightbox"
All in all, an attractive website, coded from scratch by hand in a text editor using ASP, XHTML 1.0 Strict, and CSS 2.1 (fully W3C standards compliant of course) . It was very rewarding to design, and as usual I completed it on time and within budget.
Summary:
- Custom designed logo.
- Custom designed “active” menu buttons.
- Fixed page background which sizes to fit the screen.
- Transparent header, navigation sidebar and content area.
- Contact form.
- Two “lightboxes” which grey out the main page when activated (except in IE – it worked OK, but IE really struggles to handle transparent lightboxes unlike decent browsers), one to display a list of services provided, the other to show a list of all the company’s branches.
- XHTML 1.0 Strict (fully standards compliant).
- CSS 2.1 (fully standards compliant).
- ASP.
- Coded by hand from scratch.