こんなタグがあったのか！便利なHTML5のタグ

こんにちは、オオイワです。Soichiroではコーディング業務をさせてもらっています。
Soichiroに入社する前、独学でコーディングについて学びましたが業務の中で知らなかったHTMLのタグが出てきたことがあるので、そのことについてブログを書きます。
また今回タグについて調べて、このタグ使わなきゃと思ったものもあったので、そのタグについても書きました。

blockquote

文章を引用する際に使うタグです、下記のものです。

これは引用文です。

クローラーにhtmlの構造を伝えるだけではなく、blockquoteにcssが当てられていて人が見ても引用した文章だということが分かりやすくなっています。
Soichiroは記事コンテンツの制作もしていて、得意分野です。
以前、pタグで引用部分をコーディングして提出したところ、そこはblockquoteを使ってくださいと指摘されました。
当時blockquoteというタグの存在を知らなかったので、「こんなタグあったのか！」と一人ＰＣの前でテンション上がっていました。

sup

supはsuperscriptの略で上付き文字のことです。具体的にいうと、cm³の３の部分のことです。
自分が行った修正はcm3となっているものをcm³にしてくださいという依頼でした。
どうやるんだろうと自分で調べてsupタグにはたどり着いたもののsupタグを使っても相変わらずcm3のまま、先輩コーダーさんに助けを求めるとただ単にリセットcssが当たっているだけでした。

しかしこのようなあまり使わないタグにリセットcssで表示が変わらないようにされていることはよくあるみたいです。
普段使わないタグを使って思い通りの表示にならない時は、リセットcssが当たってないか注意しなければいけないという気付きが得られました。

caption

tableの説明をするタグです。tableとは下記のような表です。

コンテンツの中で分かりやすく伝えるために表をもちいることが多々あります。
表についての説明はcaptionというタグが用意されていました。
上記の例だと、「好きな食べ物」がそれに当たります。
表が何をあらわしているのか、を入れておくとスムーズに理解できるようになるので積極的に入れていうべきです。

まとめ

コンテンツにおいて一番大切なのは内容ですが、今回紹介したhtmlタグの使い方など、外から見えないところもSEOに関わってきます。
仕事全般に言えることですが、そういう細かい気遣いが大切ですよね。
今回調べたタグを業務をしているなかで積極的に使っていこうと思います。