BrainSnail

Technology · Unit 14

The Web and How It's Built

HTML, CSS, JavaScript, browsers and servers

The web is built on a deliberately simple split: content, presentation and behaviour, handled by three separate technologies that can be learned one at a time.

The unit covers HTML, CSS, JavaScript, HTTP and browsers, and the front end and back end.

This unit breaks down into 23 short steps and 119 questions, starting at difficulty 1 and building to 4. Below you can see exactly what it covers, how the path is structured, and worked examples with explanations.

Steps
23
Questions
119
Difficulty
1-4

What this unit covers

  • JavaScript
  • HTTP and Browsers
  • Front End and Back End
  • CSS
  • HTML

Where this fits

Needs Programming and Networks and the Internet.

Where people slip

Front end runs on the visitor's machine and back end on the server. Anything sent to the browser can be read and changed by the visitor, which is why validation has to happen on the server too.

How the unit is structured

The Web and How It's Built runs as 23 short steps that unlock in order. 17 are practice rounds and 6 are challenge rounds that pull together everything before them. Questions start at difficulty 1 and climb to 4 as you progress.

Step 1 · easierStep 23 · harder

Challenge rounds

Example questions

30 real questions from this unit, with the answer and the reason behind it, grouped by what they practise. There are 119 in the unit altogether.

CSS

  • Fill the blankLevel 1

    1. CSS styles a page, for example its colors and ____.

    • fontscorrect
    • wires
    • batteries
    • cables

    CSS controls fonts along with colors, spacing, and layout.

  • Multiple choiceLevel 1

    2. Which language can change the color of text on a page?

    • CSScorrect
    • HTTP
    • USB
    • Wifi

    CSS sets styling like text color, so it is the right tool for coloring text.

  • Choose all that applyLevel 2

    3. Which of these can CSS change on a page?

    • Colorscorrect
    • Fontscorrect
    • Spacing and layoutcorrect
    • The wifi password

    CSS controls colors, fonts, and spacing, but it cannot change your wifi password.

  • Odd one outLevel 2

    4. Which one is NOT usually controlled by CSS?

    • Saving data to a databasecorrect
    • Text color
    • Font size
    • Page layout

    Saving data to a database is a back-end job, not a styling job for CSS.

  • True or falseLevel 2

    5. In CSS, the selector p targets all paragraphs on the page.

    Answer: True

    True. A tag selector like p styles every matching element, so all paragraphs are affected.

  • Type the answerLevel 2

    6. Which three-letter language is used to style web pages, controlling colors, fonts, and layout?

    Answer: CSS

    CSS is the styling language that decides how a web page looks.

Front End and Back End

  • Fill the blankLevel 1

    7. The part of a website you see and click on is called the ____ end.

    • frontcorrect
    • back
    • side
    • top

    The front end is everything shown in the browser for the user to use.

  • Multiple choiceLevel 1

    8. The front end of a website is...

    • The part the user sees and interacts withcorrect
    • The wires inside the computer
    • The electricity bill
    • The delivery van

    The front end is the part the user sees and interacts with in the browser.

  • Choose all that applyLevel 2

    9. Which of these are the main building blocks used to build a web page's front end?

    • HTMLcorrect
    • CSScorrect
    • JavaScriptcorrect
    • Electricity

    HTML, CSS, and JavaScript are the three core front-end languages, while electricity is not one of them.

  • Match the pairsLevel 2

    10. Match each part of a website to what it means.

    Answer: Front end = What the user sees; Back end = The server side; Database = Where information is stored

    The front end is what the user sees, the back end is the server side, and the database stores information.

  • Sort into groupsLevel 2

    11. Sort each item into Front End or Back End.

    Answer: Button you click = Front End; Page colors = Front End; Server = Back End; Database = Back End

    Buttons and colors are front-end things the user sees, while servers and databases are back-end things.

  • Odd one outLevel 3

    12. Three of these are front-end tasks. Which one belongs to the back end?

    • Database servercorrect
    • Text color
    • Button shape
    • Page layout

    Managing a database server is a back-end task, while colors, shapes, and layout are front-end.

HTML

  • Fill the blankLevel 1

    13. The little labels in HTML, like <p> and <h1>, are called ____.

    • tagscorrect
    • fonts
    • servers
    • clicks

    Tags are the labels in angle brackets that mark up the parts of an HTML page.

  • Multiple choiceLevel 1

    14. What does HTML give a web page?

    • Its structurecorrect
    • Its electricity
    • Its internet speed
    • Its battery power

    HTML builds the structure of a page, like its headings, paragraphs, and links.

  • True or falseLevel 1

    15. HTML stands for HyperText Markup Language.

    Answer: True

    Yes, HTML is short for HyperText Markup Language, the language that structures web pages.

  • Type the answerLevel 1

    16. What four-letter name is given to the language used to build the structure of a web page?

    Answer: HTML

    HTML is the markup language that structures the content of a web page.

  • Choose all that applyLevel 2

    17. Which of these are jobs that HTML does on a web page?

    • Add a headingcorrect
    • Add a paragraphcorrect
    • Add a linkcorrect
    • Encrypt your passwords

    HTML adds structure like headings, paragraphs, and links, but it does not handle security.

  • Odd one outLevel 2

    18. Which one is NOT an HTML tag?

    • <color>correct
    • <p>
    • <div>
    • <h1>

    There is no <color> tag in HTML. Colors are set with CSS instead.

HTTP and Browsers

  • Fill the blankLevel 1

    19. You type a web address into a ____ to visit a website.

    • browsercorrect
    • speaker
    • battery
    • printer

    A browser is the program you use to open web addresses and view pages.

  • Multiple choiceLevel 1

    20. What is a web browser?

    • A program that shows web pagescorrect
    • A kind of keyboard
    • A type of battery
    • A printer

    A browser is a program that fetches and shows web pages on your screen.

  • Odd one outLevel 1

    21. Which one is NOT a web browser?

    • Photoshopcorrect
    • Chrome
    • Firefox
    • Safari

    Photoshop is an image editing program, not a browser for visiting websites.

  • Put in orderLevel 2

    22. Put these steps of visiting a website in the correct order.

    Answer: You type a web address -> The browser sends a request to a server -> The server sends back the page -> The browser shows the page on your screen

    You type an address, the browser asks the server, the server sends the page, and the browser shows it.

  • Match the pairsLevel 3

    23. Match each web term to what it does.

    Answer: HTTP = Transfers web pages; HTTPS = Secure, encrypted transfer; URL = A web address

    HTTP transfers pages, HTTPS transfers them securely, and a URL is a page's web address.

  • Guess the numberLevel 4

    24. What is the HTTP status code that means 'OK', a successful response?

    Answer: 200

    A status code of 200 means the request succeeded and the response is OK.

JavaScript

  • True or falseLevel 1

    25. JavaScript can make something happen when you click a button.

    Answer: True

    True. JavaScript can respond to clicks and other actions to make a page interactive.

  • Fill the blankLevel 2

    26. JavaScript makes a page ____, so it can react when you click or type.

    • interactivecorrect
    • colorful
    • heavier
    • printed

    Interactive means the page can respond to the user, which is JavaScript's main job.

  • Multiple choiceLevel 2

    27. Which language makes web pages respond to what a user does?

    • JavaScriptcorrect
    • HTML
    • CSS
    • HTTP

    JavaScript adds behavior, so it lets pages respond to user actions.

  • Type the answerLevel 2

    28. Name the language that adds behavior and interactivity to a web page.

    Answer: JavaScript

    JavaScript is the language that brings web pages to life with interactivity.

  • Choose all that applyLevel 3

    29. Which of these are things JavaScript can do?

    • Show a pop-up messagecorrect
    • Update text after a clickcorrect
    • Check a form before it is sentcorrect
    • Repair a cracked screen

    JavaScript can show pop-ups, update text after a click, and check a form, but it cannot fix a broken screen.

  • Choose all that applyLevel 4

    30. Which of these can run JavaScript?

    • A web browsercorrect
    • Node.jscorrect
    • A server using Nodecorrect
    • A plain CSS file

    JavaScript runs in web browsers and in Node.js on a server, but a CSS file cannot run it.

Where these questions come from. Each unit starts as a plan of the concepts it should cover and the difficulty it should span. Questions are written against that plan with AI assistance, then checked by a validator that rejects anything without a single defensible answer, an explanation, or plausible wrong options. How we write questions sets out the whole process, and corrections are fixed in the bank and reach the site and the app the same day.

How you practise

This unit mixes 10 different question formats, so you are recalling and applying rather than recognising the same layout every time.

  • Choose all that apply
  • Fill the blank
  • Guess the number
  • Match the pairs
  • Multiple choice
  • Odd one out
  • Put in order
  • Sort into groups
  • True or false
  • Type the answer

Practise The Web and How It's Built

119 questions across 23 steps. Start with step one and crawl at your own pace.

Play this unit

Read about The Web and How It's Built

Explainers from our blog on what this unit covers. Each one ends with real questions from the bank.

More units in Technology

See all 18 units in Technology →