Web Technologies

What Web Technologies covers

Web Technologies is examined on component 01 of OCR Computer Science, Computer systems. 71 recall questions across 6 subtopics.

The 6 subtopics

Each one has its own page.

• Structure, presentation and behaviour, and HTMLRecall questions on the head and body of an HTML page, the title, link, heading, img, a, div, list, form and script elements, reading markup, semantic structure, and how HTML, CSS and JavaScript separate structure, presentation and behaviour.Open →
• CSSRecall questions on what CSS does, inline styles and external stylesheets, writing rules, classes and identifiers, colour, font, size and border properties, hexadecimal colour codes, and inline styles overriding a stylesheet.Open →
• JavaScriptRecall questions on what JavaScript does in a page, producing output, tracing loops, selection and arrays that write into the page, why scripting makes pages feel faster, and why JavaScript checks cannot be trusted for security.Open →
• Server side and client side processingRecall questions on client-side and server-side processing, examples of each, their advantages and disadvantages, bypassing client-side validation, why both sides validate, and deciding which side should handle a task.Open →
• Search engine indexingRecall questions on search engine indexes, web crawlers, how an index is built from a fetched page, why indexing makes search fast, what is stored about each word, robots files, stale results, and indexing versus ranking.Open →
• The PageRank algorithmRecall questions on the idea behind PageRank, dividing a page's vote among its links, the damping factor and the random surfer, iterative computation, calculating ranks by hand, and why PageRank alone cannot order results.Open →

What you need to know

Answer each one before you reveal it.

Take Web Technologies further

The same content, four other ways.

Commonly confused

Pairs that lose marks when they are blurred together.

• Client-side processing vs Server-side processing

  Client-side processing: work carried out in the user's own browser on code the server has sent. Server-side processing: work carried out on the server before a response is returned.

• Indexing vs Ranking

  Indexing: building the store that records which pages contain which words. Ranking: deciding the order in which the matching pages are presented.

• HTML vs CSS

  HTML: the language that marks up the structure and content of a page. CSS: the language that describes how that content should be presented.

Questions from this topic

Each one with the model answer underneath.

1. 1

   What does a browser do with the head of a document as opposed to the body?

   Model answer

   The head holds information about the page rather than content to be displayed in it: the title, links to stylesheets, and scripts. Nothing in it is rendered in the page area. The body holds everything the user actually sees - the headings, paragraphs, lists, images, links and forms - and the browser lays that out and draws it in the window. Splitting them means the browser can start fetching stylesheets and preparing to render before it has read the content.

2. 2

   What does the title element do, and where does its text appear?

   Model answer

   It gives the document its name. The text does not appear in the page itself; the browser shows it in the tab or window title bar. It is also what is used when the page is bookmarked, what a search engine typically shows as the clickable heading of a result, and what a screen reader announces when the page opens - so a title that describes the specific page rather than just the site name matters for both usability and search.

3. 3

   What is the link element used for in the head of a page?

   Model answer

   It attaches an external resource to the document, and its main use is to link the page to an external CSS stylesheet. Putting one link element in each page means every page shares one stylesheet, so the whole site is styled consistently from a single file and the browser can cache that file and reuse it across pages.

4. 4

   The heading elements h1, h2 and h3 make text bigger and bolder. Why is choosing among them not just a decision about size?

   Model answer

   Because they express the document's structure, not its appearance. A first-level heading is the main heading of the page, a second-level heading is a section within it, a third-level heading a subsection within that - they form an outline that describes how the content is organised. Screen readers use that outline to let a user jump between sections, and search engines use it to judge what the page is about and which parts matter. If size were the only concern, CSS could make any element any size; choosing the heading level by appearance rather than by meaning produces a page that looks right but whose structure is nonsense to anything that is not a pair of eyes.

5. 5

   An img element can carry src, alt, height and width. What is each for, and why does one of them matter more than authors think?

   Model answer

   src gives the location of the image file to display. height and width give the dimensions in which to display it, which also lets the browser reserve the right amount of space before the image has downloaded so the page does not jump about as it loads. alt gives alternative text describing the image. alt matters more than authors expect because it is what a screen reader announces to a blind user, what is displayed if the image fails to load or images are switched off, and what search engines use to understand the picture - so an image carrying meaning needs alt text that conveys that meaning rather than a filename.

6. 6

   What does the a element with its href attribute do?

   Model answer

   It creates a hyperlink. The href attribute holds the address of the destination - another page on the same site, a page on another site, or a resource such as a file - and the content between the opening and closing tags is the clickable text or image the user sees. Clicking it makes the browser request the address in href and display what comes back. These links are also what web crawlers follow to discover new pages, and what carries importance between pages in link-based ranking.

What is inside Levo

Six ways to work the same material.

Web Technologies revision questions

What does Web Technologies cover in OCR A-Level Computer Science?

6 subtopics: structure, presentation and behaviour, and html, css, javascript, server side and client side processing, search engine indexing and the pagerank algorithm. Each one has its own page with questions and model answers.

How is Web Technologies organised?

By the OCR H446 specification, subtopic by subtopic, so it matches the order you are taught it in.