How HTML, CSS and JavaScript work together in web pages

The 2 most important things to learn about web page production are:

1. Use the correct HTML tags that mean what they say.
2. Keep your HTML, CSS and JavaScript code separate.

1. Use HTML properly

Different HTML tags describe the structure of content. Each one has its own meaning, and you should only ever use each one in accordance with its meaning, and in its proper place.

When people talk about "semantic" HTML, this is what they mean.

In the HTML section, I'll explain what each tag means, and where it's OK to use it.

2. Keep 'em separate

This simply means: Don't put JavaScript or CSS in your HTML. Put them in separate files, called in by your HTML pages.

There are lots of good reasons for this, the main ones being:

• It's more logical and simpler. And simple is good.
• Easier management: Keeping all your styles and functional code in one place makes it quicker, easier and safer to change in future.
• Easier re-purposing: It's easier to design your web site to look or work differently on different user agents (e.g. handheld browsers, audio browsers, or TV)