Web Design News 27/04/10

This week: Is the homepage dying? Everything you need to know about HTML5 and CSS3. Solve problems rather than add features. And why you shouldn’t be tied to a process.

Everything you wanted to know about HTML 5 and CSS3

There has been so much talk about HTML5 and CSS3 that you could be forgiven for zoning out.

If you are like me, you know it sounds cool. However you are having trouble keeping up with what exactly it all does and if you can use it now.

Fortunately there are a couple of resources that will help bring clarity to the situation.

The first is a presentation that covers advances in Javascript, HTML and CSS. What makes this presentation unique is that it demonstrates these upcoming technologies as well as explain them.

Presuming you are using a good browser (the author recommends Chrome) you will get to see everything from native video to CSS gradients in action. It also comes with code that you can just copy and paste to get started.

The second resource is a compatibility table that shows browser support for HTML5, CSS3, SVG and other upcoming web technologies.

Sample table from the compatibility application

You can configure the table to only show the technology you are interested in (e.g. CSS3). However the nicest thing is that it provides a judgement about whether you can start using that technology today. It also explains why it has made that judgement and what browser is limiting its adoption.

Both resources are worth a look if you want to start adopting these emerging technologies.

The decline of the homepage?

Gerry McGovern returns this week with another controversial post. This time he is claiming the decline of the homepage.

He begins by quoting some figures on the decline in homepage usage:

In 2003, 39 percent of the page views for a large research website were for the homepage. By 2009, it was down to 19 percent.

Another technology website had roughly 10 percent of page views for the homepage in 2008, and by 2010 it was down to 5 percent. One of the largest websites in the world had 25 percent of visitors come to the homepage in 2005, but in 2010 only has 10 percent.

I have no reason to doubt these figures. However, I am not sure they reflect all websites. That said, I do think the principle stands. As Gerry points out…

Years ago people might have thought about getting to the homepage and then figuring out where to go on the site. Now they will use search or external links to get closer to the place they really want to get to. So, for example, people are becoming less likely to simply type “Toyota” into a search and more likely to type “Toyota recall”.

google search

Does that mean the homepage is no longer important? Not at all. It is still an essential navigational tool which users rely on to orientate themselves on a site.

What this post does demonstrate is that political battles over homepage real estate is pointless. The homepage is no longer as critical as it was.

While on the subject of homepage design, I also wanted to quickly mention ‘How To Develop A Homepage Layout That Sells‘. Although not the best article on the subject it does tackle one aspect well. That is the need to prioritise around objectives, rather than allowing features to continually accrue on the homepage.

The process police

I share a lot of techniques, methodologies and processes on Boagworld. From advice on wireframing to top tips for creating an effective call to action. These posts help us to learn and provides structure within which to work.

However it is important that these kinds of posts (whether on boagworld or elsewhere) are seen as guidelines or advice, not as laws that need to be obeyed.

This is something that is covered in ‘The Process Police‘ a 52weeksofux post.

Image of riot policeman

Ryan Rodrick Beiler, Shutterstock

In this post Joshua refers to people he calls process police. These are people who cling to processes as a kind of mantra for improving their websites…

Process is their crutch. The Process Police believe that if they follow the process to the letter, then they’ll be more successful than if they don’t. They use process as a benchmark for success.

However, in reality the world doesn’t work like that…

No process guarantees success. If there were a process that guaranteed happy users everyone would be using it. But design doesn’t work like that: it’s iterative, responsive, ever-changing. You have to react as much as plan. You have to change your process on the fly to react to the marketplace.

Just remember the next time you read an over confident author talking about the ultimate way to produce a persona, that there is no such thing as a perfect way. Take from the article what works for your site and your users, then leave the rest.

Solve problems rather than add features

Let’s face it we all enjoy something new. Designers like the latest design trends, developers want to play with new technology. Even website owners always have endless ideas for new features.

Unfortunately our enthusiasm for the new can get the better of us sometimes and we focus on that rather than meeting the needs of users.

An article entitled “Does your website add features or solve problems?” addresses this attraction towards the new by encouraging us to focus on solving problems rather than adding new features.

iphone

The author sums the problem up perfectly…

This eagerness manifests itself as a superfluous new feature, an implementation that is stimulated by a common misconception that adding more features is a market advantage. This couldn’t be further from the truth.

In reality the solution to users problems often lies in taking stuff away rather than adding it.

The post looks at the benefits of simplifying your website before suggesting some ways you can ‘be a problem solver and not a feature inflator’.

Its a great little post that focuses the mind back on what matters and curbs our enthusiasm for the new.

Is ‘John the client’ stupid or are you failing him?

Meet John the client. John runs a reasonably large website. He is a marketeer who considers himself smart, articulate and professional. That said, he doesn’t know much about web design and so needs your help.

John comes to you with a clear set of business objectives and asks for a quote. What happens next leaves John confused, frustrated and extremely unhappy.

Explain why you are asking about money.

Before giving John his quote you ask a little more about the project. After chatting for a few minutes you ask him about his budget. A fair enough question you think. After all there are so many ways you could approach the project. Without knowing the budget it is impossible to know where to begin.

In your mind, building a website is like building a house. Without knowing the budget you can’t possibly know how many rooms the client can afford or what materials you should use to build.

John on the other hand is instantly suspicious. Why would you want to know his budget? The only reason he can think of is that you want to make sure you don’t under charge when there is more money available. Anyway, he doesn’t really know his budget. How the hell is he supposed to know how much a website costs?

Money Grabber

Image credit : Be careful not to come across as money grabbing.

John goes away determined to find a web designer who isn’t trying to screw him over. Fortunately for you all of the other designers he asks also fail to explain why they need to know about his budget and so you manage to win the project anyway.

Justify recommendations in language John can understand.

Once you have won the job you arrange a kickoff meeting to nail down the final specification. However, John is instantly regretting his decison to hire you as his worse fears are confirmed.

In his eyes you are immediately trying to squeeze more money out of him as you waffle on about the importance of usability and accessibility.

John doesn’t care about disabled users. No disabled users use his website anyway!

As for usability, surely it is the job of the web designer to make the website usable. Why do we need expensive usability testing? He is pretty sure usability testing involves expensive things like cameras, usability labs and two way mirrors.

Unfortunately you believe you have explained the issues clearly. You talked about WCAG 2 and mentioned Jacob Neilsen. You are beginning to wonder if John is stupid.

People looking confused

Image credit : Avoid technobabble if you want your clients to understand what you are talking about.

Maybe if you had talked about accessibility in terms of search engine rankings and usability testing as a way to increase conversion then John might have listened. As it is John puts his foot down and refuses to pay for any of these ‘ unnecessary extras’.

Include John in the process.

You go away from the kickoff meeting pleased to have a signed contract. However you have the feeling in the pit of your stomach that this is going to be another one of ‘those’ projects. Nevertheless you pick yourself up and dive into the design process.

Almost immediately you get a phone call from John asking if there is anything for him to see. You explain that it is still early days and that that you are not ready to present. John sounds disappointed but resigned.

A short while later you are ready to present the design to John. You are really pleased with the result. It has taken a lot more time than you budgeted for but it was worth it. The final design is extremely easy to use and will make a great portfolio piece.

Person hiding

Image credit : Stop hiding from your clients. Show them work early and include them in the process.

When John sees the design he is horrified. From his perspective you have entirely missed the point. The design clashes with his offline marketing material and fails to focus on the right selling points. Also he is convinced his suppliers will hate it and although they are not the end user, their opinions matter.

After a tense conference call you go away demoralised but with a compromise that will hopefully make John happy. You wonder in hindsight whether it would have been better to show John some of your initial ideas and sketches. Perhaps you should have produced a wireframe first.

Educate John about design.

After much agonising and compromise you are once again ready to present to John.

John is much happier with the new design and feels it is heading in the right direction. However, he does have some concern. For a start he has to scroll to get to most of the content and yet there is empty whitespace on either side of the design. He tells you to move key content into this wasted space.

Also as he thinks about his young male target audience he realises that the colour scheme is probably too effeminate, so he tells you to change it to blue.

While John is feeling somewhat happier you are feeling crushed. It feels like he is doing your job for you. The string of feedback about moving this and changing the colour of that, feels like it has reduced you to pushing pixels.

By this stage you are sure the client is stupid, and just want the design signed off. At no stage do you stop to ask John why he is requesting these changes. Perhaps if you had understood his thinking then you could have explained concepts like screen resolution or suggested an alternative to corporate blue which is so massively overused on the web.

Teacher teaching maths

Image credit : Educate your clients so they make more informed decisions.

Instead you wash your hands of the design and just give John what he wants.

Communicate with John regularly.

Now that the design is complete you turn your attention to the site build. At least John won’t care about your code. Now you can finally do things right.

Its a big job and it takes a lot of time. Even though you put too much time into the design and then washed your hands of it, you have your pride. You are not about to cut corners with the code. After all other web designers might look at it and judge you!

You work damn hard, putting in more work than you probably should do. John even managed to slip some extra functionality in at the scoping phase, which turns out to be a pain in the ass.

John on the other hand is wondering what is going on. He hasn’t heard from you in weeks. Surely the site must be read now? He decides to drop you an email asking how things are progressing. You reply with a short email saying everything is progressing nicely. After all, you never did like project management and you are sure John would prefer you building his site rather than writing him detailed emails.

John receives your email and finds himself becoming increasingly frustrated. What does ‘progressing nicely’ mean? He writes back asking for an expected completion date and you reply with a rough estimate.

The date comes and goes without a word from you. After all it was only an estimate and several complications have delayed things by a few days.

John finally looses his temper and calls you. He has arranged a marketing campaign to coincide with the launch date you and because he hadn’t heard from you he presumed everything was on schedule.

Phone with the receiver taped up

Image credit : Make sure you are communicating with your client regularly.

You try to defend yourself against John by citing the scope creep and unexpected difficulties. However, it is hard to respond when John said ‘all I needed was a weekly email keeping me up-to-date on progress’.

Explain John’s ongoing role.

By this stage the relationship has broken down entirely. You finish the work and the site finally launches. Begrudgingly John pays the invoice after delaying it for as long as possible.

What amazes you the most is that John says he is bitterly disappointed with the final result. How can that be when you gave him exactly what he asked for? This guy isn’t just stupid, he is also a jerk!

Of course John sees things differently. He came to you with a list of business objectives he wanted to achieve and the site failed to meet any of them.

He hoped that he could launch the website, see it meet its objective, and move on to the next project. Instead, after an initial spike in interest the number of users and enquiries fell overtime and the site stagnated.

Seedling being cared for

Image credit : Ensure your client understands the ongoing care his website will need.

What John did not realise is that sites need continue love and support. You cannot build it and then abandon it. John needed to nurture his website by adding new content, engaging with his visitors and having an ongoing plan for development.

If only somebody had told him.

The moral of the story.

It is amazing me how quick we are to judge our clients.

As web designers we communicate and empathise for a living. Our job is to communicate a message to our client’s users. We create usable sites by putting yourselves in the position of the site visitor. This allows us to design around their needs.

Why then do we so often seem incapable of either empathising or communicating with our clients?

Perhaps it is time for us to use the skills we have grown as web designers and apply them to our own customers.