タグ

UIとWebデザインに関するko-ya-maのブックマーク (10)

  • Av-jyo.com

    The domain av-jyo.com maybe for sale. Click here for more information. Av-jyo.com Related Searches: Cloud Service Providers Secure Internet Browser Computer Internet Security Web Designing Courses AVI DVD Player Online Data Protection MatchMaking Services Related Searches: Cloud Service Providers Secure Internet Browser Computer Internet Security Privacy Policy

  • 今日から現場で使える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選
  • jQueryでやる!ブログで使えそうな楽しいナビメニュー45

    色々とjQueryのサンプルやプラグインが掲載されていて、眺めてるだけで楽しくなるエントリー。 ナビゲーションメニューで悩んだ時に使えそうです。 45 jQuery Navigation Plugins and Tutorials - Noupe さて、いまや多くの人たちから支持を得ているjQueryで、もっと楽しいブログにしてみるのもいいかもしれない。 jQueryは何もWEBサイトだけのものではありません。条件さえクリアすればブログだって使えるのです。 あなたのブログがほんの少しのjQueryで生まれ変わるかもしれない。 わかる方はさくっと上のリンクを叩いて色々試して見てください。 jQueryってそもそも何、って言う人が居ましたら以下を。 jQueryって、美味しいの? 結構美味しいです。 多くの方に支持されるにはやはりそれなりの理由があります。 超、簡単に説明すると あなたが書いた

    jQueryでやる!ブログで使えそうな楽しいナビメニュー45
  • ユーザーインターフェースの検証データを公開している「ABtests.com」は、ウェブマスター必見事例の宝庫 - Feel Like A Fallinstar

    Home > UI(インターフェース) > ユーザーインターフェースの検証データを公開している「ABtests.com」は、ウェブマスター必見事例の宝庫 Older ウェブの位置づけが上がるにつれ、数値的な検証がどんどん進んでいます。 ただ、その割りにどんな方法で数字が上がった、という具体的な事例がまだまだ世の中に出回っていないのも事実。 そんな中、A/Bテストの特化してインターフェースの検証事例を公開しているサイトがABtests.com」です。 インターフェースの比較検証結果が数値でわかる http://www.abtests.com/ ABtests.comの中身は、はまさに読んでそのまんまの内容。 トップページから事例が豊富に掲載されています。 例えば・・・ このフォーム、左と右でどちらが通過率が良いと思いますか? 答えはこちらのページにて。 なかなかここまで数字で結果を出してくれ

  • デザイナー・コーダー必見!使えるform関連jQueryプラグインの数々 | バシャログ。

    こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに!かつ操作性を向上!できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック(バリデーション)が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日語用は別途作成し、使用することが可能です。 jQuery

    デザイナー・コーダー必見!使えるform関連jQueryプラグインの数々 | バシャログ。
  • リキッドデザインを検討するべきウェブサイト3つのパターン - Feel Like A Fallinstar

    ブラウザの横幅に応じてコンテンツを閲覧できるリキッドデザインは、利用如何によってユーザ体験に大きく寄与することもあれば、単なる迷惑にもなります。 今日は、リキッドデザインを検討したらよいウェブサイトのパターンを解説してみたいと思います。 基は横幅は固定 まず、前提として、特に最近はりキッドが必要なサイトは減っていることを認識する必要がありそうです。 理由はシンプル。 デスクトップパソコンのディスプレイの巨大化 ミニサイズのノートパソコンの普及 によって、横幅がころころ変わるデザインではレイアウトの最適化が極めて難しいから、です。 では、どういうときにリキッドデザインを検討したらよいでしょうか。 1.商品が多数閲覧できるECサイト これは、単純にアマゾンやYahoo!オークションなどを思い浮かべてもらえたらよいかと思います。 画像中心のレイアウトのため、横に広がっても可読性(やユーザビリテ

  • IE6デザイン新手法 Universal Internet Explorer 6 CSS | エンタープライズ | マイコミジャーナル

    For A Beautiful Web - Creative web design and development training and workshops for web designers and developers IE6のシェアが下落しているとはいえ、Net Applicationsの報告によれば2009年4月におけるIE6のシェアはIE7、Firefox3に次いで3位、17%強のシェアを確保している。WebサイトのIE6対応は依然として続ける必要がありそうだ。そうした状況に対し、Andy Clarke氏がUniversal Internet Explorer 6 CSSという興味深い取り組みを開始した。成果物はGoogle Codeでも公開されている。 Andy Clarke氏はIE6に関する6つの疑問に対して次のように自説を紹介。 (デザインは優れたブラウザに合わせてIE

    ko-ya-ma
    ko-ya-ma 2009/05/29
    IE6を完全に捨てないために。
  • Blueprint CSSのレイアウト設計をグラフィカルに行う·Boks MOONGIFT

    Blueprint CSSCSSフレームワークの先駆け的なソフトウェアだが、これを使うとグリッドなデザインを簡単に実現できるようになる。多様なブラウザにも対応し、かつきっちりとしたデザインが組めるとあって、便利に使われている。 グラフィカルにグリッド設計ができる とは言え、最初は使いこなすのに苦労するかも知れない。これからBlueprint CSSを使ってみようと思う方はBoksを使ってデザインするのが良さそうだ。 今回紹介するフリーウェアはBoks、Blueprint CSSをグラフィカルに使いこなすソフトウェアだ。 BoksはAdobe AIRのアプリケーションで、Windows/Mac OSX/Linuxで動作する。グリッド設定を使って、ページの幅やカラムの数を指定できる。そしてクリックでDivタグを配置し、ドラッグで幅を調整してグリッドデザインを描くことができる。左右への移動は矢

    Blueprint CSSのレイアウト設計をグラフィカルに行う·Boks MOONGIFT
  • フォームにおける「進む」ボタンと「戻る」ボタン。どのように配置する? (ユーザビリティ実践メモ)

    これまで実践メモではフォームを設計する際に注意すべき点をいくつかご紹介してきました。 フォーム設計についての記事一覧 今回はフォームによく出現する「進む(次へ)ボタン」と「戻るボタン」を配置する際に気をつける点を纏めました。 ウェブサイトにおいては「進む(次へ)」ボタンなど前進するものを右側に、「戻る」ボタンなど後退するものを左側に置くことが一般的になっています。 ユーザは多くのサイトを利用している中でこの配置に慣れていますので、配置が逆になっていると次へ進むつもりがうっかり「戻るボタン」を押してしまうことになりかねません。最悪の場合、これまで入力したものがクリアされてしまい、入力を一からやり直すはめになります。 そういう訳ですから、フォームのボタンを配置する際は「進む(次へ)」ボタンを右側に、 「戻る」ボタンを左側へと一般的な慣習に従う方がユーザに対して親切と言えるでしょう。 2.「進む

    ko-ya-ma
    ko-ya-ma 2009/04/02
    フッターリンクの下のボタンは、ユーザに対して「このサイトでのあなたのゴールはここ(資料請求ボタン)ですよ」と擦り込むための装置
  • 成果を上げる携帯サイトのフォーム設計 (ユーザビリティ実践メモ)

    離脱されない携帯サイトのフォーム作成術 携帯サイトのフォーム設計のコツ 個人プロフィールからの引用を考慮した携帯サイトフォーム設計 さて、携帯サイトのフォームの入力効率を上げる(完遂率を上げる)には、まず項目数を少なくして入力負荷を減らすことが第一です。 しかしビジネス上の要件から、項目数を減らすことにも限界があります。そこで、入力時のボタン操作など、「ユーザの操作面の負担を少なくする」ことを考えましょう。 1. 入力文字種を指定する テキストエリアの属性としてistyleを指定することで、入力文字種の「全角かな」「半角カナ」「英文字」「数字」をページ側で指定することができます。 携帯電話では文字入力モードを変更するために、2-3回(十字キーを使う場合はもっと多くなります)ボタンを押さなければなりませんので、この指定だけでもユーザの負担は大きく減ります。 ※タグや属性の詳細な仕様に関しては

  • 1