アイコンになるように意図された要素にネガティブなテキストインデントを適用していますが、それでも今日は良い習慣と考えられていますか？アイコンを作成するために

Question

一般的な方法は、CSSの背景画像と負text-indentを適用することです：

<a class="facebook" href="#">Facebook</a> 

.facebook { 
    display: block; 
    background: url(images/facebook_icon.svg) 50% 50% no-repeat; 
    text-indent: -9999px; 
} 

は、しかし、このまだ考えられて良いでしょうか良く受け入れられた何かが今日あるのでしょうか？

Answer 1

もっと良い方法はフォント恐ろしいアイコンを利用（あるいは、彼らが行うのと同じスキームに従ってください）例えば

http://fontawesome.io/

ことであろう、

<i class="fa fa-camera-retro" title="Take a picture"></i> 

http://fontawesome.io/examples/

が生じるであろうカメラアイコン。あなたはその後、FAのJSプラグインが含まれている場合

​​

http://fontawesome.io/get-started/

FAは、自動的に（テキストインデントを使用せずに）優しいアイコンのスクリーン・リーダーを作り、事前にあなたを提供する（あなたが選ぶオプションに応じて）します

自分自身をホストする必要がないアイコンを作成し、混乱を減らします。彼らは他のすべての後にアイコンをロードするオプションも持っています。つまり、サイトの読み込み時間に影響しません。