<!DOCTYPE html> <!-- html5宣言 -->
<html lang="ja"> <!-- 日本語のhtml5文書 -->
<head> <!-- htmlのヘッダ宣言 -->
<meta charset="UTF-8"> <!-- 文字化け防止 -->
<!-- スマホなどレスポンシブデザイン用。デバイス幅で表示。等倍表示 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>初めてのHTML5</title> <!-- ブラウザに表示されるタイトル -->
<link rel="stylesheet" href="styles.css"> <!-- 使うcssを指定。relはrelationship(関係性)の略 -->
</head>
<!-- htmlのbody(本体)宣言 -->
<body>
<!-- このページの見出し -->
<header>
<h1>このページのタイトル</h1> <!-- このページのタイトル -->
<nav> <!-- ナビゲーションバー専用タグ。このサイトのリンク -->
<ul> <!-- unorder list (順番号なしリスト)-->
<!-- リンク先をid指定でsectionに移動する。縦長じゃないと意味ない? -->
<li><a href="#home">ホーム</a></li>
<li><a href="#services">サービス</a></li>
<li><a href="#contact">お問い合わせ</a></li>
</ul>
</nav>
</header>
<!-- このページのメインの内容 -->
<main>
<section id="home">
<h2>ホーム</h2>
<p>ホームページの内容</p>
</section>
<section id="services">
<h2>サービス</h2>
<p>提供するサービスの内容</p>
</section>
<section id="contact">
<h2>お問い合わせ</h2>
<p>連絡先を記述</p>
</section>
</main>
<!-- このページのフッタ -->
<footer>
<p>@ 2024 オレオレ株式会社 All rights reserved.</p>
</footer>
</body>
</html>