What started out as a silly response to a silly conversation at Webble Mill in the summer of 2010 has resulted in me randomly changing my Twitter avatar. Why? Well, I’m not sure, but essentially my original idea was to have me pulling faces much like a (disturbing) real life Skype style mood message. But there’s an issue with how long it takes a new avatar to roll out to numerous twitter apps, devices and other followers. It was all out of date before the day was out.

BAN THIS FILTH

So I just reflected random missives and clichéd quotes in the avatars and for some reason it just keeps going. And going. It’s been an interesting exercise from a graphic angle and I’ve never taken it too seriously, some work and some don’t. It was a good excuse to roll out some Cooper Black sometimes, but X and Y Font Condensed had the most impact in such as small area.

110% MORAL OUTRAGE

Many many thanks to everyone who has commented, suggested phrases and been kind. I’m not sure where to take it next, so this overview is possibly the point where I wrap it up and I’ll continue to take my lead once again from Luke Dorny and his avatar stylings.

PLEASE RT (look up above)

As this is about Twitter, we’ll have one of these buttons you see everywhere:
Tweet

After a few years, and a few false starts, welcome to a new version of my site. If you’re familiar with my previous site, then what you’re looking at isn’t a radical overhaul. Why so long? Almost every designer will tell you, your own material is the hardest to realise, but I’ve always tried to stay true to what I believe – I’ve was happy with my website and ‘brand’ and it got good feedback, so why change for the sake of it? I didn’t need to redesign. I always fall into the camp what Cameron Moll would call; a Realigner.

The work I do has progressed and developed in the past few years and the old site didn’t reflect that. This site isn’t finished by any means and there are a few additions to come yet.

Tech

At some point, you’ve just got to get stuff out of the door. As things stand, this site has been many months in the making and in which time many many more articles, frameworks and practices have come along forcing me to question my approach, so whether it’s adaptive or responsive, adheres to strict html5 semantics or misses a few CSS3 fancy tricks is irrelevant – in the same way the best camera is the one you have with you, this version of my site is the right site at this time.

I’ve taken various starting points and overall I’ve been helped along by Andy Clarke’s 320 and up, Steffan Williams who is thrilled I’ve butchered his Gridinator. There’s plenty of Javascript in here with scripts adapted from Two Spy, Jörn Zaefferer, Nathan Smith and Build Internet. The site is (still) built on Expression Engine foundations with additions from Lodewijk Schutte, Causing Effect and Nick Cernis. Lastly, Typekit.

Notebook (was Reportage)

Once of my main reasons for remaining with Expression Engine – I almost ditched everything but I do occasionally have moments of inspiration, The design is refined and removes sifr, links and other clutter.

Portfolio

Long overdue, and again, a difficult area to get right. However, after much research and bouncing ideas around, simple is best – please, if you want to know more, I’m more than happy to talk through my approach and ideas.

Thanks

Many thanks to Jon Hicks, John Oxton, Steffan Williams, Graham Bancroft, David Hughes and Matt Hamm for being their help and feedback.

The future

There’s much more to come in the way of enhancements and pad out the About page, and with any luck start producing many more words. I’ve a list of article ideas like most people – I just need some time and space to actually produce the content, rather than just dumping thoughts on Twitter.

Notes:

• Twitter Icon inspiration taken from Pegoretti windows
• Get all the A Book Apart titles
• Still got Charlbury station on the homepage, but it won’t be here forever
• Logo. Still undecided how the best way to go about this is. Image, Background image? Text? Many issues.

UPDATE:

2nd Sep 2011 – I have added the excellent Flexslider by Tyler Smith to the homepage.

And me. I presented a rather hurried 5 minute talk with the title “Designing Around Bad Business Decisions” and it seemed to go down well enough.

Here’s a PDF of the slides with my notes for your perusal.

Thanks to Jon Hicks, John Oxton and Ken Norman for their help. Also thanks to J-P, Oxford Geeks, Torchbox and Historic Futures.

Links:

Whilst we can target IE 6 with Conditional Comments, this approach requires the main CSS to be over-ridden with different values, but what if we do want to start from scratch with IE 6?

Recently discussed at Rissington HQ it was decided for some sites, we didn't want to really support IE 6 and with some people making a concerted effort to ditch IE 6 support, we would still like IE 6 users to see "something" but not a mess either. Instead of supplying the fancy-dan CSS, it would be ideal to just supply a basic text version, such as the basic style we already apply to IE 5, Netscape etc.

We have been able to hide styles from older browsers such as IE 4 and Netscape using the @import declaration (and IE 5 using the filter /**/), but this won't work for IE6 and above. Digging around in the Textmate HTML bundle, I accidentally stumbled upon a Conditional Comment basically saying, "if you're not IE, show this"... Ah ha!

So very quickly here's the score. At the moment we can link to our external CSS using this code and as IE 5 can't understand the @import bit, it just gives up:

<link rel="stylesheet" href="textonly.css" type="text/css" media="screen" />
<style type="text/css">@import/**/"my_gorgeous_layout.css";</style>

Using the [if !IE] Conditional Comment however, we can just feed old Microsoft browsers one style and more modern browsers another. Like this:

<!--[if !IE]><!-->
<link rel="stylesheet" href="my_gorgeous_layout.css" type="text/css" media="screen" />
<!-- <![endif]-->

<!--[if gte IE 7]>
<link rel="stylesheet" href="my_gorgeous_layout.css" type="text/css" media="screen" />
<![endif]-->

<!--[if lte IE 6]>
<link rel="stylesheet" href="textonly.css" type="text/css" media="screen" />
<![endif]-->

I've tested the basics of this approach and it works well. If anyone tries has some success on a future or current site, please let me know.

UPDATE: Dan Cederholm has published an article on how to deal with IE6 and some great comments. Apologies to those whose comments were closed off here. Spam Spam Spam...

It's not just about great stories, I don't need to elaborate and you can draw your own conclusions - but it's the use of white space.

Image: Warwick Arts Centre http://gallery.warwickartscentre.co.uk/gallery/d/33556-1/Tiger+Illustration.JPG

I decided that instead of trading for a lovely new MacBook Air, my similarly specced late-2008 MacBook 13” could be given a new lease of life with an SSD drive and a new battery, for a fraction of the cost. I run Aperture and the machine felt limited with 4GB Ram and the installed disk – I needed a speed bump with the much hyped SSD.

Trade-off

And then there’s the storage question, at the time of me purchasing the SSD drive, the most commonly available maximum storage was 256GB, whereas I’d been used to 500GB where I stored all my music and a huge library of photos, so this was a problem.

Enter Optibay

I’d been aware of the MCE Optibay hardware hack for a while where the premise is rather basic: Take out your Optical DVD Drive and put a 2.5 Hard Drive in there instead. Easy, apart from the fact the the kits were only available in the States, and sending Brits potentially into a world of unpredictably high taxes and shipping costs. So I waited and waited before I did anything, until I discovered German firm Zapware where importing the packs for EU customers – SOLD. My first shipment got lost somewhere, but Zapware were excellent and dealt with it well. A week later I had a small box of hardware – the optibay, screws and an external USB enclosure drive for DVD.

At this point I’d been running with the benefits of SDD but the inconvenience of all my photos on external drives. If you are happy to go fiddling around inside your Mac then you’ll be fine. When performing such operations it’s really worth remembering that you should have everything to hand, screwdrivers, clear your desk, and clear any distractions for up to 30 minutes. It’s a bit fiddly, but as long as you carefully follow the illustrated instructions, it’s easy.

Fine tuning

I think the following issues vary from machine to machine, but my experience from here is a fiddly one. So, with everything installed, I have a MacBook with 2 Hard Drives and everything is running great… apart from the Mac wouldn’t go to sleep when I closed the lid (rather essential). After some choice searching around the internet, it seems the issue revolves around which bay you have your Boot drive, SSD Drive or normal drive. I had it the “wrong” way round and for my set up, my Boot Drive (which is on the SSD, that’s where the performance kicks in) needs to be in the MCE Optibay, NOT in the traditional drive bay next to the battery. This immediately solved the issue, and the only trade-off now apparently is that I’ve lost the ability to hibernate (thats where the Mac saves it’s state in a nice fashion when the power goes completely). This involved more fiddling of course and I curse losing time like this.

Windows

So the other thing I could comfortably do is run a Bootcamp Windows partition off the 500GB drive. This is a fairly painless task apart from… The external drive isn’t bootable. So the Optical drive went back inside the Mac to install Windows 7 Home Edition. More time, more trying to work out what I could or couldn’t do.

Conclusion

Would I recommend doing all this? Well, yes, but only if you are prepared to get you hands dirty with computer innards. Novices like me can cope fine if you are adept at upgrading RAM for example, but if you don’t know your way around the Startup Disk panel in System Preferences, then leave alone. A MacBook Air would be very nice, but there’s plenty of life left in my old MacBook yet and an Air wouldn’t satiate my needs for space with the current specs.

Images Before and After:

What’s in the box?

Oxford Geek Nights: http://oxford.geeknights.net/2011/jun-15th/
Join this event on Lanyrd: http://lanyrd.com/2011/ogn22/

It all went well and we’re all pleased with the result. And I got to use some Trade Gothic.

Building upon the spook shoe collection, it has been suggested many times that this should be a public Flickr group.

And now it is. And anyone can join if you have a relevant entry that abides by the rules:

• Shoe must genuinely be lost
• Other shoe must be nowhere to be seen
• Location must be accurately located on the map so an accurate picture can be built up

One lost shoe