入力フォームを改善して入力完了率を上げる！ エントリーフォーム最適化15カ条 | 勝手にEFO分析-エントリーフォーム改善
入力フォーム（エントリーフォーム）を入力していて、イライラする……と感じたことありませんか。ありますよね。自社サイトの入力フォームでユーザーにイライラを与えていませんか。 小さなイライラが積み重なった先にあるのは、エントリーフォームからの離脱です。ユーザーが一度エントリーフォームから離脱してしまったら、もう戻ってきてはくれないと覚悟しておくべきです。入力を完了してもらいエントリーフォームの「入力完了率※」を上げるためにはどうしたらよいのでしょうか。 そこで、この記事ではEFO（エントリーフォームを最適化）を行い離脱要因を減らして、入力完了率を上げる15カ条を紹介します。 少し手間をかければ劇的に入力完了率アップが期待できるはずの、「惜しい」エントリーフォームを各条1つずつ取り上げて、頼まれてもいないのに、勝手にそのフォームを分析して作った改善案とともに、ポイントとなるエントリーフォーム改善
制作途中にお世話になる、ダミーテキスト・ダミー画像のジェネレーターいろいろ
2021年10月21日 便利ツール Webサイトや印刷物の制作中には、とりあえずで入れておく「ダミー」を使用する事が多々あるかと思います。日本ではアタリ・アテなどとも呼ばれますね。それらのダミーテキストやダミー画像を便利に生成してくれるジェネレーターをいくつか紹介します。いろんな種類のジェネレーターやサービスがあるので、うまく利用して時間短縮しちゃいましょう！ ↑私が10年以上利用している会計ソフト！ ダミーテキスト（英文） Lorem Ipsum ダミーテキストの大本命、Lorem Ipsum。Photoshopでも採用されている、「Lorem Ipsum…」から始まる有名なダミーテキストを生成できます。 Dummy HTML snippets for webdesigners HTMLタグ付きのダミーテキストのジェネレーター。左の要素を右側にドラッグ＆ドロップでカスタマイズできます。類
媒体、文字数問わず応用が効く！ Webコピーライティング基本4カ条と事前準備 ：MarkeZine（マーケジン）
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話
はじめに 自己紹介 はじめまして。Lobiチーム意匠部のばっこです。 カヤックで「Lobi」というスマホゲーマー向けSNSのデザイナーをしています。 去年の8月頃に社内の受託チームからLobiチームに異動をして、 半年ほどLobiの周辺サービス（Lobi REC SDK、Lobi Play）を担当したり、 少しだけ新規サービス（RANKERS）のお手伝いをしたりしていましたが、 最近、Lobi本体のアプリに携わるようになりました。 世間のUXブームに遅ればせながらも、業務でUXについて考える機会が増えてきたので、 今回は、そんなLobiでのUXデザインの取り組みを紹介したいと思います。 Lobi（ゲームコミュニティ事業） | 面白法人カヤック Lobiは、スマホゲームに特化した国内最大級のスマホゲーマーSNSです。 同じゲームをプレイしている友達を探したり、攻略情報を交換したり、レアアイテ
ウェブデザインの7つのトレンドとそのチュートリアル | コリス
Deziner Folioのエントリーから、ウェブサイトのデザインに使用されている、最近の7つのトレンドとそのチュートリアルを紹介します。 Design Trendz ※チュートリアルのいくつかは当方で追加しています。 Lights n Shadows ライトを当てているように、シャドウ効果を持たせます。
HTML 5では「article」タグでページの「本文」が取れる - モジログ
次世代HTMLの「HTML 5」について、そのウワサは以前から耳にしながらも、中身については知らなかった。 仕様や解説記事（末尾にまとめた）をいくつか流し読みしてみて、驚いた。これこそ、私の求めていたものだ。 私は以前より、Webページの「本文」がどこからどこまでなのか、ソフトウェアで判定できる標準的な方法があればいいとずっと思っていた（「フィードをアイテム単位に区切れば、セマンティック・ウェブが一気に現実化する」）。HTML 5では、いくつか導入される新しい要素（タグ）の中に「article」というものがあり、これがまさに「記事」の範囲を示すものなのだ。 これさえあれば、プログラム的にWebページを取得して、その「article」タグの部分だけ抽出すれば「本文」になる。あらゆるWebページにこの「article」タグが入ってくれば、もうフィードに頼る必要もなく、どんなページの「本文」でも
[JS]ルーペで覗くように、画像の一部を拡大表示するスクリプト集
画像の一部のみを拡大表示するスクリプトの紹介です。 TJPzoom jqzoom requires jquery.js loupe.js shiftzoom.js MojoMagnify mooZoo
『こんなwebサイトは嫌だベスト20』をチェックシート化して現場に持っていこうと考えてPDF形式で作った
自分が言うのではなくランキングと言うところに魅力 制作者自身が、『いや・・・確かにフルFLASHは見栄えがいいんですが・・・』というのと、アンケート結果として『ユーザーはこう考えていますよ！』と言うのでは、説得力が違うのは当然です。 そんなわけで、このランキングを印刷して現場に持ち歩けば、あなたの説得力も上がるというものではないかと考えて、PDFにしました。 引用元の表記、Goo調べという表記を付け足して、チェックシート化したものです。 また、それぞれユーザーが『不満を抱きそうな項目』にポイントをつけたバージョンも付け足しました。 こちらの項目には、やっぱり不満度の基準は『誰が言ったのか』が重要かもしれないので、『ネタ帳』を表示してます。 自分の言葉はここにないよ！というアピールのために必要かと。 ネタ帳いらねーと思ったら表記無しのほうをダウンロードしてください。 あとベスト20と書いてあ
「エラーメッセージ」
そもそも数字は何を表しているの？ ネットで検索したところ、 http://way.direct.ne.jp/HTTP/rfc2616_ja/ に置いてある「HTTP/1.1」のリソース(日本語訳)に辿り着きました。これによると、この数字は「ステータスコード」というもので、一番左の数字(百の位)に意味があるようです。 1xx: Informational - リクエストは受け入れられ、処理を続けている 2xx: Success - 動作は正常に受信され、理解され、受け入れられた 3xx: Redirection - リクエストを完了するためには、さらに動作を行わなければならない ここまでは「エラーメッセージ」というワケではないようです。 そして、 4xx: Client Error - リクエストは間違った構文か、果たす事のできないものを含んでいる 5xx: Server Error - サ
[JS]ハイライト箇所がスムーズにスライドするナビゲーション
leigeberのエントリーから、マウスのホバーに合わせて、ハイライト箇所がスムーズにスライドするナビゲーションの1KBの超軽量スクリプトを紹介します。 Sliding JavaScript Menu Highlight 1kb スライドするパターンは2つあり、どちらもマウスのフォーカスがはずれるとデフォルトの位置にハイライトが戻ります。 スクリプトの動作環境はIE6, IE7, FireFox, Opera and Safariとなっており、jQueryやPrototypeなど他のスクリプトに依存することなく単独で動作します。
軽量だけど、クールなデザインのウェブサイトのリンク集
Webmaster-Sourceのエントリーから、軽量だけどクールなデザインのウェブサイトを紹介します。 32 Lightweight Designs
[JS]スクロールされる度にコンテンツを表示するスクリプト -Continuous Pagination
Switch On The Codeのエントリーから、スクロールされる度に表示されていないコンテンツを表示するスクリプトを紹介します。 Javascript Tutorial - Continuous Pagination デモ Continuous PaginationはAJAXなどを使用して外部コンテンツを読み込むものではなく、スクロール領域の下部に達すると、新規コンテンツをスクリプトで生成して表示するものです。
[JS]わずか4KBの超軽量の画像ギャラリーのスクリプト -slide.js
leigeberのエントリーから、スムーズにスクロールするサムネイルから拡大画像を表示する画像ギャラリーのスクリプトを紹介します。 Dynamic Image Gallery and Slideshow デモ slide.jsはjQueryやPrototypeなど他のスクリプトに依存することなく単独で動作するスクリプトで、動作環境はIE6/IE7, FF, Opera and Safariとなっています。 サムネイルはリスト要素となっており、オプションでは「拡大画像の格納場所の指定」「拡大画像の拡張子の設定」「スピード」などを設定することができます。
会員登録の敷居を下げる入力フォームの作り方(PC編) - キャズムを超えろ！
本エントリは、20〜40代のPCをある程度使いこなしているユーザー向けの会員登録フォームの設計について述べたものである。ケータイサイトは含まないし、シニアも対象としていない。シニア向けUIについては(古いエントリだが)こちら "ユーザーID"と"メールアドレス" 減ってはきたものの、ユーザーIDとメールアドレスの両方を取るWebサービスがいまだに結構ある(ex. Remember the milk)。はてなやYahooAuctionのように「ユーザーIDがニックネームに相当するコミュニティサイト」は除くとして、ユーザーIDを一般客に公開しないにも関わらずIDとメルアドの両方を取る意図がわからない。 ユーザーIDとしてメールアドレスを使うメリットは 会員登録フォームの入力必須箇所が1個減る 好みのIDが取れない事件が防げる "ID忘れ"による機会損失/幽霊会員が減る 流石に自分のメアドは忘れ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Who is the Cutest?
FLASHベースのリッチテキストエディタ『obedit』*ホームページを作る人のネタ帳
CSSで超クールなメッセージヒントボックスを作成するサンプル:phpspot開発日誌
[JS]パネルを切替可能なタブ型コンテンツ、7つの実装例
[JS]iPodのようにパネルを次々とスライドできるスクリプト
角丸や矩形だけではない、タブ型ナビゲーションのデザイン集 | コリス