Mostly because you want the website you’re visiting to work as intended.
I know, that’s not very helpful. Let’s see if I can explain in a little more detail.
Become a Patron of Ask Leo! and go ad-free!
Programs do everything
Anything that happens on your computer happens because some kind of program tells your computer to do it. In fact, quite often it’s some kind of program telling some other kind of program to do it. It can get quite complicated, as you can imagine.
Take webpages, for example. At its core, each webpage is a kind of computer program that tells your browser what to display and how to display it.
Computers don’t understand English. Besides, English is too ambiguous for the precision required to properly program a computer. Computers only work in the absolute.
There are hundreds if not thousands of different computer programming languages. Each has its own pros and cons, strengths and weakness, and abilities and purposes.
There are several different languages that might be used to have a browser display a webpage: four, in fact. Let’s meet them.
Languages and webpages
In very over-simplified terms, there are four languages that come into play when a webpage — including the page you’re reading now — is displayed.
HyperText Markup Language is the basic language of the web. It describes how a page should look.
When you request a webpage, a page full of HTML is delivered to your browser by the web server. The browser follows those HTML instructions to present the page. Those instructions include what fonts to use, how big to make them, whether to make some words bold or italic, where to place an image, how to format a table of information, and much more.
The limitation of HTML is that it’s static. Once the page is displayed, it’s done.
Cascading Style Sheets are an augmentation of HTML that separate style and appearance from actual content.
A good way to think of it is that HTML will say “Here’s a paragraph, and here’s what it contains”, whereas CSS might say “All paragraphs use this font at this size with these colors” and so on.
The line between CSS and HTML is blurry, since much of what CSS controls can be included directly in HTML. But the ideal is that when your browser requests a webpage:
- A page of HTML is downloaded.
- One of the early instructions in the HTML is to download another file, called a style sheet, containing all the CSS for that page.
When implemented cleanly,1 simply replacing one CSS style sheet with another would completely change the appearance of a page.
Dynamic HTML adds more programming constructs to HTML to create a way for the DHTML “program” to “do” things dynamically.
For example, with DHTML, a webpage can specify actions to be taken when certain events happen — for example, to change the color or appearance of some text when the mouse pointer hovers over it.2