<?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>White Heat Design</title>
	<atom:link href="http://www.whiteheatdesign.co.uk/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.whiteheatdesign.co.uk</link>
	<description>Web designers. Small agency, big heart.</description>
	<lastBuildDate>Thu, 12 Jan 2012 23:04:24 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Future-Proofing Websites and the Fear of Working in the Now</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/future-proofing-websites-and-the-fear-of-working-in-the-now/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/future-proofing-websites-and-the-fear-of-working-in-the-now/#comments</comments>
		<pubDate>Fri, 18 Nov 2011 09:00:03 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>
		<category><![CDATA[Behaviorism]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Opinion]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1184</guid>
		<description><![CDATA[Last week I designed another new website. It uses a lot of techniques considered to be modern best practice - a HTML5, responsive framework, CSS3 styling, media queries and a CSS3 animation just for some extra visual interest. It was fun and it was rewarding.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1216" title="Future-proofing websites" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/11/future-proofing_2.jpg" alt="Future-proofing websites" width="535" height="175" />Last week I <a href="http://www.whiteheatdesign.co.uk/play-corner/playing-with-html5-and-responsive-design/">designed another new website</a>. It uses a lot of techniques considered to be modern best practice &#8211; a HTML5, responsive framework, CSS3 styling, media queries and a CSS3 animation just for some extra visual interest. It was fun and it was rewarding.</p>
<p>While everything I read is telling me that this is great and absolutely the way to be designing websites &#8216;these days&#8217;, I can&#8217;t shake this feeling that it&#8217;s only a matter of time before it goes the same way as every other website: outdated and running off now-frowned-upon code.</p>
<h2>What&#8217;s the problem?</h2>
<p><img class="aligncenter size-full wp-image-1219" title="Fast paced industry" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/11/options.jpg" alt="Wires" width="535" height="205" />I&#8217;m not happy with the website, despite it checking lots of boxes. I&#8217;m already looking forward and thinking &#8216;right, what&#8217;s next?&#8217;. Replace all images with SVGs? Change all links to be CSS3 animated? Cut down the framework to be even simpler and more lightweight? It feels like a never-ending cycle of pressure to update and improve every website I build, as they come along. There is no end. And I&#8217;m ok with that &#8211; I understand that mine is an insanely fast-paced industry with a virtually insurmountable breadth of avenues to explore and master.</p>
<p>But it becomes a problem when you don&#8217;t know where to start with your next project. It becomes a problem when there is a degree of choice-paralysis. More so when you don&#8217;t know the <strong>correct</strong> answer. And given the speed of development in web design, the thought of falling behind is petrifying.</p>
<div class="pullquote">
<p>You cannot indefinitely design for the future in any one moment</p>
</div>
<p>I&#8217;m at the stage now where I feel like I need to just wait. To put off designing any more websites until the full spec of HTML5 has been scoped. Until there is a more efficient stylesheet reset. Until there is a standard level of browser support on every mobile device. Until a higher screen resolution is adopted across all smartphones. Until I know that what I&#8217;m creating now&#8230;.will last forever.</p>
<p>And I know this is wrong. Because it isn&#8217;t possible. You cannot indefinitely design for the future in any one moment. More than anything it&#8217;s a mental block. For me at least. I find moments where it almost completely inhibits my productivity.</p>
<h2>What&#8217;s the answer?</h2>
<p><img class="aligncenter size-full wp-image-1224" title="There is no answer..." src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/11/wire1.jpg" alt="Single wire" width="535" height="164" /></p>
<div class="pullquote">
<p>Fear of working in the now for what lies ahead is a silently dangerous and debilitating state of mind</p>
</div>
<p>The correct answer is&#8230;. that there is no answer. Nobody is right. Because nobody really knows what lies in wait. The more experienced, educated, conceptualists amongst us will have their ideas. And they might be closer to the mark than you or I. But they don&#8217;t <em>know</em>.</p>
<p>Fear of working in the now for what lies ahead is a silently dangerous and debilitating state of mind. There will always be the option to wait it out and see what happens before you employ a new technology, technique or whatever it may be. But you can&#8217;t do this forever. Sometimes you have to take what you know, the hours of research you&#8217;ve put in, the lines and lines of text telling you what so and so considers the best approach &#8211; take it and run with it.</p>
<h2>Work in the present &#8211; just do it the right way</h2>
<p>There is little point in continually worrying over changing technologies. You can&#8217;t control that. What you can do is use the tools available to you, the most reliable resources and the most considered approach to everything you do.</p>
<p>There is so much content out there about what is the &#8220;correct&#8221; way to design for the future web. You won&#8217;t be able to read it all, digest it all, compare it all and then make the most informed decision. It&#8217;s too easy to lose sight of what you are trying to achieve in amongst all the noise and differing opinions.</p>
<p>Design for what&#8217;s in front of you. And do it with confidence. Because if you&#8217;ve done your homework and you believe in what you do, you&#8217;ll make the right decision.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/future-proofing-websites-and-the-fear-of-working-in-the-now/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Playing With HTML5 and Responsive Design</title>
		<link>http://www.whiteheatdesign.co.uk/play-corner/playing-with-html5-and-responsive-design/</link>
		<comments>http://www.whiteheatdesign.co.uk/play-corner/playing-with-html5-and-responsive-design/#comments</comments>
		<pubDate>Tue, 15 Nov 2011 22:49:19 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[play corner]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Responsive]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1196</guid>
		<description><![CDATA[Responsive web design and HTML5 are all the rage at the moment. And rightly so. It's the future of web design. Both are still relatively young on the scene but that hasn't stopped a bunch of people adopting the methods straight away on production sites. ]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1206" title="Where's My Sofa responsive website" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/11/iphone_wms.jpg" alt="Where's My Sofa responsive website" width="535" height="175" />Responsive web design and HTML5 are all the rage at the moment. And rightly so. It&#8217;s the future of web design. Both are still relatively young on the scene but that hasn&#8217;t stopped a bunch of people adopting the methods straight away on production sites. Examples include <a href="http://www.palantir.net/">palantir.net</a>, <a href="http://foodsense.is/">foodsense.is</a> and <a href="http://2012.newadventuresconf.com/">2012.newadventuresconf.com</a> (if you want more examples, check out any site in <a href="http://mediaqueri.es/">this gallery</a>).</p>
<p>Just to clarify, the thing all of these sites have in common is that they are built in such a way that they adapt/respond to the device/screen they are viewed on. So if you look at them on a regular 21 inch computer screen (for example), they will display at full size. But if you then look at them on an iPhone or other mobile device, the site will change its shape to fit the content in in a much more legible and practical fashion.</p>
<div id="attachment_1201" class="wp-caption aligncenter" style="width: 545px"><a href="http://www.wheresmysofa.co.uk/" title="Responsive website layout"><img class="size-full wp-image-1201" title="Responsive website layout" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/11/wms_responsive_2.jpg" alt="Responsive website layout" width="535" height="416" /></a><p class="wp-caption-text">The website changes shape according to the device it&#39;s viewed on</p></div>
<p>So, fueled by the seemingly <a href="http://twitter.com/wheresmyfofa">endless saga</a> of trying to get some furniture delivered to my new flat, and sensing it was time I dived into this new world of design, I put together the<a href="http://www.wheresmysofa.co.uk/"> wheresmysofa.co.uk</a> website. Try it out. If you&#8217;re reading this on a desktop computer try resizing the browser and  watch how the website resizes itself and moves the content around. Smart huh? If you can, try viewing it on a smartphone or other mobile device. You should see a longer, single-column, scaled down version of the site.</p>
<p>Designing sites this way will add a significant amount development time for each project. But when you look at the results, it&#8217;ll be totally worth it. Anyway, this is my first go. Designing for all devices and screen sizes is yet another challenge web designers and developers have to overcome. But unlike fixing IE6 bugs, this one is actually very rewarding.</p>
<p><strong>Update:</strong> The site has been featured on the <a href="http://mediaqueri.es/wms/">Media Queries website</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/play-corner/playing-with-html5-and-responsive-design/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>We Are Growing &#8211; Welcome MailStrike Email Marketing</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/we-are-growing-welcome-mailstrike-email-marketing/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/we-are-growing-welcome-mailstrike-email-marketing/#comments</comments>
		<pubDate>Thu, 06 Oct 2011 15:18:34 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1155</guid>
		<description><![CDATA[We have just launched a new arm to our business. MailStrike is a one-stop email marketing application that allows you to send custom-designed HTML emails to your subscriber and customer lists.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1164" title="Mailstrike - Email marketing, done right" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/10/mailstrike_post.jpg" alt="Mailstrike - Email marketing, done right" width="535" height="175" />We have just launched a new arm to our business. <a href="http://www.mailstrike.co.uk/">MailStrike</a> is a one-stop email marketing application that allows you to send custom-designed HTML emails to your subscriber and customer lists.</p>
<p>We work very closely with our clients and by far the most popular request we get post-website-launch is help sending notification emails or regular newsletters to existing clients/customers/subscribers or recipients. This normally means looking to external software or applications, sometimes resulting in incompatibility issues or crazy high pricing.</p>
<p>We decided to bridge the gap.</p>
<p>MailStrike can run seamlessly and simultaneously with any website we build. Everything goes through us so you can guarantee it&#8217;ll not just work, but also perfectly reflect your brand and look super pretty :)</p>
<p>I won&#8217;t go into the nitty gritty of what MailStrike can do in this post (please check out the <a href="http://www.mailstrike.co.uk/features/">dedicated site</a> for a full list of features) but here are a few of the highlights:</p>
<ul>
<li>WYSIWYG (what you see is what you get) email editor</li>
<li>Drag and drop content builder</li>
<li>No ugly logos or links &#8211; it&#8217;s all you</li>
<li>Crazy-powerful reporting (down to who opened your emails and what they clicked on)</li>
<li>All sorts of email personalisation</li>
<li>Export and import email lists (unlimited)</li>
<li>No send limits</li>
<li>Pay as you go or pay monthly (email us to arrange a custom pay monthly plan)</li>
<li>and plenty more&#8230;</li>
</ul>
<div id="attachment_1166" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1166" title="Simple WYSIWYG email editor" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/10/mailstrike_editor.jpg" alt="Simple WYSIWYG email editor" width="535" height="420" /><p class="wp-caption-text">Simple WYSIWYG email editor</p></div>
<div id="attachment_1168" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1168" title="Powerful, intelligent reporting" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/10/mailstrike_reporting.jpg" alt="Powerful, intelligent reporting" width="535" height="400" /><p class="wp-caption-text">Powerful, intelligent reporting</p></div>
<div id="attachment_1167" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1167" title="See who opened and clicked your emails and from where" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/10/mailstrike_geo.jpg" alt="See who opened and clicked your emails and from where" width="535" height="420" /><p class="wp-caption-text">See who opened and clicked your emails and from where</p></div>
<p>If you&#8217;d like to find out more about MailStrike, you can visit <a href="http://www.mailstrike.co.uk/">the website.</a> Alternatively, email us directly and we&#8217;ll answer any questions you might have.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/we-are-growing-welcome-mailstrike-email-marketing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>New CMS Website &#8211; MailStrike Email Marketing</title>
		<link>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-cms-website-mailstrike-email-marketing/</link>
		<comments>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-cms-website-mailstrike-email-marketing/#comments</comments>
		<pubDate>Thu, 06 Oct 2011 14:36:20 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/portfolio/web-design/new-cms-website-mailstrike-email-marketing/</guid>
		<description><![CDATA[Email marketing is still one of the biggest and most valuable marketing tools used by nearly every successful business out there. We have always helped our clients with their email marketing needs, but we decided it was time to take things a step further.]]></description>
			<content:encoded><![CDATA[<p><script type="text/javascript">
            function startGallery_17() { 
              var myGallery = new gallery($("myGallery_17"), {                  timed: true,         showCarousel: true,         showInfopane: true,           showArrows: true,           embedLinks: false, slideInfoZoneOpacity: 0.80, delay: 8000, defaultTransition: "fade", textShowCarousel: "More screenshots"   });
              
              document.getElementById("myGallery_17").style.display = "block";
           }
            window.addEvent("domready", startGallery_17);
          </script>
         <div style="width: 550px; height: 400px; border:0px solid; margin:0px auto; clear:both;"><div id="myGallery_17" class="myGallery" style="display:none; width: 550px !important; height: 400px !important;"><div class="imageElement">  <h3> Homepage</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_homepage.jpg" rel="shadowbox[sbpost-1161];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_homepage.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/thumbs/thumbs_mailstrike_homepage.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Pricing page</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/maistrike_pricing.jpg" rel="shadowbox[sbpost-1161];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/maistrike_pricing.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/thumbs/thumbs_maistrike_pricing.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Contact page</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_contact.jpg" rel="shadowbox[sbpost-1161];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_contact.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/thumbs/thumbs_mailstrike_contact.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Resources page</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_resources.jpg" rel="shadowbox[sbpost-1161];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_resources.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/thumbs/thumbs_mailstrike_resources.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> A gated Resource article</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_gated.jpg" rel="shadowbox[sbpost-1161];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/mailstrike_gated.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/mailstrike/thumbs/thumbs_mailstrike_gated.jpg" class="thumbnail" /></div> </div></div></p>
<div id="siteinfo"><strong>Date launched</strong>: September 2011<br />
<strong>Website type</strong>: CMS Package<br />
<a title="MailStrike Email Marketing" href="http://www.mailstrike.co.uk/"><img class="alignnone" title="Vist the website" src="http://www.whiteheatdesign.co.uk/wp-content/themes/whd/images/view-site.jpg" alt="Vist the website" /></a></div>
<p>Email marketing is still one of the biggest and most valuable marketing tools used by nearly every successful business out there. We have always helped our clients with their email marketing needs, but we decided it was time to take things a step further.</p>
<p>We have therefore built a promotional website for the <a href="http://www.mailstrike.co.uk">MailStrike</a> application. The focus of this site is very much on showing users the features available through the system. It uses lots of imagery of the admin area that users will be directly accessing, coupled with some of the HTML email designs that we have produced to be used in conjunction with it.</p>
<p>In terms of functionality, the site is pretty simple. It has a <a href="http://www.mailstrike.co.uk/features/">features</a> area that allows users to flick through the advantages of using the application and also has sign up forms they can use after they&#8217;ve chosen a price plan.</p>
<p>There is also a separate gated (membership required) <a href="http://www.mailstrike.co.uk/resources/">Resources</a> section that is only available to MailStrike clients. This section contains tips an tricks, graphics, templates and anything else that might be beneficial to people interested in email marketing. The site allows all users to see the intro to the each article, but to see more you&#8217;d need to sign up for an account ;)</p>
<p>Being a personal project, we could do anything we wanted in terms of design, so we chose a vibrant orange and a nice contrasting dark grey for the colour scheme. Textured backgrounds are used all over the site just to make it feel a bit more tangible, and we&#8217;ve gone for a stitching effect in some areas just for that little bit of extra detail.</p>
<p>If you would like more info what&#8217;s on offer through MailStrike, you can visit the <a href="http://www.mailstrike.co.uk">website</a> itself, or <a href="mailto:info@mailstrike.co.uk">email us</a> with any questions you may have.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-cms-website-mailstrike-email-marketing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cropping Images For Aesthetics</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/cropping-images-for-aesthetics/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/cropping-images-for-aesthetics/#comments</comments>
		<pubDate>Fri, 12 Aug 2011 12:03:52 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>
		<category><![CDATA[Aesthetics]]></category>
		<category><![CDATA[Graphic design]]></category>
		<category><![CDATA[Images]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1070</guid>
		<description><![CDATA[Believe it or not, there's an art to cropping larger images properly and in a way that doesn't make the image look...well...rubbish. In this post I'm going to talk about the aesthetics of well composed images and the importance of cropping to the strengths of the image.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1140" title="Sunset" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/sunset.jpg" alt="Sunset" width="535" height="175" />Believe it or not, there&#8217;s an art to cropping larger images properly and in a way that doesn&#8217;t make the image look&#8230;well&#8230;rubbish. In this post I&#8217;m going to talk about the aesthetics of well composed images and the importance of cropping to the strengths of the image.</p>
<p>If you&#8217;ve ever looked at a website and thought it looks beautiful, but you couldn&#8217;t quite work out why, it might be worth looking at how it uses images. Something I&#8217;ve noticed is that a lot of designers tend to slice off a chunk of their images so they look incomplete. But not just any old chunk.</p>
<p>While much of the time the shape and space available to you in a webpage will dictate what size your image should be, it doesn&#8217;t necessarily dictate the content or composition. Let&#8217;s look at some examples.</p>
<div id="attachment_1108" class="wp-caption aligncenter" style="width: 545px"><a href="http://www.gingermonkeydesign.com/portfolio" title="gingermonkeydesign.com portfolio"><img class="size-full wp-image-1108" title="gingermonkeydesign.com portfolio" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/gingermonkey.jpg" alt="gingermonkeydesign.com portfolio" width="535" height="307" /></a><p class="wp-caption-text">gingermonkeydesign.com portfolio</p></div>
<p>The <a href="http://gingermonkeydesign.com/portfolio">Ginger Monkey Design</a> portfolio uses cropped thumbnails for every item of work. Such is the level of detail in each piece, it only needs to show a small area to entice users to click through.</p>
<div id="attachment_1109" class="wp-caption aligncenter" style="width: 545px"><a href="http://31three.com/" title="Jesse Bennett-Chamberlain"><img class="size-full wp-image-1109" title="Jesse Bennett-Chamberlain" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/31three.jpg" alt="Jesse Bennett-Chamberlain" width="535" height="236" /></a><p class="wp-caption-text">Jesse Bennett-Chamberlain&#39;s homepage</p></div>
<p><a href="http://31three.com/">Jesse Bennet Chamberlain</a>&#8216;s homepage displays some of his recent work using a porthole type effect. Combined with a slight inner shadow it really gives an illusion of depth and layering. This is an example of circular cropping. Not as common as regular square or rectangular cropping, but it&#8217;s a very nice effect all the same.</p>
<h2>What makes a well composed image attractive?</h2>
<p>If you can find the focal point(s) of an image, you can crop it to a dimension that will really impact on the viewer. It can be quite difficult to get the proportions right to begin with, but with practice you&#8217;ll begin to pick out these focal points and see exactly what shape and size the image should be before you start work on it.</p>
<p>When cropping your images you want to capture the most interesting part of the image and zoom in on it. But make sure your focal point isn&#8217;t directly in the centre, unless the image you&#8217;re using is very symmetrical. Also, don&#8217;t be afraid to cut off an area of the image that doesn&#8217;t add anything. Having an image slightly to one side and cut off hints at more outside the picture tempting the viewer to click through or continue browsing your site. It can really add interest to otherwise boring images.</p>
<div id="attachment_1126" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1126" title="Ginger cat (before)" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/cat_before.jpg" alt="Ginger cat (before)" width="535" height="400" /><p class="wp-caption-text">Before</p></div>
<p>This is a photo of a little ginger guy I snapped on my iPhone while he was snoozing in the shade in a hotel in Cyprus. He&#8217;s cute, but he image itself is not particularly inspiring and it&#8217;s a little bit boring.</p>
<div id="attachment_1127" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1127" title="Ginger cat (after)" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/cat_after.jpg" alt="Ginger cat (after)" width="535" height="357" /><p class="wp-caption-text">After</p></div>
<p>Taking his face and that upturned paw as the focal points, I&#8217;ve zoomed in on the image and moved his head (the primary focal point) off centre and to one side. You can see more detail in his face and although we&#8217;ve chopped off a large section of his slumped body, you still get a sense of all that laziness. This is miles better.</p>
<div id="attachment_1110" class="wp-caption aligncenter" style="width: 545px"><a href="http://banneton.com.au/" title="Banneton wood fired breads"><img class="size-full wp-image-1110" title="Banneton wood fired breads" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/banneton1.jpg" alt="Banneton wood fired breads" width="535" height="271" /></a><p class="wp-caption-text">Banneton wood fired breads</p></div>
<p>The <a href="http://banneton.com.au/">Banneton</a> website uses close-up shots of the bread they make. Rather than showing whole loaves, they simply zoom in. From a user perspective, it shows the company has a genuine confidence in what they offer and it is therefore presented front and centre. If you look closely, every one of the slider images on the homepage is cropped and focused. None of them include a complete loaf of bread, cup or bowl.</p>
<div id="attachment_1107" class="wp-caption aligncenter" style="width: 545px"><a href="http://www.apple.com/uk/mac/" title="Apple website uses plenty of cropped images"><img class="size-full wp-image-1107" title="Apple website uses plenty of cropped images" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/apple_mac.jpg" alt="Apple website uses plenty of cropped images" width="535" height="819" /></a><p class="wp-caption-text">Apple website uses plenty of cropped and incomplete images</p></div>
<p><a href="http://www.apple.com/uk/mac/">Apple</a> are known for producing beautiful, aesthetically pleasing products. But their presentation through the Apple website is also consistently appealing. They use plenty of zoomed in and close-up shots to give viewers a real sense of quality and luxury. Take a minute to click through the site and look at how many places incomplete images are used or cropping is used to focus the eye on a particular detail of a product.</p>
<p>What you might also notice is that images are rarely cropped at a 50-50 scale. As in, they are rarely cut directly in half or only show exactly half of the product/subject. The idea of the <a href="http://en.wikipedia.org/wiki/Rule_of_thirds">rule of thirds</a> is regularly applied &#8211; something I intend to write a separate post on, as it is beyond the scope of this one.</p>
<h2>Using &#8216;incomplete&#8217; images to break the grid</h2>
<p><a href="http://sixrevisions.com/web_design/a-brief-look-at-grid-based-layouts-in-web-design/">Grid-based layouts</a> are very popular across the web design industry. They provide a starting point at the beginning of a project and a reference point throughout. While many consider it to be a standard practice, not everyone wants their website to look &#8216;rigid&#8217; or &#8216;boring&#8217; as <strong>can</strong> happen if careful thought is not applied. One way designers get round this potential boxy appearance is by using large images that sprawl across the background of the page, seemingly transcending the grid. Normally they are quite subtle so as not to distract from the main content, but they are also sometimes used for impact.</p>
<div id="attachment_1135" class="wp-caption aligncenter" style="width: 545px"><a href="http://loveforjapan.com/" title="Love For Japan website"><img class="size-full wp-image-1135" title="Love For Japan website" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/love_for_japan.gif" alt="Love For Japan website" width="535" height="250" /></a><p class="wp-caption-text">The beautiful Love For Japan website has trees in the background that point inwards to help focus the eye on the main content. It still uses a 960 grid.</p></div>
<p>Another method that I&#8217;ve seen used is to rotate an image so it&#8217;s at an angle. This helps to break the grid visually without actually affecting the layout. A sort of ordered chaos.</p>
<div id="attachment_1119" class="wp-caption aligncenter" style="width: 545px"><a href="http://www.promisemechocolate.com/" title="Promise Me Chocolate website"><img class="size-full wp-image-1119" title="Promise Me Chocolate website" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/08/promise_me_chocolate.jpg" alt="Promise Me Chocolate website uses angled, nicely cropped images" width="535" height="278" /></a><p class="wp-caption-text">The Promise Me Chocolate website uses angled, nicely cropped images. The focal point of the image (the faces) are also off-center, obeying the rule of thirds</p></div>
<h2>Wrapping up</h2>
<p>The point of this post is not to argue that every image should be chopped up and presented in the same way. It&#8217;s more to point out that you don&#8217;t have to use an image in its entirety. If it&#8217;s too long or too wide for a particular space on your site, don&#8217;t be afraid to open it up in an image editor and play around with cropping it to different dimensions. You might be surprised at what you can find. Sometimes the perfect detail or the perfect focal point is sitting right in front of you. You just need to find it.</p>
<p>Keep an eye out while you browse the web today. I guarantee you&#8217;ll see examples of this everywhere.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/cropping-images-for-aesthetics/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Rachel Bull, Editor, Live Urban Love Rural</title>
		<link>http://www.whiteheatdesign.co.uk/testimonials/rachel-bull-live-urban-love-rural/</link>
		<comments>http://www.whiteheatdesign.co.uk/testimonials/rachel-bull-live-urban-love-rural/#comments</comments>
		<pubDate>Tue, 02 Aug 2011 14:07:43 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[testimonials]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/testimonials/rachel-bull-live-urban-love-rural/</guid>
		<description><![CDATA[&#8220;Xavier put his heart into my project. More often that not I refer to it as &#8216;our&#8217; project, as the whole process, from concept to design to launch was and will remain a partnership. It was important to me that whoever designed my website had to understand the core idea and the meaning behind what [...]]]></description>
			<content:encoded><![CDATA[<p><em>&#8220;Xavier put his heart into my project. More often that not I refer to it as &#8216;our&#8217; project, as the whole process, from concept to design to launch was and will remain a partnership. It was important to me that whoever designed my website had to understand the core idea and the meaning behind what I wanted to do. Xavier understood this instantly; he brought my ideas to life and was instrumental in creating the LULR brand. Throughout the design process, Xavier listened to everything I wanted, and showed utmost professionalism when suggesting that some ideas might not work as well as I had thought!</em></p>
<p><em>Xavier&#8217;s knowledge, dedication and enthusiasm when it comes to web design combined with his creativity is a rare commodity. But what has impressed me possibly even more is his support during and ever since the launch of the site. For me, building a social media presence is very important, and Xavier is always there to answer my questions or give me useful Twitter tips. The response I&#8217;ve had to the site so far has been amazing. Everyone comments on the clean, fresh, beautiful design, and all agree that the site is very easy to navigate. And the main thing is, I love it!</em></p>
<p><em>I couldn&#8217;t have done it without him &#8211; it&#8217;s as simple as that.&#8221;</em></p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/testimonials/rachel-bull-live-urban-love-rural/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>New Online Magazine &#8211; Live Urban Love Rural</title>
		<link>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-online-magazine-live-urban-love-rural/</link>
		<comments>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-online-magazine-live-urban-love-rural/#comments</comments>
		<pubDate>Mon, 25 Jul 2011 00:58:15 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/portfolio/web-design/new-online-magazine-live-urban-love-rural/</guid>
		<description><![CDATA[Live Urban Love Rural is the new online magazine designed for people who live in London, but are after that little something extra that only rural life can offer.]]></description>
			<content:encoded><![CDATA[<p><script type="text/javascript">
            function startGallery_16() { 
              var myGallery = new gallery($("myGallery_16"), {                  timed: true,         showCarousel: true,         showInfopane: true,           showArrows: true,           embedLinks: false, slideInfoZoneOpacity: 0.80, delay: 8000, defaultTransition: "fade", textShowCarousel: "More screenshots"   });
              
              document.getElementById("myGallery_16").style.display = "block";
           }
            window.addEvent("domready", startGallery_16);
          </script>
         <div style="width: 550px; height: 400px; border:0px solid; margin:0px auto; clear:both;"><div id="myGallery_16" class="myGallery" style="display:none; width: 550px !important; height: 400px !important;"><div class="imageElement">  <h3> Homepage</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/homepage.jpg" rel="shadowbox[sbpost-1079];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/homepage.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/thumbs/thumbs_homepage.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Single article</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/article.jpg" rel="shadowbox[sbpost-1079];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/article.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/thumbs/thumbs_article.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Events page</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/events.jpg" rel="shadowbox[sbpost-1079];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/events.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/thumbs/thumbs_events.jpg" class="thumbnail" /></div><div class="imageElement">  <h3> Single event</h3>  <p style="color: #FFF000;"> </p>  <a target="_blank" href="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/event.jpg" rel="shadowbox[sbpost-1079];player=img;" title="open image" class="open"></a>  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/event.jpg" class="full" />  <img src="http://www.whiteheatdesign.co.uk/wp-content/gallery/lulr/thumbs/thumbs_event.jpg" class="thumbnail" /></div> </div></div></p>
<div id="siteinfo"><strong>Date launched</strong>: July 2011<br />
<strong>Website type</strong>: CMS Package<br />
<a title="Live Urban Love Rural" href="http://www.liveurbanloverural.com"><img class="alignnone" title="Vist the website" src="http://www.whiteheatdesign.co.uk/wp-content/themes/whd/images/view-site.jpg" alt="Vist the website" /></a></div>
<p><a title="Live Urban Love Rural" href="http://www.liveurbanloverural.com">Live Urban Love Rural</a> is the new online magazine designed for people who live in London, but are after that little something extra that only rural life can offer.</p>
<p>Rachel came to us with the idea in April 2011 and we were taken by the idea instantly. With so many websites dedicated to events in and around London, we loved the idea that this one would aim to tackle quite a niche market. Rachel is extremely knowledgeable and experienced in all things arts, craft and country. We were impressed with her passion for the project and therefore knew we had to take it on.</p>
<p>The Live Urban Love Rural website consists of 5 different channels: <a href="http://www.liveurbanloverural.com/how-to/">How-to</a> &#8211; a section dedicated to growing, making and creating your own rural life in the country, <a href="http://www.liveurbanloverural.com/creative/">Creative Hub</a> &#8211; a guide to creative projects and arts and crafts events in the city, <a href="http://www.liveurbanloverural.com/interviews/">LULR Interview</a> &#8211; interviews with inspirational city folk, <a href="http://www.liveurbanloverural.com/in-focus/">In-Focus</a> &#8211; an in depth look at &#8216;rurban&#8217; trends in London and, finally, an <a href="http://www.liveurbanloverural.com/events/">Events</a> section that lists upcoming rural and community events in London.</p>
<p>As the website&#8217;s popularity would initially be measured almost solely on the amount of traffic it receives, we were keen to work with Rachel on the social media aspects of it. Naturally, a <a href="http://www.twitter.com/L_U_L_R">Twitter</a> account and <a href="http://www.facebook.com/pages/Live-Urban-Love-Rural/241312479213896">Facebook page</a> were set up, as well as a <a href="http://feeds.feedburner.com/LiveUrbanLoveRural">Feedburner</a> account, offering readers plenty of different ways to subscribe and keep up with her regular content.</p>
<p>We decided to build in a featured article section to the top of the homepage so that articles could be given extra prominence if Rachel and her writers wanted to highlight something in particular. There is also a tabbed section on each page that offers the most popular articles to date, the most recent comments and a tag list so it&#8217;s easy for readers to drill down to the content they most want to read.</p>
<p>The Events section consists of a calendar that is browsable by month or year and can also be switched to <a href="http://www.liveurbanloverural.com/events/upcoming">list view</a> if you prefer to view the events that way. Each event contains more details when you click through to it, revealing a dynamic Google map, telephone number, venue, entrance fee and pretty much any other details needed for an event.</p>
<p>With this website we wanted to go for a slightly more quirky and charming feel, without over-cluttering it or making it too twee. It needed to be obvious what it was about, but readability and legibility were pretty much key. To achieve this we decided to go for a light canvas background and added a few stitching elements to different areas of the site just to give the idea of arts and crafts, without going overboard. As LULR is predominantly aimed at women between the ages of 22 &#8211; 35, we used 3 different shades of pink accent throughout the site and incorporated a pink butterfly in the footer to enforce the rural element also portrayed in the logo.</p>
<p>We&#8217;ve always wanted to design a magazine website and we finally got to do so with LULR and Rachel, who has been really fun and a real pleasure to work with.</p>
<p>We wish Rachel and her writers all the best in continuing to grow their readership.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/portfolio/web-design/new-online-magazine-live-urban-love-rural/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>New Laptop, New Process</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/new-laptop-new-process/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/new-laptop-new-process/#comments</comments>
		<pubDate>Fri, 13 May 2011 12:11:18 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>
		<category><![CDATA[Opinion]]></category>
		<category><![CDATA[Productivity]]></category>
		<category><![CDATA[Reviews]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1048</guid>
		<description><![CDATA[I just bought a new laptop. Partly because my old one had slowed down essentially to a halt, but also because I needed to shake up the way I work away from my desk. It's a MacBook Air. It's my first MacBook and after one week of use, I'm fairly sure it won't be my last.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1058" title="MacBook Air" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/05/lead.jpg" alt="MacBook Air" width="535" height="175" />I just bought a new laptop. Partly because my old one had slowed down essentially to a halt, but also because I needed to shake up the way I work away from my desk. It&#8217;s a <a href="http://www.apple.com/macbookair/">MacBook Air</a>. It&#8217;s my first MacBook and after one week of use, I&#8217;m fairly sure it won&#8217;t be my last. I&#8217;ve been in the market for a small, quick laptop with a respectable amount of power for a LONG time. Now I have it and now I&#8217;m looking to change the way I work.</p>
<p>As it&#8217;s my first Mac, I need to learn a new <abbr title="Operating System">OS</abbr>, but that can only be a good thing. Previously, testing websites on anything other than Windows platforms wasn&#8217;t an option for me. While the differences have been fairly minimal up until now, they were differences all the same, and it&#8217;s good to at least be aware of them. Having an OS X machine to hand makes that possible.</p>
<h2>So, what new process(es)?</h2>
<p>Well, with my old Dell laptop, despite its supposed power, I really struggled to get work done on it. I treated it like a proper computer and added many of the applications and software I would on my main PC. It couldn&#8217;t handle that and became slow and unresponsive. It overheated and would shut itself down on occasions (it did this from the very start) and approximately 1 in 10 times that I started it up, it wouldn&#8217;t make it to the login screen, which meant it needed a forced shutdown and would then do a full blown crash recovery and restore, losing lots of my settings. Pain in the arse.</p>
<p><img class="aligncenter size-full wp-image-1059" title="MacBook" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/05/macbook_3.jpg" alt="MacBook" width="535" height="401" /></p>
<p>The MacBook Air is unbelievably quick. We&#8217;re talking around a 10 second startup and a 3 second shutdown. It makes you want to pull it out whenever you get a spare few minutes to work. This time I&#8217;ve loaded only the apps and software I <em>really</em> need. I want to keep it lightweight and flexible.</p>
<div id="attachment_1060" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1060" title="A4 Paper pad size" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/05/paper_pad.jpg" alt="A4 Paper pad size" width="535" height="421" /><p class="wp-caption-text">Slightly smaller than a pad of A4 paper</p></div>
<p>It simply <strong>isn&#8217;t</strong> possible to replicate my home setup on a laptop. So why strive for that? It&#8217;s a mobile device. As long as it can do the bare bones of my work in as simple, quick and effective way as possible, it&#8217;s fulfilling its purpose.</p>
<p>So this is my setup so far (I can&#8217;t promise it won&#8217;t change/grow though):</p>
<ul>
<li><strong><a href="http://www.adobe.com/products/photoshop.html">Photoshop</a></strong> &#8211; for image work. It&#8217;s a necessity. I looked at <a href="http://www.pixelmator.com/">Pixelmator</a> briefly, but it&#8217;s missing some critical features and I&#8217;ve always used Photoshop. No reason to change if the laptop can handle it.</li>
<li><strong><a href="http://www.panic.com/coda/">Coda</a></strong> &#8211; for web dev work. I&#8217;m still considering swapping for Dreamweaver, but I feel I should take the opportunity to get to know more software. I&#8217;ve yet to really get into it but it looks nice and simple to use.</li>
<li><strong><a href="https://www.dropbox.com/">Dropbox</a></strong> &#8211; helps with the portability ideal, allowing me to sync files across my laptop and main working computer. The plan is to move everything to <a href="http://www.whiteheatdesign.co.uk/thoughts/the-cloud-what-it-is-and-why-you-should-consider-switching-to-it/">the cloud</a> over time, allowing me complete freedom in where and when I choose to work.</li>
<li><strong><a href="http://www.mozilla.com/en-US/firefox/new/">Firefox</a></strong> &#8211; I hear and read lots of talk of designers and developers switching to Chrome for <a href="http://www.whiteheatdesign.co.uk/thoughts/the-power-of-the-browser-choose-your-weapon-part-1-of-3">various reasons</a>. I can&#8217;t do it. <a href="http://www.whiteheatdesign.co.uk/thoughts/the-power-of-the-browser-make-it-yours-part-2-of-3/">Firefox is too flexible</a>. It&#8217;s <a href="http://www.whiteheatdesign.co.uk/thoughts/the-power-of-the-browser-my-browser-breakdown-part-3-of-3/">too customiseable</a>. And we&#8217;ve been going together for years.</li>
</ul>
<p>So while the majority of the software I&#8217;ve installed is the same as I used on my old laptop, the MacBook just makes it <em>feel</em> easier to use. It&#8217;s way more responsive and it has completely removed all frustrations I had previously with working away from my main desktop. Mobility and economy are absolutely key to getting work done when you&#8217;re out and about and the MacBook Air has it all tied down.</p>
<div id="attachment_1057" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1057" title="Sleek" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/05/hinge.jpg" alt="Sleek hinge design" width="535" height="363" /><p class="wp-caption-text">Incredibly thin</p></div>
<p>The positives of switching to this machine continue to mount up. Here are some off the top of my head:</p>
<h3>Positives</h3>
<ul>
<li>It forces me to learn another <abbr title="Operating System">OS</abbr>. This is good for the CV but it&#8217;s also useful in general to have a wider knowledge of what&#8217;s available to you</li>
<li>It allows me the ultimate setup for cross-browser and cross-<abbr title="Operating System">OS</abbr> testing on websites. Windows on one maching, OS X on the other</li>
<li>It opens up a world of new apps that are only available to <a href="http://www.apple.com/macosx/">OS X</a> users</li>
<li>It&#8217;s <strong>incredibly</strong> quick. Startups and shutdowns are almost enjoyable now!</li>
<li>It&#8217;s incredibly beautiful. It&#8217;s just nice to look at</li>
<li>Despite the ageing Intel Core 2 Duo processor, it handles multiple applications with ease &#8211; no lag and no freezing so far</li>
<li>It&#8217;s super light and super slim</li>
<li>The battery life is very good (around 5 hours) and easy to manage using the preferences system</li>
<li>The trackpad is excellent. The multi-touch feature forces it to be a relevant point here. Scrolling has never been so easy or natural.</li>
</ul>
<h3>Negatives</h3>
<ul>
<li>It&#8217;s bloody expensive.</li>
</ul>
<h2>Conclusion</h2>
<p>Overall, so far, it&#8217;s been refreshing and rewarding to use not just a new, quicker laptop, but to also experience OS X for the first time. It&#8217;ll take some getting used to and learning the shortcuts will definitely require some serious <a href="http://en.wikipedia.org/wiki/Priming_%28psychology%29">cognitive priming</a> &#8211; there are four fairly similar (from what I can gather) operator buttons in a line in the bottom left corner of the keyboard, all used in conjunction with the rest of the keys to perform innumerate tasks.</p>
<div id="attachment_1061" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-1061" title="Bit thicker than a pencil" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/05/size_2.jpg" alt="Bit thicker than a pencil" width="535" height="324" /><p class="wp-caption-text">Bit thicker than a pencil</p></div>
<p>But this thing is genuinely satisfying to use. Which <em>does</em> matter. If I didn&#8217;t already enjoy my work, this little Air should breathe new life into it.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/new-laptop-new-process/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The Cloud &#8211; What it is and Why You Should Consider Switching to it</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/the-cloud-what-it-is-and-why-you-should-consider-switching-to-it/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/the-cloud-what-it-is-and-why-you-should-consider-switching-to-it/#comments</comments>
		<pubDate>Wed, 06 Apr 2011 10:13:15 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>
		<category><![CDATA[Cloud]]></category>
		<category><![CDATA[Freelance]]></category>
		<category><![CDATA[Productivity]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=1013</guid>
		<description><![CDATA[The cloud - what is it? How do you get it? Why do we even need it? All good questions. All of which I'll attempt to answer in this post. Hopefully more.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1035" title="Moving to the cloud" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/04/cloud_lead.jpg" alt="Clouds with app logos" width="535" height="175" />The cloud &#8211; what is it? How do you get it? Why do we even need it? All good questions. All of which I&#8217;ll attempt to answer in this post. Hopefully more.</p>
<p>When I mention to people in passing that I&#8217;m trying to manage a lot more of my business &#8216;in the cloud&#8217;, most people offer up a rather blank expression. Followed by one that says &#8220;I know I don&#8217;t need to know about this, but I&#8217;m guessing I&#8217;m about to hear about it anyway&#8221;.</p>
<p>The first and most obvious question that comes to people&#8217;s mind is &#8216;What is the cloud?&#8221;. So&#8230;</p>
<h2>What is the cloud?</h2>
<p><img class="aligncenter size-full wp-image-1038" title="Access the cloud from many devices" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/04/cloud-formation.jpg" alt="Cloud servers with access from many devices" width="535" height="500" />There are lots of explanations on the web that you could look up for a definition or to get a historical breakdown of how cloud computing came about. Forget that. You&#8217;ll get bogged down. Simply put, the cloud is space on the internet to put your stuff. Anywhere that you upload files normally stored on your home (or any single) computer/device to somewhere on the internet, that you could later access using another entirely different computer/device over the internet&#8230;.is cloud computing. You already use it with Facebook and Youtube. The complexity with which you access and manipulate your stuff is the only thing that makes it any more complicated.</p>
<p>Just think of it as a big space up there in the ether where you can put things you want to be able to access from anywhere in the world using just a <a href="http://www.whiteheatdesign.co.uk/tag/browsers/">browser</a>.</p>
<h2>Why do we need it?</h2>
<p>I can&#8217;t vouch for everyone because everyone has different and varying needs when it comes to managing their files and documents. But there are a number of circumstances when having access to cloud storage would be extremely helpful.</p>
<h3>Mobility</h3>
<p>The primary reason for using it is mobility. If all of your files are centralised up there in the cloud, as long as you can get to a computer/mobile device with a browser and internet access, your physical location is irrelevant. Which means no need for remembering to transfer everything to a USB stick, no more emailing yourself files from home so you can pick them up in your email at work, no more &#8220;Ah crap, it&#8217;s on my home computer&#8221; moments. It makes you prepared and it makes you flexible.</p>
<h3>Security</h3>
<p>Storing files with reputable cloud storage services is arguably more secure than keeping them on your home computer or USB stick. You can delete files from your computer and they are gone forever. You can lose a USB stick and they are gone forever. Because cloud storage services are handling other people&#8217;s (sometimes extremely important/sensitive) data, they are very hot on security and use high end data encryption making it almost impossible for other people to find and get access to your files. Now ask yourself what could happen if someone sat down at your computer and guessed your girlfriend&#8217;s/boyfriend&#8217;s/pet&#8217;s name to log in. Ask yourself what could happen if you lost your USB stick or it broke. Scary isn&#8217;t it.</p>
<p>Nearly all cloud storage services allow you to recover deleted or modified versions of your files. So even if you accidentally deleted one, you can get it back.</p>
<p>Using the same practice as above, you can also keep track of changes made to your documents and roll them back if you were happier with previous versions. While this is not considered full-on, business-level version control, it certainly gives you enough to manage your files safely and securely. More so than your home computer at least.</p>
<h3>Synchronicity</h3>
<p>One of the coolest features of services like <a href="http://www.dropbox.com/">Dropbox</a> and <a href="http://www.box.net/">Box.net</a> is the sync feature. What this means is that, with Dropbox as an example, if you open up a file you have stored on their server and edit it, once you save and close the file it gets synced across all computers and devices where you have Dropbox installed. So the next time you open up the file from another location, it will be the most up to date version with all your latest changes. All you need to do is save and close &#8211; like you would do anyway :D</p>
<h3>Service/product improvement</h3>
<p>One of the limitations with using software stored on your computer (like Microsoft Office for example) is that you&#8217;re tied into it. Those products won&#8217;t improve until a big update is pushed. Quite often people run into problems when running those updates as their computer or <abbr title="Operating System">OS</abbr> has changed in ways that can affect the upgrade process.</p>
<p>If you use a cloud-based service like <a href="https://docs.google.com">Google Docs</a> (a direct alternative to MS Office), updates are rolled out quicker, more frequently and usually with little or no interruption to service.</p>
<p>Companies like Google recognise the importance of the transition from static file management to something entirely more helpful and flexible and therefore make services like Google Docs compatible with MS Office. What this means is that any document you created with an MS product &#8211; like Word docs and Excel spreadsheets, can be opened, modified and saved in Google Docs, totally seamlessly. Also, files created with newer versions of MS Office (with extensions like .docx and .xlsx) won&#8217;t even open on some computers with earlier versions of the same software (MS Office 2003 for instance) without the user downloading an addon. How mental is that?</p>
<p>Google Docs has no such limitations, allowing you to do what you like with any versions of MS Word, Excel, Powerpoint etc docs, from any computer, anywhere. Sweet.</p>
<h3>Levelling the playing field</h3>
<p>Cloud computing can really level the playing field for smaller companies and startups. Those companies can leverage the power, technology and wealth of much larger companies by renting storage space, functionality or just about any kind of service now.</p>
<p>Renting near unlimited amounts of disk space in the cloud is just one example of the benefits of cloud computing, but what else can you do with cloud computing?</p>
<p>You&#8217;re already using it manage your social profiles on sites like Facebook and Twitter. But you can also rent your own <a href="http://www.zendesk.com/">help desk</a> and integrate that into your company website. You can make real-time video and audio calls over <a href="http://www.skype.com/intl/en-gb/home">Skype</a> to anybody who also has Skype installed for free. You can manage your entire business&#8217; financial accounts and invoicing on services like <a href="http://www.getharvest.com/">Harvest</a> and <a href="http://www.freshbooks.com/">Freshbooks</a>. You can manage any type of project with multiple users on applications like <a href="http://basecamphq.com/">Basecamp</a>, <a href="http://lighthouseapp.com/">Lighthouse</a> and <a href="http://www.activecollab.com/">Active Collab</a>. If you&#8217;re a web developer, you can even manage your entire development environment online through services like <a href="http://www.coderun.com/">Coderun</a> and <a href="http://kodingen.com/">Kodingen</a>. The possibilities are endless.</p>
<h2>How to get it</h2>
<p>There are plenty of cloud storage services on offer. Some are free and some require a (usually small) monthly fee.</p>
<h3>Free cloud storage space:</h3>
<ul>
<li><a href="http://www.dropbox.com/pricing">Dropbox</a> (up to 2GB, up to 8GB if you refer friends)</li>
<li><a href="http://www.box.net/pricing">Box.net</a> (up to 5GB)</li>
<li><a href="https://docs.google.com/">Google Docs</a> (up to 1GB)</li>
<li><a href="http://explore.live.com/windows-live-skydrive">Windows Live SkyDrive</a> (up to 25GB)</li>
<li><a href="http://www.memopal.com/en/">Memopal</a> (up to 3GB)</li>
<li><a href="http://www.zumodrive.com/pricing">ZumoDrive</a> (up to 1GB)</li>
</ul>
<h3>Paid cloud storage space:</h3>
<ul>
<li><a href="http://www.dropbox.com/pricing">Dropbox</a></li>
<li><a href="http://www.box.net/pricing">Box.net</a></li>
<li><a href="http://aws.amazon.com/s3/">Amazon S3</a></li>
<li><a href="http://www.zumodrive.com/">ZumoDrive</a></li>
</ul>
<p>As you can see, most services offer a free trial or small amount of free storage to entice you to upgrade to their premium packages. This is cool because you can then sign up for a free trial and play around with it to see if you like it enough to upgrade to a paid service. Or you could stick with the free version if you don&#8217;t need a lot of storage space.</p>
<h2>Basically</h2>
<p>This is the future not just of the way we work, but eventually the way we live. More and more aspects of life in general are being pushed online through web and mobile apps, and services are cropping up all over the place to cater for things you didn&#8217;t even know you needed or were possible. As it becomes easier and quicker to get a net connection from almost anywhere, the barriers to entry of becoming cloud-focused get smaller and smaller. It&#8217;s not something to be afraid of. It&#8217;s an endless supply of opportunity and it&#8217;s something to be embraced. The quicker we get on board with it, the more chance we have of staying flexible and agile in our working and living arrangements &#8211; whatever they may be.</p>
<p>Check out these posts for further reading on cloud computing and its uses:</p>
<ul>
<li><a href="http://web.appstorm.net/roundups/50-great-web-alternatives-to-desktop-software/">50 Great Web Alternatives to Desktop Software</a></li>
<li><a href="http://www.youtube.com/watch?v=ae_DKNwK_ms&amp;feature=player_embedded#at=188" rel="shadowbox[sbpost-1013];player=swf;width=640;height=385;">Salesforce.com: What is Cloud Computing?</a></li>
<li><a href="http://www.readwriteweb.com/cloud/2010/04/how-cloud-computing-can-help-a.php">How Cloud Computing Can Help A Small Business Get Out of the Recession</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/the-cloud-what-it-is-and-why-you-should-consider-switching-to-it/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fixing Upgrade Problems in WordPress</title>
		<link>http://www.whiteheatdesign.co.uk/thoughts/fixing-upgrade-problems-in-wordpress/</link>
		<comments>http://www.whiteheatdesign.co.uk/thoughts/fixing-upgrade-problems-in-wordpress/#comments</comments>
		<pubDate>Fri, 11 Feb 2011 16:32:48 +0000</pubDate>
		<dc:creator>Xav</dc:creator>
				<category><![CDATA[thoughts]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://www.whiteheatdesign.co.uk/?p=844</guid>
		<description><![CDATA[During December 2010 and January 2011, WordPress released four upgrades to the core, which is quite a lot. I've had issues in the past with both core and plugin upgrades, but all have eventually been rectified. Thankfully, it seems as though I've finally learnt my lesson(s). ]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/upgrade_wp_lead.jpg" alt="Fixing upgrade problems in WordPress" title="Fixing upgrade problems in WordPress" width="535" height="175" class="aligncenter size-full wp-image-996" />During December 2010 and January 2011, WordPress released four upgrades to the core, which is quite a lot. I&#8217;ve had issues in the past with both core and plugin upgrades, but all have eventually been rectified. Thankfully, it seems as though I&#8217;ve finally learnt my lesson(s). So with the impending release of WordPress 3.1 any day now, I thought I&#8217;d share with you some tips on how to upgrade the core theme <strong>and </strong>plugins and give yourself the best chance of avoiding the same problems I ran into.</p>
<p>The post is divided into two sections &#8211; Errors upgrading plugins and errors upgrading the WordPress core. I&#8217;ll first list the symptoms of each potential error, and then suggest workarounds and fixes. Good luck in finding yours!</p>
<h2>Errors upgrading plugins</h2>
<h3>Upgrade says &#8216;Downloading update from &#8216;url&#8217; but actually hangs</h3>
<div id="attachment_982" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-982" title="Plugin hang" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/plugin_hang.jpg" alt="Plugin hang" width="535" height="176" /><p class="wp-caption-text">Starts off well enough, but quickly goes nowhere</p></div>
<p>You&#8217;ve hit upgrade on your plugin and it looks like it&#8217;s about to start downloading but doesn&#8217;t seem to get any further. This normally happens because the plugin is clashing with another active plugin.</p>
<div id="attachment_986" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-986" title="Upgrade going nowhere" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/upgrade_hang_done.jpg" alt="Upgrade going nowhere" width="535" height="215" /><p class="wp-caption-text">Check the bottom of your browser - probably says &#39;Done&#39;</p></div>
<h4>The Solution</h4>
<p>Deactivate all active plugins. Since WordPress version 2.7, they&#8217;ve included a helpful &#8220;Recently active&#8221; table, so you don&#8217;t need to worry about remembering which plugins you had active. Once you&#8217;ve deactivated them, go back and upgrade your plugin(s). Then go to the recently active plugins link and re-activate them again.</p>
<p><em>N.B &#8211; When a plugin has been inactive for more than 7 days it gets moved to the inactvie plugins table so be sure to sort your upgrades before then or you&#8217;ll have to check manually for the plugins you want to be active. </em></p>
<h2>Errors upgrading WordPress core</h2>
<h3>Unavailable for maintenance</h3>
<div id="attachment_987" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-987" title="Stuck in maintenance mode" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/maintenance.jpg" alt="Stuck in maintenance mode" width="535" height="94" /><p class="wp-caption-text">Stuck in a loop</p></div>
<p>This normally occurs when you accidentally break the upgrade cycle  mid-process. So if you click away from the upgrade page while it&#8217;s still  processsing, any page you subsequently click on will come up blank with  this message (including admin pages) and you&#8217;ll be caught in an unbreakable cycle. What could be  more fun.</p>
<h4>The Solution</h4>
<p>First, calm down &#8211; it&#8217;s an easy fix ;)</p>
<p>The only way to break this loop is to log in to your FTP account and  hunt down a .maintenance file located at the root of the install. Delete him and you&#8217;ll be able to start the upgrade process again. The file will be hidden so you&#8217;ll have to enable hidden files to see it.</p>
<h3>Upgrade starts but does not complete</h3>
<p>Similar to the plugin upgrade error above, WordPress attempts to upgrade and says downloading from such and such, but never completes.<br />
<div id="attachment_985" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-985" title="Upgrade hang" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/upgrade_hang.jpg" alt="upgrade hang" width="535" height="214" /><p class="wp-caption-text">WordPress pretends it&#39;s up to something...</p></div></p>
<div id="attachment_986" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-986" title="Upgrade going nowhere" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/upgrade_hang_done.jpg" alt="Upgrade going nowhere" width="535" height="215" /><p class="wp-caption-text">...but is actually doing diddly squat</p></div>
<p>One common explanation for this is surplus temporary files from previous plugin/core upgrades interfering with the current upgrade process.</p>
<h4>Solution one</h4>
<p>Log into your FTP server again and look in your wp-content folder for files such as wordpress-3.tmp. You can safely delete these as they are the result of previous failed upgrades. Go back to your admin and be sure to temporarily deactivate all active plugins before you do your core upgrade again. It should fizz through with no problems this time.</p>
<div id="attachment_983" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-983" title="Temporary files" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/tmp_files.jpg" alt="Temporary files" width="535" height="230" /><p class="wp-caption-text">Get rid of these guys</p></div>
<h4>Solution two</h4>
<p>Similarly to the above, WordPress also creates temporary upgrade folders. If you&#8217;ve removed your .tmp files and are still having problems, try removing the upgrade folder inside the wp-content folder.</p>
<div id="attachment_984" class="wp-caption aligncenter" style="width: 545px"><img class="size-full wp-image-984" title="Upgrade folder" src="http://www.whiteheatdesign.co.uk/wp-content/uploads/2011/02/upgrade_folder.jpg" alt="Upgrade folder" width="535" height="230" /><p class="wp-caption-text">Get rid of this</p></div>
<p><em>N.B &#8211; removing the .tmp files and upgrade folder should be safe enough providing you are not doing so in the middle of an active update, but just to be sure, it&#8217;s always good to back up/copy any files you delete to somewhere safer first.</em></p>
<h2>Conclusion<em> </em></h2>
<p>If you&#8217;re really unsure or worried about doing these upgrades, you can try installing the <a href="http://wordpress.org/extend/plugins/wordpress-automatic-upgrade/">WordPress Automatic upgrade</a> plugin which will help you along the process and offer some helpful  tips at the same time. However, as long as you remember the following  points, you shouldn&#8217;t need too much help if/when you run into upgrade  issues:</p>
<ul>
<li>Backup your database and files before all major updates</li>
<li>Deactivate all active plugins</li>
<li>Only install reputable plugins from <a href="http://wordpress.org/extend/plugins/">reputable sources</a></li>
<li>Check for leftover .tmp files on your server and delete them</li>
<li>Check for leftover Upgrade folder on your server and delete it</li>
<li>Check for .maintenance file (hidden) on your server and delete it</li>
</ul>
<p>Running into upgrade problems is thoroughly annoying and can be quite alarming when working on client sites if the sites stop functioning and throw up big error messages. But we have to remember that these upgrades are there for a reason. They come with the territory of using open source software and are only there to improve such things as security and performance. They are neccessary evils. But if you&#8217;re decent enough at combatting upgrade errors, they needn&#8217;t always be so evil. </p>
<p>Here is your mantra:<strong> Deactivate | Update | Reactivate (DUR)</strong>.</p>
<p>Good luck with the WordPress 3.1 update :D</p>
]]></content:encoded>
			<wfw:commentRss>http://www.whiteheatdesign.co.uk/thoughts/fixing-upgrade-problems-in-wordpress/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced
Database Caching using disk: basic
Object Caching 760/895 objects using disk: basic

Served from: www.whiteheatdesign.co.uk @ 2012-02-06 10:35:38 -->
