There are three basic tools that make up a Web page: HTML (document structure), Cascading Style Sheets (document style) and JavaScript/ECMA Script/JScript (document behavior).
Your HTML tags should describe the data in your Web page. Use appropriate class and id attributes to provide ways to style your page, and interact with it using JavaScript. Never include visual markup.
Your Cascading Style Sheets (CSS) contain all the style information.
The JavaScript contains additional behaviors that normal HTML cannot create. Your page should always be usable with just HTML and CSS. JavaScript should never be required to make the page usable. If it is, then your JavaScript needs to be rewritten. JavaScript adds functionality to an already functional page. It never creates basic functionality.
As mentioned earlier, JavaScript is a programming language interpreted by the browser. Through the use of the standard Document Object Model, the browser parses the HTML document to create a tree like structure of nodes that represents the HTML document. JavaScript can interact with this tree structure, which is often called the DOM. Browsers also parse the CSS and alter the DOM accordingly. JavaScript can also access the styles associated with the DOM, and alter the styles.
Think of lunch. Good design, in all its abstract goodness, is like bread. It holds your sandwich together. HTML is like peanut butter and provides a meaningful base to the whole thing. CSS is like jelly, because it adds some pizazz to the sandwich. Lastly, JavaScript is like a glass of milk. The sandwich is still plenty edible without milk, but sure as heck goes down easier with it.
|