ナビゲーション用のHTMLボタンとハイパーリンク
全体的なサイトスタイルガイドを作成するときに、ボタンまたはハイパーリンクをナビゲーション以外の目的で使用するタイミングをどのように決定しますか？
JQueryとAJAXを多用することで、ハイパーリンクは単なるナビゲーション以上のことをすることがよくあります。ナビゲーション以外に使用するのは悪い設計ですか？
一般に、ユーザーはリンクへのリンクとコマンドボタンへのコマンドを期待しています。つまり、リンクはナビゲートし、基礎となるデータオブジェクトまたはそれらの関係や位置を変更せずに新しいコンテンツを提示します。ボタンはこれらを変更し、作成、削除、関連付け、変換、複製などを実行します。簡単な経験則は、コントロールの最も簡潔なキャプションが名詞（たとえば、ホーム、製品、サイトマップ）である場合に使用します。リンク。キャプションが動詞（例：更新、送信、削除、購入）の場合は、ボタンを使用します。
ただし、最近ではさまざまなWebサイトでコマンドボタンの代わりにリンクが使用されており、一部のスタイルガイドでもこれを支持しています。実際、リンクは他のほぼすべてのコントロール（ラジオボタン、タブ、チェックボックスなど）の代わりに使用されています。さらに、シッククライアントデスクトップアプリでは、ボタンが移動する可能性があります。特に、Web（およびリンク）が一般的に使用される前に作成された古いアプリの場合は特にそうです。これはユーザーを混乱させると思いますが、実際には、機能ごとに異なる外観のコントロールを使用する必要があります。 Webアプリとデスクトップアプリの両方で、リンクとボタンをそれぞれ使用して、ナビゲーションとコマンドを明確に区別する必要があります。ナビゲートは、コマンドとは大きく異なります。
ユーザーは、[戻る]をクリックするか、ウィンドウを閉じると、ナビゲーションを簡単に元に戻すことができます。それは常に「安全な」行動です。コマンドは、Webアプリで頻繁に元に戻すことはできません。コマンドを元に戻すことができる場合は、元に戻す機能を使用します。この機能には、戻るや閉じるとは異なるユーザー応答が含まれます。
デスクトップアプリでは、ユーザーはナビゲート後に保存する必要はありません。コマンドの後で保存が頻繁に必要になります。
コマンドは、ナビゲーションよりも微妙なフィードバックを提供します。一般に、ユーザーに新しいコンテンツが表示されたときに明らかになります。コマンドはコンテンツの変更を表示する場合がありますが、多くの場合、変更は明らかではありません（たとえば、コピーまたは保存）。多くの場合、Webアプリは確認ページを使用します（私の本ではナビゲーションとしてカウントされません）。
これらの理由により、ユーザーがナビゲーションとコマンドを明確に制御できるようになり、幸い、ボタンとリンクに対するユーザーの期待がこれを容易にします。ただし、コマンドのリンク（およびナビゲーションのボタン）を継続して使用すると、これらの期待が損なわれ、まもなくこの機会が失われます。
グラフィックで区別されるナビゲーションとコマンドは、ユーザーと通信する強力な方法を提供します。たとえば、「お問い合わせ」がリンクの場合、住所と電話番号のリストが表示されます（「お問い合わせ」は非常に一般的な慣習なので、「連絡先」というより簡潔な「連絡先」というラベルを付けます）。特にメニューで）。対照的に、「お問い合わせ」がボタンの場合、ユーザーは質問やコメントを直接送信できるフォームに移動します（ボタンのキャプションには、コマンドにさらに情報が必要であることを示す省略記号が必要です）。
コマンドボタンはリンクよりも大きく、醜い傾向があることに同意します。特に、同じウィンドウに多くのコマンドボタンを配置する必要がある場合、これは、オブジェクト選択アクションインターフェイスまたはプルダウンコマンドメニューがないWebアプリでは一般的です。 。ただし、解決策は、適切なコントロールの軽量バージョンを開発することであり、ユーザーの期待がまったく異なる別のコントロールを採用するのではありません。このような軽量のコントロールは技術的にはリンクである場合がありますが、真似しているコントロールのように見えるはずです。たとえば、軽量の「ボタン」は、中央揃えのキャプションが付いた、影付きの小さな長方形のリンクされた画像にすることができます。
ナビゲーション/コマンドの区別には灰色の領域があり、これを整理する必要があります。適切な調査を実施できるようになるまで、次のことをお勧めします。
リンクを使用する：
コンテンツのページをロードする
動的に生成されたコンテンツの読み込み。
その他のオプション（タブなど）がない場合は、ページの一部にコンテンツをロードします。
ウィザードのページ間を移動する（ボタンを使用する従来のデスクトップウィザードとは対照的）。
コマンドボタンを使用する：
基になるコンテンツまたはデータオブジェクトを変更または適用するアクション。
他に選択肢がない場合にコンテンツの表示に影響を与えるアクション。
ウィザードの終了アクションを含む、ダイアログのコマンドの実行。
ダイアログをキャンセルすると、キャンセルするとダイアログのパラメーターがデフォルト値または以前の値にリセットされます。
キャプションの最後に省略記号が付いたコマンドボタンを使用して、ダイアログにアクセスします。
さらに詳しく、信じられるなら http://www.zuschlogin.com/?p=18 で。
一般的に言って、リンクのように見える場合、別のURLからコンテンツの新しいページをロードすることを期待しています。それが明らかである限り、それは現在のドキュメント（つまり、href = "＃fragment"）内の私のフォーカスを変更することがあります。
標準ボタンのように見える場合（つまり、私のOSの標準ボタンと同じ）、同じ効果があると期待しますが、入力した情報の一部が結果のページに影響するという副作用があります。
私の意見では、他の大幅に異なる動作は、主にスタイリングを通じて通知する必要があります。それが純粋主義者の見方です。実用的な観点からは、ユーザーがリンクのようなものをクリックすると、別のURLに移動するのではなく、ページの一部が何らかの形で変化する（「コメントの追加」リンクがこのサイトは良い例です）、ユーザーは結果として多くを失うことになります。
このサイトには非常に多くの異なるリンクスタイル/動作（私は少なくとも8つを数えます）がありますが、メインのオーディエンスは非常にWebに精通している可能性が高いため、それほど問題にはなりません。
Webは、ドキュメントをナビゲートするためにハイパーリンクのみが使用される静的なHTMLページのコレクション以上のものになっています。ハイパーリンクを使用してコマンドを実行するのは悪い設計ではないと思います。クリックできるすべてのボタンを使用する場合、それがナビゲーションではない場合、Webアプリケーションは見苦しく非常に忙しいように見えます。
リンクとボタンの違いに注意する1つの非常に重要なことは、クローラー（Googleのような検索サイトと多くのサイトレベルの検索エンジンの両方）がボタンのターゲットに移動しないことです。リンクをたどるだけです。