タグ

2016年8月20日のブックマーク (16件)

  • CAM FORCE

    新たなSTAGEへ 2018年6月1日をもちまして、親会社である株式会社シーエ・モバイルと合併することとなりました。 この合併により、さらなる事業価値の向上を図り、お客様のニーズにお応えできるよう努めてまいります。 今後とも、変わらぬお引き立てを賜りますようお願い申し上げます。 CA MOBILE へ移動する

    CAM FORCE
    karauma
    karauma 2016/08/20
    “入力支援機能一覧” PC、スマートフォン版デモフォームがあっておもしろい!
  • 既存のフォームをユーザーに使いやすくする10のポイント

    10 Tips for Optimizing Web Form Submission Usability [ad#ad-2] 下記は各ポイントを意訳したものです。 1. 必須入力欄は強調する 2. エラーメッセージは分かりやすく 3. クライアントサイドのバリデーション 4. 入力している欄を明示 5. 進捗を明示 6. データの保存やキャッシュ 7. 送信ボタンの文言 8. キャンセルボタン 9. 入力例の記載 10. 垂直に配置 1. 必須入力欄は強調する ユーザーはフォームに入力した後に入力ミス・エラー表示があると、不安を感じたりイライラを募らせるでしょう。まずは、入力欄に「必須」「任意」などを記載して、入力欄が必須なのか任意なのかを明示的にユーザーに伝えるのは安全な方法となります。 2. エラーメッセージは分かりやすく フォームのエラーメッセージは、「あなたが下に必要とさせるフィー

    karauma
    karauma 2016/08/20
    “フォームに入力した後に入力ミス・エラー表示があると、不安を感じたりイライラを募らせるでしょう。まずは、入力欄に「必須」「任意」などを記載して、入力欄が必須なのか任意なのかを”
  • 入力フォーム改善でCV率1.6倍!成果を上げる18のテクニック | LISKUL

    たかが入力フォーム、されど、入力フォーム。 ユーザーが入力フォームに入力しているとき、もう気持ちは「購入します!」「申し込みます!」と決まっているはずです。 しかし、入力フォームが使いにくいために、せっかくの顧客をのがしてしまう可能性があるのです。 サイトへの流入はあるのに成果が上がらない・・・。 フォームPV数とコンバージョン数に差がある・・・。 そんな時には入力フォームを見直すべきかもしれません! 入力フォームについて書かれている16の記事、サイトを参考に、結局、なにが重要なのか、基と応用合わせて18のテクニックを厳選し、事例を交えてお伝えします。 入力フォーム改善の威力、条件を知ることで、成果を上げる入力フォームを作ることができるはずです。 失敗しない入力フォームを選ぶ!【LISKUL特集(2019年版)】CVR改善ツール一覧>> ※記事は2014年7月29日に公開された記事をL

    入力フォーム改善でCV率1.6倍!成果を上げる18のテクニック | LISKUL
    karauma
    karauma 2016/08/20
    “ 必須を明記していないとユーザーにとって予想外なエラーが発生し離脱につながってしまいます。 必須項目は入力ボックスの左側に必須と明記しましょう。”「※」は分かりにくい
  • コンバージョン率アップ!入力フォーム最適化(EFO)14のポイント

    あなたのサイトの入力フォームは、お客様にとって使いづらいフォームになっていませんか?フォームはお客様のストレスを最大限に減らし、快適で分かりやすいフォームにしなければなりません。フォームの使いやすさ、つまりユーザビリティは入力完了率やコンバージョン率に大きく影響するからです。 そしてフォームのユーザビリティを上げるには、入力フォーム最適化(EFO)をする必要があります。フォームの最適化をすることでユーザビリティが向上し、コンバージョン率の向上に繋がります。そこで今回は、具体的にどのような入力フォーム最適化をすれば良いのか、改善例を元にご紹介します! そもそも入力フォーム最適化(EFO)とは? 入力フォームからのコンバージョン率が低い場合、まずはコンテンツやデザインを見直します。しかし、あなたは入力フォームを見直したことがありますか?コンテンツやデザインの見直しも重要ですが、コンバージョンに

    コンバージョン率アップ!入力フォーム最適化(EFO)14のポイント
    karauma
    karauma 2016/08/20
    “全ての項目に必須か任意のラベルをつけよう”「これは必須と任意どちらだろう…」と悩む方も多くいるのが事実です。入力を悩ませてしまっている時点で、そのフォームは使いづらいフォームです。
  • 【入力成功サイン】で、ユーザーがどんどん入力したくなるフォームを作ろう | UI改善ブログ by f-tra

    日はフォーム入力に達成感を与えてくれるEFO機能のひとつ「入力成功サイン」のメリット・デメリットや、効果的な活用方法などについてご紹介したいと思います。 入力成功サインとは 入力成功サインとは、フォームの入力項目ひとつひとつに対して、入力形式などの誤りがない(=エラーのない)状態に入力できたタイミングで、その旨を知らせる機能です。 通常は「OK」「完了」「成功」などの意味を表すアイコン画像やテキストを、入力欄の右横や下位置などに表示することが多いようです。 ※エフトラEFOの入力成功サインは、アイコン画像とテキストの2種類で表現することが可能です。 リアルタイムアラートがエラー時に現れるのに対し、入力成功サインは成功時に表示されますから、これらは丁度対の関係となっていますね。 入力成功サインのメリット エラーの有無をチェックするという役割においてはリアルタイムアラートと同じなのですが、入

    【入力成功サイン】で、ユーザーがどんどん入力したくなるフォームを作ろう | UI改善ブログ by f-tra
    karauma
    karauma 2016/08/20
    入力成功サインとは、フォームの入力項目ひとつひとつに対して、入力形式などの誤りがない(=エラーのない)状態に入力できたタイミングで、その旨を知らせる機能です。
  • 分かりやすいWeb入力フォームのための十戒 | POSTD

    1. 各々の入力欄に、常に見えて分かりやすいラベルを付けよ 記入する前の入力欄にだけ、フォームのラベルを表示するのがWebデザインの主流になっています。これはユーザネームやパスワードなどを入力する際にはシンプルで使い勝手がいいのですが、それ以上に長い文字列になると少々勝手が悪くなります。 そのため余白があるのであれば、ラベルを表示すべきです 特に、長いフォームの場合では、ユーザは入力したものを見直すでしょう。どのラベルが入力欄と合致するのか分からなければ、間違いがないよう見直すことなどできるはずがありません。 改善前:入力欄中にラベルが記入してあります。今は見やすいかもしれません。 しかしフォームに入力するとラベルが見えなくなってしまい、間違いを見つけにくくなってしまいます。 改善後:それぞれの入力欄に、クリアでいつでも見えるラベルを付けましょう。 2. 十分な大きさのフォントを使用せよ

    分かりやすいWeb入力フォームのための十戒 | POSTD
    karauma
    karauma 2016/08/20
    “何がオプションで何が必須かを明確にせよ”
  • そこそこユーザビリティの高いフォームを作った

    そこそこユーザビリティの高いフォームを作った 入力内容の検証とか、郵便番号変換を備えた、そこそこ使いやすいフォームのテンプレートを作りました time2014/01/18 hatenabookmark- 去年末実家に帰省していた時に、jQueryの練習&業務で使うために、フォームバリデーションとか郵便番号変換とかを備えた、そこそこユーザビリティの高い入力フォームをコーディングしていたので、ここで公開しておきます。 フォームサンプル ソースお持ち帰り用 (Github) ここで"そこそこ"と言っているのは、もともと業務でユーザビリティ改善案として使うことが目的であって、ベストを目指してもサーバ制約やコスト的な観点で使えないことがあるから、そこは目指さないよという意味です。そもそも、フォームは必要悪ですし、ベストはフォームが存在しないことですね。 フロントエンド実装だけです(サーバ側スクリプト

  • リアルタイム・アラート | EFO(入力フォーム最適化)のエフトラ EFO

    リアルタイム・アラート機能とは、フォームに入力された文字の入力形式や文字数をリアルタイムに判別し、ミスがある場合はその場でエラー表示を行なう機能です。 エフトラ EFOでは、通常の入力形式(かな、カタカナ、英数字、半角/全角など)に加え、メールアドレス形式や電話番号(ハイフンと数字)、URL、ドメインなどの特殊な文字列形式にも対応しています。 さらに、他の入力項目の内容と一致しない場合(メールアドレス確認欄などに使用)や、正規表現の指定による自由なカスタマイズも行なっていただけます。 また文字数については最大文字列や最小文字列の数値指定、禁止文字列の指定が可能です。 フォーム入力において、ユーザーが最もストレスを感じる瞬間のひとつがエラー表示です。 とくにミス無く入力した、と思っていたのに予想外のエラーが出ることに大きなストレスが生じます。 ボタン押下後に出るズラリと並んだエラーを修正する

    karauma
    karauma 2016/08/20
    リアルタイム・アラート ユーザーが入力ミスをしたその場で通知を行います。EFO入力支援機能サービスサイト エフトラ
  • フォームの「ガッカリ離脱」を防いでコンバージョン率UP! 送信後エラー・ゼロ作戦/15か条の7 | 勝手にEFO分析-エントリーフォーム改善

    フォームの送信ボタンをクリックしたとき、エラーが表示されたらガッカリしてしまいますよね。そうしたことが原因の「ガッカリ離脱」を防ぐために、エラーがない状態になるようにユーザーを導き、確認画面、完了画面に進んでもらうことが、完了率アップには極めて重要です。今回は、入力項目ごとに、ユーザーが入力した内容がフォームの求める形式になっているようにするための改善ポイントをご紹介します。 この記事では、入力フォームを改善して入力完了率を上げる!エントリーフォーム最適化15か条の【第7条】「入力エラーをリアルタイムで伝えるべし」をご紹介します。リンクをクリックするとこの記事下のまとめに飛びます。 「ガッカリ離脱」を未然に防いで、入力完了率アップをしようエントリーフォームにひと通り入力を終えて「確認/完了ページ」へ進もうとしたのに、エラーメッセージがでてガッカリした経験はありませんか? ガッカリしたユーザ

    フォームの「ガッカリ離脱」を防いでコンバージョン率UP! 送信後エラー・ゼロ作戦/15か条の7 | 勝手にEFO分析-エントリーフォーム改善
    karauma
    karauma 2016/08/20
    “入力エラーをリアルタイムで伝えるべし 「送信ボタン」をクリックしてエラーが出たときのガッカリ感は、ユーザーが離脱する最大の要因の1つだ。 リアルタイムアラートを実装すべし”
  • 入力フォームの「必須」「任意」のラベルは両方付けないとコンバージョン率が下がる

    [レベル: 初〜中級] 入力フォームのフィールドには、入力が「必須」なのかまたは「任意」なのかのラベルを両方付けることが推奨されます。 どちらか片方だけだと入力途中の離脱の原因になります。 ECサイトのユーザービリティ調査と最適化を専門に扱っているBaymard Instituteが詳しく解説しています。 15の大手ECサイトのユーザビリティ調査と18の主要なモバイルサイトのユーザビリティ調査、そして自社による最新の大規模なアイトラッキングテストによって実証することができました。 この記事では、その解説の要点をまとめて紹介します。 片方だけの「必須」「任意」ラベルの問題点 入力が「必須」か「任意」かをどちらか片方のラベルだけで示すことにはさまざまな問題点があります。 必須か任意かを示さないのはいちばんよくない そのフィールドの入力が必須か任意かを示さないのはいちばんよくないスタイルです。

    入力フォームの「必須」「任意」のラベルは両方付けないとコンバージョン率が下がる
    karauma
    karauma 2016/08/20
    “15の大手ECサイトのユーザビリティ調査と18の主要なモバイルサイトのユーザビリティ調査、そして自社による最新の大規模なアイトラッキングテストによって実証することができました。”
  • 【保存版】問合せを劇的に増やすエントリーフォーム最適化(EFO)15の方法|MarTechLab(マーテックラボ)

    皆さんこんにちは。ギャプライズ鎌田(@kamatec)です。 今日は過去私が数百社という企業のプランニング・運用をしてきた中で実証した、 最も「手早く」「確実に」コンバージョンを伸ばす方法をご紹介します。 それがEFO、つまり「エントリーフォームの最適化」です。 Webサイトをリニューアルしなくとも、LPを作らなくとも、 エントリーフォームを変えるだけでコンバージョンは劇的に変わるのです。 実際の事例をいくつかご紹介しましょう。 Case1:ブライダル系サービスのEFO事例 http://www.primavera-wedding.co.jp Case2:ギャプライズクリックテールサイトのEFO事例 https://contentsquare.gaprise.jp/ Case3:システム系BtoBサービスのEFO事例 これらの事例はいずれも変更したのはエントリーフォームだけです。 特にフォ

    【保存版】問合せを劇的に増やすエントリーフォーム最適化(EFO)15の方法|MarTechLab(マーテックラボ)
    karauma
    karauma 2016/08/20
    入力完了時は「OK」「✔」などでわかりやすく!必須の入力項目は「必須」とわかりやすく明記しろ! 入力ミスが残ったまま次の項目に移動しようとすると、即座にエラー表示
  • 必須項目は[必須]マークで表記! 入力フォームの完了率が上がる方法とは | 勝手にEFO分析-エントリーフォーム改善

    必須項目は[必須]マークで表記! 入力フォームの完了率が上がる方法とは | 勝手にEFO分析-エントリーフォーム改善
    karauma
    karauma 2016/08/20
    注釈を読むために、ユーザーは視線を動かす必要があります。フォームにおいて、入力以外のムダな視線の動きは避けるべきなので必須マークは単独で意味がわかるようにマークにすべきでしょう
  • EFOで気をつけたい!必須項目と任意項目のわかりやすい表示方法 | UI改善ブログ by f-tra

    フォームの<必須項目>と<任意項目>。 これがきちんと表示されていないと、エラー表示の要因となりユーザーをイライラさせてしまう可能性が高くなります。 いっぽうで明確に表示できていれば、入力完了までのステップが見えやすくなり、プラスに働いてくれるでしょう。 必須/任意の表示方法は、EFOにおいて重要なポイントです。 日はそんな<必須項目>と<任意項目>のわかりやすい表示方法をお伝えしていきます。 目次 必須項目は固めて配置しよう 見た目に差をつけよう 「必須」と文字で表示しよう 項目名のそばに表示しよう ひとつずつ表示しよう それでは、順番に見ていきます。 必須項目は固めて配置しよう 下の図はフォーム内に必須と任意の項目がバラバラに入り乱れている場合です。 もしもあなたが「必須だけ入力したい」と思っていたとしたら、どうでしょうか。 任意項目をわざわざ飛ばしていかなければならず、非常に入力し

    EFOで気をつけたい!必須項目と任意項目のわかりやすい表示方法 | UI改善ブログ by f-tra
    karauma
    karauma 2016/08/20
    「※」「*」などのマークで必須を表現することが多いですが、うっかり見落としの原因にも。マークではなくきちんと文字ではっきりと「必須」と書くことをおすすめします。[EFO][UI][フォーム][エラー]
  • EFO対策(エントリーフォーム最適化)におけるタブーまとめ22選 | ボクシルが運営する法人向けクラウドサービス紹介メディア ボクシルマガジン!

    EFO対策(エントリーフォーム最適化)とは? EFO(Entry Form Optimization)とは、エントリーフォーム最適化(入力フォーム最適化)のこと。 エントリーフォームは、商品購入、資料請求、会員登録、メルマガ登録、問い合わせ、予約…とあらゆる場面で活躍し、今や企業のホームページに欠かせない存在。ただ、「とりあえず必要項目を並べて作った」だけのエントリーフォームは、ユーザーにとって使いにくいものもあります。「ダメエントリーフォーム」では、ユーザーが離脱することも! そこで、EFO対策を行い、ホームページのエントリーフォーム入力の際にユーザーが感じる負担を減らすことで、コンバージョン率を高めることができるのです。 EFO対策(エントリーフォーム最適化)を行えばCVRは劇的に上がる!? もし、コンバージョン率が上がらない…と悩んでいるなら、一度エントリーフォームを見直してみても

    EFO対策(エントリーフォーム最適化)におけるタブーまとめ22選 | ボクシルが運営する法人向けクラウドサービス紹介メディア ボクシルマガジン!
    karauma
    karauma 2016/08/20
    必ず入力が必要な項目は、分かりやすく「必須」ラベルを付けましょう。入力エラーが発生したら、その場で気づけるような仕組みを取り入れましょう。ポップアップでアラートが立ち上がるなど
  • 日本のテクノシーンを牽引し続ける男、石野卓球インタビュー

    日本のテクノシーンを牽引し続ける男、石野卓球インタビュー
  • モバイルのためのUXデザイン②:インタラクション編 | UX MILK

    Elaineは、13年以上Webデザインに携わっているベテランのWebデザイナーです。ユーザーエクスペリエンスやWebデザインに対する思い入れが強く、執筆活動も盛んに行っています。ロンドンを拠点としたUXデザイン事務所Foolproofで、ビジュアルデザイン部の部長を務めています。 インタラクションデザイナー・Elaine McVicar氏によるモバイルのためのUXデザインシリーズ。第2回目の今回は、情報アーキテクチャに基づいた、モバイルサイトにおけるインタラクションデザインを考察します。様々な実例をもとに、モバイル向けのデザインとPC向けのデザインがどのように異なるのかを解説していきます。 私が初めて手にした携帯電話はNokiaの5110という機種で、1998年に購入しました。基的な機能は通話とテキストメッセージのみで、ゲームはヘビゲームだけしかプレイすることができませんでした。携帯電

    モバイルのためのUXデザイン②:インタラクション編 | UX MILK