[B! form] ikd9684のブックマーク

ikd9684 id:ikd9684

formに関するikd9684のブックマーク (3)

【Tips】ただただフォーム最適化をまとめたチートシート的なもの - Qiita
概要主に「2016年 - 2017年」の記事から引っ張ってきて、ただただ羅列したものです。なので、このまとめ自体の最適化が成されてないですが、そこはご容赦ください… ユーザビリティ・アクセシビリティ分かりやすさ入力項目は必要最低限にする項目名は簡潔で短く分かりやすいものにするできる限り入力フィールドの数は最小限にする一つの項目の入力フィールドを複数に分けない例：姓名、電話番号、郵便番号など必須項目は、「＊」ではなく「必須」と表示するラベルやヒント（○文字以上必要です）をplaceholderに設定しないフォーカスした際に消えてしまうため、入力例を入れてあげる程度にするフォーカスした際の入力フィールドのデザインを変える入力フィールドのサイズは、入力される値に合わせるリアルタイムでチェック出来るバリデーションを実装するエラーメッセージは、上部にすべて表示するのでは
ikd9684 2017/02/04
web

フォーム

form
リンク
[JS]このアイデアは面白い！セレクトボックスの選択肢をすぐに選択できるようにするスクリプト -Quick[select]
フォームのセレクトボックスは多くの選択肢を配置できる便利な要素ですが、他のフォームと操作性が異なるため一連の流れで入力しにくいのが弱点です。セレクトボックスの操作性を改善し、デザインも簡単に変更できるスクリプトを紹介します。Quickの名前の通り、すぐに選択できるようになります。通常のセレクトボックスの挙動セレクトボックスは、タップとクリックの2つのオペレーションがあります。これはフォームの他の要素と操作性が異なり、ユーザーをフォームの一連の流れから外してしまうものです。そこで注目すべき点は、通常セレクトボックスの選択肢の中にはより多く選択されるものがあることです。上記の例だと、「はい」「いいえ」が多いでしょう。 Quick[select]は、セレクトボックスの選択肢の中から、いくつかを表示させておくことができます。
ikd9684 2015/11/09
form

javascript

jQuery

UI
リンク
ラジオボタンをスイッチデザインに変換するjQueryプラグイン
味気ないラジオボタンをスイッチデザインに変換してくれるjQueryプラグインです。それ以上でもそれ以下でも無いのですが・・・。 jQueryプラグインを読み込むだけですぐに変換 jQueryプラグインを読みこめば、ラジオボタンが以下のようになります。サンプルデモは以下に http://ahmad-sa3d.github.io/rcswitcher/ ダウンロードは以下からできます。index.html ファイルのソースを見れば、特に設定などの仕様を読まなくても直ぐにわかるかと思います。 ahmad-sa3d/rcswitcher · GitHub もう少しデザインにこだわりたい人ボタンを手軽に変換出来るjQueryプラグインは他にも結構ありますが、こちらもオススメです。 fronteed/icheck · GitHub 是非お試しあれ。それでは、また。
ikd9684 2015/10/03
jQuery

プラグイン

Form
リンク
1