Lighthouseを用いたサイト改善 / Website Improvements Using Lighthouse

Start Today Technologies Meetup #4で発表したスライドです。

Transcript

1. © Start Today Technologies Inc.
   -JHIUIPVTFΛ༻͍ͨαΠτվળ
   4UBSU5PEBZ5FDIOPMPHJFT.FFUVQ
   ৽ࣄۀ૑଄෦ϑϩϯτΤϯυνʔϜ ݖक ݈࢚
   

   View Slide

2. © Start Today Technologies Inc.
   ࣗݾ঺հ
   • ݖक ݈࢚ʢ͝Μͷ͔Έ ͚Μ͡ʣ
   • ϑϩϯτΤϯυΤϯδχΞ
   • !"NBUTVLJ,V
   *20/ͷ1$ɺεϚϗαΠτΛத৺ʹϑϩϯτΤϯυΛ୲౰
   

   View Slide

3. © Start Today Technologies Inc.
   ࠓ೔ͷςʔϚͱྲྀΕ
   ʮ-JHIUIPVTFΛ࣮ࡍʹ࢖ͬͯΈͯɺಘͨ஌ݟʹ͍ͭͯͷ঺հʯ
   • -JHIUIPVTFͱ͸
   • -JHIUIPVTFΛ࢖ͬͨվળྫ
   • -JHIUIPVTFΛར༻͢Δ্Ͱͷ஫ҙ఺
   

   View Slide

4. © Start Today Technologies Inc.
   -JHIUIPVTFͱ͸
   8FCϖʔδΛͭͷ؍఺Ͱ਺஋Խ͠ɺվળ߲໨Λใࠂͯ͘͠ΕΔπʔϧ
   • (PPHMF$ISPNFͷ֦ுػೳ
   • $ISPNF%FW5PPMTʢ$ISPNF͔Β౷߹ʣ
   • /PEF$-*
   

   View Slide

5. © Start Today Technologies Inc.
   վળʹऔΓ૊Μͩϖʔδ
   ΞΠςϜৄࡉ ίʔσৄࡉ
   

   View Slide

6. © Start Today Technologies Inc.
   վળલͷείΞ
   ΞΠςϜৄࡉ
   ίʔσৄࡉ
   

   View Slide

7. © Start Today Technologies Inc.
   վળલͷείΞʢ޿ࠂίʔυແ͠ʣ
   ΞΠςϜৄࡉ
   ίʔσৄࡉ
   

   View Slide

8. © Start Today Technologies Inc.
   1FSGPSNBODFͷධՁج४
   • ओཁͳίϯςϯπ͕εΫϦʔϯ্ʹදࣔ͞ΕΔ·Ͱͷ࣌ؒ
   • ϖʔδ͕࠷௿ݶΠϯλϥΫςΟϒʹͳΔ·Ͱͷ࣌ؒ CFUB
   
   • ϖʔδ͕׬શʹΠϯλϥΫςΟϒʹͳΔ·Ͱͷ࣌ؒ CFUB
   
   • ϖʔδͷίϯςϯπ͕໨ʹݟ͑Δঢ়ଶʹͳΔ·Ͱͷ࣌ؒΛείΞԽ
   ͨ͠΋ͷ 4QFFE*OEFY
   
   • ೖྗ࣌ͷϨεϙϯεͷ଎͞
   

   View Slide

9. © Start Today Technologies Inc.
   4QFFE*OEFYͱ͸
   ʮ4QFFE*OEFY 8FC1BHFUFTU %PDVNFOUBUJPOʯ
   IUUQTTJUFTHPPHMFDPNBXFCQBHFUFTUPSHEPDTVTJOHXFCQBHFUFTUNFUSJDTTQFFEJOEFY ΑΓ
   

   View Slide

10. © Start Today Technologies Inc.
    ޿ࠂͷίʔυͷ໰୊఺
    • TDSJQUλάͷૠೖҐஔ
    TDSJQUλάΛධՁ͢ΔͨΊʹϨϯμϦϯά͕ࢭ·ͬͯ͠·͏
    • EPDVNFOUXSJUF
    Λ࢖ͬͨεΫϦϓτͷಈతಡΈࠐΈ
    • ωοτϫʔΫϥ΢ϯυτϦοϓ͕ൃੜ͠ɺಡΈࠐΈʹ͔͔Δ͕࣌ؒ૿͑Δ
    • ಡΈࠐΈݩͷTDSJQUλάʹBTZODଐੑΛ෇༩Ͱ͖ͳ͍
    

    View Slide

11. © Start Today Technologies Inc.
    ޿ࠂͷίʔυͷվળ
    • TDSJQUλάͷૠೖҐஔ
    (PPHMF"ETFOTFͷΑ͏ʹඇಉظίʔυΛఏڙ͍ͯ͠Δ΋ͷʹ͍ͭͯ͸ɺͦͪΒ
    Λར༻͠ɺTDSJQUλάͷૠೖҐஔΛޙΖʹ͢Δ
    • EPDVNFOUXSJUF
    Λ࢖ͬͨεΫϦϓτͷಈతಡΈࠐΈ
    ޿ࠂΛؚΜͩίϯςϯπશମͷಡΈࠐΈΛ୹͘͢Δ͜ͱ͸Ͱ͖ͳ͍͕ɺJGSBNFΛ
    ར༻ͨ͠ϋοΫΛ࢖͏͜ͱͰɺඇಉظಡΈࠐΈΛՄೳʹ͠ɺओཁίϯςϯπͷಡ
    ΈࠐΈΛ๦͛ͳ͍ํ๏͕͋Δ
    

    View Slide

12. © Start Today Technologies Inc.
    ޿ࠂίʔυͷվળޙͷείΞ
    ΞΠςϜৄࡉ
    ίʔσৄࡉ
    

    View Slide

13. © Start Today Technologies Inc.
    ޿ࠂίʔυͷվળʹΑΔओཁίϯςϯπಡΈࠐΈ࣌ؒͷมԽ
    ΞΠςϜৄࡉ
    ίʔσৄࡉ
    
    
    
    
    

    View Slide

14. © Start Today Technologies Inc.
    -JHIUIPVTFΛར༻͢Δ্Ͱͷ஫ҙ఺
    • 1FSGPSNBODFͷείΞ͸҆ఆ͠ͳ͍
    αʔόʔଆ΍޿ࠂ഑৴ଆ͔ΒͷϨεϙϯε଎౓ʹґଘ͢ΔͨΊ
    • ਪ঑͞ΕΔ-B[ZMPBEΛೖΕͯ΋ඞͣ͠΋είΞ্͕͕Δ༁Ͱ͸ͳ͍
    ΞΠςϜৄࡉͷϑΝʔετϏϡʔʹ͸ࣗಈૹΓͷΧϧʔηϧ͕͋ΓɺΧϧʔηϧ
    ͷޙΖͷίϯςϯπ͸-B[ZMPBEΛਪ঑͞ΕΔ͕ɺ࣮ࡍʹೖΕΔͱ4QFFE*OEFY͕
    େ্͖͕ͬͯ͘͠·͏
    • +40/Ͱอଘͨ݁͠Ռ͸$ISPNF%FW5PPMT্ͰݟΕͳ͍
    IUUQTHPPHMFDISPNFHJUIVCJPMJHIUIPVTFWJFXFSY
    

    View Slide

15. © Start Today Technologies Inc.
    ·ͱΊ
    • -JHIUIPVTF͸ݱঢ়Ͱ΋े෼ࢀߟʹͳΔπʔϧ
    • -JHIUIPVTF͕ग़ྗ͢Δ1FSGPSNBODFͷείΞʹҰتҰ༕͠ͳ͍
    • -JHIUIPVTF͕ఏҊ͢ΔυΩϡϝϯτΛཧղ͢Δ͜ͱΛଵΒͳ͍
    

    View Slide