Web Standards

Web Standards

In my last post I mentioned something called web standards. For anyone unfamiliar with this term, this post is for you.

The term web standards refers to a set of standardised best practices used when building websites; some benefits to using them include virtually eliminating in most cases problems encountered when a website doesn’t display correctly in different Internet browsers, reducing website loading time and so on. For a fairly brief overview on some of whats involved, see below.

Separation of Structure and Presentation

The first step is the separation of the structure of a web page (the foundations of a page, usually written in HTML or XHTML, which define where each individual section and element appears on the page in relation to eachother) from the presentation (the design and appearance, such as colours, sizes and shapes and over-all design of the structural sections. This is written in CSS as a separate document and linked inside the web document.)

This might sound like a lot of extra work than putting everything in one document, but the benefits are worth any effort involved. The main benefit is that this method means that any future editing, updating or error fixing becomes totally painless; I’ll give you an example:

Lets say I have several different paragraphs of text all over my website, on different pages, all told in each individual paragraph on each page, to be coloured red. Now for some reason I have to go and change the colour of these paragraphs from red to blue; this would mean wading in page after page of code to look for each part of the coding which tells the text to be red and change it all by hand - a lot of unnecessary time and energy wasted!

Now, if I had decided to keep one single entry on a separate CSS document that tells every paragraph all over my website how to appear (a sort of ‘master control’ that can issue orders to everything under its authority), I now only have to change one small line of code and have every single one of these paragraphs all over my website change with it instantly. As you can see, if I had hundreds of these paragraphs scattered all over hundreds of pages, it would involve a massive amount of work.

XHTML and CSS Validation

The next step is to validate your newly separated structural documents and presentation documents; validation involves entering the URL of the document through a validation service such as the W3C Markup Validation Service. This is in some ways similar to running through your word processing documents through a spell checker, in that it points out any errors, conflicts or omissions present in the document and informs you of whats required to address the problem.

All of the things and other techniques used to bring a website up to standard mean that the finished product will be more polished, professional and complete from the very beginnings of its creation to the final stages of design and implimentation; it will also be more reliable to visitors and end-users, no matter what browser they decide to use or whatever settings they may have in place on their computer.

Conclusion

In short, implimenting web standards on your old website or having a new site produced with them in mind is a decision that benefits both customer and business alike, also being a decision which takes into account the future of the Internet and what users are coming to expect from modern websites.

Tags: Around the Web, CSS, W3C, Web Standards, Website Validation, XHTML

CSS 3

Cascading Style Sheets

CSS, Cascading Style Sheets, are by far the simplest and most popular way to define the stylistic elements of modern websites, and rightly so; CSS allows you to separate the design elements from the structural elements inherent to the web document by placing the design elements in an independent CSS file - making creating and maintaining a complex and standards-compliant website that much easier.

The CSS used throughout the Internet is currently in its second version but there are now plans for a third; CSS3 aims to go beyond its previous version by including a whole host of new features and techniques which will revolutionise the ways in which content can be presented asthetically. Some of the new features currently under development include the ability to change the opacity of colours displayed on the web page, the possibility of adding shadows to text purely with CSS and without using graphics software such as Adobe Photoshop and much more.

The new CSS is also being developed in individual modules, breaking up the workload involved into manageable and precise chunks; more information on the module system can be found at the W3C’s Introduction to CSS3 (Why Modules?).

CSS3 is expected to offer a whole host of exciting new possibilities for web designers and anyone interested in keeping their website current. For anyone else eagerly awaiting information on new developments in the CSS3 project, please take a look at the links provided at the end of this post.

For further reading on the subject or a more comprehensive list of proposed features and information for CSS3 can be found here:

CSS3 . Info - All you ever needed to know about CSS3

W3C - Introduction to CSS3

Tags: Around the Web, CSS, CSS3, W3C, Web Design, Web Development

Web Design in 2 Minutes - YouTube Video

I came across a fun little video on YouTube earlier which compresses the whole web design process down into a hi-speed, two minute video - it gives some idea of the amount of work involved during just the first stages of the design process alone. Enjoy!

Tags: Videos, Web Design, Web Development, YouTube