Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Core Web Vitals についてあれやこれや

Core Web Vitals についてあれやこれや

2021/09/04(土)
合同勉強会 in 大都会岡山 -2021 Summer Online-
でのセッションスライドです。

F391c64c645e6c6345cc37fd806d88f2?s=128

Masayuki Maekawa

September 04, 2021
Tweet

Transcript

  1. $PSF8FC7JUBMT 
 ʹ͍ͭͯ͋Ε΍͜Ε΍ ߹ಉษڧձJOେ౎ձԬࢁ4VNNFS0OMJOF લ઒ণ޾

  2. ֓ཁ ͜ͷय़ɺ ΢Σϒք۾ͰԿ͔ͱ࿩୊ΛूΊ͍ͯͨ$PSF8FC7JUBMT $87 ɻ  (PPHMFͷݕࡧ݁ՌͷϥϯΩϯάཁҼʹՃ͑ΒΕΔ ͱ͍͏ ͜ ͱͰɺ

    
 ͍ΘΏΔ4&0ͷਓ͚ͨͪͩͰͳ͘ɺ ΢Σϒ੍࡞ͷਓͨͪ ΋݌݌ᨣᨣͰͨ͠ɻ  Φ ϛ ΧϨ΋ ͝ଟ෼ʹ࿙ΕͣରԠΛߦ͍· ͨ͠ͷͰɺ 
 ͦͷৼΓฦΓతʹΞϥΧϧτͰ঺հ͠ ·͢ɻ
  3. ࣗݾ঺հ w લ઒ণ޾ ʢ· ͔͑Θ· ͞Ώ͖ʣ  w גࣜձࣾɹΦ ϛΧϨ

    w %FWFMPQNFOU%JSFDUPS w 'SPNPLBZBNBKT
  4. ࠗ׆ͱ͍͑͹Φ ϛ Χ Ϩ

  5. $PSF8FC7JUBMT $87 IUUQTEFWFMPQFSTKQHPPHMFCMPHDPNXFCWJUBMTIUNM

  6. ͢΂ͯͷ΢ΣϒΤΫεϖϦΤϯεʹͱ ͬͯ 
 ॏཁͳڞ௨γάφϧɺ 
 ͭ· Γ ʮ$PSF8FC7JUBMTʯ

  7. ೥݄Α Γɺ ϥϯΩϯάཁҼʹ IUUQTEFWFMPQFSTHPPHMFDPNTFBSDICMPHNPSFEFUBJMTQBHFFYQFSJFODF

  8. ࠓճͷߋ৽͸༏Εͨ 
 ϢʔβʔΤΫεϖϦΤϯεΛఏڙ͢Δ 
 ϖʔδΛϋΠ ϥΠ τ͢Δ Α ͏ʹ 


    ઃܭ͞Ε͍ͯ·͢
  9. ϖʔδΤΫεϖϦΤϯε͸ɺ 
 (PPHMFͷγεςϜ͕ߟྀ͢Δ 
 ଟ͘ ͷཁૉͷ͏ ͪͷͭͰ͢ɻ 
 ͦͷͨΊɺ Ұൠతʹ͸αΠ

    τʹ 
 େ෯ͳมԽ͕ى͜ ΔΘ͚Ͱ͸͋Γ ·ͤΜɻ
  10. ޚଟ෼ʹӮΕͣɺ 
 Φ ϛ ΧϨ΋ରԠΛ͠ · ͨ͠

  11. ͨͿΜօ͞Μ͕ฉ͖͍ͨ͜ ͱ

  12. ରԠͯ͠ॱҐ্͕ͬͨ ʁ

  13. ͓౴͑͠ ·͢

  14. ʮ͜ΕͰ্͕ͬͨʯ 
 ͱ͍͏ೝࣝ͋ Γ ·ͤΜ

  15. ͜ͷࠒͷಈ͖ w ݄ ɿ $87ͷϥϯΩϯά൓ө w ݄ ɿ ίΞΞ ο

    ϓσʔ τ w ݄ ɿ ίΞΞ ο ϓσʔ τ
  16. ͜ͷࠒͷಈ͖ w ݄ ɿ $87ͷϥϯΩϯά൓ө w ݄ ɿ ίΞΞ ο

    ϓσʔ τ w ݄ ɿ ίΞΞ ο ϓσʔ τ ίΞΞ ο ϓσʔ τͷӨڹ͕ᴴ͔ʹେ͖ ͘ɺ ଌఆෆೳ
  17. $73ͱ্͔͕ͬͨͷ ʁ

  18. ίϩφͷӨڹ͕େ͖͗ͯ͢ɺ 
 قઅࢦ਺΋ݟ͑ͣΘ͔Βͳ͍ ʢٽ

  19. Ͱ΋ɺ ΍͓ͬͯ͘΂͖ɺ ͱࠓ΋ࢥͬͯ·͢

  20. Ͳ͏͍͏ରԠΛ͔ͨ͠ʁ

  21. $PSF8FC7JUBMTͷ߲໨ w -BSHFTU$POUFOUGVM1BJOU -$1  w 'JSTU*OQVU%FMBZ '*%  w

    $VNVMBUJWF-BZPVU4IJGU $-4
  22. -BSHFTU$POUFOUGVM1BJOU -$1 w ϖʔδ͕࠷ॳʹϩʔ υΛ։࢝ͨ͠ͱ ͖ ͱ͔Βɺ 
 Ϗϡʔϙʔ τ಺ʹදࣔ͞ΕΔ࠷େͷ

    
 ը૾·ͨ͸ςΩε τ ϒϩοΫͷϨϯμϦ ϯά࣌ؒ w ͍Θ͹ɺ ϖʔδͷදࣔ଎౓
  23. 'JSTU*OQVU%FMBZ '*% w Ϣʔβʔ͕࠷ॳʹϖʔδΛૢ࡞͔ͯ͠Βɺ 
 ϒϥ΢βʔ͕࣮ࡍʹॲཧΛ։࢝Ͱ͖ ΔΑ ͏ʹͳΔ ·Ͱͷ࣌ؒ w

    ͍Θ͹ɺ 6*ͷ൓Ԡ଎౓
  24. $VNVMBUJWF-BZPVU4IJGU $-4 w ϖʔδͰൃੜ͢Δ༧ظ͠ͳ͍ϨΠ Ξ΢ τγϑ τͷଌఆ஋ w ͦͷͭ΋ Γແ͍ͷʹ޿ࠂͱ͔Λλ

    ο ϓͯ͠͠ · ͏Ϡπ
  25. ͦΕͧΕͷରԠ޻਺ -$1$-4'*% '*%ʹ͍ͭͯ͸ಛʹରԠͷඞཁͳ͔ͬͨ $-4ʹ͍ͭͯ͸ϖʔδදࣔޙͷࠩ͠ࠐΈίϯςϯπΛॳظදࣔʹ ˞Φ ϛΧ Ϩͷ৔߹

  26. -$1ରԠ w ج४͸ඵҎԼ w ໨ඪ͸ඵҎԼ w ରԠલ͸ඵ୆ɺ ͞ Βʹ஗͍৔߹΋

  27. 1BHF4QFFE*OTJHIUT͕ग़ͯ͘͠ Δ਺ଟͷରԠ߲໨ άάͬͨΒग़ͯ͘ ΔରԠํ๏ ίϯαϧͷࢦఠ 8FCQͱ͔$44ͷϓϩύςΟ ͱ͔

  28. 1BHF4QFFE*OTJHIUT͕ग़ͯ͘͠ Δ਺ଟͷରԠ߲໨ άάͬͨΒग़ͯ͘ ΔରԠํ๏ ίϯαϧͷࢦఠ 8FCQͱ͔$44ͷϓϩύςΟ ͱ͔ ܾΊखʹͳ Γ ·ͤΜ

  29. ޠฐ͕͋ΔͷͰલఏͷ͓࿩ w Φ ϛΧ ϨϝϯόʔʹΑ Δϑϩϯ τ࣮૷͸ɺ ͦΜͳʹແ஡͸͍ͯ͠ͳ͍ w ͳͷͰɺ

    େ͖ ͘ᆝଛͱͳΔΑ ͏ ͳࣄ͸͢ͰʹରԠ͍ͯ͠Δঢ়ଶ w ޽ʹ͋;Ε͍ͯΔͷ͸ϑϩϯ τΤϯ υ·ΘΓͷ͜ ͱ͹͔Γ w νϦ πϞ͸൱ఆ͠ͳ͍͕ɺ νϦ͸νϦ
  30. Φ ϛ Χ ϨͰ-$1ͷͨΊʹߦͬͨओͳ͜ ͱ w -$1ର৅ίϯςϯπͷݻఆ w 55'#࡟ݮ

  31. -$1ର৅ίϯςϯπͷݻఆ -$1ର৅ίϯςϯπ ͱ ͯ͜͠ΕΛ௥Ճ

  32. -$1ର৅ίϯςϯπͷݻఆ -$1ର৅ίϯςϯπ ͱ ͯ͜͠ΕΛ௥Ճ Ͱͳ͍ͱɺ ͜ ͪ Β͕-$1ͱೝࣝ͞Εɺ ͍͢͝਺஋ʹ

  33. -$1ର৅ίϯςϯπͷݻఆ %FW5PPMTͰ֬ೝͰ͖ ·͢

  34. -$1ର৅ίϯςϯπͷݻఆ ͜ ͜ͷ໘ੵ͕૬ରతʹখ͍͞ͱ ͜ ͬ ͕ͪ-$1ʹͳͬͨΓ ࢖͑Δը૾ͷαΠ ζΛϧʔϧԽ

  35. 55'#࡟ݮ 5JNF5P'JSTU#JUFཁ͸αʔόʔͷॲཧ࣌ؒ

  36. ͋͑ͯݴ͏ ͱɺ  55'#Ͱඵ͔͔͍ͬͯΕ͹ɺ  ԿΛͯ͠΋ແବ

  37. 55'#࡟ݮ w Φ ϛΧ ϨͷΞʔΩςΫνϟ ͱ ͯ͠ɺ 
 1)1ͷΞϓϦέʔγϣϯαʔό͔Β"1*ʹ)551Ͱ઀ଓ͍ͯ͠Δ w

    "1*͕ଈϨεϙϯεΛฦͯ͠΋NT͙ Β͍͸ফඅͯ͠͠ · ͏ w όονͰग़ྗ͍ͯ͠Δ੩త+40/ϑ ΝΠϧͷಡΈࠐΈ΋)551 w ͜Ε͕ͨ·ʹNT͙ Β͍ʹͳΔ ͜ ͱ͕͋Δ
  38. 55'#࡟ݮ w $MPVE'SPOUͷίϯςϯπΩϟ ογϡΛར༻͍ͯ͠Δ͕ɺ ώ ο τ཰͸໿ w ώ ο

    τ͢Δ ͱNTҎԼͰฦ͕͢ɺ ώ ο τ ͍ͯ͠ͳ͍࣌΋ܭଌ͞ΕΔ w ΤοδαʔόʔͷΩϟ ογϡ΢Υʔ ϛ ϯά΋ݕ౼͕ͨ͠ɺ 
 ͋· Γݱ࣮తͰ͸ͳ͍͠ɺ 
 "84ͷ υΩϡϝϯ τݟΔݶΓਪ঑΋ ͞Ε͍ͯͳ͍ͷͰ٫Լ
  39. 55'#࡟ݮ w 55'#ͷ໨ඪΛඵ୆ʹઃఆ ʢඵ୆ΛແཧʹૂΘͳ͍ʣ  w ؔ਺͝ͱͷ࣌ؒଌఆˠϦ ϑ ΝΫλ Ϧ

    ϯά w .FNDBDIFEͷపఈ׆༻ w Ωϟ ογϡ΢Υʔ ϛ ϯάͷಋೖ
  40. 55'#࡟ݮ w Ϟχλ Ϧ ϯά͸1BHF4QFFE*OTJHIUTͷ"1*Ͱ55'#Λऔಘͯ͠ه࿥ w $BUDIQPJOUͱ͔࢖͍͍͚ͨͲɺ ίϩφγϣ οΫ଀͍ w

    ͱ Γ͋͑ͣ࡟ݮʹ͸੒ޭ
  41. ΦʔϧάϦ ʔϯୡ੒ ʂ

  42. · ͱΊ w ରԠͯ͠΋ॱҐ্͕͕Δ ͱ͔ظ଴͠ͳ͍ w Ͱ΋ɺ Ϧ ϑ ΝΫλ

    Ϧ ϯάʹϦ ιʔεΛ౤ೖ͢Δ 
 ͓୊໨ͱ ͯ͠ͱͯ΋େ͖͍ w ϑϩϯ τΤϯ υͰղܾ͠Α ͏ ͱ ͕͚ͪͩ͠Ͳɺ 
 ଟ෼ղܾ͠ͳ͍ ͜ ͱ͕ଟ͍  w ·ͣ͸55'#ΛΈΖ ʂ
  43. ͋ Γ ͕ͱ ͏ ͍͟͝· ͨ͠ !NBFQPO