Tag Archives: training

Keeping your skills sharp

Posted in Web strategy on by Paul Boag

I recently received a question from Harry asking “what approach do you take to training?”. He has some budget set aside and is wondering how he should spend it.

I love working on the web because there is always some new exciting innovation. Of course the downside of this is that we are always running to keep up and there is always something new to learn.

I was extremely impressed with Harry because he has had the foresight to save some money for training. I think more web designers could do with following his lead. We need to recognise that learning new stuff is crucial to our role and if we don’t then we will quickly find ourselves unemployable.

So presuming you have had the foresight to set aside some cash to improve your skills what are your options? Well I believe you have two; spend the cash or convert it to time.

Spending money on training

There are certainly no shortage of ways to spend your hard earned cash on improving your skills.

One option is to go on a training course as Harry has been considering. I know the guys over at Clear:Left runs some excellent training sessions on front end scripting subjects like the DOM and AJAX. Also Drew McLellan and Rachel Andrews at edgeofmyseat.com have started a very popular CSS course.

Training courses are excellent for learning hands on skills in a short amount of time. However they can get pricey. A cheaper solution would be to simply buy a book. Books maybe cheaper but they do take time to read and digest. Nevertheless they are a good alternative if money is tight. I have recommended loads of books in the past so am not going to repeat myself here. However be careful, there is a lot of crap out there teaching bad practice.

If you want to be a bit more forward thinking and strategic with your training budget, then you might want to think about spending the money on attending conferences and meetups. Although these don’t normally teach you practical skills in the same way as a training course, they do advance your thinking about web design and maybe suggest new approaches.

There are some great conferences around. My personal favourites are SXSW, d.construct and the Future of Web Design. SXSW is pricey and somewhat overwhelming but is an experience if nothing else. d.construct and the Future of Web Design are smaller affairs but include a great line up of speakers.

If a conference is beyond your means then consider attending a meetup. Spend your budget on accommodation and go to a hack day or other meetup. You don’t get the great line up of speakers but you do get to interact with other designers who are facing the same challenges as you.

Time equals money

We all know time equals money. This is especially true if you are a freelancer. If you are not working on client work then you are burning cash. Another alternative then to spending your training allowance on courses or conferences is to spend it in the form of time. Use that money to buy yourself time free from project work. Time to experiment and learn online. Personally this is how I learn the most.

I try and set aside time each week to read sites like A List Apart, Think Vitamin or Digital Web. I then take the techniques I have learnt and experiment with them. If I discover a tutorial on AJAX I don’t just skim it but rather sit down and follow it through. If Smashing Magazine lists a load of flash galleries I actually check them out and look for projects I can integrate them with.

By actually physically buying your time back from yourself using your training budget you avoid feeling guilty for ‘messing around’ or ‘sitting about reading blogs’. Spending time experimenting is probably the most important type of training you will do. Take Google’s lead and make sure you set aside some time every week for personal projects.

Show 99: Don’t panic

Posted in Classic shows on by Paul Boag

This week on Boagworld: Paul looks at the growing importance of the favicon. Marcus talks about what to do when the work dries up and Rob Borley looks an alternative approach to storing data in your CMS.

Play

Podcast: Download (24.9MB)

Download this show.

Launch our podcast player

News and events | Marcus: What to do when the work dries up | Paul: Favicons – small but significant | Rob Borley on an alternative approach to your CMS | Question of the week

100th Show

Just wanted to say a big thank you for everybody who came along to the 100th boagworld. For more information on the evening check out my 100th Boagworld blog post. A special congratulations to the 4 winners of a years subscription to .net magazine and to Anna who won a CSS beginners course run by Drew and Rachel at edgeofmyseat.com.

Also live on the show we announce the winner of the FOWD competition.

News and events

Shift in the web wind

Molly Holzschlag likes to generate discussion on her blog and has raised an interesting subject in her recent post “shift in the web wind“. In it she says:

The latest Dot.Com boom is declining as far as I can tell. Are we on the edge of another Dot.Bomb?

Its an interesting question and one that seems to be appearing on an increasing number of sites.

Personally I have to say that I have become concerned about the state of the web at the moment. Not because I believe we have necessarily reached the point of a collapse, but because the boom we have been experiencing is unhealthy. I am in no doubt that we are now experiencing a bubble very similar to that of the dot com era. There are far too many copycat companies out there and the share price of companies such as Google are disproportionate to their revenue. What is more, once again we are seeing the majority of these companies leaning on advertising as a revenue stream. Advertising is very fickle business model because any dip in the overall economy and advertising is the first area to be cut.

So is everything doom and gloom? Are we about to all be out of work? Certainly if you work for a web 2.0. company or the majority of your clients are web 2.0 companies, then I would be twitchy. However, for the majority of us I don’t think there is much to be concerned about. Even if the bubble bursts there is going to be no shortage of web work around. The majority of web designers don’t work on web 2.0. sites. We work with offline businesses that have an online presence. These sites are not going to stop trading just because some high profile web businesses fall. The web is too well established this time around.

If it wasn’t for the fact that it will mess up people’s careers, I would welcome the crash. I think the current state of the sector is unrealistic and the larger the bubble grows the bigger the ‘pop’ when it bursts.

Best practice in email

Most organisations rely on email to communicate with their customers on mass. Whether it is order confirmation, special offers or regular newsletters, email is an essential tool in our web strategy. The problem is that our emails have to fight there way past junk mail filters and increasingly they fail to do so. This isn’t necessarily because we are sending out spam. In most cases it is because we are just ignorant of best practice when it comes to email delivery.

Fortunately this week I came across a great article that suggests some best practice when it comes to using email. This isn’t a list of ways to trick spam filters, rather it provides all kinds of great advice about running any kind of email campaign. From technical advice about CSS and HTML to common curtsy like don’t attach large files, this article really does contain some excellent advice. Finally, it also contains an invaluable list of tools for checking how likely your email is to be classed as spam. If you send out email to your customers then check out this article.

Flash based galleries for your images

So everybody thinks I hate flash. I don’t! I just think we need to think twice before using it. Like any technology we need to use the right tool for the job. However, sometimes flash works well and can really enhance the user experience. One such occasion is when we are building image galleries. Sure, you can build nice static galleries or even produce something impressing using Javascript. However, flash can do some stunning stuff with images.

Even better is the fact that there many flash based gallery systems out there that you can just drop into your site with minimal effort. Whether you are showing off your portfolio or building an image gallery for a client you might want to consider one of flash based galleries reviewed in Smashing Magazine.

20+ tools for working with AJAX

If Flash is not your thing then you are probably into your AJAX and Javascript. If that is the case then check out mashable which has a list of over 20 great tools for work with AJAX. The list consists of a mixture of AJAX loading images, frameworks, reusable scripts but probably most usefully sources of advice. They include some great stuff for those starting out building with AJAX including a noobs guide and also a wiki of common AJAX mistakes.

If you know Javascript already but haven’t done anything with AJAX then take a look. It really isn’t as intimidating as some people like to make it out to be!

Back to top

Marcus’ bit: Don’t panic

Marcus looks at those times when the phone’s not ringing, your inbox is empty and you just lost out on three pitches in a row. No matter how much you tell yourself not to worry, it starts to creep up on you.

Back to top

Paul’s corner: Favicons – small but significant

In my section of the show I want to look at favicons. Favicons are those 16 by 16 pixel graphics that appear in your address bar, bookmarks and various other places. They maybe tiny, but they are becoming increasingly important. I look at why Favicons are worth your attention.

Back to top

Ask the expert: Rob Borley on an alternative approach to your CMS

Paul: So joining us on the show this week is Rob Borley who is, what is your job title Rob actually, I should know this but I don’t?

Rob Borley: (Laughs) Ye you should I think you gave it to me.

Paul: Oh did I?

Rob Borley: Technical Manager officially.

Paul: Uhhh… But basically Technical Manager/Lead Developer/anything vaguely techie goes in his direction.

Rob Borley: Basically it’s my fault when it breaks.

Paul: Yes, so if you want to get pissed at somebody about the boagworld forum there’s your man.

Rob Borley: (Laughs) I knew this was going to come up.

Paul: Well obviously it was going to come up.

Rob Borley: (More Laughs)

Paul: So if you haven’t gathered, Rob works for Headscape, the web design company that myself, Marcus and Chris Scott run and no he shouldn’t be blamed for the boagworld forum, he is actually trying to fix it, but his skills just aren’t up to the job.

Rob Borley: Oh, I see, I see, I see… (Laughs)

Paul: (Laughs) But why I’ve got him on the show today isn’t actually to be rude to him about the boagworld forum, but it’s actually to talk about our content management system because I get a lot of questions asking why content management system Headscape use and what one we would recommend and stuff like that so we’ve just got through a kind of major rebuild of our content management system and so I thought OK lets get Rob on the show and have a little bit of a chat about it and how it works and what it does. So I guess Rob the question to kick off with is why did Headscape decide to develop its own CMS rather than go with an off the shelf one, because there are so many off the shelf solutions around it kind of seem absurd in some ways?

Rob Borley: Umm, ye I guess when you first look at the problem, as you say, there are lots of CMS solutions around but the reason we kind of work from our own is because it gives us complete control over what we’ve got so if there’s a problem with it, we know were the problem is and can go in and fix it but more likely if there’s some new functionality we need specific to our clients we’re able to just go and build it and develop it very quickly because we know exactly how the thing works. Often these off the shelf CMS’s are trying to do everything because they’re in competition with all the other products out there and so they’re vastly complicated, they do lots of things we don’t need them to do and they’re not generally as useful for the client as what we’ve got as a result, because they’re designed by techies, techies know how they work and they’re generally far too complicated for average Joe user out there. What we’ve build is tailored specifically for our clients needs and hopefully is intuitive and easy for them to pick up because it’s designed for them.

Paul: Would you kind of, you know, are you being more brash in that your saying all web design agencies should be developing their own CMS’s or is that something specific to our requirements and the type of clients we have?

Rob Borley: I think when you look at our client base and the sort of projects that we get, a vast majority of our projects are based on our CMS technology now and so, I mean, if we were doing just one or two projects here and there then it would probably make sense for us to get to know our favourite brand of CMS and use that, but as a vast majority of our clients are using this technology it’s actually more productive for us to develop with our own, because we can just keep reusing stuff and add any new development or any area that we can add to it, we can then use it for future clients as well.

Paul: Hmm… So we had a content management system, it seemed to work, why then did you, actually no it wasn’t just you, you and Chris persuade me and Marcus to spend huge quantities of money on re-doing it from scratch?

Rob Borley: (Laughs) Well the first iteration, well I say the first iteration, I think we’re up too officially CMS 3 before we started this new one, it naturally evolved, it came from the need of one client wanting a CMS and then we thought “hey this is a good idea” and things got tagged on and other things got tagged onto that and it just became this, evolved almost organic mess of Darwinian thing which worked and held together and did it’s thing but had never been properly designed, it had never been build for a specific purpose, it was all just kind of mashed together and so as we came to the conclusion that most of our clients are going to be using this we took the opportunity to build a new one from scratch to do it properly. That’s the general theory.

Paul: So what’s different with the new one to the old one?

Rob Borley: Umm… Well there where a few extra features like there’s a more complicated, well I say complicated, more in depth permissions system for pages and parts of the site, there’s also some work flow stuff we’ve added but the main difference is actually what goes on underneath and so this time around we build the whole thing on XML data structures.

Paul: OK.

Rob Borley: Which probably doesn’t mean a great deal to a lot of people out there, but what it means to Headscape, it’s actually changed the way that we develop projects and the way that we work, and it means a lot more less techie people can get down to the nitty-gritty of designing the data and the way things work.

Paul: So, give me an example of how that kind of works in practice?

Rob Borley: OK, so an everyday clients might come to us and say “We need a CMS to create” I don’t know, “hotel vacancies” and so what we’d have to do with previous versions of our CMS is go off, create the data structure in the database, write the logic in the server side pages and the database logic and techies would have to do that because your talking about writing ASP or .NET or PHP or using SQL Server and it’s a very techie orientated job. What we’ve done now by using XML is all the actual logic for the data structure is done in what’s called an XML Scheme which is basically a text document which describes the data. So it means that an average person in the company, who not particularly techie, so a designer or a project manager, a tester or someone can actually sit down and write a document that describes the data, feed it into the system and we’ve got our new area of data, our new “hotel vacancies” structure straight away. So it can be done much, much quicker.

Paul: So if I’m understanding this right, which I probably should do (Laughs)…

Rob Borley: (Laughs)

Paul: lah lah lah, so what we’re talking about here is basically that traditionally with a database you have a serious of hmm… well lets say for example in the “hotel booking” example you gave lets say the hotel had a name, a description and a price range, in the database that would have appeared as three fields basically, it would have been a name field, a description field and a price field.

Rob Borley: Exactly.

Paul: And then your code would have had to, on the back end, would have had to create form fields for each of those that would input into the database and on the front end you’d have to pull, ya know, your code would have to pull out those three pieces of information and display them on the front end, is that correct so far?

Rob Borley: Exactly right yes.

Paul: Right, so what your describing now if I’m getting this right is that basically you wouldn’t have three separate fields in the database, you would just have XML code for those three elements.

Rob Borley: That’s right.

Paul: And then the code both front end and back end looks at the code in the database and just pulls them all out and just displays them as form fields for inputting or text for out putting?

Rob Borley: Exactly, all the logic for that is already done so as soon as the XML is fed in, the back end displays the form fields to fill out the information, the front end pops out the raw XML which we can then style and apply your fancy CSS to.

Paul: I mean that’s quite incredible because like you say then, someone like Charlie who’s one of our Project Managers, can just go in and define, ya know, say we wanted to add, I don’t know, ratings to that list and then suddenly it will just miraculously appear on the front end and back end without any additional coding from you. Is that right?

Rob Borley: Exactly.

Paul: Wow.

Rob Borley: And often, so we’ll be half way through a project and a client will come along and say, “oh, well actually I don’t want that text field there, I want this text field” or “I want this drop down” or “I want this particular text field to be on the front end” and they’ve never mention it before, ya know, it’s typical client changing things as they go along and the Project Manager can just go in there and change the scheme and it does it, it’s done.

Paul: So there are lots of people using this XML/database technique?

Rob Borley: We like to think it’s quite new.

Paul: Oh really?

Rob Borley: Yes. I’ve personally not come across it being used before, but I’m sure there are people out there who are going to correct me on that. (Laughs) But it is quite new.

Paul: It would be quite interesting to know actually, if you are listening to this and you know of somebody doing a similar thing, drop me a line on [email protected]. It’s just kind of interesting to know. So what about, umm… have you kind of made any changes that have kind of made expanding the functionality more kind of modular or anything like that? I mean beyond this XML?

Rob Borley: Ye.

Paul: Is the architecture designed in a different way?

Rob Borley: Ye, so previously it was built on ASP Classic, which is not best for modular design, it’s quite difficult then to move functionality around and re-implant it else were. This time we’ve built it in .NET, in an object orientated way, so the theory being that when somebody else comes along and say “I want this addition to the form builder” or “I want to add a rating system” or “I want to add a product management system/stock management system”, we can literally just, that goes in as a block of code, we call it in an object orientated way, we can turn it off for some clients and so hopefully you build it once and it works for everyone that wants it.

Paul: So does that mean we’re going to have a consistent version of the CMS basically applied to, no we won’t because if a client asks for a new module that’s not going to be on the previous clients ones.

Rob Borley: No, so we won’t roll it back to previous clients, but there’s the potential, as we build stuff up, the potentials great for using in future projects because core of code to use as a base for all the projects.

Paul: So there’s like a core, what do they call it? Kernel of code that will stay the same and all the other modules are built around it?

Rob Borley: Ye, and the idea is that the kernel is kept as small as possible, so that the actual “guts” of the CMS are as tiny as possible and then it’s used to call all these extra modules when it needs it.

Paul: I’ll tell you another completely random question.

Rob Borley: (Laughs)

Paul: That I got asked recently, that you may be able to answer, you mentioned that we’ve built this CMS in .NET and that we do do a lot of .NET work, umm… the question that I got asked was somebody was going on about how it’s hard to produce standards based code out of .NET or Visual Studios, do you know what they’re talking about?

Rob Borley: No.

Paul: No?

Rob Borley: (Laughs)

Paul: Well it didn’t make a lot of sense to me because we produce standards based code don’t we?

Rob Borley: Ye, all of our code is output to your specification actually Paul.

Paul: Ye.

Rob Borley: (Laughs)

Paul: Anyway it just confused the hell out of me that one so I thought I’d ask you about it.

Rob Borley: (Laughs)

Paul: So, what next then is guess is the thing you would kind of ask? Is this a model you think is going to service for a long time going forward or are we going to have to go through this process again in a couple of years?

Rob Borley: I certainly don’t see us having to redesign it again for a long, long time. I mean this seems like it’s going to work and it’s easy to add and extend, I think that’s the key, it’s also very portable, because all the data structures are all XML based, if we for whatever reason decided to ditch Microsoft and move over to PHP and mySQL, all we’d have to do it re-write the logic that calls the XML in and out.

Paul: Oh OK.

Rob Borley: The data structure stays the same to the potential for importing it to other technologies as well as extending the functionality is there, it’s going to be a lot simpler than it would have been in previous versions of things we’ve done.

Paul: That’s very interesting isn’t it? I like that a lot. OK so just to wrap up then, if people wanted to learn any more about this kind of approach, I know your saying there isn’t much around about this kind of stuff but is there any way you would recommend people start having a look?

Rob Borley: Umm… Well the key behind it is storing XML so that’s were you’ve got to start, you’ve got to start with actually storing XML in a database and using the XML data types that the various database engines use now and then pulling the data out , so if you’ve got a good grasp of XML and XSLT then you can actually use whatever server side language you like so if you into PHP, or ASP or .NET or Ruby or whatever you want to do umm… getting to grips with the way the XML works is going to be the place to start, there are lots of places to check that out, W3 Schools is probably the easiest place to start, so the base technologies are standards it’s just what we’re doing with them that slightly different.

Paul: Ah… I think you need to write a blog post on this Rob so that people can access it.

Rob Borley: Your going to let me loose on boagworld Paul that very brave.

Paul: I’ll let you loose, if you write something I’ll put it onto boagworld for you.

Rob Borley: (Laughs)

Paul: Once I’ve read it, edited it and removed all the rude comments. (Laughs)

Rob Borley: Good idea.

Paul: Because you really need something else to do. You seem to be sitting around doing nothing so lets get you doing something constructive. (Laughs)

Rob Borley: I think so, hence I’m on this show.

Paul: Exactly, alright Rob thanks very much for coming in, that’s really interesting, a lot of that I’ve kind of grasped at some level because you’ve told me I need to understand it but ye, that’s really helped.

Rob Borley: (Laughs)

Paul: Thank you very much.

Rob Borley: No problem at all.

Back to top

Question of the week

Are we facing another dot com bust and if so what affect will it have on you? Answers in the comments.

Show 91: God Bless America

Posted in Classic shows on by Paul Boag

On this week’s show: Paul gets to grips with the fact that the whole world isn’t British, Marcus explains how to deal with the client from hell and Julie Howell shares her expertise on accessibility

Play

Podcast: Download (32.3MB)

Download this show.

Launch our podcast player

News and events | Dealing with the client from hell | The international web | Julie Howell on Accessibility

News and events

There are tons of news stories which have sprung up since I last recorded a show. In fact I have spent all morning wading through my RSS feeds. Unfortunately as always I can only squeeze a few into the show so you will have to check out my delicious feed for the rest.

Gerry McGovern on Intranets

The first story I wanted to mention is a couple of posts by Gerry McGovern concerning intranets. I am constantly getting emails asking for me to talk about intranets on the show but somehow have never gotten around to it. Fortunately Gerry has and if you are somebody who works on intranet sites then you should take the time to check them out.

The first, tackles the basic problem of how to get senior management engaged with the intranet. Gerry observes that generally speaking management don’t consider the intranet an important asset to the business and so the site never gets the backing it deserves and requires. In the post he suggests the solution is in how the intranet is portrayed to management and goes on to propose a better approach.

The second article Gerry has posted on intranets is a breakdown of a report on what staff really want from their intranet. Basically, staff overwhelmingly want a better organized intranet where they can quickly find people, policies and procedures, and forms.

Gerry goes on to look at the numbers behind this conclusion and links to a summary of the results in PDF form.

SXSW Panel Picker

Probably the biggest web design news since I have been away is that SXSW have launched their annual panel picker. For those of you who do not know, SXSW is the biggest web design conference of the year and takes place in Austin Texas. The massive event has democratized their selection of panels by opening it up for you to vote on.

By going to the SXSW panel picker you can browse over 680 suggested panels and vote for the ones you like the look of most. Although this sounds great in principle, as Andy Budd points out, it can turn into a popularity contest for the speakers and not necessarily an assessment of the quality of the subjects.

That said, I need you to all vote for the three panels I am associated with whether you think they are any good or not! I don’t even care if you are attending SXSW or not, just get on the site and vote. Hell, I have crafted this podcast lovingly for you every week for over two years the least you can do is vote for me :)

Seriously though, I am hoping to be on three panels (yes I know this overkill) and am really excited as it is my first year speaking at the conference.

My panels are:

Hopefully at least one of these will come off.

HTML characters lookup

My next news item that I wanted to mention is a useful little tool which has recently been launched. I love this tool because it solves a really simple problem in a very easy to use way. Basically all it does is allow you to look up the HTML code you need to include ampersands, spaces or other characters which need to be escaped.

Let me explain the problem in case you don’t know what I am talking about. In HTML certain characters are reserved for use in the code. For example if you type an & it will interpret that as code and not text. It is therefore necessary to code up these characters in a special way. This online tool will tell you exactly how to do that.

You simply type in the character you wish to use and it returns the code you have to use. The site uses AJAX so results return incredibly quickly and if you are a mac user you can even download a dashboard widget.

Very useful indeed.

Moving from Print to the web

My final new story for today is some help for you print designers out there who are struggling to make the transition to the web. It is not always an easy process not just because of learning the technical side but also the mental shift involved.

Well, if that is you I would like to make two suggestions. First up, I would like to recommend an article I came across that takes you through the process of moving from print to the web. Its extremely good and makes some excellent recommendations about where to start.

Secondly, you might want to think about getting some training on CSS and XHTML. There are a number of courses out there but if you are UK based I would like to particularly recommend a beginners CSS course being run by Rachel Andrews and Drew McLellan. These guys are both experts in their field and they have a session coming up in October. Of course this course is ideal for anybody starting out with CSS, not just print designers!

Back to top

Marcus’ bit: Dealing with the client from hell

Found this rather frustrated boagworlder (Cadore) in the forum – read on&#…;

Hello everyone, I was wondering if I could get some feedback on how to proceed with a problematic client.

I have a small business client who contacted me about a website. After talking with her she decided she wanted a basic two column layout with some navigation, she would provide language, etc. All was good, but here is the main problem: I design the header or banner, whichever you call it, and she says it looks great, she loves it. Then we move onto the navigation, she likes the navigation, but now the header seems “too busy” – take a step back. One thing that cracks me up is she said in emails she wants to have a large amount of leaves throughout the design. So, I incorporate leaves and she says she is thinking of not having any leaves at all now. It’s like she wants to do the design for me? Me designer – you client. Do you understand what I am saying, every step forward she wants to go a step back. Now she has a problem with the navigation, and the background image, that she has loved and hated 4 times already. Does anyone have any advice how to deal with a client like this. I was thinking of having her sign off on every little things, but this doesn’t make for a happy working relationship. Any advice on you have proceeded with a client like this would be appreciated.

I have talked loads about getting contracts in place, making sure everything’s agreed up front etc etc. But, agreeing on the look and feel of a site is not so easy to nail down before you start working on a project.

Certainly do all of the following before you start:

  • Find out who will be signing off the design.
  • Encourage the client to make this as small a group as possible.
  • Talk to these people. Obviously, talk to them about project specifics (see below) but try to get to know them a bit. Get an idea whether they’re conservative in their outlook, arty, whacky&#…; whatever. I remember seeing a panel at SXSW where a Swedish creative director said that he insisted on getting drunk with his clients before starting the job&#…; there is some wisdom in that!
  • As them for examples of favourite sites, particularly in their sector. Ask them why they like them.
  • Ask them for any other marketing material that they have, particularly items they like.
  • Discuss their brand (even if it’s just their logo) and the importance of continuity. Make sure that you are aware of any limitations.
  • Discuss colours.
  • Discuss imagery. Ask for imagery that you can use.
  • Discuss layout.
  • Finally, when you’re discussing these items, make sure that you provide examples, choices, potential solutions etc. Your client is almost certainly not an expert web designer therefore they need ideas from you; alternatives if you like.
  • However, you must explain why you’re recommending a particular idea. You need to communicate that you are an expert. This is actually the crux of the problem I think. Successful designers communicate their ideas before they ‘put pen to paper’ and provide solid reasoning for their choices afterwards.

Summarise all of your discussions in an email. Insist that they agree (or not) upon all of the points in the email before you start.
Ok, so that’s all done, now you have a choice:

Limited iterations

This is when you say to the client:

‘Ok, we will put together a design concept for you. You can come back to us with any modifications/comments once that will be incorporated into the design concept, anything after that is chargeable’.

I think this works well for small client, low budget work because everyone knows where they stand and possibly expectations are lower. Also, constantly going back over a design can affect the bottom line of a small project a lot more than a big technical project.

Averaging things out

The problem with this approach is that it can piss off your clients. You can end up looking petty or, even worse, you can end up making changes for free after the agreed cut off point (“it was only a 10 minute job”)&#…;

The approach that we have ended up with at Headscape takes the view that clients won’t pay time and materials for design concept work (they need a fixed price), so we have estimated what we think the average time spent on this work and charge that to all clients. This price is per concept but effectively allows unlimited mods to that concept. If a client wants multiple concepts then they pay accordingly.

Back to top

Paul’s corner: The international web

Just before I went on holiday last week I posted an entry on boagworld. On my return I was gob-smacked to see it had generated the most comments of any post I have ever added to my site.

The whole thing started with an email I received from a first time listener to the show. He was complaining about a joke I made at the expense of my american listeners. Those who listen to the show regularly will know that this is not uncommon and this listener felt the comments were inappropriate. I posted a throw away line on twitter about this and accidently started a debate on political correctness and international differences. Overnight I found myself thinking a lot about the subject and this lead to a blog post on the international web.

I started by apologizing if my humor caused any offense but the main thrust of the article was looking at the broader issues of engaging with an international audience. I found the challenges of working across multiple cultures fascinating and felt it applied to all aspects of web design (not just podcasts).

However, unfortunately the majority of comments I received focused on the apology rather than the points I was trying to raise. I really appreciated the encouragement found in the comments but would like to come back to this issue of culture and cultural differences when designing for the web. This is a challenge that we all face and I want to cover the 5 points I mentioned in my blog post again for the sake of those of you who do not read my blog.

Back to top

Ask the expert: Julie Howell on Accessibility

Paul:
Today I’ve been fortunate enough to grab a few minutes of Julie Howell’s time. Julie is the director of accessibility at a digital design agency called Fortune Cookie and is also the former digital policy development manager at the Royal National Institute for the Blind. She has also been involved, I believe if this is right Julie, that you were involved as the technical author for the PAS-78 or do you call it P.A.S 78?

Julie:
It’s pronounced PAS. Also RNIB is for Royal National Institute of Blind People if you want to…

Paul:
Oh, I missed out the People didn’t I. Oh well, there you go.

Julie:
Well it’s a recent change anyway.

Paul:
Ah, it’s to keep me guessing. Anyway good to have you on the show.

Julie:
Thank you.

Paul:
And obviously, unsurprisingly we have Julie in here to talk about accessibility [laughs]. You know, it’s kinda a no-brainer really. So I thought the best place to start is, well Julie, it strikes me, and I know a lot of the people that listen to our show, that the world of web accessibility seems to be a bit of a mess at the moment. We’ve kinda got WCAG2 that seems to be taking forever to come out. We’ve got now this thing called the WCAG Samurai, what’s all that about? They seem to be in competition with WCAG2. Then whenever you go into or if you are brave enough to venture onto an accessibility forum, they all seem to be fighting over tiny details and you are terrified to say anything incase you get jumped over. Do you think that accessibility is in trouble and if so, what can it do to dig itself out of the hole? What can the accessibility community do?

Julie:
You know, I don’t think there’s as big a problem as is being suggested. I think that what you have to keep in mind is perspective and context. There is heated debate on some areas of the web about accessibility, how accessibility will change or how the guidance might change moving forward in the great big wide world of web design. But in the much bigger world of commercial companies posting content on the web, there isn’t that concern. Everything seems quite stable. It doesn’t worry me at all that the techies or the geeks, and I mean that in the nicest possible way, are having heated debate because it’s really important. That’s how things change and improve and move forward. What is important is that we as people who are part of what I call the accessibility movement, who care about accessibility and who care about the lot of disabled people, keep presenting consistent guidance to the people who really can make the difference to disabled people. That’s businesses who are putting their services onto the web. The fact that there is heated debate about the technicalities I think is positive not negative.

Paul:
It strikes me that there is a little bit of confusion among the business community about what is actually expected of them. Things like the Disability Discrimination Act. They’re not sure how it should be interpreted in reality. Do you think there’s a case or there’s a need for more legal cases to be taken up so that the boundaries of accessibility are better defined?

Julie:
I think there’s a few things in there. I think that the greatest problem that we have, rather than it being arguments about the technicality, is actually a PR issue. We have guidance. We have the Web Content Accessibility Guidance and the other two separate guidance published by the Web Accessibility Initiative. We also have the document published by the British Standards Institution, PAS-78, and I guess we’ll talk about that a little bit more. What we lack is any consistent and well resourced drive to raise awareness of those documents among the community that needs to now about them and that is businesses. That for me is the missing part of the puzzle. Of course the guidelines will keep changing because the technology is changing at such a fast rate. So that I think is healthy. But what we really do need is more effort put into helping businesses understand the guidance that we have. Businesses should not be engaged in the technical discussions because that’s not where they fit into all of this. Businesses want clear, succinct, and that’s a huge problem I have with WCAG2, succinct guidance so that they just know what to… Businesses are saying to us, and I’m saying “us” as in the voluntary sector, the government, the Disability Rights Commission (DRC), that they care about the disabled peoples access and they want to do something about it. They just don’t know what to do. They are confused about which guidance to follow and to my mind, that is due to poor PR and not having any single government department or agency in the UK responsible for pushing the guidance. We’ve got individual organisations and voluntary organisations such as RNIB and RNID doing great work on their own but there’s no government force or business force behind it. Championing the guidance that we have and saying “Actually, there’s no confusion here. The guidance has been published, it is stable and this is all you have to do to follow it. Go forth and get on with it”.

Paul:
Let’s talk about PAS-78 a little bit in context of the business community and what they need to know. Correct me if I am wrong but my understanding of that document is that it was meant to be advice for people that run websites, website owners, to really get them up and running. Is that a fair assessment of what it was about?

Julie:
Erm… I’ve never heard it described that way.

Paul:
[Laughs]

Julie:
[Laughing] I would say that it’s there to provide clarity. We were concerned by the feedback that we were receiving that people in the business community were confused about the range of accessibility guidance that was available on the web. If you go to a search engine and type in “web accessibility”, you get all sorts of stuff back and some of it seems to be conflicting. So what we wanted to do with PAS-78 was pull all of the web accessibility guidance that’s produced by WAI, and also that’s produced by the software developers such as Adobe and others like Microsoft, all together into a single document that can be read within a couple of hours if you want to sit down and read it end to end or could easily be dipped in and out of, which was the definitive guide to the process of making a website accessible. The existing technical guidelines are not for business managers so we have written a document that is in a language that business managers can engage with, can digest, and puts everything together as a process. So it talks about guidelines and it doesn’t seek to create any new guidance. It points to guidance that’s already been published by WAI and others. But it also explains this is a process. This is what you do at this stage and it’s very important to involve disabled people at this stage; at this stage you should write an accessibility policy, later an accessibility statement. These are some of the questions you might want to ask when you are appointing a web design agency. So it puts all of that together in one document. That’s what we were seeking to do really. There’s a few words I used when I was launching it. Two of those words were harmonise and consolidate. It was nothing new. It was bringing together all of the guidance so there was absolutely no doubt. If anyone in the business says “I don’t understand what to do to make my site accessible”, PAS-78 is the only answer they need.

Paul:
OK. So where would they find and get hold of that?

Julie:
Well PAS-78 is free. Now it’s freely available because of the Disability Rights Commission. If you go to the DRC, the DRC have a licensing agreement with the British Standards Institution. So if you go to the Disability Rights Commission website you can download a PAS-78. It’s available in a variety of formats including accessible PDF. After all the medium is the message. The website address for that is http://www.drc-gb.org/pas.

Paul:
Well that brings us nicely onto WCAG then doesn’t it. What are your impressions are of WCAG2, how the WCAG Samurai stuff fits into that and what your current thinking is on all of this?

Julie:
Yeah, we live in interesting times as they say. I’ve been involved with WAI to a lesser and greater degree since 1995. A long time. I’m very conversant in the processes that are there. Now I’m a policy person and a disability rights campaigner. I’m not a coder. I’m not a geek, meant in the nicest possible way, and I’ve got no interest in become one either. I used to design websites but that was back in the day and it’s all very different now. What I care about is disabled people getting access to the web. I care that businesses are enable to make that happen. So as your listeners know WCAG2 has been in development for a really long time. That in itself troubles me because that makes it seem like disabled people are a huge nuisance and very, very difficult to cater for because an organisation catering in specialising to disabled peoples needs on the web takes many, many years to come up with guidance. I don’t like the message that puts out and I think that fuels some of that kind of confusion and misunderstanding and hence that’s why we did the PAS. It was so much quicker and it puts out, I feel, the right messages. People joke about it now don’t they. How long it’s taken WCAG2 to appear and that is because it’s subject to a very rigorous process of course but taking a long time. Now it’s in its latest drafting stages and I have to say… I’m sure you’ve read it or at least looked at it. I haven’t read it because I don’t have the time to read a document of that size. However, it’s not for me. It really is a technical manual now and as a technical manual, what is important is that those of you who are developing code and need to read the technical stuff are engaged by it, will read it and use it effectively. So that’s where the checking needs to be done. I think in the past where we’re getting some of these struggles at the moment, is because WCAG1 was a document for all. So you could read it if you were a developer and you could also have a good read of it if you weren’t and get something out of it. Looking at it now, it looks like a technical manual. Then, for me, it comes back down to PR. If it’s a technical manual then they to call it such and make it clear. If you put that on the desk of any business director general / CEO and well you can imagine the reception that you’ll get, who wants to read that? That said WAI always produce very comprehensive guides to their guidelines and curricular to help the various groups to apply the guidance correctly. They will do so in this case and again for me it’s down to PR. It needs to be made very clear to each individual group, developers, business owners, advocates as well, which guidance is for which group so that we don’t get people belly aching “Oh this is too long”, “I don’t have time to read a document of 100+ pages”.

Paul:
What hadn’t occurred to me there until you just said it, the fact that this applies not just to people like Adobe and Microsoft but also applies to me potentially. If I’m developing a web application that enables users to contribute and upload content then in effect I’m being an equivalent of a Facebook or a Myspace and I need to be aware of those kinds of accessibility issues there are well. It’s quite interesting.

Julie:
It is and then it gets more interesting when you look at it in the context of the law in this country. We have the Disability Discrimination Act and that puts, and I choose these words very carefully, a legal duty on “service providers”. Now software developers are not covered by the DDA. However, the line is blurring. If a website is inaccessible, say a blind person goes to a site to do some shopping and it’s inaccessible, who’s responsibility is it? Whose legal duty is it that the site is accessible? Well it’s the owner of the business because it’s their service. But there’s an argument that the developer who coded the site has aided and abetted the discrimination. But we don’t have any case laws so this is all theoretical until we do get some case laws to back up what were saying. However software developers are not subject to the DDA. There’s a blurry of the lines, in my opinion, between a service provider and a software developer. But if I was to take an educated guess, if a disabled person experienced an instance of discrimination as defined under the Disability Discrimination Act and that happened because they tried to utilise a server via somebody’s page on a social networking site, who would be responsible? That would be very interesting. We also have the DDA, the Disability Discrimination Act. I have Multiple sclerosis. Everybody knows this. I’m very open about it and it really informs my work. Being somebody who stands to benefit, stands to live my life as I choose to and prosper because of the DDA, I can tell you from this side of the fence that the DDA is a very weak piece of legislation as it is. We don’t to date have any case law regarding websites but even if there was a case, it would take quite a number of cases to have any useful body of guidance other than what we already have and know as is published in PAS-78. Really that is your best guide. So yeah, interesting times that we live in. What I would say is that would hope that anybody who is responsible for social networking has a social conscience and cares very much about the ability of every member of society to be able to use the content, to both access it and create it. Unfortunately, disabled people don’t always figure in the planning process when people are putting together solutions and this is again where the web accessibility needs to keep on ramping up that awareness effort to get everybody to understand and to be thinking about disabled people at the earliest part of the conceptual process for new technology. It’s an issue we’ve always had that with web accessibility we’re always running to catch up because new ideas that come to market on the web really, really quickly and the trick to it, in my opinion, is getting close to the innovators, throwing in their face and keep on reminding them. Today we’re talking about accessibility of social networks, tomorrow it will be something else but I’ve got no idea what it’ll be.

Paul:
OK. So just before we wrap up let’s bring it back down to the more mundane day to day level. There will be a lot of people that are listening to this podcast and listening to our conversation thinking “Wow! This seems really overwhelming. It all seems very complicated. There seems to be talking about us having to get disabled people in to do testing, that sounds very expensive. There are legal obligations here and that sounds very scary. There are these various technical guidelines and they all seem very confusing.” Just to those people that are web sites owners that have perhaps buried their head in the sand so far about accessibility. What little step would you suggest to them? Just to get them going. Just to make the first tentative steps into the world of making their site more accessible.

Julie:
The first document to read is PAS-78 which is free of charge. It’s only about 60 pages and that’s in large print. It really is quite an easy read. We made sure of that when we wrote it. PAS-78 sets it all out in plain language. It’s very much written with the business audience in mind. I’d also offer some encouragement. Have a look at some of the case studies, you can easily find them on the web, of big companies that have applied accessibility and are profiting from it. An example being Legal & General, the one that I talk about a lot at the moment. Legal & General had a 300% increase in the take-up of one of their financial products via their website after they made the site more accessible.

Paul:
Wow!

Julie:
300% in a matter of months. You wouldn’t dare set that as a business target. It astonished me and I’ve long believed in this stuff. 300% is amazing. There’s also been a lot written about Tesco. Tesco take millions more in extra business away from their competitors because they’ve made their site more accessible. Accessibility is a good news story. There is money to be had through accessibility. If you make your website content available to the biggest possible audience that you’re tapping into a much bigger pot of money. Disabled people as a group in the UK alone are estimated to have an annual spending power in the region of £85 billion! An incredible amount of money that someone needs to exploit, to capitalise one. Disable people are very happy to be marketed to. Perhaps more so than other groups because disabled people, in particular blind people, are not exposed to advertising and therefore not exposed to a lot of choice that those of us that can see take for granted. Accessible sites are also interoperable sites. They work well on different platforms. If you make your site accessible for a PC you’re making it accessible for many other technologies including a mobile phone which people are using increasingly more now in the UK. Yes, there is a legal imperative as well. I wouldn’t be afraid of that though. There’s a long process involved in that. The DDA to safeguard disabled people’s rights to participate in society. Now indeed when a disabled people feels and finds that they have been discriminated against because of the way a web service is presented to them, of course they are going to feel angry and upset. I have long said I have never understood why I should be able to use a product or service to buy some tickets online because I can see but my blind friend can’t. To me that’s completely unacceptable and unnecessary discrimination. However it’s not a case of “Oh I’m not happy” and we’re all in court. There’s a process there of conciliation. The DRC is involved in that process or it can be, as well as a number of disability organisations because what we want is not to take anybody to the cleaners. It’s to make the web more accessible. The key to that is my mind is dialog. When I used to work at RNIB, if a blind person contacted me having found a website they couldn’t use and it was one of the bigger ones. This is what happened with Tesco. 40 blind people got onto us saying they couldn’t use Tesco and they wanted a legal case to be taken. This was tremendous because it’s alerted Tesco to this issue and it meant that we were able to start a dialogue, the result of which is hundreds if not thousands of blind people are now able to do online shopping for their groceries and delivered to their home which is wonderful. Tesco is not unhappy because it’s bringing in a lot more money through that channel where it wasn’t bringing in any previously from disabled people because it was inaccessible. What we are trying to achieve here is sustained change that will see disabled people included in society to the degree that it would seem outrageous and ridiculous not to do so. Big changes happen. I never thought I’d see smoking banned in public places. I can’t believe it. My goodness if we can do that as a society we can change the way we behave towards disabled people, stop belly aching about the issues and talk to each other about working towards solutions. I’m optimistic that in 20 years we’ll see disabled people much more included in everything that we are all doing now to keep the debate about disabled people and accessibility alive, contributing to a brighter future for disabled people. We should just keep on doing what we are all doing.

Paul:
Excellent. Thank you so much Julie for taking time to come in and talk about that. It was really interesting. I hope to get you back in again in the future before too long.

Back to top

Quick and dirty competitive analysis

Posted in Web strategy on by Paul Boag

If you have a long list of competitors, doing a comprehensive review of them all might be too time consuming to be justifiable.

Every organisation should know what their competition is doing online. However, getting your boss to pay for proper competitive analysis is not always easy. I therefore thought I would share some quick and dirty techniques for doing competitive analysis yourself.

I am going to go ahead and make the assumption that you already know who your competitors are. If you haven’t already, make a list of them including their websites. Depending on your sector this could be a fairly long list. It will range from the large well established players to the small and dynamic upstart.

If you have a long list of competitors, doing a comprehensive review of them all might be too time consuming to be justifiable. In such situations you will be forced to narrow the list a little. However, be careful. The tendency when narrowing the field is to focus on the largest competitors. This can be a mistake. Sometimes the smaller sites, or those new to the marketplace, are more likely to be doing something innovative which you might be able to learn from. Instead try and ensure a mix of both larger and smaller sites.

Once you have established which websites you want to review I would suggest trying the following steps.

Basic review

Step 1 is to do a basic visual review yourself. Nothing beats taking the time to look through a competitors website. As you look through each site ask yourself a series of questions.

  • What is the message and tone of voice being used on this site?
  • What content and functionality is highlighted on the homepage and in the navigation?
  • What image are they trying to project through the design?
  • What functionality and content do they have compared with your own website?
  • What labeling are they applying to the content areas and site sections?

The aim is to gain a better understanding of the strategy being used by your competition regarding the web. Where you encounter differences in approach from your own site ask yourself why. Why have they chosen to approach the problem in a different way? Does that alternative approach give them an advantage?

User testing

Step 2 is to try user testing your competitors websites. There is no reason why you can only user test your own website. In many cases it can prove extremely useful to test your competitions website because it gives you an opportunity to test out responses to design, content, functionality and site structure. In short you can learn from what they have gotten right and improve on what they have done badly.

I am not going to get into the details of running a user test session here, although this is a subject we should return to at some point. What is important, is that testing a competitors site is a great training ground for making improvements to your own.

Accessibility

My next step when assessing a competitors website is to assess how accessible the site is. Potentially your competitors could be turning away valuable business simply because their site takes too long to download or because it cannot be accessed by people who don’t use internet explorer. Obviously accessibility is also about access for the disabled and this can be assessed using the WAI guidelines. However, if you are a website owner or manager rather than a designer/developer these guidelines may well prove more confusing than helpful.

For the sake of this section I want to suggest two tests that you can use to help assess how many users your competition are turning away.

Browser support

The first is to look at your website on as many different browsers and computers as possible. Many people do not realize that there are other browsers than Internet Explorer and that even Internet Explorer has various versions that will display your website differently. I would recommend you look at your site in at least Internet Explorer 6, Internet Explorer 7, Firefox, Opera and Safari for the mac. You may well be surprised at the differences you see. You can either download these browsers and test the websites manually or alternatively use a services such as Browsershot that will provide screenshots of website as displayed in different browsers. Obviously, if you use a screenshot service then you won’t get the interactivity of a real browser. However, for the sake of assessing the competition this is normally enough.

Download times

The second test you might want to perform is analyzing how fast the site downloads. In this age of broadband many web designers have become less concerned about download times. However, not everybody has broadband and most sites cannot afford to ignore dialup users. One service that helps you find out how long your site takes to download is a website optimization tool. Ideally you should be looking for download times of less than 10 seconds however anywhere between 10 and 20 seconds is acceptable.

Online visibility

My final step for assessing the competition is to look at how visible their website is. That is to say, how easy it is to find. Do your competitor’s websites rank higher than your own? Do more people link to them? Is there more talk about your competitor’s brands than your own? All of these questions are incredibly revealing.

A good place to start is with one of the many free websites that check various sources to ascertain online visibility. The one that I use most often is popuri.us. This checks your competitors visibility on Yahoo! and Google, but also on blogging search engines like Technorati and social networking sites like del.icio.us.

If you want more specific information relating to your visibility on certain search phrase then you will need a rank-checking tool. Again there are various free services available including Google Ranking, which checks all major search engines despite the fact that its name appear Google specific.

However, it is the question of linking that is most interesting. Who links to your competition and can you persuade them to link to your site? Finding out who links to your competition is remarkably simple. Just use the same popuri.us service I mentioned earlier. You will notice a number of the results are marked “backlinks”. By clicking on the details link associated with these backlinks you will be taken to the appropriate search engine and see all of the webpages that link to your competition. Alternatively you can simply go to the search engine you wish to check and type:

link:http://www.yourcompetition.com

This will return all of the sites linking to that website address. You can now contact these websites as appropriate asking if they would be willing to link to you instead of your competition.

Summary

The above is not intended to produce a perfect competitive analysis but it should get you started. Its a quick and dirty approach that gives you a handle on:

  • How easy your competitors websites are to find
  • Whether they are turning potential visitors away
  • How easy their site is to use
  • What they are trying to communicate and achieve through their content and functionality

Hope that helps.

Show 89: 404

Posted in Classic shows on by Paul Boag

On this week’s show: Paul talks about creating the perfect 404 page, Marcus covers some of the basics of rich media and Aral Balkan makes working with databases and APIs a whole lot easier in flash.

Download this show.

Launch our podcast player

Before we dive into today’s show I have a small request from you our loyal fans *cough*. As you may have noticed the show notes we produce for this podcast are a lot more comprehensive than once they were. They are almost a complete transcript, which is important to us because we want the show to be as accessible as possible. I have been contacted by a number of deaf users who are frustrated because they cannot access the show and to be honest I sympathize. We have done our best to produce a complete script but we are getting hung up on the expert section. I just do not have the time to go through and reproduce everything say. An alternative would be to use a service like Casting Words but to be frank I am not confident on the quality we would get back. I was therefore wondering if any of you would like to volunteer? I know a number of people have offered to transcribe in the past but quickly became overwhelmed with the amount of work involved. However, transcribing just this section of the show (typically about 10 minutes) shouldn’t be too bad. Hopefully if we can put a rota together it should be too big a job and best of all you would get to listen to the expert sections in advance :)

So, if you can spare the time drop me a line.

News and events

Writing for the web

First up this week is the fact that the latest issue of A List Apart is entirely dedicated to the subject of writing for the web. There are two great articles both of which are definitely worth reading. The first post takes the idea of personas and suggests that your website too should have a persona. What tone of voice should your website have? What character should it project? The second article (and my personal favorite of the two) is a passionate defense of good writing on the web. It fights hard against the attitude that web copy should be kept to a minimum arguing instead that if the content is web written it draws the user in and engages with them in the same way good design can.

Both articles are excellent and has made me reconsider the importance of good copy. It is an area I am constantly frustrated by and just wish I could get my clients to pay for a copywriter to really bring their sites alive.

Microformats in Google Maps

Next up is a really exciting announcement by Google. It would appear that Google Maps now supports Microformats. I can hear your cries of disappointment… thats not that exciting! Well, I think it is. This is a huge boost for the Microformats community and puts literally millions more hcards out there. Not only will this raise the awareness of Microformats but I also think it will lead to some interesting mashups using the massive database of businesses that are displayed on Google Maps.

If you are yet to play with Microformats or haven’t gotten around to adding them to your website then now is the time. They are quick and easy to implement and oh so very cool ;)

There has been a lot written about Microformats but it is nice to see big players picking it up and running with it. Good stuff.

Corporate Web Standards

What you don’t see a lot written about anymore is web standards. Its almost as if all of the arguments have been made. However, I did come across an article this week that convinced me there was more to cover. It was a discussion about implementing web standards in a large corporate environment where you are weighed down under legacy pages and internal politics.

It was a refreshing article because it was so pragmatic. Much of what you read about standards is bordering on fanatical. This article was much more down to earth accepting that you cannot implement the perfect solution especially within a large corporate environment. It talked about little steps and something being better than nothing.

If you work in a large organisation then this is definitely worth reading. You will find it very encouraging.

Web Design advice

Last up is a couple of websites I have stumbled across this last week. Both of them are provide general web design advice and I have to say both look very impressive. The first was sent to me by Charles Russell who recommended it as an alternative to “The Principles of Beautiful Web Design“. I am not sure it is an alternative personally but it is certainly an interesting website. It is called Web Design from Scratch and does exactly what it says on the tin. It literally covers every aspect of web design providing basic advice and then referring you on elsewhere. Ideal for the beginners.

The other site I wanted to mention is the Web Designers Wall which I believe has only just launched. It seems to be filled with all kinds of nice goodies including tutorials, code snippets, commentary, inspiration and more. What is more the site design is beautiful. I have a feeling that this site is only going to improve with age.

Marcus’ bit: Rich media

Multimedia doesn’t really mean that much anymore I think. It used to refer to CD-Rom type content but now I think it refers to any web content that isn’t just plain old text and images.

I have been pricing up some new/interesting/dynamic content for one of our clients and it struck me that I haven’t discussed this sort of thing here before. I guess there isn’t a great deal of point to this other than ‘have you thought of doing…’, so here goes…

Animated shortcut banners

These seem to be all the rage at the moment. Usually quite a large portion of the homepage is dedicated to a rolling carousel of messages or adverts for content deeper in a site. There will usually be 3 or 4 different ads that flow from one to another. Manual controls are also available to go straight to a particular shortcut or pause on an ad.

There’s a good example at Wildfowl and Wetlands Trust.

Video

I don’t really mean just plain video; I’m referring to a piece we did for the Surrey Hills AONB that incorporated:

  • Still shots
  • Video footage
  • Voiceover

All of which were pulled together to create a tourism video that can be downloaded at Surrey Hills.

The voiceover, incidentally, was done by Surrey Hills patron and famous british actress, Penelope Keith. Going to her rather grand house to record the session was a great experience.

Voiceover

Which brings me nicely on the subject of voiceover. I have two rules relating to voiceover recording:

ALWAYS use a professional actor. The girl in the office with the ‘nice’ voice will sound rubbish, so will the ‘posh’ guy in accounts (we know, we’ve done it!). Voiceover actors aren’t that expensive and, because they’re professional they’re quick. I have used Voicebookers in the past and they have been superb.

Less important but… use a proper voiceover recording studio. I have used studios in London that are really very reasonable and the quality is superb. Though of course this isn’t always possible as with Penelope Keith (recorded my laptop).

Panoramic imagery

We have done a few external 360 degree images, again for Surrey Hills and some for National Trails. We haven’t used dedicated equipment that take full spherical shots basically because you end up with an unnecessary amount of sky. I have simply used a decent camera and tripod and done two full sweeps of portrait images (roughly one just below the horizon, the other just above), moving the camera about 10 degrees each time.

The ‘fun’ part with these images is that they are usually taken from high vantage points so expect to have to do a lot of climbing to out of the way places!

There is a compromise to be made with panoramics. The best time to take a good landscape photo is early in the morning or just before sunset. However, for a panoramic that doesn’t work because you will have the sun in view for a large chunk of the image. This is one of the reasons why panoramic images can often look a little ‘flat’.

Dynamic screensaver

This is quite a cool idea where the standard screensaver idea (pretty pictures rolling from one to the next) is enhanced to allow the client to update information to it. Basically, when the screensaver fires up (as long as it connected to the internet) it checks with the client’s site to see if any changes have been made and automatically updates if there has. This is really handy for news stories but could be used for anything.

Mapping

I think I have discussed mapping previously because it is something Headscape has done a lot of in the past. Up until recently we tended to develop maps using Flash where points of interest are dynamically generated using grid references. We also added features such as layering of different categories.

However, recently we have developed a site for River Thames that utilises Google Maps. The site’s main purpose is to promote the River and encourage people to visit. Again, we have used Google Maps to show points of interest such as places to eat, places to stay etc that are controllable in layers. Using GM is very cool though because the points shown alter when the maps are dragged and/or zoomed (apparently lots of brain power went into making this work!).

Finally, we also created a trip planner or itinerary builder that gives site users the opportunity to list all the places they want to visit (inc. contact details, address, directions etc) and print this off in a print friendly design or email to a friend.

Paul’s corner: Handling missing pages

I noticed this last week that I have been getting a lot of traffic from the Smashing Magazine and so I went to check out where it was coming from. Turns out it was an article on 404 error pages and they had used my error page as an example. The article also referenced another site called the 404 Research Lab that provides lots of good information on setting up custom error pages. All of this reminded me I wrote a blog post ages ago about handling missing pages and yet for some reason i have never spoken about it on the show before. Seems strange because it is a subject we all need to deal with. So, I thought it was time I covered the subject properly using my old blog post as the basis.

Review: Aral Balkan on SWX

Paul Boag: OK, so joining me today is Aral Balkan. Hello! How are you?

Aral Balkan: I’m fine, Paul. How are you doing?

Paul: Not too bad. I feel like I’m speaking to you quite a lot recently, one way or the other.

Aral: [laughs] I know, but it’s fun, huh?

Paul: So I was explaining to everybody earlier in the show how we got you into Headscape to give us a little bit of training and kind of bring us up to speed with what was going on with Flash.

Aral: Yeah, that was a lot of fun, too.

Paul: You had a good day, did you? It wasn’t too painful then.

Aral: Yeah. Me and my bunny had a good day. [laughs]

Paul: Yeah, that was deeply disturbing, on so many levels.

Aral: [laughs]

Paul: But I think we’ll just leave it at that. We won’t tell people any more details on that. We’ll just leave them worrying about it. [laughs]

Aral: OK, let’s do that. [laughs]

Paul: So, as part of that day, you mentioned SWX, which is something that you’ve been involved in developing. And it sounded so cool and kind of dragged my attention back when there were points where I was thinking that this is beginning to get a bit out of depth to me.

Aral: [laughs]

Paul: There were techie people in the room that understood what was going on.

Aral: Yeah.

Paul: But then you started talking about SWX, and I started to think, “Ooh, that sounds cool” so I thought I’d get you on the show and ask you a little bit about it.

Aral: That’s great. That’s great, because SWX is what I’m most excited about these days.

Paul: Good stuff. So, do you want to kick us off by telling us a little bit about what SWX is?

Aral: Well, SWX is a couple of things. SWX itself is a new data format for Flash. It’s actually the native data format for Flash, which is kind of weird, because Flash has been around for a while, so why hasn’t it had a native data format until this point? I don’t know. Nobody else did it, so at the end; I was like, “OK. Well, I guess I have to bite the bullet here.”

And when I say native data format, if you’re not very fluent with Flash, think about JSON, or what JSON is for JavaScript. But it’s actually a step beyond that, because, with JSON, you still either have to parse it, or in JavaScript you have to evaluate it, before you can use it. So there’s another step before you can use it, after the data’s loaded.

In SWX, there isn’t. It uses SWF files, which are native Flash files, to store data, so it makes it very easy to work with.

Paul: What’s the kind of target audience for this? Who do you see as using it?

Aral: There are a couple. So, anyone right now who’s working with Flash basically can use this to build mash-ups, to build data-driven Flash applications. And also, mobile developers who are developing with Flash Lite can use SWX to develop mobile Flash applications.

And in fact, that’s where it’s currently, I think, most useful, because with SWX RPC–which is the remote procedure call, the gateway for it–you can make remote procedure calls, so call back-end services and methods, through SWX. And it’s the only RPC solution, really, because Flash Remoting doesn’t work on Flash mobile, on Flash Lite, so it’s the only RPC solution for mobile right now.

Paul: I think what kind of struck me about it was the fact that there are a lot of people out there that maybe have been doing some superficial stuff with Flash…

Aral: Yeah.

Paul: And have been doing some ActionScript and things like that.

Aral: Right.

Paul: But when it gets to things like making data calls, it all seems to get horribly complicated, all of a sudden.

Aral: It does. It gets very hairy, and I don’t know why. I think part of it is because the back-end, the server side, of applications has traditionally been the realm of traditional programmers: the brainiacs, the people who are very comfortable talking in code, thinking in code.

And they’re not always the best people, I find, to simplify concepts, because they’re so intelligent, they can understand all of this, or they have such a focus on this that they don’t mind spending hours trying to set something up. Sometimes, they’re not always the best people to create simpler systems for mere mortals like the rest of us.

Paul: [laughs]

Aral: So that was my main motivation behind it, because I think Flash is great for building mash-ups and data-driven applications. But we don’t get as much experimentation in Flash with that, and I think it’s because it’s too hard. The barrier of entry is too high. You have to jump through so many hoops to get even something basic working, whereas it should just be, off the bat, you should be able to get started with things. And that’s been my focus with SWX.

So, for example, on the Mac, there’s a bundle that you can download that gives you everything you need to start using SWX, with a one-click installer, a disk image.

Paul: Cool.

Aral: My focus, really, with SWX is on simplicity. And when I say simplicity, I mean for the whole process, from the moment you go on the website and download SWX, to the moment you can get up and running. I’m trying to make that whole process as easy as possible, basically.

Paul: From what you showed me when you came into Headscape…

Aral: Yeah.

Paul: Basically, within a few minutes, you can kind of download this bundle onto my Mac. I can run an install file, which sets everything up for me.

Aral: Yeah.

Paul: And you’ve even set up…

Aral: Well, you basically get a development server for free.

Paul: Yeah.

Aral: It uses the MAMP Bundle, which is a great bundle that has Apache, PHP, MySQL. So if you’ve ever been afraid to work with these things, that’s also a way to get started, because there they are on your machine, running, without any configuration or anything on your part.

Paul: And you have also included some kind of interfaces to common APIs, things like Flickr and Twitter and stuff.

Aral: Yes, and in fact, if you remember the installation process and everything that you were talking about, you don’t even have to download and install SWX to start working with the pre-existing APIs that come with it, because I host an instance of the SWX gateway on swxformat.org. It’s the public SWX gateway that you can just hit directly from your Flash applications.

Paul: Ah!

Aral: So if you don’t want to mess with the back-end, but say you want to build a mash-up that uses Flickr or Twitter, currently two of the main APIs that I have on there, you don’t even have to download SWX. You can just open up Flash, write four or five lines of code, and get, for example, the list of your latest photos from Flickr.

Paul: Cool.

Aral: Or your friends’ photos. With nothing else. So you don’t even have to download anything to start working with SWX, because it is native. What you’re getting from the back-end, from that SWX gateway, is a SWF, and Flash knows how to deal with that, and the data in there is a native Flash object and ready for you to use the moment it loads.

Paul: So, how does somebody get started on this? Where do they go? What do they have to do? Especially, you made it sound very simple for the Mac. Is it horribly complicated if you’re a Windows user?

Aral: Oh, not at all, not at all. Like I said, regardless or what platform you’re on, unless you want to build your own server-side services, if you want to use the APIs that it comes with, you don’t even have to download it, actually.

Paul: Oh, OK.

Aral: In fact, just last week, I got moo cards printed. And these little moo cards have all the code you need on the back of them, because there’s only about four lines of text you can put on the back.

Paul: [laughs]

Aral: But they have all the code you need to get the latest public timeline updates from Twitter. So it’s actually, seriously, four lines of code, and it fits on a moo card.

Paul: Wow!

Aral: So, to get started, you don’t have to do anything, really, apart from open up Flash, write four lines of code, and see it run and get the feeling that, “Wow, maybe I can build data-driven applications in Flash, too, because this is simple.”

The next step would be to download SWX onto your own machine. If you have a development server already, if you have a web server with PHP, then you just download the ZIP file, unzip it into your web root, and hit that location in the browser, and the start page comes up and guides you through the rest of it.

Paul: Cool.

Aral: If you’re on a Mac, get the MAMP Bundle, and that’ll get you started even faster. But, like I said, you don’t even need to download anything to start playing with it.

Paul: So these four lines of code to get you going…

Aral: Yeah.

Paul: If they don’t have one of your precious mood cards, where can they go to learn those kind of basics?

Aral: Well, on swxformat.org, there is a screencast right now. It runs you through the MAMP Bundle, but the concepts are exactly the same for all of the rest.

Paul: OK.

Aral: Although, I am going to record a few more screencasts. I’ve started putting them up on Viddler, which is actually really cool. I don’t know if you’re used it.

Paul: Yeah, I have.

Aral: But it’s really great for screencasts, because it keeps the original resolution of your movie. So I’m going to record quite a few more and put them up there, including one that will just get you started, like the moo card does.

Paul: Cool.

Aral: So, look on swxformat.org. And also, look on my blog, because I blog about SWX quite often there: it is aralbalkan.com.

Paul: So as I understand it, at the moment, this is all built on PHP and MySQL. Is that going to change? Are we going to see other platforms supporting this, too?

Aral: Well, basically, the SWX format itself is a data format, so it’s platform-agnostic, in terms of the back-end, etcetera. So if you have a SWX SWF, you’ll be able to load that. Even if it’s offline, if you have if on your hard drive, you’ll be able to load it into Flash and get the data off of it.

Paul: Excellent.

Aral: And then there’s SWX RPC, which is an implementation of a gateway, basically, or an endpoint, that serves SWX SWFs. And the current implementation of that is only in PHP.

Paul: Right.

Aral: So, it will be ported later on. It’s currently in beta. And once we get closer to the release date and certain things are standardized, I’m going to be concentrating on orchestrating the ports. There’s a lot of interest from quite a few people to port it to Ruby, to J2EE, to.NET.

Paul: Excellent.

Aral: And my focus right now is on getting SWX to a level where it’s somewhat of a standard–not like an Internet standard, but at least, within itself, we know what we’re talking about when we say a SWX SWF so that, if it’s being generated from Ruby, it’s the same thing…

Paul: Yeah.

Aral: So there’s no fragmentation. That’s my focus right now. In fact, I’m writing my first RFC…

Paul: [laughs]

Aral: For the SWX formats, just so things are a bit more standardized, before we go porting it to every possible technology.

Paul: Excellent! That just sounds really exciting…

Aral: I’m really excited about it!

Paul: Yeah, I bet you are.

Aral: This has gotten me excited and working with technology again, at a level that I hadn’t been in the past. It’s fun. Because this stuff, the data exchange between tiers, it’s really not rocket science, and it shouldn’t be rocket science. We’re just moving stuff from one place to another. And my philosophy is: make that as simple as possible for people so they can concentrate on the really fun bits…

Paul: Yeah.

Aral: Building the user interface, building a great user experience. Because those are the hardest bits, really, conceptually, and they’re also the most fun.

Paul: Yeah. That’s great stuff, and I wish you all the best with it in the future. And thanks for coming on the show and telling us a little bit about it.

Aral: Thanks so much, Paul, for having me. It was a lot of fun.

Paul: Yeah. OK. Good to talk to you, and we’ll speak to you again soon.

Aral: OK, take care of yourself.

Show 87: Trends

Posted in Classic shows on by Paul Boag

On this week’s show: Paul discusses about emerging design trends, Marcus talks about supporting existing websites and Ben Werdmuller introduces us to the open source community tool Elgg.

Play

Podcast: Download (23.2MB)

Download this show.

Launch our podcast player

Eric Meyer: Competition

Before we dive into the show, I wanted to mention a two day workshop Eric Meyer is going to be running in London on the 13th and 14th August. For those of you who do not know Eric, he is one of the world’s leading experts on CSS and XHTML. He has written numerous books as well as speaking internationally on the subject. This is no ordinary CSS training course and if you can you should consider attending

Although this workshop is not cheap at £695 it will tell you everything you need to know in order to build top-quality CSS and XHTML websites. Eric is an incredibly knowledgeable guy and it is definitely worth hassling your boss for the registration fee.

Of course, not all of us have a boss we can hassle. So for those of you with less disposable income we have a free ticket to give away. All you have to do is answer the following questions:

“In which episode of the boagworld podcast did I first mention the subject of web standards?”

To enter simply email me your answer, including the word “Meyer” in the subject line.

Good luck and we will announce the winner in next week’s show (so entries need to be in by 30th).

News and events

Conflicting absolute positions

I discovered an interesting thing about absolutely positioned elements this week. I was reading an article called conflicting absolute positions on the List Apart website and it mentioned that all modern browsers now seem to support 4 cornered positioning. In other words you can set the top, bottom, left and right corners of an absolute positioned element and it will dynamically work out the height and width.

This struck me as an amazingly useful tool that allows for all kinds of possibilities. Most useful, as the article points out, is that you can start doing some interesting combinations of fixed and fluid width elements.

The downside is that unsurprisingly this is not supported in IE 5 and 6. However, the article does suggest interesting workarounds for some specific scenarios. If you have a few minutes check out this article as it is well worth the time.

Quikmaps

We have talked before on the show about various websites that make the process of adding google maps to your site less painful. However, this week I came across another one that I particularly like. It is called Quikmaps and it has a wonderfully clean and easy to use interface.

You can quickly add new points of interest and even draw lines showing routes. You can also select from a massive range of icons and add your own marker info just by clicking on a point.

Finally they make it incredibly simple to add the map to your site. You can enable or disable a range of features (including map controls and draggability) and add it to your site by copying and pasting a tiny fragment of code. However, the nicest thing from my perspective is you can do all of this without registering for the site.

The best websites are useful and ugly

I have to say I am a little disappointed with the latest post by Gerry McGovern. Gerry is a usability expert who’s posts I read on a regular basis. The vast majority are superb but his latest post is reminiscent of the kind of thing written by Jakob Nielsen. In this post he argues that the most usable sites are often the ugliest. In my opinion this is an incredibly blinkered view. Although he points out a number of recent design trends which damage usability that does not mean a website has to be ugly. I have said it before and I will say it again, website can be both attractive to look at and easy to use.

What is more, this post smacked of the attitude that usability is all important. I do not believe this to be entirely true. Usability has to be balanced with numerous other considerations including brand identity and design aesthetics.

Its a shame because in other posts Gerry talks a lot of sense. It would appear that I am left with Steve Krug to champion both usability and design working together.

Survive the digg effect with Amazon Web Services

I seem to be hearing a lot about the Amazon web services at the moment. I have just returned from the Institutional Web Managers Workshop where I was speaking. While there I met Jeff Barr from Amazon who was talking about the different web services they offer. On my return I came across a post on the Think Vitamin website covering exactly the same subject and I have to say I have been impressed.

Amazon offer a growing number of web services aimed at developers. However, the two which have impressed me the most are the simple storage system and the Elastic Compute Cloud. Basically the first is a superb way of managing the growing bandwidth and storage demands of your site while the second allows you to dynamically increase the power of your server environment to respond to peaks in demand.

There are literally endless applications of these technologies and I don’t have the time here to cover the subject in depth. However, if you are developing an online application or if you are likely to suffer from spikes in traffic (such as can be caused by sites like digg) then you will want to explore this more.

Marcus’ bit: Providing the right support

A lot of web design agencies have made themselves, and by association, the rest of us, unpopular by enforcing unnecessary and, quite often, unfair support agreements on their clients. The ‘classic’ support model is 15% of the value of the contract over 3 years. This has somehow evolved from enterprise software solution installations where onsite support is required covering daily usage by thousands of employees. Very few websites need this level of support.

At Headscape we have always taken the approach that support, like the job, is unique to that client. That is, we aim to provide the most appropriate support for that client.

However, what does that actually mean? This article covers the various options we offer our clients and the thinking behind them.

Ad hoc support

This is simply work carried out on an existing site on a job-by-job basis. Other than not having to pay for anything until it is needed, there is generally no bonus to the client with this method in that standard rates are charged and work slotted into the schedule when it can be done.

However, I think it is still important to sign a support agreement stating the terms of the agreement and particularly the process involved for booking work. Usually some sort of email booking process is simplest and avoids writing contracts for every little piece of work.

Minimum monthly allocation

On this basis we schedule in a guaranteed minimum level of work (e.g. 0.5 person-day) every month for at least six months.  Because we can plan around that minimum allocation, we can offer a discount on our standard rate. 

The agreement for this type of work needs to cover a variety of points:

  • Again, the ordering process
  • Term for the agreement and when it starts
  • Invoicing – usually this would be monthly in arrears with any work over and above the fixed amount invoiced the following month.
  • Reporting

With this type of agreement, any unused time is usually not carried over into subsequent months or agreements.

High priority work

This is a fairly tricky area to sort out because you have the issue of ‘bumping’ existing scheduled work if high priority work comes in. This is not a problem in slack times but can be if everyone is busy. There is no magic answer other than saying that emergencies do happen and things needing attention quickly is part of any service business’ week to week existence. Bearing that in mind, it is good practice to have an agreement in place that documents how things will be dealt with.

If a client requires the additional assurance of an ongoing support contract with defined levels of response, we offer an annual pre-purchased package of support credits that can be called upon as and when required.  One credit equals one hour’s work in value.

Depending on the urgency of the required response, support credits purchase a different period of Headscape’s time. For example, low priority work is charged at 1 hour = 1 credit, whereas high priority work is charged at 1 hour = 2 credits.

To summarise, the golden rule is to agree on whatever terms suit the client best then put it all in writing.

Paul’s corner: Emerging design trends

I received this question from John in Dublin:

I am a designer working on a new clients website. He says he wants the website to feel very contemporary and web 2.0. like. However, my concern is that if I design something that feels like a web 2.0 site, it will be out of date by the time it goes live. It feels like web 2.0. design is on its way out. What do you think the next big design movement will be?

Although this is obviously an impossible question, it hasn’t stopped me from trying to answer it in my latest post on emerging design trends.

Review: Elgg

I have received a number of emails from various people over the last few months mentioning something called Elgg. None of the emails gave a lot of detail but said I should talk to a guy called Ben Werdmuller. After googling Elgg I discovered it is an open source social platform that appeared to be community based in nature. However, my lazy gene kicked in and instead of reading through an entire website I decided to get Ben on the show to tell me more.

If you are considering building a community based website, you should definitely listen to this interview.

Show 85: Bulletproof

Posted in Classic shows on by Paul Boag

On this week’s show: Paul provides some design advice for developers, Marcus provides so post launch pointers and we review Jeremy Keith’s Bulletproof AJAX book.

Play

Podcast: Download (20.3MB)

Download this show.

Launch our podcast player

News and events

Unfolding the fold

The first news story today is actually not news at all. Well, its news to me (because I wasn’t previously aware of it) but the actual post was made back in December of last year.

The post relates to that most irritating of subjects; “the fold”. I have spoken about the fold many times before. The mythical point at which people have to start to scroll. I say mythical because this point changes depending on your screen resolution, browser type and toolbars.

The reason it is so annoying is because clients are obsessed with it. They are convinced that users don’t scroll (a perception rooted in the early 90s) and no amount of persuasion seems to change their minds.

However, hopefully the post I found this week will help. “Unfolding the Fold” is a post on the ClickTale blog that provides some hard stats about the fold and scrolling in general. It demonstrates that the vast majority of people scroll, with almost all of them scrolling right to the bottom of the page. Their conclusion is that there really is no reason to squeeze all of your content above the fold.

d.construct tickets on sale 10th July

If you are in the UK on the 7th September you should be sure to come to d.construct. d.construct is in my opinion one of the best web design conferences around. The reason I like it so much is that it works hard to maintain a grass root feel that is accessible to anybody.

For a start the price ticket is very accessible at £85 + VAT. Secondly, the whole thing happens on a single day so there is no need for expensive hotel bills if that is a problem. Finally, they have a great mix of speakers with many of the big names you would expect but also a lot of less well known people in order to “shake up the scene”.

The reason I mention it now is because the tickets are going on sale next tuesday (the 10th). Historically they sell out incredibly fast. Although this year they do have a larger venue and so that should help somewhat.

I really want to encourage you to attend this event if at all possible. I will definitely be there and it would be great for us all to meet up.

Fonts licensed for web apps

Talking of d.construct, Richard Rutter (one of the organizers of the event) has posted an interesting blog entry on “font licensing“. Admittedly font licensing, doesn’t sound very exciting but potentially it could be. Richard has spotted a press release from a prominent font provider. This press release talks about a new type of license…

Ascender Corporation announced a new licensing program for font software implementations with server-based applications.

Richard goes on to suggest this might be another move towards browsers supporting downloadable fonts. This would allow us to use whatever font we wished on a website rather than being limited to what the user has on his or her desktop.

Richard does warn that this might just be in reference to Silverlight, because Ascender does work very closely with Microsoft. However, personally within the context of Opera’s move towards downloadable fonts, I am hopefully this might be something more.

A new way to visualize your desktop

Finally today, I wanted to mention a technology called Bumptop. I recently watched a demonstration of the system and was blown away. Basically, Bumptop is a new way to work with files that mirrors much more closing the experience of interacting with your desk in the physical universe. You can stack files, throw them around and even crumple them up in a 3D environment.

When I first watched this demo it felt like a novelty, but the more I thought about it the more potential I saw to organize content in a more dynamic and flexible way.

What I like most about this interface is that it is not trying to teach us a new method of interaction. Instead it is trying to replicate something we are already familiar with. The idea of using metaphors we already understand is a staple of interface design and is what makes things like tabs, desktops and folders so successful.

I think as web designers we could learn from technologies like this. We should be looking to build on established conventions people understand rather than always seeking to do the next big thing or be innovative in someway. Bumptop is innovative but it does so in a way that is instantly accessible to everybody.

Paul’s corner: Design advice for developers

I received this great question from Simon that I thought worth addressing on the show…

I hear lots of questions about the technical and business side of Web design, but what I don’t hear is how do the already technical amongst us become better designers – maybe being a visual thing this just won’t work on an audio podcast, but at least you could give us your top 5 ways to grow artistically.

As has become tradition, I decided to blog on the subject a few days ago but unsurprisingly failed to stick to “5 ways to grow artistically”. Instead I managed to produce a long and rambling essay on “when designers design” which I bore you all with on the show.

Marcus’ bit: Post launch Protocol

Everyone, client and agency, seems to understand the principle of not letting a site stagnate. Content should be regularly updated and, ….and what?

We see a lot of client demands for content management systems that are then often not used for lengthy periods of time. Therefore I thought it could be useful to look at what options there are to a site manager after that big day when the site goes live.

Of course, not everything here will apply to everyone but hopefully some of it will.

News and events

Stories, articles, seminars, fun days, whatever. These are your opportunity to create new content very regularly.

Clients are invariably perfectly happy with their site when it goes live. This is understandable, they have more often than not spent months working on it, tinkering with this, fretting with that and a) they need to spend some time on other aspects of their job (that have been neglected) and b) the site really has never been more up to date!

But what often happens is that a couple of months down the line they realise that new content needs creating but they can’t remember any of the CMS training. The 50 page accompanying manual is too scary so things get left. This happens until we are asked to add the new content because we’re too busy and it’s urgent and often, later on, further CMS training is booked.

News and events provide a steady stream of new content that helps keep the site fresh but also the CMS skills of those looking after the site.

Shortcuts

Updating shortcuts to key content is again a simple way of refreshing a site’s content without putting that much effort in.

Homepage shortcuts tend to link to:

  • Latest news
  • Latest events
  • Repeated main navigation
  • Products
  • Special offers
  • Facilities e.g. login, subscribe etc
  • Important ‘deep’ content
  • Popular topics

I guess the point I’m making here is a lot of these shortcuts can simply be rotated giving a feeling of change on the site. For example, changing a link to a main section on a weekly basis is a simple task and one that does not require the writing of any new content.

Utilising usage stats may be a good way of seeing which areas of the site need further promotion. In fact, use everything at your disposal, stats packages, CMS, content suppliers, agency support contract, internal marketing team etc so that you are as informed as possible.

Imagery

Don’t just update copy. Adding new banner imagery can really rejuvenate a tired looking design. Always look to include appropriate imagery with news articles, events etc.

Communicate

Keep your eyes open to what’s happening within your company/organisation. There may be a new project/department/member of staff etc that might be outside your sphere, that would really add value to the website.

Make yourself (and your role) known to everyone. Send out questionnaires or surveys asking people what they want to see on the site or if they have any pertinent content.

Think big

Finally, don’t lose sight of the main purpose of the site while dealing with the smaller things. It may be that the main purpose of your site is to promote your brand so updating the look and feel of the site regularly may be a lot more important than updated content. In fact, continually evolving the design of a site over time is probably far more cost effective (not to mention the effect it has on keeping the site fresh) than ‘big bang’ redesigns every 3 years or so.

Alternatively, sales leads may be the site’s primary function. In which case, keep in touch with sales and experiment with ways to boost leads.

The other really big area that site owners need to look at is site promotion. This warrants a post of its own so I’ll look at that another time.

Review: Jeremy Keith’s Bulletproof AJAX

I have decided not to do “ask the expert” this week, so we can have a review instead. Unfortunately we don’t have the time to do both segments every week so I have to mix and match from time to time.

The book I want to review is “Bulletproof Ajax” by Jeremy Keith. I read it almost 6 months ago, but haven’t had an opportunity to talk about it on the show until now.

The book is designed to be the sequel to Jeremy’s previous book “DOM Scripting: Web Design with JavaScript and the Document Object Model” which was written as an introduction to Javascript for designers. Bulletproof AJAX is therefore written in a similar tone with the focus on making AJAX accessible to designers rather than providing the technical detail you would expect from a developers book.

I have to confess I found the book a little frustrating at first. As somebody that had bought and learnt Javascript through Jeremy’s first book, I felt a little annoyed that the first 2 chapters seemed to be dedicated to laying the foundations we had already covered in the first book. I am guessing the idea was that people could buy this book in isolation without first owning DOM Scripting, but in my opinion the amount of detail provided in Chapter 1 and 2 wouldn’t make that possible. For me those first 2 chapters felt like padding to make a short book feel slightly more substantial.

However, that criticism aside the rest of the book was definitely worth the very reasonable price tag. Jeremy has an excellent writing style that is clear and engaging. He seems to explain complex topics in such a manner that you wonder what all the fuss is about. You come away from the book thinking this “AJAX stuff” is easy and wondering what all of the fuss is about. Admittedly he only covers the basics, but it is enough to get you producing the kind of AJAX applications most designers would like to build.

But, Jeremy doesn’t shy away from the more complex underlying issues surrounding AJAX. In particular he talks about accessibility and ensuring your applications work with Javascript disabled. He does this through a technique called HIJAX. I will not endeavor to explain to you the details of it here, except to say it relies on the server doing most of the heavy lifting.

From applying the principles taught in this book I have to say the HIJAX approach works very well. All of the complex stuff is handled by the developers on the server side and I get to focus on how the information is returned to the user. AJAX is a funny area that sits between client side and server side and leaves designers and developers wondering who is responsible for what. Using the HIJAX approach taught in this book, the division is much clearer.

So would I recommend this book? As with DOM Scripting it depends on who you are. If you are a designer who has read Jeremy’s first book and would like to start producing AJAX applications then absolutely. However, if you haven’t read his first book then I suggest you do that first, unless you are already confident in producing unobtrusive javascript.

If you are a developer on the other hand then my recommendation is to steer clear. This book is not meant for you and you will find it frustratingly lightweight.

When developers design

Posted in Design on by Paul Boag

Although I cannot make you an expert designer, I can offer some advice of how to avoid the major pitfalls I sometimes see developers fall into.

In an ideal world designers design and developers develop. However, we don’t live in an ideal world and from time to time we have to swap roles. The problem is that there is a lot of tutorials and articles showing designers how to develop but little showing developers how to design. I therefore thought I would share some very basic tips.

First things first, I am not going to be able to teach you good design practice in a single post. That comes with time, training and to some degree, talent :)

However, although I cannot make you an expert designer, I can offer some advice of how to avoid the major pitfalls I sometimes see developers fall into.

General comments

Before I plunge head first into specific tips I would like to share some more general comments based on my observations of when developers do design. Hopefully these will help you think of design as more than arranging pixels.

Empathy

In many ways developers work in a world of absolutes. A piece of code either works or it doesn’t. Your world tends to be very literal, very straightforward. Computers are in many ways easy to understand. People on the other hand are a very different matter. We are messing beings full of contradictions and inconsistencies. This is the world of the designer.

Designers are trying to engage with people and to do that they empathize. They try and put themselves in the shoes of the user, to really understand how they think, how they approach a problem.

One of the most common mistakes I see developers make is that they fail to do this. To a lesser or greater extent they perceive the user as being similar to themselves. They make assumptions about the users motivations and abilities. They often misunderstand what the user is trying to achieve.

If I could give only one piece of advice it would be to encourage you to empathize. Really think through what the user is like. Are they in a hurry? Do they have a specific aim? What is their outlook on life? Will they have kids clamoring for their attention while they surf your site?

Really try to get inside their heads. It will definitely help.

Avoid graphical applications

The temptation is to think “I have to do some design, that means I need to open Photoshop. That is what designers use”. Of course that is entirely true, designers do use graphic applications like Photoshop or Freehand. However, I would suggest that unless you are already familiar with these kinds of applications, you are just adding more complexity to the problem.

Its hard enough to apply the principles of good design without adding learning a new application on top of it.

You know code, so work with code. Build your site using CSS and XHTML and these are the tools with which you are familiar. Sure, it wont lead to outstanding design, but that is not the aim as I discuss next…

Don’t try and be great; be invisible

Don’t try and produce a “creative” or “innovative” piece of design. Designers find this hard enough to do. The danger is that if you try and do this, you will create something that some people may love, but the majority completely hate.

Instead, play safe. Try and make your design invisible. A good solid piece of design will not impress but neither will it offend. The idea is that the users will not even notice it, they just use it.

If the user doesn’t acknowledge what you have produced it means it hasn’t caused them any problems and that is a good thing. Sure, you wont win any design awards but that isn’t very likely anyway!

Specific advice

Okay, so enough with the airy fairy advice, lets get specific. How do you make your design good enough to be invisible, non-offensive? Well, let me suggest 5 areas that you should pay particular attention to. Obviously I could write reams on each but lets keep this very simply and easy to implement.

Typography

The key to good typography is constraint and consistency.

Avoid using too many typefaces, normally 1 or 2 is enough. Also avoid having too many variations in sizes and weighting. Only use size and weighting to emphasis the hierarchy of the content. The larger and bolder the type, the more important the content.

Also try to be consistent in your application of typography. If something is a certain size and weight on one page ensure it is done the same on another. Although CSS makes this relatively easy, watch out if you are working with ems as you may have inheritance problems.

Finally, don’t just think about the type itself but also line length and line height. Don’t allow lines of text to become too long (between 40 – 60 characters is good) because they are hard to read. Also add some whitespace between lines of text as it will make the page feel more spacious, which brings us nicely onto…

Whitespace

Whitespace is the not-so-secret weapon of good design. For simplicity sake, I think the rule of thumb is to add more whitespace than you are naturally inclined to do. Whitespace improves legibility, gives a sense of simplicity and communicates a feeling of openness and style.

In order to limit scrolling, we feel the need to cram as much content in as possible so squeezing out whitespace. Resist this temptation. Be generous in your padding, margins and line height. Don’t be afraid of “empty” parts of the screen.

The grid system

You often hear people complain that a website looks boxy but in actual fact boxes are good. A good website should have a strong underlying structure of columns and rows. It helps the user identify hierarchy and communicates a sense of order in the site. Although a good designer will break out from the grid he will always have a grid structure still there underneath.

Think about how many columns the site is going to have. Ensure these are applied consistently across the whole site, but don’t be afraid to occasionally span across multiple columns. Also ensure elements are placed consistently in this grid from page to page. Do not move elements around, especially navigational elements like the menu bar and search.

A grid may seem restrictive and not very “creative” but it essential to all design.

Colour

Working with colour is particularly tricky and so I would suggest where possible you avoid making too many colour choices. Your best bet is to turn to an automated colour creator like Kuler. You can either choose from one of the existing palettes or enter a base colour (usually a corporate colour) and it will produce a palette based on that.

Notice that Kuler only includes 5 colours in its palette. This is good practice, resist the temptation to use too many colours. Apart from this site (where I was just being silly), I tend to use a very limited colour palette. One nice little trick however is to use a strong contrasting colour to highlight important content. Because it is a contrasting colour it will make content stand out from the rest of the site.

Imagery

The design work I have seen done by developers tends to shy away from the use of imagery and in someways that is not a bad thing. It is easy to get imagery wrong but I would encourage you to be a little more adventurous. Imagery is a great way to draw the users eye and so can be used to highlight key content.

Selecting imagery can be tricky but here are a few suggestions that will point you in the right direction…

  • Avoid animation.
  • Choice images with a strong foreground element.
  • Compress your imagery but not too much!
  • Use faces, people are naturally drawn to them.
  • Avoid clipart illustrations

I am sure there is more I could suggest but those are the ones that immediately spring to mind.

Taking it further

So there you go. Hopefully that has helped a little. Obviously, there is so much more that could be said, but that should have at least started you off. If you do want to take the next step and improve your design skill then check out Jason Beaird’s book “The Principles of Beautiful Web Design”.

Design Testing

Posted in Design on by Paul Boag

Headscape run design testing sessions. We find it a helpful way of getting sign off on a design. I know not everybody agrees with this approach so I thought I would share what we do and why we do it.

Getting sign off on the look and feel for a site can be an amazingly painful process. Everybody has an opinion on design and it seems to matter very little that they are paying you (the designer) for your expert advice. It continually amazes me that clients would prefer to design it themselves by micro managing the process, than allow us to do the job for which they pay.

The root of the problem is that design is a subjective thing. Although there are underlying principles of good design a lot of it comes down to what people personally like or dislike. This makes deciding on a design a potential stumbling block.

Now, there are numerous approaches you could take to get a design approved but the approach we have adopted at Headscape is design testing. I am not going to claim for a minute this makes the sign off process easy but it does at least smooth the way and make it slightly more objective.

What is design testing

Probably the easiest way to describe design testing is to say what it is not. It is not a scientific process like say, polling. It is not a matter of simply selecting the design that scored the best. Its is a completely subjective process where observation and intuition are more important than statistical results.

You cannot simply rely on what people say initially. It is necessary to engage with them and endeavor to understand the underlying motivation. Probably the most common question I use in design testing is “why?”. By continually asking why, you dig deeper, encouraging people to express in more detail their response to a design. By talking to them face to face you pick up something of their body language and emotional response rather than a simple statistical result.

Design testing is also not a focus group. It is vital that you engage with users on a one to one basis. Group discussions lead to less confident members being influenced in their thoughts and this undermines the results. Interacting with a website is almost always a solitary experience and so the design should be assessed in the same way.

So what exactly happens in a design test session? Well in most of the sessions we run the user is asked to participate in two exercises:

Flash Testing

The idea of a flash test is simply to judge the weighting and emphasis of the design. Are the right elements highlighted? Will the user be distracted by something of minor importance? Will they notice a key piece of content?

This is achieved by showing the user the design for a few seconds and then removing it from sight. You then ask the user to recall as many items as they can and note both, which items were spot as well as the order in which they are recalled. Screen elements that had the most impact on the user are always mentioned first.

Emotional response

The second exercise is much more subjective and takes practice to get right. This is when you get into the realms of personal opinion.

We all know it is no good asking somebody what they think of a design. The reaction you inevitably get is “I don’t like the green” or something equally subjective. However, there is value I believe in asking the user what emotional response a design generates in them.

We simply ask people to describe the site using non design related words. So they could describe the site as “funky” or “moody” but not as “too dark” or “too busy”.

Some users find this a hard challenge so it may help to give them choices just to get them started. Typically we have a list of extremes we ask them to choose between. For example is the design “conservative” or “progressive”. Is it “cold” or “friendly”. Although to some extent you are leading them at this point it is still useful data and it gets them thinking in the right way so that they can continue with their own wording.

Is design testing worth while?

I have talked about design testing before with other designers and in many cases I get a negative reaction. The perception is that the client is paying the designer for their expertise and so it should be the designer that develops the look and feel in isolation. They also express a fear that the design will be compromised somehow if the “masses” get their say.

Both of these objections are in fact valid. The designer should be making the design decisions and too many cooks definitely can spoil the broth when it comes to design. However, in the real world clients do interfere in the design process and design testing can be an effective way of minimizing the influence of a single poorly informed person.

I believe that design testing offers 4 powerful benefits.

Beyond personal preference

We all know when we don’t like a design. A lot of us even have strongly held opinions about what we like. However, none of that matters very much when it comes to a website. What matters is what the user likes. I have designed sites before which I personally hate but which I have known the target audience love because we tested it on them.

Design testing can help you focus on the user rather than your personal likes or dislikes.

Avoids design / client confrontation

I have watched too many projects grind to a halt because the client and designer cannot agree on the design. The designer feels the client should bow to his experience and training while the client is convinced that, as he is paying for the site, he should get what he wants.

These kind of stalemates can be incredibly damaging, but design testing is an excellent way of diffusing these differences.

Informing the design process

Don’t get me wrong. I am totally convinced that the designer should be in control of the design and that design by committee is the nail in the coffin of many websites. However, design testing is about informing the design process not replacing it.

In my opinion the more informed the designer is the better. By meeting real users and having the opportunity to ask them questions about the look and feel of a site, the designer can only be better informed when developing his concepts.

Minimizes design by committee

Although you could perceive design testing as design by committee, I actually think it is an effective way of preventing that. Design by committee normally happens when the client starts showing the design around to his colleagues because he doesn’t want to make the decision himself. You as the designer are rarely there and so don’t get to hear the feedback first hand or control the way the design is presented and what questions are asked.

Design testing is a control environment and yet still gives the client the confidence his or she needs. After all if the design is liked by real users, how can you argue with that.

Not perfect

So there you go, that is design testing in a nutshell. I am not claiming it is the perfect system, but we have found it very useful for keeping a project moving and getting that final sign off on look and feel.

Show 67: Marcusworld

Posted in Classic shows on by Paul Boag

This week Dan Rubin looks at the design fundamentals and Marcus continues his series on the statement of work.

Play

Podcast: Download (22.0MB)

This week on the Boagworld Podcast, Dan Rubin looks at the design fundamentals of white space and page layout.  Marcus continues his series on the statement of work, while Paul explains openID and tackles the HasLayout bug in Internet Explorer.

Download this show

To subscribe directly within itunes click here

News and events

Keyword forecasting

Last week saw an interesting new tool released by the Microsoft Adcenter Lab. The keyword analyser is an experimental tool which allows you to see predictions of future searches on specific keywords. You can compare the growth of multiple keywords and even get basic demographics on who is searching on these terms. I am not sure that this tool is actually that useful, however it is strangely compelling nevertheless.

Introduction to the DOM

Chris Heilmann shows us a sneak peek of his upcoming DOM scripting workshop in a 10 minute  Screencast. Although not enough to get you started in DOM scripting it will certainly help you grasp the underlying principles.

Lessons in freelancing

As Cameron Moll prepares to leave the world of freelancing he shares his experiences from the last 18 months on his blog. Cameron gives a valuable insight into the lessons he has learnt and I would strongly encourage any freelancers to take a few moments to read it.

Jonathan Snook on CSS

When it comes to CSS we all work in slightly different ways, which is why it is always interesting to get an insight into somebody else’s approach. This week Jonathan Snook shares his top CSS tips and it is nice to see he has added some controversial tip bits.

Clients corner: Statement of work (technologies)

Marcus continues his series on the statement of work by discussing what needs to be said in the documentation about technologies, training and content population. He also looks at the hidden costs associated with hosting and how it should be handled in the contract.

Ask an expert: Dan Rubin on white space and layout

I remember sitting behind Dan at a conference once watching him work on a design (when he should have been listening to the speaker!). It was fascinating to see how he approached user interface work so I thought it would be great to get him on the show to talk about the fundamentals of design; white space and layout.

Agony Uncle: HasLayout

This week in the agony uncle segment we look at the HasLayout bug. In my experience this one bug creates the majority of problems that we encounter in IE. It’s an amazingly hard bug to explain and yet fortunately relatively easy to fix. I explain what it is and what problems it causes as well as looking at some possible solutions.

Review: Open ID

This week saw the announcement by Microsoft that they are going to start supporting Open ID. We take a look at what Open ID is, how it works and why you should consider implementing it on your own site. Most of what we cover is also tackled in Simon Willison’s excellent Screencast on Open ID.

Show 65: Dying (Man Flu!)

Posted in Classic shows on by Paul Boag

This week on the Boagworld Podcast, Paul and Marcus drag themselves from their death beds to share why you should care about Vista and Drew McLellan explains the pros and cons of Ruby on Rails.

Play

Podcast: Download (21.1MB)

This week on the Boagworld Podcast, Paul and Marcus drag themselves from their death beds to share why you should care about Vista, which browsers you should support and introduce you to the exciting world of terms and conditions. Oh yes and Drew McLellan explains the pros and cons of Ruby on Rails.

Download this show.

To subscribe directly within itunes click here

News and events

Barcamp

The weekend of the 17th of February sees the second barcamp to take place in London. If you haven’t come across barcamp, it is a gathering of web geeks where everybody takes turns to present a 30 minute session. You can pick which sessions you wish to attend and the whole thing has a very informal feel. Its free and arguably one of the most valuable meetups of the year.

Paper prototyping

There is an excellent new article on the List Apart website. It proposes closing down your PC and returning to good old pen and paper. Compelling stuff, which should make you evaluate the way you develop your designs.

Bulletproof AJAX

Jeremy Keith is about to release the follow up to DOM Scripting, Bulletproof AJAX. As with his previous book Bulletproof AJAX is aimed squarely at the designer community. It will be perfect for people who have read DOM Scripting and want to take the next step. If you can’t wait that long and can squeeze £295 out of your boss then you might want to attend Jeremy’s AJAX workshop down in Brighton. I have attended it myself and it is extremely good.

Custom reading containers

This is an incredible proof of concept that I was emailed last week. Basically it enables the user to resize elements of your web page to suit their requirements. Admittedly it has only undergone limited testing so far and relies on PHP; nevertheless it looks very interesting indeed.

Client corner: Terms and conditions

This week Marcus starts a new series on client contrasts with a “fascinating” look at terms and conditions… I know… control your excitement! Some of the points he covers include:

  • Make sure you read the T&Cs carefully no matter how boring they are!
  • Get advice if you don’t understand something
  • Make sure you note the governing laws that cover the T&Cs
  • Note the deliverables and rights
  • Understand your liability if there are problems

Agony Uncle: Browser support

Danny has sent in an excellent question about how far we should go in supporting the numerous browsers out there. Should we support IE5, Opera mobile, Opera on the Wii and so on? In the show I talk about the need to not set hard and fast rules in this area but adapt to the individual requirements of our clients. I talk about not blindly accepting the browser support requested by the client but rather analysing statistics to establish the best browser set to build for. Finally I also explain the concept of graded browser support as implemented by larger organisations like Yahoo!

Ask the expert: Ruby on Rails

Talking of Yahoo, this week our expert is Drew McLellan who works in their development team. He is on the show discussing the pros and cons of working with frameworks like Ruby on Rails.  Among other things he looks at speed of development vs. maintenance and generally gives a nice overview on the subject. He certainly helped me have a clearer understanding of the benefits and drawbacks.

Review: Vista

So Vista has hit the shelves and being the uber geek that I am I couldn’t resist upgrading as soon as I got my hands on the disk. I know there are loads of reviews on Vista but I thought it was worth reviewing specifically from a web designer’s perspective. I talk about the problems I had installing Photoshop, the improved FTP support and the multiple website support now in IIS. I also look at how Vista could potentially change the way people interact with the web by bringing things like desktop widgets and RSS feeds to the masses.

Podcast 46: Selling web design services

Posted in Classic shows on by Paul Boag

This week on Boagworld.com, we discuss how to sell your web design services, the pros and cons of HTML emails and we review the .net web design magazine.

Play

Podcast: Download (30.6MB)

Download this show.

To subscribe directly within itunes click here

Selling your services

You may build the best websites in the world but if you do not know how to sell your services then nobody will hire you. That is the sad state of the world. Web design is competitive marketplace and simply being a great developer or designer is not enough. You also need to know how to write good proposals and come across well in presentations.

That is why in this show we take a long hard look at the sales process and how to become more effective at promoting yourself. Below is a rough outline of what we covered in the show:

Play to your strengths

It is easy to bite off more than you can chew when pitching for work. Do not pitch for contracts that are too big for you and avoid relying too heavily on outsourcing, as many clients are uncomfortable with this. In particular Marcus recommends that you never promise something unless you are 100% sure that you can deliver on it. Failure to deliver can seriously undermine your company’s reputation.

Focus on a specific market

Marcus and Paul both heavily favoured identifying a sector in which you have some good case studies and focusing on winning work there. Given time you can build up a strong reputation in that sector which will in turn attract more clients. Clients seek out web design companies that have experience working on similar projects so this approach works much better than the scattergun mentality applied by many agencies.

Care for your existing clients

Marcus reckons it is ten times easier to win work from an existing client than it is to win from a new one. He has a good point. Not only is it easier to win new work from a happy client but they will also recommend you to others. It is vitally important that you keep existing clients happy because they should be the lifeblood of your business. If you are in the position of having to constantly find new work then you are doing something wrong. Concentrate on nurturing your existing clients and then you will quickly find new business coming to you.

Know when to walk away

It is the hardest thing in the world to do, but it is important that you know when to turn down work. There are times when the clients requirements are unrealistic or the job is simply too big. On other occasions, the chance of winning a job does not justify the investment involved in pitching for it. There is a natural tendency to want to run after every piece of work, but sometimes you just have to say no.

Question the client

Don’t be afraid to ask questions about a brief supplied by a client. Asking questions and making suggestions is a great way to build a relationship with your clients and make you stand out from the crowd. Of course, ultimately it will allow you to put together a better proposal that meets the client’s needs even when they are not fully expressed in the brief.

Write a good proposal

Marcus provides a huge raft of suggestions for writing a good proposal including (but not limited to):

  • Make sure you carefully cover any special requirements requested by the client (financial reports in your business etc).
  • Respond to the brief by taking each of the issues raised on a point-by-point basis, rather than using a standard template for all your proposals.
  • Be detailed but don’t overdo it (nobody will read a 100 page document).
  • Include screenshots and diagrams but be wary of file size if you are intending to email the proposal.
  • Provide modular pricing so people can choose which functionality to include.
  • Always include relevant references.

Ensure your presentation is slick

The presentation is the last obstacle to overcome and so often it can be where mistakes are made. Ensure your presentation fits into the time available with ample left over for questions. Remember, by this stage the client has read the proposal and know what you are offering. The reason for the meeting is to ask questions and have a chance to find out if they feel they can work with you. Everybody prefers to work with people they like, so be enthusiastic, helpful and professional. Be prepared to discuss prices and timescales but do not promise things you cannot deliver.

Questions and comment

On this week’s show, we have a great question from Aaron about building HTML newsletters with web standards. This sparks an interesting debate between Paul and Marcus about the pros and cons of HTML emails. The conclusion was that if possible send plain text emails and link back to a webpage containing more information.

For more information on the pros and cons of HTML emails read Paul’s post on the subject.

Also in the show

Also in the show, Paul recommends the .net magazine on web design, highlights two new courses on accessibility from the RNIB, and introduces a new sponsor in the form of RightCart (possibly the easiest to implement ecommerce system ever!)

Podcast 32: In-house vs. outsourcing

Posted in Classic shows on by Paul Boag

Decisions, decisions… develop in house or use a third party web design company? This is discussed in this weeks podcast along with other bits and pieces.

Play

Podcast: Download (23.9MB)

The decision of whether to develop your website in house (by taking on additional staff) or outsource it to the third party web design company can be a tricky. This week Paul and Marcus look at the pros and cons of both approaches as well as throwing in some additional options for good measure.

Download this show.

Also in this weeks show:

In-house vs. outsourcing

The decision of how you are going to resource your web project will radically affect not only the price of the project but also how that website develops in the future. It is therefore important to understand the options available to you and to know the pros and cons of each.

Although there are some alternative approaches that I will discuss later, you basically have two options available:

  • You can use internal resources within your organisation to develop your new web project. This can either be existing staff or new employees that have been recruited specifically to work on the website.
  • You can outsource the project to a specialist web design agency who can work either on a fixed price or time and material basis.

Either option has both its advantages and disadvantages:

In-house development

In short, an internal development team demonstrates a greater commitment to placing the web at the heart of your business

If you envisage that your site is going to need ongoing support and development (beyond basic text amendments that could be completed via a CMS) then hiring in-house staff may well be the best way to proceed. Although this does produce an ongoing financial commitment in the form of salary, equipment and training, it will ultimately be cheaper than the higher rates you will be forced to pay an external agency. An in-house development team will not only understand your business better than an external agency but will also be in a position to push the virtues of the web internally on an ongoing basis.

In short, an internal development team demonstrates a greater commitment to placing the web at the heart of your business and a vision to ensure your site evolves overtime instead of going through sporadic redesigns.

Outsourcing your web project

External agencies are often better placed for dealing with more challenging sites.

Of course having an in-house team isn’t always appropriate. For a start the ongoing financial commitment may simply not be an option even where site evolution is the preferred approach. Secondly, external agencies can sometimes have the advantage when it comes to complex and cutting edge sites. External agencies are normally larger than in-house teams including more specialists in specific fields (e.g. accessibility, usability etc). In addition because of the competitive nature of external agencies there is more pressure on them to keep up-to-date with the latest innovations and developments. As a result they are often better placed for dealing with more challenging sites.

Finally there is a danger in some organisations that the in-house web team can become “institutionalised” whereas an external agency will bring a fresh perspective that can challenge internal preconceptions.

Management mistakes

Of course the biggest factor in undermining in-house teams can often be mistakes made by management and not anything to do with the team itself. One such problem is recruiting the wrong person for the job. Often smaller organisations will recruit a web developer when what they really need is a web strategist and evangelist. Although coding and design are important skills, a smaller organisation needs to have somebody with business acumen that can help the organisation identify opportunities to utilise the web and to promote its use internally.

However, probably the biggest mistake made my management is ignoring the internal team they have. As a member of an external agency who works with in-house teams on a regular basis, I am constantly amazed how often we are brought in only to validate what the in-house team has already been saying. It is as if our presence is required simply to mediate in the internal politics that can often be found in larger organisations.

Other approaches

Of course choosing how to develop your website doesn’t need to be a black and white choice between in-house or outsource. There are in fact a number of other options to suit different organisations:

Ad-hoc specialists

For larger organisations it may sometimes be appropriate to bring in specialists to compliment an existing in-house team. For example specialists in accessibility, usability or design can often work well alongside an in-house team primarily made up of coders.

Part time contractors

For smaller organisations that cannot afford fulltime in-house staff but who wish to enjoy the benefits that come with that approach, there is the option to take on a part-time contractor. These individuals will probably have 2 or 3 websites they manage on a regular basis but still will be able to work more closely with you than an external agency.

Maintenance contract with an external agency

Although probably the most expensive approach, maintenance contract with an external agency does provide the best level of service. If the agency provide the right kind of service this can be very much like working with an in-house team. The agency will really get to understand the business, evolve your website on a regular basis and still provide all of the benefits of an external agency.

Conclusion

In many ways the title of this entry is somewhat misleading. The decision between development in-house or outsourcing is not a black and white one. Different solutions are right for different organisations. However I believe one thing is universally true, whether you use an external agency or in-house staff, you need a “website owner” within your organisation who is the project manager for any work done and the evangelist for the site within your company.

Nourishment to help the web grow

Posted in Reviews on by Paul Boag

It’s not often that I post on a site that has impressed me in this blog. Normally I reserve such things for my “interesting links” feed. However I have just discovered a new site called Think Vitamins and it has really impressed me.

Think Vitamin is a resource for web designers, developers and entrepreneurs. It provides useful articles, audio training, reviews and interviews.

Admittedly there are a lot of other sites out there offering similar things such as A List Apart or Sitepoint. However, what has impressed me so much about Think Vitamin is the quality of the content and contributors.

The line up includes people like Dave Shea, Dan Cederholm, Molly, Eric Meyer and the guys from 37 Signals. However, what really got my attention was the quality of the content. Every article I have read so far has been spot on. The site really does provide sound business, design and development advice to anybody involved in the web.

As a designer I particularly enjoyed "How C.R.A.P. is your site design?" which reminded me of just how important it is to get the basics of good design right. Of course they also have great articles and training on other subjects too so be sure to check them out.

Investing in your staff

Posted in Web strategy on by Paul Boag

Commercial web design is barely a decade old. The entire industry is evolving at a tremendous pace with both technology and methodology changing daily.

Unsurprisingly my last post generated a huge amount of feedback. By far the majority focused on the learning curve involved in adopting web standards. Many complained they simply didn’t have the time to “get up to speed”. The following is directed at those who employ web developers/designers…

The cost of training

As an employer myself, I know that the word “training” can make your wallet scream in pain. If you are a small business, the thought of staff taking time out to get trained up can be scary. There is the cost of the training itself, the travelling expenses, the cost associated with adopting what has been learnt and the time away from paid projects. All in all, it is easier and safer to go with “on the job training” which equates to no training at all!

You may also find the constant demands from web designers for training (or simply time to learn) rather unreasonable. After all, nobody else seems to require so much time to sit around doing nothing! In short, training can often be hard to justify.

A unique position

Although I can feel your pain, it is important to release what a unique position most web designers and developers are in. While many other professions have existed for hundreds of years, commercial web design is barely a decade old. The entire industry is evolving at a tremendous pace with both technology and methodology changing daily. I once heard it estimated that the average web designer has to relearn his skill-set every 18 months. Although I believe this is somewhat of an exaggeration it isn’t far off. With things moving so fast, having time to keep up with the latest developments is essential to your web site’s success.

For in-house designers too

You might think this is all well and good for a professional web design agency. After all, they need to be on the cutting edge of their industry. However, your company might just employee a couple of in-house designers to keep your own website in order. Surely, there is not as big a need for training in that situation? Unfortunately, this is simply not the case. There are no guarantees that your competition are not using an external web design house and so your internally produced website still has to compete with “cutting edge” design agencies. In addition, as I have said before, it is important that your site evolve with the rest marketplace otherwise, it will quickly appear out of date. Unfortunately, the web is very like the fashion industry. A nineties style website looks much like eighties style fashion… horribly dated! Users are constantly demanding more and more from websites and if your staff aren’t up to date with the latest developments they are going to struggle to deliver.

The good news

However, it’s not all doom, gloom, and expenses! Although there are a growing number of training courses available on various aspects of emerging web technology, they are not the only way to get your developers up to speed. The most cost effective thing you can do is allocate them time each week for “self learning”. The web is crammed with valuable resources to help people learn about things like Unobtrusive JavaScript and web standards. All you need to do is set aside some time for them away from their normal workload. Admittedly, this has some productivity implications but these will be quickly outweighed by the productivity gains provided by these emerging methodologies.

All your developers need is a few hours each week to work on their own projects. Google has adopted this approach with incredible results. No travel expenses, no training courses, just a few hours a week. You can’t say fairer than that!

Holier-than-thou standardites

Posted in Working in web design on by Paul Boag

A number of things have happened recently that have got me thinking about the state of web design. I find myself increasingly concerned about the mentality that is developing within certain parts of the industry.

I guess a recent interview I did for Dustin Diaz started me thinking. We found ourselves on the subject of whether I ever got sick of talking about good practice in web design (things like web standards, progressive enhancement etc.). I explained that this is where my real passion lies and that boagworld.com exists to communicate best practice in a way that isn’t patronising or full of technbabble, which nobody understands.

I have become increasingly concerned that there is a growing divide between those who have grasped this new methodology for designing websites and those who have not. The problem is that many of the "Standardites" have a holy-than-thou attitude, which can seem very condescending to those that aren’t "in the know". In our desire to promote standards we have made those who are not yet using them, feel ignorant.

Not me too!

What has disturbed me most is that I have found myself doing the same thing. In my last podcast, I ranted about another web design show that promoted all kinds of bad practice. In next weeks show I moan about the "ignorance" of some designers when it comes to accessibility (following comments made on sitepoint.com about the target case). In both cases, I may have (and probably did) come across as very dogmatic and arrogant. This kind of approach only builds walls making it harder to educate and inform.

Take for example Andy Clarke’s comments to accessify.com:

Those people still delivering nested table layout, spacer gifs or ignoring accessibility can no longer call themselves web professionals.

In the past, I have praised Andy for these comments and I still believe that they are in essence true. However, now I find myself wondering if comments like that actually help. If I wasn’t using web standards and had not yet faced the challenges of accessibility, I would find those comments very demoralising.
There can be all kinds of reasons why people haven’t adopted these new "best practices". Whether it is a lack of time and training, or simply that they find them too challenging, when in the past they have relied on a WYSIWYG editor like Dreamweaver. Whatever the case we should be aiming to encourage and not condemn these people.

The web standards gang

There is a definite web standards community who all read the same blogs and go to the same conferences. When you are in this group it is hard to conceive that people have not yet grasped the concepts of standards and we are in serious danger of becoming increasingly insular.

My hope is that boagworld.com can bridge that gap and convince people about "web design good practice" without bashing them around the head with it.

Web Design Podcast (9) – Jeremy Keith Interview

Posted in Classic shows on by Paul Boag

This week Paul is joined by Jeremy Keith, author of DOM Scripting and joint head of the WASP DOM Scripting Task Force. Paul and Jeremy look at how to take the principles of web standards a step further by separating function from content as well as just design.

Play

Podcast: Download (12.5MB)

Download this show.

Below are links to a number of resources discussed in the podcast:

A better way to build websites
A boagworld.com article introducing web standards and explaining their benefits.

Web standards at all costs?
A boagworld.com article discussing whether there are occasions where table based design can be justified

Adactio
Jeremy’s personal website including a shed load of invaluable articles!

DOM scripting book
A superb book my Jeremy aimed at introducing designers to unobtrusive JavaScript.

DOM Scripting task force
Apart of WASP this group is dedicated to bringing the quality of scripting up to that of XHTML and CSS.

Unobtrusive JavaScript Tutorial
An excellent introduction to Unobtrusive JavaScript by Chris Heilmann.

clear:left
Jeremy Keith, Andy Budd, and Richard Rutter have joined forces to form clear:left, a new web design company based in Brighton.

d.construct
The UK’s first grassroot web 2.0 conference. Unfortunately this is now sold out.

@media 2005
The @media 2005 conference brought together the biggest names from around the world to talk about the hottest topics in web design – web standards and accessibility.

HTML dog
The web designer’s resource for everything HTML and CSS, the most common technologies used in making web pages.

WASP
The Web Standards Project is a grassroots coalition fighting for standards that ensure simple, affordable access to web technologies for all.

Web Design Podcast (7) – Content is King

Posted in Classic shows on by Paul Boag

We have received a lot of request to look at the subject of content management. So, in this weeks podcast we will be looking at why content is important, how to make your content accessible, give some general advice on copywriting and final how to make the most from your content management system.

Play

Podcast: Download (14.0MB)

Download this show.

Below is a brief outline of the things covered in this week’s podcast as well as links to some of the sites mentioned:

Poor quality

Let me just apologise in advance for the poor quality of the audio this week. Due to the last minute death of my motherboard we had to change the audio setup and so things are a little ropey. Back to normal next week (hopefully).

This week’s news

View the new boagworld.com mission statement!
Listen to the Web Essentials 2005 podcast
Try out the new web design podcast at webaxe
Read Jacob Neilsen’s top web design mistakes of 2005
Learn how to use Dreamweaver 8 to create sites built using web standards

Main Feature: All about content

Why is content so important?

  • Because users are not impressed by design anymore
  • Because content is not always shown in the context of your design (Web feeds)
  • Because written content improves search engine rankings
  • Because good content keeps users coming back for more
  • The accessibility of content
  • WAI guidelines insist on accessible content (14.1 Use the clearest and simplest language appropriate for a site’s content.)
  • Learn more about making content accessible.

General advice for web copy

  • Make it personal because computers aren’t
  • Don’t patronize
  • Remember the medium (its hard to read on screen)
  • Avoid marketing talk
  • Avoid jargon
  • Remove happy talk
  • Read more advice on writing effective web copy

Managing content

  • Remember you do not always need a full cms!
  • Establish your needs before looking for a solution
  • Content management systems wont solve your content problems
  • People see updating copy as a unimportant part of their job
  • It is important to have a web editor to bully people into contributing and in order to ensure consistency across the site.
  • Provide training on more than just your CMS. Cover good design and copywriting too.
  • Make sure your training is supported written documentation
  • Invest your money in the people that edit your site NOT the technology.
  • Learn more about managing site content.

Photoshop CS2

Posted in Reviews on by Paul Boag

If you are a regular Photoshop user or know somebody who is then it is worth taking a look at this tutorial.

Photoshop CS2 has added a number of new features that has the potential to significantly improve the way you work and speeding up your development time. This excellent tutorial addresses just one of these new features but arguably the most important: smart objects.

Even if you consider yourself a Photoshop expert this is definitely worth viewing.

In-Depth CS2 Smart Object Training

Higher education & web accessibility

Posted in User experience on by Paul Boag

By now anybody involved in managing a higher education web site will be aware of the need to make it accessible. However, not all are clear as to why this is important or indeed how to go about it. This article is designed to give you a quick overview of the subject and direct you to some useful resources. What is web accessibility?

Web Accessibility is about making your web site accessible to the widest possible audience. Because of the lobbying of organisations such as the RNIB most people associate web accessibility with the visually impaired. However, web accessibility is much broader than that. It is also about providing access for those with motor impairments, learning difficulties and other forms of disability. It is also about making your web site accessible to all, irrespective of what browser technology they are using to access your site or the connection speed.

How web accessibility is measured

In practice, web accessibility is primarily (although not exclusively) defined by a checklist set out by the World Wide Web Consortium (W3C). The W3C is a governing body for the web that sets standards for technical development. One set of standards is the Web Content Accessibility Guidelines (WAI) which defines three levels of accessibility each progressively more demanding. The most basic level of accessibility is Priority 1 (level A compliance) followed by Priority 2 and 3 (levels AA and AAA).

Why your web site should be accessible

There are three broad arguments for making your web site accessible to all:

Legal

Although the Disability Discrimination Act does not refer directly to web sites, the associated code of practice does. The Act makes it unlawful for a service provider to discriminate against a disabled person by refusing to provide any service which it provides to members of the public. The code of practice then goes on to give an example of an Airline company that provides ticket reservations via its web site. The required level of web site accessibility is as yet untested in a British court. However, in Australia a blind person successfully sued the Sydney Olympics Committee for providing an inaccessible web site. It is widely believed that this ruling will influence any future ruling in the UK.

The UK government is taking web accessibility very seriously and says the following on the e-government web site.

"All UK government websites are expected to achieve, as a minimum, and adhere to the single ‘A’ (Priority 1 items) level"

Higher Educational web sites are also affected by The Special Educational Needs and Disability Act 2001 which makes it unlawful to discriminate against a disabled person in relation to the services provided to students, and admission to the university.

These two Acts effectively mean that it is vital that Higher Educational web sites comply with the W3C WAI Guidelines at least to Level A.

For more on web accessibility and the law click here

Practical

Those involved in making a higher education web site more accessible should not perceive it as an obligation but rather as an opportunity. An accessible web site provides a huge range of benefits including:

  • Accessible web sites receive significantly better placement on search engines
  • Ensuring your site is accessible opens it up to audiences previously excluded from your site, including not just the disabled but those using older technology.
  • Having an accessible web site demonstrates your commitment to the disabled and will attract higher levels of applicants from this group.
  • Making your web site accessible also improves usability which in turn has numerous benefits in its own right.

Moral

Probably the hardest argument to articulate for web accessibility is the moral one. However, it cannot be ignored. At the end of the day making your web site accessible to all is simply the right thing to do.

The way forward

By now you should have a clear understanding of what web accessibility is and why it is important. It can seem like an overwhelming task to make your web site accessible to all but it does not need to be.

The key is to ensure that the stake holders in your site have a clear understanding of why web accessibility is important and that you provide them with the training and skills to implement it. This, in conjunction with a clear plan of attack, should be enough to ensure your site is accessible to as many as possible.

For more help on the practical implementation of an accessible web site read this excellent web site accessibility plan developed specifically for the Higher Education sector.