情報の削除を示す<del>と修正を示す<ins>

世の中の情報は、常に移り変わっています。なので、Webサイトに公開した内容が、古くなってしまうのは当然のことです。ですから、定期的に内容を更新して、最新の情報に書き換えていく必要があります。

そこで、書き換える方法として、<del>と<ins>を使うのをおススメします。せっかく書いたテキストを削除してしまうのは、非常にもったいないことです。del要素を使えば、情報を残したまま削除の意味を与えることができます。

そして、ins要素を使って、新しい情報の追加を示すことが可能です。ブラウザ上でも情報の更新履歴が分かりますから、ちゃんと管理されているサイトだと示すことにもなります。ですから、使い方をマスターしておきましょう。

 

del要素で情報の削除を示す

<del>~</del>で囲むことで、文章の一部を削除した意味にすることができます。<del>はブロックレベル要素でもインライン要素でも使えるので、どこを囲んだとしても削除を示すことが可能です。

<del><p>来週の水曜日は、全品半額セールです。</p></del>

del要素で囲まれた部分は、打ち消し線が表示されます。なので、削除した情報だと一目で分かるようになっていますね。

20141020-1

情報を丸ごと消してしまっても良いですが、情報を残しておくことで更新履歴を示すことができます。閲覧者にも定期的に更新しているイメージを与えることができるので、サイトの信頼度が上がりやすいです。

 
また、「datetime属性」と「cite属性」を追加することができます。datetime属性では、情報を削除した日時を示すことが可能です。「YYYY-MM-DDThh:mm:ssTZD」の形式で、記述するルールとなっています。

そして、cite属性では、削除した理由に関するURLを示すことができます。ただ、どちらの属性を使用しても、ブラウザ上には表示されません。コンピュータに対して情報を伝える目的で使用しますから、覚えておきましょう。

 

ins要素で追加した情報を示す

新しい情報を追加した時は、<ins>~</ins>で囲むようにします。通常、del要素で情報を削除した後に、ins要素で情報を追加するのが一般的です。del要素と同じように、ブロックレベル要素でもインライン要素でも使用できます。

<del><p>来週の水曜日は、全品半額セールです。</p></del>
<ins><p>次回のセールは、来月の5日に開催します。</p></ins>

ins要素でマークアップされると、下線で表示されるようになります。リンクの表示と紛らわしいと感じるなら、CSSでスタイルを変更しましょう。

20141020-2

そして、「datetime属性」と「cite属性」を使うこともできるので、状況に合わせて使用するようにしてください。

 

以上、del要素とins要素について解説をしました。Webサイトでは、情報の鮮度が重要となりますから、常に新しい情報を掲載するようにしましょう。そうすることで、サイトの信頼性が上がって、ユーザビリティの向上につながります。

サブコンテンツ

このページの先頭へ