販促格さんチームの林です。いつもよりマシな記事ですよ？
昨日、去年からの疑問の一つだったCSSのテクニックの問題が一つ解決しました。それはテキストをブラウザの外へ出す手法についてGoogleがガイドラインを公開したからです。
これは今後ウェブサイトを作っていく上で大きなメリットになると思います。
‘ホームページ制作’ カテゴリーのアーカイブ
テキストをブラウザの外へ出す手法についてGoogleがガイドライン公開
2009年12月16日 水曜日CSSで画像の表示の善し悪し？
2009年11月25日 水曜日画像をCSSで表示することがいいのか、悪いのか個人的な意見です。
サイトで使われる画像
WEBサイトで使われている画像は主に2つの方法で表示されている場合があります。一つは< img src=”●●” / >というイメージタグを直接HTMLに埋め込むやり方と、CSSによるバックグランドイメージとして表示する方法があります。
時々mixiのコミュニティ等に画像を背景に使うのはWEB標準的に間違っているので使うべきではないという声があります。しかし、中にはSEO的にはimgなんていらない。CSSで表示するべきだし、本来はhtmlはテキストのみを使うので画像を表示するのが間違っているという声もあります。
画像をCSSにするメリット
通常ブラウザはソースの上から順番に読み込んでいくので(Operaは噂ではテキストの後画像を読み込むので超高速)画像が重いとサイトの表示されるまでに時間がかかります。
しかしCSSで背景にすればソース内にはテキストしかないので表示時間を大幅に短縮できます。(へー)
画像をCSSにするデメリット
画像を非表示設定にしている人には画像が表示されなく、テキストも表示されないのでその間が空白等になってしまう。
画像をhtmlに埋め込むメリット
画像を非表示設定にしている人には代替テキストというのが表示されるので『ここに画像がある』というのを表示できます。
画像をhtmlに埋め込むデメリット
画像を大量に使ったりすればページが重くなり表示に時間がかかる。
両方ともメリット・デメリットはありますが、元々htmlにはテキストだけで、色付けや画像等は別ファイルにするというのを考えるとimgタグは別に使う必要性はないと思えます。ただ、そうすると画像を非表示にしている人はみられないので不親切だという声も聞きます。
勝手に出した結論、切り捨て！
ユーザービリティやアクセシビリティーと言われていますが、限度がある。個人的に今がナローバンドでまだインターネットが来始めた時代だというなら画像を非表示設定にしている人の事も考えないといけない気がしますが、インターネットが世の中に広まって十年以上。ナローバンドからブロードバンドになり光回線も関東では爆発的に広がり、地方でもちょっとずつ広がってきているこのご時世、わざわざ画像がデフォルトで表示になっているブラウザ(IE・Safari・火狐・Opera)の設定を変えて画像を非表示設定にする意味がわからない。
そこまで画像を見たくないユーザーは別に見なければいいので、そんな非表示設定している人の事を考える事がありえない。なので個人的にはCSSで画像を表示して、画像非表示ユーザーの事は一切考えない方向でいけばスッキリと解決。
不親切とか関係ない。そこまで見たくないユーザーは見なくて良いし、見たくもない物を見せる方がユーザーに大して失礼だ。