web-dev-qa-db-ja.com

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

Progressive EnhancementGraceful Degradationの違いは何なのか混乱しています。私にはそれらは同じもののように見えます。

この2つの違いと、どちらを使用するかを教えてください。

62
zeckdude

それらはほとんど同じものですが、コンテキストが異なります。

「A Grade Browsers」と呼ばれるブラウザのクラスがあります。これらはあなたの訪問者の大部分を(おそらく)構成するあなたの典型的な聴衆メンバーです。これらのユーザーのベースラインから始めます。これをベストモダンプラクティスと呼びます。

enhance FF3.6、Safari 4、またはその他のwhizbang開発者が毎晩Webkitを使用している人のためのエクスペリエンスは、次のような素晴らしいことをしたいと思うでしょう。

  • cSSによる角の丸み
  • シャドウされたテキスト(しかし、神ではなく、多すぎます)
  • 影を落とす(上記の括弧内を参照)

これらはサイトの見栄えを良くしますが、それを壊すことはありません。これはプログレッシブ拡張です。 ベストプラクティスの観点から未来を受け入れる。

一方、あなたのニッチな任天堂サイトはかなりの数のIE5ユーザーを引き付けます。あなたはかわいそうですが、彼らが戻ってき続けることを確認したいと思っています。外部ファイルにajaxスクリプトを含めることにより、あなたのajax動作の代替手段を提供することができ、それらのJSがオンになっていない場合、リンクがページ全体を更新する可能性があります。など最新のベストプラクティスの観点から、特定の歴史的市場が機能的なサイトのいくつかの類似によって提供されていることを確認しています。これは優雅な低下です。

それらはほとんど同じですが、多くの開発チームの優先度の点で異なります。時間がある場合、PEは非常に優れていますが、Gdはしばしば必要です。

86
Alex Mcp

サイトがすべてのブラウザで同じように見えても、たとえば特定のブラウザがダンスポニーをサポートしているためにダンスポニーを取得する場合、それはプログレッシブエンハンスメントです。すべてのブラウザで機能しますが、特定のブラウザは追加の機能を備えています。通常、この用語は、「生のHTML」を超えて使いやすさを向上させる可能性がある特定のJavascript機能に適用されます。

サイトが、CSS3やIE8などを完全にサポートするブラウザーで意図したとおりにしか表示されない場合、角の丸みのない同じページが表示されますが、それは正常な低下です。このサイトは最先端のブラウザ向けに設計されていますが、古いブラウザでも引き続き使用できます。

結局のところ、それらは2つの異なる視点から見て、本当に同じものです。

32
deceze

選択されたbaselineからの方向は、各コンセプトに対して異なります。

グレースフルデグラデーションは、理想的なユーザーエクスペリエンスレベルで始まり、ユーザーエージェントの機能に応じて最小レベルまで低下します。ベースラインで使用される特定の機能をサポートしないエージェントを対象としています。

プログレッシブエンハンスメントは、幅広い最小限のユーザーエクスペリエンスから始まり、ユーザーエージェントの機能に応じてより高いレベルまで増加し、ベースラインよりも高度な機能をサポートするエージェントに対応します。

時間と予算が許せば、両方の概念を採用できると思います。そうでない場合は、優雅な低下が優先されます。

23
Dean Burge

1年以上経ったものを復活させて申し訳ありませんが、この問題に関する自分の意見を少しでも貢献できると感じました。

Alex Mcpと落ち着く方法の両方に同意しますが、「Graceful Degradation」と「Progressive Enhancement」という用語は、私の立場とは少し異なる意味を持っています。

優雅な低下は、(私の意見では)多くの場合、私の経験の最初の場所でひどく構築された後、アプリをサブミットして提出するためのより多くのスティックのようです。誰かが本当にクールなものをユーザーに提供するいくつかの巨大なjavascriptオブジェクトを構築する誰かのように、マネージャーが来て、そのことをテストし、アプリが動作しないという彼らの注意を引くとき、みんなが腕を上げて叫んで走ります35%のブラウザ。 "誰かがこれに対してフォールバックを提供するほうがよい。"

プログレッシブエンハンスメント(ただし、最も基本的な方法を使用して、エントリレベルであらゆる場所で機能する何かを構築することについて、私はより多くのことを考えているようです)ユーザーが必要とするすべての機能を提供します。これは、問題のあるアプリケーションのユーザーエクスペリエンスを実際に向上させるだけでなく、かろうじて使用できるようにするのではなく、すっきりとした目立たないヘルパーやスタイリングなどを使用して追加できます。 "それはクールに見えます。IE6で動作します。そうです。動作します"

ここのトップ2の回答の両方の用語の例としてスタイルを与えると、多分プログレッシブエンハンスメントが本質的に本質的に解決する本当の根本的なユーザビリティの問題を見落としている優雅な低下物事がうまくいかないまで無視します。

Rant over ...

10
BizNuge

グレースフルデグラデーションとは、より新しいブラウザで一定レベルのユーザーエクスペリエンスを提供するようにWeb機能を構築することですが、古いブラウザでのエクスペリエンスのより低いレベルのユーザーにグレースフルグレードで低下します。この下位レベルは、サイト訪問者にとって使いやすいものではありませんが、サイトにアクセスするために訪れた基本的な機能を提供します。物事は彼らのために壊れません。

プログレッシブエンハンスメントも同様ですが、逆のことを行います。まず、すべてのブラウザーがWebサイトのレンダリング時に提供できる基本レベルのユーザーエクスペリエンスを確立しますが、それを使用できるブラウザーで自動的に利用できる、より高度な機能も組み込みます。

言い換えると、段階的な拡張は非常に基本的な実際の例から始まり、将来の環境のための一定の拡張を可能にする一方で、優雅な低下は、現状の複雑さから始まり、より少ないエクスペリエンスを修正しようとします。上品にデグレードすることは後ろを振り返ることを意味し、プログレッシブを強化することは足をしっかりと地面に保ちながら前を向くことを意味します。

8
Nefeli

優雅な分解

グレースフルデグラデーションとは、コンピュータ、マシン、電子システム、またはネットワークが、その大部分が破壊または機能しなくなった場合でも、限られた機能を維持する能力のことです。グレースフルデグラデーションの目的は、壊滅的な障害を防ぐことです。

優雅な低下は1つの解決策です。これは、最新のブラウザで優れたレベルのユーザーエクスペリエンスを提供するように、Webサイトまたはアプリケーションを構築する方法です。ただし、古いブラウザを使用している場合は、正常に機能が低下します。システムはそれほど快適ではないかもしれませんが、基本的な機能は古いシステムで動作します。

簡単な例は、24ビットのアルファ透過PNGの使用です。これらの画像は問題なく最新のブラウザで表示できます。 IE5.5とIE6は画像を表示しますが、透明効果は失敗します(必要に応じて機能させることができます)。 PNGをサポートしていない古いブラウザでは、代替テキストまたは空白スペースが表示されていました。

グレースフルデグラデーションを採用している開発者は、ブラウザのサポートレベルを指定することがよくあります。レベル1ブラウザー(最高のエクスペリエンス)およびレベル2ブラウザー(低下したエクスペリエンス)。

プログレッシブエンハンスメント

プログレッシブエンハンスメントは、アクセシビリティ、セマンティックHTMLマークアップ、および外部スタイルシートとスクリプト技術を強調するWebデザインの戦略です。プログレッシブエンハンスメントは、すべてのブラウザまたはインターネット接続を使用して誰もがWebページの基本的なコンテンツと機能にアクセスできるようにする階層化された方法でWebテクノロジーを使用すると同時に、より高度なブラウザソフトウェアまたはより広い帯域幅を持つユーザーにページの拡張バージョンを提供します。

プログレッシブエンハンスメントは、グレースフルデグラデーションと似たコンセプトですが、逆です。 Webサイトまたはアプリケーションは、ほとんどのブラウザーで基本レベルのユーザーエクスペリエンスを確立します。ブラウザがサポートする場合、より高度な機能が追加されます。

プログレッシブエンハンスメントでは、サポートされているブラウザを選択したり、テーブルベースのレイアウトに戻したりする必要はありません。テクノロジーのレベルを選択します。つまり、ブラウザはHTML 4.01と標準のページ要求/応答をサポートする必要があります。

画像の例に戻ると、アプリケーションがすべてのグラフィカルブラウザーで機能する必要があると判断する場合があります。デフォルトでは低品質のGIF画像を使用できますが、ブラウザがサポートしている場合は、24ビットのPNGに置き換えてください。


リンク集

ウィキペディア: プログレッシブエンハンスメント および Graceful Degradation(Fault_tolerance)

出典: Sitepoint Blog

7
eirenaios

私はそれが態度になりがちであると思います-「大丈夫、私のサイトはリンクスで動作します、ユーザーは自分ができることすべてを実行できます、今いくつかのパナッシュを追加できます」、または「大丈夫、私のサイトは動作します」と言っていますかFirefoxでは、今それを使用したくない人、javascriptをオフにする人などのために修正してみましょう。」