インターネットのフォームは昔から存在しながら、その改善はHTMLのバージョンやCSS、Javascriptを使った新しいUIの提案のみで大きな革新というものはあまり無いように思います。
もちろん、このような新しいUIにより大幅に放棄率などが改善するパターンもあるでしょう。
フォームの最適化というのは非常に難しい課題ですが、最近思うのは2010年に発表されたフォームデザインに関する20の指針をまずはチェックして欲しいということです。
【参考】
Simple...
ウェブマスターツールの「Fetch as Google」に「取得してレンダリング」メニューが追加
つい先日、Javascriptのエラー状況などもウェブマスターツールで見れるようにするというアナウンスがあったばかりですが、「Fetch as Google」にメニューが追加されたようです。
今まではbotがどのようにページが見えるかソースレベルで確認できたり、インデックス送信ができたりしたページですが、robots.txtやCSSなどの評価結果も見ることができるようになりました。
まだ実際にエラーパターンを見つけて...
Google Analytics利用者向けの「Table Booster for Google Analytics」がイイかも
以前は違う拡張を使っていたのですが、Table BoosterというChromeの拡張はAnalytics上の数値が視覚的にパフォーマンスが分かったり、z検定も比較したいディメンションにチェックを入れるだけで、その場で結果がわかるのでイイかもしれません。
バーチャートとヒートマップと比較グラフはこんな感じで見えます。
z検定も2つのmetrics選択と、2つのdimension選択でサクッと結果が見えます。
Table...
【GTM】ウェブサイト内画像のABテストをAnalyticsのイベントを使って実施する
2014年5月25日現在、Google Tag ManagerのWEBサイト側計測の場合、ABテスト(Google AnalyticsのExperiments)を利用することは出来ませんが、海外では複雑なスクリプトを組むことで実現している方もいます。
ただ、そのソースを見ていただければわかりますが、単純に実行されるタイミングをずらしているだけだったりします。古いAnalytics(ga.js)とカスタム変数あたりを利用したソースになっているので、新しいAnalytics(analytics.js)でまずは単純な画像のABテストを実施してみました。
ただし、以下のソースの場合は単純なイベントは取得出来たのですが、「Experiments」画面にデータが反映されませんでしたので、まだ改良が必要です。
まず、ABテストを実施するために乱数を発生させます。
それから、タグでこんなソースを書きます。
var...
【GTM】クリック箇所を限定したリンククリックイベントの取得方法
海外でjQueryを使ってゴチャゴチャやっていたけど、実は単純に実装できるよ！というパターンです。
まずはページのソースですが、例えばこんな状態だったとします。
【ソース例】
で、このulタグの中のリンクをクリックしたイベントだけを取得したい場合、Google Tag Managerの設定は一工夫必要になる場合があります。
この例の場合、
Auto Event VariableでElement Classを設定した後に
event...
20日からパンダアップデート4.0が開始
様々なところで話題になっていますね。
Google is rolling out our Panda 4.0 update starting today.
— Matt Cutts (@mattcutts) 2014, 5月 20
これに絡むかどうかはわかりませんが、SERPsに著者情報(Authorship)が表示されるものが非常に多くなったという報告もあります。
海外でもこの点に言及があるものもありますが、検索ランキング...
「マウスカーソルはなぜ傾いているか」を記載した記事が面白い
海外のマウスポインターの記事、結構面白かったです。
GUIはもともとXEROXの「パロアルト研究所」で生まれた事は有名なお話ですが、カーソルに関するドキュメントも1981年に記載されていたということです。
元々マウスポインターは傾いておらず垂直デザインだったようですが、当時の画面解像度が低いディスプレイ上では視認性が非常に悪く、現在のデザインに至ったという内容が書かれています。
...
広告サイズ標準が次の世代に？IAB Rising Stars
IABが新しくRising Starsという新しい広告ユニットポートフォリオを発表しました。
新しい広告は以下の6つ。
Billboard
Filmstrip
Portrait
Pushdown
Sidekick
Slider
リッチな広告の方がより、目をひきやすくクリックされやすい訳ですが、今回発表されたRising Starsの各広告サイズごとにサンプル動画がありますので、ぜひ直接サイトでご確認ください。
次のサイトレイアウトを考える時や、広告とは言わずとも自社コンテンツの魅力的な見せ方としてこれらの広告方式を真似るのはとても意義があると思います。
かなりリッチであることは間違いないのですが、個人的にはFunnelを意識したFilmstripの事例はとても面白かったです。
モバイル版Rising...
流行っているウェブサイトをUXの教材として集めている「User Onboarding」が面白い
海外の「User Onboarding」というサイトが見ていて結構面白かったのでご紹介。
書籍も出しているようですが、例えばPinterestであれば会員登録のステップ数は3段階
マウスオーバーで自動的に画像が拡大されるようになってもいます。
そして、各ページで何がどのような効果があるか、どういう印象なのかなどが細かくメモされています。
ぜひ面白いので見てみてください。
User Onboard...
Google Chrome Canaryバージョンで、「ビーコン」が有効化可能になった
去年からWEBの高速化に対するパフォーマンス系APIの勧告認定やら色々と動きが慌ただしいのですが、Google ChromeのCanary版で2014年2月に編集者草案となっている「ビーコン」が有効化できるようになったようです。(flagsページで有効化)
via Ilya Grigorik
今後、勧告認定されるかどうがは現状分かりませんが、最近の動きを見る限りはその可能性は高いような気もします。
こういう技術回りは専門ではないので詳しい説明は他の方に譲りたいのですが、僕の理解では今までWEB解析系のタグをやりとりするためには同期的なXHRが発生していたため、ユーザー側へのウェブ表示を遅らせる可能性がありました。また画像を使い遅延ロードで解析をした場合もデータの信頼性が揺らぐなどのマイナス影響があったのですが、それを解決する仕様が、この「ビーコン」です。
W3CにはsendBeacon...
【GTM】ルックアップマクロを使って仮想ページビューを生成
結構これは簡単な例ですが、実際設定していて「マクロ」の「ルックアップ」を知るにはとても良い教材のような気がしました。
黒塗り部分が多くて申し訳ないのですが、ある特定URLを別のURLへと「ルックアップ」を使って置き換えて、置き換えたURLをAnalyticsの「仮想ページ遷移」に代入するだけです。
この設定だとマクロが2つ入っているのですが、1つは「dataLayer」で元々ページに仕込んであるもの、もう一つが今回設定したルックアップマクロです。ただ今のところ両方とも値が入ってくることが無いので、こんな設定にしていますが今後値が入ってくるとしたらタグ自体を2つに分ける必要が出てくるかもしれません。
現状、この辺りの条件分岐などがGTMで組めないのがツラい所です。
【参考】
Google...
当たり前といえば当たり前。でも注意したいユニバーサルアナリティクスでのユーザーレベル条件
海外の投稿でこんな事例がありました。
ユニバーサルアナリティクスで特定の日付、例えば5月1日にUser Idをもった「Aさん」が「ページ1」にアクセスをしました。
それをAnalytics画面から"「Aさん」で、かつ「ページ1」を見た"という条件でユーザーレベルの条件を表示させます。
表示期間に5月1日を含んでいた場合は、確かに正しく「ページ1」を見た「Aさん」のセッションが確認できます。
しかし、一方で5月1日を含ま...
【GTM】タグマネージャとjQueryを使ったEFO(フォーム改善)
所謂エントリーフォームオプティマイゼーション(Entry Form Optimization)というやつですが、Google Tag Managerを使ってサクッと出来たので、今回はテスト結果の共有です。
事前にjQueryを読み込んでいる前提でこんな感じのScriptを組んでみました。
var now;
(function($) {
$(document).ready(function() {
var clientId =...
「コンテンツ・マーケティングとコンテンツ・ストラテジーは違う」という考え方が面白い
SEJにコンテンツ・マーケティングとコンテンツ・ストラテジーの違いという内容の記事があがっていました。
同一視されがちな両者ですが、簡単に言えば
コンテンツ・マーケティング
ユーザーとのエンゲージメント構築する事を目的とし、サイトと関連性の高いコンテンツでユーザーから何らかの反応(Call To Actionでも良いと思う)を生み出すもの。
コンテンツ・ストラテジー
見込み客に対してより魅力的なコンテンツを生み出しす戦略を立て、組...
Google Analyticsに「アクティブユーザー数」が追加
Google Analyticsの「ユーザー」レベルに新しく「アクティブユーザー」という項目が加わったようです。
恐らくヘルプはここに該当するんだと思いますが、まだ利用者の間では「なんだ？」といった反応が多いようです。
ヘルプはとても丁寧なのですが、文章が長い！と言う人も多い気もしますが、こんな内容が細かく理由とともに書かれています。
【結局】
・期間のみ指定して「アクティブユーザー」を表示した場合はデータがサンプリングさ...
Analytics APIのセグメントでシーケンスを利用したパターン
Google AnalyticsのAPIで利用できるセグメントは色んな実際のパターンを使いながら覚えていこうと思いますが、単純なパターンでのテストです。
まずはユニバーサルアナリティクスで同一User Idを用いてPC → モバイル → モバイルとアクセスをしてみます。
PCはChrome、スマートフォンはAndroidのChromeです。
Analytics画面で見ると1ユーザー、セッション3と計上されています。
User...
WEBサイト巨大化によるTTI(Time To Interact)悪化
恐らく4月にradwareから発表された記事の影響だと思いますが、ウェブパフォーマンス系の記事が増えたような気がしています。
(参考)
New findings: Retail sites that use a CDN are slower than sites that do not*
この記事タイトルもかなり衝撃的ですよね。
CDNを利用しているサイトなのに、利用していないサイトと比較してページ速度が遅いと。記事内ではCDN利用サイトの方がよりコンテンツがリッチであったり、サードパーティScriptが利用されているとか、色んな要因が書かれています。最終的にはやはりFront-End...
PC側Gmailのデザインがモバイル的なものに変更されるかも
今朝はGeek.comのデスクトップ版Gmailリーク画像が話題になっているようです。
タブ系のデザインは無くなって、メニューはスライド表示がされるようです。
ニューヨーク・タイムズサイトのデザインだったり、Timeのサイトなど、モバイル的なデザインがデスクトップでも増えてきました。
一つは自国だけでなくグローバルに閲覧される可能性があるということは、発展途上国も含めスマートフォンしか持たず、日常的にスマートフォン...
Google SpreadsheetのAddon「Google Analytics」は大量データでも動いて素晴らしい
既に色んな方が利用されていますが、Google SpreadsheetのAddon機能にある「Google Analytics」 ですが、大量データでも普通に動いて凄いですね。
Google公式ということもあって、最近あったAnalytics APIのMetrics系の名称変更も、変更当日からAddon側も新しくなっていました。
ただ一点心配なのは、Reportのレイアウト変更です。レポート設定を変更することでレポートレイアウトが変更されることはありますが、Google起因で変更されないかが個人的に心配だったりします・・・
「アドオン」メニューから「Google...