ボタンがクリック可能であるとユーザーに確実に認識させるにはどうすればよいですか？

いくつかのリンクを含むページを作成する必要があったので、リンクを大きく装飾的にしようと思いました。

しかし、私はそれがボタンであることを人々が認識していなかったので、彼らは何をクリックすべきか分からないという問題に遭遇しました。このようなものがボタンであることは明らかです。

私の質問は次のとおりです。どうすればボタンを明らかにクリックできるように設計できますか？

これは実際には「グラフィックデザイン」の答えではありませんが、テキストを変更できるかどうかを確認することもできます。あなたの例では、「インストール」ボタンの芸術はあなたのOutlookボタンよりも特にボタンのようには思えません。ただし、その上のテキストはよく知られている動詞であるため、アクションの実行に関連付けられています。同じように、「Launch Outlook」は単に「Outlook」よりも多くのクリックを引き付けるかもしれません。

グラフィックの観点から（そしてjhocking＆luckycypherのコメントに加えて）、他に試してみることができるいくつかのこと：

• ホバーでエッジを光らせる
• ホバー時に背景/境界線の配色を変更する
• ボタンにページから浮き上がって見えるように、微妙なシャドウを追加します（表面のベベルあり、またはなし）。
• テキストの横に小さなアイコンを追加して、実行するアクションを示します（「Outlook」の場合、何をしていますか？）
• 他のボタンが通常サイトに配置される場所にボタンを配置する
• ボタンのテーマをサイトの他のナビゲーションリンク/ボタンと一致させる。

他のUI中心の考えについてUXに質問することもできます。

ここで重要なのはアフォーダンスです。ドアの平らなプレートがプッシュとハンドルがプルと言うように、それと対話する前に、ユーザーが何かを遠くから行動と目的の用途を判断できる視覚的な手がかりです。

私自身のアフォーダンスの例については、こちらをご覧ください。

主な手がかりは、3D感のためとあればエッジやグラデーション塗りつぶしを面取りされている個別のドロップ影のエッジが明確と組み合わせて、あなただけのあなたがそれをプッシュする感じさせるリアル上げ、丸いボタン、指示すると、適切なアクションへの呼び出しをなど適切なラベルおよび/またはよく選択されたアイコン。丸みを帯びた角はよりフレンドリーであり、正方形の角は目に厳しいように見えることに注意してください。

Inkscapeを使用して単純な金属と光沢/ガラス効果ボタンを作成する私のチュートリアルを参照してください。

グラフィックを斜めにして、3次元に見えるようにします。

2種類の画像を使用する必要があります。1つはアクティブで、もう1つは通常の状態です。通常の状態は少しエンボス加工されています。

SSを取り付けて、ボタンのさまざまなステータスを明確にする方法を確認します。

ユーザーがボタンにカーソルを合わせるたびに、リンクのように感じられます。可能であれば、ここをクリックしてインストールすることができます。または、矢印などの助けを借りて、このボタンをポイントすることもできます...

他のユーザーがダウンロード/インストールボタンを表示している方法を確認してください。

これらのチュートリアルに従って、このような見栄えの良いボタンを作成してください

• 光沢のあるダウンロードボタンを作成する
• 魅力的なボタンを作成するために...

ボタンの色と枠線のスタイルは、ボタンの主な問題ではないと思います。大きすぎるかもしれません！ボタンよりもフレーム内の単語/タイトルのように見えます。少し小さくして、内部のテキストが（少なくとも高さについて）埋められるようにしてください。

他の人が言ったように、マウスオーバーでなんとかしてそれを飛び出させることも助けるでしょう。

ボタンのテキストに下線を引いてみませんか（または青色にしてください）。このようにすると、リンクとして認識され、ユーザーはクリックするとどこかに移動することがわかります。