廃止されたタグを使うのはやめよう

HTML5で廃止されたタグでも述べたとおり、廃止されたタグは使用をやめるべきなのですが、その為にはHTML5で使用できるタグなどを使った形に書き換える必要があります。

今回は、HTML5で廃止されたタグのうち、<acronym><big><center><dir><strike><tt>について、HTML5に対応した形に置き換える方法について紹介いたします。

なお、<font>の置き換えにつきましては廃止されたfontタグを置き換える方法をご確認ください。

廃止されたタグを置き換える方法

今回紹介するタグの大部分は、置き換えるのに主に以下の2つの方法があります。

  1. <span style="~">のように、タグで指定していた内容をstyleで指定する方法。
  2. <span class="sample">のようにclass付けて.sample { ~ }のようにcssで指定する方法。

1の方は記述が少なくて済むという利点があり、一方2の方は他にもその内容を使っているところがあれば、そこに同じclassをつければそちらも指定できるという利点があります。状況に応じて使い分けてください。

<acronym>を置き換える方法

頭字語を表す<acronym>は、<abbr>に置き換えます。

<big>を置き換える方法

文字を大きくする<big>を置き換えるには、以下のようになります。

  1. <span style="font-size: ~;">
  2. <span class="sample">
    ※cssの記載
    .sample { font-size: ~; }

<big>の働きをそのまま置き換えるには「font-size:larger」とすれば良いですが、場合によってはpxや%で指定した方が良い場合もあります。詳しくはfont-sizeで文字の大きさを指定する方法についてもご確認ください。

<center>を置き換える方法

文字や画像を中心に配置する<center>を置き換えるには、以下のようになります。

  1. <span style="text-align: center;">
  2. <span class="sample">
    ※cssの記載
    .sample { text-align: center; }

<dir>を置き換える方法

リストを表示する<dir>は、<ul>に置き換えます。

<strike>を置き換える方法

打ち消し線を引く<strike>を置き換えるには、以下のようになります。

  • 打ち消し線を引く箇所が、削除された内容を示す場合
    • <del>
  • 打ち消し線を引く箇所が、上記以外の場合
    1. <span style="text-decoration: line-through;">
    2. <span class="sample">
      ※cssの記載
      .sample { text-decoration: line-through; }

置き換える場所に応じて判断し、使い分けてください。

<tt>を置き換える方法

文字を等幅フォントにする<tt>を置き換えるには、以下のようになります。

  1. <span style="font-family: monospace;">
  2. <span class="sample">
    ※cssの記載
    .sample { font-family: monospace; }

まとめ

以上、<acronym><big><center><dir><strike><tt>をHTML5に対応した形に置き換える方法についてご紹介させていただきました。

HTML5で廃止となったタグは、現在は使えても、いつまで使えるかという保証がないため、HTML5に対応した形に置き換える必要があります。皆さんも今一度、廃止になったタグを使っていないか確認してみた方がよいでしょう。





おすすめの記事