Googleジョン・ミューラー氏がCore Web Vitalsにちょっとした情報を投稿
GoogleのJohn MuellerがCore Web Vitalsにちょっとした情報を投稿
【Google翻訳】
GoogleのJohn MuellerがCore Web Vitalsにちょっとした情報を投GoogleのJohn Mullerが昨日、SEOコミュニティと共有するのに興味深いと思われるちょっとしたツイートのストリームを投稿しました。 「Core Web VitalsがSearch Consoleに追加されたので、調査中に見つけた情報をすばやくまとめたかったのです。これにより、数分節約できたり、テストしたり、視聴したりできるようになるでしょう。 ビデオ。”
これは、Core Web Vitalsメトリックに含まれるものです。
■Google JohnMueller(ジョン・ミューラー)氏(@JohnMu)Core Web Vitalsには、読み込み、相互作用、および煩わしさ（？）メトリックが含まれます：最大のコンテンツフルペイント（LCP =読み込み）、最初の入力遅延（FID =相互作用）、累積レイアウトシフト（CLS =安定性、欠けているのは私を困らせます： -））。
The Core Web Vitals include loading, interaction, and annoyance (?) metrics: Largest Contentful Paint (LCP = loading), First Input Delay (FID = interaction), Cumulative Layout Shift (CLS = stability, the lack of which I find annoying :-)).
— 🍌 John 🍌 (@JohnMu) May 28, 2020
ここで、これらのメトリックをさらに詳しく調べることができます。
https://web.dev/vitals/から始まるそれらについての情報がたくさんあります-それは私が行く傾向があるところです。 LCPは、これまで見てきたページの読み込み速度と似ていますが、主要な要素がいつ表示されるかを把握しようとします。これは、ユーザーが気にしていることです。
最大のContentful Paint / LCPに関するヒントを含むビデオ：
https://web.dev/lcp/で最大のContentful Paint / LCPに関する束、https：//web.dev/optimize-lcp/で改善するためのヒント、そしてたくさんの詳細が載ったビデオが
There's a bunch about Largest Contentful Paint / LCP at https://t.co/gACbV8xs0j , tips on how to improve at https://t.co/r79NhK3eml , and a video with tons of details at https://t.co/U7o4vsWij0
— 🍌 John 🍌 (@JohnMu) May 28, 2020
最初の入力遅延が優れている理由：
First Input Delay / FIDは、応答性を測定するので優れています。ユーザーがページを操作しようとしたときのユーザーの第一印象は何ですか？ 私にとっては、ロード中に疑わしいというメリットを与えても、通常は他のサイトに戻って試してみるポイントです。
First Input Delay / FID is cool because it measures responsiveness – what's the user's first impression when they try to interact with your page? For me, it's usually the point at which I turn back and try other sites, even if I give them the benefit of a doubt during loading.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
これに関するヘルプドキュメント：
FIDについては、https：//web.dev/fid/にドキュメントがあります（これらのURLはある程度予測可能です）、https：//web.dev/optimize-fid/に最適化のヒントがあります。 この測定基準の興味深い奇妙な点は、測定するためにユーザーが必要なことです。
まったく新しい累積レイアウトシフト/ CLS：
For FID we have docs at https://t.co/hUEO9RC6nH (these URLs are kinda predictable, huh?), and tips on optimizing at https://t.co/ZAAxt0xA2T . An interesting quirk of this metric is that you need a user to measure it. pic.twitter.com/PQKkMQzKJ5
— 🍌 John 🍌 (@JohnMu) May 28, 2020
次に、新しいレイアウト、累積レイアウトシフト/ CLSがあります。 これは、ロード中に移動するページの割合に、移動する位置の割合を掛けて計算されます。 ページがこれを行うと、特に長いページをスクロールするときに、それは完全に不愉快です。 ああ。 さようなら。
Then there's the new one, Cumulative Layout Shift / CLS. It's calculated by taking the fraction of the page that moves during loading times the fraction of the position it moves. I find it totally annoying when pages do this, especially if I scroll through a longer one. Ugh. Bye. pic.twitter.com/S6uhMxYtlf
— 🍌 John 🍌 (@JohnMu) May 28, 2020
累積レイアウトシフト/ CLSに関するビデオ：
CLSについての詳細は…https://web.dev/cls/にあり、それを最適化する方法についてはhttps://web.dev/optimize-cls/にあります-ここに多くの詳細を含む素晴らしいビデオ：
There's more about CLS at … https://t.co/0mA8zDDof7 and on how to optimize for it at https://t.co/wKHSgCG8Jo — and a great video with much more information here: https://t.co/dPWbcRKXlo
— 🍌 John 🍌 (@JohnMu) May 28, 2020
しかし、これらのツールにはさらに多くの機能があります。
では、Search Consoleとは別に、これらの指標はどこで確認できますか？ Chrome Dev Tools、Lighthouse、CrUX、Page Speed Insightsなどの多くのツールが登場（または登場）します。これらはhttp://webpagetest.orgにもあり、JSライブラリがあれば 自分で測定したい。
So, apart from Search Console, where can you see these metrics? They're coming (or in) a lot of our tools, such as Chrome Dev Tools, Lighthouse, CrUX, Page Speed Insights, etc. They're also in https://t.co/s55K8LIOKY , and there's a JS library if you want to measure for yourself.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
これらのツールを使用すると、ラボ（自分でテストする場合）とフィールドデータ（ユーザーが目にするものを全体的に見る場合）に違いがあります。 おそらく両方をチェックする価値があるので、明らかなものを見逃すことはありません。
With these tools, there's a difference between lab (when you test it yourself) & field data (when you see what users see, on aggregate). It's probably worth checking both, so you don't miss anything obvious.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
ユーザーにページを放棄させないでください。
D緑から赤のバケツはさまざまな研究に基づいており、達成可能である（そしてすでに達成されている）ことを意図しています。 https://blog.chromium.org/2020/05/the-science-behind-web-vitals.html…https://web.dev/defining-core-web-vitals-と同様に、それについていくつかあります しきい値/…。 このドキュメントは、「ユーザーがページの読み込みを放棄する可能性が24％少ない」と述べています-これはナイーシーです。
The buckets for green to red are based on various studies and meant to be achievable (and already achieved). https://t.co/IZeNdiDAZN has some about that, as well as https://t.co/HH8bJ33BuA . The doc mentions "users are 24% less likely to abandon page loads" – which is niiice.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
これは、私がこれまで遭遇したほとんどすべてのことです。 新しいメトリックの追加は常に困難ですが、これらが非常に多くの場所で使用されているのを見るのは素晴らしいことです。
警告：私はChromeチームに所属していません。これはすべて公開ドキュメントに基づいています！
That's pretty much everything I've run into so far. Adding new metrics is always hard, but it's nice to see these being used in so many places.
Caveat: I'm not on the Chrome team, this is all just based on the public documentation!
— 🍌 John 🍌 (@JohnMu) May 28, 2020