プログレッシブ強化のトリック [終了]
-
18-09-2019 - |
質問
誰にとっても機能する Web サイトをデザインするには真の芸術があり、プログレッシブ エンハンスメントは私にとって事実上信条です...
そこで気になるのですが、ウェブサイトを機能させるためにあなたが使った最高のトリックは何ですか? みんな ブラウザ、OS、JavaScript、フラッシュ、画面解像度、無効なユーザーのアクセシビリティなどは関係ありませんか?
(私は JavaScript やブラウザのトリックについてはよく知っていますが、Flash などについては無知であることを認めます。)
編集:私が実際に話しているのは、JavaScript や Flash がないと機能しない 1% の RIA サイトについての話ではありません。js を使わずに Google ドキュメントを書く方法を尋ねているわけではありません。人々が次のようなサイトで何をしているのか知りたいです できる クールなことをしているが、実際にはやっていない 必要 に。
答えとして私自身のいくつかを提供します...
解決
私は、世界は汚い場所であることをマントラを除いて、マントラを回避しよう。
私はデスクトップ機能の多くは、ウェブの機能によって置き換えられますと思うし、ブラウザで実際のアプリで終わるだろうトリッキーな推移になるだろう。実際のアプリケーションでは、JavaScriptやFlashやSilverlightの、またはJavaやC#またはJavaScriptにコンパイルのObjective-Jを意味します。
私にとって唯一のトリックは有効のアプリを使用して、いくつかの代替コンテンツとそれらを提供することができない人やブラウザを識別されます。
そして、それは、モバイル検出し、適切なコンテンツを提供することを含みます。彼らはフラッシュを多用し、全体のコンピュータのモニターに依存しているので、ちょうどiPhone上でバラバラに多くのウェブサイトがあります。
私は のそれはウェブサイトのウェブサイトのためにJavaScriptを必要とするためにOKだとは思わないが、私はそれがアプリのWeb用にOKだと思います。私は のそれが唯一の960ピクセル幅の広いページを提供するためにOKだとは思いません。私は のそれが唯一のFlash形式に動画を提供するために大丈夫だとは思いません。
他のヒント
私はAjaxベースのサイトで動作するように使う気の利いたトリックのいくつか:
1)ページ全体を書き、それらを「外部のrel =」のようなものに基づいてJavaScriptを無効にし、「hijax」と右のページに移動します、通常のタグを使用して、すべてのリンクます。
2)のJavaScriptが他の動的コンテンツを挿入する代替コンテンツどこでNOSCRIPTタグを追加します。
3)以降のJavascriptをスタイルシートでそれらを隠すのではなく、JavaScriptでDOM負荷で制御する要素を非表示にし、のユーザー以来、JavaScriptを使用してのそれを示すことは、彼らにはJavaScriptを有効にしている場合は、それらを見ることがないだろうオフます。
( Googleアナリティクスのあなたが統計を持っていない場合、またはインストール)と決定し、あなたの統計情報を確認しますユーザーが行っていると、彼らが実際にやっているところます。
例えば。
1。)彼らは何かを見つけることができないため、ユーザーは常に検索を使用していますか?ので、多分あなたはより良い検索作業を行うことができますか?
2。)あなたの404ページには、関連用語を検索するか、試してみて、彼らが探していたものを「推測」するためにいくつかの簡単なオプションを提供していますか?
3。)あなたのサイトは、サイトの意味のある部分への迅速なアクセスを提供し、サイトマップを持っていますか?
4。)他のすべてが失敗した場合、ユーザーは、彼らが必要なものを見つけるのを助けるために/技術サポートをご連絡するための簡単な手段を持っていますか?
あなたが今日を探していたすべてのものを発見した場合は、5。)あなたのサイト上で何かを「売る」場合は必ず、しかし、あなたはすべての主要なレンガのn乳鉢小売店でレジに到達したときに類似していない...彼らはあなたに尋ねます。ユーザーが提案を行うことができますオプションを提供することを検討...多分あなたはアンタップ市場を征服されるのを待っている必要があります。
6。)ユーザビリティなどIE(6,7,8)、サファリ、中にあなたのサイトをサーフィンし、それはどこでもあなたが気に動作することを確認してください。
7。)と呼ばれる偉大な本があります「は私がに考えてはいけない」と現実的なユーザビリティ上の偉大なリソースです。あなたはすでにそれを読んでいない場合は...コピーをつかむ行くます。
また、他のすべてのささいなことがで...例えば世話をしていることを確認あなたはキャッシュを有効に利用すること(JS、CSS、イメージ)
通常、私は、任意のjavascriptをせずにWebサイト全体を書きで何をすべきか。これが機能したら、「それをマークアップ」することができます。
言った、いくつかの良い出発ブロックがあります:
あなたは、あなたのHTMLの先頭付近jumplink対応のメニューがあることを確認します。あなたがわからない場合は、あなたのリンクの下のウェブサイト、または類似のテキストやスピーチベースのブラウザを実行してみてください。あなたがイライラ、もしそうなら、あなたのアクセスユーザーされます。
彼らは意味がある場合にのみ、あなたがあなたのイメージにALTタグを適用することを確認してください。設計の目的のためのみである場合に、画像のALTを=「」与えること合法です。同様に、タイトルを設定=「」Firefoxのユーザーが迷惑お使いのアクセスユーザーせずにホバーツールチップの欲求を満たすされます。
これらの簡単なヒントが助けを願って!アクセシビリティは誰の責任です!
アクセスできるようにすることが困難な場合がプラグインやその他のコンテンツを使用する場合に代替コンテンツを提供するようにしてください。例えば、ページ上のビデオを置きます。あなたはHTML5の道を行くことにした場合:
<video>
<source src="video.ogv" type="video/ogg" /><!-- OGG for Mozilla/Opera -->
<source src="video.mp4" type="video/mp4" /><!-- h.264 for Apple/Google -->
<object><!-- Fall back to Flash/h.264 for older browsers -->
<!-- And in the event the UA can't handle any of those, all you can do is provide a link to the media -->
<p><a href="video.ogv">Download the video</a>.</p>
</object>
</video>
[擬似コードが、あなたのアイデアを得る]
みんながのその特定の問題へのより包括的な解決策については、Kroc Camenのビデオをチェックしてください。
プログレッシブエンハンスメントは複雑ではありません。
次の 3 つの主な懸念事項を考慮してください。
- コンテンツ (HTML)
- プレゼンテーション (CSS)
- 動作 (JS)
コンテンツから始めて、新しい懸念事項が以前の懸念事項を妨げたり、別の懸念事項を模倣したりしないようにしながら、懸念事項を検討していきます。JavaScript はコンテンツを生成すべきではありません。CSS は動作を処理すべきではありません。HTML はプレゼンテーションなどを処理すべきではありません。等
[OK]を、最高のは、常に<のhref =「http://en.wikipedia.org/wiki/Restful」のrelで、フォーマットの多くをサポートするために、あります= "nofollowをnoreferrer"> RESTfulなの道... HTML、XML、JSON、RSS、Atomの(それは理にかなっている)と、なぜ他の人...そうするには、サーバー上のきれいなMVCアーキテクチャを必要とします...まあ、それはMVCである必要はありませんが、レンダリング層がパンとしてダムである必要があり、のは言わせ、その下ランニングよく書かれたビジネスロジック...あなたのフロントエンドコントローラは、に対応して返すために適切なフォーマットを選択してくださいリクエストとそこに行く...あなたの全体のビジネスロジックを一度実装されているなど、改ページを行い、/更新データを取得し、その後、あなただけのHTMLテンプレートにそれをレンダリング、またはJSONに変換、または何を行います..ます。
今アイデアは1つのビューの実装を作るために、だろう、それは堅実、セマンティックとプレーンHTMLを返す...と、ものを作る、それが頻繁にJavaScriptを使用します...別のパスの下でそれらにアクセスできるようにする、となりますJavaScriptのクロールできない作る...あなたにもフラッシュのために同じことを行うことができます...そのサイトのJavaScriptのバージョンへのリダイレクトが発生しますこと、あなたの主なHTMLテンプレートの冒頭ではJavaScriptの1行を入れて...など...そして、アプリケーションの「汚い」バージョンでは、あなたが本当に何も、あなたが好き... HTTP当たりの荷重テンプレート、およびJSONで、データを行うことができ、およびクライアント上でレンダリングを行い、作成します永続ステートフルクライアント側のJavaScriptアプリ...なぜ?
私は個人的に...それはいいと明確なHTMLで始まるよりも、優れている、とJavaScriptのトンに詰め物よりも、それもすべてのユーザーのために動作しません、と思います。
greetz
back2dos