Web Design with CSS (part 1)

20 Jan 2010 | by Administrator

In the beginning HTML began its life as a simple language for tagging research papers. Its lack of layout capability was the reason why basic elements were initally misused for layout effects unrelated to their original intended purposes. Sometimes elements with specific functions were ignored because they didn’t look very nice. Proper structure was neglected in favour of a web site’s visuals.

As we already saw (refer to the article about web site validation), the World Wide Web Consortium (or W3C) tried to clear up the incompatible mess of the 1990s Web by providing a series of recommendations (for HTML, XHTML, XML, CSS, Accessibility guidelines etc.) By following these specifications properly, developers of authoring software and web browsers would have clear guidelines for web site creation. In turn content authors and designers could be sure that their web sites were viewable and usable by the widest variety of users.

Over time it became possible for Web designers to create complex pages in HTML that would render reasonably consistently across many browsers and operating systems. Standardizing of the specification produced by the World Wide Web Consortium injected a sense of consistency into web authoring.

Cascading Styles Sheets (CSS) are a way to style HTML. They allow for much richer document layouts than HTML alone. Critically they begin to separate the content of a web site from its implementation. (Advanced scripting tools and templating systems allow for complete abstraction of content and implementation - but that will be discussed in a later series of blog entries). Whereas the HTML is the content, the CSS style sheet is the presentation of that document (i.e. color settings, text size and format, background images, page layout etc.) and it is used to control the appearance of your web site document.

CSS Benefit 1 - CSS based web sites are quicker and easier to maintain and debug If you have ever tried to change the font or color of all the headings in all your web pages, you will understand how CSS can save lots of work, time and effort.

CSS Benefit 2 - CSS based web sites are faster to browse, download and more search engine friendly When styles are saved in external files, the user will only need to download it once. When surfing the rest of the web site the CSS will be cached on the users computer, and therefore speed up the loading time. You can change the style and appearance of all the HTML pages in your web site, just by changing your CSS document.

CSS Benefit 3 - CSS based web sites allow for a hierarchical stylistic control of large web sites Additionally, due to the cascading nature of CSS, styles can be implemented with different levels of hierarchy e.g three different style sheets could all affect a particular page by having - a general web site style sheet (with broad style guidelines), a style sheet for the entire news section, a style sheet for a particular page (with very specific style guidelines). More on this coming soon....

CSS Benefit 4 - CSS based web sites are more compliant with web standards (more on this coming soon)

CSS Benefit 5 - CSS based web sites integrate with other technologies and languages far better (more on this coming soon too)

If you want to learn more about how web design, xhtml and css can benefit your organisation please contact brightlemon web design london.

Web references: