HTML Structure and Presentation
Web pages are typically created using three components, HTML, CSS and JavaScript.
HTML | Provides the content and structure of each page |
---|---|
CSS | A presentation language used to style the HTML content |
JavaScript | A scripting language used to provide additional functionality, interactivity and behaviours |
There is a special relationship between HTML and CSS. HTML can exist without CSS, but CSS is pointless without any HTML to style.
Hypertext Markup Language (HTML)
HTML is markup language used to create web pages.
HTML pages are interpreted by a web browser.
HTML tags are added to each element of content in order to provide meaning and context.
Further HTML tags can be used to divide a page into logical sections (divisions), making different layouts possible when combined with CSS.
Images, tables and hyperlinks are also included using HTML.
Although it is entirely possible to make a website just using HTML, it would look bland and unappealing.
To create web pages that are visually stunning and easy to use, we need to use another language called CSS.
Example of HTML
<p>This is a very short paragraph.</p>
Cascading Style Sheets (CSS)
CSS is a presentation language. Its purpose is to provide a web browser with styling instructions for the HTML.
CSS can be included directly in the HTML tags, in the head section of the HTML, or in an entirely separate document (CSS style sheet).
CSS is a very powerful tool, enabling very complex and unique designs to be made possible.
Take a look at the CSS Zen Garden website to see how changing CSS can make a dramatic difference to the appearance of HTML.
Example of CSS
p {color: blue}