﻿<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Jason Barton &#187; Lightboxes</title>
	<atom:link href="http://www.jasonbarton.co.uk/tag/lightboxes/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jasonbarton.co.uk</link>
	<description>Website Designer, Internet Host and Consultant</description>
	<lastBuildDate>Fri, 17 Jul 2009 18:07:03 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Website for London Electrical Contractor</title>
		<link>http://www.jasonbarton.co.uk/2009/04/website-for-london-electrical-contractor/#utm_source=feed&amp;utm_medium=feed&amp;utm_campaign=feed</link>
		<comments>http://www.jasonbarton.co.uk/2009/04/website-for-london-electrical-contractor/#comments</comments>
		<pubDate>Thu, 16 Apr 2009 20:29:27 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Lightboxes]]></category>
		<category><![CDATA[Website design]]></category>

		<guid isPermaLink="false">http://www.jasonbarton.co.uk/?p=149</guid>
		<description><![CDATA[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, [...]]]></description>
			<content:encoded><![CDATA[<p>This project was done in conjunction with <a title="Visit i-hub" href="http://www.i-hub.co.uk" target="_self">i-hub</a>/<a title="Visit w-hub" href="http://www.w-hub.co.uk" target="_self">w-hub</a>, (an excellent organisation that I often collaborate with) for a  <a title="Visit the webpage" href="http://www.london.electrician247.co.uk" target="_blank">London electrical contractor</a>. 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 &#8211; also with an electrical theme.</p>
<div id="attachment_155" class="wp-caption aligncenter" style="width: 310px"><a href="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-1.jpg"><img class="size-medium wp-image-155" title="le247-screenshot-1" src="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-1-300x181.jpg" alt="Screenshot of Website Homepage" width="300" height="181" /></a><p class="wp-caption-text">Screenshot of Website Homepage</p></div>
<p>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.</p>
<p>A simple contact form enables customers to get in touch&#8230;</p>
<div id="attachment_156" class="wp-caption aligncenter" style="width: 310px"><a href="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-2.jpg"><img class="size-medium wp-image-156" title="le247-screenshot-2" src="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-2-300x181.jpg" alt="Screenshot of contact form" width="300" height="181" /></a><p class="wp-caption-text">Screenshot of contact form</p></div>
<p>&#8230; and the addition of two &#8220;Lightboxes&#8221; means that every page carries a full list of the services provided, and all the locations they serve. These are &#8220;tucked away&#8221; in Lightboxes, so that although these details are in every page, they do not show unless the viewer clicks on the relevant buttons.</p>
<div id="attachment_157" class="wp-caption aligncenter" style="width: 310px"><a href="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-3.jpg"><img class="size-medium wp-image-157" title="le247-screenshot-3" src="http://www.neotalk.co.uk/demos/blog2/wp-content/uploads/2009/05/le247-screenshot-3-300x181.jpg" alt="Screenshot of &quot;lightbox&quot;" width="300" height="181" /></a><p class="wp-caption-text">Screenshot of a &quot;Lightbox&quot;</p></div>
<p>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.</p>
<p><strong>Summary:</strong></p>
<p><strong></strong></p>
<ul>
<li><span style="font-weight: normal;">Custom designed logo.</span></li>
<li><span style="font-weight: normal;">Custom designed &#8220;active&#8221; menu buttons.</span></li>
<li><span style="font-weight: normal;">Fixed page background which sizes to fit the screen.</span></li>
<li><span style="font-weight: normal;">Transparent header, navigation sidebar and content area.</span></li>
<li><span style="font-weight: normal;">Contact form.</span></li>
<li><span style="font-weight: normal;">Two &#8220;lightboxes&#8221; which grey out the main page when activated (except in IE &#8211; 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&#8217;s branches.</span></li>
<li><span style="font-weight: normal;">XHTML 1.0 Strict (fully standards compliant).</span></li>
<li><span style="font-weight: normal;">CSS 2.1 (fully standards compliant).</span></li>
<li><span style="font-weight: normal;">ASP.</span></li>
<li><span style="font-weight: normal;">Coded by hand from scratch.</span></li>
</ul>
<p><strong></strong></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jasonbarton.co.uk/2009/04/website-for-london-electrical-contractor/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
