Page Speed Insight / GTmetrix vs. 表示速度 - User Experienceのために学ぶこと

User Experience(ユーザーエクスペリエンス)とは?

スポンサードリンク

今考えているのは、よいブログページというのはどういうものだったかということ。

今さら… というのではなく、サイトを運用しようとする者ならすべての人が、いつでも意識していることなのだろうなと思うのですが…

サイトを運用する技術がまだ未熟ですから、私の場合はなかなかバランスがとり切れず、「表示速度」というとそればかりを追いかけるような状態になりがちです。
ただ、未熟ながらも、「自分がユーザーであったなら…」という視点で

  • ページの内容
  • ページのデザイン
  • ページの機能

を制御できるようにならなければいけないと思っています。

ページの表示速度を中心に測定やアドバイスをくれる Page Speed Insight。そして、

モバイル端末でのページの使いやすさをテストします。

というMobile Friendly Test は、ページの機能やデザイン(レイアウト)の機能面を診断してくれるサービスですね。

mobile-friendly-test-main-page
Modile Friendly Test

そのとき思い出す言葉が User Experience。

 

MEMO:
翻訳の仕事でも、自動車と言わず、モーターサイクルと言わず、ソフトウェアやアプリなど、あらゆる分野でここ4~5年あたりからでしょうか、頻繁に目にするようになった言葉です。
そのままでは日本語にならない言葉で、最近使われている「ユーザー経験」「ユーザー体験」という言葉の言語です。

「ユーザー経験」という訳語にしても「ユーザー体験」にしても、個人的には、あまりに直訳で分かったような分からないような翻訳語だなと感じているのですが…^^; さりとて、ほかには「ユーザーエクスペリエンス」くらいしか訳しようがない言葉でもあります。

Page Speed Insight, Mobile Friendly Test が測定してくれる Experience は?

私の理解と私の言葉で説明してみるとすれば、ページの内容、デザイン、機能からユーザーが感じるもの・得るものなどをひとまとめにしたものです。

  • 目で見て感じるもの
  • クリックしたときの反応や次に見えるもの(聞こえるもの)
  • 文字の大きさや色
  • 画像や動画の大きさや音、その内容
  • 記事を読んで感じるもの、などなど

が User Experienceです。

その中で Page Speed Insight が測定し示してくれる表示速度が話題に出てきやすいのは、サイトを訪れてくれるユーザーが真っ先に出会うエクスペリエンスがページのレスポンス(リンクなどからの呼び出しにすぐ応えてくれるかという意味での表示速度)だからですね。

サイトにアクセスしてくれる人の割り合いが、モバイルデバイスのユーザーの方が多い、なおかつ、
Google の「モバイルサイトの速度をテストしましょう。」の計測中のページにあるように、標準接続(3G)のユーザーが多いとなれば、表示速度をいかに高めるかという話しが中心になってくるのは当然のことですね。

one-of-displays-on-webpagetest
WebPageTest で計測中…

ただ、ここで注意しなくてはいけないと思っているのは、

  • 見てもらいたいと思っているページ(デザイン)と読んでほしいと思っている記事(内容)
    そして
  • そのデザインと内容をどんな技術(プラグインやサービスなど)を使って表現しているか

というサイト側のコンセプトと表示速度に対応している技術のバランスです。

諸先輩のアドバイスにも挙げられていることがありますが、たとえば、

  • サイトの表示速度を優先するか、
  • そのために Google Analytics の分析機能に必要な JavaScript を外すか

などがその好例です。

下のスナップショットは、表示速度を上げるために CDN を導入してはどうだろうと考えるときの私の環境(の一部)です。

structure-and-pagespeed
サイトの構造と目的を考える

「オーバーヘッド」ということを考えよう

GTmetrix で測定してみると、画像、特にWordPressやテーマが自動的に準備している縮小版のアイキャッチ画像が表示速度をスポイルするボトルネックになっているらしいということが分かります。
そして、CloudFlare のような CDN が対処として表示されています。

CSS/JS Minify

ところが、CloudFlare に画像といっしょに CSS/JS を縮小処理させようとすると、
使っているテーマ Poseidon がページを表示できなくなるという不具合が懸念されます。

CloudFlare 側の Rocket Loader に、この不具合を避けるオプションがあるかどうかが問題です。

Google AdSense, Google Analytics

この2つのサービス(対応するJavaScript)との適合性がとれるかどうかも問題です。

WPTouch Pro Power Pack
スポンサードリンク

もし CloudFlare を選ぶとすれば、Power Pack との互換性の確認も必要です。

522 Error

同じように、インターネット上で挙げられている 522 Error の発生率が増えるという話しにも確認と対策が必要でしょう。

つまり、表示速度を上げる=CloudFlare 導入 という一つをとっても、速度アップというメリットと(考えられる)機能上の問題(デメリット)が一体となっていることを忘れないようにしなくてはいけないのです。

 

スポンサードリンク

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です