Simian Studios Blog

12412 January - Responsive Web Design

Fri, 24 Feb 2012 07:27:58 +0000

For me, one of the most fun things about working on the web is the fact that there's always new things to try out - be it a new technology, a new framework or just a new way of thinking about the way we work.

The tricky part is trying to keep up with everything - it's so easy to fall behind and then feel like you'll never catch up.

That's why I think the 12412 initiative is such a great idea. Commit yourself to learning about something new each month and by the end of the year you'll have experienced a dozen things you hadn't tried before.

So, for January's effort I decided to finally get around to learning about perhaps the biggest talking point of the last couple of years - responsive web design.

What is it?

Responsive Design, Responsively Illustrated by James Mellers

In essence, "responsive web design" is the buzzword (buzzphrase?) that encapsulates a bunch of techniques which aim to make a website "aware" of the canvas it has available to display itself on - the canvas being the user's browser window.

Such techniques include a fluid- rather than fixed-width grid system, media queries and the use of JavaScript to selectively load content based on the size of the viewport.

The concept of fluid-width designs is not a new one of course, but the advent of media queries and the huge leaps in the quality of small-screen browsers have made it easy and necessary to consider the context in which our designs are viewed.

For example, a fixed-width design at 960 pixels will look great on a desktop monitor or laptop, but a smartphone with a screen only 320 pixels wide will either introduce horizontal scrolling or zoom out to fit the whole page in the viewport, forcing the user to manually zoom in if they want to actually read your content.

A responsive website would instead display a different set of styles and perhaps even different content based on the space available to display it. If you want to see what it looks like in the wild, check out the recently-launched Smashing Magazine redesign by Elliot Jay Stocks and resize your browser window - there's everything from a wee narrow layout for smartphones, right through to a super-wide layout for the big screens.

How to do it?

It sounds a bit daunting at first to consider that you'll be designing for so many different use cases, but really it's quite simple, providing you keep it in mind from early on in the design process. Retrofitting is certainly possible but not as easy as building responsively from the ground up.

First steps

As with any design, the bedrock is a solid grid system. Rather than using pixels though, we use percentages to allow our design to grow and shrink with the browser window.

Once you've got your grid layout built, you'll probably find that there are certain points where the design stops working quite so nicely. Perhaps on narrower screens your lovely horizontal navigation drops down onto two lines, or maybe on a wider screen your paragraphs get too wide and become hard to read.

These are your design's breakpoints and this is where media queries come in. If you determine that the minimum width your navigation can be displayed nicely at is 600 pixels, then you would set a media query to alter the styles at anything below 600 pixels, like this:

@media screen and (max-width: 599px) { /* styles for screens < 600px wide here */ }

Delving deeper

FitVids.js

Once you've done that and fixed the main breakpoints in the design itself it's time to consider the content.

As the design gets narrower you might want to change the font sizes, leading and perhaps margins and padding on your content to make it easier to read on smaller screens.

For richer media such as images or videos there are a few things we can do. Setting a max-width of 100% on an image will make it resize so that it never escapes the boundaries of it's containing element. Thankfully, browsers are intelligent enough these days to resize an image proportionally rather than stretching and squashing our beautiful photos and illustrations.

Videos are a bit more tricky, as the iframes used by the big video-sharing sites for their embed codes don't respond in the same way as images or even the HTML5 video element. Luckily for us, Chris Coyier and the clever guys at Paravel have come up with FitVids.js, a jQuery plugin that takes your videos and makes them properly responsive with a single line of JavaScript.

As responsive web design begins to mature, I'm sure we will see the niggly problems such as videos being squashed but in the meantime we can just do what we have always done and design defensively, making sure our content is still usable if not beautiful when we hit those breakpoints.

It's that easy?

Well, yes and no. The basics of responsive design are fairly straightforward and shouldn't be hard to get to grips with. Anyone who's designed with a fluid or elastic layout before will be familiar with some of the issues faced, and adding media queries for breakpoints is straightforward.

What can get tricky is when you have a relatively complex design that needs to be converted from flat comps to proper HTML/CSS goodness. One way around this problem could be to design in the browser, gradually layering up the design until it looks great but with the responsiveness baked in from the very beginning. Then again, it may just be that we need to design with the fact that the layout needs to be malleable always in the back of our mind.

Sure, responsive design gives us a lot of challenges, but it also helps us to serve users better so I think the challenges are worth overcoming. No doubt there will be browser improvements, JavaScript fixes and innovations in CSS that will smooth the path and make it easier for designers to dabble with responsive design.

How can I learn more?

I can't not mention "the book" on responsive design, the aptly-named "Responsive Web Design" By Ethan Marcotte. It's very well written and Ethan's enthusiasm for responsive design really shines through and makes you want to get involved.

As well as the book, there are or course thousands of articles online. .net has a bunch, Smashing Magazine has a few and you'll also see a few on sites like 24ways. Of course, you could always do a Twitter search for the #RWD hashtag too.

Start now!

One thing that I like about responsive design is that you can start right away. Even on an existing fixed-width design, and even if it's just a single breakpoint so that it's easier for people to read your stuff on a mobile device. I know that's not really the idea but if it benefits the user then some responsiveness is better than none in my books.

I'm currently working on just that for this site - it's readable enough on a tablet but on a mobile screen it's a bit small, so keep your eyes peeled for a new "mobile version" soon!

Conclusions

Overall I think this was a great start to 12412 for me - it's something that will influence my design work from now on so a good thing to make acquaintance with early on.

Writing this up has made me wonder why I haven't gotten to grips with responsive web design sooner - perhaps I was just afraid that it would be too complicated but in honesty the only problem it's causing me now is that I want to responsive-ize everything I've ever worked on. That's partly why I'm posting this at the end of February - I've been having so much fun experimenting I've not gotten around to writing it up!

I'd love to know your thoughts on responsive design - what were your first experiences with it? What have you discovered that wasn't immediately apparent from reading books or blog posts? Have I totally missed the point with my "single breakpoint" idea? Let me know in the comments!

New Adventures In Web Design 2012

Thu, 02 Feb 2012 09:04:48 +0000

Following on from the successful first event - my first ever web conference - in 2011, New Adventures made an equally successful return with their 2012 installment last week.

The first event set some very high standards in terms of the quality of the talks and the general attendee experience so I was eager to see what Simon, Greg and the team would manage to pull off this year.

Anticipation

After what seemed an eternity of waiting and tweeting about how much we were all looking forward to it, including almost double-booking my hotel room because I forgot I booked it way back when I got my ticket, the event was finally upon us.

Like the first event, the conference-eve social was ably handled by the Erskine Design team in the form of Erskine Bowling. I missed out on actually being in a team again but there was plenty of opportunity to meet, chat and catch up, as well as the excellent idea of being able to pre-register for the conference itself which certainly made things easier in the morning.

The day

Having braved the infamous Holiday Inn Express breakfast, we made the short trip over to the Albert Hall to be greeted by a crack squad of volunteers who quickly shepherded us through into the lobby for an extra hit of caffeine and the chance to have a quick mingle. I must give praise to the Albert Hall staff for their efficiency and politeness at this point - it's a small thing but it all adds to the overall experience of the day for me.

Once we were all settled Simon kicked things off with a quick introduction before handing over to the first speaker...

Dan Mall

Dan's talk was one of the ones I was most looking forward to, having admired his work for some time. I mean, the guy redesigned the Star Wars website - you don't get much more geek kudos than that!

Dan's talk was titled "Design-ish" and explained some of the design-related lessons Dan has learned from working with clients like LucasFilm and Crayola. What I thought was really great was that Dan gave us a behind-the-scenes look at his working processes, discussing things that worked well and things that didn't work so well in equal measure.

A good example of this is when he spent hours trying to come up with some kind of way to map the relationships between Star Wars characters, only to be blown away by the knowledge that his contact at LucasFilm had amassed off his own back. The lesson there was that we should get to know our clients as well as possible, because their knowledge of their domain will always trump what we can come up with through an algorithm.

I got to chat with Dan in the evening and he said he was really nervous about giving that talk for obvious reasons - standing in front of 600 of your peers and telling them your failures is the stuff of nightmares for a lot of people! But I'm really glad he did it because the lessons learned are incredibly valuable and for most of us having access to that kind of knowledge without the pain of learning the hard way is rare indeed.

Naomi Atkinson

Photo by Jelson25

Next up was Naomi, who essentially gave a masterclass in self-branding for web folk, as well as a call-to-arms for the web community as a whole to look at what we can do to make the world a better place.

The branding masterclass part was done by looking at various celebrities - not my favourite group of people in the world but Naomi rightly pointed out that they are all masters of self-branding. The first example was Puff Daddy / P Diddy (etc.) - I think he could rename himself anything he wanted and people would get on board with it, no matter how ridiculous. The takeaway from this is not to be afraid to rebrand where needed, but also not to be afraid to build upon an existing brand.

Jordan was next under the microscope - surprisingly we can all learn something from her and that is to not be afraid of self-promotion. Jordan is probably the best example of this with the seemingly endless variety of ways she manages to get herself noticed. I don't think I'll be launching my own magazine anytime soon but the concept of deciding how you want to be noticed and who by is very powerful indeed.

Finally Naomi set her sights on everyone's favourite mockney, Jamie Oliver. Jamie is probably best known for his work on projects like Jamie's School Dinners, Fifteen and Ministry of Food. What links these projects is that they all benefited others and the lesson here is that we can work for the greater good at the same time as helping our own branding. Just because a project helps others, doesn't mean there's nothing in it for us. Naomi is a good person to attest to this, having done a lot of work for charitable organizations.

Naomi followed that up by extolling us to look for problems in the world that we can use our skills to solve. I agree that we spend a lot of time on the web trying to solve what are relatively minor problems, when there are people struggling to find clean water or food to eat. Imagine what a difference we could make if 600 people each made a small commitment to solve a "real" problem!

Travis Schmeisser

Photo by Jose Carli

I must admit that I didn't know much about Travis before New Adventures, but the title of his talk - "We Used to build Forts" - alone was enough to pique my interest.

Travis thinks that the web industry has lost some of the creative spark that it used to have, and that we need to rediscover our sense of self-expression through our work.

I can personally relate to this - it is all too easy to get bogged down doing the same thing over and over again and forget why we loved working on the web in the first place.

Travis went on to share ways in which he feels we can recapture the energy and enthusiasm of those early days, with lots of short-and-sweet snippets to take home.

One that really resonated with me was "loosen up" - I've written in a similar vein before but Travis is simply saying that not every piece of work is going to be a masterpiece. Another was "make for the sake of it" - things like Strong Bad never really served a purpose other than being entertaining, so why not do something creative just for the fun of it? It doesn't even matter if other people ever see it, just making something is enough to get your creativity flowing.

Robbie Manson

Photo by Carsten Schlipf

Robbie's talk was titled "The Mindful Designer". For Buddhists, mindfulness is very important on the path to enlightenment and Robbie's talk showed that to be true for designers too.

The idea is that just by being mindful of our design processes, we can produce better work.

For example, if working in a team, the earlier we open up to our team members, the earlier we get to benefit from their experiences. Or by getting away from the screen and experiencing "positive disruption" we can change the way we think about our work.

Robbie used lots of great examples to illustrate his points and to be honest I'm finding it hard to do his talk justice so my recommendation is to take the time to watch the video - it's well worth it!

Trent Walton

Photo by David Ritter

Trent is another of my design heroes so I was particularly excited to see his talk and it didn't disappoint.

Trent's talk was titled "Break Everything" and centred on the value of breaking the rules for the sake of progress. By breaking the rules we can discover what is possible, then we can develop our understanding of it, and then we can improve it.

Essentially by breaking the rules we're pushing things forward, so we should seek out new and exciting ways to do so.

Developing understanding may not always be a walk in the park but it's necessary. However the fun we can have while breaking the rules in the first place more than balances it out.

I thought Trent's talk was an excellent complement to Travis' - if you're going to create something for the sake of it, why not break the rules at the same time and see if you can come up with something really groundbreaking?

Cameron Koczon

Photo by Lars Sundstrom

Cameron, perhaps better known as Fictive Cameron, named his talk "The Potential Impact of Design".

The impact of design can be broken down into three separate but related segments: elicit emotion, induce action and effect change.

The idea of designing to create emotion has had a lot of attention lately - the idea being that if you can create an emotion in your audience, they are more likely to act - for example by signing up to your service, or donating to your charity. If you get enough people to act, you can actually effect real change in the world.

The main focus of Cameron's talk was how we as designers can use that idea to either find something to fix and create a startup to fix it, or join an existing startup and use the power of design to help them fix their problem.

A good piece of take-home advice was that a lot of people are afraid to do this kind of thing because they're afraid that they know nothing about business and are worries about competition. Cameron used an anecdote that most electric fences are actually switched off most of the time - the cattle learn that the fence is electrified and know not to go near it again. Once the cows have learned this behaviour, the fence works just as well when switched off. Cameron explained that the two fences of experience and competition also have no current, and that if we take the risk we will find that neither of those obstacles is insurmountable.

Denise Jacobs

Photo by Arjun Kartha

Next up was Denise, whose talk was totally different to any other talk I've ever seen at a conference.

Titled "Your Brain on Creativity", Denise part-narrated, part-acted a story involving a disembodied brain trapped in office-cubicle hell and a mysterious man who shows up and liberates the brain from its bindings and shows it how to be creative again.

The main take-home from Denise's talk for me was that you can't force creativity. Ever had a great idea in the shower? That's because when our brains are relaxed, they're more likely to be creative. Techniques like just taking a few deep breaths or laughing at something are enough switch that "creative brain" on and get the ideas flowing.

Denise also noted that fear suppresses creativity - if we're worries about getting things wrong, we're not going to create anything. This resonates with me personally due to my attempts to worry less and do more and it's nice to know I'm on the right track.

It was definitely a memorable talk, personally I found that the story element made the salient points stick in my head much better than a "normal" talk - kind of like the old "memory palace" trick that mentalists have used for centuries to perform astonishing feats of memory.

Frank Chimero

Photo by Frank Chimero

Finishing off the day was Frank, who first came to my attention with his project The Shape of Design - a Kickstarter-funded book on the "why" of design rather than the "how".

Frank's talk was perhaps the most philosophical of the day, with plenty of great soundbites on the role of design and our role as designers in the world we inhabit.

For example: the tiny pony. A tiny pony is an incredible thing that we take for granted. The phrase itself stems from the time Frank saw a tiny pony in the Apple Store and everyone else just acted like they couldn't see it. It's always useful to be mindful of the tiny ponies in our world - for example the fact that you're reading this article at all. To reach you it's been converted into a digital format, split into lots of tiny pieces, whizzed down some long, thin pieces of metal and glass (perhaps halfway around the world!), been reconstituted into the single document and displayed on your screen.

Frank's talk ended with a really powerful quote - "The world is not yet done. Lucky us" - while we are shaped by the world, we can also shape the world. What a great way to end an inspiring day!

Winding down

Photo by tobiwei

As before, the afterparty for the event was at the Escucha club and as before a generous bar tab helped get the conversations flowing, not that it needed much help after a day jam packed with conversation points.

It was great to catch up with old friends - some of whom I hadn't seen since the first New Adventures - and I managed to meet and chat with some new people too, including most of the speakers which was great - everyone's so approachable and happy to just chat, if you've never had the guts to just go up to someone you really should try it.

All in all

It should be obvious by now that I had a thoroughly enjoyable time in Nottingham - the New Adventures team more than lived up to their own high standards.

The only bad thing about New Adventures is that it has to end, and it's a bit of a downer on Monday morning to be sat catching up on emails and doing everyday stuff when you're still buzzing from the event and itching to get out there and change the world!

Colour Picker Bug Workaround for Adobe Fireworks CS4 in OS X Lion

Mon, 16 Jan 2012 09:27:31 +0000

Last week I finally upgraded my iMac from Snow Leopard to Lion. I'd heard some stories of incompatibility with certain software but the only thing I could see that would really affect me is the famous Fireworks Colour Picker bug.

Basically, if you're using Fireworks CS4 in Lion, the default colour picker is just plain broken. You can choose colours from the defaults provided but if you wanted to select a colour from the document itself you're S.O.L.. It doesn't seem like Adobe is in much of a rush to fix it either - after all, they'd far rather you shell out for an upgrade than actually bother to do something tedious like support users who paid a pretty penny for the then-but-no-longer latest version of their product. Nice, huh? </rant>

The workaround

Fortunately, there is a way to carry on using CS4 without having to upgrade or install any extra software. Yes, it takes a few extra clicks, but once you get into the habit it only takes a second or two.

Click the coloured tile as usual to bring up the default colour picker panel:
Click the little coloured wheel at the top right to bring up the Apple colour picker:
Click the little magnifying glass at the top left:
Click anywhere on the screen to sample the colour:
See that the coloured tile to the right of the magnifying glass has changed to the selected colour and click "OK"

That's it! You just saved yourself £146.37, my friend! Feels good, doesn't it?

This workaround also has the added benefit of making it easier to precisely select the colour you want, so it's a double-win.

Or…

As pointed out in the comments by Chris and Scott (thanks guys!), there is another method you can use which is the eyedropper in the "Colors" section of the main Tools panel.

All you need to do is click the pencil icon if you want to change the line, or the bucket if you want to change the fill:

Then click the eyedropper just above:

Then click your colour.

It won't work for everything like the technique above, for example the canvas colour or the colours used in a filter, but for just changing basic fill or line colours you might find it a bit easier.

Please let me know if you found this tip useful, and definitely let me know if it helped you save some money - I'll send my guys round to collect soon ;)

Main image: Colours 4 by Billy Alexander

Smile CSV Scraper for FreeAgent and Xero

Tue, 10 Jan 2012 07:17:13 +0000

Are you happy with your bank? I am. I use Smile and they're five-nines awesome - I heartily recommend them to anyone who banks in the UK. The real killer feature - their ethical policy as part of the Co-operative Bank - something all commercial banks should have in my opinion.

One thing they don't do though, is allow you to export your statements in any kind of format - which is kind of a pain for users of services like FreeAgent or Xero as it makes it hard to reconcile your banking transactions. I resorted to copy-pasting the data from the table and reworking the CSV by hand - a bit of a drag to say the least.

No more!

That continued until last week, when I saw a tweet about Aral Balkan's CSV scraper for his HSBC statements - a similar problem, which made me wonder if the code could be converted to work on the Smile statements.

Luckily, Aral is generous enough to share his scraper code under a Creative Commons license, so I got to work and came up with this:

The bookmarklet

Smile Prepare CSV

Drag the above link into your bookmarks toolbar to create a shiny new bookmarklet:

How to use it

My script works in exactly the same way as Aral's:

Sign in to your Smile account and navigate to a statement
Click the "Smile Prepare CSV" bookmarklet
Click the little "copy to clipboard" icon that appears in the row of buttons above the statement:
Paste the generated CSV into a plain-text editor
Save the file with a .csv file extension
Upload the saved file to FreeAgent or Xero

More info

The CSV generated is in the format described by FreeAgent on their help pages. I'm reliably informed that it will also work with Xero, but you will need to teach Xero what each field in the CSV means the first time you upload.

You can view the source if you want to see what's going on, my comments aren't as entertaining as Aral's I'm afraid but it should be easy enough to see how it works. The first part of the file is just includes, the real code starts at line 323.

Credits & licensing

Really all I've done here is take Aral's work and make a few tweaks, so huge kudos to him for not only coming up with the idea but also being cool enough to share the fruits of his labour under a permissive license.

As such, this code is released under the same license as Aral's - the Creative Commons Attribution-Noncommercial 2.0 UK: England License.

Thanks also to the authors of the components that do most of the heavy lifting, they are:

jQuery by John Resig
Clippy by Tom Preston-Werner
jQuery Flashembed by Brad Robertson

Main image credit: "20 Pounds" by Stephen Davies

Looking Back, Looking Forward

Thu, 05 Jan 2012 02:40:15 +0000

In case you somehow missed it, we're at the start of a brand new year so it's time to look back over the last twelve months and think about what we're going to do in the next batch of lunar cycles.

I've never really been one to go overboard on new year's resolutions - I prefer to keep them general rather than overly specific. I know, goals should be SMART - but I don't think of them as goals as much as reminders of already-held personal values. So here goes.

Looking back

Overall I feel 2011 was a great year both professionally and personally, though there is a fair amount of overlap between the two.

I attended my first conferences, met lots of great people, visited some new places and learned a lot of new stuff, plus I managed to fulfil my ambition to do some public speaking - only for ten minutes but it's a start.

I released my first piece of public code and wrote my first article as a guest author, both of which have been great experiences and ones I hope to repeat.

I broke out of an exercise rut and took up running, managing to complete the Pine Ridge 10K and the Grim Challenge towards the end of the year.

One thing I started that is still ongoing (forever, most likely) is a commitment to be more "authentic" in all areas of my life. This is probably the most important thing I did in 2011, as it has the potential to affect everything else that happens for the rest of my days - perhaps I'm just being dramatic but I quite like that thought.

Looking forward

Inspired by Ant's "2012 Challenge List", here are my aforementioned vague resolutions for 2012, these in addition to keeping up the positives from last year:

Consume less

It's easy to consume content online. Blogs, Twitter, news sites and the like have practically infinite amounts of interesting content. However, most of it isn't necessary for personal or professional development.

So, I will aim for quality over quantity in my content consumption, which will give me time to...

Share more

I've been blogging for about 18 months now but haven't managed to keep up any consistent level of output. Towards the end of last year I started to remedy that and in 2012 I aim to share more often - be it my own original work or things I find that interest me.

To this end, I'll be reworking my blog slightly into a more tumblelog-style affair to make it as easy as possible for me to share stuff. I'll also aim to share more away from my own site and Twitter account, be it speaking in real life or writing elsewhere.

I'm talking about books here - the tangible variety preferably but eBooks will do just fine too. I have a slight addiction to web design and development books - if I see a new book out and it's related to what I do, I've gotta have it.

When I commuted daily this wasn't a problem as I had about two hours a day to read on the train but since I started working from home that part of my day has vanished. I'll aim to reintroduce reading time into my day and work through the stack of books that has been steadily growing.

Experiment more

In 2012 I want to get out of my comfort zone as much as possible. I managed it quite well in 2011 but there is always room for new experiences. Taking up running was an experiment that really paid off for me - being able to complete my first races was a great feeling.

This year I will aim to take as many opportunities as I can to try new stuff in all areas of my life. For professional development I will be taking part in the 12412 initiative and encourage you to do the same. For personal development I'll formalise my bucket list so that I can use it to help me seek out opportunities.

Let's go!

There we have it. If you've taken the time to read this far and notice me failing to live by the above manifesto then you have my full permission to berate me loudly and publicly.

Happy new year!

Photo credits: main image - Fireworks by Daniela Sanchez. Looking Back - Pico Island by Guglielmo Losio. Sharing - For Us 2 by Spiz. Experiment - Lab Work by Nina Briski.

Save Time with Super-Quick Local Test Cases

Thu, 15 Dec 2011 03:33:20 +0000

If you’re anything like me, you’ve probably created local test cases before - quick little bits of code to try something out.

Maybe you’re trying to isolate a bug that’s been doing your head in, or perhaps you’re learning a new language and want to try out a new feature?

Whatever the reason, the point of test cases is that they’re quick and often just stay local rather than being uploaded for all to see. Your mileage may vary, but that’s certainly the case for me anyway.

Quicker! Easier!

If I’m making a test case, it’s because I want to get in, test my stuff, and get out of there. So the quicker and easier I can make it for myself, the better. I thought I was doing quite well by having a local testing domain in MAMP so I could easily just drop stuff in there and keep my test cases separate from my actual work, but today I hit upon something that takes the idea further and boils the test case creation process down to its essence - writing the code you actually want to test.

The Test Domain

If you work locally and don’t have a dedicated testing domain set up already, this is the first step. It’s as simple as creating a directory and then pointing your domain of choice at said directory, then dropping the files in. If you use some kind of GUI like MAMP Pro to manage your local domains this shouldn’t take more than a minute or so. I use the suffix “.local” for my local domains, so from here on in we’re working on the domain test.local.

The Wrapper

The second ingredient in our time-saving recipe is the wrapper. Since this is for quick testing, I’ve christened it quick.php (clever, eh?) but you can call it whatever you want and write it in whatever server-side language you like. Save the wrapper file in the root of your testing domain - for me it’s test.local/quick.php.

What the wrapper does is take care of the stuff that’s common to every test case. For example you’ll need the basic HTML structure so you’re working with valid markup, and you’ll probably have some default styles you want to apply to your test cases, because who wants to look at the browser defaults, right?

My wrapper code is below - you can see that it very simply takes a couple of parameters from the URL and plugs them into a minimal HTML5 structure. One is the (optional) document title, the other is the name of the file that contains the actual test case, minus its file extension (e.g. “test” instead of “test.php”).

<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title><?php echo $_GET['title']; ?></title> <link rel="stylesheet" href="quick.css" /> </head> <body> <?php require_once($_GET['filename'].'.php'); ?> </body> </html>

A warning…

The security-conscious amongst you will have noticed that we’re taking input from a URL and plugging it directly into the page. This is bad practice and should never be done in production code. I haven’t worried about security here as the test cases aren’t intended for public consumption. If you need to do a public test case for some reason, it’s easy enough to do some basic checks at the top of the wrapper script and save the values into variables for use in the relevant places.

The Rewrite

The final stage of preparation is a rewrite rule to make it as simple as possible to access our test cases. I mainly use Apache so I’ll do this via .htaccess, but you can easily achieve the same thing in nginx, IIS, whatever you choose.

The .htaccess goes in the root of your testing domain. It contains just a single RewriteRule that takes a nice clean URL and passes it to our quick-and-dirty wrapper file for processing. Here’s the contents of mine:

RewriteEngine on Options +FollowSymlinks # quick tests RewriteRule ^quick/(.*?)(/(.*?))?$ quick.php?filename=$1&title=$3 [L,NC]

Don’t be alarmed by the regular expression in there. Regexes are a dev’s best friend, and this one is really quite simple. It takes a URL in the format test.local/quick/[filename]/[title] and rewrites it into the format test.local/quick.php?filename=[filename]&title=[title]. If you don’t care to give your test case a title, you can also use test.local/quick/[filename].

The Regex

If you don’t want to know the gritty details of the regex, feel free to skip this section - I won’t be upset. But if you're not familiar with regular expressions, I strongly recommend you look into them - they’ll save you a lot of time in the long run! This screencast series over at NetTuts+ explains everything from the ground up, so there's no need to be scared.

So, back to that regex. It looks like a mess of brackets, but if we look under the bonnet you’ll quickly see how it works.

When the regex encounters a URL in the right format, it breaks it down into three parts - the filename, the title including a “/” and just the title. The filename part is simple - just match any string or characters after the first “/”.

The title part has a little more to it - the pattern (/(.*?)) will first match the second “/” character and any string following it, but then it will match just the string after the second “/”, so we don’t need to worry about removing it from the title later.

The final “?” makes the whole lot optional, so if you choose not to bother with a title the rewrite rule still matches.

Creating a test case

Now we just need to create a test case. This can be anything you want to test, but as an example I’ll be comparing three different line-spacing values for a short paragraph. The markup for my test case looks like this:

<p style="line-height:1em;">Lorem etc…</p> <p style="line-height:1.25em;">Lorem etc…</p> <p style="line-height:1.5em;">Lorem etc…</p>

Notice that we just write the stuff we want to test. No need for the HTML <head> and all that stuff. Save the file to your testing domain and give it a filename that’s easy to type in a URL. The only restriction is that you have to save it with the right extension for the server-side language you used to write the wrapper. Let’s go with test.php in this case.

Once you’ve saved your file, open up your browser and go to http://test.local/quick/test/A Quick Test - obviously, substitute the right values for your testing domain, wrapper file and test case file. All being well, you should see your test case displayed nicely, with a proper title and everything.

Conclusion

Now, all that might seem like a lot of effort to save a little time on each test case, but in reality it only took me about ten minutes to set up from scratch, so if you follow this tutorial you can probably do it in about five.

From now on, whenever you want to write a test case you can just save a tiny new file in the root of your testing domain and type the appropriate URL into your browser - no fiddling around finding the HTML structure again or having to set up default styles each time.

Depending on what you do with it, you’ll probably be into time profit after half a dozen test cases, which won’t take very long at all if you’re as compulsive with them as I am!

Photo: Test Tubes by Dan Machold

Thank You

Thu, 08 Dec 2011 06:38:24 +0000

Today there's been a lot of tweets in my timeline complaining of a downturn in net industry friendliness. I must say this comes as a bit of a surprise because everyone I've encountered has been tip top. Perhaps I'm just naive, lucky or both. I'm a relentless optimist so I'm going for just plain old lucky. Lucky to have met and chatted with only the cream of the crop, to have somehow avoided the trolls and the boors that have afflicted others. So this is just a quick and heartfelt post to say thanks. Perhaps this would have been better-timed two weeks ago but hey, you live and learn.

I can't name everybody because it would take too long and I'd inevitably miss a few out, but you'll know who you are. If you're not sure, you're probably included anyway, so don't worry about it.

If I've met you or chatted with you in real life or online (even if it's just the odd tweet), if we've hung out, had drinks - thank you for being so friendly and open - I've probably made more friends in the last year than any other since I started at Uni. For someone who is naturally a bit shy that is a big thing. Let's not let a minority of idiots give us all a bad name.

If you've written articles or books, spoken, done podcasts, shared cool stuff you've made or just generally been a social media junkie - thank you for sharing your knowledge, your time and your passion. People like you are what attracted me to the industry in the first place, so please don't ever think your hard work isn't appreciated. Perhaps the silent majority need to speak up a bit more, which is part of my motivation for this post.

Conclusion

If you're doing positive things, keep doing them. Don't let what seems to be a relatively small number of people put you off. If you let them get to you, they've won and they'll keep on doing what they do, for whatever reason. Eventually we'll be left with nothing - a barren wasteland of negativity and loneliness, where once stood a verdant forest of shared experience and community spirit.

Image: Light Heart by Jonas Balil

Worry Less, Do More

Thu, 24 Nov 2011 02:59:05 +0000

A month ago, I attended the Web Developers Conference in Bristol. On Friday, I published my writeup of the conference. The sharp-minded amongst you will have already worked out that it took me just under a month to write a blog post - quite a long time!

Why did it take so long? Partly because of work and other commitments, but largely because I spent too much time worrying about it - what words to best get across my intended meaning, what stock images to give the post some visual spice, whether or not anyone cares what I think about the Pomodoro Technique - that kind of thing.

The same problem also manifested itself in other ways. For example, I'd sometimes want to chip into a discussion on Twitter but hold back because I didn't want to bug people, or felt that perhaps I'd be out of place butting into a conversation.

Worrying about Twitter sounds trivial, but what if you got offered a dream job and had to refuse because you were worries about whether you'd be good enough?

The problem

I think the root cause of all this is the way my brain works. I'm naturally inclined to analyse things in detail, see how they work and what they can do. I also care a lot about doing things "properly" - taking care of the details, smoothing off rough edges. These qualities make me a natural fit as a designer/developer and help me to produce work that I'm proud of - but they also have a dark side. What makes me produce my best work can also stop me from producing anything at all if I'm not convinced it's my absolute best.

Now, that may not sound so bad - after all nobody wants to produce substandard work. But would it really be so terrible if I pushed out my WDC post a bit quicker and didn't take so long choosing the right words? Would anyone have sat there reading it thinking "well, this is OK, but he could have used a better adjective to describe his dinner"? Probably (hopefully!) not.

On a larger scale, you might worry that you don't deserve that dream job, that you're not good enough and that the people who offered it to you have made a mistake. Perhaps you feel that your skills are not quite up to the right level, and that you won't be able to raise your game enough.

The solution

The solution to all this is simply to worry less. Actually, it's not simple at all, particularly if you're of a similar mindset to me and find it hard to break the habit of worrying.

Obviously, there are some "small" things that do need attention and we should absolutely continue to care about those. What those are depends on your particular vocation and values - for example a professional copywriter might really need to choose the right word to describe a dinner and likewise if I find myself pondering the virtues of one CSS technique over another, I consider that to be me doing my job properly.

One thing that is very important in this process is knowing where your boundaries are. There's a thin line between getting out of your comfort zone and getting totally out of your depth and getting into trouble.

A key ingredient in all this is knowing that you have a good support network to help you make decisions. In my example of the dream job, you could talk to people who have similar jobs, or similar areas of expertise. Say that new job needed a certain level of competence with PHP and you weren't sure you fit the bill - do you have a friend who is good with PHP, and could help you out? Are there local meetups where like-minded types get together so you could speak to people there and see what they think?

Find yourself, maaan

Another, more fundamental part is working out exactly what is important to you - where your true passions lie. Once you know what's important to you, it's much easier to identify what you can stop worrying about. This is often referred to as "finding your authentic self" - sounds a bit happy-clappy-self-helpy I know, but everyone you look up to, everyone who is successful in this world has at some point worked out what they truly wanted and gone for it, leaving anything unimportant by the wayside. A lot of them won't realise it, because they have done it intuitively, but they have all done it.

For me - I'm not hugely bothered about being thought of as a master of the English language - I'd rather be building and sharing cool stuff, meeting interesting people and visiting new places. So agonizing over a choice of words isn't getting me anywhere - I'd be far better off just getting my thoughts out there and things can always be clarified later.

With the dream job example - if you've worked out what's important to you, and you're not fussed about being the world's greatest PHP programmer but everything else in the job fits your aims exactly, then you can commit yourself to being "good enough" at PHP to do your job, and focus your energies on being awesome at the other aspects.

The upshot

If you can manage to worry less, you should find you are able to do more. All that time and energy you used to spend sweating the small stuff can be put to better use doing stuff that furthers your goals - for example writing more blog posts, learning something new, working on a side project or taking on new clients.

The really great thing about a "worry less, do more" approach is the more you do what you love, the better you'll get at it, and the more confident you'll feel. The more confident you feel, the less you'll worry! As so often in life, the first steps are the hardest. You may well still feel fear, but learning to control it rather than letting it control you will become one of your strongest assets.

I'm not saying that it's universally easy to adopt this approach - for some people there will be some very tough decisions to make - but it's something we can all do.

If everyone manages to worry a little less, and do a little more, who knows what we can achieve?

What do you think? Do you have any tips for how to let go of unnecessary worry? I'd love to hear your thoughts in the comments!

Main image by Yarik Mishin. Worry beads photo by Brian Jeffery Beggerly. Tie dye photo by Erin Calaway.

Web Developers Conference 2011

Fri, 18 Nov 2011 08:31:38 +0000

The 21st of October saw WDC - or the Web Developers Conference to give it its full title - make its fifth appearance on the geek social circuit.

It was my first time at WDC but the overwhelmingly positive feedback from the 2010 event had convinced me to part with my hard-earned this year - a decision that turned out to be absolutely correct as the event more than lived up to my expectations.

Pre-conference

The WDC pre-party was a pub quiz hosted by Ubelly. I thought a pub quiz was a great idea as it gives the night some structure without being too rigid. Since most of the people I knew who were going to WDC were only arriving on the day of the conference itself, I turned to trusty ol' Twitter to find myself a team, and ended up round the table with Mark, Matt, Dan and Keith as my teammates - all excellent company and further proof of my conviction that just getting stuck in is the best way to approach a situation where you don't really know anyone. In the end we got split into two teams with my half coming second-last and the others going on to take the win - typical! But wound-licking aside it was a very enjoyable evening and our host Luke made sure everyone got into the swing of things - there were a few sore heads around the breakfast table the next day!

The big event

After tea and croissants at the lovely Woodes cafe we headed over to the Odeon cinema which was our conference venue. It was a bit odd walking past all the Lion King 3D posters to go and talk tech but a cinema really is a natural venue for a conference - every seat has a good view of the screen and stage, the sound's good and the huge screen means no tired eyes at the end of the day from trying to read the slides.

While the conference's name implies that it is development-oriented, the talks on the day were actually very high level and applicable to most web professionals, developers or otherwise. I felt this was a good approach as getting too technical in such a setting would be very difficult to pull off effectively, whereas at WDC every single delegate could take some value from every single talk.

Neil Dennis

Confession time - I actually missed the very beginning of Neil's talk (sorry!) due to having to queue up to get into the venue - it seems like WDC suffered from a similar problem to New Adventures in that a lot of people turned up close to the start time and got held up in the registration process.

Anyway - Neil is the co-founder of an agency called Strawberrysoup, and he explained how he and his partner grew their business from two people to the current team of fourteen. Neil's talk was crammed full of excellent advice for people who are running small agencies or thinking of starting an agency. He gave tips on how to aid cashflow, how to successfully recruit employees and how to manage a team of people, as well as more general advice like not over-promising.

A great way to start off the conference!

Rob Hawkes

Next up was Rob, who works for Mozilla as a Technical Evangelist - posh talk for spreading the word about all the cool stuff we have to play with now! I have been a fan of Rob's work for some time so his was probably the talk I was most looking forward to, and he didn't disappoint. Titled "Tomorrow's Web", but more elegantly subtitled "Future technology is awesome", Rob used his talk to show us all the amazing new technologies that are emerging now and in the near future.

Starting with the now-familiar WebSockets, and the very cool-looking WebRTC, Rob proceeded to show off a whole raft of APIs that will give us as web developers a lot more flexibility. These APIs will allow us to send SMS messages, initiate phone calls, access hardware such as cameras and microphones and much more. Very exciting stuff! As well as the big-ticket items there are also a bunch of smaller but no less useful developments, including full-screen capabilities, incredible 3D graphic capabilities via WebGL and Flash-style mouse locking for improved user experience, particularly in a 3D context.

Rob's talk left me feeling seriously inspired - his enthusiasm is infectious and I think the whole room was excited by the possibilities of what Rob was showing.

Ben Bodien

Following Rob was Ben Bodien of Neutron Creations. Ben's talk was titled "How I Learned to Stop Panicking and Love my Job" and focused on sharing his techniques for dealing with the trials and tribulations of everyday life as a web developer.

Ben went over lots of tried-and-tested methods for better organizing workflow, with the overall objective being to minimize the time spent doing housekeeping and maximise the time spent doing the stuff we really enjoy - development. Tips included using microdeadlines to set small and manageable targets, making an effort to estimate the time taken for everything in order to get a better idea of what you can do and when, and narrowing your focus down to the current goal rather than worrying about everything all at once.

One thing Ben talked about that really resonated with me was the idea of the "excitement/boredom cycle" - essentially, at the start of a project it is all very new and exciting, but over time the novelty wears off and boredom sets in - eventually you will just be desperate to get the project finished so you can move on to something else. I'm sure pretty much all webby types will have experienced that at least once in their careers. Ben's solution is to do a post-project analysis and work out what about the project made you feel positive, and what about it made you feel negative, the idea being that if something is a recurring problem, you could well be the root! For example, if you find that scope creep always pushed you over deadlines and makes you feel frustrated, you need to look at how you deal with the demands of a client - it could be as simple as introducing a "change order" contract in which the client has to sign off any changes and their costs.

A great talk from Ben and I have just discovered that this was his first ever speaking gig, which makes it all the more impressive… great work Ben!

Elliott Kember

The last speaker before lunch was Elliott with "Things They Don't Tell You". Essentially this was Elliott sharing a whole bunch of tips and advice based on his experiences as a developer, covering all bases from the start of your career to building a personal brand.

While Elliott's talk would be most useful for students or people near the start of their web careers, a lot of the advice was the kind of always-relevant stuff that it's good to be reminded of once in a while. For example, making use of existing resources rather than reinventing the wheel - if you're building a web app that wants to add social-networking functionality to photo sharing, you'd be much better off building something on the Flickr API than trying to create a whole new user base from scratch.

One piece of advice Elliott gave that I can personally relate to was simply "SHIP IT" - to release projects as soon as you can rather than holding out forever until it's perfect. When I released the first version of my jQuery plugin Portamento, not all the functionality I wanted was present and there turned out to be a few bugs but the feedback I have had from it has helped to shape development on the latest versions. If I'd waited until everything was perfect, it still wouldn't be released!

Paul Annett

Paul is the design lead for the new single UK government website that is currently in development. For anyone who doesn't know, the government currently maintains a multitude of sites for different agencies and purposes which is costly and inefficient, not to mention a terrible user experience. Apparently the government could save £2.2bn if more people used the web to perform common tasks such as reporting lost passports or applying for child tax credits, so there's a lot riding on the success of the project!

Paul used his talk to show us some of the findings from the extensive user testing that was done on the alpha release of the new site. Most of us will never work on something so wide-reaching as this (the site would be used by practically everyone in the UK with a net connection at some point) so the information was very useful indeed.

Some of the findings were quite surprising - half of the people in the test didn't know what "e.g." meant - while others were less so - people trust Google for search, so if your search button has "powered by Google" or similar, they will trust it more.

Another finding was the fact that the majority of users will never see the homepage of the site - they will land on a specific page after doing a search - so the team treat Google as their homepage.

You can see the site that was being tested at alpha.gov.uk - on the basis of what Paul has shown I'm really looking forward to seeing the upcoming Beta and eventual production versions - anyone who has ever wrangled with the current system of government sites will surely feel the same.

John O'Nolan

The penultimate talk of the day was John O'Nolan's "Designing Emotion". John certainly grabbed the audience's attention with a brilliant opening sequence including but not limited to a skateboard-game-playing dog and very loud dubstep - an excellent way to beat the afternoon slump!

The crux of John's talk was that if we use our designs to create emotion, they are more likely to be successful. He talked about the psychology of decision-making and how emotions invariably lead to actions.

A good example of this is Ryanair. Their website is awful, but the awfulness actually translates to better returns for them. Everyone knows Ryanair are cheap, so a classy website wouldn't work. Instead, the awful site reinforces your perception of Ryanair as cheap, and next time you are looking for a cheap flight you will go straight to the Ryanair site - it's so bad you remember it. It's better to be remembered negatively than to be forgotten in the world of emotional design.

Counterintuitively, customer complaints are a good thing - if people care enough to complain, you have succeeded in creating an emotion. Apparently, some companies deliberately fail on certain customer orders, so that customer can then receive an excellent support experience and turn a negative emotion towards the order into a positive one.

The other side of the coin is that if people love your product, you can turn that love into profit. A really good example of this is FreeAgent, whose referral scheme gives both parties a discount if one refers the other with a special link. If you manage to refer ten people to FreeAgent you get your service for free - but FreeAgent has gained ten paying customers. The really elegant thing about this in my opinion is that the emotional response to a discount is self-reinforcing - you get a discount, you feel happy about it so you tell more people, you get more discount and so on. Eventually, FreeAgent end up paying you to promote them!

I found John's talk fascinating and will definitely be applying some of the theory he discussed to my future work.

Paul Boag

Concluding the main event was Paul Boag - a seasoned speaker and prolific writer, podcaster, video blogger, you name it. Paul's talk was another that turned the focus inward and discussed ways in which we can better ourselves both professionally and personally.

Paul broke his talk down into sections that dealt with the different problems we might face in our careers - from getting work in, to dealing with clients, to having too much work!

One thing Paul talked about that I found really interesting was the Pomodoro Technique - basically, you work hard for 25 minutes, then have a five-minute break, with a longer break every four Pomodoros (or two hours in the real world) - rinse and repeat until hometime.The idea is that it stops you from sitting there staring at the screen for hours on end and then needing a hefty break to let your eyes and brain rest. A simple concept but apparently it really helps you to focus and increases your productivity - worth a try. And before you ask - yes, there's an app for that.

As well as the little specific hints and tips Paul also provided some more generalised advice - like remembering that the web industry is a service industry, so we should keep that in mind when dealing with clients; or making sure that you get away from the screen at some point in the day to do some exercise.

Overall, a perfect ending to the day!

Post-conference

After a bite to eat in the lovely harbourside area, we descended on the Pitcher & Piano for the traditional afterparty. The place is massive, and the WDC contingent took up a large part of the top floor, all brandishing our conference passes in order to take advantage of the free beer and wine that was generously laid on by conference organiser Alex.

Highlights of the night included watching Paul Annett baffling everyone with his magic tricks, John O'Nolan's frankly less-impressive attempts to copy them and Elliott Kember stood at the bar using his Shaken app to order some weird and wonderful drinks - not for the faint-hearted!

All good things must come to an end however and eventually the pub staff managed to persuade us all to leave, despite the best efforts of few to convince them to let us stay longer! An excellent evening in good company - anyone who attends a conference but misses out on the afterparty is really only getting half the experience in my opinion.

The dust settles…

When all's said and done, WDC was a huge success - affordable, productive and very enjoyable. I'll definitely be making the effort to go to the next one, and you should too! Even if you're not 100% convinced, at just £35 it's a snip and well worth taking the risk.

Credits: Tea photo by Matteo Canessa. Strawberries photo by michaelaw. Soviet milita photo by Bartlomiej Stroinski. Crying boy photo by April Mitts. Tomato photo by Paweł Zawistowski. Cold Martini photo by Christy Thompson.

Points Brighton

Tue, 18 Oct 2011 09:43:20 +0100

At a Croydon Creatives meet a while back, Mike piped up and said he had an idea he wanted to share. That idea was Points, an "informal evening of digital discussions", and became real on Thursday with the first event at Brighton Media Centre.

This event was special for me as not only was it the fruition of a friend's labour but it also became my first experience as a speaker! Due to a late drop-out, myself and Ant raced against the clock to prepare a ten-minute talk each so we could plug the gap.

With little time to prepare, I was worried about making sure I pitched the level of my talk right. I didn't want to be too technical and scare people, but I also didn't want to be too high-level and risk not giving people something useful to take away. I settled on the topic of frameworks and decided to give a very brief introduction - Frameworks 101.

In the morning I grabbed a copy of Keynote and hastily prepared some basic slides. It's a testament to how usable Keynote is that I was able to pick it up within about 10 minutes of downloading it - great value for fifteen quid if you ever need to create a presentation.

So that afternoon, with a mixture of excitement and trepidation, we hit the road and were soon in Brighton settling down with a drink and listening to the first speaker of the night, Paul Adam Davis:

Paul Adam Davis

Paul kicked off the night with some helpful WordPress hints - he hates plugins and would rather not use them, so he showed us all a few ways you can avoid them. Paul's a deserved nominee for the .net Young Developer of the Year award so anyone working with WordPress would be wise to listen to him.

Paul also gave a beginner's guide to LESS, a super-useful piece of JavaScript that takes care of a lot of the heavy lifting of writing CSS. If you haven't checked it out yet it's well worth it.

You can watch the video of Paul's talk on Vimeo and check out his slides on SpeakerDeck.

Alex Sexton

Next up was Alex, who gave a talk on finding design inspiration from the outside world. Using examples from nature and human creation, he summed up the concept of the Golden Ratio and then showed its application in design.

Did you know that a single number links a sea shell, the Vitruvian Man, Marlborough House and the Twitter web interface? That number is Phi, or approximately 1.61803398874989.

Alex's talk was a good reminder that we should be looking outside the box for design inspiration, rather than relying on CSS galleries and the like - something we all get sucked into every now and then.

Little Ol' Me

A quick drinks break gave me time to make a couple of last-minute changes to my slides, and then it was my turn. I was feeling a bit nervous but the friendly atmosphere was encouraging and I was fairly confident that I knew what I was talking about, so with a deep breath I jumped in.

In honesty, I can't really remember much of my actual talk. My mind was racing and it felt like I was talking really fast. For the most part I didn't need to look at my speaker notes (displayed on my phone thanks to the super-handy Keynote Remote app) - I did miss a few points but I think I got across most of what I wanted to say.

My ten-minute slot went very quickly and based on a few comments from people it seems I managed to pitch my talk about right - phew!

To view my video and slides, check the blog post "Talk: Frameworks 101".

Anthony Killeen

After another drinks break and a hilarious raffle (you had to be there), it was time for Ant to close the night with his talk on the importance of local meetups - a very relevant talk given the setting!

Ant didn't bother with slides, opting to have just an introductory image and talk freeform instead. I thought this worked really well as it meant Ant could talk very naturally, rather than having to remember to advance his slides all the time.

The main crux of Ant's talk was that you can often get a lot discussion done face-to-face than over Twitter or via blog posts - hear hear!

You can watch Ant's talk on Vimeo and also read his write-up of the evening.

Summing Up

The inaugural Points event turned out to be a very enjoyable one. I managed to talk with some new people as well as chew the fat with the sizeable bunch of familiar faces. The attendees seemed to be a healthy mix of people from all sides of the web profession so an excellent networking opportunity to be had as well as just listening to the speakers.

Mike's already talking about putting on more events, so keep an eye out - if you like the web, lively discussions and a friendly vibe, you will love Points.

Photos by Anthony Killeen & Simon Cox

Simian Studios Blog

12412 January - Responsive Web Design

What is it?

How to do it?

First steps

Delving deeper

It's that easy?

How can I learn more?

Start now!

Conclusions

New Adventures In Web Design 2012

Anticipation

The day

Dan Mall

Naomi Atkinson

Travis Schmeisser

Robbie Manson

Trent Walton

Cameron Koczon

Denise Jacobs

Frank Chimero

Winding down

All in all

Colour Picker Bug Workaround for Adobe Fireworks CS4 in OS X Lion

The workaround

Or…

Smile CSV Scraper for FreeAgent and Xero

No more!

The bookmarklet

How to use it

More info

Credits & licensing

Looking Back, Looking Forward

Looking back

Looking forward

Consume less

Share more

Read more

Experiment more

Let's go!

Save Time with Super-Quick Local Test Cases

Quicker! Easier!

The Test Domain

The Wrapper

A warning…

The Rewrite

The Regex

Creating a test case

Conclusion

Thank You

Conclusion

Worry Less, Do More

The problem

The solution

Find yourself, maaan

The upshot

Web Developers Conference 2011

Pre-conference

The big event

Neil Dennis

Rob Hawkes

Ben Bodien

Elliott Kember

Paul Annett

John O'Nolan

Paul Boag

Post-conference

The dust settles…

Points Brighton

Paul Adam Davis

Alex Sexton

Little Ol' Me

Anthony Killeen

Summing Up