CoderDojoTachikawa / old_coderdojotachikawa.github.io

Build a Jekyll blog in minutes, without touching the command line.
0 stars 6 forks source link

SEO対策:SSRを導入する #32

Open ixap2i opened 3 years ago

ixap2i commented 3 years ago

JSでコンパイルされたhtmlについて、ブラウザがどのようにインデックスするか不明なので、検索エンジンで立川を検索した際にランキング上位に行かない可能性がある。

①LighthouseでSEO周りを見る ②SSRに改修する?(参考: https://ssr.vuejs.org/ja/) ③サイトマップを手作成して追加する ↓ (作業優先度順)

IchiroKano commented 3 years ago

URIが機能するから、sitemap.xml を書いちゃえばいいのかと思ったけど、避けている理由あったりしますか? [sitemap.xml] `<?xml version="1.0" encoding="UTF-8"?>

https://coderdojotachikawa.github.io/index.html https://coderdojotachikawa.github.io/staffs https://coderdojotachikawa.github.io/contact `
ixap2i commented 3 years ago

@IchiroKano そうですね。SEO的にサイトマップは有効な気がします。

検索エンジンのbotはサイトの構造をクローリングしますが、同時にページの評価を行い、その結果を検索結果に反映するような気がしています。(ページの評価とは、コンテンツの評価であったり、htmlの構造(適切にタグが使用されているか)、サイトマップと該当ページのコンテンツが違っていないか…などなどを指しています。)

構造部分についてはsitemap.xmlを作ることで対処できそうな気がしますが、Vueからコンパイルされたhtmlはダイジェストされていて、各ページにどのように紐付くのかがちょっと謎な部分です。 そういうことを考えると、サイトマップよりも先にSSR化の方が思いつく事項ではありました。 Vueではサイトマップは自動生成されないようですので、作業内容に含みたいと思っています。ご提案ありがとうございます。

ixap2i commented 3 years ago

メモ: かのさんから頂いたご意見を含めて、ひとまず作業の方向性をまとめました。認識違いあればご指摘いただけますと幸いです。

①サイトマップを書くことでGoogleクローラーにサイト構造を知らせる。 参考: https://developers.google.com/search/docs/advanced/sitemaps/build-sitemap?hl=ja

②実際にjavascriptもレンダリングして読んでくれているのかどうかをURL検査ツールでチェック。(タグ埋め込み) 参考: https://search.google.com/search-console/welcome

③Lighthouse(Chromeの開発者ツールから使用できる)でSEOの改善項目を更に洗い出し、htmlタグの修正やmetaタグの設定などを行う。

Screen Shot 2021-06-28 at 22 42 01