なぜWordPressは太字がstrongタグ、イタリック体がemタグなのだろうか？
- 公開日 : 2015年8月18日
- カテゴリ : WordPress
通常、WordPressの投稿編集画面は以下のような感じである。
今日問題にするのは以下のボタンである。
このボタンを押すと指定した本文が太字になるわけだが、その際に使用されるタグはstrongタグである。(初期設定の場合)
つまりHTMLとしては以下のようになる。
<strong>この文字列を太字にします</strong>
これに関して、私はWordPressを使い始めた4年ほど前からずっと思っている。
「なぜ太字にするためのタグがstrongタグなのだろうか？」と。
strongタグの本来の意味
HTMLでは本来、strongタグは「強い重要性を表す」という意味合いで使用するものである。
太字であるかどうかはあくまでも見た目の装飾の問題であり、強い重要性があるかどうかとは少し意味合いが異なる。
であるにもかかわらず、WordPressでは上述の太字にするボタンにマウスカーソルを載せると「太字」と表示される。
これはSEOの面で非常に危険な仕様だと思う。(後述)
見た目の装飾として太字にしたいだけなら、本来は以下のようなHTMLにすべきだろう。
<span style="font-weight : bold;">この文字列を太字にします</span>
ちなみにその右横にあるボタンにマウスカーソルを載せると「イタリック」と表示される。(斜体のこと)
しかし、このボタンを押すと以下のようにemタグで囲まれることになるので、これもおかしいと思う。
<em>この文字列を斜体にします</em>
なぜなら、emタグのHTML本来の意味は「強調」を示すものだからだ。(strongより弱めの強調)
斜体にするかどうかとは全く関係がない。
見た目として斜体にしたいだけならHTMLは以下のようにすべきだろう。
<span style="font-style : italic;">この文字列を斜体にします</span>
SEOに強いと言われるWordPressがなぜ今でもこんなおかしな仕様のままなのか、とても不思議である。
実にセマンティックではない。
参考ページ：セマンティック・ウェブ – Wikipedia
strongタグはSEOに悪影響を及ぼす可能性が高い
上で説明したとおり、strongタグは「強い重要性を表す」という意味合いがあるので、かつてGoogleやYahooなどの検索エンジンはstrongタグに囲まれた内容を重要視する傾向があった。(今も多少はあると思う)
しかしその特性を逆手に取り、ページ内のいたるところでstrongタグを使用して検索上位に表示させようとするスパム的手法が蔓延した。
その結果、現在ではstrongタグの乱用はペナルティを受ける要因となっている。(emも同様)
補足：ペナルティを受けると検索順位は大幅に落とされます。
そのような経緯から、現在ではstrongタグやemタグを使うのはリターンよりもリスクのほうが高いと思う。
実際、このブログではstrongタグを最後に使用したのはいつだったか覚えていないぐらい最近は使用していませんが、ちゃんと検索で良い順位が出ております。
クライアントに納品する際にはボタン自体をなくしておくのが無難
Webに携わる人はstrongやemタグがSEO面でのリスクになり得ることを知っているので問題は発生しませんが、一般のクライアントの方は当然そのような知識がないのが普通なので、太字にするためにstrongタグをバンバン乱用することになる。
事前に、
「太字にする。のボタンは使わないでね」
と教えておいたとしても、クライアントの担当者が変わると「そんなこと聞いていない」と言わんばかりにstrongタグを乱用することとなる。
それによってSEOペナルティを受ければ、それまで築き上げてきたSEO評価は台無しである。
というわけで、「太字」と「イタリック」のボタンは最初から削除または非表示にしてしまうのが最も無難だと思われます。
AddQuicktagというプラグインを使用する方法もありますが、function.phpに以下のコードを追記するだけでも可能です。
//ビジュアルエディタボタン削除(1列目)
function tinymce_delete_buttons($array){
$array = array_diff($array, array('bold', 'italic'));
return $array;
}
add_filter('mce_buttons', 'tinymce_delete_buttons');
テキストエディタから「太字」と「イタリック」のボタンを非表示にするには以下のコードをfunction.phpに記述。
//テキストエディタボタン削除
function et_print_styles(){
echo '<style type="text/css">#qt_content_strong,#qt_content_em{ display : none !important; }</style>';
}
add_action('admin_print_styles', 'et_print_styles', 21);
WordPressのこのセマンティックではないおかしな仕様自体を早く修正してくれるといいんですけどね。