10

人の好みが知りたい…

私は最近、jQuery に真っ向から取り組んでおり、気に入っています。ただし、多くの (やや些細な) バックエンド (技術: ASP.NET) 関数を小さな jQuery 関数に置き換えていることがわかりました。たとえば、ナビゲーション ボタンをバックエンド コントロールとして割り当て、そのページが表示されたときにそのクラスを変更する (つまり、[about us] ページで [about] ボタンを強調表示する) のではなく、単純に URL を解析して、ボタンへのクラス:

var pathname = window.location.pathname;
if (pathname == "/about/") {
    $("#nav-about").addClass("selected");
}

このような解決策は単純に思えます (単純すぎるかもしれません) が、JavaScript に過度に依存することには常に注意を払っています。他の誰かがこれと同様のことをしていますか? もしそうなら、どのようにこのようなコードを維持していますか? いつでも機能する古き良き信頼できるサーバー コードと、ユーザーが JavaScript をオフにしている場合を除いて、ほぼ常に機能する高速で洗練された洗練された jQuery との間のバランスを取るにはどうすればよいでしょうか?

編集

私は実際にこの特定のインスタンスについて話しているわけではありません... 私はこのような小さな機能強化について話しているのです. jQuery の機能強化に関して、または単にサーバー上で行う場合、どのような線引きをしますか? ありがとう :)

4

10 に答える 10

5

これまでのいくつかのプロジェクトでは、ユーザーの 100% が Javascript を有効にしていることを知るという贅沢がありました。その場合、私は実際に、ナビゲーション サーバー側で現在のページを強調表示しなくて済むようにするために、非常に似たようなことをしました。

ただし、その贅沢がなければ、このようなショートカットは jQuery を使用する限り「プッシュ」していると考えます。大したことではありません」 - それは本当かもしれませんが、特に正当な理由もなく、サーバー側でより堅牢で信頼性の高い方法を回避するという考え方を持つことは大したことです. 実戦でテスト済みのサーバー側ソリューションをクライアントの「より簡単な」コードに置き換えるまでは、自分自身を止めることが重要です。魅力的ではありますが、プロジェクトやユーザーにとって常に最善であるとは限りません。一部のユーザーは JS が無効になっていて、どこにいるのか疑問に思ってナビゲーションを見て、自分が「迷っている」ことに気付くかもしれません。

全体として、これについてはサーバー側のコードに戻すことをお勧めします。ただ捨てる必要はありません。

于 2009-06-15T21:25:36.547 に答える
5

検索エンジンは js を解析しないため、主な問題は検索エンジンにあると感じました。コンテンツ タイプのものは、なくても機能することを常に確認していますが、デザイナーのタッチはほとんど問題ないと思います。

于 2009-06-15T21:26:50.040 に答える
2

いつでも機能する古き良き信頼できるサーバー コードと、ユーザーが JavaScript をオフにしている場合を除いて、ほぼ常に機能する高速で洗練された洗練された jQuery との間のバランスを取るにはどうすればよいでしょうか?

率直に聞こえるかもしれませんが、ユーザーの 5% 未満を支持する (そして辞退する) のは不公平です。それは、ユーザー インターフェイスの悪夢の原因にもなります。

サーバーとクライアントを区別することを忘れないでください。サーバー側のコードはまさにそれです。サーバーに属し、クライアントが最終製品をどのように見るかに影響を与えないコード。クライアントにとって不変であるとだけ言っておきましょう。最終製品の表示は変更可能であり、より詳細なユーザー エクスペリエンスを提供するために、迅速に変更することが推奨される場合があります。

于 2009-06-15T21:59:15.343 に答える
1

私は、動作に関して優雅な劣化を求める傾向があります。システムが機能し、ビジネス要件の観点から提供できる限り、クライアント側でどのように見えるかについてはあまり気にしません。スタイルと色、およびそれらすべての美しいものは、スタイル要素の目的が必要な機能を提供することでない限り、ブラウザーに提供されるテキストにのみ属し、バックエンド コードには属しません(リンクを大胆にするなど)。そのページにいることを示します)。

そうは言っても、私は jQuery を使用するのが大好きであると同時に、非常に短い時間であらゆる種類のクールなクライアント側のおふざけを実行するライセンスを与えてくれるという事実にも気付きました。したがって、私が構築しようとしているのは、堅実なシステム (このナンセンスなスクリプト作成の前の古き良き時代のように :) であり、想定どおりのことを行うシステムです。それを達成したので、肩 (および実際の担当者) をさらに軽くたたくために、jQuery を使用して、妥協のない方法でユーザー エクスペリエンス全体を向上させます。簡単な例を提供するには:

<a class="pageNo" href="/?p={$pageNo}">{$pageNo}</a>

はページ リンクです。これをクリックすると、一部の結果が div に読み込まれます。実装は次のようになります。

jQuery('.pageNumber').click(function(e) {

            //stop the link from firing
            e.preventDefault();

            //steal the page number from the tag
            var pageNo = jQuery(this).text();

            //assign it to a hidden field
            jQuery('#pageNo').val(pageNo);

            //use $.load to fill up a div with the results
            loadPage(pageNo);


        });

リンクは、 のようなサーバー上のリソースを指していますwww.random.com/things/?p=2。jQuery の$.load関数はこのページを取得し、ajaxly に div に挿入します。Javascript が失敗したり、利用できない場合でも、古き良き時代と同じように、リンクは通常どおり起動し、ページが訪問されるため、大したことではありません。さらに、サーバーは XHTTP リクエストと通常のリクエストを区別し、それに応じて応答するように設定されています。この場合、jQuery は、プロジェクトのサービス提供の側面をまったく妥協することなく、非常に優れた機能強化を実現しました。

最近では、jQuery を使ってあれやこれやを行う方法について設計していることに気付くことがよくあります。そこでは、一歩後退して、重要なことは実験の直前に行わなければならないことを覚えておかなければなりません。物議を醸す「拡張機能」が展開され始める可能性があります。<sigh>

于 2009-06-15T22:50:30.040 に答える
0

私自身は jQuery が好きですが、アクセシビリティーや機能性に関して心配しなければならない問題があるかもしれません。私は頻繁に Javascript を無効にしたページをテストして、それがその対象ユーザー (公共の端末では Javascript が無効になっていることが多い) で機能することを確認し、Lynx でスクリーン リーダーが私のページをどのように表示するかを調べます。

ここで、さまざまなツールに対してページを確認できます。

http://www.w3.org/WAI/ER/tools/complete

あなたのページが引き続きアクセス可能であることを確認するのに役立ちます。

于 2009-06-15T22:37:07.623 に答える
0

ここには(まだ)コメントを残すことができないので、コメントのようなものですが、これを回答として入力します。(おそらくコメントには収まりませんが!)

あなたが元の投稿で示した例については、(そして、あなたがこの特定の意味ではなく一般的な意味からより多くを求めていると言ったことを私は知っています。それが私が一般的な解決策で答えている理由です)私はこれを行うことを好みます「navハイライト」をピュアCSSで。

たとえば、次のような「about」ページを作成できます。

<body class="about-section">
  <h1>This is a page in our About section!</h1>
  ...
  <ul id="nav">
    <li id="nav-home"><a href="/">Home</a></li>
    <li id="nav-whatever"><a href="/whatever/">Whatever</a></li>
    <li id="nav-about"><a href="/about/">About</a></li>
  </ul>
</body>

そしてあなたのスタイルシート:

    #ナビ {
      色:#00F;
    }
    body.home #nav-home a,
    body.whatever-section #nav-whatever a,
    body.about-section #nav-about a {
      色:#F00;
    }

ページの追加と維持は、1 つの CSS 宣言によって処理されます。JavaScript もサーバー側プログラミングも必要ありません。body クラス (または他の識別子) と、スタイルを変えたいアイテムを組み合わせるだけです。

頑張ってください!
-マイク

于 2009-06-15T22:52:23.407 に答える
0

Jason には別のアプローチがあります。コードは JavaScript に似ていますが、サーバーではItsNatを参照してください。現時点では、.Net ではなく Java でのみ動作します :(

この例でわかるように、Web サイトは JavaScript を有効 (Single Page Interface) または無効 (ページベース) で同じソース コードで動作させることができます。

于 2011-01-20T15:56:30.250 に答える