タグ

フォームに関するtacarのブックマーク (5)

  • 入力フォームを更に便利にするjQueryプラグイン5つ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    お疲れさまです、デザイナーのモモコです。 以前こちらの記事「入力フォームをユーザーフレンドリーにする便利なJSプラグイン」でもいくつか紹介させていただきましたが、今回また新たに制作された入力フォームが更に便利になるプラグインを5つほど紹介したいと思います。 flexselect http://rmm5t.github.io/jquery-flexselect/ セレクトボックスの各項目をフレキシブルに表示できるjQueryプラグイン。 選択だけでなく、フォームに文字を入力させることでソートも行えるようになっています。項目数が多い場合に有効活用できそうです。 Multi-Column-Dropdown http://djsmithme.github.io/Multi-Column-Select/ セレクトボックスのUIをボタンで選択する形式に変更し使いやすくするjQueryプラグイン。 一項

    入力フォームを更に便利にするjQueryプラグイン5つ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • スマホサイトのEFO(フォーム最適化)で爆発的成果を出すための5原則 | LPO研究所

    LPO研究所所長の鎌田です。 スマホサイトを用意するのがもはや当たり前になりつつある昨今ですが、スマートフォン対応を急ぐあまり、問合せフォームのユーザビリティがないがしろになってしまっているサイトをよく見かけます。 スマホユーザーの環境は、PCユーザーに比べてあらゆる点でシビアです。いい加減なスマホ対応をしただけでは、そうそうコンバージョンのアップにはつながりません。 下記の事例をご覧ください。 これは、あるブライダル系サービスのPC向け問合せフォームをスマホ最適化したところ、スマートフォンからのコンバージョン率が3倍以上になった事例です。このように、スマホユーザー向けに問合せフォームを最適化するだけでも、コンバージョン率はしっかり上がるのです。 今回は、弊社でスマホ向けフォーム最適化を行う際にいつも心がけている「5つの原則」について、具体例を交えてご紹介します。あなたのスマホ向けフォーム

    スマホサイトのEFO(フォーム最適化)で爆発的成果を出すための5原則 | LPO研究所
  • jQueryプラグイン 50

    少し古いのもありますが、今年見かけたものを中心にフォーム周りでいつか使う機会がありそうだと思ったjQueryプラグインのまとめです。 バリデーションや各フォームエレメントのデザイン変更といったオーソドックスなものから、上手く使えばユーザビリティの向上に繋がりそうなもの、他ではあまり見ないユニークな動きを実装できるものまで様々なタイプがあります。 中にはCSS3を併用したりそのままでは日語に対応していないというものも幾つかあるので、使う際にはブラウザやデバイス環境によっていろいろ確認する必要はあるんですが、いずれも便利なプラグインばかりです。 exValidation プラグイン作者が日の方なので、ひらがなやカタカナといった日語のチェックもできるバリデーションプラグイン。 Validetta シンプルで軽量なバリデーションプラグイン。 jQuery Valideasy 見た目がシンプル

    jQueryプラグイン 50
  • Bootstrapの入力フォームでjQuery Validation Pluginを連携させるサンプル - サラリーマン技術者の調査レポート

    Twitter Bootstrap の入力フォームで jQuery Validation Plugin を簡単に使う方法がわかったので、サンプルコードを載せておきます。 実行結果 実行イメージはこちらで確認できます。 jQuery-Validation-Plugin Bootstrap 連携サンプル 実行結果 サンプルコード jquery.validate.bootstrap3.js を適当にコピーして<script src="...">で取り込んでおけば、入力フォームに対して自動的にValidatorを適用します。 なので、HTMLファイルにJavaScriptを記述する必要はありません。 jQuery-Validation-Plugin Bootstrap 連携サンプル 制限事項 ページ中のすべてのフォームにValidationが適用されます(のハズ) 入力項目(input)は個別に<

    Bootstrapの入力フォームでjQuery Validation Pluginを連携させるサンプル - サラリーマン技術者の調査レポート
  • 使いやすいサイトを目指して!入力フォームの使いやすさを劇的にアップさせるjs厳選4点ご紹介!【DEMO付】 | 株式会社WEB企画

    使いやすいサイトを目指して!入力フォームの使いやすさを劇的にアップさせるjs厳選4点ご紹介!【DEMO付】 シェア つぶやく ブックマーク LINE Pocket 「使いやすいサイト」に必要不可欠なのがお問い合わせフォームの使いやすさじゃないかと思います。そこで今回は、お問い合わせフォームを使いやすくする為のカスタマイズを色々試してみました。 お問い合わせフォーム関連のjsは色々あるのですが、今回は導入してみて個人的に使いやすいなと思ったものを厳選して4つご紹介いたします。全てDEMO付きですので是非チェックしてみてくださいね。それではどうぞ! 1.間違いがあったらアラートを出してくれる!:validetta.js わりと基的な機能ですが、外せないのがこれ。入力フォームに間違いがあった場合、送信時にアラートを出してどこがどう間違ってくれるかを教えてくれます。 この「validetta.j

    使いやすいサイトを目指して!入力フォームの使いやすさを劇的にアップさせるjs厳選4点ご紹介!【DEMO付】 | 株式会社WEB企画
  • 1