ドロップダウンボタンの標準的な動作とそのスタイル

Question

私は、選択と行動を促すフレーズの両方としてのドロップダウンボタンの使用が曖昧であるいくつかのUIデザインパターンを確認しており、さまざまなデザインパターンやそこにある相互作用のモードとどのように関連するかを考えています。

ドロップダウンボタンの基本的なデザインには2つのコンポーネントがあります。左側には、行動を促すフレーズまたはデフォルトのラベルで構成されるラベルがあり、右側には、ドロップダウンメニューまたは選択入力で使用される一般的な下矢印があります。

この問題は、右側が個別の「ボタン」としてスタイル設定されていない場合に発生します。これにより、ボタン全体をクリックしたときに、実際の選択が行動を促すフレーズとして機能する選択操作にデフォルト設定するかどうかを人々が考えるようになります。ただし、これはボタンを分割する目的に反するため、行動を促すフレーズと選択項目を個別に機能させることができます。

特にBootstrapとマテリアルデザイン）の間で、ドロップダウンボタンのスタイルと相互作用/動作に違いがあるかどうか、人々がそれらの実装規則に従うか、または別の「標準」デザインがあるかどうか疑問に思っていますそこにパターン？

Boostrapシングルおよびスプリットボタンドロップダウンコンポーネント： http://getbootstrap.com/components/#btn-dropdowns

Googleマテリアルデザインドロップダウンボタンコンポーネント： https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons

さらに、これは、右側で単一の選択を行うか、複数のセクションを行うかに関係ありますか？ラベルが選択に対応するように変更される可能性がある単一の選択とは異なり、左側のラベルは実際には同じままである可能性があるため、そうなると思います。

Lucas Cerro · Answer

ユースケースを混同している可能性があります。 Bootstrapは応答しやすいかもしれませんが、主にすばやくbootstrappingWebサイトに焦点を当てています。一方、マテリアルデザインはモバイルインタラクションに重点を置いて作成されました。

bootstrapを使用している間doにドロップダウン+行動を促すフレーズのボタンがあるが、マテリアルデザインには2番目一部は行動を促すフレーズですではありません。これは、ズーム値の編集や箇条書きの挿入などのマイナーなアクションです。これはおそらく、モバイルでのドロップダウン+行動を促すフレーズが問題になる可能性があるためです。