プログレッシブエンハンスメントとグレースフルデグラデーションの違いは何ですか

以前、いくつかの CSS3 エフェクトのデモを見ていたとき、CSS3 の属性を記述するとき、トランジション属性を前に置くものと後ろに置くものなど、互換性を記述する順序が異なることがわかりました。個人的な習慣や強迫行為>"<、次の 2 つが含まれる場合もあります:

.transition{
-webkit-transition: all .5s;
-moz-transition: all .5s;
- o- -o-トランジション: すべて .5 秒。 -moz-transition: すべての .5 秒。 -webkit-transition: すべての .5s; }

接頭辞の配置は、単にすっきりさせるためのものでしょうか (それともブラウザの好みを表しているのでしょうか)?ただし、トランジションが前に配置されるか後ろに配置されるかによって、グレースフル デグラデーションとプログレッシブ エンハンスメントという 2 つの概念が導入されます。

エレガントデグラデーションとプログレッシブエンハンスメントは、CSS3 で登場した概念です。低レベルのブラウザは CSS3 をサポートしていませんが、CSS3 の効果はあまりにも優れているため、CSS3 は高度なブラウジングに使用され、低レベルのブラウザは最も基本的な機能のみを保証します。一見すると、この 2 つの概念は似ていますが、どちらも異なるブラウザーでの異なるエクスペリエンスに焦点を当てています。主な違いは、焦点を当てているコンテンツと、その違いによって生じるワークフローの違いです。

プログレッシブエンハンスメントとグレースフルデグラデーションとは何ですか?

段階的な強化: 最も基本的な機能を確保するために低バージョンのブラウザー用のページを構築し、その後、エフェクトやインタラクションを改善し、高度なブラウザー用の追加機能を追加して、より良いユーザー エクスペリエンスを実現します。

グレースフル デグラデーション: 完全な機能を最初から構築し、それから下位バージョンのブラウザーと互換性を持たせます。

違い: グレースフル デグラデーションは複雑な現状から始まり、ユーザー エクスペリエンスの供給を減らそうとしますが、プログレッシブ エンハンスメントは非常に基本的な機能するバージョンから始まり、将来の環境のニーズに適応するために拡張し続けます。劣化（機能の衰退）は過去を振り返ることを意味し、漸進的な強化は根を安全地帯に保ちながら前を向くことを意味します。

「グレースフル デグラデーション」ビュー

「グレースフル デグラデーション」ビューは、Web サイトは最も高度で完全なブラウザー向けに設計されるべきであると信じています。 「古い」とみなされるブラウザ、または機能が欠けているブラウザのテストを開発サイクルの最終段階で手配し、テスト対象を主流ブラウザ (IE、Mozilla など) の以前のバージョンに限定します。

この設計パラダイムでは、古いブラウザーは「貧弱だがまあまあ」のブラウジング エクスペリエンスしか提供しないと考えられます。特定のブラウザに合わせて、いくつかの小さな調整を行うことができます。ただし、それらは私たちの注意の焦点では​​ないため、大きなバグの修正を除いて、その他の違いは無視されます。

「プログレッシブ・エンハンスメント」の視点

「プログレッシブ・エンハンスメント」の視点では、コンテンツ自体に焦点を当てる必要があると考えています。

ウェブサイトを構築する動機となるのはコンテンツです。表示する Web サイト、収集する Web サイト、検索する Web サイト、運営する Web サイト、これらすべてを含む Web サイトもありますが、コンテンツが含まれることは同じです。これにより、「プログレッシブ エンハンスメント」がより合理的な設計パラダイムになります。だからこそ、これは Yahoo! によってすぐに採用され、「段階的ブラウザ サポート」戦略の構築に使用されました。

以上がプログレッシブエンハンスメントとグレースフルデグラデーションの違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。