3

私は最近ウェブサイトを構築し、CSS3でクリックを押すボタンを作成することにしました。これはかなりクールです。

しかし、最近のブラウザだけがCSS3ボタンを表示するので、スプライト上でCSS3を使用する正当な理由は本当にありますか？

クライアントが私にこの質問をしました、そして私が考えることができたのはhttpリクエストが少なかったので、ロードはわずかに速くなりました。クライアントの観点から、これはかなりの週の答えであることがわかります。

より良い理由はありますか？

または、スプライトの背景位置を移動したり、グラデーションを変更してホバー/フォーカスにボックスシャドウを追加したりできるフォールバック方法はありますか？

それを書いているだけで、モダナイザーが挑戦するのではないかと思いました...

4

1 に答える 1

5

これは、技術的な質問よりも倫理的でビジネス上の質問ですが、いくつかのポイントを見てみましょう。

まず、クライアントは実装に関するすべての技術的な詳細を知る必要はないと思います。彼/彼女は彼/彼女が知る必要があることを知っているべきであり、それで十分です。

技術者以外の人にとっては、「CSS3、いくつかの新しいHTML5要素、およびJavaScriptの目を見張るような効果でサイトを作成します」と言うべきではありません。「私はあなたのために良いサイトを作ることができます」とだけ言ってください。

彼があなたが何を使っているのか、なぜこれが最善のアプローチだと思うのかについて質問した場合、あなたは利益をもって答えます。

軽量で、互換性の問題が少なく、保守が簡単です。=>クライアントがウェブサイトの読み込みを待つ時間を短縮し、誰もがそれを見ることができ、将来の要件でより少ないコストで済みます。

CSS3は新しい革新的なものではありません。これらのテクノロジーは進化的であることに直面する必要があります。フォールバックルールを含め、以前のすべてのルールが引き続き適用されます。

CSSスプライトはCSS2で作成された手法であるため、一部の古いブラウザー（IE6については不明）を含むすべてのブラウザーで機能するはずです。

グラデーションは新しいです。FF 3.5以降、IE9ベータ版、OperaおよびWebkitブラウザがそれらを表示します。IE8以前はそうではありません。ボックスシャドウのためのいくつかのこと。

これらについては、フォールバックとしていくつかの非常に単純なルールを追加しました。

開発するときは、メインのスタイルシートへのリンクをページのヘッダーに配置し、IEの条件付きコメントを使用してIEのみのスタイルシートとスクリプトをロードします。

このIEのみのスタイルシートでは、少しまともなものにするために必要なハックまたはフォールバックを追加するだけです。それを処理するMSフィルターがあります。私のIE.cssスタイルシートは次のようになります。

.gradient {
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E6E6E6', endColorstr='#fff');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#E6E6E6', endColorstr='#fff')";
}

.boxShadow {
filter: progid:DXImageTransform.Microsoft.Shadow(Color=#666666, direction=135, strength=5);
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Color=#666666, direction=135, strength=5)";
box-shadow: 5px 5px 5px #666
}

IE6、IE7、およびIE8 +を処理するために、これらでもフォールバックルールがあることに注意してください。しかし、それは小さく、より良い表示を保証します。

これに加えて、 http：//24ways.org/2009/ignorance-is-blissを読むことをお勧めします

Modernizrは優れたライブラリですが、本当に必要かどうかを考えてください。スプーンの代わりにブルドーザーを使うのをやめるかもしれません。

于 2010-10-10T15:27:42.273 に答える