Designing for the Web

Chapter 1

Designing for the web is different than designing for any other medium. The breadth of skills required is sometimes daunting. The depth of experience required, seemingly unobtainable. Yet, the medium attracts designers from all spheres of design practice: from engineering and architecture, to product and graphic design. This chapter aims to provide a snapshot of the current state of the medium, and our role as practitioners working within it.

Designing for the web

‘How can i get my first job?’

Designing for the web is different than designing for any other medium. The breadth of skills required is sometimes daunting. The depth of experience required, seemingly unobtainable. Yet, the medium attracts designers from all spheres of design practice: from engineering and architecture, to product and graphic design. This chapter aims to provide a snapshot of the current state of the medium, and our role as practitioners working within it.

I regularly receive emails from students and budding designers asking for my opinions and advice on how they can get started in this industry.

‘How can I get my first job?’, ‘What skills do you think I need to land my dream job?’, ‘If I want to be a web designer, what should I study at school?’. Where do you start? Maybe you're a developer who needs to improve the quality of your design. Maybe you're a print designer who wants a change. Firstly, before making a decision on what course to attend in school, or what software package you need to learn, I believe you need a solid grasp of what the web is today, where it came from and where it might be heading.

Any medium can be defined by its constraints. These constraints effect how a designer is able to work within the medium. To push the boundaries, you need to know where the edges are.

When I started designing for the web I was attracted by the immediacy of the medium. I was a print designer at the time, so this meant I was constrained by print run lead times and the finality of print. Once a job is printed, then that's it, it's printed, finalised, and in the world. With the web, I was able to change things. I was able to evolve the design beyond a deadline. I could tweak, fiddle and redesign – all to my hearts desire. The web created a revolution in graphic design. This was in 1997.

What followed was a tidal wave of creative professionals entering the online industry. From writers to graphic designers, we all found the new medium liberating and exciting. The mistake we all made was trying to make the web what it wasn't. We tried imposing other media conventions on technology that it wasn't designed for. A small example of this is HTML tables. HTML data tables are supposed to be for tabular data but, with their cells, rows and columns, they spoke the same visual language of graphic designers who had been using Quark XPress for all those years. They were grids. Before you knew it, every site was made from nested tables and spacer gifs.

The Changing Browser

The browsers are one of the windows by which we consume the web. Web browsers speak to web servers, using a protocol called HTTP, to get and display web pages. When the web first began gathering pace as a medium, several browser manufacturers clambered for the market share. This lead to many of them developing proprietary technologies to handle different media types. The result of this was a proliferation of non–standard code, which lead to increasing problems with interoperability. Through the tireless work of the Web Standards Project, and the W3C, this is all now looking a lot better. The browser manufacturers are listening to the designers and developers and, together with the W3C, are developing towards exciting browser developments, such as font–embedding.

Web browsers are probably the most common way of interacting, searching, playing and communicating on the web. But, increasingly, the web is being accessed by other programs and devices. The once–clear line between online and offline is being continually blurred.

Like many people I know, I use an RSS reader to keep track of the various news sites and blogs I read regularly. An RSS reader isn't a web browser. It's a program that takes RSS ‘feeds’ and then displays them as a list that you can scroll through and read articles item by item. RSS focusses on delivering content. All style and design is removed, and just the article text is displayed, along with any associated images.

People can of course use email to track their web activity. Through notification emails – from blogs, discussion forums, web applications and services – you can engage with the web. You can track a discussion, reply and participate without ever opening a web browser.

Through something called an API (Application Program Interface), another program can access data on the web, and then display it somewhere else. This brings the web to the desktop. A program I use regularly is Flickr Uploader. It's a small plugin for iPhoto and allows me to upload images from my galleries to my Flickr account online. From there, it can be shared with family and friends. Flickr Uploader does this by using the Flickr API. By adding my account details, Flickr Uploader can ‘talk’ to Flickr, make sure it's uploading the images in the right place, give them a title and any other meta data, and perform the upload. Again, I haven't opened my web browser to do this.

Up to now, I've only been talking about accessing the web via a computer. Of course, there are several other channels for the delivery of web content – from mobile phones and PDAs to televisions and game consoles.

The iPhone is of particular interest to me (mostly because I own one). Not only is the browser that ships with the iPhone a fully–fledged, fully–featured web browser, but there are an increasing number of iPhone applications that use the web. For example, the Facebook application is so good, I prefer using it to the web browser version. Likewise, with Twitter clients. On my iMac, I use Twitterific – an OS X application – and on my iPhone I use TwitterFon. I hardly ever use a web browser to log in to Twitter.

What I'm trying to illustrate here is the web isn't just limited to Internet Explorer or Firefox. From mobile devices to your Playstation 3, the web is everywhere.

The Changing User

Ten years ago, a lot of people used the web, but the skew was towards a younger, male, technically–savvy audience. Five years later, and adoption had shot through the roof. All sorts of people were using the web to buy gifts or book holiday tickets. Blogging was born, and with it a fundamental change in journalism and how people read news on the web. Now, five years later, my mum is using Facebook. Doesn't that say it all? The web has changed from a publishing medium, to one of tools and applications that enrich people's lives. The audience is now massive and broad–reaching. The technology is getting increasingly pervasive. It's all incredibly exciting! But, with this rapid change, how can we be sure the audience we're designing for today has the same desires, needs and motivations as the audience of six months ago?

The role of research in web design is more important now than ever. By speaking to the potential users of a site and by gathering data on their behaviour, we can then design to their needs. We cannot assume that all users are the same. Just because we, as designers, think a design is appropriate to a given audience, doesn't mean it is. The audience is changing, and we have to keep up.

The Changing Designer

The web moves fast. Really fast. What is new today, will be a convention in six months time. To keep up, a designer not only has to be at the fore–front of current trends and conventions, but also has to be a user of the products and services that define those conventions.

Take Twitter for example. Twitter is a web application that lets you tell other people – who you ‘follow’, and who ‘follow’ you – what you are doing. In Twitter's own words:

“Twitter is a service for friends, family, and co–workers to communicate and stay connected through the exchange of quick, frequent answers to one simple question: what are you doing?”

When Twitter first arrived, in 2006/07, I really didn't get it. I had friends I'd keep in contact with via email, and I had a blog for my own expression. Why did I need to use a service like Twitter? For a long time, I didn't use Twitter in favour of using services I was familiar with. Then something started to happen in the bloggersphere – everyone went quiet. ‘Weird’, I thought. ‘Maybe they were all busy. That's it.’ Then, over time, respected designers and developers were redesigning their blogs to incorporate postings from these web services and products: Twitter, Flickr, Delicious links, You Tube, Vimeo etc. The blog design became a reflection of the designers ‘lifestream’. And, I was missing out on a big discussion. The interesting thing to note is that, recently, I've been working on projects for clients who also want to start incorporating these services. Design conventions are being born, maturing online, and now business is starting to see the benefit. Now, if I wasn't using these products or services, if I wasn't a consumer of the web, I'd be blind to what was possible. It's not enough to rest on your laurels. If you're a web designer, you need to be a web consumer.

I mentioned earlier that it's difficult to keep up sometimes. A web designer's role seems to encompass everything from information architecture, and user experience design, up to front–end development – such as CSS, HTML. Throw in a bit of JavaScript, and a sprinkling of other scripting languages such as PHP, and you get an idea of how broad a web designer's job could be. It wasn't so long ago that every job advertisement for a web designer required most of what I mentioned. I think – well, I hope – that those days are behind us. Modern web design is just too broad a discipline to be moderately good at everything. In fact, I personally wouldn't hire anyone who claimed to do it all – Jack of all trades, Master of none. The web design profession is now splintering into specialisms and this is a very good thing.

Web designers need to be specialists.

Being specialist is difficult when you're a freelancer, or work in a small company. Your boss may ask you to skill up in other fields and diversify. The desire to learn something new can take you spinning off into new directions. But, in the midst of all this, don't lose sight of what your core offering as a designer should be. Mine, for example, could be layout. With my experience, traditional background and my leaning towards typographic design,clients come to me because of that. I have other skills on the periphery – such as knowing how to hand–write HTML and CSS, and project management – but my primary ‘selling point’ as a designer, would be my knowledge and practice of graphic design layout as applied to the modern web. To lose sight of that would be dangerous – both in terms of running a business, but also in my continued growth of a designer.

A web designer has to be adaptable. Willing to learn, and ready to embrace change. A web designer has to be willing to shed previously high–held design sensibilities and start from scratch. They have to accept, challenge and manipulate the constraints of the web. They must do all of this whilst keeping one eye firmly on their own personal design journey; where they've come from, and where they're going.

All of that is why I love the web. If you give it chance, it's an enriching design medium, and one from which many never return.

More from this part

Back to Table of Contents

Download the book

Download your FREE copy of Designing for the Web.