Head section holds page setup; body holds the visible content
Head section holds page-setup information not shown on the page: the page title (browser tab), the external stylesheet link (relative path, correct hierarchy), metatags (charset, description, keywords, author, viewport) and the default target window. Body section holds everything visible: text, tables, images, sound, video, lists and hyperlinks. The examined point is which section each element belongs in; metatag purposes are tabulated in the note.
Tables, div, style tags, classes and lists build the body
Tables use a header row, table rows and data cells; a cell can span more than one row or column, sizes are in pixels or %, and styles apply. div groups content so a style or class applies to the block without a table. Predefined style tags are h1, h2, h3 (headings) and p (paragraph); li tags each list item. A class reuses one style across elements. Lists are ordered (numbered — sequence matters) or unordered (bulleted — sequence does not).
Objects, bookmarks and hyperlinks connect the page outward
Objects are images, sound and video; video toggles controls and autoplay, images/video set size and aspect ratio, and images need alt text. A bookmark marks a point with an id attribute. A hyperlink is a clicked text/image jumping to a bookmark, local page, URL or email, and sets a target window; the anchor is that clickable point. A relative path is local; an absolute path must not be used for local links.
Drawn from real examiner reports.
Metatags go in head, not heading
Metatags live in the head section of the HTML document. Candidates repeatedly write heading (confusing it with an h1/h2/h3 style tag) or header (confusing it with a page header/footer) — neither earns the mark. The head section is where page-setup elements sit; it is not the visible top of the page.
s23 P12 Q10
Absolute path for a local link
For a hyperlink or stylesheet to a page on the same site, use a relative file path, not an absolute one. An absolute path names the complete address (protocol + domain), so if the site is moved or renamed it breaks; a relative path survives because it only depends on files' positions relative to each other. State the reasoning, not just the definition.
s23 P11 Q9 / w22 P11 Q13
A bookmark does not store the page
A web-page bookmark is an id attribute placed on an element so a hyperlink can jump to that exact point on the page. It is not "for books" and it does not save, store or download the page — wording that scores nothing. The bookmark only marks the destination; a hyperlink is still needed to reach it.
w22 P11 Q13
A hyperlink only works when clicked
A hyperlink moves the user to its target only when it is clicked — describing it as something that "loads" or "opens" on its own is wrong, because the action is user-initiated. When a question asks what a hyperlink does, name the click and the destination (bookmark, page, URL or email), not an automatic behaviour.
w22 P11 Q13
Web anchor vs word-processing anchor
In web authoring an anchor is the clickable point of a hyperlink that moves within or between pages. Candidates confuse it with a word-processing anchor, which fixes an image's position on a page — a different idea entirely. Tie the web anchor to navigation (jumping to a bookmark or page), not to holding an object in place.
s23 P11 Q9 / w22 P11 Q13
Alt text and image width traps
Alt text must be detailed enough that a screen reader, or a browser that fails to load the image, conveys what the image shows — a one-word alt such as "photo" scores nothing. Set an image's width with a single inline style attribute (style="width:60%"), not a separate HTML width attribute, and apply only one width per image.
w23 P03 Q3
colspan spans columns, rowspan spans rows
To merge cells, colspan makes one cell span two or more columns and rowspan makes it span two or more rows. Candidates swap the two, so a header meant to stretch across columns instead stretches down rows. Check which direction the cell must cover before choosing the attribute.
Sort each element into head or body
Place every element in the right section first. Head = title, stylesheet link, metatags, default target window. Body = everything visible: tables, images, sound, video, lists, bookmarks, hyperlinks. Use the exact words head and body, never "heading" or "header".
Give the reason tables structure content
When asked why a table is used to structure page elements, answer with the reason, not a description: a table lets the designer position and align content precisely into rows and columns. "It looks neater" or "to organise it" is too vague to score.
Name the attribute and its purpose
State each object attribute and what it does. Video: whether controls show and whether autoplay is on. Image: that alt text is applied, plus a use (accessibility, or a fallback if it fails to load). A bare attribute name with no purpose loses the mark.
State the specific metatag job
Do not answer "it gives information about the page". Name the specific job: charset sets the character encoding, viewport fits the page to all device sizes, description is the search-result summary, keywords index the page, author names the creator.
Full notes, flashcards, Q&A and the topic quiz for every premium subject.
Premium plans are US$8.99/month or US$49.99/year — first month free.
Studying with a parent's blessing? Show them this.
