HTML structure and semantic elements are the focus of this Grade 10 Computer Science worksheet on digital design and web development. Students identify common HTML tags, connect page features with the correct elements and attributes, and reason about how semantic HTML improves readability, accessibility, and maintainability. :contentReference[oaicite:0]{index=0}

Build a clear mental model of HTML structure

Students work with headings, paragraphs, images, links, and lists while learning how each element contributes to the structure of a web page. They identify the role of attributes such as alternate text for images and the destination attribute used by hyperlinks, while also practicing correct element hierarchy within a page.

The lesson then extends beyond individual tags to semantic HTML. Students examine elements such as header, nav, main, and article and consider how these elements communicate the purpose of different sections. The material emphasizes that a clear semantic structure makes pages easier to interpret, update, reuse, and navigate with assistive technologies.

Practice choosing the right element

Activities include a dialogue, definition matching, a cloze passage, diagram labeling, a reading passage, multiple-choice questions, true-or-false statements, short responses, and an extended response. Students select appropriate HTML tags and attributes, identify semantic page regions, explain alternate text, and distinguish structural HTML from visual appearance.

The extended response asks students to explain how they would structure a blog post using both standard content elements and semantic elements. They consider where headings, paragraphs, links, navigation, primary content, and article content belong while justifying why semantic structure is useful.

Included for classroom use

• Grade 10 Computer Science worksheet focused on HTML tags, semantic elements, attributes, hierarchy, and accessibility
• Separate Teacher Guide PDF with learning objectives, teaching tips, discussion questions, and common mistakes

Where this lesson fits

Use this HTML worksheet when introducing web page structure, reinforcing semantic markup, or preparing students to create organized web pages in a digital design or web development unit. It can support direct instruction, guided practice, independent work, or review before students begin writing or revising HTML.

The resource helps students connect individual tags with the larger structure of a page. By choosing appropriate elements and explaining why semantic sections matter, learners practice thinking about HTML as meaningful organization rather than simply a collection of tags.