特別企画

無料診断でImpress Watchのスマホサイトをプチリニューアルしてみた(前編)

「すべてが平均点以下」という衝撃の診断結果が!

最後のリニューアルは1年余り前。ほったらかしのスマホサイトをなんとかせよ!

  • 【お知らせ】記事中でご紹介したドコモ・ドットコムの無料診断サービスは、2014年3月20日に提供を終了いたしました。(編集部)

 「すずまりさん、うちのサイト、スマホでよく見ます?」ある日、お世話になっている営業K氏に聞かれた。営業だけにスマートフォン用ページのアクセスが気になっているようなのだ。

 筆者は大昔Webページ制作を経験したこともあるため、その視点から見てどうかということらしい。執筆した記事が取り上げられているかどうか確認するときや、旬の記事を読むために時々アクセスするが、媒体にすぐ移動できないところが不便だと告げた。すると、画面右上にある「メニュー」というボタンが媒体一覧だというではないか。恥ずかしながら「メニュー=媒体一覧」とは全く気づかず。それ以前に、視界に入っていなかったかもしれない……。

診断のターゲットは「Impress Watch Headline」

 聞くと、スマートフォン対応は2010年7月。パソコン用サイトのリニューアルに合わせた形で、2012年12月にリニューアルをしたそうだ。しかし、その後手を加えぬまま現在に至るという。1年余りといえば短いようだが、その1年間にフィーチャーフォン(ガラケー)からスマートフォンへの移行が急激に進んで、利用端末に占める割合が半数近くに迫り、画面の解像度が大きく向上するなど、モバイル端末の利用状況は劇的に変化しているのはご存じの通り。

 特にユーザー層の変化は顕著だ。かつてはパソコンの利用経験が豊富で、先進的かつリテラシーの高いユーザーが大半を占めていたが、現在では、スマートフォンがインターネットの唯一の入口という層を含め、それ程リテラシーの高くない、いわゆる「一般的」なユーザー層へと広がっている。当然、Impress Watchへの訪問者にも変化があるだろう。

 アドバイスを求められたが、専門外である。スマートフォン用サイトにはパソコンとは違う何か大事なポイントがあるはずだが、具体的に指摘するのは難しい。それ以前に、自分自身がユーザーとして長年パソコンから利用しているサイトだけに、慣れもあるし、なんとなく使えているからよしとしていた部分があるため、そもそも気づかない問題も多いはずなのだ。

 そこで、専門家のアドバイスを受けてみてはどうかと提案した。IT業界の専門媒体がコンサルティングを受けるというのは屈辱的かもしれない。しかし、修正をするとなればそれなりに工数がかかる。本当に改善を望みたいなら、Impress Watch社内スタッフと筆者がトライ&エラーで悪戦苦闘するよりよほど効果的だろう。

モバイル専門でコンサルティングできる会社を探せ!

 そんな話をしたところ、リニューアルにお付き合いすることになってしまった。編集部からは「せっかくだからリニューアルしたら記事にしましょう。すずまりさん書いてくださいよ!」という追っかけの依頼もあり、「なぜ私が!?」と思いつつ、まずはコンサルティング会社探しである。

 今回は自社サイトの問題点を洗い出して把握するという点を重視していることと、Impress Watchには運用技術部門があり、今回は基本的にサイト改修を社内で対応する予定であることから、コンサルティング=制作の発注というソリューションではお願いしにくい。そこで、モバイルコンサルティングだけを専門に行っているところはないかと探したところ、見つけたのが「ドコモ・ドットコム」(http://www.docomo-com.com)だった。

株式会社ドコモ・ドットコム
http://www.docomo-com.com

 「ドコモ・ドットコム」を選んだ理由は3つ。まず、NTTドコモの100%子会社で、iモード時代からのケータイビジネスコンサルティング歴が14年と長い点に着目した。現在でも様々なスマートフォン用サービスのコンサルティングを続けており、まさに経験と実績を積んだプロ集団。解決策の引き出しも多そうである。

 次に、機械的な分析に頼るのではなく、すべてにおいて専門スタッフの目による分析が行われるということ。SEO的なHTML解析や、ランディング云々ではなく、純粋にスマートフォン用サイトのインターフェイスの向上と、コンバージョンアップ、つまりサイトが望む結果を得られることを目的としているため、媒体として望む結果につながるアドバイスがもらえそうな気がしたのだ。

 決め手は「スマートフォン無料診断」というサービスの存在だ。Webサイトから診断してほしいスマートフォンサイトのURLを送ると、「認知性」「操作性」「快適性」「訴求性」「デザイン性」の5つの視点から点数付きで診断してくれるという。診断レポートは概ね1週間程度で作成され、届けられるようだ。営業K氏も現状を知るいい機会だと納得し、Webページから申し込みを済ませたのであった。

スマートフォン無料診断

IT専門媒体のスマホサイトなのにすべてが平均点以下という衝撃の展開!

 申し込みを済ませて待つこと1週間。全14ページからなる「スマートフォンサイト無料診断結果報告書」が届けられた。ドコモ・ドットコムの担当の方から直接手渡しでレポートをいただき、改善点についてのレクチャーを受ける。K氏、Impress Watch社内のサイト担当者2名、筆者の計4名でお話を伺った。診断を申し込んだのは「Impress Watch Headline」のスマホ用URL( http://m.www.watch.impress.co.jp/ 、閲覧はモバイル端末のみ可能)だ。

無料診断結果の総合レポート。まさかの平均点以下に一同驚愕

 認知性全13項目、操作性全9項目、快適性全13項目、訴求性全12項目、デザイン性全12項目、合計60項目から診断していただいたその結果は、なんと100点満点中58点だった。過去診断された100社の平均点が67.85点というから、平均から約10点も下回っているではないか。

 それだけではない。認知性、操作性、快適性、訴求性、デザイン性、どれを見ても平均点以下なのである。特に「目的のコンテンツやサービスの認知・誘導が適切な作りとなっていない箇所がありました」というのは、記事を広く見てもらいたい媒体としてはイタすぎる結果だ。

 さすがにこの展開は想像していなかった。もう少しマシだろうと思っていただけに、営業K氏も苦笑い。担当の方によれば「情報系のサイトという性質もなきにしもあらずですが、パソコン用のサイトをもとにしてスマートフォン用のサイトを作っていると、こういう結果になりがちです」とのこと。聞けば、Impress Watchでは確かにパソコン用のサイトをベースにしているという。思い切り地雷を踏んでいたようだ。

 全体の総評の次は、「認知性」「操作性」「快適性」「訴求性」「デザイン性」の5項目についての指摘箇所が1ページにまとめられていた。至るところに突き刺さる指摘が見える。その数合計25箇所。赤字で記された部分は、その先の資料で改めて具体的に説明される部分だ。

全体の問題が俯瞰しやすいよう、1ページにまとめてあった

サイトの問題が次々とあぶり出される

 指摘箇所の中でも、特に問題と思われる部分を具体的に説明していただいた。

 「認知性」「訴求性」に関する問題として、重要な情報やリンクを隠してしまっていることや、サイトアピールがやや弱いと感じられるという指摘を受けた。ユーザーが真っ先に目にするスペースが活かし切れておらず、肝心の媒体も訴求できていないという。確かにTOPページを開き、初めての訪問者のつもりで見てみると、何のサイトか今ひとつピンとこない。また来たいサイトだと思ってもらえない可能性大だ。

媒体の訴求は大事だ

 冒頭で筆者も見落としていた「メニュー」ボタンも、気づいて展開したところで、各媒体の特徴や説明が足りないと指摘された。これらは、すでにパソコンでサイトを知っていると当たり前になってしまって見落としがちな点だろう。

 初めて来る人の視点が欠けていた……と反省したところで、さらに追い打ちがかかる。「開いたウィンドウを消す方法がないので、仕方なくブラウザーや端末の[戻る]ボタンを押しますが、それだとウィンドウを消すのではなく、前に表示していたページに戻ってしまいます。その戻り先が検索結果一覧ページだった場合は、そのまま他サイトなどに行ってしまう可能性が高まります」この指摘には無言になるしかなかった。

いろいろと問題を指摘された媒体一覧

 早くもTKO状態だが「認知性」にも大きな落とし穴があった。突然パソコン用のページに遷移してしまうリンクがあったのだ。

突然パソコン用のページに飛ばすのはNG!

 数年前なら「スマホ用のページはこれからだから、この先はまだ仕方ないんだろう」と利用者側も納得したかもしれない。しかし現在では、スマホ中心の層、パソコンを持たない層もおり、パソコン用のページへいきなり遷移するとそのまま戻ることなく脱落するユーザーが多いという。また、30代から年齢が上がるにつれて、ユーザーインターフェイスに関する不満も上がっていくというが、確かに突然極小の文字を見せられたら驚くはずだ。

 だからといって、すべてスマートフォン用に作り直せるわけでもない。やむなくパソコン用のページに遷移する場合は、あらかじめそれとわかるアイコンを付与することを勧められた。そういう配慮があるだけでも、印象は全然変わってくるのだという。

 「操作性」においても基本的な問題を指摘された。タップできる箇所がブロック全体ではなく、画像とテキストリンクに限られるため、誤タップ招きやすいという。

タップできる部分が狭すぎると、誤操作のもとに
画像とリンクされたテキストのみタップできるが、場所によってタップしにくい部分も

 パソコンからのインターネットユーザーなら、ハイパーリンクがどのようなものかを学習しているだろう。その知識を踏まえてアクセスすればタップできる箇所は想像できるが、その経験がないとタップしても反応しない部分に困惑してしまうというのである。これはブロック全体をタップ領域にすることで回避できる問題だが、パソコン用サイトやiモードサイトから、スマートフォンに変換した企業に多いパターンだと教えられた。

 また、ヘッドラインページから各媒体の記事へ、一方通行になっている点も指摘された。記事1つだけなら戻るボタンで戻れるが、複数読んだあとでは、さかのぼることを諦めてしまうだろう。各下層ページ間を行き来できるようにするなど、遷移フローをわかりやすくしたいところだが、各媒体を含めたサイトの構造に影響するため、ちょっとした課題になりそうだ。

導線が一方通行に。ヘッドラインをサイトのTOPページと認識された場合、不親切な印象を与えてしまう

 このほかにも、ページの下に「上に戻る」リンクがないことや、媒体別のタイトル画像が各媒体TOPに遷移できると分からないこと、新着記事リンクが1つの塊に見えてしまうことなども指摘された。

 「上に戻る」リンクがないのは、これもパソコン用のサイトをベースにしたためで、パソコン用のサイトに「上に戻る」リンクを設置していなかったことに起因しているという。この状態だと、利用者のうちかなりの数が、何画面分も上スクロールで戻る手間をかけず、そのままどこかに消えてしまうだろう。「閲覧の流れができるだけ途切れないようにする配慮が必要です。これがECサイトなら、致命的な影響を及ぼします」との言葉に、営業K氏の顔が厳しくなった。

リンクに関して、まだまだ問題が
長いスクロールで下までいって、上には戻れなかった
文字の塊に圧倒されてしまう恐れがあるという

 そこまでチェックされていたかと唸ったのは、サイトのタイトル画像の使い方だった。画像をタグの指定で拡大使用している箇所が見つかったのである。オリジナルサイズを無理矢理引き延ばして配置しているため、せっかくの媒体名がボヤけた印象に……。「ファーストビューで最初に見えるものがきちんと丁寧に作られているかどうかもイメージを左右します。使い回すのではなく最適なものを」という担当者の言葉に、黙って頷くほかなかった。

1年あまり前のリニューアル時に当時のスマホ解像度に合わせて用意した画像だが、最新のスマホでは画像がボケてしまう結果に

見えないバケツの穴をふさげ!

 ご指摘いただいた25箇所のうち、赤字で記された8箇所を中心に丁寧に説明していただいた。この25箇所というのはあくまでも無料診断で提供される「サイト分析」の一部で、氷山の一角にすぎない。

 無料診断で見てもらえるのは、サイトのユーザビリティ診断のみで、たとえばアクセスが低いコンテンツがメニューの上部で大きな場所を占めているといった、アクセス解析に基づいた診断まではサポートしていない。これより先のコンサルティングを依頼した場合には、ユーザビリティのほか、「競合分析」「アクセスログ解析」「市場分析」「ユーザー調査」などを徹底的に行うという。

無料診断でわかるのは「サイト分析」の一部に過ぎない

 ドコモ・ドットコム担当氏によると、「これをやって何パーセントの効果があるの?」という質問もよくあるという。修正1つでいえば、コンマ以下のパーセント程度かもしれないが、バケツの底に空いた穴に変わりはない。そういう小さな穴を1つずつ丁寧に塞いでいくことが大事なのだ。どこに空いているのかわからないが、大事な水がじわじわ漏れている。肉眼では見えにくい穴の場所を明確にしてくれるのがコンサルティング、というわけである。

 ちなみに、Impress Watchではニュースを読むのに会員登録は不要だが、ECサイトなどでは会員登録が必須となる。スマートフォン用のサイトでは電話番号ひとつを見ても、「03-1234-5678」のように入力させようとすると、「-(ハイフン)」の入力が面倒で離脱してしまうこともあるという。サービス提供側ではあまり気に留めなかったような小さなことが、売上に直結するケースもあるというわけだ。

 Impress Watch Headlineページだけでも25箇所の指摘があり、この時点で考えさせられることが多数浮かび上がっている。何よりパソコンの延長としてとらえていたことが大きな問題であるとわかったのは大きな収穫だった。リニューアルしてから1年余り。時代の変化に合わせてこまめに修正していなかったことを大いに反省しつつ、まずは指摘された箇所を修正して、プチリニューアルを行おうということになった。

 後編ではそのリニューアルの内容と、効果測定の結果をお届けしたい。

すずまり

プログラマからISPの営業企画、ウェブデザイナーを経て、現在はIT系から家電関連まで、 全身を駆使してレポートする雑食性のフリーライターに。主な著書に「Facebook仕事便利帳」「iPhone 4 仕事便利帳」(ソフトバンククリエイティブ)など。 睡眠改善インストラクター、睡眠環境診断士(初級)。