ホームページを構成するHTML(HyperText Markup Language)は、ウェブページの構造を定義するための標準マークアップ言語です。
HTMLは、テキストコンテンツに「タグ」と呼ばれるマークアップを追加することにより、ウェブブラウザが解釈し表示できる形式にします。
ここでは、ホームページの作成に頻繁に使用される基本的なHTMLタグについて詳しく説明します。
目次
基本的なHTMLタグ
<!DOCTYPE html>
: 文書がHTML5で書かれていることをブラウザに伝えます。<html>
: HTML文書のルート要素です。<head>
: 文書のメタ情報(タイトル、文字セット、スタイルシートのリンクなど)を含む部分です。<title>
: ウェブページのタイトルを指定します。ブラウザのタブに表示されます。<meta>
: 文書に関するメタ情報を定義します。例えば、文字セット(charset="UTF-8"
)を指定することができます。<link>
: 外部リソース(多くの場合、スタイルシート)を文書にリンクします。<script>
: JavaScriptコードを文書に組み込むために使用します。<body>
: ウェブページの内容を含む部分です。
コンテンツを構成するタグ
<h1>
,<h2>
,<h3>
, …<h6>
: 見出しを定義します。<h1>
が最も重要で、<h6>
へ向かうにつれて重要度が下がります。<p>
: 段落を定義します。<a href="URL">
: ハイパーリンクを作成します。href
属性にはリンク先のURLを指定します。<img src="画像のURL" alt="代替テキスト">
: 画像を埋め込みます。src
には画像のURLを、alt
には画像が表示されない場合に表示されるテキストを指定します。<ul>
,<ol>
,<li>
: 箇条書きリスト(<ul>
は番号なし、<ol>
は番号付き)を作成します。リストアイテムは<li>
タグで囲みます。<div>
: コンテンツをブロックとしてグループ化します。CSSでスタイリングする際に便利です。<span>
: コンテンツをインラインでグループ化します。テキストの一部にスタイルを適用する際に使用します。
フォーム関連のタグ
<form>
: ユーザー入力を収集するフォームを作成します。<input>
: 入力フィールドを定義します。type
属性でさまざまなタイプの入力(テキスト、パスワード、チェックボックスなど)を指定できます。<label>
:<input>
要素のラベルを定義します。アクセシビリティを向上させます。<button>
: ボタンを定義します。フォームの送信ボタンや、JavaScriptで使用するための汎用ボタンとして使います。
これらのタグを組み合わせて使用することで、ユーザーに情報を提供し、インタラクションを促すホームページを作成することができます。
HTMLは基本的にウェブページの「骨組み」を構築するためのものであり、CSS(Cascading Style Sheets)を使用してスタイリングを加えることで、見た目を美しく整えることができます。
また、JavaScriptを使用してページに動的な要素や機能を追加することも一般的です。
以上、ホームページのHTMLタグの表示についてでした。
最後までお読みいただき、ありがとうございました。