とある個人開発 PWA の SEO 奮戦記

Mangarel というコミック新刊情報アプリを PWA で出したんですが、そのままではびっくりするくらい Google に登録されず、いろいろ苦労した話です。PWA というより SPA 特有の話が多いかも。
https://mangarel.com/

Transcript

1. ͷ
   SEO
   ฃઓه େԬ༝Ղ ݸਓ։ൃɹɹɹ ͱ͋Δɹɹɹ
2. Who am I ? 何やってる人？ ʢ͓·͑୭΍ͶΜ
   ʣ େԬ༝Ղ !PVLBZVLB ແ৬ͱಉਓ࡞Ոͷ͍͋ͩͰ͢ɻडୗ΋ ৗற΋΍ΒͣʹͲΕ͚ͩੜ͖ΒΕΔ͔ νϟϨϯδதͰ͢ɻ 3FBDU
   ͱ
   5ZQF4DSJQU
   Ͱ͢ɻ
   એݴత
   6*
   ສࡀɺ઴ਐత੩తܕ෇͚
   ສࡀʂ 好きな技術は？
3. Works ʢ࡞ͬͯΔ΋ͷʣ 3FBDU
   ͱ
   5ZQF4DSJQU
   ͷಉਓࢽͰ͢ɻ
   ݱࡏγϦʔζͰλΠτϧग़͍ͯͯɺྦྷ ܭͰ ෦΄ͲചΕͯ·͢ɻ
   ఱ࠽ഽͷઌഐͱɺ෼໺ҧ͍Ͱೖ͖ͬͯ ͕ͨΜ͹Γ԰ͷޙഐͪΌΜͱͷձ࿩ܶ Ͱ
   3FBDU
   ʹΑΔ࠷৽ͷϞμϯϑϩϯ τΤϯυ։ൃ͕Θ͔Γ΍ֶ͘͢΂Δͱ ޷ධͰ͢ɻ IUUQTPVLBZVLBCPPUIQN
4. Mangarel ʢ.BOHB
   
   3FMFBTF
   ͰϚϯΨϨϧʣ ࠓճͷ࿩ͷ୊ࡐͱͳΔɺݸਓ։ൃͷΞϓϦͰ ͢ɻʮॻళͷ৽ץίʔφʔత
   69
   Λఏڙ͢Δ ίϛοΫε৘ใΞϓϦʯͱ͍͏ςʔϚͷ΋ ͱɺ3FBDU
   
   ͱ
   
   'JSFCBTF
   
   Ͱ։ൃ͍ͯ͠Δ
   18"
   Ͱ͢ɻ
   ී௨ʹ
   
   "1*
   
   ͰखʹೖΔ৘ใΛ౰ͨΓલʹ੔ཧ ͠ɺࡢࠓͷ
   
   6*
   
   τϨϯυʹଇΓී௨ʹ࢖͍΍ ͘͢͠ɺΤϯδχΞతʹࠓͷී௨ͷٕज़Ͱߏ ੒͢Δͱ͍͏ɺʮී௨ʯΛͱ͜ͱΜੵΈॏͶ ͍ͯ͘͜ͱΛ։ൃํ਑ʹ͍ͯ͠·͢ɻ IUUQTNBOHBSFMDPN
5. Google knows… ʢ(PPHMF
   ઌੜɺ஌Βͳ͍ͬͯΑʣ ٕज़ॻయʹग़ͨ͠ʰΓ͋Ϋτʂ
   'JSFCBTFฤʱͷα ϯϓϧΞϓϦͱͯͦ͠ͷલ೔ͷ݄೔ʹϦϦʔε ͨ͠
   .BOHBSFM
   Ͱ͕͢ɺϲ݄ͨͬͯ΋
   (PPHMF
   ݕ ࡧʹҾ͔͔ͬΔͷ͸Θ͔ͣ݅ͷΈɻ͔࣮͠͠ࡍʹ ͸ສ݅Ҏ্ͷϖʔδ͕ଘࡏ͍ͯ͠·ͨ͠ɻ
   ʮ࠷ۙͷ
   (PPHMFCPU
   ͸ͪΌΜͱ
   +BWB4DSJQU
   Λղ ऍͯ͠ΠϯσοΫεͯ͘͠ΕΔʯͱฉ͍ͯͨͷʹ࿩ ͕͕ͪ͏ʂԿͱ͔ͤͶ͹ʂͱɺ͜͜ʹདྷͯΑ͏΍͘ ةػײΛ๊͘Α͏ʹɻ ʲ౰ॳͷϖʔδߏ੒ʳ
   
   
   
   TFBSDI
   
   
   TJHOJO
   
   
   CPPLTʢ໿ ʣ
   
   
   DPNJDTʢ໿ ʣ
6. Problems ʢ໰୊఺ʣ ᶃ
   ϖʔδͦͷ΋ͷ͕ΠϯσοΫε͞Εͳ͍
   w ࣮ࡍʹ͸ສ݅Ҏ্ͷϖʔδ͕͋Δͷʹɺϖʔδ͔͠
   (PPHMF
   ʹೝࣝ͞Ε͍ͯͳ͍ ᶄ
   λΠτϧ΍ৄࡉ͕ݸผʹදࣔ͞Εͳ͍
   w τοϓϖʔδҎ֎ͷϖʔδ΋ɺτοϓϖʔδͱશ͘ಉ͡λΠτϧͱৄࡉ ᶅ
   ίϯςϯπ͕ϨϯμϦϯά͞Εͳ͍
   w +BWB4DSJQU
   Ͱඳ͍ࣸͯ͠Δ෦෼Λ
   (PPHMFCPU
   ͕ղऍͰ͖͍ͯͳ͍ͨΊɺ͔ͦ͜Β ϦϯΫΛͨͲͬͯ΋Β͑ͳ͍
7. ϖʔδͦͷ΋ͷ͕ΠϯσοΫε͞Εͳ͍ ղܾͷͨΊʹ΍ͬͨ͜ͱ ᶃ
8. Sitemap ʢαΠτϚοϓʣ $MPVE
   'VODUJPOT
   ͰαΠτϚοϓΛ ฦ͢
   )551
   ؔ਺Λ࡞Γɺ(PPHMF
   4FBSDI
   $POTPMF
   ʹొ࿥ͨ͠ɻ
   ૹ৴ʹ੒ޭɺʮαΠτϚοϓΠϯσο Ϋε͸ਖ਼ৗʹॲཧ͞Ε·ͨ͠ʯͱද ࣔ͞Εɺ͜ΕͰͻͱ҆৺ͱࢥΘΕͨ ͕ʜʜɻ
9. Exclusion ʢআ֎ʣ ೝࣝ͸͞ΕΔͷʹɺʮΠϯσοΫε ະొ࿥ʯͱআ֎͞ΕΔ೔ʑ͕ଓ͘ɻ
   ͍Ζ͍Ζௐ΂ͨ݁Ռɺ63-
   ΛαΠτ ϚοϓͰૹ৴͚ͨͩ͠Ͱଞͷϖʔδ͔ ΒͷϦϯΫ͕΄ͱΜͲͳ͚Ε͹ɺ͜ ͷΑ͏ͳঢ়ଶʹͳΔͱͷ͜ͱɻ IUUQTXXXTV[VLJLFOJDIJDPNCMPH EJTDPWFSFEDVSSFOUMZOPUJOEFYFEQBHFT NBZTIPXJODPWFSBHFSFQPSUXIFOPOMZ MJOLFEJOTJUFNBQ
10. Revenge ʢϦϕϯδʣ ʮΧςΰϦʔผ
    ࠓചΕ͍ͯΔ৽ץʯ ϖʔδ΍ʮϨʔϕϧผ৽ணίϛοΫ εʯϖʔδΛ࡞੒͠ɺ஍ಓʹ಺෦Ϧ ϯΫΛ૿΍͍ͯ͠Δɻ
    ݁Ռɺ೔ʑগͣͭ͠Ͱ͸͋Δ͕ొ࿥ ͞ΕΔϖʔδ͕૿͍͑ͯΔɻ ˣ
11. λΠτϧ΍ৄࡉ͕ݸผʹදࣔ͞Εͳ͍ ղܾͷͨΊʹ΍ͬͨ͜ͱ ᶄ
12. React Helmet ʢ
    ZBSO
    BEE
    SFBDUIFMNFUʣ ಈతʹ
    )5.-
    ϔομΛ্ॻ͖͢Δͨ Ίͷ
    3FBDU
    ༻ϥΠϒϥϦɻ͜ΕΛ ࢖ͬͯݸผͷϔομΛॻ͖׵͑ɺϒϥ ΢β্͔Β͸มΘͬͨΑ͏ʹݟ͑ͨ ͕ɺ(PPHMF
    ʹλΠτϧͱͯ͠ొ࿥͞ ΕΔͷ͸
    OPTDSJQUT
    ͷதͷ
    I
    ݻఆλάͷத਎ɻ
    ͨͩʮࠓചΕ͍ͯΔ৽ץʯϖʔδͰ ͸
    )FMNFU
    Ͱॻ͖׵͑ͨλΠτϧͩ ͚͕ೝࣝ͞Εৄࡉ͸มΘΒͣɺͱ͍͏ Α͘Θ͔Βͳ͍ঢ়گɻ
13. Cloud Functions ʹΑΔϔομͷಈతॻ͖׵͑ Ϗϧυͨ͠
    JOEFYIUNM
    Λ
    )PTUJOH
    ͷϩʔΧϧʹஔ͖ɺϔομ Λಈతʹॻ͖׵͑ͯͦͷத਎Λฦ ͢
    )551
    ؔ਺Λ࡞੒ɺ)PTUJOH
    ͷ
    SFXSJUFT
    ػೳͰ೚ҙͷ
    63-
    ʹ
    CPU
    ͕௚ʹΞΫηεʹདྷͨͱ͖ʹͦ Ε͕ൃಈ͢ΔΑ͏ʹͨ͠ɻ pSFCBTFKTPO GVODUJPOTSFQMBDF.FUB#PPLUT VTDFOUSBM
    ϦʔδϣϯͷΈ
14. ݁Ռɺগͣͭ͠ద੾ͳλΠτϧͱৄ ࡉʹஔ͖׵ΘΓͭͭ͋Δɻ
    ͍ͭͰʹ
    0(1
    ʹ΋ରԠ͠ɺ4/4
    γΣΞͨ͠ࡍʹݟӫ͕͑͢ΔΑ͏ʹ ͨ͠ɻ ͍ͭͰʹ
    0(1
    ʹ΋ରԠ
15. ίϯςϯπ͕ϨϯμϦϯά͞Εͳ͍ ղܾͷͨΊʹ΍ͬͨ͜ͱ ᶅ
16. Google can’t help it ʢ(PPHMF
    ͸ͦΕΛզຫͰ͖ͳ͍ʣ 4FBSDI
    $POTPMF
    ͷʮ63-
    Λςε τʯΛࢼ͢ͱɺऔಘϦετ͕௕͍ϖʔ δ͸్தͰϨϯμϦϯάΛଧͪ੾ΒΕ ͍ͯͨɻ
    ݅ͷϦετͷϖʔδ͸ӡ͕ྑ͚Ε͹ ϨϯμϦϯά͕੒ޭ͍ͯ͠Δ͕ɺ݅ ͷϖʔδ͸ݢฒΈશ໓ͱ͍ͬͨ۩߹ɻ ˠ
17. Tried but useless ʢ΍ͬͯΈ͚ͨͲແବͩͬͨ͜ͱʣ ϩʔμʔΛճ͢લʹϥοϓཁૉʹ
    BSJBCVTZlUSVFz
    Λઃఆ͠ɺσʔλ ͷऔಘ͕׬ྃͨ͠Βͦͷ஋Λ
    GBMTF
    ʹมߋ͢ΔΑ͏ʹ͢Δɻ ˣ (PPHMF
    %FWFMPQFSTʮίϯςϯπͷ ඇදࣔͱߋ৽ʯʹ͋ͬͨͷͰ΍ͬͯ Έ͕ͨɺϨϯμϦϯάʹਐల͸ͳ ͔ͬͨɻͨͩΞΫηγϏϦςΟධՁ ʹ͸ͭͳ͕Δ͔΋ɻ ݹ͍هࣄʹ͸ೖΕͨ΄͏͕͍͍ͱ ͋ͬͨͷͰ
    SFBDUBQQQPMZpMM
    Λೖ ΕͯΈͨɻ ˣ ΍ͬͺΓঢ়گ͸վળ͠ͳ͔ͬͨͷͰ ΞϯΠϯετʔϧͨ͠ɻ(PPHMFCPU
    ͸ެশ
    $ISPNFɺ͍ͭઌ೔͸ৗʹ ࠷৽൛૬౰ʹͳΔͱΞφ΢ϯε͕ ͋ͬͨͷͰ૝ఆϢʔβʔʹ
    *&
    ͕͋Δ ৔߹Ҏ֎͸͢Ͱʹҙຯ͕ͳͦ͞͏ɻ
18. Slow or not slow, that is a question ʢ஗͍͔஗͘ͳ͍͔ɺͦΕ͕໰୊ͩʣ 4FBSDI
    $POTPMF
    ͷঢ়گ΍ωοτͷهࣄΛؑΈͯɺશମͷද͕ࣔ࣌ؒʙ ඵ͋ͨΓͱ͍͏ͷ͕ੜ໋ઢͱࢥΘΕΔɻ
    ͜ΕΛඵະຬʹ཈͑Δͱ͍͏ͷΛ౰໘ͷ໨ඪʹ͢Δɻ
19. Tree Shaking ʢγΣΠΫγΣΠΫɺπϦʔͳڳ૽͗ʣ 5SFF
    4IBLJOH
    ͱ͸࣮ߦ͞Εͳ͍ίʔυΛ࡟আͯ͠όϯυϧαΠζΛॖখ ͢Δ͜ͱɻ8FCQBDL
    ʹ΋ͦͷػೳ͕͋Δͱͷ͜ͱ͕ͩͬͨɺ͋·Γੑೳ ͕ྑ͘ͳ͍Β͍͠ͷͰɺ໌ࣔతʹΠϯϙʔτͰ͖Δ΋ͷ͸ͦ͏͢Δ΂͖ɻ TPVSDFNBQFYQMPSFS
    Ͱੜ੒ͨ͠ιʔεϚοϓ JNQPSU
    \
    GPS&BDI
    ^
    GSPN
    bMPEBTI`ɹˠɹJNQPSU
    GPS&BDI
    GSPN
    bMPEBTIGPS&BDI` JNQPSU
    \
    $BSE
    ^
    GSPN
    TFNBOUJDVJSFBDU JNQPSU
    $BSE
    GSPN
    TFNBOUJDVJSFBDUEJTUDPNNPOKTWJFXT$BSE ˣ
20. Code Splitting ʢίʔυͷ෼ׂޙ෷͍ʣ Ұ౓ʹ͢΂ͯͷίʔυΛಡΈࠐΉͷͰ ͸ͳ͘ɺॳճͷϨϯμϦϯάʹඞཁͳ ίϯϙʔωϯτҎ֎͸੾Γ཭͠ɺඞཁ ʹͳ͔ͬͯΒಡΈࠐΉΑ͏ʹ͢Δ͜ͱ Ͱ࠷ॳͷಡΈࠐΈΛૣ͘͢Δɻ
    3FBDU
    3PVUFS
    ͱͷ߹Θٕ͕ͤ
    3FBDU
    ͷެࣜυΩϡϝϯτͰ঺հ͞Ε͍ͯΔ ͷͰɺͦΕΛ࢖͏ɻ IUUQTKBSFBDUKTPSHEPDTDPEF TQMJUUJOHIUNMSPVUFCBTFEDPEFTQMJUUJOH
21. Result ʢͦͷ݁Ռʣ
    ˣ ˣ
22. Current rating ʢ.BOHBSFM
    αΠτݱࡏͷධՁʣ
23. SEO life goes on… ʢԶͨͪͷઓ͍͸͜Ε͔Βͩʣ ʲࠓޙ΍Γ͍ͨ͜ͱʳ +40/-%
    ʹΑΔߏ଄Խσʔλͷ ఏڙ 344
    ഑৴
    ʢഇΕͯΔ͚Ͳ΍Βͳ͍ΑΓ͸Ϛγ ʣ 4FSWJDF
    8PSLFS
    ͷ
    /BWJHBUJPO
    1SFMPBE 4FNBOUJD
    6*
    ͷ
    5IFNJOH
    ػೳΛ ࢖ͬͯະ࢖༻
    $44
    Λ࡟ݮ͢Δ 'JSFTUPSF
    ͷߴස౓ΫΤϦʔΛ
    )551
    ؔ਺Խ͠ɺ$%/
    ΍
    4FSWJDF
    8PSLFS
    ͷΩϟογϡ͕ޮ͘Α͏ʹ͢Δ ແݶεΫϩʔϧ΍ը૾ͷ஗ԆಡΈࠐΈΛɺ (PPHMF
    ਪ঑ͷΫϩʔϥϒϧ͔ͭ
    *OUFSTFDUJPO0WTFSWFS
    Λ࢖༻ͨ͠΋ͷʹ ͢Δ IUUQTDSPMMTBNQMFBQQTQPUDPNJUFNT