Bird
Raised Fist0
Intro to Computingfundamentals~5 mins

HTML as the language of web pages in Intro to Computing - Cheat Sheet & Quick Revision

Choose your learning style10 modes available
LearnWhyDeepFlowTryChallengeDrawRecallReal

Start learning this pattern below

Jump into concepts and practice - no test required

or
Recommended
Test this pattern10 questions across easy, medium, and hard to know if this pattern is strong
Recall & Review
beginner
What does HTML stand for?
HTML stands for HyperText Markup Language. It is the standard language used to create and design web pages.
Click to reveal answer
beginner
What is the main purpose of HTML in web pages?
HTML provides the structure of a web page by using tags to organize content like headings, paragraphs, images, and links.
Click to reveal answer
beginner
Which HTML tag is used to create a paragraph?
The <p> tag is used to create a paragraph in HTML.
Click to reveal answer
beginner
How does HTML relate to a real-world book?
Think of HTML as the table of contents and chapters of a book. It organizes the content so readers (browsers) know what to show and where.
Click to reveal answer
beginner
What role do tags like <h1> and <a> play in HTML?
<h1> defines a main heading, and <a> creates a clickable link. Tags tell the browser how to display and interact with content.
Click to reveal answer
What is the correct HTML tag to add an image?
A<src>
B<img>
C<pic>
D<image>
Which tag is used to create a hyperlink in HTML?
A<link>
B<href>
C<a>
D<url>
What does the 'lang' attribute in the <html> tag specify?
AThe language of the web page content
BThe layout style of the page
CThe font size used
DThe color scheme
Which tag is used to define the main heading of a web page?
A<h1>
B<head>
C<title>
D<header>
What is the role of the <body> tag in an HTML document?
ASpecifies the page title
BDefines the page metadata
CLinks to external stylesheets
DContains the visible content of the web page
Explain in your own words what HTML is and why it is important for web pages.
Think about how a web page is built and what tells the browser what to show.
You got /4 concepts.
    Describe how HTML tags work using a real-life analogy.
    Imagine organizing a book or a recipe with headings and steps.
    You got /4 concepts.

      Practice

      (1/5)
      2. Which of the following is the correct way to start an HTML document?
      easy

      Solution

      1. Step 1: Identify correct HTML structure

        The HTML document starts with , then for metadata, then for content.

      2. Step 2: Check tag order and nesting

        Page correctly nests inside and places after .

      3. Final Answer:

        <html><head><title>Page</title></head><body></body></html> -> Option A

      4. Quick Check:

        Correct tag order = Page [OK]
      Hint: HTML starts with <html>, then <head>, then <body> [OK]
      Common Mistakes:
      • Placing <head> after <body>
      • Incorrect tag nesting order
      • Missing <html> root tag
      3. What will the browser display for this HTML snippet? 
      <h1>Welcome</h1>
<p>This is a <strong>simple</strong> page.</p>
      medium

      Solution

      1. Step 1: Understand tag meanings

        <h1> creates a large heading. <p> is a paragraph. <strong> makes text bold.

      2. Step 2: Visualize the rendered output

        The browser shows "Welcome" big and bold as heading, then paragraph text with "simple" bolded.

      3. Final Answer:

        Welcome (big heading) followed by: This is a simple page. (with 'simple' bold) -> Option B

      4. Quick Check:

        <h1> = big heading, <strong> = bold [OK]
      Hint: h1 = big heading, strong = bold text [OK]
      Common Mistakes:
      • Thinking <strong> makes text italic
      • Assuming <h1> is normal text
      • Believing <strong> inside <p> causes error
      4. Identify the error in this HTML snippet: 
      <html>
  <head>
    <title>My Page</title>
  </head>
  <body>
    <h2>Hello World</h3>
  </body>
</html>
      medium

      Solution

      1. Step 1: Check tag pairs

        The <h2> tag opens but closes with </h3>, which is a mismatch.

      2. Step 2: Verify other tags

        <title> is correctly inside <head>, <body> and <html> tags are properly closed.

      3. Final Answer:

        The closing tag for <h2> is incorrect; it should be </h2> -> Option C

      4. Quick Check:

        Matching tags must open and close the same [OK]
      Hint: Opening and closing tags must match exactly [OK]
      Common Mistakes:
      • Ignoring mismatched heading tags
      • Thinking <title> can be outside <head>
      • Overlooking missing or extra closing tags
      5. You want to create a web page with a navigation bar, a main content section, and a footer. Which HTML5 semantic tags should you use to organize these parts?
      hard

      Solution

      1. Step 1: Identify semantic tags for page parts

        <nav> is for navigation menus, <main> is for main content, <footer> is for footer area.

      2. Step 2: Eliminate incorrect tags

        <header> is for page header, <aside> is for side content, <menu> and <content> are not standard semantic tags for these parts.

      3. Final Answer:

        <nav> for navigation, <main> for main content, <footer> for footer -> Option D

      4. Quick Check:

        Use semantic tags for clear page structure [OK]
      Hint: Use nav, main, footer tags for page sections [OK]
      Common Mistakes:
      • Using non-semantic tags like <div> only
      • Confusing header with navigation
      • Using invalid tags like <bottom>