[B! フォーム] i_syhのブックマーク

今どきの入力フォームはこう書く！ HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA

みなさん、入力フォームを制作する際、どのような施策をおこなっていますか？　入力項目を見直したり、入力ステップを明確にしたりなど、入力フォーム最適化をおこなっていると思います。そのことで、コンバージョン率があがったり、ユーザーがストレスを感じないようになるでしょう。入力フォーム最適化はEFO対策 = Entry Form Optimizationとも呼ばれます。サイトの設計段階で検討すべきことが多いですが、コーディングでも考慮すべき事が多々あります。今回はHTMLコーダーがエントリーフォームを制作する際に考慮すべき点について紹介します。 ※本記事では最近のブラウザに適したHTMLコーディング方法の紹介を目的としています。そのため、デザインとアクシビリティーでのベストプラクティスを紹介したものではありませんのでご了承ください。自動入力機能に対応しよう Google Chrome（デスクトッ

i_syh 2016/03/10

リンク

これはすごい! フォーム最適化に役立つグーグル提案のautocomplete新仕様 | 初代編集長ブログ―安田英久

※2012-04-07　セキュリティ面の問題に関して追記しました。今日は、ウェブページの入力フォームでユーザーが楽にしかも正確に入力できるようにできる（可能性を秘めた）、新しいHTMLの仕様についての情報を。autocomplete属性に関する新しい仕様です。グーグルは、入力フォームに自動入力する仕組みに関して、新しい仕様を提案しました。HTMLの仕様を拡張することで、ブラウザでフォームに自動入力する仕組みを使いやすくするものです。これがうまく動作すると、フォーム入力が非常に楽になり、ミスもほぼなくなります。どれぐらいすごいかというと、ちゃんと設定したブラウザを使うと、フォームで3クリックするだけで、一般的な項目が一気に入力されるのです。たとえば、この状態から、名前や住所などの標準的な項目が、一気に自動入力されます。どうでしょう。こうした機能をサイトに設けられたら、フォームの

i_syh 2012/05/18

リンク

申し込みフォーム改善（EFO）をしたいのですが、どのデータを参考にすべきですか？ | 誰もが受けたい！アクセス解析5分クリニック

i_syh 2012/02/28

フォーム

リンク

スタイリッシュなフォームを作るときに見るべきエントリまとめ

Form Design フォームデザインさてさて、最近のwebの入力フォームは本当に凝ってるところが多くて、ただただ関心するばかり。そんなわけで今回は、焦点を『フォーム』に限定し、スタイル抜群なフォームUIを勉強してみたい。流れ的にはインスピレーションデザイン集CSSによるフォームの変更方法JavaScriptによるフォームデザインという感じでお送りいたします。インスピレーションまずは、スタイリッシュなフォーム。これらは、webデザイン全体がフォームデザインとなっているまとめです。まさにバインダー。 webの入力フォームを街頭アンケート用紙のように仕上げたデザイン。かっこいい。くしゃくしゃっとしたような紙の一部にフォームが設置されている。こちらもメモに名前を書くかのごとく。深海に光がさす感じのイメージ。シンプルイズベストなレイアウト設計がなされている。１，２，３，