HTML-Übung: Tags erkennen

Ordnen Sie die Tags aus der folgenden Liste dem untenstehenden HTML-Beispiel zu.
Markieren Sie im HTML-Beispiel alle Attribute farbig.
Skizzieren Sie auf einem Blatt, wie das HTML-Beispiel im Browser aussehen wird.
Speichern Sie das HTML-Beispiel auf Ihren Rechner und laden Sie es in Ihren Browser. Stimmt die anzeige mit Ihrer Skizze überein?

Start-Tag	Beschreibung	Typ
`<a>`	Hyperlink	Inline
`<abbr>`	Abkürzung	Inline
`<aside>`	Seitlicher Bereich	Block
`<b>`	bedeutungstragende Worte	Inline
`<body>`	Inhalt der Webseite	Block
`<br>`	Zeilenumbruch	inline
`<cite>`	Titel von Büchern, Filmen usw.	Inline
`<div>`	Allgemeiner Bereich (division)	Block
`<em>`	betont, emphatisch (gefühlsmässig) betont	Inline
`<footer>`	Fussbereich der Webseite	Block
`<h1>`	grösste Überschrift (heading)	Block
`<h2>`	zweitgrösste Überschrift (heading)	Block
`<h3>`	drittgrösste Überschrift (heading)	Block
`<h4>`	drittkleinste Überschrift (heading)	Block
`<h5>`	zweitkleinste Überschrift (heading)	Block
`<h6>`	kleinste Überschrift (heading)	Block
`<head>`	Meta-Angaben zur Webseite	–
`<header>`	Kopfbereich der Webseite	Block
`<i>`	spezielle Worte, z.B. Fachausdrücke, Eigennamen, anderssprachige Phrasen	Inline
`<img>`	Bild (image)	Inline
`<main>`	Hauptbereich der Webseite	Block
`<nav>`	Navigationsbereich, z.B. für Menüs	Block
`<p>`	Absatz (paragraph)	Block
`<q>`	ein Zitat (quote)	Inline
`<title>`	Titel der Webseite	–

uebung2.html

<!DOCTYPE html>
<html>
   <head>
      <meta charset="UTF-8">
      <title>Beispiel-Webseite (ohne CSS)</title>
   </head>
   <body>
      <nav>
         <a href="seite1.html">Seite 1</a><br>
         <a href="seite2.html">Seite 2</a>
      </nav>
      <header>
         <img src="https://unterricht.kinet.ch/informatik/_media/logo.png" alt="logo"> 
         <h1>Informatik</h1>
      </header>
      <article>
         <h2>Einführung in HTML</h2>
         <p>Wir lernen <b>HTML 5</b> kennen.</p>
         <h3>Ein nützlicher Link</h3>
         <a href="www.sbb.ch">Der <abbr title="Schweizerische Bundesbahnen">SBB</abbr>-Fahrplan</a>
         <q>Der Kluge reist im Zuge.</q>
         <img src="http://www.bahnbilder.de/1024/sbb-lok-re-66-348605.jpg" alt="logo" width="124" height="124">
      </article>
      <footer>
         <p>Gymnasium Kirchenfeld <em>2014</em></p>
      </footer>
   </body>
</html>