The design of each well developed website consists of three distinctly separate parts.
These are the website specifications, the structure and the contents.
To help you visualize these three different parts of a website, it may help to consider them in terms of a house.
A house exists initially as an architects plans and specifications.
With a house, the plans show the arrangement of different rooms in the house. While, the specifications define the materials that the builders will use to build the house, and define how those materials are to be used.
The structure of a house consists of the floors, walls and roof, plus all the components used to construct the building.
The contents of a house consist of the finishing details such as carpets, curtains, fittings and furnishings.
With a website, the styles defined within the CSS style sheet are equivalent to the architects specifications and plans for a house.
The structure of a website is the html code, which represents the components used to build the website pages.
For example, a div in an html page is a division, which is a rectangular area of the website page. The height, width and location of the div is defined by the style sheet specifications.
The style sheet specifications also define the background color, plus define any background images and outline borders displayed in the div.
The contents of each website page are usually unique to each individual page at a site, and are different to the contents of every other page at the site.
The contents consist of the information that is added and edited by the website owner though a page editing application such as SBI's BB2, and includes the text, photographs and videos, etc. displayed on each page.
It is essential that these three parts of a website design, the specification, the structure and the content, be separate, although be structured to work well together.
Website information should never be included within the html structure of pages. Doing so would be equivalent to a worker on a building site ignoring the architects specifications and plans, and instead using different materials or a different arrangement of walls to those specified.
Locating unique styling information within the individual pages of a website would mean that the display of those unique parts of the site could not be changed simply by changing the relevant specifications in the style sheet.
Not being able to change the appearance of the pages by changing the styles, would mean that those unique styling details could only be changed by making the changes within each individual page.
If the website is say 1000 pages in size, then making the required styling changes within each individual page would be a time consuming, tedious and potentially expensive process.
The expression "Web Design" means different things to different people.
To the graphic artist it means a pleasing visual interface and page layout, often the more visually pleasing the better.
To a type designer it means the effective presentation and readability of text and headings. To a coder it means well written code and technical effects such as rollover buttons and drop down menus, etc.
To a writer it means text based content that has meaning to a reader and which is grammatically correct. To an SOEer it means the correct use of keywords in the right places and at the optimum frequency on the pages.
To a photographer it means having their brilliant photographs optimally displayed on the website pages.
To Google it means well written, and unique content that can be indexed, and which clearly identifies the subject and purpose of the individual website pages, and which has real value to the visitors which they send to the website.
To a website owner it means a website that generates business results such as attracting clients who take action at the site, and buy the products and services promoted by the business.
To a website visitor it means finding what they are looking for at the website as quickly as possible so that they can then leave the site, without the graphic design, typography, technical effects, photographs and written content, etc. getting in the way, and preventing them from doing so.
Return to the top of the design page.
Return to the create a website page.