ホーム

html

html

html とは

HTML（HyperText Markup Language）は、ウェブページを作成するための標準的なマークアップ言語です。HTML は、ウェブページの構造を定義し、テキスト、画像、リンク、フォームなどの要素を配置するために使用されます。

コンテンツの表現

ウェブページは、情報を公開するためにあります。ブラウザで表示し、人が理解できる情報は、文章、図表、音声です。また、文字と図表を適切な順序で配置したり装飾することで、理解を助けることができます。

ブラウザは HTML ファイルを読み込み、HTML で定義した文字や表、図（へのリンク）を解釈してディスプレイに表示します。フォントや図、文章を画面のどこに表示するかは別章の CSS（カスケーディングスタイルシート）で定義できますが、HTML の要素を示すタグで定義した HTML ファイルだけでも画面に表示できます。また、HTML ファイルは比較的人にもコンピュータにも優しいファイル形式です。HTML ファイルはブラウザで表示して人が読むだけでなく、検索エンジンのためのロボットがコンテンツを読み取ります。

html の要素（タグ）とは

次のような Web ページの構造とその構造内のコンテンツ（タイトル、段落、図）を想定します。 webpage

html の要素（タグ）を使ってブラウザが理解できる形式に表すと次のような html になります。 html のタグ（<html>）がトップの階層にあり、head,body が次の階層にあります。body の小要素として header、aside、main、footer があります。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Webページの例</title>
  </head>
  <body>
    <header>
      <h1>ウェブページのタイトル</h1>
      <nav>
        <ul>
          <li><a href="#">ホーム</a></li>
          <li><a href="#">ブログ</a></li>
          <li><a href="#">お問い合わせ</a></li>
        </ul>
      </nav>
    </header>
    <aside>
      <h2>サイドバー</h2>
      <p>サイドバーのコンテンツ</p>
    </aside>
    <main>
      <section>
        <h2>セクション1のタイトル</h2>
        <article>
          <h3>記事のタイトル</h3>
          <p>これは記事の段落です。</p>
          <img src="example.jpg" alt="画像" />
        </article>
      </section>
    </main>
    <footer>
      <p>フッター</p>
    </footer>
  </body>
</html>

ただし、CSS という装飾用の記述がなければ、下記のようにコンテンツのみが上からデフォルトのスタイルでブラウザに表示されます。

Webページの例

ウェブページのタイトル

セクション1のタイトル

記事１のタイトル

これは記事の段落です。

画像

フッター