What am I meant to listen to now?

Although the Boagworld podcast will return with a new format in 6 months, the question still remains – what are you mean’t to listen to now?

As you will have gathered we are taking a break from the Boagworld Podcast after 5 years of recording.

You guys have been so incredibly supportive about this decision. Many of you have expressed your sadness about the show ending, but equally understandd our desire to do something new.

However, Mike from New Zealand asked a very pertinent question…

What am I meant to listen to now?

Somehow this seemed a fitting question for the last listener segment of the show. So here is my answer…

We will still be putting out audio

Although we will not be publishing a regular show over the next few months, we will still be releasing the occasional piece of audio. In particular I am intending to produce the odd interview and release audio from some of my presentations.

Because these will not be ‘full shows’ I won’t be releasing them as part of the main boagworld podcast feed. Instead they will appear on the Bitesize feed, so if you aren’t already subscribed then now would be a good time.

or subscribe via iTunes.

Boagworld Audioboo

Also don’t forget the daily Audioboo’s I record where I give short audio tips on running a successful website.

Other web design podcasts

Obviously nothing is going to match the professionalism, entertainment and pure polish of the Boagworld podcast ;-) but there are actually quite a few web design shows out there.

In fact there are so many now that I cannot mention them all. We have come along way over the past 5 years. There was none when I started Boagworld.

Although I cannot mention them all I will highlight the ones I personally listen to…

The Big Web Show

This relatively new show is fronted by Jeffrey Zeldman and is shaping up to the a good one. Most episodes run to about 50 minutes and consist of an informal discussion with various ‘web celebs’.

The Big Web Show

Think Vitamin Radio

Produced by the guys at Carsonified this show feels more like a glimpse behind the scenes of their business. Hosted by Ryan Carson, Keir Whitaker and Mike Kus it focuses mainly on web design news and lasts about 30 minutes.

Think Vitamin Radio

Sitepoint

Recorded by various people from the Sitepoint.com community this show is essentially a round table discussion of web related topics and news. Shows tend to run at about one hour long and probably are the closest in style to Boagworld.

SitePoint Podcast

Spoolcast

Spoolcast is produced by Brian Christiansen and Jared Spool. This long running show focuses largely on usability and primarily seems to feature excerpts from various events run by User Interface Engineering. Because the show mainly consists of presentations most run for about 30-40 minutes.

SpoolCast

There are also loads of video podcasts which are worth mentioning. However, video cannot replace audio when it comes to commuting, walking the dog or going to the gym. Bearing in mind we are looking to replace boagworld I will leave the video shows for another time.

But if we are looking for audio education we do not need to limit ourselves to podcasts.

Audiobooks

I have become a massive fan of audiobooks. Rarely do I have time to sit and read a book, but there are always opportunities to listen to one. Whether mowing the lawn, driving to work or even doing the ironing, audiobooks are a great way of making mundane tasks more interesting and educational.

Although there are not many web design related audiobooks, there are some related titles which will help broaden your knowledge. What follows are a random selection of my personal favourites…

Made to Stick

Why do some ideas thrive while others die? And how do we improve the chances of worthy ideas? In Made to Stick, accomplished educators and idea collectors Chip and Dan Heath tackle head-on these vexing questions.

A perfect book for website owners and web designers who are striving to make their websites more engaging and to communicate better with users.

made to stick book cover

Crush it!

Do you have a hobby you wish you could indulge in all day? An obsession that keeps you up at night? Now is the perfect time to take that passion and make a living doing what you love. In Crush It! Gary Vaynerchuk shows you how to use the power of the Internet to turn your real interests into real businesses.

Because Gary narrates this audiobook himself, it bristles with energy and enthusiasm. If you want a crash course in how to make the web work as a marketing and business tool then this is a great place to start.

Crush It book cover

Nudge

Thaler and Sunstein show that by knowing how people think, we can design choice environments that make it easier for people to choose what is best for themselves, their families, and their society.

This superb book is so applicable to us as web designers. It shows us how to guide users through a website by nudging them in the right direction. I have learnt so much from this book and it has changed the way I design and run websites.

Nudge Book Cover

The Tipping Point

Like the best social dynamics professor you never had, Malcolm Gladwell deconstructs a wide range of phenomena (from the reduction of crime in New York to the rise of Sesame Street) to deliver a fascinating understanding of how “social epidemics” spread.

All of Malcolm Gladwell’s books are well worth a read but the Tipping Point is the most appropriate to us as website owners and designers. If you are looking to build brand online or spread the word about a project you are working on, then The Tipping Point is a ‘must read’.

The Tipping Point Book Cover

Conferences

Finally I wanted to mention conference talks. The majority of web design conferences now release audio versions of their presentations.

Although this is an amazing educational resources for any web designer or website owner, it does come with two inherent problems…

  • It can often be hard to find out who is releasing what. This means it is easy to miss incredibly valuable and free content.
  • A lot of these conferences stagger the release of their talks and fail to provide an RSS feed you can subscribe to in itunes or your podcatcher of choice.

Fortunately Jeremy Keith has solved these problems with his amazing Huffduffer app.

Huffduffer

Huffduffer provides a bookmarklet that can be used on any page with an audio file. The bookmarklet grabs the audio and add it to your own custom RSS feed.

You can subscribe to this RSS feed in iTunes and hey presto you have your own custom podcast made up of any random audio you find on the web.

However even better is the fact that HuffDuffer recommends content. It shows the most popular content and content from those who share a similar interest. It truly is a superb application and perfect for tracking down and listening to conference material.

But don’t forget us

Of course, all of this is only a stop gap measure! We will be back with something new and exciting very soon. We just want to experiment with some ideas before we do.

189. How to keep up with web innovations

On this week’s show: Paul looks at keeping up with web innovations, Marcus shares how we make the podcast and Nora Brown reviews building findable websites.

Play

Download this show.

Launch our podcast player

News

Web design match making

Finding a web designer can be tough. Equally, if you are a web designer (especially if you are just starting out) finding clients can be hard. Much like in love, finding the perfect partnership is difficult.

37 Signals feel they have the answer. To accompany their already successful jobs board, they have now launched Haystack.

Haystack, allows web designers to upload a brief description of their agency for free or a more detailed portfolio for $99 per month.

Clients can then browse this directory in attempt to find the perfect agency.

And there in lies the problem. Although Haystack is beautifully designed it is actually incredibly limited from a clients perspective. They are only given three choices.

  • Search through hundreds of listings manually
  • Filter by city
  • Filter by budget

These filters are both extremely limited and are not enough for narrowing down such a large number of designers.

Haystack.com

Filter by city allows you to select from a handful of US cities, while dumping all other locations into a catch all of ‘other cities.’ This might possibly be acceptable if there was an option to search by country, region or city. Unfortunately there is not.

Filter by budget is equally flawed. As a web designer you have to select a price range that you normally work within. This effectively excludes you from smaller or larger projects. In reality things are rarely that black and white.

Finally I would argue that there are many other characteristics clients look for in an agency. There are no options to filter by technology, skill set or sector experience. The tools available are simply too blunt for making an effective decision.

My guess is that 37 Signals have been caught off guard by the instant popularity of the app. The current application has been built with a small number of agencies in mind. In such circumstances it would be perfectly adequate.

I am sure that they are already working on upgrades to the app which will handle the large number of agencies much more elegantly. These guys do good work and there is no doubt that an app like this is much needed.

Client relations

There seems to be a lot of posts around this week looking at the working relationship between clients and web designers.

There is a sitepoint post that focuses on fine tuning your persuasive techniques, a smashing magazine post on dealing with difficult characters and A List Apart post on when to walk away. There is even an article teaching us how to deal with things like scope creep and unhelpful design feedback.

Although it is good to see posts tackling client management, I do fear they all have a negative tone.

Last friday I ran a workshop on client relationships and although we discussed dealing with problematic relationships, I tried to make the overall theme a positive one.

Too many web designers go into new projects seeing the client as either the enemy or as a hinderance to the projects success. Articles like those I have mentioned are in danger of reinforcing this viewpoint.

It is important to remember that our clients are extremely knowledgeable in their own fields and that both designer and client wants the same thing – a successful website.

I also worry that too many web designers are perceived as negative. Instead we need to be positive and stop saying no to our clients.

Myths of usability testing

Two posts have been published recently that challenge some of our preconceptions about usability testing.

The first is a post by A List Apart entitled “The Myth of Usability Testing” and is a response to some fairly shocking research.

The research monitored a number of usability tests run by different agencies on the same site. The result was that although all of the agencies found many problems, only 30% of those problems were common to more than one agency. In other words the agencies could not agree on where the problems lay.

The article goes on to examine the discrepancy focusing in particular on the questions asked and the people tested. It also explains that context is vital to the interpretation of results.

The second post is one that challenges the role of eye tracking. The post looks at the pros and cons of the approach and in my opinion is a balanced assessment.

The post ends with the following conclusions:

Some have concluded that the benefits of eyetracking are not worth the high cost, effort, and complexity it adds to usability testing. On the other hand, some eyetracking vendors and consultants have promoted the idea that you cannot conduct usability testing effectively without eyetracking.

The truth lies somewhere between these extremes. If you know how to use eyetracking effectively, it can provide additional insights to usability testing that can help you find problems and answer questions about user behavior. Eyetracking is not essential to usability testing, but if you can afford it and have the time to learn how to use it effectively, it is definitely worth it.

Personally, we have never recommended eye tracking to our clients and this post has done nothing to persuade me to start. For the type of clients we work for the expenditure is hard to justify.

jQuery for designers

I am a huge fan of jQuery. I have said this more than once in the past. The thing I love most about jQuery is that it is aimed squarely at designers. If you can understand HTML and CSS, then you can wrap your head around jQuery. What is more, it lets you do some really cool things very easily.

Imagine my delight when this week I discovered jQuery For Designers. Apparently the site has been around for a while but I seem to have missed it entirely. In case you have missed it too I thought I would give it a quick mention.

The site contains dozens of screencasts and examples of various cool functionality that can be built with jQuery. Just some of the tutorials include:

  • Tabs
  • Slider galleries
  • Carousels
  • iPhone sliding headings
  • Fixing floating elements

Best of all, you can subscribe to these screencasts on itunes enabling you to view them as a podcast.


This is just one of the many excellent tutorials on jQuery for Designers.

Back to top

Feature: 10 secrets to staying informed about web design

Keeping up in the world of web design is tough. Things move fast and its hard to stay informed. In this post I share 10 ways that RSS can come to the rescue.

Read 10 secrets to staying informed about web design

Back to top

Ad: Win a Macbook Pro or iPod Touch

Webvanta are running a superb contest that I wanted to quickly mention.

There is an opportunity to win a Macbook Pro or one of three iPod Touch.

To be in with a chance of winning, you need to build a great looking, effective website on the Webvanta CMS.

Don’t worry if you are not an existing Webvanta user. They are going to give you a Webvanta premium account for the duration of the contest.

The panel of judges (that includes our own Ryan Taylor) will pick a winner on the 1st February so get designing.

For more details on how to enter visit Webvanta.com/Contest.

Back to top

Listeners feedback:

Recording the podcast

I had the following tweet from @david_o_connell:

@marcus67 could you guys do a spot on the tech setup for recording the podcast please (didn’t ask Paul as he muffs the audio :) )

Thinking about this I realised that I have never covered this riveting subject so after nearly 200 shows it was probably about time!

It’s worth noting that we are set up to record and edit things as quickly as possible. We have recorded a weekly show for years so we have to get it down and get it out the door. I’m sure there are other ways of doing things and I expect my history of working in expensive recording studios potentially means that I overcomplicate things… but, this is how I do it.

Hardware

Ok, this is a list of all the stuff we use:

  • AKG C 2000B microphone (x3) – these are ‘mid’ quality mics that need phantom powering. ‘Decent’ quality mics are a must otherwise you will end up with a thin and probably noisy result. Built-in laptop mics are a total no-no!
  • Angled mic stand (x2) – these are recent addition that mean we can comfortably use our laptops while recording the show.
  • Straight mic stand – we use this for any guests we have on the show.
    Pop shield (x3) – again, a recent addition to the setup. Vital in avoiding pops and bangs on words that begin with ‘p’ or ‘b’.
  • XLR to XLR (balanced) mic leads (x3)
  • Behringer mixing desk – our mixing desk has 4 ‘proper’ mic channels and 4 stereo channels, 2 sub groups and phantom powering to power the mics. On a standard show, I take a feed from sub the group outputs to the input on the Mac. When we’re recording a live show things are little more complex as we need to get the audio to two places at the same time (my Mac recording the show and Paul’s that is broadcasting live). I also need to hear the audio from the intro videos so we’re taking an out from Paul’s Mac for the videos and a feed from the desk master outs to his line input… you need to see it really!
  • Technics closed-ear headphones – these are my ‘old faithfuls’ that I have used for years. It is imperative that one person monitors voice levels throughout the recording. I plug them into the headphone input on my Mac. Closed ear are best because they do not ‘spill’ into the mic.

I don’t use any external compressors or limiters. That gets taken care of in the software.

Software

In my current setup I use Logic Pro to record all of the audio. This is a bit over the top for podcast recording but I also use it to record music and it does both jobs beautifully.
For the voice tracks I use the setting Voice > Speech > Male Radio that adds a compressor, de-esser (to stop sibilance) and EQ.

However, if you’ve got a Mac then Garageband will do the job admirably. It even has ‘podcast’ settings that you can assign prior to recording.

Back in my PC days I used to use Sony Soundforge to record the audio tracks which I would then edit together using Propaganda. I still use Soundforge to bounce down to MP3 (Logic is unreliable at this).

Recording tips

Here’s a bunch of tips to :

  • As I’ve already mentioned, use headphones while recording the show to avoid anyone going ‘off mic’. Usually, pointing at them, then their mic gets the message home!
  • When recording 2 people pan the input channels hard left and hard right. This means that if you have to boost any part of a recording it’s easy to locate the specific part. The absolute ideal here would be to have some sort of multi-input box into the computer thereby allowing multitrack recording i.e. I am recorded onto one track while Paul is recorded on to another simultaneously. Thinking about it, I could probably do this right now (for max 2 channels) by separating the inputs and recording 2 mono channels instead of one stereo. But, to be honest, it’s really not worth doing as, mentioned earlier, time is of the essence.
  • Record a quick levels test prior to any recording (because you really don’t want to have to go back in and fiddle with the levels afterwards unless you absolutely have to).
  • Record each section of the podcast on a separate track. Don’t do one long recording as this is much harder to edit later and add in music and audio dividers. If you record each section separately then you should only have to top and tail it which takes no time at all.
  • Once all the voice recording is done, I will add in the intro and outro music, the section dividers and any interviews or questions that are part of the show.
  • Once I’m happy with result, I bounce to Wav format which I then open in Soundforge and save out as 64Kbps 44.1 kHz mono MP3 format which is tagged and FTP’d to our hosts.

Here’s a screenshot of a final ‘mix’ in Logic before the bounce down (v zoomed out).

Screenshot of a final ‘mix’ in Logic before the bounce down

Building Findable Websites

My name is Nora Brown; I’m a freelance web designer in Boston.

I’d like to give you and Boagworld listeners a recommendation for a book I recently read, called “Building Findable Websites”, by Aarron Walter. Though I finished reading it a month or so ago, I find I’ve been referring back to it constantly ever since.

Building Findable Websites: Web Standards, SEO, and Beyond

In this book, Aarron Walter views SEO as just one aspect of, and in some ways almost a side effect of, improving a website’s “findability” — which is defined on page 2 as:

“The quality of being located or navigated, the degree to which an object or piece of data can be located, and the degree to which a system supports navigation and retrieval.”

The goals of findability are listed as:

  1. Help people find your website.
  2. Help people find what they are looking for once they arrive at your site.
  3. Bring your audience back to your website.

Notice there is no mention of Google or any other search engine, because obviously the ultimate goal is to help *people* find and use your website, not search bots.

To that end, Walter provides straightforward advice for improving findability at all levels of site development:

  • Front-end markup strategies
  • Server-side strategies
  • Content generation

Though not every technique will be right for every site, as someone who builds small business and portfolio websites, I found the majority of the recommendations to be practical and implementable. Furthermore, nothing in the book represents SEO for SEO’s sake — all the techniques have other benefits, primarily improving the user experience.

Aarron Walter manages to fit an amazing amount of useful, actionable information into this slim volume, but if it’s not enough, there are even five bonus chapters which you can download for free at buildingfindablewebsites.com.

I hope you and your listeners take a look at this excellent book.

I also think the author Aarron Wlater would make a great candidate for a Boagworld interview.

Thanks and keep up the wonderful podcast.

Back to top

161. In or Out

On this week’s show: Paul announces Micro-Boagworld, we discuss the pros and cons of outsourcing web work and see what recommendation the Boagworld forum has to offer.

Play

Download this show.

Launch our podcast player

Housekeeping

For a while I have been toying with the idea of doing a Micro-podcast that works in a similar way to Twitter but with audio. It would provide the opportunity to share hits, tricks and reviews too short for the main show. My problem was that I needed an application which made this as easy as posting a tweet. Anything more and it would prove too demanding.

Fortunately a new iPhone application has launched that does exactly that. Called AudioBoo it allows you to record 3 minute audio snippets that then get posted to a website, twitter, facebook and a podcast feed.

I am therefore pleased to announce Micro-Boagworld…

View Micro-Boagworld posts here

Subscribe to the RSS feed here

Boagworld AudioBoo Homepage

Back to top

News

Pricing and projects

Alyssa Gregory has written two good posts this week both relating to the pricing of web projects.

The first post tackles the notoriously difficult subject of How To Estimate Time For A Project. After all, time is money.

Estimating how long a project will take is tricky and although this post doesn’t provide any magic formulas it does provide good solid advice.

As well as considering the obvious deliverables Alyssa also recommends time for project management, reviewing work, debugging and client turn around. Finally, she recommends adding a buffer for the unexpected.

Of course, she doesn’t discuss how all of this time translates into your final price. How much you charge is a matter of conjecture. However, in a second post she does explore a related subject – How To Raise Your Rates.

In this post, she handles the sensitive subject of how to tell a client that you will be raising your rates for future projects. She suggests five techniques you should employ…

  • Give Notice
  • Set a schedule (make increases annual for example)
  • Make it fair (keep the increments small and manageable by the client)
  • Send it in writing
  • Balance it out (Balance your increase with an incentive – e.g. a special, a one-time discount)

Its all good advice and important too. As your skills and experience increase, you will need to ensure your rates reflect that. Knowing how to hand those rate increases is vital if you want to keep your clients happy.

IE8 and IE6

Microsoft have announced that IE8 will be released via the Windows Automatic Update starting on the third week of April.

The final version of the browser has been available since March and yet adoption has been sluggish. Hopefully Automatic update will change this trend significantly. However, it does not guarantee universal adoption. Although the update will be marked as important users will not be forced to upgrade. In fact Microsoft has released a blocker toolkit so corporate users can avoid the update entirely.

Worst of all, it is likely that the update will impact the numbers using IE7 more than IE6. IE6 users tend to be hold outs and are unlikely to upgrade now when they did not upgrade to IE7.

The only hope is that many IT departments have a policy of running a version behind the current release. If that is the case, the arrival of IE8 may encourage some of them to adopt IE7.

The entire web design community is keen to reduce its level of support for IE6 and hopefully this update will allow that. In fact, another post this week entitled – 10 Cool Things We’ll Be Able To Do Once IE6 Is Dead – points out just what a wonderful world it would be.

Once IE6 is gone we will be able to…

  • Use child selectors
  • Make full use of 24-bit PNGs
  • Use attribute selectors
  • Use a wider range of display properties
  • Use min-width and max-width
  • Throw away 90% of CSS hacks (and 90% of the reasons for needing them!)
  • Add abbreviations that everyone can see
  • Trust z-index again
  • Save time and money
  • Enjoy ourselves again!

Simple and impressive design techniques

Last week I was doing a consultancy clinic with a developer who wanted advice on designing his website. He was a great coder but did not have much experience designing.

Although I recommended The Principles of Beautiful Web Design by Jason Beaird it would have been great to point him at the latest Smashing Magazine post – 10 Simple and Impressive Design Techniques.

This post has some easy to implement techniques that are ideal for developers trying to improve their design skills. Techniques include…

  • Adding Contrast
  • Using Gradients
  • A Better Use of Colour
  • Improved Letter Spacing
  • Changing Case
  • Use of Anti-Aliasing
  • Adding Imperfections
  • Implementing blurring
  • Careful Alignment
  • Trimming the Fat

Read the whole articles for more details and great examples of these techniques in action.

Influencing user behaviour

A big part of good design is guiding the user to complete the actions you want. Influencing user behaviour can be achieved through a variety of techniques. However, it can often be hard to know where to begin.

One resource that might help you influence user behaviour is The Design with Intent Toolkit. This is essentially a printable ‘cheat sheet’ that suggests a variety of techniques you can apply to your projects.

The techniques do not just apply to web design but all aspects of design. Consequently not all of the techniques will apply. However a lot do, ranging from the use of metaphors to setting up good default options.

Some of the techniques contained in this cheat sheet are also beautifully demonstrated in another post I wanted to mention. Entitled 12 Excellent Examples of "Lazy Registration" it addresses the problem of user signup.

Essentially it is a post that showcases methods for getting around the problem of user registration. As the post itself says…

Signup forms have long irked the casual visitor. During the process of discovery, nobody wants to stop and fill out details before they can "unlock" the rest of the site’s potential.

It has certainly been my experience that signup forms are a barrier and so it is interesting to see how different web applications have overcome the problem.

Back to top

Feature: When to outsource web work

Your in charge of your organisations website. It has become moderately successful and now you have a decision. Do you hire a full time web designer or outsource to a web design agency?

Read the full article

Back to top

Listeners feedback:

In this week’s listener feedback section we look at a series of recommendations from the Boagworld forum…

A good introduction to Javascript

Jake writes: I’m curious as to whether or not anyone on the forum has strong opinions on a good introductory javascript book? And by introductory I mean something that’s more about initial learning steps such as syntax, etc. and then talks about best practices.

Doug answers: You might want to look at one of the books out for coding in jQuery, if you’re planning on going in that direction anyway. As for how to learn javascript I usually push people towards Lynda.com.

Matt also replies: Awesome book – DOM Scripting – I’d start with this before jQuery as I think you need some javascript knowledge to use jQuery to its fullest.

A good but free survey tool

Simon asks: I want to create some simple(ish) survey’s to get clients to fill out after a training session. I know of some paid for solutions, but does anyone have any suggestions for any free tools?

Laura replies: For something short, I’d use the survey function on PollDaddy. You can get up to 100 responses, and I think ten questions. Ten isn’t many, but you can do conditional branching for free, which is rare, and good.

I’ve also used SurveyMonkey before, it’s clean and simple.

A review of Clicktales

Peter shares his experiences of Clicktales…

On the recommendation of Paul, I tired out ClickTales.com; and I have to say the results have been interesting (sad, in my personal case) to say the least.

For those of you not in "the know", or missed episode 141, ClickTales is an app that lets you record and review the actions of your website’s visitors. And I’d agree with Paul: inexpensive, revealing, but limited in essence because you can witness what a user goes through.

In my case it was most effective because my results have been telling me that I should redesign my website’s structure completely… so I decided I should start from scratch all together and redesign. :)

Web Design for ROI

Bill reviews Web Design for ROI by Lance Loveday & Sandra Niehaus…

Each year I find one or two books that really stand out. This book, Web Design for ROI, changed the way I look at current eCommerce projects and helped me identify better strategies for building web sites.

Rich adds: I agree this is an excellent book.

Not too much new for a seasoned pro like myself, but I did still learn a fair bit and I’d recommend it to anyone with an interest in websites that make money.

Pro Paypal e-commerce

Finally, Ian shares an extensive review of the book ‘Pro Paypal e-commerce‘. Ian writes a very thorough review but here are a couple of highlights.

I thought this was a great read. It’s not often you finish a book and feel confident you have all the information you’re going to need to complete your project. The book isn’t just technical but also has lots of useful nuggets on business practices and background on payment systems in general for those that are unfamiliar with them at this level.

I feel confident in recommending this book to anyone who is involved with developing E-commerce systems or is going to be in the future. The author Damon Williams has a very readable style that is mercifully faux-humour free but never dull and explains everything clearly and concisely and despite its relatively low page count at 260 pages or so, still manages to cover a lot of ground without ever feeling as if it’s being too terse.

For more reviews about everything from web design books to software visit the Boagworld forum. We are also going to do some cool new stuff on the forum over the coming weeks. Keep an eye on it. We have already added a Jobs category for those of you who are looking to hire a web designer, so be sure to check that out.

Back to top

 

160. Education, Education, Education

On this week’s show: We speak to Aarron Walter about teaching web standards. Ryan Carson starts a series on web applications and Paul talks about remote user testing.

Play

Download this show.

Launch our podcast player

Housekeeping

A couple of quick pieces of housekeeping to kick off with…

  • Huge thanks to Ryan Taylor, Paul Stanton and Sarah Parmenter who did a stellar job standing in for myself and Marcus on last week’s show. They were actually far too good and I have already started receiving requests that they become the permanent hosts! Anyway, if you didn’t hear last week’s show then make a point of downloading it.
  • My second piece of housekeeping is a quick plug for Bamboo Juice, a grass roots conference taking place in Cornwall on the 24th April. Myself and Jeremy Keith are just two of the speakers in what will be a packed day. It’s so good to see smaller conferences like this springing up outside of London and so I would encourage as many of you as possible to attend. Best of all its only £99 (£79 for Boagworld listeners!)

News

To be honest, what with SXSW and my week’s holiday I am feeling completely out of touch with the web design world. Fortunately, Mr Stanton is continually updating our twitter feed with juicy stories. I have therefore picked 4 that caught my eye.

How to create a great web design CV

Poor old Smashing Magazine. People do like to tease them (myself included), but they write some damn useful articles. A recent example that caught my eye was ‘How To Create A Great Web Design CV and Resume?‘.

This post is essentially two articles in one. It starts by asking 10 designers to design a hypothetical CV for a fictional individual. Each designer writes a short paragraph about their chosen approach and you get to look at some nice examples.

The second part of the post provides 10 useful tips for creating a great CV. Suggestions include…

  • Make it printable
  • Have a summary
  • Link to online projects
  • Show your personality
  • Keep it simple and understandable

For the complete list of tips read the whole post.

Its a good post, but I am not sure whether producing a ‘designed CV’ is entirely necessary for web designers. If I was hiring a print designer then I would expect a CV to look impressive. However, if I am recruiting a web designer I think I would be just as happy receiving a cleanly designed CV that links to a stunning portfolio website.

There are a lot of differences between designing for the web and print. It is possible to be good at one and not the other. Therefore, a printed CV doesn’t tell me much about a persons capability as a web designer. That said, a well designed CV isn’t going to hurt your cause!

Design: Make it Memorable

One tip that could have gone in the Smashing Magazine article, is to make your CV ‘memorable’ and not just ‘flashy’. This picks up on the theme of a post over at 37 Signals entitled Designers: Make it Memorable.

The post talks about the difference between making something visually appealing and actually memorable. Too many sites are impressive but fail to leave a lasting impression. At one point in the post the author writes…

I started to recall those amazing Flash Sites of the Day. You know those sites that get passed around via IM in your office on a slow day? Simply amazing design and programming. Problem is: I can’t for the life of me remember what those URLs were much less the company/product that was being featured! Isn’t that the point with those sites? That the impact should be profound so that you remember Product or Company X?

This is a lesson that all those involved in the web design process need to learn. Whether we are designers or website owners, we have a tendency towards thing that provide the wow factor. However, often it is the thing that makes us go wow we remember rather than the message being communicated.

Statistics and website owners

Our next article of the week is an ‘all too brief’ post on web stats entitled How to Sell Statistics to Clients.

The post focuses on a common problem – most website owners know they should be tracking website statistics, but don’t really know what they are looking for. In fact the author writes…

In my experience, the loudness or frequency of a person’s request for web statistics is inversely proportional to their understanding of them.

That has often been my experience too.

He goes on to identify three ways that we as web designers can help rectify this problem. These are:

  • Providing cheat sheets that help the client understand terms like ‘hits’ ‘page views’ and ‘unique users’.
  • Add web metrics training into the budget of your projects.
  • Provide summaries and reports for the client on key metrics such as conversion rates or sales.

To be honest this is a much bigger problem than can be covered in a short blog post. Too many website owners think that having Google Analytics will solve their statistics needs. However, having the data is not the same as understanding it. If this information is misread it can lead to bad decisions about the future development of a site.

Specialist vs. Generalist: Who Wins?

The final post this week is of interest to pretty much everybody who listens to this show. It asks which is better – the Specialist or the Generalist.

This is an important questions for both web designers and website owners. As web designers we need to know whether we should be specialising in a specific area of web design. It is important for our careers and our businesses.

As website owners we want to know whether the pain of dealing with multiple specialist suppliers is worth the increased expertise you would receive over a generalist.

It has to be said the article is written mainly from the web designers perspective. However, I think there are lessons to be learnt for all sides.

The post outlines the pros and cons of both approaches, but ultimately comes down on the fence when it says…

There are advantages to being in both groups, but I think the only way to be truly successful is by being a little of both. You can be a specialist, but in order to be able to develop a profitable business, you may need to be able to supplement your specialty services with some add-on services that may not be exactly in line with your focus.

Personally, I think it depends on how you define specialist. The type and level of specialisation can vary massively and the way you position yourself will define your success. For example, you may specialise in a certain discipline (e.g. Ruby on Rails development) or in a specific market (Higher Education).

Ultimately, whether you are a website owner seeking an agency or a web designer forging a career, it is all about balance.

As a web designer, if you specialise too much you will not find work. If you generalise you cannot differentiate yourself.

As a website owner you want a web designer who is enough of an expert to deliver an outstanding solution, but you do not want so many specialists that your project turns into a nightmare.

Back to top

Interview: Aarron Walter on Interact

Paul: Hello, and so joining me today is Aarron Walter. Good to have you on the show, Aarron.

Aarron: Thanks for having me.

Paul: And the reason we have Aarron on the show is because he is going to talk about a new initiative.. is ‘initiative’ the right word, Aarron?

Aarron: Yeah, yeah.

Paul: Let’s go with that. A new initiative from the web standards project, called Interact. Now, let’s kick off, Aarron, by maybe you telling our listeners a little bit about what Interact is.

Aarron: So, whilst Interact is an open curriculum framework, basically we’ve been recognising that the Web Standards Project has been around for a long time and we’ve done a lot of things to try to get standards into industry. And to a certain degree we’ve made some big triumphs in that respect, but there are still a lot of websites out there that aren’t following standards and people that are sort of behind. And we saw the Achilles heal as to why that’s not happening, as really, education. So, you know, our medium’s really young and it hasn’t really found it’s bearings with how we’re going to marry industry and education, so whilst Interact is a curriculum that has a series of courses that teach not only web standards, but best practices.

So there’s of course the stuff that you would expect from WaSP which is the front-end development courses that teach progressive enhancement and semantic markup and that sort of thing. But we have six learning tracks that include foundations; there’s a course in there that’s like an intro to internet concepts and how people can use the internet to teach themselves and use RSS, that sort of thing.

So there’s front end development, there’s a design track, there’s server side development, there’s user science and then there’s also professional practice. So what we’re trying to do is create a collection of courses that are very modular, to try to get these into schools. And we recognise that not every school is just going to take the entire curriculum and integrate that into their program. You know, if you’re a Computer Science program maybe you’ll take a course or two, if you’re a design program you’ll take a course or two, or even just grab the assignments or look at our competencies.

Each course is based on competencies, which are the things a student has to master before they can pass a course. And then the evaluation methods: So each course has assignments, it has exam questions, it has readings that come from Operas own web standards curriculum – we’ve been collaborating with them. It has textbooks, it has pretty much everything that an educator could need to teach a particular topic.

Paul: Okay, so is this something that is then aimed entirely at educators, or if somebody wanted to get into web design and they were trying to learn it in their spare time, could they just go to this and use it in isolation by themselves?

Aarron: To some degree, I guess they could, but Operas web standards curriculum is really learner-centric, so if you’re trying to teach yourself, that’s probably the place to go. But ours is very much focused on educators, because we feel like there’s a lot of great resources out there on the web if someone wants to teach themselves, but there’s not a lot of great stuff for educators to get stuff into their courses.

Paul: So, when you say ‘educators’, I mean what kind of level are we looking at here? Earlier you mentioned schools. Are we talking about school age, or are we talking about higher education? What are we covering here?

Aarron: I’d say our primary target is higher education, colleges, universities, even training programs to some degree. But we are also seeing some of our content in high schools as well and we’d like to see that more. Especially foundations courses like the web design one course or the internet fundamentals course. If students could go into college with a solid foundation, then they can start to focus more on "What can I do with these techniques?" than theory and concept.

Paul: So is this design to be fairly international or is it quite U.S centric in the way that it’s written.

Aarron: We want it to be very international and the people that have worked together on this are from lots of different places. We’ve got some folks in Europe, Canada and of course some folks in the U.S, so it is in an international group that’s coming together and we’re actually working with WaSPs ILG group – that’s the International Liaison Group. And we’re working on, this year one of our big goals is to try to get a lot of our content translated to different languages.

Paul: Okay, so there will be multiple language versions of all of this as well at some point?

Aarron: That’s the direction we’re heading, yes.

Paul: So, I mean, how did this come about in the sense of, you know, well, how did you get involved in it for a start and what was the motivation behind it?

Aarron: So, I’ve been teaching for the past ten years in different schools in the U.S and colleges and universities, but I’ve also been working in the industry as well. And I got on WaSPs mailing list, I just joined the mailing list and started to talk to some folks and then they invited me to join – it was a year ago, I guess it was at the very beginning of 2008 – and so I joined the education task force who created the Interact project. And basically there were ideas about the curriculum and I’d heard lots of people say "Yeah, what we really need is, you know, education’s way behind" and they’re happy to point fingers and "We need a curriculum", but it just never was really transpiring from anyone coming from the industry and so we kind of just decided we need to do this. And I’ve helped create curricula before as a faculty member at the Art Institute of Atlanta and so I had some ideas and we had a really great group of folks that are in the education task force – people that are educators and people that are experts from the industries. So, yeah.. actually South by South West was where this all started, which is pretty amazing, of course there are lots of great people there. So Glenda Sims, who’s one of the heads of WaSP these days introduced me to Chris Mills from Opera who was working on his project and we kind of had some drinks at the Geeks Club bowling event and we just kind of went crazy talking about these ideas. And Steph Troeth then Leslie Jensen-Inman and we all had these ideas, and then we just set a goal for ourselves in 2008 at South by South West and we said "In a years time, we’re gonna be back and we’re gonna have a curriculum." and that’s what we did. This year we launched our curriculum at South By.

Paul: That’s quite an impressive turnaround for the amount of information that’s in there. How did you draw everything together? Where did it all come from?

Aarron: Well, we met every week online and we talked and we established a course template, which really helped us. The stuff that we really needed to put in these foundation courses, we all know what needs to go in there. It’s just a matter of getting around the pedagogy or the educational part of it. So we developed a template for assignments, a template for a course and a template for learning modules which are basically like, you know, a teacher could teach a concept like let’s say, HTML forms in a weeks time. So we developed those templates and then from there we just assigned courses to different people and we used a wiki and we just met regularly and.. I gotta say, you don’t have to have a huge group to develop a curriculum.You just have to have a few people who really have their heart in it and.. we have some amazing folks, so..

Paul: So, what kind of response are you getting so far from H.E institutions? Are they interested in adopting it? If they are, how are they going to go about that, because, I mean, my impression is that it always takes forever to get a curriculum approved at a university or whatever. So I’m just interested in how that process is going.

Aarron: Yeah, education is.. one of it’s benefits is that it’s slow to move, so once it gets a solid foundation it keeps that solid, but you know, one of it’s drawbacks is that it’s slow to move. And so we’ve got some schools that are really excited about it and generally the folks that.. you know, it’s only been a couple of weeks that this has been live, we’ve got some folks that are really excited about it and those are folks that were kind of headed in the same direction themselves. So we’ve gotten some responses from schools in Europe and some schools in the United States that are interested in pulling some stuff in. And we have a school that’s looking at using a lot of our content right now. So we’re in the early stages of trying to get this out there. I think the easiest part is building the curriculum, because we know what needs to go in there. The hardest part is getting it into schools. So one of our strategies is to get the endorsements of folks in the industry, so we’ve gotten endorsements from Google, from Yahoo, from Adobe, from W3C, from Opera, from Mozilla – they’re all just super excited about what we’re doing and that sort of brand recognition can help us get our foot in the door with schools. And of course going out to conferences, we’ve got folks at the European Accessibility conference right now, talking about it, so we’re just trying to get out there and let people know.

Paul: Excellent. That sounds brilliant. I mean, I know that a lot of people that listen to the Boagworld podcast – there’s a large number of students that we’ve got listening and I often get complaints about this, that what they’re being taught at university bears no resemblance to what they’re hearing on this podcast. And I’m hoping that that’s because the podcast is right and the university is wrong and not the other way around. So if they’re listening to this and they’re getting really excited about it and, you know, they’ve gone to your website and they’re seeing the curriculum – I’ve got it on front of me now and it does look really exciting – how do they make this happen in their institution? What would you encourage them to do?

Aarron: So, this is the interesting thing – that so many of us have complained about a problem, but there aren’t a lot of people that will take that complaint and turn it into action. So if you’re a student or if you’re an educator what we need you to do is, there’s a page that’s called Advocate Standards (http://interact.webstandards.org/advocate/) – you can get to it from the homepage of http://interact.webstandards.org. It kind of just describes what standards are, why they’re relevant to you and we need people to share that information with their teachers, we need people to share just this website with their colleagues and show them the testimonials of the people who believe in this and want students to come out of schools with these skills. So we need people to act in a bottom-up sort of way, you know, grass roots. Take this to your classroom, take this to your teacher, take this department chair and just let him know. That’s the most powerful thing that people can do right now.

Paul: I mean, what I’m quite excited about from looking at this curriculum is that it contains a lot more than "Here’s how you code in X language" or whatever and even has got more in it than just design and user experience stuff. All this stuff about professional practices is very exciting too. Could you perhaps tell us a little bit about that?

Aarron: Yeah, so professional practice, we want people to not only get the concrete skills of "I can code a standard compliant page" or "I can construct a usable website", but we want people to be able to present their about their work and you know, be able to survive in a real career in the web. And so professional practices is going to have a series of courses to do that. We’ve got some pretty exciting ones that are coming up. There’s ‘writing for the web’ – it’s going to be a really cool one, that Alan Hussain from a List Apart is going to be creating. And we have a presentation course that’s coming down the line. So, we’ve got a number of those coming up.

Paul: That’s quite interesting, you just said something that I hadn’t grasped which is that there’s more to come here. That this isn’t the end of the line. It sounds like you’ve got lots more that you’re still developing. Is that right?

Aarron: Yeah. We call it a living curriculum, because you never write a curriculum and then you’re done. Especially in our industry, things change so fast. is what of course we’re going to be working on this year. Our design track is light right now and we want to try and address that ASAP, so we’ve got Dan Rubin and Ethan Marcott, are working together to create a foundation design course, that is specific to what web designers need to understand. And we also have Dan Mall is going to be helping us with a Flash course and Aral Balkan is also going to help us with some flash stuff too. We have a lot of stuff going on this year for new courses, so we hope next year at South By when we see everybody that we’ll have a brand new stack to add to Interact.

Paul: Excellent, so do you kind of envisage, from an institutional point of view that, like we were saying, it takes a long time for a curriculum to get approved and that part of the problem has always been that, by the time it’s approved it’s out of date, when it comes to the web. So is the idea that you’re going to get institutions to buy into the Interact curriculum in its evolving nature so that they always get the most up to date version of it. Is that the kind of plan? They’re not grasping one moment in time from it, if that makes sense?

Aarron: Yeah, exactly and we want to take some of the hard work out of being a teacher. I speak from experience, there’s so many things you have to keep track of and trying to keep pace with a lot of changing technologies and concepts, that’s hard on top of the umpteen other plates you’re spinning. So that’s exactly what’s going to happen, is that our courses, they’re not chiseled in stone, they’re published on the web, they’re in an expression engine and we’ll change those as they need to be changed. But that said, we need to strike a balance, because we can’t be chasing every new technology all the time, we have to evaluate and there has to be foundational concepts that remain steady. Separation of presentation and content, that’s steady foundation concept. But new technologies or techniques, they might change.

Paul: Okay, I mean, the whole area of education and web design is massively exciting and there’s so much going on at the moment in so many different fields. I mean, from your perspective, what else out there is really exciting you at the moment that you’re seeing.

Aarron: There’s so much, I just feel like last year that I just saw so many companies, organisations, individuals that, it seems that everyone just was pissed and they just walked out their house and they were headed in one direction until it was like everyone sort of meets up in one big mob. And so, what Opera’s doing, what Chris Mills has done with the 55 articles that he’s brought together and edited for Opera Web Standards Curriculum, that’s huge. Those are all rolled into WaSP Interact as our recommended reading, so that was fantastic. Yahoos Juku project, if you’ve heard of this it’s quite amazing. Nick Fogler, who’s the running Juku – Yahoo actually has a training program, where they bring students that are not employees, they’re not hiring them. They bring them in and they train them to be front end engineers over the course of a few months. And they’re doing it because they’re trying to solve this problem on their own. So, we’re talking with them about how they’re solving problems and looking to collaborate and discuss what we can learn from them. John Allsopp who runs Web Directions (the conference series), he brought myself and Chris Mills and Steph Troeth together with a number of other experts and we did Ed Directions, which was a day long workshop that taught teachers how to teach these concepts in their classroom. So there’s just so much stuff that’s happening right now and that’s just the tip of the iceberg.

Paul: Exciting stuff. It sounds like it’s a really good time and it’s great to have you on the show. How you manage to fit all of this in alongside earning a living too is quite beyond me, but it’s really good that so many people are volunteering and pitching in. That’s great. Okay, let’s get you back on the show, I guess in a years time and sees what’s changed. But thank you very much for coming in now and I will talk to you again soon. Thanks.

Aarron: Thanks for having me.

Thanks goes to Andrew Marquis for transcribing this interview.

Back to top

Listeners feedback:

We have two emails this week dealing with two totally unrelated subjects.

Remote user testing

Our first email is from Steve. He writes…

Catching up on past podcasts, I listened to the episode on User Testing (#150). A method I’ve used that I haven’t heard tossed around much is remote user testing using a screen sharing program like GoToMeeting.

I used this for usability testing of our Intranet and it has several advantages:

  • No need for people to come to central testing facility, or you to go to them.
  • The user is at their own computer, so more comfortable.
  • Ability to record the entire session (screen and audio) so others can look at it later.
  • Tester can conduct testing while in his underwear only (I didn’t do this, but you could.)

What do you think of this method?

Sounds interesting although it would not be my preferred approach.

It’s easy to become a snob when it comes to usability testing and so let me make it entirely clear – any usability testing is better than none.

If you have no budget for user testing, test on friends and family. If time is tight, test on a colleague sitting nearby.

In the same way, if you are having trouble arranging sessions then use Steve’s approach. Something is always better than nothing.

That said, I do have some concerns with remote testing. These include…

  • It sets a minimum bar of technical competency. A user has to be able to connect to the system in order to participate. I know this would have been beyond the capabilities of some test subjects I have worked with.
  • It is less personal. Face to face usability testing puts users much more at their ease and allows you to build a relationship that facilitates honest feedback.
  • It does not allow you to read non-visual signals. Users will often pull a face or shift their positions when they are frustrated. As a facilitator you need to be able to see these signals and ask what they mean.
  • You are not seeing exactly what the user is seeing. You can only see their screen. You cannot see other distractions such as TV in the background. You cannot see the position of their keyboard and mouse. You have a limited field of view.

My preferred approach is to test in people’s homes. Not only are the users more relaxed, you also get a unique glimpse into their world. You see where they access the web, you learn about their home environment and even gain a better understanding of their character.

However, we do not always live in a perfect world and so would definitely use remote testing if better options were not available.

Finding a job

Our second email is a rather despondent one from Andrew…

I have one question, In the past you’ve talked about hiring new for staff, but as far as I can tell you’ve never discussed how to look for a job. I’m currently looking for a career in the industry, but I can’t get a resume to any company or even talk to someone of said company. Almost all the businesses I’ve approached (or at least tried to) either work from home, are no longer at that address, or no longer in business, and actually are just freelancers. And when I find a job posting online its for someone far more experienced then I am. I’m completely demoralized.

You have my sympathy Andrew and I have to say its a tough time to to break into any new sector including web design.

I am also probably not the best person to answer this question. I have been completely unemployable for some time now due to my ill defined skillset and opinionated character :)

So, I am going to try something different with this question. If you have some advice for Andrew, post a comment below. That way we can get the Boagworld community helping each other.

In the meantime here are a few random ideas from me…

  • Give up on the cold calling technique. Randomly contacting agencies is largely a waste of time. You have to get amazingly lucky to contact an agency who happens to be currently recruiting.
  • Try for an internship. Admittedly you will not get paid, but it is a foot in the door. You get a chance to improve your skills and also get to know the people in the industry within your area.
  • Be willing to move. There are jobs out there but they are often further a field.
  • Put yourself in a neat little box. Potential employers need to know what you do. Are you a designer, a coder or a server side developer? Companies don’t know what to do with people who know a bit about everything.
  • Start networking. The best place to find job opportunities is by attending conferences and meetups. Even if you cannot afford the conference itself, turn up at the parties and stand in the halls. Just get yourself out there.
  • Register with recruitment agencies. As an employer I hate recruitment agencies because they cost me money. However, we do still sometimes use them and it doesn’t cost you anything to be listed with them.
  • Ensure your website is perfect. The first thing I do when I look at a potential employee is check out their website. Their site has to be outstanding. It needs to look amazing, be well coded and rich with great content that demonstrates a passion for the web.

Hopefully that helps Andrew and keep an eye on the comments for more advice.

Back to top

Series: Building A Better Web Application by Ryan Carson

Ryan Carson: Hi I am founder of Carsonified a small web company in Bath, England. I am an American as you can probably tell, as for living in England I have been here about nine years. So a little bit of history about us real quick so you know who I am. I have a computer science degree and I have been involved in building four web apps and we are building a fifth truvay.com which will be released later in 2009, and we have sold two of our webapps dropsend.com and heyamigo.net. So the stuff that I am going to share with you today are lessons I have learnt the hard way basically as we have built web apps.

So the first thing I want to talk about is the Admin area that you will build for your web app. What a lot of people don’t know is that the Admin area is really the key to good customer service. If you haven’t enabled really easy customer service then it makes it hard to actually please your customers when they have problems so the first one to make sure you build into your admin for your web app are one click refunds so if someone calls and complains and says hey I am having trouble this month I am really frustrated please help you want to be able to just go into the admin do a search for their email address, their name or their company or anything and bam one click and refund their last invoice and what this does is it gives you, it gives you the ability to just make them happy right away. With a lot of web apps these days on recurring billing you will probably be charging people 5,10,15, $20 a month so losing that amount of revenue in return for really making a customer happy is super important. So make that easy for yourself to refund that money.

The second thing I would make it easy to do is have one click password reset that automatically sends out email with the new password, so with Dropsend it was really hard to reset people’s passwords and that was the number one request people had problems with, they couldn’t remember their password. So if I was to do it again what I would do is I would actually build the admin so I could forward an email from somebody presuming they had sent it from the email address of the account, forward it into Dropsend or the admin and it would automatically know that what it needed to do is reset the password for that email and then it sends out a new one so literally you do not even have to visit the admin area to reset someone’s password you just forward an email that would be amazing, so that’s the way I would do it next time.

The next thing I would do is also doing a one-click resend invoice. So a lot of people they don’t understand they can go into their "My Account" area of a web app to see their past invoices and what they will do is they will just email you and say hey you know I need last month’s invoice. If it is hard for you to find that or send that it is going to make you less likely to help that person so I would do a search on the email address show a list of invoices bam one click and it emails them a pdf version of the invoice. That’s another, that leads me onto another area that I would like to talk about that is invoicing. If you are doing recurring billing sort of every month billing your customers make sure that you are not re-inventing the wheel I would recommend a web app called Spreedly.com and what it is basically it is a web service for recurring billing they have done all the hard work, written all the code, the code for the Dropsend recurring billing was at least I think 1200 lines of PHP and it was good solid code but it was really hard and painful to write. So I would recommend don’t re-invent the wheel use a service like Spreedly because it is making calls to an API if later you decide you don’t want to use a service like Spreedly any more that layer has been abstracted out so you could replace it with your own billing system or another one and it won’t kill you, but I would say hands down don’t rebuild reoccurring billing it is a real pain in the ass.

The last tip I would say about your admin area is make sure that it is easy to give your customers credits. you want to be able to login search for an email address and just give them, hey I want to give them five bucks towards next month, ten bucks just to make them happy and you will have lots of happy customers. So that is my five minutes of tips, thanks Paul for letting me be a part of this. Take care Bye.

Back to top

152. War?

On this week’s show: Daniel Burka and Joe Stump from Digg discuss the supposed war between designers and developers. Paul talks about using twitter effectively and we ask ‘are you placing too much emphasis on your homepage?’

Play

Download this show.

Launch our podcast player

News and events

How to film video case studies

Increasingly your web strategy is about more than a website full of pretty pictures and well written copy. Video in particular is playing an increasing role, whether it is embedded in your website or shared via YouTube.

Video can be used in all kinds of ways from product demonstrations to viral marketing. However, a growing use for video is customer case studies.

This week 37 Signals have published a fascinating insight into how they created their customer case studies for Highrise. The article covers everything from…

  • How they chose who to interview
  • The way they shot the videos
  • What questions they asked
  • How they conducted the interviews
  • How they edited the videos
  • The time they spent preparing the whole thing

There is little written about producing quality videos and even less about customer case studies. Without a doubt these kinds of videos are extremely powerful and so it is great to read quality advice about their production.

Effective communication in web design

Smashing Magazine has posted an excellent article that I would highly recommend to all website owners. No, it is not my excellent Twitter article that I will cover later. It is actually an article entitled – Clear And Effective Communication In Web Design.

In essence it talks about how to communicate on the web through both copy and visuals. It is a comprehensive overview (if somewhat superficial) of all the key considerations of communicating effectively through your website.

The article focuses primarily on your website, largely ignoring broader communication issues. However it does tackle…

  • The different methods of communication – Images, text, titles, icons, design styling, colour, audio and visuals.
  • The challenges of clearly communicating – This includes the curse of too much copy, the need for personality and much more.
  • What you should be communicating – Your company vision, the websites offerings, the benefits to your users and calls to action.

It also nicely demonstrates how the design and copy work together to communicate your message. This is something I will be discussing with Jeffrey Zeldman in an upcoming show.

Do we place too much emphasis on the homepage?

Following on nicely from my recent post about where we invest our money, Christian Watson recently wrote about one of his clients who requested a homepage redesign.

In the article he writes…

Sure, I could refresh the colors and move some content around. But is this a good use of my time and her money when the home page represents 20-25% of page views?

It is a good question. Christian goes on to argue that we often place far too much emphasis on the homepage and that in fact it is little more than a gateway page to direct users to more important content.

He uses a nice analogy borrowed from Jared Spool. He compares the homepage with a hotel lobby…

When visitors arrive at your hotel, certainly they should find that the lobby represents the hotel favorably. It should be attractive, spacious, with elegant lighting, welcoming colors, and the odd feature here and there.

The lobby should make it easy for the visitor to orient themselves — to see where the front desk is and where the lifts are. It should make it easy for the guest to find out any important information at a glance — upcoming events or where the conference is being held.

However, hotels are ultimately judged by the quality of their rooms.

It is an excellent post that provides real food for thought.

Back to top

Interview: Joe Stump & Daniel Burka on War Between Designers & Developers?

Paul: So I am really excited to have joining me today Daniel Burka and Joe Stump from Digg. Hello Guys

Daniel: Hello

Joe: Hey hey

Paul: I have had both of you on the show individually and Joe you were on not long ago were you really…

Joe: ermhh yes a couple of months ago maybe

Paul: What can I say, we cannot survive without you. So erm but I though lets bring the two of these wonderful people together and talk about designer,developer relationships and how the two of them get on together working at Digg. I mean I have to say this is just a rip off really isn’t it, it’s a rip of a panel you did. Was that Future of Web Design (FOWD) you did that panel?.

Daniel: Yes it was Future of Web Design in New York. I think we are rehashing the panel at South By South West (SXSW) this year so if anyone is there it would be awesome if you dropped by.

Paul: Excellent, I need to persuade you two to come along to the SXSW live Boagworld as well, but I will hassle of of air so that you can back out if you want to without committing yourself live in a interview.(Paul laughs). OK so lets kick off by talking about the designer and developer relationship and really I think that it strikes me there is a lot of mythology around this that you know designers and developers hate one another and I am not convinced it actually works like that in practice. When you guys did your panel at FOWD you actually were agreeing on a lot of points so I though we would start of by maybe highlighting some of the differences and then look at ways of working together er mm further down the line so lets talk about to begin with what you guys see as the main differences in outlook I guess between designers and developers. How do you look at the world in different ways, do you think? Maybe Joe do you want to kick us off. How do you think developers see the world differently to designers?.

Joe: Sure I think erh developers are definitely, their default kind of response erm is that they would rather, I always make the joke that coders by default are lazy, good coders are extremely lazy people that’s why they’re good coders because they want to automate as much of their lives as possible. Ermm so I think that erm developers tend to get a little complacent when it comes to the actual erm product sometimes because they are so busy and so interested in and so worried about the actual code or the more nerdy side of things you know like are we running the latest greatest versions of different softwares. Developers also tend to be a lot more interested in what the new hip nerdness is as opposed to what’s actually going to make the product better for users, you know so like I have been in product review meetings where people are like “well Why isn’t this new version of some strange bizarre open web specification that nobody has ever heard of ahead of some major forward user feature” . (laughs)

Paul: (laughs)

Joe: So ermm I think that that tends to be like a big difference. The designers you know it is their job to be curators of the website in my opinion and kind of move the user experience forward and often times developers don’t have a whole lot of interest in that. (laughs)

Daniel: On the flip side of that if we are both going to slag our own professions ermm I think designers are often you know pushing unrealistic goals. They are interested in building you know the perfect product and you know aiming straight for that instead of looking pragmatically at doing things in steps and figuring out what is technically possible and I think there is also a gap where designers can only see sometimes what features that they can view and don’t understand, don’t see the vision, of where developers can see you know amazing things they can you know do pro grammatically that designers just aren’t envisioning.

Paul: Yeah

Joe: I think that’s er is another key difference that I know that there is a lot of, there have been struggles and tensions between Daniel and I in the past over this idea of a holistic approach to design where where Daniel designs his vision and his vision is normally version 10.0 and I am looking at you know the technical roadmap and things that I need to do and like I am OK well lets talk about version 1.0 and then we can start talking about 2.0 like, developers are much more focused on an iterative process as far as releasing, you know like small chunks, reducing risk etc. etc. and designers tend to kind of like go well erm you know it is like I wanna build a pyramid it’s like great well how about first we start out by finding some limestone and then we work our way up to building a pyramid.

Daniel: So what you are saying is we have got a fantastic optimism. (laughing)

Joe: Yes

Daniel: But I think that’s partly it. Developers are very interested, as Joe was saying,in mitigating risk and in a lot of ways designers are very adverse to even thinking about risk and want to think about opportunity. So I think this is kind of the crux of the whole thing and what we are trying to talk about on that panel is that both of those views are super valuable and if you manage to find the right mix of those two things then you can develop a fantastic product that is both concerned about risk and pushes the boundaries of what is possible.

Paul: Mmmm I remember one point that came out from the presentation which is one that you made erm Joe which is about the dangers of if that mix is not right. It is always the designer that’s in front of the client or the boss or whatever ermm the kind of realism of the developer is kind of left out of the process and ideally the developer either needs to be involved in those kind of meetings or there needs to be a conversation that happens between the designer and the developer before anything is ever presented. Is that kind of, do you still feel like that is that still a valid point?.

Joe: Yeah, I feel that is a extremely valid point for two reasons erm and this is a discussion that Daniel and I just had yesterday in fact. The thing is as a developer the reason I want to be involved early on in the development or in the design and like development of the product phase you know when requirements are coming together and when you know the first kind of formations come out of the clays so to speak is because two reasons. One ermm and they all kind of come back to this same kind of problem, is that the designers and the product people don’t know the system, the actual bits and bytes that like you know go into making the product, as well as the developer like the data and the code and the actual systems and stuff like that and how they are put together. So Often times two things happen Daniel comes up with a design and there is like one small minute detail on the page that would require you know one of the largest computer farms in the world to calculate in real time. Whereas in lots and just as often as you know that happens where it is like Daniel I can’t calculate that number in any meaningful way on a regular basis so you gotta remove that. But just as often as that happens because of you know as a developer I have such like intrinsic knowledge of the relationships in the data and what data we are storing and stuff like that just as often I am like well why don’t we expose this data or do this and Daniel is like I did not know we could do that actually I totally would have done that if I had known that that was possible or feasible.

Daniel: Yeah and that’s, especially that side of things designers often hear the first part Joe is talking about, the you know well that is just not possible or more difficult than you think. Any designer that has worked with a developer has heard that aspect of it you know and that is of course very valuable but it is the other side of things that I think people fail to leverage most frequently is the ability of developers to see different patterns than you in the data and come up with those suggestions, you know it might still be your call whether or not that is a valuable thing for the user but just hearing these ideas coming out is is amazingly valuable. That has shaped a lot of Digg.

Paul: So would you say that is a kind of you know a common mistake that maybe designers make with developers that they don’t communicate enough with them ermm

Daniel: Absolutely

Paul: yeah

Daniel: Designers often see developers as mules its like I made this thing go build it and that is a bullshit attitude, its terrible.

Paul: mmmm what …

Daniel: Its not just designers either all product people have a tendency to do that. In some ways, as Joe was talking about developers being involved in the process, at Digg we’ve got a pretty good structure where design actually falls under the marketing team and in some ways I see design as a bridge between marketing and business development you know product interests and the development team. Because I am often sitting over here and I hear you know someone from business development or marketing throwing around an idea and I am like “I’m no developer but I have a good sense of what the developer sees as important and you’re talking crazy talk like that is going to be nuts” and they are about to go and pitch that to a potential partner and you know like every week I put the brakes on from that kind of thing I am like listen you need to talk to Joe you need to talk to a developer because that what you are talking about is going to be months of development and you are promising it to a partner in two weeks that’s nuts and so I like that in you in some ways the design team can often be a bridge between product marketing people and the technical teams.

Paul: Joe from your perspective what kind of, you know as your communicating with Daniel and other designers within digg looking back where do you think you’ve made mistakes in your relationship with designers?.

Joe: Ermm I mean the mistakes that I often make ,its a not even a mistake are I don’t wanna say are what we do are like flat out mistakes it’s just more ermm you know being a bit more reserved and not necessarily defaulting your answer to no. Err You know I think that Daniel often talks about how a natural tension between design and product and development is actually good for the product because you have eventually, as long as you can keep that at a good tension and not you know bad or where things are breaking but ermm I think often times developers are quick to say no. You know they will be sitting in a meeting and it is just immediately no I am not going to discuss that when in reality if they sat back and let the idea germinate you know they would, Its kinda weird because I have in a lot of meetings where things were, where the developers were like be oh my god that is an amazing product but we will never be able to build it and so it is like they want to build it but their default is to avoid risk so they say no. So a lot of the times when I talk with Daniel now and this is something I like quit doing I try not to say no unless it is just like blatantly in black and white no way that is possible kind of thing. I might let the idea germinate more I might no say no immediately I might want to go back and spend a couple of hours thinking about it if it is actually feasible because maybe you know. That’s what engineers love doing they love solving difficult problems and if you are saying no to difficult problems then you are failing at what your passion and hobby is. Ermm so I think that ..

Paul: There is also an aspect is there not of not just saying no but explaining why you are saying no so that the other party is kind of educated into the kind of problems you face so as Daniel said earlier that they can be the bridge to you know business development or whoever else.

Joe: Yeah absolutely, I am the king of analogies at this point ermm but the other thing that developers erhh, this is extremely common that they utterly fail at is that they think for some reason that they are like the target demographic of the product so they will come into a meeting and say this product will absolutely fail because it doesn’t have key binding so I can keyboard shortcuts it’s like nobody uses keyboard shortcuts like in the real world, they are all mice people like you know. It is stuff like that that a lot of the time developers are like “this will never work unless you have least 14 completely nerdy niche features in it” you know and I think developers too often you know they do that and that is just silly.

Daniel: Hey guys that’s been a special problem at digg,since we started of as the pure technology side so it was seen as by developers for developers and you know we have obviously branched out from there and now we have got other interests I want to make sure peoples mums can use the website and that’s you know certainly a , you make different choices based on that.

Paul: I mean it is very timely from my point of view to have this interview with you because on Friday we had a internal meeting in Headscape where we talked about all kinds of production things and one of the things that came out of the development team was this desire to be involved in the process more and err to have their say more and just to be included earlier. So I am quite interested in you know because obviously you guys have been working together for a long time what kind of practical advise would you give to a , maybe this is just a question for me and not for anyone else, but what kind of practical advise would you give for designers and developers working together within the organisation. How can that relationship work better?

Daniel: Yeah, absolutely involving your development team earlier in the process but that doesn’t necessarily mean sitting around brainstorming right at the beginning of a feature with them. I mean I try to sit down work out an idea get it 20% of the way there, you know work out some of the basic issues figure out what this thing really means what’s at the core of it you know it might be ten different features together but what are we actually trying to achieve with it right so at least get that far even throw down so basic wire frames or some really basic comps and then present it to the developers its like listen this isn’t just an idea I came up with you know last night I just want to spill my entire brain out in front of you it is something at least I have thought through you know I have put a few things through my brain and now here is this totally unformed, not totally unformed, slightly formed idea but it is not baked you know don’t wait until you have got it baked and then you are so disappointed when the development team says well that’s not possible or have you really though about this and you have got this complete package already made up in your mind but come to them with a least you know the kernel of the thought out idea and get them to poke holes in it. Get them to push it in other directions and show you what else you could be doing and then go back to the drawing board again.

Paul: What about from your point of view Joe?

Joe: Well yeah, So ermm I agree with Daniel in some sense on that I think it is crucial to before you take it to developers to formulate a cohesive problem or hypotheses. Like if you come to the developers with a half baked problem that you are trying to solve you are going to get like, they are just going to run wild with it and it is like you know difficult sometimes to keep developers focused when they get excited about a problem. So have a formulated problem that you know you have a small idea of how you are going to fix but not fully baked. The other thing too and this goes on both sides of the aisle it shouldn’t be get developers plural involved and it shouldn’t be get. like a lot when you are first germinating that idea and you haven’t really moved it forward start small and then continuously expose it to more and more people errmh because I find if you involve too many people early on in a the process whether it is designers, developers, product people things tend to , you tend to loose focus quickly and everyone wants you know it’s kind of like port barrel spending and major bills its like everyone wants to piggy back extra features and stuff and pet projects that they have wanted for so long into like some major new feature.

Daniel: It is just simple death by committee

Joe: Right

Paul: Yeah Yeah OK That’s interesting a little random question I remember going to a talk once where, and I can’t remember who it was who was giving it, where they suggested that errmh designers and developers swapped roles for a while. Where you try and sit in the other persons shoes and I was just interested whether you two had tried anything like that?

Joe: That would be disastrous for me. (laughs)

Daniel: I I mean I appreciate development roles and I am you know somewhat technical for a designer but yeah I know I have never done that but I have always worked so closely with the development team like at silverorange where I worked previously to digg there was only ten of us and I sat in a room with developers all the time. I worked in their code with them and worked on problems as a group so I think I, you know I have never worked in a place like say you worked in a big enterprise and your in this classic where designers are in one office and developers are in the other office and you toss stuff over the wall yes then I think that would hold value at least go and sit in the other office, go work in the other office for a few months just hear the other discussions that are going on because there are a totally different set of concerns a totally different set of values than what you are doing and if you don’t at least appreciate and understand that, and not just understand it so you know what you are fighting against but understand it to know what is important and how you can work with it then you know you would be really missing out.

Joe: I think I am ermhh I think I am kind of spoiled at Digg because you know I work with two of the webs brightest, you know Daniel and Mark Trammell as well so I actually push back on my developers pretty frequently where they you know we will leave a meeting and they are like I really really completely disagree with what Daniel or Mark are doing with the design and you know I tell them all the time like look you are not a designer and you definitely not at the level that those two are at and you sometimes have to defer to them and trust that they are doing their job and they are doing it well you know and ermhh I think developers don’t do that often enough they make these assumptions that you know the arty-farty designers are doing stupid shit again and that’s not the case. I mean they would not be especially where we are at at Digg and what not I mean Digg is able to be very picky with who they bring on and the people Daniel has brought in to design are extremely competent at what they do err so I am probably not qualified to answer that question because I am so spoiled at Digg but that is a common problem I see from developers where ermhh they don’t let the designers do their job and they try and be designers when in reality you know they do not have the experience or the expertise so.

Paul: Lets talk about conflict resolutions, sounds very grandiose but basically you know how do you go around resolving a situation where you know OK you kind of respect each others skills and you respect each others competencies but you know where some feature is suggested by Daniel and you know and you Daniel from your point of view it is absolutely core to what you are trying to achieve you know it is extremely important and then from a technical angle Joe it just seems incredibly complex and very very difficult. How is the eventual decision made as to whether that feature should be implemented and in what way it is implemented? How do you go about resolving that difference?.

Joe: Ermhh Well I mean I think as far as making the decision whether or not the feature makes it in, because there is actually two possibilities when it comes to the conflict resolution. Whether or not a feature actually makes it into the product and in what capacity does that feature make it into the product and I think in the former whether or not the feature actually makes into the product if Daniel comes to me and he’s resolute like this feature has to be in the product the feature is going to be in product. I am always going to defer to Daniel on on, if he feels that strongly and is that passionate about it you know and it is not something completely hare-brained like I want magic ponies to come flying out of the screen I am going to defer to his expertise on the fact that feature needs to be in the product. Where the conflict resolution comes into it is what capacity is that feature going to come into the product like a perfect example of I think of something where there has been we have had a recent discussion at Digg and where this has happened we have, and I talked about this probably in our last talk but, there are these little green badges on the digg buttons and they indicate one of your friends has dugg that story and when you hover over the digg button it shows like a little sample of the people that have dugg it. Ermhh So those were causing significant strain and problems with our systems and our code and on our databases so I came to Daniel and of course again as my risk aversion developer brain was coming to Daniel I was like Can we axe this feature until we can figure out how to like fix it. He was like “No” that feature cannot absolutely be axed and then we came to a resolution which was a short term solution until we can get a better solution in place where operations now have knobs they can dial down so the green badges don’t show up on stories older than 48hrs, they don’t show up on stories that have more than say 5 or 600 diggs and stuff like that. So the conflict resolution came in basically making trade-offs in how that feature is surfaced in works ermhh at our scale more often than not what that means is that Daniel has to give up the notion that everything is in real time. The feature will work it is just that it may take you know thirty seconds to a minute for an action to be distributed across the entire system, that is probably more how things are now at Digg so.

Paul: What about from your point Daniel, when do you back down over something and when do you keep pushing on it? How do you decide you know how serious Joe is about something and whether you should keep pushing or not?

Daniel: Right I mean it kind of comes down to you know when I am looking at the product I am not thinking of any one feature, I am thinking about the whole set and I want it all to work together and so you know I know I want to push out six different features this month and if I push and push Joe to do the one really hard one well that is going to affect the other five I wanted to get done. So any feature is tied to other features and it is also based on a time line if I want something done in a certain time line and that’s just not possible well then I have to start making compromises so you know you have to be realistic and then at the same time you have to realise developers work well with shame and so if you tell a developer well I bet a good developer could do that (All laugh) they will go back to their cube grumbling at you and figure out a more efficient way to do it.

Paul: OK. So now we are getting into the realms of how to manipulate each other.

Daniel: Absolutely.

Joe: That’s definitely err one that I agree does work but is not a trick you want to pull out of your bag too often.

Daniel: No it is the same with designers too, it is like I want to do this really complex thing, no way I can explain that to users in a way they will understand. “I thought you were good” arhh shit I will go back and try that again.

Paul: That is quite interesting what you just said there because so far we have talked very much about you know designers initiating features and that kind of stuff I mean are there situations where the developer is the one initiating features you know just said there a developer wanted to do something really cool and you said you couldn’t explain it. Does it run that way as well? or is it always the designer who drives first?.

Daniel: No Absolutely that happens at Digg, it happens sometimes at Digg so Joe yesterday sent me an email that had two big feature ideas in it. They may not be things we implement this month but maybe later on this year. I was looking at them and you know it is easy to disregard well he is a developer he does not understand what’s going on with the product but you look at the ideas and they are strong and they fit in with what we are doing and now I am trying to figure out you know how they make sense in the big picture I guess. So we have got a brilliant development team a lot of people over there with great ideas and we try to sit down, you know I guess Kevin has been doing those where we do meetings once a month I guess where developers if they have been working on a side project you know something they have always wanted to build into Digg they can present this at the Digg ideas meeting.

Paul: Ah OK

Daniel: A bunch of those products will make it into the full Digg I mean its awesome these brilliant people go and throw around crazy ideas and show you what is possible.

Joe: I think err yeah I mean I agree with that you definitely have, it is a two way street erm largely stuff comes from product at this point the Digg ideas meetings is definitely helping that you know open that up and kind of what I would call level that playing field a bit. But one of the things I think developers are in a in a unique position just like Daniel I work with people across the entire companies so I know initiatives that are going on in marketing I know initiatives that are going on in PR and biz dev etc. and you know if nothing else developers are very good about noticing and pointing out and discovering patterns and err a recent product that made it out that err was a developer initiated product was Digg dialogue because basically I noticed this common pattern where business development and Marketing and PR were setting up interviews and then like reaching out to people to like conduct interviews using the Digg engine kind of thing and I was why don’t we bake this into like a cohesive feature that’s turnkey because you know business development like Daniel was saying earlier lots of times they are just making these one off deals you know and they don’t really recognise when there is a product to be had there erm so that is another one that recently went out. It was like I recognised a pattern and baked this into something cohesive and move it forward.

Daniel: That is a good example of where we are being lazy some people want to do this one off thing over and over again and it is a bunch of work to don it each time well like we will just build a system to do it and we won’t have to do all the work every time. It was great.

Paul: OK that is really good lets leave then with one final question or one thing from each of you. Which is if you could give you know one piece of advice to either designers or developers on how to kind of interact with their counterpart what would that one piece of advice be?. Lets kick of with you Daniel what would be your one piece of advice to designers about dealing with developers?.

Daniel: My one piece of advice would be to see the big picture, you know aim for version 10 like we were talking about earlier and know what you want to build in the future but be realistic enough to back it up and build it in stages. You know waiting and building a feature over six months and eventually launching it is a terrible way to develop and it’s a terrible way to design having an idea of where you want to be in six months but realising in one month increments is so much better you’ll end up in a different place but at least you know where you are heading and you can adjust that goal as you go forward

Paul: Yeah. Brilliant. Joe what about you?

Joe: Ermhh I would say to the developers out there that there is different shades of no ermhh that you know there is the, the default should not always be no and remember what I said about the conflict resolution you should be deferring to the people that are experts in their field by default for the most part and to work on compromise in how the feature operates and make your concessions and have them make their concessions rather than just defaulting to saying no to the entire feature.

Daniel: And as a developer push to be involved early in the process, even at Digg we struggle with that a lot and as a designer I appreciate when developers want to be involved I want to hear their opinions you know it is fun to have them involved I hear all kinds of crazy stuff I never even considered that’s awesome.

Paul: Excellent. Thank you so much guys that was really good I appreciate you coming back on the show yet again. It was really good to get your perspectives together on that relationship because it is one a lot of people struggle with. So it is good to hear that it can work most of the time. Thanks for your time

Daniel: Thanks for having us on Paul

Joe: Bye

Thanks goes to Shaun Hare for transcribing this interview.

Back to top

Listeners feedback:

With everybody from Britney to Obama now on Twitter it is safe to say the social networking platform has gone mainstream. But what does this mean for the service and how can we as website owners use it? Read More

My Favourite iPhone Applications

I often get asked what my favourite iPhone applications are. Its hardly surprising considering the excessive number of application I buy and the amount I go on about it. I therefore thought it was about time that I compiled a list of my favourites.

One caveat before I begin my rundown of top 5 applications – I am a fickle creature and so my favourite applications change regularly. What you see here is a snapshot of my current setup. It will no doubt change in a week or two!

1. Omnifocus

Fav iPhone app: Omnifocus

I am a Getting Things Done addict. Its the only way I can stay on top of the ridiculous number of half finished projects I have. I am also a worrier so having a system really gives me a sense of control I would otherwise lack.

I started off using Omnifocus as a desktop application. It is designed around the GTD methodology and I would only recommend it to people who are serious about this approach. Also the iPhone application is far from cheap but for me it was worth every penny!

Omnifcous is not perfect (adding tasks to the inbox takes too long) but I use it far more than any other application and I could not live without it. If you feel out of control in your life, read Getting Things Done and then buy this app.

2. Evernote

Fav iPhone App: Evernote

Evernote ensures you have your notes wherever you are. They offer a desktop client (both mac and PC), a web client and an iPhone application.

You can add text notes, audio notes or images. You can tag the notes, sync them across all your clients and even capture images using the iPhone camera or web cam. However, the real power of Evernote is its optical character recognition. If you upload an image to the evernote server it will convert any text in that image into a searchable format. Very useful indeed!

3. Tweetie

Fav iPhone App: Tweetie

I have tried every twitter client available on the iPhone and Tweetie is by far the best for anybody serious about Twitter.

It allows the management of multiple accounts, access to entire conversation threads and offers a powerful search functionality. It also allows you to get detailed information on other users and to manage of your relationship with them. However, it is the interface I really like. It is clean, customisable and easy to use.

I cannot recommend this application highly enough.

4. Google Reader

Fav iPhone App: Google Reader

This is my only web based iPhone application. There are actually a number of native applications that integrate with Google Reader but none of them are as good as Google’s own application.

I need an RSS reader which syncs across my iPhone and laptop. Google reader does that and does it using a clean and fast interface. I love the way Google handle RSS and so wanted an iPhone app that works with that.

That said I would prefer a native application. Occasionally mobile safari chokes on the Google reader application and it often makes the page reload unnecessarily. Unfortunately all of the alternatives I have tried are slow and unresponsive. Either that or do not offer as extensive functionality as Google’s own application.

5. Mobile Fotos

Fav iPhone App: Mobile Fotos

My final choice of application was a tricky one. I could have gone for facebook, brightkite, speakeasy, yammer or any number of others. In the end I chose Mobile Fotos.

Mobile Fotos is an application for managing and uploading to your flickr account. It is extremely well executed and they have thought of everything.

It is incredibly easy to manage your own photos and to access the photos of your contacts. It offers a powerful search functionality and allows you to view photos in the same intuitive way you do with the built in photo application.

Best of all it provides the ability to share a photo through either email or twitter. As a heavy twitter user this has proved invaluable.

Conclusion

This is the tip of a very big iceberg of applications. It was a hard choice to pick my favourite five. For example, I had to leave out Yummy which is the best delicious bookmarks application I have found. I have also had to miss ‘Bible‘ which is a very well thought through application and Instapaper which has been a life saver on long plane flights.

Of course the application I am really excited about is the SlingPlayer for the iPhone. But I am just going to have to wait for that!

If you recognise that the mobile web is important and you need help deciding on a strategy, then book a mobile consultancy clinic.

Book a consultancy clinic or contact Rob about a more in-depth review.

Video: Introduction to WCAG 2

I recently gave an internal presentation at Headscape about WCAG 2. A number of people expressed an interest in seeing it so I made a point to record it.

At the end the presentation I references a stripped down version of the guidelines found here.

I also refer to a quick reference guide to WCAG 2 that can be found here.

Apologises

Apologises for the poor audio quality of this video. Unfortunately the decision to record the presentation was made at the last minute and so we didn’t have a proper mic setup arranged. You can also tell it is not quite as slick as my normal presentations :)

I would also like to apologise for the lack of transcript of this video. Again, it was not my initial intention to put this video online as this was an internal presentation containing my initial thoughts on WCAG 2. I am still learning a lot about the new guidelines and will publish a more considered article when I have a better understanding of the subject.

Feedback

On that subject, I would be interested to hear your feedback on the thoughts I present. Do you agree with my interpretation of the new guidelines? Have I misunderstood anything? Are there other elements I should have addressed? Your thoughts would be appreciated in the comments.

Update: We now have a transcript!

Thanks go to Anna Debenham who braved the horrendous audio to transcribe the presentation. If you cannot face the video we do at least now have a written version!

Paul: Ok, this has worked out a little bit weird because the idea initially with this presentation was that it was really about bringing us up to speed with WCAG2 now that WCAG2 has been released. But I made the mistake of mentioning it online and several people said “ooh, can you record that?” so now it’s a little bit of both, a little bit of a presentation to you guys and a little bit of a presentation that will go on the web.

Paul: So as you guys probably know, WCAG2 has now been released, and as accessibility is a big part of what we deliver and we talk a lot about accessibility, we need to be up to speed on it and we need to know what we’re doing. Obviously accessibility has become such a part of what we do day in and day out that we don’t necessarily think too much about it, it’s almost an intrinsic part of what we do, but with changes to WCAG2, or with the arrival of WCAG2, there have been differences, changes, things that have altered, so I want to make sure that everybody is up to speed with it. Feel free to butt in with questions, that’s absolutely fine.

Audience: Will the video be able to see the screen?

Paul: The video will be able to see the screen. Ok, so, WCAG2. Basically, WCAG1 came out in 1999 which is a good old time ago, in Internet terms that’s like forever, and there was a real need to make some changes and improve WCAG1. Let me just pop back and just explain.

The Journey to WCAG2

Paul: So, yeah, like I said, WCAG1 came out in 1999, it quickly dated as technology evolved, and some of the guidelines actually became harmful in a way. So you guys know that for example, we don’t always take note of what they say about Access Keys, we don’t always take note of what they say about “make sure you put text in an empty form field” and things like that. And WCAG1 was very much built with HTML in mind, and obviously the web is a lot broader than that and there are a lot more formats about. But unfortunately development of WCAG2 was very slow, and also fraught with controversy. I mean, famously with Joe Clarke who is an accessibility expert wrote on A List Apart “to hell with WCAG2″ because it basically had become a bit of a joke, because it was very generic; they were trying to write a set of guidelines that really made no effort to mention specific technology because they didn’t want it to date like WCAG1, but the result is it became unreadable and nobody could understand it.

WCAG2 Reborn

Paul: But, things did change. Major changes were made to the WCAG2 draft and things did improve dramatically. They really listened to the community, and the language in it now is much clearer. So what I want to do now is talk a little bit through what WCAG2 includes and what it doesn’t, and how we’re then going to go about implementing it and how it affects us.

Principles

Paul: Ok, so let’s look at the structure of WCAG2. Basically WCAG2 has 3 tiers to it that you need to know about. Tier number 1 is the idea of Principles. So this is kind of the most generic of the tiers, you know, it’s really kind of aimed at the kind of things you would tell a board of directors that doesn’t really understand anything technical, that doesn’t really understand accessibility at all. And there are 4 principles which are the foundations of web accessibility and these principles I’ll come onto a little bit later.

Guidelines

Paul: Underneath each of those principles are Guidelines. So, within each principle there are 3 or 4 guidelines or a number of guidelines that is different for each principle. But there are a total of 12 guidelines, and these are goals that you should be working towards in order to make your content more accessible to users.

Success Criteria

Paul: Under each guideline, there are Success Criteria. So now we’ve really hit the nitty-gritty, these are kind of specific, measurable goals that you’ve got to achieve. And this is how you judge whether your site is WCAG2 compliant, if you like. So, this is the really important level if that makes sense, but it’s organised within this hierarchy of guidelines and principles.

Techniques

Paul: Now, actually, there is kind of a 4th tier as well which is techniques. So you’re trying to, maybe as designers, you’re trying to conform to the Success Criteria, well there’s a whole load of different ways and different techniques that you can do that and you could read about those, and you could make up your own techniques if you wanted to, but there are some laid down that can help you get going.

Working with WCAG2

Paul: So those are the 3 levels that WCAG2 is built around. Now let’s dive into those a little bit. I had to think about how much detail I want to go into in this room. Obviously we don’t want to go into every technique that you could possibly apply and we don’t even want to go into necessarily every success criteria. That’s really for you guys to look through afterwards. What we are going to do is look at those guidelines and those principles, and hopefully help you to understand where WCAG2 stands over stuff.

Perceivable

Paul: Ok, so, the first… heh, totally illegible text, isn’t that great. Very accessible!

Audience: (laughter)

Paul: So the number 1 principle is Perceivable, and that’s 1 of your 4 principles that you’ve got here. And perceivable is basically talking about “information and user interface components must be presentable to users in ways that they can perceive”

Audience: (laughter)

Paul: Unlike that! (points to presentation)

Audience: (laughter) Is the rest of the presentation like this?

Paul: Yes.

Audience: (more laughter)

Paul: You actually don’t need to read this anyway which is very useful. So, Perceivable is basically about “can you see it?”, that is it as far as the principle is concerned, and the answer is “no you can’t”. But perceivable then breaks down into a series of guidelines. So, let’s have a look at what these guidelines are. So basically, perceivable is broken down into 4 guidelines. And if we talk through each of those it should give you an idea.

Text Alternatives

Paul: The first one is text alternatives. So this is stuff we already know. “Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.” So this really applies to things like video, audio, forms that you create, and interestingly CAPTCHA is particularly mentioned here. And that is a particular accessibility problem that hasn’t been particularly well solved I don’t think.

Time Based Media

Paul: The next way that Perceivable works itself out is in time-based media. What we’re talking about here is that you need to provide an alternative for anything that is time-based. So here we’re talking about captions for video, sign-language maybe, media alternatives, but it also applies to live and pre-recorded video. So if you’re streaming stuff, then you need to think about this as well as with stuff that’s pre-recorded. Now, it does take into account the difference between “crap, how are we going to make streaming video accessible?”. If you read into the guidelines it does give some good advice there. So that’s not quite as scary as it first sounds.

Adaptable

Paul: Anything that we produce needs to be adaptable. In other words, content can be presented in different ways. For example, a simpler layout maybe for people with cognitive disabilities for example. Really, this boils down to things like using semantic markup, meaningful order in your HTML so that if the CSS is stripped away it still makes sense in the order that it is presented, and not relying on colour and other sensory elements to convey information.

Distinguishable

Paul: And then finally it’s got to be distinguishable. So it’s about making it easier for users to see and hear content including separating foreground from background and that kind of stuff. So we’re talking here about contrast, colour, and control over things like audio and video, that kind of stuff. So that’s where we’re at with perceivable.

Operable

Paul: Let’s move onto the next principle which is Operable. So, Operable is about user interface components and navigation, and making them easy to use so that somebody can use them whatever disability they may have. So this again breaks down into 4 different guidelines, the most obvious of which is Keyboard Access. So everything that we produce has to be accessible via a keyboard. So, for example, the Flash video that we’re currently creating for the Wiltshire Farm Foods home page needs to be keyboard operated, alright? Which I bet it isn’t at the moment! And to be fair, it’s part of production, I’m sure they’d put that in at the end if I hadn’t reminded them. That existed under WCAG1, so there’s nothing different there. So everything needs to be keyboard accessible.

Enough Time

Paul: You also need to provide enough time for people to take in the information that they’re being presented with. So giving the ability to pause, stop and control time based material is really important as well.

Seizures

Paul: You’ve got to take into account seizures, some people can have seizures triggered by animation and that kind of thing, so there are various limits that the guidelines lay down about flashing objects and stuff like that.

Navigable

Paul: And then finally it’s got to be navigable. So this includes things like skipping content, having descriptive page titles, tab order, links that make sense out of context, lot’s of headings, that kind of stuff. Is this all making sense?

Audience: Yes, apart from time-based media, I don’t understand that.

Paul: Time-based media, we’re talking about video and audio. So let’s say you had… one of our podcasts. So, there are certain things we need to ensure. One is that it is operable, in other words, a user can pause the podcast if we get annoying, or they want time to take in the information that we’ve said, but the other thing is that we also need to provide an alternative way of them getting it which is why we provide the show notes that we do and the transcripts and stuff like that.

Audience: Ok, well that kind of fits under Text Alternatives and giving it control so it’s under Operable… I just don’t get where it is under perceivable, as a perceivable thing, it has to be perceivable?

Paul: Yeah, basically.

Audience: Video, audio… all has to be perceivable then?

Paul: Yes. Some of these principles and certainly some of the guidelines do overlap to some degree. But when you draw down to the Success Criteria level, of how you actually apply these things, then there are more specific techniques. I think what they did is create a load of success criteria, and then kind of chunked them together in meaningful groups, but sometimes they’re not so meaningful. But it is a vast improvement on WCAG1 as far as being able to understand it.

Understandable

Paul: Ok, talking of understanding it, our next one is Understandable. So this is the next one of our 4 top-level principles, so everything you produce has to be understandable. So what does that mean? Well that results in 3 guidelines. It has to be Readable, Predictable and has to be able to provide Input Assistance. So how does that work itself out in practice?

Readable

Paul: With Readable, we’re talking about making content readable, text content mainly. So this works out in things like setting the language in your HTML, you know, setting what the language is in the header, avoiding using jargon, finally we’ve got a decent reason to go back to clients and say, you know, “you can’t use that kind of language, nobody understands it!”. Also things like abbreviations need to be explained, and also reading level as well, and that’s something I really want to get through to a lot of our clients because a lot of our clients, especially the public sector clients that we have, have this attitude of “well of course, people that look at our site are of post-graduate degree people, and they have excellent reading level”, but that doesn’t take into account things like people that speak English as a 2nd language, who can be very intelligent but not particularly good at reading, also people with Dyslexia can be incredibly intelligent but not particularly good at reading. So reading level is an important aspect of it.

Predictable

Paul: For it to be understandable it also needs to be predictable. So with this we’re talking about things like consistent navigation, and no uninitiated changes. And this is a particularly important one in our world of AJAX and JavaScript and all this cool stuff that we’re doing where we can often trigger events without asking the user’s permission first. When I say “asking for permission” I mean they haven’t clicked on link or they’ve not initiated it in any way. Users need to initiate these actions… and no pop-up windows without them clicking first to trigger a pop-up and being aware of what’s going to happen. It’s all about making it understandable and making them aware of what’s going on.

Input Assistance

Paul: The last guideline under Understandable is Input Assistance. So this is going into the realms of when we do forms, how do we handle errors, what kind of feedback do we give to the user, what labels – are things clearly marked up as labels, are they descriptive of the fields and the forms and that kind of stuff. We’re also talking about help, what additional help are you provided in terms of tool tip and contextual help and anything else that you care to mention. So that’s Understandable, that’s what that principle is driving at.

Robust

Paul: The final principle is Robust. “Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.” In other words, what we build has to work on everything.

Audience: What about AJAX?

Paul: I think that’s where we get into the realm of progressive enhancement, that it’s fine to use something like AJAX as long as, if the AJAX is taken away, it still operates. Or, you provide an alternative version, the guidelines do actually accept that you can do alternative versions of something. So Gmail is a good example of that, Gmail, it actually doesn’t work if AJAX is turned off but they do provide an HTML only version of it which does the same thing. I’m not a great fan of that because it’s twice as much stuff to maintain, and one version become out of date and all the rest of it. My preferred technique is to build it so it works normally, and then to layer on the JavaScript and AJAX on top of it to provide enhanced functionality, which is what we guys have been doing pretty much all along and we need to continue in doing that.

Compatibility

Paul: So that Robust principle actually only comes down to one guideline which is Compatible, so that’s about maximising compatibility with current… listen to the wording of this… Maximise compatibility with current and future user agents, so we also need to be looking forward as well and predicting the future which is always good. But that’s where it comes back to using solid, good code that is’nt reliant on lots of hacks in order to get it to work, and it goes back to the conversation that we’ve been having recently about browser testing, upgraded browser support and that kind of stuff as well. So Compatibility and Robustness is the last principle. The other thing I should have mentioned with Compatibility is this also includes things like validation, making sure that your code validates, and just generally other markup type stuff.

What, no AAA, AA, A?

Paul: Ok, another thing that might have occurred to you is AAA, AA, A.. Priority 1, 2 and 3. Priority 1, 2 and 3 are still there, there are still those levels of conformance, but I get a real sense from the tome of this document, and this is just my personal opinion, people watching this video who know a lot more about accessibility might jump all over me on this, but my sense is that they were playing down those 3 levels of conformance. To be honest, I think I’m pretty keen on that. I don’t think those levels of conformance have done a lot of good generally speaking, because I think it’s kind of developed a checkbox mentality amongst some of our clients “We must be AA compliant” or “We must be A compliant” and they’re not actually thinking about the needs of the users, they’re just ticking the boxes so they meet some quota that has been established somewhere. One of the things that’s quite interesting, and I’m not sure if it’s a change from WCAG1 or not, I couldn’t find the reference in WCAG1 but again someone will correct me no doubt, but conformance in WCAG2 seems to be on a page-by-page basis. So you’re no longer in a situation where you want to claim conformance so you’re claiming conformance for an entire site, but you’re rather conforming on a page-by-page basis. And this allows you to basically pick-and-mix the level of conformance you want to reach on any particular page which is much, much more sensible because there are some elements where you might be building a particularly complex application that really isn’t going to manage being AAA compliant, whereas the rest of the site is AAA, and this one page isn’t. So it’s giving you the ability to mix and match. In fact, in the guidelines it says “It is not recommended that Level AAA conformance be required as a general policy for entire sites because it is not possible to satisfy all Level AAA Success Criteria for some content. In other words they’re saying it’s just not possible to be AAA in some situations, so don’t even try.

Start With Basics

Paul: So how does this relate to what we do on a day-to-day basis? Well, I think the language we use with our clients pretty much will remain consistent with how it was with WCAG1 which is that we need to start of by encouraging all our clients to start with the absolute basics. A lot of people are put off of accessibility because of the enormity of it, of all the things they’ve got to do. And even to be single A compliant there is quite a lot to do if you’ve got a site that has never been built to be single A compliant before. So I think our attitude has got to be that you work towards this over time, it is an ongoing process, you don’t need to do it all in one big go and that you need to start with the absolute basics, the quick wins, the stuff… you know, it’s the 80/20 rule, 80% of the problems that people are going to encounter from an accessibility point of view is caused by 20% of the accessibility issues if that makes sense. So we can solve a small number of issues but have a big impact on the site. So we’ll start off with some real basic stuff. Things like putting in “alt” and “title” attributes, providing alternatives to media, things like video and audio, being aware of JavaScript and the problems that JavaScript can create if it’s not implemented correctly, providing resizable text so that the user has the ability to either increase or decrease the text size on sites, to build everything to be standards based because that makes it so much easier in future.

Audience: Aren’t we moving away from resizable text?

Paul: We’re moving away from the resizable interface where the whole thing scales up and down, but there’s no reason why we can’t keep the text itself rescaleable. The layers should be able to push up and down. It has to be said with resizeable text, it is becoming less of an issue. The reason it’s becoming less of an issue is because browsers now have this zoom functionality built into them. But I don’t think we’re quite there yet to be able to drop resizable text entirely is my current feeling… I’ve got mixed feelings about it. But the obvious aim we’re going for here is to be single A compliant.

Build Over Time

Paul: So all of this is about building accessibility over time. Taking the guidelines by themselves is not going to be enough, and taking this checkbox mentality that I talked about earlier is not going to be enough. Once you’ve done these quick fixes, the next step on from that is to start consulting with your community. We need to encourage our clients to start talking to their users and find out what accessibility concerns they have. I also think, which I think we’re quite poor at, that we need to start testing with real users some of the accessibility stuff that we do, and the big problem there is persuading clients to pay for that. It’s really hard to get clients to pay for that kind of testing but I do think that it’s a really useful thing to do, and there are organisations out there that provide people you can get in to do testing, or that you can send sites out and they test with them. So, testing with real disabled users is really worthwhile. I think it’s about identifying major issues and dealing with those first, just pragmatic kind of prioritisation of issues, something you do with usability. With usability you look for the quick wins and the showstoppers and those you deal with first, exactly the same with accessibility. Now, what the major showstoppers are for those navigating the site need to be dealt with. And over time you build towards AA and AAA compliance if you can. But you only do that maybe on some pages. The big concern clients have and the reason they get into this check-box mentality of saying “we’ve got to be double A or we’ve got to conform to the WCAG guidelines” is fear, a fear of litigation. Especially our bigger clients, they’re really worried they’re going to get serious issues. But I think it’s important to stress with clients that litigation doesn’t happen overnight. You don’t suddenly have come through the post a writ saying “you need to come into court about this accessibility issue on your site”. It doesn’t happen like that. What happens in reality is the user complains. And if the user is repeatedly not heard and not listened to, and not responded to and not cared about and rejected, they get angry enough to maybe approach someone like the RNIB who then take it on into litigation for them. That’s the reality of what happens.

Quick Response

Paul: So as a result, you can diffuse that by responding to complaints quickly. So as you’re building up over time with the accessibility policy, if someone does complain, you need to write back to them and you need to deal with that issue straight up. Ok, so that’s how the client should be dealing with all this and there’s loads more I could say on this but I don’t want it to go on forever.

Headscape’s Approach

Paul: Let’s briefly talk about Headscape and our approach and how we should be approaching the subject of accessibility.

Establish Approach With Client

Paul: Well first of all I think everything that we do in our approach should be in conjunction with the client. I don’t think necessarily we talk enough to the client about accessibility. Some clients are just so bamboozled by it that they want us to take control, others want a say in it and what to be reassured that we’re doing something about it. So I think there’s a dialogue that we need to make sure happens. And if a client just wants us to take control of it, that’s great. If they want to be involved in the process, then that’s great to but we need to engage with the client and talk to the client more about it.

Remain Pragmatic

Paul: The second thing and I think this is really important is that we need to remain pragmatic in our approach to accessibility. Everything I’ve been talking about before like building up accessibility gradually, about doing the quick wins first and the show stoppers and that kind of stuff, that’s all pragmatic. I don’t want us on one hand to ignore accessibility, and it needs to be an integral part of everything we do, but on the other hand you can become extremist about it. We could spend hours and hours trying to get something to work in every conceivable user agent in the world and we can worry about every type of disability to the point where it becomes like a paralysis that stops us actually doing anything. So there’s a real balance that we need to strike here. And we need to strike that with our clients and working with our clients.

Have a rationale

Paul: Now I think it’s worth saying that if we decide not to comply with a guideline for whatever reason, we need to have a rationale for that. So we might not conform even to single A compliance in certain situations, although to be honest I can’t think of any off the top of my head, but if we do decide not to conform, we need a damned good reason why not. In other words, we need to have thought about it. And the other thing about accessibility is that we always think about it at the end of the project. It’s too late by then, we’ve built everything. So it really needs to become an intrinsic part of everything that we do.

Responsibilities.

Paul: Let’s talk about the idea of responsibility here and whose responsibility accessibility is within Headscape. Basically I’m going to say, everybody. One of the absolute great things about WCAG2 is because it’s got this 3 tiered approach, it is “accessible” to everybody. It’s understandable by everybody. So therefore it can be everybody’s responsibility to keep an eye on accessibility. And so this is how I think it should split down.

Sales/Client – Principles

Paul: Marcus and Chris and the Client should be worried about principles. The Operable, the Perceivable, those basic top-level principles. And you should be looking at anything that goes out from the company and going “well is that really operable?” So you can take a very top-level approach to it. And I think as you talk to clients as well you take this very top-level approach to it. That’s the level you guys should be working at.

Guidelines – Project Managers

Paul: Project managers, I think you need to be looking and understanding from the guidelines point of view. So you need to go in and read what those guidelines are, and you need to be sure that you understand them. And as you look at any work that goes out from the company, you need to be thinking “does it conform to those guidelines?” You don’t necessarily care about the nitty-gritty of how those are measured, or the nitty-gritty of how they’re achieved, but has that guideline been met? That’s the level you need to be working at.

Success Criteria – Designers and Developers

Paul: Then when it comes to the designers and developers, you need to get right into these guidelines. And you need to understand the success criteria and how to apply the guideline and how to make them work in practice.

Check Everything

Paul: So basically, we need to be checking everything that goes out the company for accessibility. And I have to say I’m making the mistake of saying this on camera, but I think we’ve got a bit lax recently when it comes to accessibility. We reached a point where it was becoming quite intuitive to us, and we were doing it quite naturally, and then as a result of that, we stopped checking because it was the natural process of what we were doing, and then bad habits start to seep in again. So WCAG2 is a great opportunity for us to say “ok, we need to start reviewing everything we’re doing as it goes out again”. So I’d really, really encourage you to check everything.

Needs to be second nature

Paul: basically we need to get to the point where this is second nature to us, so that we’re doing this intuitively again, but not to the point where we’re no longer checking.

Audience: Clients often say “what’s the difference? If I just got for single A compliancy, what won’t my site be reaching?”

Paul: I have to say that I think I would stop talking about double A, triple A and single A compliancy. I don’t think there’s really any value any more in talking about that to the clients.

Audience: I think there is because having the page by page conformance is a really good thing and that we can now argue that yes, we can now make the majority of your site triple A compliant, but for a page full of videos, we can make it single A compliant.

Paul: Ok

Audience: Clients will continue to reference it in briefs. You can’t not talk about it.

Audience: I think it’s actually quite a strong thing.

Audience: is it a page by page compliance, or template by template compliance?

Paul: I think it has to be page by page because the content that goes into the page, into the template, could invalidate it. This is why I think it’s something that should be downplayed. I accept the clients will still talk to us about it, but clients still talk to us about doing speculative design, it doesn’t mean we do it. I think there’s an education thing there whereby we need to move clients away from being obsessed by double A, single A compliance, and to start thinking about accessibility policies. What is there accessibility policy and what is it that they are trying to achieve on their site? Our base mark is going to be single A, it’s always single A, and I think it should continue to be single A.

Audience: but if you don’t talk to them about it, you could argue that less caring clients would just say “well why would I do anything about it, bottom line?”

Paul: Yeah, I said you shouldn’t talk about single A, double A, triple A, but that doesn’t mean you can’t talk to them about accessibility and the improvements that accessibility brings because for people that have got that sort of attitude you don’t want to talk about the disabled if they don’t care about the disabled, you talk about search engines, and that’s the best way to sell accessibility, by talking about search engine placement. That’s the reason you want to be accessible for people who have that kind of attitude. For those that care, and are talking about single A, double A and triple A, you need to say to them “well actually, conforming with any level, it’s great that you want to do accessibility, and certainly single A should be an absolute minimum, but we’d encourage you to start working up an accessibility policy and looking at your site as a whole and say could this area do more in your site, your accessibility policy should do real world testing with real users…” all kinds of things.

Audience: So you think that we should be encouraging large organisations that have accessibility policies themselves that refer to double A, triple A, to try and persuade them to kind of move away from that?

Paul: No, not necessarily, I wouldn’t go that far. Don’t get me wrong, I’m not saying that they’re a bad thing, I’m saying they’re not the be-all and end-all. And at the moment I feel like the vast majority of clients think they are the be-all and end-all. They’re obsessed with putting that little badge on the bottom of the page. And it’s not about putting badges on the page. The trouble with institutions that have these policies of single A, double A and triple A is that these policies are in place for the institution, not for the user. And that’s my problem with them. That’s why I think we should try to break that mentality with clients. And I accept that sometimes we’re going to lose, and that’s fine. Exactly the same goes when we were talking about browser support. I accept sometimes we’re going to lose that battle as well. But it doesn’t mean we shouldn’t try and fight it.

Audience: I just wondered why WCAG2 still does it, because yes, you’re right basically, and accessibility requirements should be based on user requirements and not ticking boxes, so why is it still in there?

Paul: I think it’s in there because… my impression… I hate talking about accessibility on camera! You remember what happened last time in the podcast? It was just a nightmare! I think the reason it’s still in is because some of those success criteria are hard to meet. Some of them are damn difficult. When you start talking about streaming video, you’ve got some difficult challenges there that need to be met. So I think as a result, what the W3C is saying there is that we accept that some of these things are difficult to do. And we accept that you’re not always going to be able to do them, so we’re going to make them triple A. But come on guys, some of this stuff is dead simple and we should be doing it, that’s single A. That’s my impression of the mentality behind it, and that’s a great mentality, but it’s when someone changes that to being guidelines, which is what they are, to being rules, really instilled by Moses and presented to the people. You know it’s not that and I think that’s an important differentiation to make.

Where to Start

Paul: I know what you guys are like, especially designers. Ok I’m making sweeping generalisations here. But, if you guys go along to the WCAG website and you look at the WCAG2 guidelines, it’s horrible! It’s intimidating and it’s scary and it goes on for pages. And there’s a lot of text around it.

Audience: There’s no pictures? (laughter)

Paul: There’s no pictures! The design isn’t even very good. So what I’ve done is I’ve taken that page, I’ve literally all I’ve done is I’ve stripped out the explanation text in front of it, and the waffle at the end of it, and I’ve left you with just the set of guidelines so it looks like a slightly less intimidating list. Not much but slightly. So that’s up at http://www.headscape.co.uk/WCAG2 so if you go to that, you can get just the actual list of criteria. There’s also, on the WCAG2 website, there’s a thing where you can go and you can say my site uses tables, my site uses video, my site has this and that, and you untick the ones that it doesn’t have and it narrows down the list of success criteria to only show you the ones that you need to care about. So you might want to check that one out as well. Ok, so that’s basically all I have to say, are there any other questions before we wrap up?

Questions

Audience: Clients are going to ask us the 1 minute elevator pitch. What’s the difference between WCAG2 and WCAG1? What would you highlight as differences?

Paul: I think there’s a bigger acceptance of things in the world other than HTML, so things like Flash, PDFs, all that kind of stuff, there’s much more reference to that kind of thing. It’s much better written, much better organised. I think it’s more pragmatic. It’s a little bit more… I think it will last the test of time more. It’s hard to pin down exactly what I mean by that. There is actually a document out that talks about the specific differences between WCAG1 and WCAG2 if you wanted to get into that level of detail. And to be honest, I couldn’t tell you what that is yet because I haven’t looked at it in that much depth myself.

Audience: I think you and I do need a couple of the more detailed stuff, to get the guidelines, just one or two examples basically. Something that’s new between WCAG1 and WCAG2, and also some of the differences between single A, double A and triple A. The streaming video is an excellent example.

Paul: Just go along to http://www.headscape.co.uk/WCAG2 and you’ll be able to see those different levels.

Audience: It seems like, an almost unwritten principle, or unwritten in your list of principles. It’s technology agnostic.

Paul: WCAG2 started off as so technologically agnostic that it wasn’t understandable.

Audience: WCAG1, the first line is all about “it must be W3C technologies”.

Paul: Yeah, it will pretty much accommodate anything. You know, it talks in terms of audio and video. It doesn’t mention Flash for example specifically, at least I don’t think it does, but it refers to those kinds of things. It refers to documents that are not HTML. I’m saying this as much for the video as anything else, I’m still learning about it as well. So I think it’s going to be a learning process for a while for us to really get to grips with this, and truth be told we probably should have started a little sooner than this, but it’s not radically different from WCAG1. This is as much getting us back into the habit of thinking about accessibility as anything else really. Ok?

Audience: 1 more question. Are they new Keynote animations?

Paul: Yeah, they are new Keynote animations.

140. Launch

In this week’s show GetSignOff has finally launched, we talk about how to use web stats to improve your site and we answer your questions about roles with web design and should you help clients with hosting.

Play

Download this show.

Launch our podcast player

News and events

Acid3 receptions and misconceptions and do we have a winner?

The team that develop WebKit, the open source web browser engine that Safari and the new Google Chrome are built on, have just announced that the engine passes the Acid3 test developed by The Web Standard Project (Wasp).

So what is Acid3?

Acid3 runs a series of tests against a given browser and produces a score, the goal being 100/100. This score is generated from how "standards compliant" the browser is. For example whether it supports CSS2.1 styles such as "inline-block" and "pre-wrap", if it supports SVG-Fonts, what DOM features is supports and a whole range of other criteria.

So WebKit passes!

Does this mean we should ditch Firefox, IE and all the other browsers in favour of Safari or Chrome, well no, and that’s what Lars Gunther is talking about in his article over at WaSP.

It’s great that tests like Acid3 exist and that browser developers endeavour to build better browsers because of them. All in all it results in a much better experience for the average user and makes our lives as Web Designers much more hassle free.

6 Things To Like About Dreamweaver CS4

So Dreamweaver CS4 became available this week, 15th October to be exact and Alex Walker over at Site Point has been having a play and has shared with us 6 thinks he likes about the new release. Check out his article for details of each, but a summarised list is:

  • UI/Workflow Improvements
  • The Related Files Toolbar
  • Code Navigator
  • Live View
  • Advanced JavaScript Interpretation
  • Making JavaScript Unobtrusive

From reading the article these improvements over the previous version look really promising. One feature that really caught my eye is "intelligent code completion" for JavaScript and the most popular libraries such as jQuery, MooTools, Prototype etc, the same way it does for HTML!

It would also appear that Adobe are making big improvements to the "Display View" of Dreamweaver, which has historically been the stigma plaguing most "professional" designers who use it. The "Display View" now has integrated code navigation, so you can use it to jump to specific elements within the page and Adobe have also built WebKit into Dreamweavers core so you can run your site through the software to test JavaScript, rendered CSS, server-side code etc.

So will these new features encourage more people to use Dreamweaver?

7 Ingredients of Good Corporate Design

Smashing Magazine has published a great article that discusses 7 ingredients to good corporate design. They break the discussion into two elements:

  • Design as artistic representation, which consists of:
    • Logo
    • Typography
    • Colours
  • Design strategy, consisting of:
    • Brand
    • Quality
    • Community
    • Culture

It’s important to understand that corporate design isn’t simply of a graphical nature but is intrinsically linked with your strategy, the goals that you set and how you implement them and this article is well worth the read.

Back to top

Launch: GetSignOff Goes Public

Monday GetSignOff finally opened to the public. It has been an interesting journey read more here.

Back to top

Feature: Using Web Stats for More

We all use web stat tools like Google Analytics for tracking marketing campaigns. However, they can also be used to improve your site. We discuss this in this weeks feature.

Back to top

Listeners feedback:

Salesman seeks designer/developer

Got this audio question from Andrew:

Hi Paul, hello Marcus and hi to all the people who work at the show. I live in Canada so hearing your nice English voices through my headphones is great. My name is Steve and I’ve done some freelance web design for clients in the past, but the part I enjoyed the most was the selling cycle; being able to explain to the client what a standards based website could do for them and then persuade them that investing in such a site would be wise for their business. I bet there’s a lot of designers and developers out there who are absolute Jedis when it comes to coding CSS and HTML but really hate the selling part. And then there are people like me who can really sell well but I wish I could work with people who are amazing at building websites.

My two-pronged question is as follows:

Is there a website or another resource that would allow people like me, who love web design, but are more business/marketing oriented to touch base with people who are in the opposite situation? And I’m thinking more than just a job board here, I guess the best analogy would be something that Marcus might be familiar with – adverts in the back of music magazines that would say something like ‘band seeks drummer’ or ‘talented singer needs people to play instruments’.

My other question: how did you guys do it at Headscape, were you all great at coding and someone had to get pushed out the door and start selling or were there very separate roles from the beginning?

Ok, part one first (I’m original aren’t I)… the ‘band seeks drummer’ analogy is good but I much prefer a dating agency analogy! Cuddly, financially sound salesman WGSOH seeks quiet, intense, practical developer for fulfilling relationship. :-)

As far as I am aware, sadly, this service does not exist. Forums, like the Boagworld forum, have got to be your best bet.

Right, part two. Much as I would love to claim that I used to be great at coding before they kicked me out of the door to do the selling, it would be a blatant lie. When Headscape started, the three of us came from different disciplines – Paul was designer/tech (it’s true!), Chris was project manager and I was salesman. We soon didn’t have enough design/tech resource and started to recruit but the fact that a) Chris was organising and pushing projects along and b) that I was concentrating on bringing in new work meant that we were running things like a larger agency (more efficiently and with less risk) very early on.

I have banged on about how important effective selling is in the past many times so won’t repeat myself here. The only thing I will say is that having totally separate roles is not necessarily a good thing. Even now, we don’t have very separate roles. Chris and Paul are both heavily involved in the sales process and always have been. In my view, it is the responsibility of the company directors to se
ll.

But, added to that, Chris and I also do a lot of consultancy work (requirements analysis, IA work etc), and Paul still does design work. This is important because it keeps our ‘hand’ in. Getting too involved in one role can often lead to a lot of potentially out-of-date talking, and very little ‘doing’.

Do/should you help clients’ with hosting?

Hi all

I’m just about to do a ‘simple’ website for a friend (aka my 1st client) which will try to market something he is looking to rent out. Whilst I’m confident I can do the website, I’m not sure how far I should go with helping/organising his hosting. The client doesn’t know anything about hosting and doesn’t have any hosting space with his broadband provider.

Now I don’t really want to get into organising hosting unless I have to, so I’d just like to know what the ‘norm’ is in this regard? As a web developer/firm do you automatically sort out hosting, do you get the client to do it and then give you the hosting password so you can upload the site? Is it even a good/lucrative idea to get involved in sorting this out as part of the ‘service’? Can people suggest what they do please?

Thanks, Alex

This question came from the Forum and there are already some interesting posts in response. The biggest issue here is:

Can you support this website?

Can you provide support if the site goes down in the middle of the night, on Christmas Day, or even when you’re on your two week break to Spain?

If you decide to sell hosting then you become a middle man between your client and the hosting company. Your client is contracted to you to provide and support hosting, not the hosting company. Of course, you have a relationship with the hosting company where they will provide an agreed level of support but… you are still the person that has to deal with your clients’ issues as and when they arise.

At Headscape we are completely open about this with our clients. We tell them that we only provide support (of any kind) on working days between 9am and 5.30pm. We’re not set up to do anything more than that.

However, we do offer hosting for those clients that feel that the level of support that we offer is enough. We have our own managed platform and we also act as a reseller for a large hosting company.

The solution for those clients that require a superior level of service is simple. The client buys the hosting directly thereby taking you – the agency/freelancer – out of the loop. We specify technologies, discuss the level of support required, amount of bandwidth etc with client – we will also set up the site on the web server – but the client orders and pays for the hosting.

This has worked really well particularly for the larger, busier sites that we have developed.

All that said, if you act as a reseller, and you have enough clients, you can make a decent profit via hosting. However, don’t be fooled into thinking that it doesn’t involve any work keeping all those clients happy and up to date. If you have enough clients to make money out of hosting then it’s very likely that you will have regular hosting issues to deal with and constant renewals to deal with.

My friend and colleague, the long suffering Mr Scott, has many times said that he wished we had never touched hosting simply because it often ends being a constant irritation that gets in the way of project work and rarely pays for itself.

Back to top

138. Freeform

In this week’s show the entire boagworld production team answer listener questions.

Play

Download this show.

Launch our podcast player

Watch the behind the scenes video

We were really excited to have all of the boagworld production team in one place. This included…

They came to visit myself and Marcus at the Headscape office, so we thought we should record a show at the same time.

Obviously, the normal format was not going to work with 5 people, so we decided to do something different. This week’s show is a panel based question and answer session. All the questions were submitted by listeners and thanks so much to those of you who took the time to send them in. Sorry we didn’t manage to do them all.

The show was recorded live and so is a little rough around the edges. I apologise if the audio is not up to our normal standard.

Also, because of the somewhat chaotic nature of this week’s show there are no show notes. Apologies to those of you who follow the show in written format. Normal service will resume next week.

Head Conference

For those of you waiting for the boagworld discount to the Head conference, your wait is over (almost!). On Friday 10th October for one day only the price is going to be slashed by 20%. You don’t need a discount code. Just visit the site on that day and buy a ticket.

An interview with Freelancer Magazine

I have just finished an interview for Alex Stubbs over at freelancermagazine.com. Being a clever cookie he massaged by ego and convinced me to take part even though I am on a family holiday in Scotland.

I hadn’t come across Freelancer Magazine before, but it certainly looks like a superb site. If you are a web design freelancer or are considering making the swap then definitely check it out. It has great features, useful resources and of course star studded interviews!

But before you disappear over to their site take a look at the interview.

Thank you, Paul, for taking the time to speak with us.

Absolutely!

So how are you enjoying your vacation in Scotland?

Scotland is one of the most majestic places in the world. At least if it isn’t raining. I have found it incredibly inspiring being out of the office and away from the web. I have achieved so much more here because I am free from distractions.

Getting to the meat of our discussion is your weekly podcast on Web Design, which is to date the longest running and most popular web design podcast.

I believe you started this in 2005 and it has been gaining more and more recognition since. How do you feel this medium has served you and your web presence over the years?

I was very fortunate to stumble into podcasting. I started out blogging but found that hard work. I love writing but find it much harder to express my enthusiasm and excitement for a subject. Podcasting was a natural fit for my personality.

I doubt you would not be interviewing me if it wasn’t for the show. It has done a huge amount for my personal profile and that of my web design company Headscape. It is also what has enabled me to write the Website Owners Manual too. I doubt any of that would have happened if I had just stuck to blogging. There are simply too many blogs around. You need a way to stand out from the crowd and in my case that was through podcasting.

Any future plans for video podcasting?

I have thought long and hard about video podcasting and yet I do not have an answer for you. On one hand video podcasting is hugely popular and an enormous growth area. It would also enable me to show code and designs. This is something that constantly frustrates me about audio podcasts.

However, on the other hand I am aware that many people listen to my show while walking the dog or commuting to work. You cannot watch a video podcast in such circumstances. Video demands your attention in a way audio does not.

Probably at the end of the day it will come down to return on investment. Doing a full blown video podcast is a lot of work. Unless we can make it pay for itself I doubt it will happen. For now people will have to be satisfied with the audio show and the live ‘behind the scenes’ video stream.

You also have a new project in the works which has gone live recently on boagworld.com: “The Website Owners Manual. Which from what I’ve read seams to be an evolving manual for anyone interested in running a successful website (from start to finish)….

I am really excited about the Website Owners Manual for a couple of reasons. First, there are so few books aimed at website owners or managers. They are all aimed at designers and developers. However, the client is key to the success of a project and there are certain things they need to know. Second, I am excited by the way this book is being produced. Instead of simply being published, this book is evolving through social participation. You can get access to chapters right now and have the opportunity to comment on and contribute to those chapters. I collect your feedback and adjust what I am writing accordingly. At the end of the process you get the final product. Its publishing 2.0… or something like that .

Sounds very progressive! Here at FM the bulk of readers seem to be beginning freelancers who themselves will need to know a bit of knowledge you’ve outlined in this manual… what points do you think this book would be most important to our readers?

I think the main thing will be how to better communicate with clients. The problem with most people who choose to start freelancing is that they under estimate the challenges of dealing with clients. You might be the best designer or developer in the world, but if you cannot deal with clients effectively you will fail. The website owner manual shows you what clients need to know and demonstrates ways of presenting that information to them.

So you’re the Creative Director at Headscape, you run a weekly podcast, you speak at numerous web design and marketing conferences, and still find the time to write a book. I think even David Allen himself would be proud… whats your productivity secret? Whats your daily life like?

I am a huge fan of David Allen and follow the Getting Things Done methodology closely. However being organized is only half the battle. The other half is recognizing what you are good at and sticking to that. I know I am an ideas person. I am great at starting stuff and terrible at finishing it. I therefore surround myself with people who are good at following through.

At Headscape I have three fellow directors who are expert at managing me to be at my most effective. They bring me in for short bursts of activity when a load of ideas are required and then quietly push me to the sidelines when the REAL work begins.

With the podcast, I rely heavily on the community to make it happen. There are people who transcribe the interviews, moderate the forums and even produce the show. There is Paul Stanton who helps me source news stories. Ryan Taylor produces the show by organizing guests, writing show notes and much more. Finally there is Anna Debenham who is our technician. She edits interviews, manages the site and handles the RSS feed.

These people all give up there time because they love the show. That makes me feel very honoured. I would be lost without them and feel guilty that they don’t get more out of it.

You started out as a Web Designer and evolved into other areas since, I’m guessing mostly due to your success with your podcast. How was your early experience when starting out as a Web Designer?

I started out designing for the web back in 1994. I was working for IBM producing CD-ROMs for the first generation of multimedia PCs. While doing this IBM decided to start taking the web seriously and so I got involved very early on.

I was just a junior designer which was why I was given the web stuff. It just wasn’t important back then. My career ended up growing in line with the growth of the web. As the web became higher profile so did my job until eventually I ended up working as a creative director at a dot com company in the late nineties.

Basically, I just lucked out. A lot of success is luck. The idea that successful people are in someway more talented or better is just not true. It is about being in the right place at the right time. That and having a big mouth and being willing to shout about how good you are!

What advice do you have for those looking into starting out as a Web Designer themselves?

Wow that is a hard one. Its very different starting out today compared to my experience. That said, here is my gut reaction.

First, know the basics. Focus on HTML, CSS and Javascript before anything else. Don’t get distracted by the latest fad or the more exciting trend. These are the fundamental tools you will always need.

Next, find talented people you admire and get alongside them. Don’t be shy in approaching them. In my experience they love the attention!Follow their work, ask questions and look at who they follow and admire.

Finally, get involved in the web design community. Go to meetups, conferences and other events. You will learn so much from your peers. Far more t
han from a book
or university course.

128. Details

On this weeks show I’m accompanied by our Producer Ryan and Researcher Stanton. We Interview Dan Rubin on the Details of Design, and answer your questions on managing a bigger team and terms and conditions.

Play

Download this show.

Launch our podcast player

News and events

Silverback Launches

This week has seen the release of Silverback, the highly anticipated app from the guys at Clear:Left. After months of speculations about what Silverback actually was, the “spontaneous, unobtrusive, usability testing software for web designers” is finally available for download.

We’re sure a majority of you know all about Silverback, but for those of you who don’t, Silverback, which is available exclusively for the Mac, is Clear:Left’s answer to convenient usability testing on the go. Utilising the iSight and screen capture facilities of the Mac, user’s experiences can be recorded and reviewed at a later date, taking away the costly and often difficult to setup up approach of using specialist equipment like multiple camcorders which can lead to hours of time spent trawling through video footage.

PatternTap

Whether you’re a designer or developer, there are many occasions where you go on the hunt for inspiration in interface design. Normal CSS Gallery sites give you great examples of full site design, but usually don’t focus on the small details of interface design. The only site i’ve ever been aware of is Christian Watsons “Elements of Design“, which is a great resource showing examples of elements like comment forms, calendars & date pickers, footers, image captions and so on.

There’s a new site I’ve come across this week called PatternTap.com which also wants to collect these design patterns and focus on specific elements of design and to help you to reference, collect and organise them for your own needs.

PatternTap is shaping up to be an absolute goldmine of inspiration, and looks like it will build into a large resource of design element exmples. There’s currently 46 collections, everything from 404 pages, audio players, pagination and search boxes. It let’s you create your own “lightbox” style user sets, so you can keep your favourite examples organised for future reference.

I’ll definitely be adding this to my toolbox of design inspiration links, and recommend you give it a look too.

Google App Engine Update

This week also sees the release of a small update to the Google Apps Engine. The Google Apps Engine allows developers to build applications on Googles own infrastructure. I have to admit that the Google Apps Engine is not something I’ve developed with personally however that doesn’t stop us talking about it so let’s run through the list:

  • Firstly you can now have up to 10 apps on your account as opposed to the previous limit of three 3, the Engine also limits developers to 1000 files per application, so the increase in the number of apps you can now have is a welcome addition.
  • Time windows for Dashboard graphs: Zoom in on the data in your dashboard to get a more accurate picture of whats going on. You can zoom in to see graphs for the last 24, 12, and 6 hour periods.
  • Log files can now be downloaded in plain text.
  • And finally you can send email as the logged in user: If you’re using the users API, you can now send email from the email address of the currently-logged-in user were as before it was only possible from the administrators account.

S3

So some of you may be aware that Amazon’s S3 service suffered from some 6 hours of downtime recently, this echoes the issues of service availability that happened back in February.

For those of you who don’t know, the S3, or “Simple Storage Service” is a scalable and inexpensive data storage infrastructure, which allows you to store and retrieve any amount of data.

So this is a fantastic idea – in theory, it means that if you’re developing a large website or web app and need lots of storage, you don’t have to pay for huge webhosting plans with lots of physical diskspace, you store your assets “in the cloud” as it were, and you’re charged based on how much storage space you, and how much bandwidth you consume.

Lots of large sites rely on the S3 service for their storage needs, Twitter, BaseCamp and SlideShare to name but 3 and the recent downtime has raised the age old issue, “are we putting all our eggs in one basket?” Jonathan Boutelle put it best in a recent blog post, stating “When S3 goes down, the internet goes down”. Aral Balkan also wrote recently urging people to have contingency plans in case events like this happen again, stating that the Open Source Google App Engine SDK could be the answer.

Back to top

Interview: Dan Rubin The Details Of Design

Paul:Joining me today is Dan Rubin who I recently saw at the @media conference. Good to see you or speak to you again Dan should I say?

Dan Rubin:Good to speak to you Paul.

Paul:It was good to meet up with you at @media. It feels like a long time since we met up and it was great to hear you speaking there. That was a first for me.

Dan Rubin:Thanks. It was a privilege to be able to help out Patrick it being very last-minute.

Paul:Oh was it?

Dan Rubin:He sent me an email about two weeks prior saying someone had dropped out and of course I wasn’t going to say no.

Paul: laughs

Dan Rubin:It’s been over 10 years since my last trip to the UK, so it was a great opportunity.

Paul:Cool. Well I have to say considering you only had two weeks to put together the presentation, it was truly phenomenal. It was an excellent presentation and I really enjoyed it. You were talking about ‘design is in the detail’ I guess was the kind of subject you were tackling?

Dan Rubin: I’ve been talking a lot lately about the level of detail, the attention to detail and the design and I’ve done a couple of presentations with Brian Veloso over the last year on that same kind of topic. This was an extension of that injecting some of my own little personal preferences into the talk and got to cover things like typography and some of the simple practical things that you can improve very easily that result in a big improvement and typography, and little tricks in using grids, not on how to make them but how to actually implement them and how they can help workflow and bring things together and make layouts tighter and better without
that much effort and the same thing with digital transformations in photography and a lot of pixel detail that a lot of people don’t notice and its all about the subtle level of design.

Paul:I got this vague feeling that as you were talking you were a little bit appologetic for some of these manushi that kind of individually you sit there and go ‘how is anyone going to notice that?’, but accumulatively they have this effect on the design don’t they?

Dan Rubin:Well that’s the thing. It comes down more to feeling than seeing but its about as a designer what you feel with your eyes more than anything else and how that translates to what users or viewers or readers also feel but since they don’t know it is there, they are likely to never actually see it, but as a designer you’ll know it is there, you can see it, and the trick is to get it to the point of you can still see it but it is not really visible it is just felt.

Paul:A subconscious expression?

Dan Rubin:Yes.

Paul:You covered loads of tips in your presentation and there was some excellent stuff in there but if you had to pick out one that has the biggest impact on a design, which of the many things you talked about would that be?

Dan Rubin:I think what it would be is to really underscore trusting your eyes and it seems a really simple concept and whenever I put that up on the screen you get giggles from the audience. The truth is many of us don’t actually take the time as designers to just step away and look at what we’re working on. It doesn’t matter whether it is for screen or print. The medium is a material at this point and it is just having faith in what you see and what you feel. That’s what being a visual creative is all about. It is trusting what you see. It is the same as being a good musician comes down to trusting what you hear and sometimes we forget that, and we start getting into designing based on the rules or how we think we are supposed to do things or designing on technical limitations alone. When we do that we stop using our eyes.

Paul:It’s interesting in the presentation you talk quite a lot about some of the details and the mechanics of design. You were talking about font sizes going incrementally up, your heading and your sub headings and there being a mathematical relationship in their sizes. You talked about being consistent in your margins and padding and how all those things inter-relate. Are we saying that design is something that can be learnt and it is a mathematical thing and it’s a set of rules that you just adhere to? Or is there some sort of underlying artistic thing, some people just know how to do it and it’s not something that can be learnt. What’s your opinion on it because I get mixed feelings from you? On one hand you talk about these rules and on the other hand you talk about stepping back and looking at your design and it feels more kind of arty-farty if that makes sense!

Dan Rubin:What a load of questions and rightfully so! It’s something I’ve written about before years ago and had a bit of back and forth on the topic with Paul Scrivvens of 9 Rules, with him arguing that you don’t need any natural artistic ability because he didn’t think he had any, yet he was clearly doing things that looked good. I was arguing the opposite but when it comes down to it it’s really not something that you can say definitively either way. Just as there are people who naturally seem to be good musicians or good athletes or good at math and programming, there are people who seem to naturally be good at design and any kind of creative endeavours. It is really difficult to tell whether that seeming innate ability has come from something that happened in very early childhood development or if they were born with it. I do think that however difficult it is to put a finger on it, once you get old enough, especially to the point w here probably most of your listeners are doing what your doing for a living already or you are thinking of changing from one thing to another, you’re past that point of subconscious development where you need to put conscious effort into something and you can. I think you can be trained to do most of the things designers do. You can even train yourself to see the way that creatives see. The older you get the harder it becomes to incorporate into the way you view the world. That is a big part of it. That comes down to sometimes the different personalities. How hard is it to put a finger on what makes you ‘you’. I would say as a teacher, and I spend a lot of time teaching high school students over here about music as well, since that’s my other passion, and it’s specifically not just playing music but it’s specifically singing which is one of those things that you can either carry a tune or you can’t. I’ve also seen kids who can’t carry a tune when they start singing learn how they train themselves. They learn the proper muscle memory, and it’s amazing to see what people can actually accomplish when they put their mind to it. If you are listening out there and you want to become a better designer or maybe you’re not a designer and you’re a programmer or a web standards junkie, and I can say that because I am one too, and there isn’t any reason that you can’t become a better designer, or become a designer from scratch if you realy really want to.

Paul:I think that’s really important to say because I think so many people are intimidated from getting involved in design because there’s almost a bit of snobbery. If you’re not artistic, you’re not artistic there’s nothing you can do about that. I personnaly don’t believe that that’s true. Like you say I think there are some people that are naturally inclined that way but I think a lot of the principles that you were talking about in your presentation pretty much anybody can pick up on and do, which is what encouraged me so much hearing you talk.

Dan Rubin:That is one of the reasons why one of the reasons I say one of the most important thing is to trust your eyes and that’s instinctual. These rules, as a good teacher you have to teach these rules. When you start learning any discipline the first things that you are taught are the basics.The basics are things that many people, once they learn enough, don’t conciously think about, but what you find if you deconstruct their work is that they are doing them, they have incorporated into their flow into their process so it’s second nature to them. What we think of as instinct is really just experience.

Paul:Yeah. One of the things you did mention in the presentation that grabbed my attention is you talked a lot about texture and adding more texture to your design and about how that creates a real feel. There seems to be a slight skism, I don’t know if that is the right word, but like 2 different camps in design at the moment. People like yourself, Elliot Jay Stock is another example that does very rich, very textured design. It’s absolutely gorgeous. At the other end of the extreme you’ve got people like 37signals doing this minimalistic functional design. How do you feel those two sides fit togeth
er? Is there a role for one or the other or have they both got their place

Dan Rubin:I really think that both have their place and more than that it’s popular to create divisions. Not just these days, if you look at any industry that spends a lot of its time looking at itself, like we do, you start to find reasons to create little clicks within it or factions or what have you. If you just ignore those splits that happen because we spend way too much time looking at what we do and try to deconstruct it and answer that question of ‘why’. What you find is that it’s all the same thing. When I talk about texture it is important to understand that it doesn’t just mean rough or ??bulap or brick. Texture can also mean smooth and polished and speaking directly about 37signals for instance. I’ve used their apps and I’ve loved them since the first time they came out. If you look at the first versions of Base Camp and Backpack, before their incremental re-design they’ve actually added the little drop shadow over time. If y ou look at it as a designer you see the flaws in the way they’ve done it because it doesn’t look real and it just ends at some edges, it has hard edges, but that’s not the point. The point is they added it because it created a separation, they added it because they felt it needed it. The rest of the interface doesn’t need any other texture because it isn’t supposed to have a feel to it. It’s actually supposed to totally get out of the way and there are different approaches to minimalism. You can use minimalism in subtle detail where you add in things like I was showing in my presentation, or you can use minimalism where you keep taking away and 37signals apps feel right, they always have felt right to me so as far as I’m concerned that means they’ve hit the nail on the head. It shows when you see people trying to recreate the application interface and theat style that 37signals uses and they get stuck in this pattern of adding things, like they feel ‘well, that’s 37siganls l ook so I think we have to add things to make it better, to make it better, and they never work as well because it’s not just about that. So the answer is, and I try to underscore this when I talk to people about this or present about it or even write about it, as much as these things can be presented as rules and definitive this is the way to do something. the fact is you have to do what works best for you and your particular project or circumstance or situation, and you also have to be open to the fact that what works for you right now might change. It might be different next year, next month or next week, and being able to adapt to your situation as a designer specially is really important, because you have to adapt if you’re doing client work, you have to adapt from project to project, because your style might work for one client but you might need to tweek your style to do what’s best for another client. If your working on your own applications, what works for your users now might not work for your users once they become users that have used your app for a year and they’re experts now.

Paul:You talk about tweaking your style. How easy is that, do you think, to do in reality? I mean I’ve got a very strong style in my design, and I really struggle and I look at someone like Cameron Moll’s style and I just love it. I love the light-handed feel, he’s very delicate, beautiful design, and I wish I was more like that, but there is no way I can make myself become like that, or can I? Is there a way of changing your style?

Dan Rubin:I think we’re all naturally mimics. I’m not going to dig into my opinions on human adapability too much. I spend a lot of time thinking about that as far as evaluating how people use things, whether it’s interfaces or products and it’s interesting to start to see those patterns but you can see it on a global scale too. Historically human beings are species very, very adaptable and that happens on macro and micro levels. If you want to adapt your style you can. You look for the inflences you want to model yourself after. This is just how people learn to be designers when they’re starting out, or learn to be artists. When I took my first watercolour and oil painting classes when I was 11 or 12, the way we learnt was to recreate examples that were painted by masters. So learn how to use the brush strokes they use, to learn how to mix colours the way that they use them, to learn how to use the tools the way that they use them becau se you only discover your preferences and your style by mimicing, copying others. You find out what works and you decide what works for you and what doesn’t. So changing how you design and how you see is not necessarily easy, because at a certain point you’re reprogramming muscle memory and from my experience with singing I know how difficult that is to do. Once muscle memory has been built up to the point where you don’t think about it and you just react, it’s very difficult to break that down and re-build it. Difficult does not mean impossible.

Paul:That’s really interesting that you say that because I’ve always very much struggled to design in any other way than I already do, but I obviously need to push myself in this area. Talking of 37signals, I’m sure you have been following their recent post and various reactions to it about skipping Photoshop, and how they move straight into building with HTML and CSS and I just wondered what your opinion was on that.

Dan Rubin:I know I’d get roped into this discussion somehow. There has already been some great responses from people like Jeff Croft and Mark Boulten to the 37signals post on that, and even interestingly enough a follow-up post sourced by 37signals announcing that they were looking for an additional designer for their team that can push them into different directions that they havent been going naturally. That comes back to the whole adaptability and willing us to change and being open to it. In the argument itself I can’t say I always start in Photoshop or Fireworks or some sort of visual tool. I think Jeff said 37signals starts with a visual tool, it’s pencil and paper. I think even if your tool is a marker on a whiteboard to a certain extent everybody tends to start there, even if you don’t start there you start with a picture in your mind. So there’s some level in the process where a visualisation is occuring, if that’s fair to say. When it comes down to it why does the tool that you’re using to visualise really matter? It starts in your head if you’re a primarily visual person you can either realise that vision by programming it and seeing it in the browser or using Photoshop as a tool. All of these are just tools when it comes down to it, they’re not the end result. They’re just part of the process. I’ve done both. I’ve built straight from XHTML and CSS many times and I do tend to find that most visual designers that have weighed in on this conversation also find that in my opinion the result ends up being more simplistic. that’s not necessarily to say bad. It’s just different and you’ll find that the tools that you use as a visual creative influsence the end result because that comes down to constraints. 37signals of course is huge on constraints and you do save time when you’re doing straight HTML and CSS, you skip a lot of the temptation to play around like I know I do with layers and layer setting s and percentages of opacity. I spend a lot of time playing when I’m in Photoshop, I don’t think that’s bad. That’s part of the creative process when using that tool. When I used to paint which I havent done in way too long. I would play with my
palatte, when I was doing oils my palatte and my palatte knife was tool before I got to the canvas, and I would play with mixing my colours ‘and that’s not quite right’ and ‘wait and go over here’ and sometimes you get it onto the canvas and it doesn’t look the way you want it to and have to wait for it to dry and then you paint over it because that’s what you do with that tool. When you’re doing watercolours you don’t have that forgiveness of the tool, you have extra constraints, so you don’t experiment as much putting it on the paper, putting the paint to paper because you know once it’s dried and there you can’t go back. you can’t paint over it. So you adjust your style depending on the tools and the workflow and it’s all good, it ‘s just all different and you have to I think do yourself a favour and experiment to find which works best for you and don’t be afraid if you’re working on a project and you think ‘this doesn’t feel like it needs a lot of subtle gradients and lines and shadows and Photoshop work. I might just be able to build this without using Photoshop at all’. So do it if it feels like that will work best go that route. If you feel the opposite go the other route. If you feel like it should involve a lot more natural media pull out your watercolour pad and paint something and scan it in and incorporate that

Paul:It really down to the right tool for the job thought process.

Dan Rubin:Exactly. The thing that 37signals does really well is stick to their guns. They state their opinion so firmly that people can easily interpret it as law and I think that’s very important. In any industry it’s very important to have people who do that, who can stick to what they believe so strongly and apply it so universally that it creates this set of rules, but it doesn’t mean that they have to be followed or cant be partially followed or bent or broken and you find just as much as 37signals is enfatic about skipping Photoshop. There are other people who would never in a million years go straight to HTML and CSS, doesn’t mean that either camp is right.

Paul:OK. One last question just to wrap this up. We’re running out of time but there’s something I wanted to ask you which is: We’ve been already talking about that there are people that may be want to learn to be better designers, to find their style and to move into this area, perhaps they’ve been a developer background and they’ve been previously put off exploring design because they have been made to feel inadequate. What kind of resources would you encourage people to look for or look at in order to get going I guess?

Dan Rubin:Whether you’re starting from scratch or just trying to improve what you already have it’s important to touch on a couple of specific areas, and those are typography, layout and working with colour. This applies just to design because it’s worked whether you’re designing on the web or designing in print or branding or whatever you’re doing. Typography is kind of my first love with design and if you want to learn about typography you have to go out and buy ‘The Elements of Typographic Style’ by Robert Bringhurst. It’s the bible for typographers. It’s really easy to read too because he’s a well respected Canadian poet as well. He just happens to be an excellent typographer and book designer, so if you are in a rush, you cant get to the book store or Amazon right away Mark Boulton’s series ‘Five Simple Steps To Better Typography’ is a great place to start as well and he references a ton of other good resources. Start there if you a re going to start online but no matter what buy ‘The Elements of Typographic Style’. When it comes to layout there are a lot of things that you can learn about layout but you’ve got to learn about grids, even if you never use them. Do yourself a favour of learning and I’ll reference Mark again, actually I’ll reference Mark in all three of these. He’s got great starter tutorials about this stuff so ‘Five Simple Steps To Designing Grid Systems’ is really a great place to start. Cameron Moll has written about Griding The 960 and read up over on Khoi Vinh’s site about grids. ‘Grids Are Good’ is a great demonstration as well, and if you want to get a physical book to hold ‘Grid Systems In Graphic Design’ is a great, great phyisical book and I think it’s important to as web designers to also reference ‘Print’, because Print is where all these design rules come from and typography rules and colour rules, so learn from these different implem entations and you’ll figure out things that you can do that you didn’t think about, because you haven’t seen them on the web. So ‘Grid Systems In Graphic Design’ is by Josef Müller Brockmann I believe would be the pronounciation, look that up. Colour, and this is something that’s very preferential maybe but read up again Mark Boulton’s ‘Five Simple Steps To Designing With Colour’. He’s great at teaching, he’s great at communicating all these things. Also play around with some of the online tools like Adobe Kuler, is fun. Look at what other people are putting together, look at combinations, again feel is important. Whatever feels right for what you’re trying to do. Another cool tool is Colorjack. You got a couple of ways of mixing colours and it’s really, really cool to look at. Finally on the topic of colour whenever using colours in an interface please be aware of the different types of colourbl indness that exist, and there are lots of tools online. Photoshop CS4 will have some tools built in as well but there are plug-ins that you can get right now for all sorts of tools and online tools as well that allow you to see what you’re designing, or even just a colour palatte. See them through the eyes of someone that has these various colourblindness afflictions and make sure that whatever you do doesn’t render something unuseable to what ends up being a large percentage of the viewing public when it comes down to it.

Paul:WOW !! That’s a good set of resources !! My word.

Dan Rubin:You didn’t think I’d be that prepared did you?

Paul:That’s a superb list. I certainly didn’t know about all those posts from Mark Boulton. there was some great stuff in there – Thank you very much Dan. Just to say that Dan’s talk at @media will be no doubt going live at some point and you’ll be able to download it and listen to it. Definitely do that, it was superb. So check that out. You will be able to go the shownotes for this episode for all those links that will be useful as well. No doubt you won’t be able to remember them all. Dan thanks for coming on the show, it’s very much appreciated and we will get you back on in the future.

Dan Rubin:Thanks very much for having me Paul. It was a pleasure.

Thanks to Sarah Galley for transcribing this interview.

Linkage

You can find Dan Rubins site, Superfluous Banter here.

Typography
Layout
Colour

Back to top

Listeners feedback:

Managing a Bigger Team

Jon asks: We are a company of 4 people – myself (owner, design lead and general business development/project management person), one designer, and 2 developers.

We are hopefully about to merge with a slightly larger company in a neighbouring town who have slightly more staff than we do (7 in all), and who have more of a project management structure – 2 project managers, using the services of 1 designer, 3 developers, and 1 designer/developer. I would end up as owner/MD of the enlarged company.

My question is really about project management? What do you think is the best organizational structure for a company of 11 people? I was feeling pushed on the project management side before this merger came along, and the merger will bring 2 project managers with it. How does Headscape do it for example – I think you have project managers there – do the designers and developers report to project managers, or do the project managers pick from a pool of design and development resource as required? What are your thoughts generally on the whole project management side of things.

A-ha… this is part two to a question I answered a few weeks back relating to pricing work after two companies merge. I wanted more detail at the time and now I have it!

Comparing to Headscape, we have 4 designers, 4 developers, 3 project managers, 2 business development/analysts and 1 lazy good-for-nothing called Paul … seriously though, Paul effectively markets Headscape and I have to say he’s rather good at it (ungrits teeth…)

Following the merger Jon will have a team of 11. As he is new MD, I think it is imperative that he much reduces the design and PM aspects of his role and concentrates on bringing in business as there are quite a few more mouths to feed.

That leaves roughly 3 designers, 5 developers and 2 PMs. Depending on the work you’re doing I think that is ok especially considering Jon can bolster both the design and PM groups if needed.

Regarding the allocation of work, project managers should rule the roost. Full stop.

It is their job to manage resources. Delivering projects effectively and on time means that they must know that they are in charge regarding who does what and when they need to do it by. A certain amount of fitting the right person to the job should be done but generally, the rule should be that the next piece of work goes to the next available person. This would be particularly useful advice in a merged company where it would much easier to keep going back to ‘your’ guys because you trust them.

One thing that has worked really well for us is to set invoicing targets for the project managers. We don’t operate performance related targets but it still really helps to focus minds on hitting milestones at the end of months.

Terms and Conditions

Adam writes: I am developing my own web application. In summary, it’s a site with user submission of content in a social networking format with video uploads. Anyone can register an account.

I of course have to try and write Terms of Service for this and I am getting stuck. I am wondering what Headscape uses, especially for Getsignoff, and whether you found a pre-written terms of service, or had a specialist write one.

What’s your solution to the problem, and what should / should not be included.

I have to confess to conferring with Headscape’s fount of all legalese knowledge on this – our MD Chris Scott. I tried to get him on the show but he’s still a little jittery after the last time all those years ago… anyway, Chris put together the TOS for Getsignoff and these are his thoughts on it:

For Getsignoff I looked at the TOS of other online services like Harvest, Basecamp, Youtube and Flickr. I’m not a legal person, but this gave me enough material to be able to identify the key issues that I thought we needed to cover in our TOS.

I assembled this into a brief for our legal adviser that was part overview of what we wanted to achieve and part draft TOS using adapted clauses from other TOSs.

Our legal adviser pretty much re-wrote what I had given him but this was from a position where he had a good understanding of how we wanted Getsignoff to work.

The bottom line with this sort of thing is that you really need to get a professional legal person to assist.

Back to top

 

Content is dead, long live context

No, content is not dead. Yes content is important, but there can only be one king and I am beginning to wonder if it is context.

The more I consider context the more I recognise its impact on every aspect of a website. Context affects design, usability, accessibility and content. Its influence is profound, and yet it is largely ignored by many web designers.

But what is context when applied to a website? Its actually hard to define. It is easier to think in terms of the users context while access your website. Understanding this context affects how you design a site.

We put a lot of emphasis on user centric design. We believe that understanding users is important. For example, we believe in carrying out user testing. However, think for a minute about the way we do this. We bring the user into an artificial environment (such as a usability lab). We remove them from their normal context.

Equally when we create personas they focus on demographics (age, sex, job etc) rather than their context. We miss a crucial part of the jigsaw.

So what is the users context? I have identified 5 aspects that form his or her context. These are:

  • Environment
  • Device
  • Comfort
  • Mood
  • Time

Let’s look at each of these in turn.

Environment

Environment refers to a number of factors including location. The kind of information a user wants to access is dependant on his or her location. For example somebody planning a weekend break using their PC at home, will want information on hotels and attractions. When they are actually on their break and using their mobile phone, they are more likely to want information on the nearest pub or the opening times of a museum they want to visit.

Location does not just affect content. It can also affect design. Viewing web content outside will mean battling with sunlight and so high contrast is required. Alternatively, you do not want to be dealing with fiddly form elements while being jostled at a train station.

However, environment is not just about location it also includes distractions and surroundings. For example a mother of three toddlers may find it hard to concentrate on a complex survey, with the children demanding her attention. Equally a user accessing the web from a library is not going to appreciate audio suddenly playing on your website.

Environment also defines the type of device we use to access the web. This is another aspect of context.

Device

Although location and the device often go hand in hand (you tend to use a PC at home and a mobile while out), this is not the only affect device has on context. The device also determines the input methods available.

Few mobile phones come with QWERTY keyboards. None come with a mouse. You can access the web via games consoles like the wii. These generally rely on gamepads, remotes and on screen keyboards.

Different input devices should radically affect the user interface. Not only do each of these devices alter how you interact with the system, they also alter how you view the information.

Typically PC users are sitting close to their monitor and viewing at relatively high resolutions. Games consoles are normally attached to a TV where you sit much further away and the resolution is lower. Mobile devices have a lower resolution still and the viewing position is different again. This all affect the design of your website.

Talking of viewing position, the other factor that needs considering is the users comfort.

Comfort

How physically comfortable a user is affects the length of time they will interact with your site. Although you cannot know whether your target audience is comfortable or not, sometimes you can make an educated guess. For example, if you know your users will be accessing your site via a kiosk in a shopping mall, they will probably be standing and not stay long.

Comfort is to a large degree dictated by environment but not entirely. It can also be dictated by physical conditions. If you are launching a site aimed at those who suffer from back pain or weak bladders, do not expect them to spend a long time on your site!

In some ways comfort is also closely linked to our next factor, mood.

Mood

There is no way we can predict the emotional whims of our audience, but they do have an affect on attention span. Those who are busy or stressed get irritable with a site quicker. They are likely to give up and walk away. Conversely those who are relaxed muddle through and are more tolerant of bad design.

It is important to consider the likely temperament of your users. For example, business executives are likely to be less patient with a site than a pensioner siting in his villa in the south of France.

Environment, device and comfort can all have an impact on mood. However, the biggest influcening factor is time.

Time

It is obvious that the time available to a user affects how long they spend on a site. However, we often do not take this into account when designing a site. Unnecessary form fields and key content buried deep within your site, are just 2 ways we ignore the time constraints users operate under.

Online banking is a good example. It is so complex to login to my account that it is quicker to pick up the phone. With time being a valuable commodity users will often choose a competitors site because they can get things done faster.

Of course, in reality there is a lot of overlap in these facets of context. However, I have yet to read much about context that isn’t directly related to mobile devices. Hopefully I have demonstrated that context applies to all the work we do and not just to mobile websites.

125. Copy

In this weeks show we discuss how to give personality to your site copy and we talk with Elliot Jay Stocks about going freelance.

Play

Download this show.

Launch our podcast player

Watch the behind the scenes video

News and Events

The clever chaps at Carsonified

If you happen to follow any of the guys at Carsonified on twitter, you cannot help but know they are working on a not-so-secret project called Matt.

It is an interesting idea that they have done once before. They stop all normal work for a week and blitz a small self contained project using an Agile style approach.

The final result is not what counts. It is the exercise itself that I find interesting. By doing this periodically they…

  • Create a lot of buzz which reflects well on their company
  • Build a great sense of camaraderie
  • Get to try out new technologies and techniques
  • Break the routine of everyday work
  • Push people’s comfort zones and help develop new skills

It’s a great plan and one more of us should adopt. It is certainly something I would like to do in Headscape. Of course it is more tricky when you have clients with deadlines however the principle still applies. You may find it hard to do this for a week, but maybe a single day is possible.

Adobe make flash searchable

The big news of the week is an announcement by Adobe that they have been working with both Google and Yahoo! to improve the indexing of flash. This is no real surprises as the SEO of flash has been a major headache for the technology. The surprising bit is that they have succeeded, at least in the case of Google.

Apparently Adobe have created a special flash player for the search engines that acts as a virtual user. This user trawls through each swf converting the content into something search engines can understand.

Apparently Google is in the process of rolling out the technology. Unfortunately Yahoo! apparently have "some work to do." Nevertheless this is a promising step forward.

Of course until Adobe make it easy for the average blogger or website owner to deep link within a flash file, the 73 million flash sites are not likely to be highly ranked.

Colour blindness on the web

My final story for the day is a post on colour blindness by Richard Rutter. To call this news is a huge stretch as the article was published in 2005. However, I have only just found it so it is news to me!

I have to say I love this post. At the very beginning Rich tells us he is colour blind and so I braced myself for feelings of guilt and inadequacy as he tells me my sites are inaccessible. Instead I got this…

The thing is, colour blindness on the Web isnÕt a big deal. You do have to bear it mind (as I will show later on), but there is no need to let it dominate any design decision.

What a breath of fresh air. He then goes on to give some very simple advice that anybody can follow…

  • Do not rely on colour alone to convey information (such as on Jeff Veen’s blog)
  • Do not write instructions such as "click the green button"

He goes on to dispel some misconceptions and provides good examples of where things can become a problem.

If you worry about the large number of colour blind users out there (and you should do), then give this post a read.

Back to top

Feature: Copy with Personality

Too much of the copy I read on websites is bland and uninspiring. Its time to add some personality. We look at this in this weeks feature.

Back to top

Interview: Elliot Jay Stocks on Going Freelance

Paul Boag: So joining me today is Elliot Jay Stocks previously from Cansonified now a freelance web designer, in the depths of Norway I hear earlier.

Elliot Jay Stocks: Yes. That’s all the hype depending on how you look at it.

Paul: Well it’s really good to have you on the show.

Elliot: Thank you for having me.

Paul: Normally when we get people on the show it’s to talk about some specific area of expertise or something like that. Although I know you have many, many areas of expertise I wanted to get you on the show just because of the really interesting thing that you’ve chosen to do. The fact that you’ve left a fairly well known company that had a really good reputation. That you’ve decided to go freelance. And you’ve decided, at least for a short length of time to work from Norway, as a bit of an adventure. Is that the right way to put it?

Elliot: Yeah I guess so. I don’t like to do anything by halves. I like to do everything at once. So we gave up our flat my girlfriend went off travelling to the far east. I moved to Norway and at the same time decided to start up my own business. So quite a few life changing things at once.

Paul: Cool. I mean that’s really exciting and I guess that’s the power of freelancing, that you’ve got the freedom to work from wherever you want.

Elliot: Yeah and the power of the web in general. You know whenever anybody says "How can you do that?" I say I’ve got my laptop and as long as I’ve got an internet connection then it’s all good. Although having said that my internet connection here is really dodgy.

Paul: Which is why I’m calling you on an ordinary phone line.

Elliot: Right. Where I’m staying unfortunately there is something wrong with the router where it doesn’t allow ftp or any way to send email out. So there’s no upstream traffic. Which isn’t that great when you’re a web designer. So my new office, as it were, is one of the local coffee shops.

Paul: In order to get ’round the problem. So we’ve got loads of people listening to this show that either are web designer’s in an agency of some description or in house designers somewhere or alternatively people maybe not working in web design at all at the moment but want to. So we get lots of questions about freelancing and I thought okay let’s get somebody on the show that’s literally just gone through this process. And kind of ask you a few questions about you’re experiences a
nd how its gone. I guess the biggest one and the one that we probably should start with is overcoming that kind of fear factor of giving up a regular income. How did you kind of convince yourself that this was a good idea?

Elliot: I’d been thinking about going freelance for a while. Not to swat at Carsonified, but sort of the entire time I’ve been working at a web designer. I started off doing freelance things in University. So like doing site for things like friends bands and things like that. I mean I carried on doing that as soon as I started working in the industry and have carried on the last 4 years or so doing bits and bobs, evenings and weekends. Although I’ve only just started doing it fulltime I’ve got quite a bit of experience doing it on a part-time basis which obviously is a little less scary, when you’re making. I think the other thing as well at Carsonified most days of the week I actually worked from home, in London, so that was a really good testing ground to see if I had the self discipline to work by myself all day and stay motivated and stuff like that. So because of that it was slightly less scary making the actual jump.

Paul: So would you recommend that to somebody who is considering going freelance? To kind of build up some work on the side and also if possible to negotiate some home working to see how you get on with it?

Elliot: Yeah definitely. It’s something that’s not suited to everybody. Obviously there’s the appeal, everybody thinks WOW I’d love to work from home, loads of freedom fantastic. But, people I have spoken to have said I find it very very hard to get motivated when I’m at home. It’s easy to get distracted. The other thing as well is it can often be quite lonely. Jonathan Snook recently wrote a post about this on his site. He was disussing these ways of battling freelance loneliness. You know going to the local coffee shop for instance. Which is another thing to bear in mind when you’re doing it. There’s the option of working entirely by yourself. Working in the public, like the coffee shop. Working in a shared working environment. I’m still undecided really. I get on fine working by myself, but when I get back to the UK we’re not sure exactly where we’re gonna go. Depending on where we do go I may look into some kind of co-working space or whatever. There’s a possibility that we might go Oxford way, if so I may shack up with the old Rissington chaps, which would be lovely.

Paul: That would be superb.

Elliot: Yeah.

Paul: Well obviously no it wouldn’t because they’re nothing but rude and obnoxious to me so I’m in no way supporting that decision.

Elliot: And they’re a rival podcast.

Paul: Well it’s not so much the rival podcast it’s the fact that they’re just so jealous and envious of my huge success (Paul laugh maniacally).

Elliot: Well I hear you’re the one who gets noticed on the tube anyway.

Paul: Well yes this is true. Okay moving back to the interview and on with the questions. Cashflow is obviously something that always scares people. Not just when making the leap into freelance. How do you actually fund it starting off? You know in those first few weeks. How did you go about that? What was your solution to the problem?

Elliot: I’m not sure that my solution is the best one. People always say to make sure you have some money in the bank. You know enough to see you over for 2 or 3 months so that if it’s very slow starting off, if you’re not getting a lot of work in or if you are getting work in but clients are slow paying you’ve got a sort of fall back plan. I made sure I had a bit of money in the bank so that if it all went horrible wrong I’d still be able to survive. Luckily at the same time because we moved out of our flat and I am now living in Norway temporarily. Although Norway is horrendously expensive to anyone but Norwegians it’s actually cheaper working out here living here at the moment because of the reduced rent compared to what I was paying in London. So that was one factor that made it a little bit easier. The other thing is that I alread had a lot of work already booked in before going freelance. I think more than anything that’s the important thing when people make that jump, is having the work there. So rather than jumping and saying okay I work for myself now I better go get some work. To already have as much lined up as possible. Fortunately I am in a position where I had loads of stuff booked up a couple of months in advance. That was a good safety net. Obviously clients can be slow to pay so I always ask for 25% deposit before I start. That’s 25% based on the estimated amount of the project. But it’s a nice little safety net to have in there. It means you have a little bit of cash and if they decide that they want to be horrible at the end and not pay you’ve got a little bit of something to fall back on.

Paul: Sure. I mean it’s interesting that you said that you were fortunate enough to get some work lined up before you began. I mean the obvious question is how did you achieve that. You must have been marketing or been selling yourself in some way in order to attract that work.

Elliot: Selling myself. (laughs at Paul’s implied dirty joke)

Paul: Selling yourself in the nicest way.

Elliot: Yeah to some degree. I’ve been very very fortunate and I haven’t had to look for any work yet. So far people have got in contact with me so I haven’t had to go out there and kind of beg for clients or anything. Obviously Carsonified was quite high profile stuff. Prior to that when I worked in the music industry luckily I got work with some very high profile artists and bands so because of that and because I had those things in my portfolio that was part of the marketing. People see these kind of bigger bands in your portfolio. It definitly makes it easier because regardless of the work I think it kind of impresses people if they see a name that they recognize. In terms of marketing I guess this time last year, or I guess just over a year ago, the recent version of my site and things kind of took off from there really. I’ve put that on a load of CSS galleries which obviously helps because they get so much traffic. I think still sites like CSS Beauty and Web Designer Wall they’re still some of my biggest refers even now. So I think getting you’re site on there, getting people to look at it there that often has a snowball effect of having the other galleries picking it up and other sites and
things like that. So that obviously helps. In terms of the work for the next few months, I’m actually launching a new version of my site which will probably launch in a month or two’s time. And I’m gonna do the same things again. Put it on lots of gallery sites. Tell people about it. I think having a new site with an emphasis more on the work more than just being a blog that will hopefully help as well in the continuing marketing. Luckily enough, doing things like this even lets people hear about you some more and I guess the thing with marketing it’s just to get your name out there in which ever way you can. To get people hearing about your stuff.

Paul: So would you recommend, if someone’s talking about going freelance, say a new graduate that has just come out of university. Would you actually encourage them to try working for an agency where they can perhaps build up a portfolio of bigger clients before they go freelance? Or is there really no reason why they shouldn’t go freelance straight away.

Elliot: No. I would definitely encourage working for an agency or as an in house designer for some kind of company before hand. When I left university my flat mate and I were condsidering starting up a business and I was thinking about this this morning actually. If we’d have done that and we could have done it I guess and maybe done okay out of it but the first thing is. I don’t think I would have then got access to the kind of high profile clients that I have got through my previous work experience so in that sense I probably would have still be struggling now to market myself and convince people I can work with big brands. The main thing that I, you know the wealth of experience that working in an agency will give you is definitely something not to be under estimated. Dealing with clients. Dealing with rediculous deadlines. Obviously these are things that your pick up being freelance as well but being inside an agency and working with other people and getting a feel for the industry that you are in, the working environment. The requirements. Things like that. All of that stuff. I am very grateful that I decided not to start my own business that early on and actually went to a real job as it were. So I would definitely recommend that people do it, that graduates do that. As well I thinks it’s just you learn a lot about who you are as a designer and where your strengths are. I mean when I was at Young life I was completely Flash. 100%. I barely new HTML at all when I started there because I was so interested in Flash. Obviously now that has completely changed. Now its much more, well completely standards based. That’s sort of where I specialize in now. If I hadn’t gone through that process I may not have realized that.

Paul: Okay so we’ve done the kind of exciting stuff of kind of talking about setting up, or deciding to take the leap and go freelance. We talked where the work comes from. What about all the boring stuff? What was your experience of the admin of going freelance? Setting up all the kind of legal requirements. What did you do there? You kind of muddle your way through that yourself? Did you get any help? How did you approach it? What were the big problems?

Elliot: A bit of muddling through. A bit of asking around. There’s still some things that I have yet to do. For instance I haven’t yet got a business bank account. Which I’m waiting till I get back to the UK. Mainly because I was setting this up at the time of moving, leaving the country. It was very very complicated. As I’m not getting paid immediately for some of the projects I am doing its fine to wait till July and set it all up then. You know what a nightmare UK banks can be anyway. So still waiting about that. One of the first things I did was get an accountant. I was quite nervous about this because one of the things that really dawned on me was how do you…First of all how do you find an accountant and then once you’ve found one how do you say "Ah they’re good.": You know, if you’re choosing a designer you can look at there work and it’s very easy to see what their like. What their styles like. What they’ve done. This kind of thing. With an accountant I think it’s really hard. You can only seem to go mainly on recommendations from friends and colleagues. Luckily I’ve had some dealings before with Nick who is Carsonified’s accountant and really nice guy and I figured well I’ll get a consult with him and if he fancies doing accounting for myself. I had a quick meeting with him. He was very friendly. I got to ask him all sorts of mundane tax questions which he answered for me. That was one of the first things I got sorted. So that was a big weight off my mind. To have someone who could look after all that stuff. Everybody has always said to me, in fact I think you may have said to me yourself, a good accountant will always pay for themselves and then some. In the time they save you. In the expertise. When the taxes come and all this kind of thing. So everybody recommended to me that I get an accountant from the first thigns and I guess that I would even in these early days say the same thing to anyone else thinking about that. In terms of paper work and stuff like that, one of the things I really really underestimated, although luckily I found out the truth in the first week, is how long it would take to manage my calendar. I just thought yeah I’ll book things and it will be fine. What I didn’t realize was that when projects need to shift round or you had to allocate couple of extra days for this. This had to move. The scheduling was actually, not a nightmare, but something you really have to make time for. The tricky thing is at the end of that you have nothing to show. There’s no realy paperwork to go with it. It’s an output as such. It’s easy to leave it off for, to neglect it. But obviously it’s something that needs to happen. In terms of paper work I made sure I designed myself a nice little invoice template so at least doing paper work isn’t as mundane as it has to be. Caus I got some nice little pretty pictures on my invoices. Doing that kind of stuff and obviously kind of chasing people to pay the money. Although actually so far everyone’s been very good. I haven’t got anything to complain about.

Paul: It’s interesting isn’t it. That when you kind of sit down and think about going freelance and whatever else you do the calculations if I charged this per hour and you know I work 40 hours per week WOW I’m gonna be so rich. But very quickly you realize that well actually half of my time is probably taken up with non-paid work like managing your calendar, project management, invoicing. Dealing with the accountant and all of the that kind of stuff. It’s easy to forget that side of things. What about the business plan? Did you put any kind of business plan together or did you just go oh sod it I’m just going to do it?

Elliot: I said oh sod it I’m gonna do it. For the kind of stuff that I’m doing I didn’t see the point in doing a business plan. Because I know exactly what I’m doing which is providing a design service to clients on a project by project basis. I don’t have any plans to grow the company as it were. This may change over time of course but at the moment I have not interest in turning it into an agency and employing other people. Obviously there are some financial benefits to doing that. A lot of people will tell you it’s the best thing to do and you gradually get less involved with the day to day stuff and are just running the company but to be honest at least w
here I am now I wouldn’t be happy doing that. Because I actually love doing the day to day, the hands on design work and if I wasn’t doing that I wouldn’t be happy and that’s the reason I’m doing this anyway. So at the moment there’s no, it’s not like I’m a start up and I have a product and I need to predict sales and growth in that way. I think just being a designer we’ve got it a bit easier. So maybe I’m going about it the wrong way. Maybe I’m being unprofessional but this if fine for me.

Paul: No I have to say I would agree. You know it’s not like you’ve got big costs going out. You don’t have offices that have to be paid for on a monthly basis. You don’t have staff that you have to worry about. And pensions for those staff. You know there’s no major complexity to it that kind of demands a business plan. I mean ultimately you just need to know that you are earning enough each month to pay your accountant and feed yourself.

Elliot: That’s right yeah exactly. I think as long as you can go into freelance work and aim to earn at least as much as you were earning in your day job then I don’t think you’re going to run into too much trouble. As you say it’s probably safe to assume that half of your week you’re not actually going to be getting paid for because technically you wont be doing paid work like you say you’ll be doing the invoicing, chasing up things like this. So if you say you’re only working 2.5 days a week I think it’s a fairly safe bet to go on. If you can say that in those 2.5 days you’re going to earn at least as much as you were earning in a week when you were in fulltime employment then you’re not going to go too far wrong. Obviously a lot of what we aim to do and what is happening with me luckily at the moment is earning more than what I was earning in fulltime employment. So in that respect it’s yeah it’s good and I don’t think there too much to worry about there. As I said before luckily we as web designers have very very few overheads. Like you say if you’re renting an office that’s one thing and obviously there’s the accountant but actually accountants are very very reasonably priced anyway and I’m paying it all in a lump sum just to get it out there and get it done. Luckily there isn’t too much that we have to spend much money on.

Paul: Okay last question and to wrap up with. How far in, sorry when did you set up again? I’m trying to think how long you’ve been doing this now?

Elliot: Doing it fulltime has been since around the 20th of April.

Paul: So it’s still very early days. You’re just over a month in. So so far pros and cons of being you’re own boss? What things have you liked? What things have you not liked?

Elliot: The main pro and so far they’re living up to what I expected the pros and cons to be. Some of the main pros are the freedom of being you’re own boss. Obviously to an extent you’re clients are your bosses but just having the freedom to decide when you think this deadline should be. Doing the work when you like to where you would like to is a really great thing. When somebody comes to you to estimate a project being able to be generous enough with the hours to know that you can really spend a decent amount of time on the project. Not to a degree where you’re kind of taking the mickey as it were. But knowing that you can really give some really good time to a project instead of it being rushed. Also picking and choosing the clients. If you have got a fairly steady amount of work coming in and you can afford to say no to some things then that’s great cause it means that you can just work on a project that you personally find interesting. As I said before the financial benefits are working out well so far. That is a game when anyone goes freelance as well as freedom there is the monetary benefite as well. I can’t express enough this sense of freedom. Just having a chat with you this morning and then toodling off into town later this morning to go and do some work from a coffee shop and I’ll probably work a bit later this evening because we’ve had this chat this morning but you know having the freedom to do that and not having to worry about needing to stick to normal working hours and things like that. Not that employers aren’t flexible to these things but knowing that you’re the only person you have to please that does make a massive difference.

Paul: So what about cons? Those were all pros.

Elliot: They are aren’t they.

Paul: You’re still in the honeymoon period aren’t you?

Elliot: Yeah I agree. Give me a year and I’ll be all disheveled and angry. The only con I’ll say is that it can be a bit lonely sometimes. I mean I guess it’s hard to judge cause I’m in a foreign country where I only know a few people anyway. There way a while where I was working from my room here when the connection was a bit more reliable and that was great but I found I’m actually much happier being around more people now. Seeing more people during the day. I think I’m fairly well self disciplined like I said before cause I’ve had the experience of working from home before for quite a while but even so I found that I sometimes get a little bit distracted when I’m at home. You know go for a little wander. When you’re sitting down maybe in a coffee shop in public it’s more like this working environment, you can focus a bit more. I think even if you work from home most of the time maybe spend one day a week heading out and working in a public space just to see how it compares. I definitely find my concentration is a little bit better when I’m in somewhere like that.

Paul: That’s really interesting because that’s something I’ve never tried doing. You know I work from home the vast majority of my week and I’ve never kind of gone and sat in a coffee shop. Mainly because I don’t drink coffee but also because, I don’t know its just never occured to me. I will go and try it today. There we go. We’ve got a little coffee shop around the corner I really like so I will go and sit in there and do some work for a while.

Elliot: Of course as soon as you get there there will be really loud music and you won’t be able to concentrate.

Paul: Probably. So Elliot you’ve definitely taught me something. I like that idea. What has that never occurred to me? Never even thought about doing that.

Elliot: Of course I have only been doing it for a month so I could be completely and absolutely wrong.

Paul: Yeah it could be a nightmare couldn’t it. But that’s why I wanted to get you on really. I wanted to get you on at the early outset of you doing this just to kind of give that unique perspective of somebody who’s just gone through the process. The stuff that you’ve covered has been great. I really apre
ciate the time that you’ve taken to come on. We’ll get you back on again in the future when you’re a year down the line and see how you feel then.

Elliot: Yes that would be a good test.

Paul: It would be.

Elliot: Something to aim towards perhaps?

Paul: Yeah. So you’ve got to stay as a freelancer for at least a year otherwise it would be very inconvenient. Alright good to have you on the show Elliot and we will talk to you again soon.

Thanks to Curtis McHale for transcribing this interview.

Back to top

Listeners feedback:

Wayne Henderson from Southern California has sent in an audio file for this week’s show consisting of two separate but equally good questions.

Hello Paul, Hello Marcus this is Wayne from Wayne Henderson voiceovers and as you can tell from my voice I’m obviously from Bristol, no wait actually Southern California and I have two question I would love to hear your comments and thoughts on. One, with the iPhone really taking off, gaining in popularity and other smart phones basically copying the iPhone, do you think it’s still even necessary to have the .mobi and designing for .mobi and my other question that I’d love to hear your thoughts on is kind of on the fringe of web design, I was wondering with WordPress being so popular, how do you feel about someone maybe being a WordPress design and installation expert? Taking the themes, customising them tweaking some things, changing some code and then kind of really helping other people to implement WordPress into their websites? Let me know what you think about that? Thanks guys.

Let me address each in turn.

The .mobi domain name

There are two issues here which I would like to cover separately. First, let me look at this issue of whether we need to be designing for mobile devices at all. My answer is a categoric yes. No matter how great mobile browsers become, it is always going to be a different experience to surfing the web on a computer. Let me give you just three differences…

  • Size – Mobile devices have smaller screens than a PC. No matter how clever the mobile browser is a considerable amount of zooming and panning will be required to view a conventional website.
  • Controls – Not all mobile devices come with a QWERTY keyboard and none come with a traditional mouse. This can create problems on some sites, especially those with mouse over effects.
  • Context – Probably the biggest reason for creating a mobile version of a site is context. Mobile devices are not used sitting at a desk. They are normally used on the go. This affects the type of information being requested as well as the level of concentration being given to the task. When it comes to the mobile web context is king.
  • It is also worth mentioning that we are a long way from everybody having a smart phone. The majority of phones still provide a terrible web experience.

    It is harder to give a definitive answer about the .mobi domain. Unless your website is primarily mobile focused I think it is probably unnecessary. Most sites seem to use a sub domain rather than a seperate extension. For example twitter uses:

    http://m.twitter.com rather than http://twitter.mobi.

    I have even found myself guessing this format. I certainly never think of typing .mobi. Also on a purely financial note, you have to pay for .mobi while a sub domain is free.

    That said, I don’t have anything against .mobi. It is certainly a valid choice.

    Becoming a WordPress specialist

    Wayne’s second question was about becoming a WordPress specialist. It is good idea for a couple of reasons.

    First, as he point out, WordPress is hugely popular and there is certainly a market out there. It is also a well established product that has been around for a while and isn’t about to disappear. Having a clearly defined market is always a good strategy.

    Second, I am a great believer in specialising. With so many web designers out there you need to do something in order to stand out from the crowd. Specialising in WordPress is a good step in the right direction.

    However, I would argue that you could specialise further. You may choose to specialise in setting up WordPress for a particular sector or by using it in a particular way.

    Although this approach feels counter intuitive as you are narrowing the number of people who can hire you, it actually makes good business sense. By specialising you become the best in your limited field and so people are more likely to select you over your competitors.

    Back to top

    124. HTML 5

    In this weeks show we explore how to create better online surveys and Lachlan Hunt joins us to discuss HTML5

    Download this show.

    Launch our podcast player

    Watch the behind the scenes video (Part 1)

    Watch the behind the scenes video (Part 2)

    News and events

    Removing Microformats

    The story that has generated the most email this week is the BBC announcement that they will be dropping the hCalendar Microformat. This decisions comes because of long standing accessibility concerns over the machine readable content within that particular Microformat. The problem is that code meant to be used programatically is potentially read out to screen reader users and displayed as meaningless tooltips to sighted users.

    The decision of the BBC to adopt Microformats was a huge boost to the movement. Equally the rejection the hCalendar is a blow. However, it is important not to get this out of proportion. Remember, they are only rejecting a single Microformat not the whole approach.

    The other thing to consider is that the BBC is a public service organisation with an incredibly high obligation to ensure maximum accessibility. In many ways they are in a unique position. Although it maybe appropriate for your organisation to pull hCalendars too, it should not be based on the decision of the BBC.

    My advice is as follows. If you already have hCalendar information on your site I would probably leave it (dependant on your exact circumstances). The Microformat community is working on a solution and I would implement that rather than removing hCalendar entirely. If however, you are not yet using hCalendar then I suggest you hold off until an updated specification is released.

    Becoming employable

    In the past we have spoken about becoming a professional web designer. I know that many people who listen to this show or read the blog are students. You are concerned that the skills you are being taught are out of date and will not improve your employment prospects. How then do you become a more employable web designer? What skills do you actually require?

    Andy Rutledge tackles this subject in his post "the employable web designer". Without a doubt it is the best post I have read on the subject of web design career development. I highly recommend you read it.

    The thing that impresses me is that it looks beyond the obvious design and technical skills required to be a web designer. It also tackles the business and communication skills too. He really drives home quite how wide an understand a good web designer has to have.

    My only criticism is that it could feel demoralising. You may read the list and think it is an unachievable aim. However, I don’t think that is the case. What Andy outlines is the optimal requirement of a web designer, rather than what is needed to get your first step on the ladder. I certainly did not have all of the attributes listed when I started.

    All we need now is a second post telling us how to gain the skills he lists.

    Better CSS font stacks

    David (a boagworld listener) sent in the next story. It covers a subject that I am currently still grappling with. It is a post about CSS font stacks.

    If you code in CSS you already know about font stacks. It is where you specify the fonts you wish to use. You can say for instance; use Helvetica and if that isn’t available use Arial. If that fails use a generic san-serif font.

    For many of us that is as far as our thinking goes. The majority of us use very basic font stacks that are uninspiring to the point of being insipid.

    I love this post because it lays out a very clear methodology for improving your font stacks. It also goes on to provide an impressive selection of font stacks organised into heading and body fonts, allowing you to instantly improve your site

    If your site is looking tired and boring, but you don’t have the time to redesign, consider adding a new font stack. Such a simple change could make a real difference.

    Do flexible layouts still matter?

    Our last story of the day is a post from Smashing Magazine entitled Flexible Layouts: Challenge For The Future. To be honest I was ensure whether to include this post or not. On one hand it covers an issue many people have been asking me about. On the other, its arguments seem stretched and the whole thing ends with an advert for a CSS framework.

    The article tackles zooming and fluid design. The new generation of web browsers – Firefox 3, Opera 9.5 and Internet Explorer 7 – provide full screen zooming. This gives users has the ability to enlarge the whole interface, not just text. Some are arguing that this is the end of fluid layout because zooming tackles many of the accessibility concerns associated with fixed width sites. However, this article strongly disagrees.

    The author argues that flexible designs are better for mobile devices, that pixels are becoming less important and that the user shouldn’t be required to customise a site to their needs (it should be done automatically). Although his arguments are weak at times and he uses some fairly dodgy comparisons I do generally agree with him. I see no reason to think fluid design will go away anytime soon.

    That said, I am in no doubt that page zoom does reduce the number of occasions fluid sites are necessary. Ultimately there is no right or wrong answer. It is entirely based on the situation. For example Boagworld, Headscape and The Website Owners Manual all use fixed designs. However, many of my client websites do not. That decision is based on numerous factors such as device, user base and business priorities.

    Back to top

    Feature: Creating a Better Survey

    The web allows us to interact with our customers more than any other medium. One of the tools in our arsenal is the online survey. However, these are often badly implemented. In this weeks feature we find out how we make your surveys more effective?

    Back to top

    Interview: Lachlan Hunt on HTML 5

    Paul: Joining me today is Lachlan Hunt; It’s good to have you on the show

    Lachlan: Thank You Very much

    Paul: It’s great to have you here I really appreciate you taking the time to join us, now the reason that we asked Lachlan on the show is because he posted a brilliant article on the A List Apart site about the subject of HTML 5 and I have been keen to look at this subject for a while partly because of my own ignorance to be honest, um, so lets kinda kick off by if you could perhaps tell us a little bit about where HTML 5 is at the moment I know that kinda getting a language to a release like this finalized is a massive process so can you tell us where we are at in that process.

    Lachlan: OK, it’s, um, a really an ongoing process with browsers implementing different parts of it progressively so it’s not, you know, going to be all implemented at once and ready to go in one, er the next few browser implementations. We have some features implemented already and shipping in browsers other features which are being worked on at the moment and other are planned for, but still a few years of yet. But it is gradually getting there. We are trying to focus on what authors really need, instead of trying to do it all at once

    Paul:Ahh, okay so that a slightly different approach that we have seen in the past, the idea of an incremental roll out. So how does that work from the W3C’s point of view are they doing modular releases is that how it works

    Lachlan: Um, at the moment no, but the way the spec is structured each part of the spec, what I am trying to indicate is the stability of each section of the spec as we go along. SO thing like the Canvas API which has been in browsers for a few years now, it should be getting to IE very soon. That section is pretty stable, Other things for example "data grid" or a lot of the web forms are not widely implemented.

    Paul: OK so that quite an interesting approach to the problem I guess from what you were saying earlier to me there is a community base element people can get involved and contribute. How is that all working then?

    Lachlan: Well we’ve got a REALLY REALLY open mailing list on whatwg.org anyone can subscribe at the moment there wa about 800 subscribers on that list anyone is free to subscribe and post feedback about the spec if they want to, but that’s not for everyone obviously because it’s quite a high volume mailing list and not everyone can keep up with that. We have also got an open blog on http://blog.whatwg.org/ where absolute anyone who wants to can write an article submit it and have it published. Anything to do with what the WHATWG are about, HTML5 and anything related to it at all. It’s also a good way to let the community know what’s going on by publishing articles also to find out what people think because they keep posting comments on there as well. We have also got an open forum which is at http://forums.whatwg.org/ again anyone can subscribe to that, am sue you know how a forum works

    Paul: So there are lots of different ways to be involved, I have to confess things like that can feel quite intimidating to get involved in. You’re kinda worried about putting your foot in it, and saying something really dumb, is there kind of Opportunities to lurk and are people fairly friendly over there? I guess you are going to say yes aren’t you

    Lachlan: Yeah everyone is friendly over there,they are nice sort of area to go to aim at web developers and people who aren’t quite as technical with the spec areas and stuff. You can ask any question you want and just learn whatever you want as well. Their is also the w3c side of it as well. Which is strictly related but is more focused on the actual technical side and issues so yeah. The What WG and the W3C are both publishing exactly the same spec and they both work on it together and feedback can be sent to either place, it will all be taken into account

    Paul: Oooh, that’s useful. So looking at kinda the state of affairs at the moment with HTML 5, reading through your article there was some things in there that really sounded quite exciting, there was this thing about structure and some kind of additional elements that could be used, which provide a little bit more structure, headers and footers and things like that can you tell us a little about that, and maybe explain a bit of what those do.

    Lachlan: Well at the beginning of the work back in 2004 / 2005 we basically took a look at what a lot of site where doing and we noticed that they were all using a similar structure. All the blog’s were using headers and footer and generally things like column layouts to show articles and stuff like that. So we wanted some semantic elements to come and cover each of those features that people actually used, solving the real problems that they were actually focusing on. instead of having to do "Div" elements for everything, which is what people do we give them an actual element and that also has a side effect of increasing accessibility because an element with specific semantics can be hooked into the accessibility API’s and help someone with assistive technology navigate the document a bit easier.

    Paul: Okay, because I mean reaction just glancing at it quickly and not thinking about it was what’s wrong with the div with an ID Equals footer, or an ID equal header or whatever but like you say, as you think about it more it become obvious that if those are considered distant elements, one person might call it a footer another might call it "the bottom" or whatever else if they have consistent semantic names then you know you can have screen readers and stuff jumping to the footer or avoiding / not reading the footer depending on what is set in their preferences, is that what you are thinking?

    Lachlan: Yeah that sort of it, it’s also helping the authoring side too, as there are lots of Div elements in source code which makes it easier to read if you have got elements with different names

    Paul: yeah very much so, I spend half my life trying to which closing Div relates to which elements, that very exciting. Obviously the other big area you talk about in your A List Apart article is the audio visual elements and there is a lot that’s happening in there. It’s always had the vague feeling that HTML has never had any kind of, erm, erm, the audio visual elements have always been and after thought, what happing in HTML 5 in regards to that?

    Lachlan: Well we have added the video and audio elements to the spec to try and allow video to be added directly to HTML, at the moment we have sites like youtube revel and all the other video site out there using flash to embed video and using the flash to give customized controls and stuff to the user, it’s really awkward, depending on proprietor technology, so we want to open that up a bit give a very very easy to use Javascript API to hook into and promote custom controls and all sorts of cool stuff with videos and of course audio as well. We have got experimental implementations of that in opera and in webkit. I have heard mozilla is considering implementing it as as it is now I am not sure of the status of their implementation. However the one big problem with video and audio at the moment is with Codecs, there are a whole load of software patent issues going around and we are not quite sure what codec we are going to standardize upon or if we are going o be able to get common codec support among the browsers, That’s an open issue but I am no lawyer to I cannot really go into that, so the ultimate aim is that you will be able to embed your movie file, your avid file or whatever directly into the HTML without the need to kinda pump it through something like flash

    Paul: cool

    Lachlan: that make it a whole lot easier to the authors hopefully

    Paul: Yeah, you kind of, to some extent got to ask the question why do we need that when we have got a solution like flash

    Lachlan: Well because Flash is a proprietary technology it’s managed only buy Adobe , they control it, they control the changes and what does and what does not go into future versions of it, however the thing with HTML is that it is an open standard platform which can be implemented by anyone and maintain interoperability between those venders.

    Paul: It’s intrusting isn’t it that adobe has just announced they are opening up the flash format, do you wonder if that’s a reaction to some of the stuff you have been doing to kind of force their hand if they want to stay ahead o the game and dominant they need to be open

    Lachlan: Yeah I don’t know how that going to work though, it depends, if they open the format up and actually make it an open development process where anyone can contribute to the future version and features which go into it or whether they just write the specs and tell other people to implement based on what they write, so I don’t know much about that. It will be interesting to see how it goes.

    Paul: Very interesting, Now the next thing you cover in the A List Apart article is something which you titled "Document Representation" now I have to confess this confused me, so do you want to explain a little about what you meant by document representation. What you were getting at there.

    Lachlan: Yeah, well in the past we have had HTM, and XHTML with two separate specs, HTML 4.1 which a lot of people use and XHTML 1.0 which a whole lot of other people use one of them is based on XML and is really really strict syntax that requires well formedness and is supposed to when you serve it correctly, if you make a well formedness error the browser is suppose to stop processing and throw and error message saying "Sorry I cannot handle this" where as HTML is more sorta loose and convenient in its error handling, it’s the traditional inspired by SGML, although really only syntactically similar these day but the error handling is a bit more lenient and you can get away with making a lot more errors. So instead of having two distinct language which you can use we have combined them into a single language which share the same elements and attributes and everything and as much a possible and when the browser reads those file it produces and internal representation called the DOM, a lot of javascript user will be familiar with the DOM as they work with that with their scripts to modify the document through the DOM. That’s an internal representation which is mapped, the DOM which is sort of mapped to by the syntax’s, the HTML and the XHTML syntax’s so it give the authors a choice of which syntax they want to use

    Paul: So why do we need that choice what is the key difference, I mean you talk about HTML being more lenient are there other reason for choosing one over the other.

    Lachlan: erm, well I don’t really know. However a lot of authors do prefer the strict syntax of XHTML like to make sure they quote the attributes and encode all their ampersands properly. They like to know they have done everything perfectly as with HTML a lot of people do make mistakes inadvertently and don’t want end users to see big error messages, so it’s a bit more user friendly if some little small error slips though their CMS and causes problems.

    Paul: So it’s basically come down to personal preference then

    Lachlan: yeah

    Paul: Okay, that’s fair enough, so both, we are going to see equal support for both of them in browser manufacturers are we

    Lachlan: Well that’s the hope we have said that we have got good support in most browsers, it’s just IE which is lagging behind

    Paul: (Sarcasm) Oh that’s a suprise (Laughs) Okay are there ant other things in HTML 5 that might be of interest to those listening to the show which we should be paying attention to?

    Lachlan: erm, well, as I said before we got canvas implemented in most browsers

    Paul: So tell us, what’s canvas

    Lachlan: It’s a 2D drawing API that you can use javascript to draw dynamic image with. People have used it to implement things like graphs that are built using tables of data which are on the page. People have also gone and done 3D games with it which is really cool

    Paul: Wow, that incredible. I mean that sounds very similar to SVG is it a different thing.

    Lachlan: It is different SVG is entirely done with XML, you modify that with script via the DOM by changing elements and attributes and stuff or with CSS. Canvas is an immediate mode graphics API where it is more like a bitmap sort of thing where as SVG is vector graphics, and canvas is bit map. They can both do images, the same sort of images, if you like but we have both vector images and bitmap images, so they both can serve different purposes.

    Paul: Right, I see. Okay that’s good, so okay the big question, kind of the final question everyone is going to have is when can they start doing some of the cool stuff. Now you said right at the beginning this is going to be modular support based thing so we are going to be able to see some of these elements before others. You know some parts before other, so what can we do now, what are we going to be able to do soon give us an idea of where things are at.

    Lachlan: erm, okay let’s see I think what’s being implemented at the moment. Cross document messaging is being implemented at the moment, that’s an API that lets you send message between documents with javascript without worrying about cross domain security issues,

    Paul: Oooo…. that’s good.

    Lachlan: Yeah it’s a really, really handy API that been implemented in opera for a while and I heard mozilla is implementing it soonish and should be in firefox 3 thought I am not entirely sure about that. That should be very very soon, erm, what else have we got, we got…. hmmm, this is tough

    Paul: Sorry put you on the spot there (laughs) is that last one supported in webkit?

    Lachlan: erm, I am not sure I would have to double cheek that

    Paul: Okay that’s fair enough

    Lachlan: yeah,

    Paul: Okay so any other elements? Things like the structural changes are any of those being supported yet?

    Lachlan: Not quite yet, erm as far as I know support for those requires changed to the phaser, and to implment the new pharsing algorithm in HTML 5, as far as I know browsers are not yet focusing on doing that because..

    Paul: Okay that’s a shame, because that one I liked the sound of, what about the audio and the visual stuff?

    Lachlan: We have experimental implementations in opera which supports OGG video, though it’s not really in a public build version yet, there is a experimental version which was released last year sometime. And webkit also has support in their nightly builds, which supports mpeg 4 unfortunate they don’t support the same codec but you can experiment with them.

    Paul: (laughs) That would be far to easy

    Lachlan: yes I know

    Paul: So it’s all progressing slowly but, erm you know obviously the one name which has been very absent in the list you keep mentioning is Internet Explorer, so I expect we can probably see some slower movement there. We are talking you know in the years before this all becomes mainstream and we can actually start using it. Is that a fair comment to make?

    Lachlan: Yes it will be several years before the entire spec is finished, we are hoping that it can get finished sooner rather than later but realistically it’s going to be quite a while yet, But it is important to know people will be able to use theses features before the spec is finished; so it depends on when browsers start supporting features authors can go ahead and use it.

    Paul: That’s great and real exciting that you can start to do that sort of stuff. you know that we don’t need to wait for it all to be set in stone before moving forward. And it’s always exciting as well to see the future, know what coming up and be aware of everything. so is there somewhere people can go a websites address and keep an eye on what is currently supported by browsers.

    Lachlan: Not at the moment but that’s something worth looking into, I think there is a wiki on the Working Group site, it does have some implementations listed but I am not sure how up to date. But it’s something I think we should look into

    Paul: Yeah it would be great to have some kind of single page which says what features are supported by each browser that you could check back every few months see what’s going, there you go there is my contribution to the working group (laughs). Alright it was really good to speak to you and thank you so much for your time, What we will do is to get you back in further down the line and have a check to see where we have currently got to in the development of HTML 5, Thank you so much for your time.

    Thanks to Jamie Knight for transcribing this interview.

    Back to top

    Listeners feedback:

    Staying healthy on the web

    Evan writes: My question to you is not entirely related to design, development or management but rather about health in the web industry. This is very important but we often seem to forget about it. We spend hours upon hours at our desks but are unaware of the damage this could be having on our health. Eyeballs almost touching the screen, typing without a break, sitting incorrectly – just a few examples. So, what do you do to maintain good health while working?

    I am possibly the worst person in the world to answer this question. I consistently abuse my body while at work. In fact a physiotherapist friend said I had the worse posture in front of a computer she had ever encountered.

    However, there is possibly something to learn from my terrible example. Let’s look at what I do and compare that to best practice.

    • I sit with my leg tucked up under me – Posture while working is important. Both feet should be flat on the floor, rest your wrists on the desktop in front of your keyboard and make sure your monitor is at eye level (in other words avoid laptop screens).
    • I stoically refuse to use anything other than my preferred mouse and keyboard – Using the same keyboard and mouse in the same position day after day can cause damage. Try using a variety of different hardware and positions. Push your mouse and keyboard nearer or further from you to change the position of your arms.
    • I believe that an individual pixel should fill my field of view - Leaning too close to your monitor is a particular weakness of designers who want to position that pixel ‘just so’. This not only damages your eyes but also your back. When you learn forward your neck and back support the weight of your head. When sat upright, the head is supported by a straight spine and therefore your chair bears the weight.

    On the upside I do take regular breaks. I would like to claim this is because of my health. However, I think it has more to do with my short attention span. I get easily distracted and wander off to do something more interesting.

    From Photoshop to HTML

    I see a lot of PSD 2 HTML services on the internet but never tried any out. It seems to be an great option for an designer for making an quick website, to edit later myself.

    What is the opinion of you guys? Love to hear you discuss this topic in one the next podcasts.

    An long time listener from Holland.

    I have to confess to being a snob over these services. Until recently I have always doubted the quality of the code but after seeing some recent examples I have begun to change my mind.

    We are even considering giving them a try at Headscape, just to see what happens. Certainly from an economic point of view they make sense especially if you have more work than you can handle. That said, I do have three concerns.

    First, results may vary. Without a personal recommendation it could be hard to find a provider who can produce the quality you require. Anybody can convert a photoshop document into HTML. However, it is much harder to do so using techniques like microformats, semantic markup and accessibility. Also, just because the quality was good once, does not mean it will be so again. As the good providers get busy it can lead to a decline in quality.

    Second, people code in different ways. Unless careful attention is given to commenting, it is hard to pick up somebody elses markup. This is fine for relatively static sites where only small changes are required. However for projects where change happens regularly as the site evolves, it is more important that the markup is tailored to your style of coding.

    My final concern is that this could lead to designers not learning HTML. As I have said before on the show, I believe all designers should be able to code themselves. You need to understand how the web works and markup is apart of that. Also, if you cannot code how can you judge the quality of the markup you receive?

    Back to top

    Creating screencasts

    Video is becoming an intrinsic part of the web and not just dumb ass videos on YouTube. Video can be used to show off products and provide online presentations. But how do you create a high quality screencast on a budget?

    I seem to be creating a lot of screencasts lately. Whether it is recording a keynote presentation or demonstrating some web work, it is a useful way of communicating information.

    Here are a few tips that I have picked up along the way.

    Add talking head video

    Most screencasts are either a powerpoint style presentation or video of your desktop. However, if you want more impact and to better engage with your users, add yourself talking to camera. This really grabs attention.

    Image of a presentation I recorded using myself speaking to camera

    Have a clean background

    If you are recording yourself in-front of a busy background it looks unprofessional. Think carefully about what is behind you. If in doubt record against a plain wall. Also, remove all unnecessary icons from your desktop and make sure your wallpaper is simple and appropriate.

    If it’s important, script it

    If you are demonstrating an idea to a work colleague then by all means record it spontaneously. However, if it is something more important, write a script that you read. It is surprisingly hard to record live to camera and a script helps a lot.

    Try an online teleprompter to prevent your eyes continually flicking down to read your script. I have the following setup to ensure my eye line is as close to the camera as possible.

    Photograph of recording setup

    Use decent equipment

    Do not rely on your laptops inbuilt mic and webcam. The quality will suffer. Instead, I plug in my camcorder via firewire and record from that. Audio I capture through a Samson C01U mic.

    Check out screenflow

    By far the best screen recorder I have found is Screenflow for the mac. It is amazingly easy to use and can capture full screen video. If you are a Windows user then take a look at Camtasia. Unfortunately it is considerably more expensive and not as good but it is the best I have found for Windows.

    A Screenshot of Screenflow

    Normal presentation techniques apply

    As with any presentation it is important to be enthusiastic, clear spoken and engaging. Avoid becoming monotone as you speak and make sure you don’t sound as if you are reading.

    Choose your player wisely

    Think about how you are going to add the video to your website. Not all online video services are equal. Personally I like Vimeo. It places few limitations on file size or length. That said, all of these services compress the hell out of your video. If the quality is poor I suggest hosting the file yourself and using the JW FLV Media Player. Despite the name can play a variety of video formats.

    That is what I have learnt so far. Do you have any additional tips you could share? I would love to hear your thoughts.

    Quick fix accessibility

    Complying with accessibility guidelines can seem like a massive undertaking. However, addressing 5 simple problems can make a huge difference to your sites accessibility.

    The Pareto principle (also known as the 80/20 rule) states that, for many events, 80% of the effects come from 20% of the causes. This is true for accessibility where a small number of issues cause the vast majority of problems. But what are these issues? That is a subjective question, but here are my top 5:

    Poorly described images

    By now you probably all know that images should have associated alt attributes, which describe them to visually impaired users and search engines. However, a related problem is the content of these alt attributes.

    Many people have realized the benefit of alt attributes for search engine placement and so stuff them with keywords making them far too long.

    All content images should have an alt attribute that clearly describes what is being shown in a concise manner.

    Badly labelled links

    It is not just images that are labelled badly. There are also problems with links. The text contained within a link should describe that link without context. This is because screen readers have the ability to read all links on a page as a single list. Users can then quickly navigate without listening to the entire page. However this is problematic because a link entitled ‘click here’ does not explain where it leads. A better link would read ‘click here for latest news’ or simply ‘latest news’. Where a longer description is required a title attribute can be added.

    Descriptive links also help sighted users to quickly scan for the next page to visit.

    No alternatives to media

    It is not just images that need describing. When using video, audio or any form of media that requires a plugin (that some users may not have) it is necessary to provide an alternative version. This alternative should either be in the form of a transcript (in the case of audio) or captions (in the case of video or other media where visuals and audio are synced).

    At first glance this seems a massive undertaking. However, there are a number of services like castingwords.com who provide transcription at a very reasonable rate. There are also tools like overstream.net, that help create captions.

    Reliance on Javascript

    Javascript is a programming language that can be used to achieve many of the interactions we see on websites. From popup windows to services like Google Maps, Javascript is amazingly flexible and heavily used.

    Javascript is not inaccessible. In fact it was created by the W3C and sits alongside HTML (which provides the content) and CSS (which provides the design) as the language which provides behavior. The problem is not the technology but the implementation.

    Not everybody has access to Javascript. Search engines in particular tend to ignore it. It is important that all content is accessible even when Javascript is turned off. The most common problem is using javascript to create navigation and other links. If Javascript is not available it is impossible to follow those links to the content beneath. Equally when Javascript is used to add content, this becomes inaccessible if Javascript is disabled.

    The simple rule is to never rely solely on Javascript as a method of accessing content.

    User controlled text

    The final accessibility mistake I see regularly is text that cannot be resized. By default all major browsers allow users to set the size of text on a webpage. This is needed because website owners cannot predict users visual requirements. Most people with visual problems need to be able to increase font sizes. However, there are some visual impairments that require smaller text to fit within a limited field of view.

    Although browsers provide this functionality by default, many web designers disable it. To be brutally honest there is no good reason for this beyond laziness. By fixing the font size the designer reduces the burden of testing but it provide no other tangible benefit. In short, ensure the fonts on your web site are scalable.

    By addressing these five problems you will dramatically improve the accessibility of your website. None of these issues are particularly hard to overcome and the financial investment is minimal. However, by doing so you will increase the amount of traffic to your site and the number of visitors able to successfully navigate it.