HTML5でドキュメントやセクションのフッターを作成する方法を解説
HTML5では、<footer>タグを使用することで、ドキュメント全体または個々のセクションに対するフッターを簡単に定義できます。フッターには通常、著作権情報、作者名、連絡先へのリンク、関連ページへのナビゲーションなどを記述します。
<footer>タグの基本的な使い方
次のコードは、<footer>タグを実装したシンプルな例です。実際にブラウザで実行して、表示を確認してみてください。
サンプルコード
<!DOCTYPE html>
<html>
<head>
<title>HTML Footer Tag</title>
</head>
<body>
<header>
<h1>Simply Easy Learning</h1>
<p>You're visiting tutorialspoint.com - tutorial hub for simply easy learning.</p>
</header>
<footer>
© Copyright 2018, All Rights Reserved
</footer>
</body>
</html>
<footer>タグを使う際のポイント
- 複数のフッターを配置できる:1つのページ内に複数の
<footer>要素を設置できます。たとえば、各記事セクションの末尾に個別のフッターを置き、ページ全体の最下部にもう1つ配置するといった使い方が可能です。 - セマンティックな構造化:フッター内で
<address>タグや<nav>タグを組み合わせると、連絡先情報やナビゲーションを意味的に整理でき、SEOやアクセシビリティの面でも有利になります。 - 配置場所は自由:
<footer>は必ずしもページの最下部に置く必要はありません。セクションや記事の末尾に配置することもできます。
このように<footer>タグを活用することで、文書構造が明確になり、メンテナンス性の高いHTMLを作成できます。
-
HTMLで参考文献(Bibliography)を作成する方法
参考文献(Bibliography)とは、執筆時に参照した書籍や資料の一覧をまとめて記載するセクションのことです。HTMLを使えば、こうした参考文献リストを簡単に作成できます。具体的には、<ol>タグで書籍を番号付きリストとして列挙し、<cite>タグで作品のタイトルをマークアップします。 <cite>タグは、書籍のタイトルだけでなく、楽曲、絵画、映画など、さまざまな作品のタイトルを示す際にも使用できます。このタグは「引用」を意味しており、タグ内に記述した内容はすべて作品のタイトルとして扱われます。 サンプルコード それでは、実際にHTMLで参考文献リスト
-
Macの「メール」アプリでHTML署名を作成する方法
HTML署名を使えば、太字や斜体などの文字装飾、SNSやウェブサイトへのハイパーリンク、さまざまなフォントサイズを組み合わせた、リッチで洗練された署名をすべての送信メールに自動的に添付できます。しかし、Macの標準「メール」アプリには、こうした装飾付きのHTML署名を直接作成する機能が用意されていません。とはいえ、ちょっとしたテクニックを使えば、「メール」アプリでもHTML署名を設定することが可能です。この記事では、新規メッセージ作成画面で署名を作り込み、それを環境設定にコピー&ペーストする方法を詳しく解説します。HTML署名の作成手順1. 「メール」アプリを起動するDockにあるLaunch