2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです!そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト! フォームの仕様 今回チャレンジするフォームの主な仕様です! グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける(モダンブラウザ) 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ?という人もひとつひとつ記述していけば意外と簡単に作れるはずです!リンクをクリックで各項目にジャンプします。 テキストボック
ビギナーのためのセマンティックでアクセシブルで機能性にも優れたフォームを制作するための習作Nettuts+から紹介します。 20+ HTML Forms Best Practices for Beginners 下記は、その意訳です。 1ステップずつフォームを改善し、アクセシブルで機能性をアップするポイントを紹介します。 セマンティック アクセシビリティ ファンクショナリティ デザイン 結論 セマンティック 1. fieldsetを使用 ユーザーが入力する多くのフィールドがある際、fieldset要素を使用して類似情報をまとめます。 <textarea name="code" class="html" cols="60" rows="5"> <fieldset> <span>Billing Address</span><input type="text" /> <span>City</sp
Personal Info Email Address: Password: Gender: Date of Birth: Preferences Favorite Color: Blue Red Green Interests: News Sports Entertainment Automotive Technology Languages: Comments Message: Upload a File: Sample Button: I Do Nothing Niceforms v.2.0 ©Lucian Slatineanu - Emblematiq Last update: Nov 13 2008
Videos 1 [ 44 ] [ 38 ] [ 221 ] [ 278 ] [ 50 ] [ 198 ] [ 8 ] [ 461 ] [ 165 ] [ 365 ] [ 305 ] [ 133 ] [ 295 ] [ 375 ] [ 210 ] [ 258 ] [ 438 ] [ 297 ] [ 44 ] [ 345 ] [ 497 ] [ 408 ] [ 91 ] [ 374 ] [ 458 ] [ 233 ] [ 368 ] [ 412 ] [ 232 ] [ 265 ] [ 21 ] [ 275 ] [ 302 ] [ 242 ] [ 53 ] [ 352 ] [ 439 ] [ 60 ] [ 312 ] [ 103 ] [ 425 ] [ 117 ] [ 236 ] [ 219 ] [ 491 ] [ 446 ] [ 477 ] [ 429 ] [ 242 ] [ 21 ]
In this article, Colleen Roller will show us that defaults are powerful because they provide a way for users to passively decide, thereby easing the difficulty and effort associated with decision-making. Also, that providing a default option is not always appropriate. Sometimes, it’s better for users to make an explicit choice — especially when they are more likely to follow through with a decisio
Registration forms create a significant barrier for new users to access your product or service. Therefore, they should be designed to be as frictionless as possible in order to reduce user drop-off during signup. This collection of 100+ registration forms offers a wide selection of best practices and creative approaches to registration form UX design. Geckoboard
Previously I put together a showcase of interesting and creative blog comment design. It was a fun exercise and fascinating to see the different approaches taken to the standard comment format. Wildvuur Going through this process, I was also struck by the creativity of the design work that went into some of the comment forms on these sites. As I’ve been traversing the web since, I’ve been noting s
Responsive design is a default these days, but we are all still figuring out just the right process and techniques to better craft responsive websites. That’s why we created a new book — to gather practical techniques and strategies from people who have learned how to get things done right, in actual projects with actual real-world challenges. Neatly packed in a gorgeous hardcover, the book featur
Forms needs a solid visual structure, a profound hierarchy of form elements (Fields and Labels), powerful techniques and Functionality (AJAX) to make the form look and work creatively. There is a great bunch of creative, outstanding and individually designed from scratch forms. Thanks to AJAX, we can provide real-time feedback to our users using server-side validation scripts and eliminate the nee
Niceforms is a non-intrusive javascript method that allows complete customization of web forms » Overview Updates Demo Download Support What is it? Web forms. Everybody knows web forms. Each day we have to fill in some information in a web form, be it a simple login to your webmail application, an online purchase, or signing up for a website. They are the basic, and pretty much the only way of gat
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く