eGovernment for Development

Design

What Does Designing A Website Mean?

Content, Structure and Presentation

All documents (i.e. not only online documents) are composed of three main elements: content , structure , and presentation (we owe these definitions to the World Wide Web Consortium, or W3C: see W3C Recommendations ):

• The content of a document is the information it actually conveys.
• The structure of a document refers to the way this content is logically divided into parts and sections (e.g. chapters, paragraphs, etc.).
• The presentation of a document is the way its content and its structure are conveyed to the user.

As a way of example, let's apply this to the web page you are reading now:

• Its content could be broadly defined as "information on what designing a website means";
• As you can see, this content is organised, or structured, in logical "parts", or sections: a title, a series of paragraphs, and some lists (like the one you are reading now); the page has a beginning and a conclusion, which are also structural elements.
• Both the content and the structure of the page are then presented in specific ways: it is highly likely that you are reading this off a computer screen, in which case the presentation is entrusted by default to black fonts on white background, with titles, headers and lists clearly marked with the use of larger fonts, bold characters, or bullet points; but you could also be listening to the page being read aloud by someone else (a different way of presenting its contents: in this case the reader may, for instance, pause between paragraphs, thus also conveying the structural elements of the page together with its contents).

Designing an online document means managing its structure and its presentation in ways that make it easy for users to consult it and make use of its content for their purposes.

In order to do this effectively, it is essential to handle structure and presentation as separate elements - and find specific solutions for each of them.  For instance, you may want to structure the contents of this page in different ways, in order to organise it more logically for your use (e.g. you could decide to change the length or the order of its paragraphs, or add/eliminate titles and headers): but this need not necessarily affect the way it is presented (e.g. the font used for headers, or the background).  Or you could change the way it is presented (e.g. by adopting a larger or smaller font, or by making additional use of pictures to convey contents) without affecting its structure.

Designing a Website

The distinction between content, structure and presentation can be extended beyond single documents, to include a whole collection of documents, like a website.

In this case:

• the content of a website is represented by the sum of the contents of all the documents that compose it,
• the structure of a website is the way these documents are logically organised (e.g. a homepage, a number of subsections, etc.), and
• the presentation of a website is represented by the ways in which its contents and its structure are presented to the user (e.g. navigational menus, the use of colours or special fonts to highlight specific structural elements, or the use of a logo and a common colour scheme to inform the user that some or all documents belong to the same collection, etc.).

It's a common mistake to consider website design simply as the creation of a visual layout for your site, and to spend fewer energies on designing its structure and planning its contents.  In fact, concentrating primarily on graphical layout only serves to address the presentational elements of a website, and it usually leads to nice-looking websites that unfortunately do not properly address the communication needs of the users and of the public agencies that own the sites.  And it is no use having a shiny, elegant website if it doesn't deliver the information in easy and accessible ways.

Therefore, designing a website means finding technical solutions to manage both the structural and the presentational elements of a site.  As with single documents, these elements should be kept as separate as possible, so that it is possible to review one of them (e.g. redesigning the look of the site, or merging/renaming/creating new sections) without affecting the other: this is the secret to a sustainable, durable and effective web application.