こんにちは、ユキです。
新卒で大企業のSIerに入社し、現在は大手の業務システムWebアプリケーションを開発しています。
section要素っていつ使うの？
サブコンテンツを作成するために使うよ！
結論からいうと、section要素はメインとは別のサブコンテンツを作成する時に使います。
今回はsection要素についてと使い方について解説していきます。
コーヒーでも飲みながらゆっくり読んでみてください。
スポンサーリンク
１： HTML5について
HTML5とは、HTMLバージョン5のことです。
過去HTMLは少しずつ改訂されていき、2014年にHTML5が発表されました。
みなさんが普段聞いてるHTMLはHTML5と同じ意味です。
ホームページを作るならHTML5といわれるほど、過去のHTML4と比べると格段に機能が多くなりました。
スマホ対応が簡単になったり、アニメーションが作れたりします。
つまりHTML5は、「今まで難しかった処理を簡単にしてくれた」ものというわけです。
２： section要素とは
section要素とは、コンテンツ区分をマークアップする要素です。
記事本文とは別のサブコンテンツを作成するために使われます。
おすすめ記事や関連記事を掲載する時に便利で、ランキングなどもsection要素に記述します、
HTMLで記述した際の見た目は似ている要素であるarticle要素と変わらないので、デザインや動的に動かしたい場合はCSSやJavaScriptを使用しましょう。
似た要素であるarticle要素の詳細は下記の記事を読んでみてください。
article要素の使い方は？HTML5の要素を使いこなそう【HTML編】 ３： section要素の使い方
<section> <h2> 見出し </h2> <p> 本文 </p>
</section>section要素はbody内部で使用します。コンテンツ区分要素の内の一つで、文書のコンテンツを論理的に体系づけます。
section要素を記述する際には必ずh要素の見出しをつけましょう。p要素で囲まれた本文だけだとサブコンテンツとしての意味をなしません。
デザインをしたい場合はsection要素の中にdiv要素を付け足してclass属性やid属性などを付与しましょう。デザイン目的でsection要素を無理やり作ることは避けてください。
まとめ
今回はsection要素についてと使い方について解説しました。
section要素はメインとは別にサブコンテンツを作りたい時に使う要素です。コンテンツ区分には他にもarticle要素やmain要素などがあるので必要に応じて使い分けができるようになりましょう。
これからもユキのIT教室では初心者・未経験者向けのIT情報を発信していくのでよろしくお願いします。
以上、ユキでした！
スポンサーリンク