Critical CSS

Transcript

1. ΫϦςΟΧϧ$44 ໘ന๏ਓΧϠοΫ
   )5.-ϑΝΠ෦
   ޒे઒ɹ༸ฏ
   ʢ͍͔ͦΘɹΑ͏΁͍ʣ

2. ࣗݾ঺հ w ޒे઒ɹ༸ฏʢ͍͔ͦΘ
   Α͏΁͍ʣ
 
   ໘ന๏ਓΧϠοΫ
   )5.-ϑΝΠ෦ॴଐ
   w 5XJUUFSɿ!:VIJJTL
   w IUUQCMPHZVIJJTLDPN
   w झຯɿϤʔϤʔɺόε௼Γ

3. ΫϦςΟΧϧ$44ͱ͸

4. ϑΝʔετϏϡʔͷදࣔΛϒϩοΫ͍ͯ͠Δ
   +BWB4DSJQU$44
   Λഉআ͢Δɻ –Google PageSpeed Insights

5. ϑΝʔετϏϡʔͷදࣔ଎౓ͷ࠷దԽ

6. ϑΝʔετϏϡʔͷද͕ࣔ଎͚Ε͹ɺ ମײ଎౓͕଎͘ײ͡ΒΕΔɻ

7. ࣮૷ํ਑

8. w )5.-͔Β֎෦ελΠϧγʔτΛநग़ɻ
   w ϑΝʔετϏϡʔͷαΠζΛܾΊͯ$44Λੜ੒ɻ ϚϧνσόΠεͷ৔߹ɺ1$ɾ41ͲͪΒʹ࠷దԽ ͢Δ͔બ୒͢Δɻ
   w $44Λ)5.-ʹΠϯϥΠϯԽɻ
   w ࢒ΓͷελΠϧ͸ඇಉظͰಡࠐΉɻ

9. <link rel="stylesheet" href="/css/style.css" media="all">

10. <style type="text/css"> header,nav{display:block}html{background:#fff;font-family:sans- serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust: 100%;color:#555}body{margin:0;… </style>

11. ޮՌ

12. CFGPSF BGUFS

13. ඍʑͨΔ΋ͷ͕ͩ
    ֤਺ࣈ͸վળ͞Εͨɻ

14. ϝϦοτ w ϖʔδͷಡΈࠐΈ଎౓͸ͦΕ΄ͲมΘΒͳ͍͕ɺ ϨϯμϦϯάϒϩοΫΛܰݮͰ͖ΔͷͰɺϢʔβ ʹͱͬͯϖʔδදࣔͷମײ଎౓͕଎͘ͳΔɻ
    w ճઢ͕ࡉ͘ϖʔδ͕ॎ௕ʹͳΓ͕ͪͳϨεϙϯ γϒ8FCσβΠϯʢ38%ʣεϚʔτϑΥϯαΠ τʹಛʹ༗༻ɻ

15. σϝϦοτ w ͦ΋ͦ΋ΠϯϥΠϯల։͢Δͷͬͯେมɻ
    w ͏͔ͭʹ$44Λ௚઀͍͡Εͳ͘ͳΔɻ
 ΋͏πʔϧΛ࢖Θͳ͍ͱઈରʹແཧɻ
 ӡ༻໘΋ߟྀͨ͠બ୒Λɻ

16. πʔϧ঺հ w DSJUJDBM
    w HSVOUDSJUJDBM
 λεΫϥϯφʔͰखܰʹѻ͑ΔΑ͏ʹͳΓɺ
 ਓؾ্ঢɻ
 σϓϩΠ͢Δ࣌ʹҰճ࣮ߦ͢Ε͹ྑ͍ɻ
    w 8FC
    TFSWJDFɿ$SJUJDBM
    1BUI
    $44
    (FOFSBUPS

17. 
    ࠓޙͷՄೳੑ w αʔόଆͰΩϟογϡͤͯ͞ॳظ๚໰࣌ͷΈΫ ϦςΟΧϧ$44Λɻ
 ճ໨Ҏ߱ͷ๚໰࣌ɺΩϟογϡͨ͠ϑϧ$44Λ ಡΈࠐΉɻ

18. w ࢀߟ
 IUUQTBEBDUJPDPNKPVSOBM
 IUUQTHJUIVCDPNBEEZPTNBOJDSJUJDBM
 IUUQTHJUIVCDPNBEEZPTNBOJDSJUJDBM QBUIDTTEFNP

19. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ