49 lines
1.4 KiB
HTML
49 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<link rel="icon" type="image/svg+xml" href="../../../assets/favicon.svg">
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Tech-Magazin | Web Development</title>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Kopfbereich mit Titel und Navigation -->
|
|
<header>
|
|
<h1>Web Dev Journal</h1>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="#news">Aktuelles</a></li>
|
|
<li><a href="#tutorials">Tutorials</a></li>
|
|
<li><a href="#kontakt">Kontakt</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<!-- Hauptinhaltsbereich -->
|
|
<main>
|
|
<article>
|
|
<header>
|
|
<h2>Die Zukunft des semantischen Webs mit HTML5</h2>
|
|
</header>
|
|
<p>Semantische Tags geben dem Inhalt im Web Bedeutung. Screenreader, Browser und Suchmaschinen erfassen Dokumentstrukturen dadurch fehlerfrei und präzise.</p>
|
|
|
|
<section>
|
|
<h3>Vorteile für Accessibility (A11y)</h3>
|
|
<p>Nutzer von Hilfstechnologien wie Screenreadern können mithilfe von Landmarks gezielt von Bereich zu Bereich springen.</p>
|
|
</section>
|
|
</article>
|
|
|
|
<aside>
|
|
<h3>Verwandte Artikel</h3>
|
|
<p>Entdecke auch unseren Guide zu modernem CSS3 Box-Modell und Flexbox.</p>
|
|
</aside>
|
|
</main>
|
|
|
|
<!-- Fußzeile -->
|
|
<footer>
|
|
<p>© 2026 Web Dev Journal. Alle Rechte vorbehalten.</p>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|