...

MA Web Design + Content Planning

Design principles

We take a modern approach to the technical aspects of web design. This means that we hand-code our websites; we do not advocate the use of WYSIWYG design tools. Our students develop a deep understanding of web design and require little in the way of specific software. We’re more interested in the fundamentals of the subject than in knowing which button to press. It may come as a surprise that the ‘modern’ approach to web design is so ‘low tech’ but understanding how to write effective markup and creative stylesheets is key to the creation of excellent websites. You needn’t take our word for this, there are many recently published books that advocate this approach, of which, Learning Web Design (5th edition) by Jennifer Niederst Robbins is one of our favourites.

Our approach to web design is more correctly called ‘website architecture’. We define website architecture as ‘the art and science of creating good websites’. This requires:

Web standards

The way we write HTML and CSS and the way we form documents is guided by the standards developed and maintained by the W3C (the World Wide Web Consortium). This gives us a firm basis on which to test our work and validate our code.

Semantic markup

Semantics is a very important issue in web design. When Sir Tim Berners Lee described the ‘semantic web’, he envisaged an information space that understood what it contained and could effectively respond to user requirements. The practice of creating semantically correct markup helps move the web towards that goal. At its simplest, it means using HTML to add structure to documents and to add meaning to content, and the “meaning” is really important for all sorts of reasons, not least for accessibility.

All right-thinking organisations take the use of semantic markup very seriously. See the BBC Semantic Mark-up Standard for more information and as an indication of how important this seemingly academic aspect of web design is considered by major website developers.

Separating content from presentation

Originally, HTML was all a web designer needed. It was used to structure content and describe how it should look. These days, things are very different. As detailed above, HTML is used only to describe the nature of content and the order and hierarchy of that content (which comes first, which second, which is the most important etc.). HTML is not used to describe how that content should be presented (how it will look in the browser window). That is exclusively the job of CSS. This separation of tasks, HTML describing the content and CSS describing the presentation is at the root of modern web design and allows designers amazing freedom of expression.

User Experience

Websites are of no use if they cannot be used. More importantly, websites are of no use if they cannot be used quickly, easily and intuitively – that’s what people expect of a website. As a web designer, you must also understand how to design interfaces and to do that you must understand how people interact with websites. You need to know when to adopt conventions and when to be innovative. Our approach is often referred to as ‘user-centred design’ and this means that websites should be designed for the best user experience and should be tested from the user’s point of view.

Accessibility

All websites should be accessible. In other words, websites should be designed for all members of their target audience, irrespective of how they interact with that website. For example, a website should allow its content to be easily available to those who are blind or have poor vision as well as to sighted users. It also means websites should be easily usable across a wide range of device types (laptops, smartphones etc.). There are many simple methods a designer can adopt in order to make their websites more accessible.

Findability

Findability is the art of designing websites that can be found. This includes SEO (Search Engine Optimisation), designing websites in such a way that they can easily be indexed by search engine spiders, optimising content and site structure, and creating user-friendly URLs. It therefore also describes methods for allowing people to find specific bits of information in a website.

Cross-browser compatibility

The browser wars are over but that doesn’t mean web designers can relax (well, not much anyway). There are now more browsers in common usage than ever before and although just about all of them render standards-compliant code reasonably well, there are still differences in the way some browsers display a webpage. Admittedly, most of these differences are small in modern browsers but there are enough older browsers still in use to make life difficult.

Aesthetics

All the principles described above are important but ultimately, people are disproportionately influenced by what they see. Websites must therefore be aesthetically pleasing. A website that is visually well designed gives people confidence in the information it contains and provides a better user experience.

It is important that web designers understand the power of the visual aspects of design but they should always ensure that their designs are well balanced, giving relevant weight to less tangible principles like accessibility and code semantics, and not to rely on websites that just look good.