タグ

フォームに関するgachakku0131のブックマーク (32)

  • そこそこユーザビリティの高いフォームを作った


     便使 time2014/01/18 hatenabookmark- jQuery使便   (Github) ""使使 
  • お問い合せフォームをコーディングするための9つのTips | 株式会社LIG

    こんにちは。 LIGフィリピン支社代表のせいとです。 お問い合わせフォームといえば、どんなサイトにも大体備わっているものですよね。 どのフォームも見た目は大体同じのため、構築自体は簡単かと思います。 ただし、システムが絡んだり、ユーザーに操作してもらったりと、けっこう重要なページであったりもします。 そこで今回は、ユーザーにとってより快適なフォームを実現するためにオススメしたいクールな技をお伝えしたいと思います。 また、今回の記事を書くにあたり、デモページを作成しました。 こちらのソースも見ながら読んでいただくと、よりわかりやすいかと思います。 ユーザーフレンドリーで構築もしやすいクールなお問い合せフォームをコーディングする9つのTips 1. ボタン系の要素は全て<button type=”submit”></button>を使う 「送信する」「入力画面に戻る」などの要素を作る際、タグは

    お問い合せフォームをコーディングするための9つのTips | 株式会社LIG
  • 最近のデザイントレンドを取り入れた美しいデザインのフォームのPSD素材のまとめ

    最近のデザイントレンド、フラット、サークル、ミニマル、ブラーなどを取り入れ、ディテールにこだわった美しいデザインのフォームのPSD素材をPixelsDailyから紹介します。

  • These Days Labs » jQuery » clearField

    This plugin takes care of your input fields. Often used by opt-in input fields where the default value of the field is something like "Your e-mail address". If you click the field the text disappears so that you can type your e-mail address. The plugin depends on the jQuery framework and is very simple to implement. Put this in your HTML pages header: <script type="text/javascript" src="jquery.js"

    gachakku0131
    gachakku0131 2011/11/14
    フォームの入力要素にデフォルト値を表示するやつ。手軽でカスタマイズ簡単で良い
  • フォームのselect要素内をインスタンス検索出来るようにし、美しいデザインにも変更できるjQueryプラグイン・Chosen

    結構便利そうだったのでご紹介。フォームの select要素内に羅列されたoptionから、入力 するだけで結果を表示するインスタンス検索 を可能にするスクリプト・Chosenです。表題 にはjQueryプラグインと書きましたが、この スクリプトにはjQueryプラグインとprototype の2つが用意されています。 optionの量が多くなってしまうことはよくあるので、この手のユーザビリティ向上系スクリプトは多く存在しますが、これはかなり便利ではないかなと思いました。似たようなのもうあるんですかね。 通常のselectボックスでプルダウンさせると検索窓も表示、キーワードを入れるだけでソートしてくれます。いわゆるインスタンス検索が可能になるので大量のoptionが存在してもユーザーの利便性を全く損ないません。 デモ見たほうが早いですね。※追記:日語だとFirefoxのみ動かないみたい。英

    フォームのselect要素内をインスタンス検索出来るようにし、美しいデザインにも変更できるjQueryプラグイン・Chosen
  • 実装が簡単で、フォームの使い勝手を向上させるJS 3種


    Web65 | Web CSSCSS HappyLife ZERO    使   使 
    実装が簡単で、フォームの使い勝手を向上させるJS 3種
    gachakku0131
    gachakku0131 2011/07/09
    エンターを押すとTabと同様に次の入力エリアに移動する
  • The 60+ Best Ecommerce Websites - Top Ecommerce Website Designs

    Home » Articles » 25+ Best Ecommerce Website Designs for Inspiration (2024) 25+ Best Ecommerce Website Designs for Inspiration (2024) The list of top 50 ecommerce website designs in 2024 If you subscribe to a service from a link on this page, Reeves and Sons Limited may earn a commission. See our ethics statement. For any business that wants to sell online, having a well-designed website is vitall

    The 60+ Best Ecommerce Websites - Top Ecommerce Website Designs
  • フォームで離脱させないためのjQueryプラグイン50選|designaholic -Creative Column-

    最近では、エントリーフォーム最適化(EFO)という施策も広まってきましたが、特に購入やサンプル請求、お問合せ等がコンバージョンとなっているサイトではフォームで離脱されてしまってはせっかくの広告や施策が水の泡になってしまいます。 ここではユーザーを離脱させないために気をつけたいポイントとそれを実現するために便利なjQueryのプラグインを紹介します。   まず、入力フォームを作成する際のポイントは、ユーザーにストレスを感じせない事です。ストレスの原因となるものは大きく言うと   入力しづらい、エラーメッセージがわかりづらい、といった操作に関するもの。 どこまでやれば完了なのかわかない、個人情報の扱いが心配、といった心理的なもの。   です。なのでこの点を解消させてあげるフォームを作成すればユーザーが離脱する可能性は下がりますね。 具体的なポイントは以下のような項目になります。   必須入力か

  • CSS3とjQueryでフォームを美しく装飾する方法

    2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです!そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト! フォームの仕様 今回チャレンジするフォームの主な仕様です! グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける(モダンブラウザ) 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ?という人もひとつひとつ記述していけば意外と簡単に作れるはずです!リンクをクリックで各項目にジャンプします。 テキストボック

    CSS3とjQueryでフォームを美しく装飾する方法
    gachakku0131
    gachakku0131 2010/10/28
    チェックボックスとラジオボタンはCSSスプライトで
  • CSS3だけでつくるWebボタン!押さずにはいられないボタン簡単3ステップ


     (`д)      使CSS3Web   CSS3  CSS3    CSS C
  • Bienvenue sur le blog dédiée aux solutions informatiques

    Que ce soit pour optimiser leurs performances ou rester à la pointe de l’innovation, les solutions informatiques sont devenues incontournables pour de nombreuses entreprises. Si vous avez des doutes à…

  • フォーム周りに使えるjQueryプラグイン50 – creamu


    使 使50 jQuery Plugins for Form Functionality, Validation, Security and Customisation使jQuery  jQuery Highlight Plugin  Autotab: jQuery Auto-Tabbing and Filtering inputinput jQuery NobleCount TwitterjQuery NobleCountAJ
    gachakku0131
    gachakku0131 2010/09/05
    たくさんある
  • 今日から現場で使えるjQueryのフォーム関連プラグイン15選

    Webサイト制作で欠かせないのがフォーム。 これらは購入時や、お問い合わせ、ログインと言ったパーツで良く使われます。 今回はそんなフォームにスポットを当てて、なるべく使いやすく、導入しやすいものをご紹介いたします。 ただし、あくまでもjQueryプラグインのご紹介なので、よくわからないと言う方は華麗にスルーしてください。細かい導入方法までは説明しません。 機能性重視プラグイン In-Field Labels jQuery Plugin フォームの中に入っている文字がオンクリックでうっすらと消えていくプラグイン。 なかなかいい感じ。 Create a Progress Bar With Javascript | Nettuts+ demo シームレスにフォームの内容を変え、さらにどれくらい進んでいるかが%で確認できる。 overset - jVal - jQuery Form Field V

    今日から現場で使えるjQueryのフォーム関連プラグイン15選
  • あなたのWebを入力しやすくするjQueryプラグイン10選

    あなたのWebを入力しやすくするjQueryプラグイン10選:CSSの書き方も分かるjQueryプラグイン実践活用法(終)(1/5 ページ) jQueryと、そのプラグインの使い方を、UI効果(エフェクト)のテーマごとに紹介する連載。jQuery/JavaScript/HTMLコードだけではなく、CSSの書き方も解説することで、より実践的にjQueryプラグインを使うための参考ドキュメントになることを目指しています。 前回の「画像や動画を綺麗に回転/拡大するjQueryプラグイン」では、イメージを回転させたりズームインする「jCarousel」「Zoombox」プラグインの使い方を解説しました。今回は、フォームを使いやすくするための各種プラグインを、以下のようにチェックボックス/ラジオボタン、ドロップダウンリスト、テキストボックス/テキストエリア、フォームのカテゴリ別に分類して紹介します。

    あなたのWebを入力しやすくするjQueryプラグイン10選
  • http://www.designwalker.com/2010/06/jquery-forms.html

    http://www.designwalker.com/2010/06/jquery-forms.html
    gachakku0131
    gachakku0131 2010/06/03
    すごいたくさん!いい!
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • Web site hosting - Coders.me

    Hosting on legacy fx on our shared hosting web hosts plans may be a very easy task, and if you carefully follow all the instructions provided below, you ought to have your website up and running in but 10 minutes. This tutorial has been written for and tested on Linux servers with DirectAdmin and cPanel. In order to attach your website like ForexBrokersSouthAfrica on a shared web hosting account,

    Web site hosting - Coders.me
    gachakku0131
    gachakku0131 2009/11/29
    Win7調のグラデーションなナビゲーション/ダウンロード済み
  • jQueryカレンダーコンポーネント8つ | エンタープライズ | マイコミジャーナル

    jQuery: The Write Less, Do More, JavaScript Library 人気のあるAjax JavaScriptフレームワークのひとつにjQueryがある。簡単で扱いやすく高速に動作し、サイズも小さい。MozillaのJavaScriptエバンジェリストが開発していることもあり、FirefoxエクステンションJetpackでもデフォルトで利用できるようになるなど、さらに露出の機会を増やしている。 jQueryはコアとなる機能を提供し、拡張機能UI、コンポーネントはプラグインとして提供されている。どれだけプラグインを把握しているかが、jQueryを使ってアプリケーションを開発する際のひとつのポイントとなる。8 Useful jQuery Calendar, Date Picker and Time Formatting Plugins that You Sh

    gachakku0131
    gachakku0131 2009/11/20
    「Date Range Picker」がすごい使えた
  • select ボックスを超便利にしてくれユーザビリティ向上に使える「jQselectable」:phpspot開発日誌


    select 便使jQselectableGoogle CodejQjQuery Select 便    使 jQuery使  $(".simpleBox").jQselectable({ set: "fadeIn", setDuration: "fast", opacity: .9 }); 
  • In-Field Labels jQuery Plugin

    License: Same as jQuery (Dual GPL + MIT) Author: Doug Neiner Download: InFieldLabels.zip Source: GitHub Size: Under 1KB Minified and gzipped Overview: This is a simple plugin that turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins. Clearing a field and leaving brings back the label. Browser Suppor

    gachakku0131
    gachakku0131 2009/10/24
    フォームにあらかじめ説明文などを表示しておく