「インターネットメディアにおけるコンテンツ表示速度と収益性の改善手法とは?」イベントレポート

ウェビナーの映像はオンデマンドでご覧いただけます。リンクはこちら
Webサイトの分析に関して、マーケティング観点によるアクセス分析手法は確立しているものの、表示速度を分析する方法と改善手法に悩みを持つインターネットメディア運営者は多くいます。機能拡充のために導入した3rd Partyコンテンツや、過剰な画像品質により、表示速度を悪くする例があります。

そこで、本イベントでは、コンテンツ表示速度・収益改善へのインパクトの「見える化」に関するご紹介と、アカマイの超分散型エッジプラットフォームを活用した表示速度の多彩な「最適化」手法を、事例を交えてご紹介致します。ウェビナー内では、実際にメディアの立ち上げ、運営経験があり、近年上場された株式会社Branding Engineerの河端 保志氏をゲストに招き、質疑応答を交えながら進行いたしました。今回はその模様をダイジェストでお伝えします。

プロフィール


河端 保志(かわばた やすゆき)
株式会社 Branding Engineer
代表取締役CEO

1989年生まれ。2014年電気通信大学大学院卒業。同院にて人工衛星の姿勢制御の研究を行う傍ら、個人で営業活動やコンサルティング業務を経験。リクルートやDeNAでのインターンを経験した後、13年大学院在学中に株式会社Branding Engineerを創業。フリーランスエンジニアと企業のマッチングサービスであるMidworksを中心とし、実践的なノウハウを生かしたプログラミングスクールtech boostを運営するなど、エンジニアの創出からエンジニアリソース提供までを事業展開。


鈴木 昌彦 (すずき まさひこ)
アカマイ・テクノロジーズ合同会社
シニア・ソリューション・エンジニア

2017年にAkamaiに入社。メディア、OTT、ゲームなどエンターテイメント関連の顧客を担当し、ソリューション提案を行う。第一部「インターネットメディアにおける「コンテンツ表示速度」の重要性について」を担当。


金児 仁史(かねこ ひとし)
アカマイ・テクノロジーズ合同会社
シニア・テクニカル・ソリューション・アーキテクト

多様な業界の顧客に対しWebパフォーマンス改善に向けた分析の提案を行う。
第二部「コンテンツ表示速度の「見える化」と「最適化」を実現するには?」を担当。


第一部:インターネットメディアにおける「コンテンツ表示速度」の重要性について

コンテンツ表示速度を改善して収益増加へ

メディアサイトにおいて良質なコンテンツ、SEOの改善は重要ですが、コンテンツの表示速度を始めとしたUXは、メディア収益に影響するという主題の第一部。最初に、なぜコンテンツの表示速度が重要かを伺いました。

上記の表のとおり、コンテンツ表示に遅延があると、ユーザーの離脱を招き、コンバージョン率が下がって機会損失となると言われています。

実際に、2012年2月には、米小売最大手のウォルマートが「応答速度が遅いと売上が低下することを実証するレポート(Page Performance & Site Conversion)を発表しており、この頃からEC事業者を中心にページ表示速度の改善意識が高まったそうです。現在では、Googleから、ユーザー体験の新指標(Core Web Vitals)ならびにそれらのSEOへの影響などが発表され、多様な業界でページの表示速度やUXが意識されるようになっています。

メディアサイトの運営においては、ビジネスKGI、KPIを設定していくことになりますが、サイトからの収益を増やす方法を細分化していくと、コンテンツ表示速度の改善が様々なKPIに寄与することがわかります。例えば「滞在時間を増やす」というKPIに対して表示速度がどのように影響するかについては、後述するTelegraphの事例を元に解説が行われました。

Telegraph(テレグラフ)の成功事例

イギリスの最も歴史ある新聞会社であるTelegraphは、Facebookよりも10年前にWebサイトを立ち上げ、デジタルパイオニアとして活躍しています。そのビジネスモデルは、広告収益と有料会員会費の2本立て。メディアには画像を多用しており、トップページに150以上、ヘッドニュースに60以上、小さな記事でも20以上と、リッチな構成となっていますが、その分サイトが重くなり、ユーザー体験の悪化が問題視されました。Telegraphは、ロード時間とサイトの滞在時間、ならびに収益性に関係性があると考え、実際に画像を軽量化しロード時間を改善し、UX向上によりセッションあたりのページビュー数が0.09以上増加しました。サイト全体のページビュー数が増えることで広告のインプレッション数が底上げされ、月650万円以上もの広告増収につながるという結果が得られました。

Telegraphはこれらの体験を元に、サービス規模別のシミュレーションをホワイトペーパーとして出しており、イベントでは、鈴木氏がペーパーをかみくだいて作成したマトリクスについて説明をいただきました。

(画像は、ホワイトペーパーを元に鈴木氏が作成したもの)

AkamaiではTelegraphのメディア運営の技術支援も行っているそうです。

新たなユーザー体験の指標

続いて、Googleが新たに発表したUX指標である「Core Web Vitals」について解説いただきました。以下の3つの指標から構成され、Good領域の数値を満たすことが望ましいとされています。
・Largest Contentful Paint(LCP):主要コンテンツの読み込み時間
・First Input Delay(FID):ユーザーのクリック等入力から応答までの時間
・Cumlative Layout Shift(CLS):表示レイアウトの安定性

この指標を改善することで実際に収益向上に成功したメディアサイトとして「Netzwelt」を紹介いただきました。同メディアでは3指標の改善により、PVが27%増加、広告収益が18%増加、ビューアビリティが75%増加しました。また、インドのメディアNDTVではLCPを50%改善することで直帰率が50%減少、収益増加につながりました。Yahoo!JapanでもCLSの改善によりPVや滞在時間が改善されました。Core Web Vitalsは、2021年6月のGoogle検索エンジンアップデートで、検索ランキングにも影響を与える指標として追加になっています。

第一部総括

第一部では上記の項目とサマリーについてご解説いただきました。実際にAkamaiへは、メディアのリッチ化によるサイトの重さをどう解消すればよいか、自社サイトの速さの計測方法はどうしたらよいか、といった相談が寄せられているそうです。

第一部を聴いて、河端氏は「メディアの目的は元々2つで、1つ目はad networkで収益を上げる、2つ目はユーザーを集める、になりますが、やはりこの2つのいずれにも表示速度が影響してくるというのは自分でも経験してきています」と感想を述べました。現在は内部のエンジニアと相談しながらサイトの改善に取り組んでおり、Core Web Vitalsについても注目をしているそうです。
Core Web VitalsについてはAkamaiへの相談も増えてきている一方で、まだその指標管理のレベルまで追いついていないというメディアもあり、各ユーザーの状況に合わせてサポートが行われています。第二部では、Core Web Vitalsのデータの指標管理方法について触れています。

第二部:コンテンツ速度表示の「見える化」と「最適化」を実現するには?

第二部では、第一部で伺った内容を踏まえ、ユーザーの課題の解決方法についてお伺いします。

画像サイズを最適化するAkamai Image & Video Manager

まずは、表示速度改善に必要な画像サイズの軽量化について。従来であれば、一つ一つ重い画像を圧縮したり、すでにアップロードされてしまった重い画像を探し当てては差し替えたり、といった作業が必要でした。Akamai Image & Video Managerでは、画像の印象を変えないレベルで圧縮、フォーマットの最適化、アクセスデバイスによるサイズの最適化を自動でやってくれます。手間がかかっていた作業をツールが行ってくれることで、Webマーケティング担当は、本来の業務であるコンテンツ制作やUX改善に取り組む時間を取りやすくなります。

実際の導入事例として、アクセス数が3倍になりトラフィック過多となってしまったお客様の課題に対し、Akamai Image & Video Managerを採用することで、配信画像全体の容量を33%削減、大きなサイズのJPEGでは90%以上削減できたケースもありました。画質に関しては、Webデザイナーからも高評価をいただいたそうです。

また、画像は圧縮だけでなく、画像の変換も、簡単に可能です。

Image & Video Managerデモ

ここからはImage &Video Managerのデモ画面を見せていただきながら機能のご説明をいただきました。

表示されているSaved Bytesの数字から、本ツールを入れたことでどれくらい画像容量が削減されているかが一目でわかります。また、画像は簡単に編集が可能で、ロゴを入れたり、有料会員限定コンテンツとしてぼかしを入れたりすることができ、画像の上に載せた文字等のサイズや角度等をクエリ文字列で簡単に変更することもできます。

適用前後のPageSpeed Insightsの改善例も紹介がありました。

自社サイトのパフォーマンスを可視化してくれるmPulse

次に、自社サイトが速いのか遅いのか可視化してくれるmPluseをご紹介いただきました。Core Web Vitalsを含むパフォーマンスデータの可視化や課題の特定、直帰率やCV率、Page ViewといったKPI分析、パフォーマンスと収益の相関分析などをしてくれます。

実際、定番の分析ツールでは難しかった分析が簡単になり、IT部門の負荷が減ったというユーザーの声が寄せられたそうです。また、調査で3rd Partyとして導入しているJavaScriptのパフォーマンスが遅かったことが判明し、該当のJavaScriptファイルに対策を講じたところ、速度が改善し、CV率が向上したという結果も得られたとのことでした。

ここからはmPluseのデモを見ていきます。

このグラフでは、横軸にパフォーマンス(LCP)、縦軸に直帰率を取っており、最も直帰率が低いパフォーマンスデータが、このサイトが目指すべき目標の一つの指標になるにロード時間を設定すればよいということがわかります。

また、下のデータ群からは、Core Web Vitalsのリアルタイム数値の確認や、デバイスやページごとの課題を可視化して見ることができます。全体値としては適正値になっていても、内訳の項目ごとのパフォーマンスまで細分化して表示されるため、より精緻にページの状態を知ることが可能です。

また下のデッシュボードでは、サイトが遅い原因になっているファイルの特定する例についても、紹介がありました。

EdgeWorkersで、サーバ負荷軽減とCookie規制対応を実現

日々状況が変わる個人情報対応については、頭を悩ませているメディア運営者も多いことでしょう。Cookie規制においては、EC等の事業者の1st Party Cookie、アクセス情報をトラッキングしてCVに至っていない商品情報を別ドメインで広告表示する3rd Party Cookieのうち、3rdParty Cookieについてプライバシーの観点から問題視され始めています。

ここでは、プライバシー規制に伴うCookieへの対応について、EdgeにおけるサーバーレスコンピューティングであるEdgeWorkersの活用方法をご紹介いただきます。

EdgeWorkersでは、Akamaiのプラットフォーム上にある世界中の345,000台以上のサーバーに、デベロッパーがそれぞれのJavaScriptのCodeを展開し、ユーザーに近いロケーションでV8 JavaScriptエンジン上で実行することができます。仕組みとしては上記の図の通りとなり、EdgeWorkersがクライアントとサーバの間でロジックを実行します。

例えばECサイトのセール時期などは、アクセス集中に対してコンテンツデリバリーネットワーク(CDN)で対応し、サーバ負荷を軽減できます。エッジコンピューティングはクラウドサーバ負荷軽減だけでなく、Cookieの操作のように、オリジンサーバー上で行っていたユーザーごとのパーソナライズに係る処理をエッジで実行するといったきめ細かな処理に活用することも可能です。このように、Akamaiのソリューションは、パフォーマンス測定、悪化原因の特定と解決、Cookie規制対応と、メディア運営における幅広い課題をカバーしています。

第二部総括

第二部では実際のソリューションについて解説いただきました。終了後には河端氏より、無料ツールとの違いについて質問がありました。鈴木は、ビジネス指標(KGI、KPI)に対するパフォーマンスのデータがすぐ比較できる、データが蓄積されることに強みがあると回答。誰でもデータを視覚的に分かりやすく確認できることで社内のマーケターやUXデザイナーとも対話がしやすいというメリットがあることがわかります。

また、新たなSaaS導入においてはOJTがあると助かることも多々ありますが、サポートはどうなっているのでしょうか。Akamaiのお二人によれば、Akamai社内にはデータ分析のスペシャリストがおり、アドバイスをもらうことが可能とのこと。実際にmPluseを使い始めてメディアの課題が見えてきたら、Image &Video Managerによる画像サイズの削減など、課題に応じたソリューションを提案ができるところに無料サイトとの大きな違いがありそうです。また、EC、ブログ、ニュースサイトなど、目指すべき指標についてもアドバイスをもらえるとのこと。

サイト規模にもよりますが、基本的には申し込んでセットアップが終わればすぐに使い始めることが可能。今回紹介いただいたのはmPluseのエンタープライズ版という有償版になりますが、実際にはmPluseライト版も存在し、一定期間無償でフルパッケージを試すこともできるそうです。ご希望の方はinfo_jp@akamai.comまでご連絡ください。

最後に、河端氏より、サーバーレスコンピューティング導入のメリットについて質問がありました。鈴木氏からは、サーバー低遅延という構造に加え、従来は開発にあたってエンジニアが個別のAPIを触る必要がありハードルが高かったが、EdgerWorkersを利用すると、JavaScriptという多くのエンジニアが慣れている言語でAkamaiのCDNを使ってもらえ、サポート側もJavaScriptでサポートが可能となることでエンジニアの負荷が下がり、デリバリーまでの時間が短くなることが挙げられました。

LIVE Q&A

ウェビナー後はリアルタイムでQ&Aセッションが行われ、事前質問を含め多くの回答をいただきました。

質問1:表示速度向上をすることにより、広告収益増加以外のメリットはありますか。
回答1:(鈴木)アフィリエイト以外に人材紹介など、メディアによってコンバージョンを向上させたいコンテンツは多様に存在するかと思います。いずれの場合も、ロード時間改善は離脱率削減につながりますので、コンテンツのCVに結果的に影響すると考えられます。

質問2:小規模のメディアサイトに対しても効果がありますか。
回答2:(鈴木)小規模の定義にもよりますが、Telegraphの事例で説明したものをベースにしますと、ホワイトペーパーの中で5,000万PVのサイトであっても効果があることを確認できています。

(再掲)

質問3:画像および動画の最適化をすることによって、どの程度の導入効果があるか導入前に見積もることは可能でしょうか。
回答3:(金児)画像1枚ずつ、ページ全体でも削減効果を事前に見積もりが可能です。

質問4:今回紹介されるAkamaiの仕組みはどのように導入すればよいでしょうか。
回答4(金児):今回のイベントでは3つのソリューションを提案させていただきましたが、どのソリューションでも、既にアカマイのプラットフォームをお使いであれば簡単に導入開始することができます。またアカマイを導入前のお客様も、DNSのレコードを変更いただくことで、今回ご紹介したソリューションを含むアカマイの機能を簡単に導入いただけます。

質問5:高速化によるPV増加は、検索順位改善による結果という理解でよろしいでしょうか。また、ページ表示速度が改善されると、どれくらいPVが伸びるかという指標はありますでしょうか。
回答5:(鈴木)下記スライドで説明させていただいておりますが、PV増加とはすなわちKPI-2にある訪問者数を増やすというものに起因します。今回はご紹介の時間がありませんでしたが、Whatif分析という、パフォーマンス改善によりどれくらい改善が見込めるかシミュレーションができるツールも存在しますので、ご希望の方はお問合せ下さい。

(再掲)

質問6:Akamaiを利用していない場合に、mPulseをどのように導入すればよいでしょうか。
回答6:(金児)mPluseについては、オリジンサーバにJavaScriptスニペットを入れることでデータを取得可能ですので、Akamaiを導入していなくてもご利用可能です。

質問7:現在、次世代フォーマットの画像は一部ブラウザでは表示不可となっていますが、次世代フォーマットはこれから主流になっていくのでしょうか。
回答7:(金児 )これまでの画像のフォーマットとしては、JPEG、PNG、GIF等が主流でありましたが、WebPといったフォーマットが主流になってきています。Google PageSpeed Insightsでも次世代フォーマットが改善項目として表示されます。WebPがスタンダードになりつつあるもののAVIFも少しずつ使われてきておりますので、まずはWebPに対応しつつ、今後の流行を見ながらImage & Video Managerのようなソリューションを利用して、オリジンサーバー側では手間をかけずに適用を広げていくのが望ましいかと思います。(鈴木)なお、AVIF はImage&Video Managerでもカバーしております。

今回は、サイトのパフォーマンスを改善して収益を上げていくにあたり気を付けたいポイント、ならびにその改善方法についてソリューションの解説をいただきました。Akamaiのソリューションに関心を持たれた方はこちら(info_jp@akamai.com)までご連絡ください。

EdgeWorkersの30日間無料トライアル

イベントアーカイブ動画
こちらからアーカイブ動画視聴のお申し込みをいただけます

この記事はスポンサーとの企画によって制作された特集記事であり、編集部の意見が反映されたものではありません。