「補足」のタグは<small>で決まり

Aviation Assetsに翻訳・掲載している記事の原文には、本文の下に著者の紹介などの補足が付記されている場合が多くあります。また、翻訳に際して、訳者注を付け加えることもありますし、出典や翻訳者名、掲載の承認に関する事項も付け加えています。

これらの補足事項にCSSで本文とは違う書式を設定するため、HTMLのどのタグをつけるかで悩みました。いろいろと試行錯誤しましたが、結論としては<small>で決まりです。

最初は、<p class=”supplement”>というタグを付けましたが、Wordpressのテキスト編集画面での記入が面倒だし、その編集画面上での見栄えが「補足であることを示す」という自分の意図といまいちしっくりきませんでした。

次に、<aside>というタグを使おうとしました。HTMQさんの「HTMLクイックリファレンス」によれば、「<aside>タグは、その部分がウェブページ内における余談・補足情報のセクションであることを示す際に使用します。」（★HTML5タグリファレンス-aside）とあります。しかし、Aviation Assetsの自作テーマでは、すでにサイドバーのタグにこれが使われてしまっていました。

仕方がないので、<H6>にCSSで書式を設定して、しのいでいましたが、相変わらず何か「しっくりこない」状態が続いていました。

先日、ふと思い立って、Aviation Assets のテーマを一般公開されているテーマに変更してみました。結局、そのテーマを使うことはなかったのですが、変更している間に<H6>が見出しとして扱われてしまう（当たり前ですが）ことに問題を感じてしまいました。やはり、タグは、その目的に沿った使い方をしなければ．．．

そこで、あらためてこの部分の見直しを行った際に見つけたのが<small>というタグです。同じく「HTMLクイックリファレンス」によれば、「<small>タグは、免責・警告・法的規制・著作権・ライセンス要件などの注釈や細目を表す際に使用します。」（★HTML5タグリファレンス-small）とあります。また、「small要素は、HTML4.01ではテキストを小さく表示する要素でした。 HTML5では注釈や細目を表す要素となり、これまでとは意味が変更されています。」ともあります。これは、Aviation Assetsの補足を示すのにピッタリのタグではありませんか。

<small>タグであれば、入力も簡単だし、しっくりきます。早速、プラグインの「Search Regex」を使って全投稿記事の<H6>を<small>に置換し、自作テーマの補足に関するPHPやCSSも書き換えました。

ウェブサイトの見た目は、補足のフォントが少し小さくなったくらいで、他には何も以前と変わっていませんが、久しぶりにすっきりした感じです。
「補足」に付けるタグは、<small>で決まりです。