What do you want to understand today?

PEAZIT Aha card

The web: content, appearance and behaviour

A page combines content structure, presentation rules and programmed behaviour.

A basic division of responsibilities.

Layer	Example
HTML	This text is a heading.
CSS	Make the heading purple.
JavaScript	Calculate a result when clicked.

One worked example

<h1>Aha</h1>HTML marks a heading.
h1 { color: purple; }CSS sets its colour.

Watch out: This is a basic division, not a hard boundary. HTML has built-in interactions and JavaScript can change content and styles.

Goal, prerequisites and card origin

What you will learn: Distinguish the basic roles of HTML, CSS and JavaScript.

What you need first: Recognising a web page, a heading and a button.

An original PEAZIT working card. Independent expert review and effectiveness testing have not yet taken place. · v1

Show connections

A page combines content structure, presentation rules and programmed behaviour.

Without JavaScript, write your answer elsewhere before opening the solution.Which technology normally sets a heading’s colour and spacing: HTML, CSS or JavaScript?

Solution — open after your own attempt

CSS CSS describes presentation: colours, spacing and layout.

A question for your next return: Your custom program should add two entered numbers in the browser when a button is pressed. Which of these three technologies will perform the calculation?

Solution — open after your own attempt

JavaScript JavaScript can handle the click, read values and calculate the result.

Catalogue

Book

WikibooksEN

A-level Computing/AQA/Computer Components, The Stored Program Concept and the Internet/Webpage Design/HTML & style sheets

Link to the page “A-level Computing/AQA/Computer Components, The Stored Program Concept and the Internet/Webpage Design/HTML & style sheets” in Wikibooks. Subject assignment uses its title and source categories.