Web表示スピード研究会

【開催レポート】表示スピードをあげてCVR、売上げを伸ばす!大日本印刷(DNP)のWEBサイトの表示スピードは3秒以内!

表示スピードをあげてCVR、売上げを伸ばそう! 大日本印刷は3秒以内!

表示スピード改善研究会
表示スピードをあげてCVR、売上げを伸ばそう!

去る7月10日水曜日に、表示スピード改善研究会会が(株)ドーモ(東京・築地)のセミナールームで開催されました。2回目の今回は、ユーザー会メンバーの「hontoサービス」を展開している大日本印刷の近藤 洋志(こんどう ひろし)さんに、同社のSpeedIndex3秒以下を目指す取り組みについてお話をいただきました。
また後半は、ニッセンさん、マイナビさんから事前に課題ページの情報をいただき、パフォーマンス課題に対して参加者全員で、どのように改善・対処すべきか?についてのワークショップを実施しました。錚錚(そうそう)たるパフォーマンス識者が熱い意見を交わしました。

今回の参加メンバー:
ニッセン、マイナビ、大日本印刷、オークローン、アムタス、GDO、IDOM (敬称略)

第一部
SpeedIndex 3秒内を達成した大日本印刷「honto」チーム汗と苦闘の5年の歴史

大日本印刷 近藤 洋志(こんどう ひろし)氏
大日本印刷株式会社
hontoビジネス本部ハイブリッドプラットフォーム開発ユニット

株式会社ドーモでは、SpeedCurveの最初の基準値としてU5(アンダー5)、つまりSpeedIndexというメトリックで、”5秒以内の表示を実現しよう”ということを目標にしています。ところがU5どころか、3秒以下(U3)、さらに2秒台前半で、場合により1秒を切っている状態を実現しているのが、大日本印刷が運営している「honto」というサービスサイトです。

今回、hontoでパフォーマンス改善を担当している近藤洋志さんに登場いただき、これまでの取り組みについてお話いただきました。

現在500万人の会員を獲得しているhontoサービスですが、リアル書店、本の通販ストア、電子書籍ストアの3チャネルを連携させた「ハイブリッド型書店サービス」です。もちろん、同社の競合にはAmazonという巨人がいてあらゆるポイントで油断ができない状態です。以前から、スポットでのパフォーマンス計測は実施していたそうですが、昨年夏からSpeedCurveを使い30分おきのタイミングで24時間計測しているといいます。

その徹底した計測ぶりは群を抜いており、そのためにSpeedIndexが3秒以下という結果が実現できているのでしょう。改善施策としては下記の3つに対して注力され、その手法などを解説いただきました。

・不要コンテンツファイルの削除
・CMSブロックの統合(Visually Complate)
・画像の遅延読み込み(PageLoad)

この3秒という数字は、そう簡単に実現できる数字ではありません。CMSがあったり、サードパーティのタグがあったり、大きくブレーキをかける因子がたくさんあるからです。

hontoの今後の課題としては次の3つだそうです。

・BlockingJSの削減
>フロントエンドリファクタリングとしてVue.jsの導入PJ進行中
・画像の最適化
>ImageFluxを使用した商品画像のフロント表示対応開発中
・ThirdPartyの増減監視
>マーケティング部門と増減の際には共有をもらい、変化するか都度確認

こうした次のマイルストーンにむけて、同社はさらに改善を進めています。さらに速い表示スピードが実現できるのか、今後の結果レポートを期待したいと思っています。

GDOのシニアエンジニアでドーモのCTOでもある種村氏は
「hontoさまのパフォーマンス改善の取り組み事例でも触れられていた、上層部のステークホルダーを巻き込むというのは、スピード改善を迅速かつスムーズに進めるためには必須だと考えており、パフォーマンス改善を成功させている企業は上層部、意思決定者を巻き込むケースが非常に多い印象です。」
とコメント。技術的テクニックだけでなく、各部署との連携、予算取りなどの社内政治・調整の課題が明らかになりました。

また後日、登壇した近藤氏からは、次のようにコメントをもらいました。
「私自身、登壇側でセミナーへ参加するのは初めてで貴重な体験でした。今回の登壇で、過去の振り返りを行いましたが、やはり小さいことでも積み重ねで、現在のスピードが実現できていると思いました。現在進行している施策についてもまた共有できればと思っていますし、こんなのも効果あったよと共有していただけたら幸いです。今後SpeedCurveを活かして改善を行い、ぜひ共有し合える場になっていけばと思います」

次に、2つのお知らせをドーモからご案内させていただきました。


お知らせ1
SpeedCurveの使い方

(株)ドーモ カスタマーサクセスチーム スピードカーブサポート担当
北澤 佑馬(きたざわ ゆうま)

SpeedCurveを活用するための基本的な使い方および便利機能の紹介をさせていただきました。これらの資料は後日提供させていただきますが、特にパフォーマンスバジェットという考え方をサポートするアラート機能について掘り下げておりますので、ぜひスピード改善・維持にお役立ていただければと思います。

お知らせ2
パフォーマンスを改善したEコマース40の事例について

(株)ドーモ 代表取締役 占部雅一(うらべ まさかず)

なかなか事例が少ないパフォーマンス改善の成功事例。参加者の中にもパフォーマンス改善予算をどうやってとればいいかという声が多々ありました。そこで今回WPOStatsという SpeedCurve のメンバーであり、パフォーマスエバ年ジェリストの1人のタミーエバーツによる成功事例集です。その中から40のEコマースを抜粋して資料として提供させていただいます。

その中からご紹介したのが、英ファーストファッションのMissGuidedの事例です。iOSに比べてAndroidは,パフォーマンスが悪いことが判明。その原因として,カスタマーレビューやOptimaizeryというA/Bテストなどが遅延原因だということが分かり、様々な改善をした結果、iOSと同じくらいのパフォーマンスにしたところ、Androidの売上げが倍増した事例などをご紹介させていだきました。

英ファーストファッションのMissGuided

第2部  ワークショップ
参加者全員で考えよう! どう直して、いかに速くする?
ニッセン事例、マイナビ事例

今回の目玉は、各事業会社から「うちのサイトをなんとかしてくれ〜!」というお題に対して、問題解決のワークショップです。ニッセンさん、マイナビさんから同社の課題ページを出していただき、参加者とともに解決策を考えてみました。
お馴染みのパフォーマンスメンバーであるIDOMの村田創氏とGDOのシニアエンジニアかつドーモのCTOである種村和豊氏の2名のパネラーと参加者と一緒に、解決策を探りました。参加者自身がパフォーマンス解決メンバーでもあります。経験豊富な強力なパフォーマンス・コンサルメンバーの意見が飛び交う形となりました。

GDOで豪快なパフォーマンス改善をおこなってきた種村和豊氏

「それぞれの担当者は、すでに課題を認識している(現場の担当さまがご自身が自社サイトを熟知している)が、社内の調整、関係性でWEBサイトの速度改善が進まない状況があるという印象を受けました。」
(ドーモCTO &GDOシニアエンジニア種村氏)

ここでは具体的な改善策については、残念ながら割愛させていただきますが、社内で持ち帰って改善策を練る必要を痛感されたようです。場合によっては、袋だたきにもなってしまいそうなこの場ですが、勇気をだして参加していただいた2社に感謝します。


今回のセミナーの総轄として  村田氏、種村の両氏から次のコメントをもらっています。

村田創(むらたはじめ)株式会社IDOM Gulliverマーケティングチーム

「いろんなことが言われる表示速度の世界。速ければ通信量減ってITから喜ばれるし、クロールバジェットという概念でも歓迎されることは、間違いなしです。何よりパフォーマンス改善は、ユーザーの時間を奪わない。
また、この分野はこれまでに挑戦したことのない領域であっても、失敗を恐れず飛び込むべべきです。今後の変化が予測できない状況にある中で、100%成功する施策だけを選んで実行することなど到底できません(が、成功の果実は大きいですよ)。危ぶむなかれ、計ればわかるさ。イーチ、ニー、サーン、表示完了!」

種村和豊(たねむらかずとよ)ドーモCTO&GDOシニアエンジニア

「高いスマホ比率、すきま時間(可処分時間)の奪い合いという背景をふまえると、昨今のサイトにおける速度改善は、ビジネス的な観点でも無視できないテーマです。部門を超えてサイトパフォーマンス改善を進める、ムード、雰囲気の醸成が重要であると確信しています。またSpeedCurveを活用することで、経営、マーケティング・販促、システムが共通の目線でサイトのパフォーマンス速度、課題を認識しながら、一体感を持った改善、WEBサイトモニタリング&改善のカルチャー醸成を図ることができると考えています。」

ワークショップの評価メンバーは、IDOMの村田氏とGDOの種村氏。両氏を中心に参加メンバーとともに、課題認識と解決メソッドについて熱いトークが展開されました

PSI、表示スピード、コアウエブバイタル INPの各対策については