Comments on: CSSだけで文字にドロップシャドウをつける方法（あまり良くない方法）

By: とあるWEBクリエイターのblog

とあるWEBクリエイターのblog — Mon, 27 Nov 2006 15:43:03 +0000

javascriptで文字にドロップシャドウをつける方法

SiMPLE*SiMPLEさんのエントリー、CSSだけで文字にドロップシャドウを…

ものの — Mon, 27 Nov 2006 08:37:58 +0000

kosaki さんの言う
text-shadow は 2.1 で廃止されている始末w

Bar — Mon, 27 Nov 2006 03:23:50 +0000

どうでもええやん…。
原理主義者はイヤだなあ…。

nez — Mon, 27 Nov 2006 00:54:17 +0000

これは「CSSだけで」シャドウを付ける方法ではありません。
「HTMLとCSSで」シャドウをつけています。
この方法は、絶対に使ってはいけません。

HTMLとは、文章構造のみを記述すべきものであり、
視覚的表現は全てCSSで行うのが正しい方法です。
影を付ける為だけにタイトルを2回記述するのは
HTMLで視覚表現を記述することとなり、不適切であると言えます。

上記の例は、CSSが無効の環境(携帯もそうです)で閲覧した場合や
或いは検索エンジンのbot、視覚障害者用音声ブラウザ等では
「Lorem IpsumLorem Ipsum」という第一見出しである、
と判断されてしまいます。
ユーザビリティ的にもSEO的にも悪影響のある方法ということです。

繰り返しますが、この方法は、絶対に使ってはいけません。

僭越ながら、HTMLの基本概念の入門として、
こちらをご一読されることをお勧めします。
The Web KANZAKI – ごく簡単なHTMLの説明
 http://www.kanzaki.com/docs/htminfo.html

通りすがり — Sun, 26 Nov 2006 20:59:43 +0000

ちょっと気になったので。

この方法だと、同じコンテンツ（ここでは “Lorem Ipsum” ）を不必要に２度記述してます。見栄えのために文書内容や構造を犠牲にしてますけど、いいんでしょうか？(^ ^;)

ネタ元リソースのコメントでも、

> Nothing new. If you come up with a way that doesn’t
> require you to have the text typed twice and I’ll be
> impressed.

> Cute, and a great example of how NOT to write code.

なんて皮肉が飛び交ってますけど..。

PAMd — Sun, 26 Nov 2006 18:03:42 +0000

それだと、CSS無効化されているとき（検索エンジンとかRSSフィードとか）に、同じ文字列が二つ重なっちゃうんですが。。。
CSSのTipsとしては、well knownのバッドノウハウの一つだと思います。

Sun, 26 Nov 2006 15:10:27 +0000

これやられると、読み上げソフト使っている人間に迷惑をかけます!!

kosaki — Sun, 26 Nov 2006 14:31:36 +0000

これはわりと有名なCSSでやってはいけない例ですよ。
CSS非対応ブラウザで見ると文字が２つ出てきてしまいます。
そういう理由で text-shadow プロパティがCSS2から追加されているわけで・・・・