HTML5のarticleタグで1つのコンテンツとしてマークアップする方法

HTML

ページを構成しているパーツの中で、コンテンツとして成立している部分は<article>でマークアップすることによって明確にすることができます。

なお、<article>でマークアップしてもブラウザ画面の表示には影響することありません。

articleタグの利用方法

使用するHTMLタグ

<article>コンテンツとして成立している部分をマークアップする
<h2>見出しをマークアップする
<p>段落をマークアップする

マークアップの方法

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ヘッダーとフッターのサンプルコード</title>
</head>
<body>
<header>
<h1>ちからこぶ</h1>
</header>
<article>
<h2>ちからこぶについて</h2>
<p>プログラマーやシステムエンジニアになりたい、PCについてもっと詳しくなりたい、これからコンピュータについて勉強を始めたいという方を応援するサイトです。ICTのことを中心に様々な情報を発信していきます。</p>
<p>近年急速にIT化が進んでいること、また2020年度から小学校でプログラミング教育が必修化になったことに伴い、初心者の方がICTを気軽に楽しく勉強するのを応援するためにサイトを立ち上げました。</p>
</article>
<footer>
<small>Copyright © ちからこぶ All Rights Reserved.</small>
</footer>
</body>
</html>

実行結果