HTML Structural Tags Theory Sheet PDF

Summary

This document is a theory sheet explaining HTML structural tags. It covers various tags like , , , , , , and . The guide helps to understand webpage layout and organization in web development. It also provides an overview of each HTML tag.

Full Transcript

HTML Structural Tags – Theory Sheet What Are Structural Tags? Structural tags in HTML are used to define the layout and organisation of a webpage. They help search engines, browsers, and developers understand the hierarchy and purpose of different sections of content. Key Structural Tags 1. – Root...

HTML Structural Tags – Theory Sheet What Are Structural Tags? Structural tags in HTML are used to define the layout and organisation of a webpage. They help search engines, browsers, and developers understand the hierarchy and purpose of different sections of content. Key Structural Tags 1. – Root Element This is the top-level element that contains all HTML code. Everything inside an HTML document is wrapped within.... Example:... 2. – Document Metadata The contains important information about the webpage that is not visible to users. Includes: o Page title () o Character encoding () o Viewport settings () o Links to stylesheets and scripts Example: My Web Page 3. – Visible Page Content The tag contains all content that appears on the webpage. This includes text, images, navigation, and layout elements. Example: Welcome to My Page This is the main content area. 4. – Page or Section Header The tag defines introductory content or navigation at the top of a page or section. It typically contains a heading ( to ) and sometimes a logo or navigation links. Example: My Website 5. – Navigation Menu The tag is used for grouping navigation links. It helps users navigate between different sections of a website. Example: html CopyEdit Home About Contact 6. – Main Content Area The tag contains the primary content of the webpage. It should only be used once per page and should not include repeated elements like , , or. Example: This is where the main content of the page goes. 7. – Content Section The tag is used to group related content together. Each section typically has a heading (, , etc.). Example: About Us We are a web development company. 8. – Independent Content The tag is used for self-contained content that can be shared or reused (e.g., blog posts, news articles). Example: My First Blog Post This is a blog post about web development. 9. – Sidebar or Related Content The tag is used for content that is related to the main content but not part of it. Typically used for sidebars, ads, author information, or extra notes. Example: html CopyEdit Related Articles HTML Basics CSS Styling 10. – Bottom Section of a Page The contains copyright information, links, and other closing details. Example: html CopyEdit © 2025 My Website Structural Tags Overview Table Tag Purpose The root element of the HTML document. Contains metadata like title, charset, and styles. Contains all visible content on the page. Defines the introductory section of a page or section. Holds website navigation links. Contains the primary content of the page. Groups related content together. Defines independent content (e.g., blog post). Represents related content (e.g., sidebar). Contains closing details (e.g., copyright info).

Use Quizgecko on...
Browser
Browser