デザイン

デザイン

【知らなかったでは済まされない!?】よくある10のHTMLエンティティの使用誤り

LINE25

Line25 was built in March 2009 as a place to share web design ideas and inspiration through articles, tutorials and examples of stunning site designs.

本記事は、10 HTML Entity Crimes You Really Shouldn’t Commit
翻訳・再構成したものです。
配信元または著者の許可を得て配信しています。

368 views

読了時間 : 約3分49秒

私がHTMLにおけるタグや利用における注意事項に関するの投稿を始めてから2年以上が経過しましたが、どちらもこのLine25で最も読まれている記事となっています。これら関連記事(タイトル)には見過ごすことのできない何かがあると言わざるを得ません!今回は、あなたもつい犯してしまうHTMLコンテンツ関連の10の誤りについて見ていきましょう。これらは何もあなたに終身刑を言い渡すものではありませんが、おそらく私達一人一人がこれら些細な誤りのうちの少なくとも一つにおいて身に覚えがあるのでは?確信しています。

 

 

誤り1:アンパサンド(&)の変換忘れ

 

 

 

 

最も一般的なHTML検証エラーの1つは、コードチェックするときに表示される未変換のアンパサンド(&)です。外部ドキュメントからコンテンツを貼り付けたあと、自環境に適したHTMLエンティティ(&)に変換するのを忘れてしまいがち)です。

 

 

誤り2:独自の省略記号を作っていませんか?

 

 

3つの点々で文中の休止を示す記号「ellipsis」と呼ぶのをご存じでしたか?実際は3つのピリオドや句点(。)で入力するのではなく、… というHTMLエンティティとしての独自の表現方法があります。このエンティティ内のドット間の間隔は、3つの句点やピリオドで表現する場合に比べてはるかに狭いです。本来使用すべきは3つの点々(特定の状況では4点)だけであって、5つも6つも点々を使わないように気をつけましょう。

 

 

誤り3:全角ダッシュの使用ミス

 

 

 

 

私自身が間違いなくこの誤りを経験しています。Enダッシュ(半角ダッシュ)を使ってEmダッシュ(全角ダッシュ)を使用したことは決して思い出したくありません。なお悪いことに、私は古いハイフンを使用する傾向があり、このことが過ちをより深刻にするのです。Emダッシュ(全角ダッシュ)またはHTMLエンティティ形式では — は、通常文章内で思考の区切りを示すために使用される記号です。

 

 

誤り4:半角ダッシュの使用ミス

 

 

 

 

先ほどのEmダッシュ(全角ダッシュ)における誤りと同様に、Enダッシュ(半角ダッシュ)は宣伝文句においてよく誤用される別のタイプのダッシュです。EnダッシュまたはHTMLエンティティ形式では – は、ある範囲の値や距離を表現するために使用されます。Enダッシュは年齢幅や2つの場所の間の移動を示す際に用いられる「to(の間)」の意味合いを持ちます。

 

 

誤り5:DIY著作権マーク

 

 

 

 

著作権マークと言えば、国際的な著作権のシンボルとして使用されている「C」の周りを円で囲んでいるマーク(©)が馴染み深いことでしょう。しかしながらこの標準化されたマークではなく、おそらくキーボードで表示することが出来なかったためか、(c)など独自の構造が使用されていることがあります。ありがたいことにWebデザイナーにとってHTMLエンティティ形式も非常に覚えやすいもの(©)です。

 

 

誤り6:DIY商標マーク

 

 

 

先ほどの著作権マーク同様、商標マーク(™)にも独自のHTMLエンティティ形式の表現方法(&trade;)があります。<sup(上付き文字)>や<span(インライン)>タグを用いて自分自身で設計する必要はないのです

 

 

誤り7:分数記号の使い方

 

 

 

 

宣伝文句などにおいてもう一つ毎日のように見られるのは、ハーフ・フラクションと呼ばれる分数記号を使用して、四分の一や二分の一、四分の三などを短く表現する方法です。本来は¼、½、¾とし、HTMLエンティティ形式では&frac14;、&frac12;&frac34;とすべきですが、1/4、1/2または3/4と表記されることが多いです。

 

 

誤り8:数式記号

 

 

 

 

加算、減算、乗算、除算などにおける一般的な数式記号もよく誤用されます。加算のプラス記号や減算のマイナス記号は、キーボードボタンで比較的簡単に表示することができますが、乗算や除算の記号は往々にして、xや*や/が使用されます。しかし、×や÷の記号は実はHTMLエンティティ形式(&times;, &divide;)で簡単に作成することができます。

 

誤り9:サイズの大きな 度 の記号

 

 

 

 

 

度を表す記号は、そこまで日常的な標識・記号ではありませんが、気温や角度、または経度/緯度など地図情報について話すときには必要となります。よく、古いアルファベットの「o」で代用されているシーンをよく見かけますが、本来はHTMLエンティティの &deg を使用して、45° のように正確に示すべきなのです。

 

 

 

誤り10:引用符の使用

 

 

 

おそらく地球上で最も多いタイプミスは、テキストコンテンツにおける誤った引用符の使用です。キーボードで入力できる一般的な引用符は、本来は5 ’10 “などの測定関連の単位を示すものです。人に対して引用符を使用する場合は、カーリー引用符をして使用する必要があるのです。エンティティ形式 &ldquo, &rdquo を用いて表記するのです。”今私は、Skeletorで、宇宙のマスターだ”。

 

 

HTMLエンティティ名 VS エンティティ番号

 

 

全てのHTMLエンティティは、その名前(&copy;)または数値(&#169;)として書き表すことができます。名前を使用する利点は、その名前が実際のエンティティと似通っている(コピー copy = コピーライト copyright)ので推測可能であるということです。しかし、名前版は番号版のようにあらゆる環境においてサポートされていない点にも注意が必要です。

おすすめ新着記事

おすすめタグ