先日、SEOに関する社内勉強会に参加したので、そのメモを記録します。
昨日は、SEOの社内勉強会でした🙂
Core Web Vitalsが2021年5月からランキングの要因になるって知りました😂バナー等の画像が最も着手しやすい改善で、適切なサイズでの配置(HTML/CSSでの調整×)、ファイル形式、読込の順番などあり、担当業務の仕事が盛り上がりそうです😭
UX改善の需要が増える✨
— ふらんぶ🌿@UXデザイナもどき (@dayantler) April 16, 2021
筆者は、サービスデザイナーとして勤務しています。
Webサイトの改善には、PageSpeed InsightsやLighthouseを使っています。
今回は2021年5月から「Web Vitals」という指標が導入されるということで参加しました。
正確には、「Core Web Vitals」ってなんぞやという好奇心。。。
Webサイトの改善って?
Webサイトはただ作るだけでなく、そのWebサイトに存在価値をつける必要があります。
Webサイトの様々な問題を解決して、検索エンジン(Google)から信頼性の高いWebサイトと認識してもらいます。
結果として、検索に引っ掛かりやすくなるわけです。
たしか。。。少し前のアップデートで個人ブログは上位に上がりにくくなったとかなんとかあったかな(><)
それは置いておいて、デザイン・コーディングだけでなく、Webサイト内部の対策も必要というわけです。
「Web Vitals」とは?
UXってご存じですか?
「ユーザーエクスペリエンス」の略で、ユーザーの体験を意味します。
Webサイトを訪れたユーザーが快適にWebサイトを使うことを目的としています。
そのユーザーエクスペリエンスを高めるためのGoogleの取り組みです。
Googleのプラットフォームに参加している方は、その取り組みへの参加は必須です笑
「Webサイトの管理者さん、ちゃっとやってね」という通達なわけです。
その取り組みをやるといっても、何からやればいいねん?
優先度ってもんがあるやん・・・
はい。「Core Web Vitals」
直訳「中心的(Core)な重要要素」
これを改善してください。
と、「Core Web Vitals」という優先的に改善してくださいという指標が3つ提示されました。
正確には、追加された。
・セーフブラウジング
・SSL対応
・インターステイシャル
は当たり前に存在しています。
LCP(Largest Contentful Paint)
この指標は、Webページがブラウザに表示されるまでの速度です。
画像や動画・ブロックレベルのテキストなどの主要なページ内コンテンツが、ブラウザの表示範囲内で読み込まれる時間が測定対象です。
理想は、2.5秒以内といわれています。
2.5秒以内にページが表示されないWebページはあれってことです。
対策としては、画像や動画の最適化・不要なレイアウトの削除・遅延読み込み処理ですね。
Webサイトの画像を.webp化🙂
と思った矢先、.avifという拡張子を知る😂技術的には.webpより上なのね😂
ブラウザごとに出し分けの記述で対応したらできそうだけど…
そもそも対応ブラウザが少なすぎ😭
成長性はありそうだけど。.avifってどうなんだろう…
めっちゃ軽くなるみたいだけど🤔— ふらんぶ🌿@UXデザイナもどき (@dayantler) May 11, 2021
FID(First Input Delay)
この指標は、Webページの反応速度です。
反応速度というのは、そのWebページ内で活動ができるまでの速度です。
具体的な動作としては、画像をクリックできる・入力フォームでテキストが入力できるとかです。
理想は、0.1秒以内といわれています。
0.1秒以内にWebページ内で動作を行えないということはあれってことです。
対策としては、・・・どうするんだろう・・・スクリプトの動作軽減ですかね。
CLS(Cumulative Layout Shift)
この指標は、Webページの予期せぬレイアウトのズレの発生速度です。
よくわかりにくい指標です。
具体的な例としては、カートの決定ボタンを押そうとしたら表示がずれて、変なボタン押しちゃったとかですね。
理想は、0.1秒未満といわれています。
0.1秒までにWebページ内のレイアウトを確定できないということはあれってことです。
対策としては、余計なスクリプトは入れないこと・広告やタグの軽減ですかね。
どうやって計測するの?
・Lighthouse
・Web Vitals
・Chrome UX Report
・Googleサーチコンソール
PageSpeed InsightsとLighthouseがサマリ化されてておすすめ。
Chrome UX Reportって初めて聞いたけど、ヘビーなツールらしい。。。
まとめ
Web業界の移り変わりってすごいなと思いました。
ということは、URL叩いたら、なんか動画だったり、アニメーションが動いたりするHPはアウトなのかな。。。
ユーザーの使いやすいWebサイト制作とは難しい。
ただ作ればいいってわけじゃないということを実感する。。。
お客さんを理解しようとするために、広告タグとかのJS入れた結果、お客さんの使いにくいページになるってどうなんだ?🤔
データは多い方がいいけど、使いこなせなければ意味ないし…
かといって、やっぱり営業あっての事業だし…どっちのUX改善に正義があるのか🤔
— ふらんぶ🌿@UXデザイナもどき (@dayantler) May 19, 2021
UXを勉強するには、マーケティング・SEO方面も知っておかないといけないなと思いました。
個人ブログの対策って、WordPressだとレンタルサーバーやテーマに依存している箇所が多いからきつい。。。
せめて、画像サイズのリサイズや圧縮くらいは頑張ろうと思います。