CSSベースのフォームテンプレート:phpspot開発日誌
A CSS-based Form Template CSSベースのフォームテンプレート。 フォームをデザインするのって結構面倒だったりしますよね。 フォームのテンプレートがあらかじめ容易されていれば、コピペであっという間にフォームが出来そうです。 しかもCSSベースなのでデザイン変更も容易でHTMLも綺麗ということですごく便利です。 次のような綺麗なフォームのテンプレート。 １枚の中にCSSの定義も全部入っていて便利に使えそうです。 関連エントリ セクシーなCSSホバーボタンを作成するチュートリアル DIVを垂直方向に中央寄せするCSSサンプル CSSを使い、１枚の画像だけでカラフルなグラデーション背景を作る例 CSSの小技集、20個
第9回 どうすればユーザー登録してもらえるか：ITpro
この連載では，エンジニアの視点から使いやすさを考えています。今回はユーザー登録画面などに代表される，フォームを使った入力画面について考えてみたいと思います。 なぜこのテーマを選んだかというと，フォームを介して利用者からデータを受け取って処理をして返すという一連の処理が，ウェブサイトのバックエンドの処理やデータ形式などによって変化しやすく，プログラマやエンジニアの作業がもっとも使いやすさと関係しやすい分野ではないかなあ，と思っているからです。こうした部分はエンジニアが使いやすさに寄与しやすい部分であり，もっと言えば，使いやすさを向上させるに当たって，エンジニアにしかできない事柄がたくさんある部分だってことになると思います。 今回は「ユーザー登録ページ」を例に，フォームにおける使い勝手を考えていきたいと思っています。その理由としてまずは，筆者が勤務する株式会社はてなにもユーザー登録画面があり，
ブログのコメント投稿フォームをちょっぴり親切にする
ブログのコメント投稿フォームをちょっぴり親切にする Permalink URL http://www.magicvox.net/archive/2007/01161250/ Posted by ぴろり Posted at 2007/01/16 12:50 Trackbacks 関連記事 (0) Comments コメント (2) Post Comment コメントできます Category ブログのコメント投稿フォームに初期メッセージを設定しておき、入力フォーカスが当たった時点でこれを消すという tips が紹介されています。元ネタである@Style さんのコード で 3 箇所に渡ってハードコーディングされている初期メッセージ周りを少しスマートにしてみました。 初期メッセージにコメント欄で使えるタグの一覧や注意事項を書いておくなどすればユーザビリティの点でも好ましいですね。
入力フォームのユーザビリティ&アクセシビリティ！
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
ブログのコメント部分やコメントフォームのデザインを色々集めたサイト:phpspot開発日誌
Blog Comment Form Design Showcase | Smiley Cat Web Design ブログのコメント部分やコメントフォームのデザインを色々集めたサイト。 いろんなブログのコメント部分やコメントフォーム部分の画像をコレクションしているようです。 コメント部分 コメントフォーム部分 これだけのデザインサンプルがあると、自分がデザインする時に大いに参考に出来そうですね。 形が決まったら後はオリジナリティを加えてデザインを完成させるという方法でデザインすれば効率よくカッコいいコメント部分が作れそうですね。 関連エントリ 2006年を彩った50の超美麗CSSデザインサイト集 ウェブデザインに便利なツールをまとめた「Web Design Tools」
フォームの入力エラーを吹き出しで教えてくれる JavaScript
■ フォームの入力エラーを吹き出しで教えてくれる JavaScript フォームの validation 関連のライブラリはいくつかありますが、私は以下に紹介するやつをずっと使ってまして、これがかなり気に入ってます。ただ、オレナイズされたコードが随所に含まれていたから紹介する事が出来ないでいたのですが、今回やっと書き直したのでお目見えです。 AJAX を使ってサーバサイドと連携、とかそういう事も全くやってなくて、普通に JavaScript のみで入力のチェックをしてるだけなんで、真新しい事はないんですが。 実際の動作サンプル とりあえず submit ボタンを押せば、全て理解出来るかと思います。 今回は CSS のファイルと画像のファイルといっぱい出来てきてしまっていて、いつもの「読み込ませるだけ」とはちょっと毛色も違い、使うのには事前の準備が必要で面倒です。 いつもの JavaScri
CSSでデザインされたテーブルレスでクールなフォームサンプル:phpspot開発日誌
Tableless forms consider this a very important step in learning web design the right and straightforward way. CSS is no longer just a way of adding some simple styles to an element in your page. CSSでデザインされたテーブルレスでクールなフォームサンプル。 次のようなフォームのサンプルがダウンロードできます。 HTMLとCSS、画像がセットになっているので、ちょっと編集していろいろと応用できそう。 ログインの横にアイコンが表示されていると直感的かつ、オシャレなフォームになってますね。デザイン面で参考に出来そうです。 関連エントリ ブログのコメント部分やコメントフォームのデザインを色々集めたサイト
ユーザーの声を拾いあげる効果的な『お問い合わせフォーム』 | ランサーズ社長日記
いいね！ 0 ツイート B! はてブ 36 Pocket 2 ベータサービスはユーザー公開してからが勝負である。ユーザーの声に迅速に答え、最初に投入したコア機能部分にうまく「声」を肉付けしていけば、よりよいサービスへと近づいていく。 しかし、そもそもの【ユーザーの声】自体を拾い上げるのも難しい。そこで、今回は「お問い合わせフォーム」に絞って、非常に簡単だが意外と実践されていないいくつかの、ユーザーの声を拾いあげる効果的な『お問い合わせフォーム』を考える。 問い合わせフォームとその周辺のTIPSをまとめてみました。参考になればと思います。 １．お問い合わせフォームを設ける ２．お問い合わせフォームに不要な項目は付けない ３．すべてのページからお問い合わせフォームへリンクをする ４．お問い合わせをmailtoだけで行わない ５．しかし、mailtoのお問い合わせも用意する ６．問い合わせには必
CodeZine：「超高速、完全自動、しかもフリー」 WebテストツールのGITAK公開（TIBCO, 開発ツール）
TIBCOは、オープンソースのWebサイトテストツール「TIBCO General Interface Test Automation Kit 0.7」（GITAK）を公開した。TIBCO Developer Networkより無償でダウンロードできる。 「TIBCO General Interface Test Automation Kit」は、Webサイトの入力チェック、ボタンの動作内容、JavaScriptの動作などを自動で一気にテストできるツール。すべてのテストがブラウザで完結するのが特徴だ。ダウンロードファイルにはサンプルが含まれているので、試しに動作させてみることができる。 1.GITAKの入手 TIBCO Developer Networkよりファイルをダウンロードし、解凍する。 2.TestRunner.htmlの起動 解凍してできたフォルダから「/gitak/c
第0回 その気になった客を逃さないフォーム設計術 | Web担当者Forum
第0回 その気になった客を逃さないフォーム設計術 現実の店舗や窓口では、目の前にいるお客が困っていればすぐにわかるし、同じトラブルが重なれば問題が起きないように施策をとる。しかし、ウェブサイトを作っているときにはお客は目の前にいないし、公開後にお客の対応をするのはウェブサーバーやスクリプトという機械だ。そのため、現実の商売では当然のように行っている接客ができない、いや忘れてしまってはいないだろうか？ 今木 智隆（株式会社ビービット） ウェブサイトの「ユーザビリティー」という言葉は、当たり前のように耳にする機会が増えてきた。しかし、その知名度の広まりとは裏腹に、「何をどうすれば成果に結びつくのか」「実践に落とし込むにはどうしたらよいのか」について具体的に取り上げられることは少ないようだ。 この連載では、主に「会員登録による顧客獲得を行う企業サイト」をモデルとして、想定される次のようなユーザー
デフォルトのフォームをクールにカスタマイズする方法:phpspot開発日誌
maratz.com archive Fancy checkboxes and radio buttons Many young guns ask about how to style custom checkboxes and radio buttons in forms. I prepared a typical markup, a few lines of CSS and some JavaScript functions (Safari label behavior fix included). デフォルトのフォームをクールにカスタマイズする方法。 以前、「Niceformでエレガントなフォーム生成 」というので独自フォームにデザイン変更する方法をお伝えしましたが、どういう仕組みか気になっていました。 独自フォームデザインの実装方法について書かれているサイトを発見したので仕組みを説
The Form Assembly - Create and Process State-of-the-Art Web Forms
Prefill forms and create dynamic picklists with Salesforce data, reduce manual data entry while improving data quality, and quickly create new forms with any Salesforce object using no-code tools that anyone can master.
FormAssembly: Secure Online Forms - Data Collection and Form Builder
Transform your outdated processes and empower essential business initiatives with FormAssembly forms and Workflow. FormAssembly Workflow The new age of data collection Imagine a world where work just flows. It's possible with FormAssembly Workflow, the new solution that'll change the way you work for the better. With Workflow, teams can visually map out the flow of data to enable better decision m
Ajaxian Attack of the Ajax form builders
Enterprise Strategy Group: Go-to-market Expertise to Help You Win
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The blog of H.Fujimoto: 2006年07月07日 アーカイブ