Web Design or website design, whichever you prefer...

Web design (or website design) as a term covers rather a large section of web services and tends to be used as a generic term to describe 'work carried out to create or modify a website'. So baring this in mind we've broken down the various elements into a list of web design (or website design...) articles.

Contents of website design section:

• The web design process

• Technical considerations of website design

• The website design concept

• The client's role towards the web design concept

• Proofing the final website design templates

• The finished website design

• Web design cross referencing technical design

• The efficient and compliant practices of a Surf Interactive website design

The Web Design Process

Website design often refers to the process of creating a new website, from an initial idea to a fully functional live website. This web design process from a visual point of view typically involves consulting with the client to gauge exactly what they need and want, producing concept web designs for visual and technical proofing purposes, arriving at a final website design template (or group of templates) for final proofing and bringing the project to fruition as a live functional website. Each website design project of course is unique, and so we'll organically flow with the requirements which dictate the design process for any given web design project and make sure we 'stick to the spec', whilst also remaining creatively alert.

The Technical Considerations of Website Design

Every website design project has a technical aspect to consider, no matter how small. The majority of modern websites need to achieve something, otherwise there is little point in creating one. The objective may be to achieve leads or interest through SEO/SEM (Search Engine Optimisation and Search Engine Marketing), to sell products via a secure portal, to gather e-marketing data, communicate information to members of a club or to collate data from multiple sources and produce an output. Even the most basic of brochure websites has a function to fulfil and might carry a technical specification along the lines of 'Generate interest via product pages and influence potential customers to engage in dialogue with us, in order that we gain new custom from the website and maximise ROI'

This very brief specification actually says quite a lot:

1. The website needs to generate 'contextually correct' incoming traffic in some way

2. Once (1) above is achieved the visitor needs to be able find a product of interest almost immediately, without having to search around

3. Once (2) above is achieved the visitor needs to be converted into a lead by entering into some sort of dialogue with the company

Coming at this from a web development angle we may for instance convert the above 3 points to:

1. The website needs to attract appropriate visitors via google, yahoo and MSN, resulting from a well implemented SEO/SEM campaign

2. The website needs to be very easily navigable so that visitors can reach their point of destination within 2 or 3 clicks of a mouse button

3. Once a visitor has found the product/page of interest they will be presented with the option to
   
   

   a) Be contacted by the company at a time scheduled by them
   b) Call the company and speak to a sales representative
   c) Email the company and request information via email

Therefore within the design process we need to refer to a technical specification, detailing the technical functions that the website design needs to fulfil. We can of course write the technical specification with the client, either partially or completely, and arrive at a point of knowledge for both visual design aspects and technical design aspects for the web design project we are about the embark upon.

The website design concept

Starting with the website design concept, this is a design or set of designs which illustrate a potential future. The potential future of what your website design 'could' look like. These will often be in the form of a flat image or printed display board and their purpose is to hone the client's wants, and our understanding of these wants towards a web design which creates a positive reaction and embodies the essence of the client, business or organisation.

The client's role towards the website design concept

Some clients have a firm vision of their website project and in this instance it's our job to interpret their visions into a reality – or a potential reality as far as website design concepts go. Some clients know the information they need to present but have no preconceived ideas on how the website should look or react. Typically these web design projects also involve a degree of company/Corporate identity and logo design. Any company/logo design will obviously be carried out first in order to arrive at a starting point for colour and form, after which we start with a few differing generic web designs to gauge reaction, and progress from there. Once we've hit an avenue which excites the client we hone in and start to introduce some detail, moving towards a final web design concept proof.

Proofing the final website design templates

Finalised web design templates will be proofed with the client and any final adjustments made. Larger website design projects will likely have more than one design template, all using a common theme to which all templates refer to or nod to in some manner. Smaller website design projects, advertising the wares of a small business for instance, may have only one or two design templates which all pages of the website use. In either case when we put your finalised web designs into place we 'means test' them to make sure they behave correctly when displaying content.

The finished website design

Once the final website design templates have been proofed and tested, the website can be created and populated with content. It is usual for us to set up styles for the web content so that text fonts, text colours and text size, as well as tables and other internal website elements can be synchronised with the website design. Indeed, it is fair to say that the styling of the web content becomes part of the website design itself. Depending on the intended platform, content may be completely or partially uploaded by the client (in the case of content management systems or CMS).

Efficient and compliant coding practices of a Surf Interactive web design

• Professional web coding practices will be used throughout your website design. We 'comment our website code' to make sure that each module of the code is a known entity, and can be quickly revisited by a web developer in the future.

• 'CSS design practices (cascading style sheets)' are used so that many web design elements can be changed throughout the site by updating one single reference in the CSS file.

• 'Includes' are used for common page elements so that again, a single instance is updated in order to update a number of pages.

• Dynamic code, such as PhP and database code is written in an efficient way both visually and in terms of CPU intensive operations.

• Code is fully validated before going live, using the W3C validation service. This ensures the website code is fully compliant with all standards.

Web design cross referencing technical design

Considering that the internet/web is a highly visual experience, graphic design plays a part in any new project to some degree. 'Designing for the web' isn't always as straight forward as it may seem however and often the design specification cross references the technical specification to quite a large degree. At Surf we make sure that technical requirements are taken into account when the design process is started and that these are both communicated to the client, and monitored throughout the web design process

Example: Designing for SEO (Search Engine Optimisation) - new website has a marketing goal of generating interest and leads via search engines. The design will need to reflect the requirement for good quality SEO (Search engine optimisation) and so navigation links will need to be in text format instead of graphical buttons, using CSS and possibly JavaScript to style them. Text and headings will need to be displayed as text (not images) if at all possible and depending on the intended market, the SEO may dictate that quite large bodies of text are required on some of the explanatory pages of the site, or even on the homepage and so the website design will need to be capable of displaying this, whilst at the same time retaining interest for visitors.