SEO対策大変です...テック目線の対策とは？ タグシステム開発
早速公開したLinkFarm Tech. HPですが、検索に上がってきません。それはなぜでしょうか。SEO対策の観点かなら、出てくるようになるまでの対策を考えます。
こんにちは！LinkFarm Tech. の Shu MASUI です。
今回は、このHPを構成する技術が、どのようにSEO対策に関わっているのかを紹介しながら、テック周りの取り組みについてご紹介します！
なので、今回は少し技術的、難しお話になってしまいますが、ぜひお付き合いください！
このブログの構成技術
このブログは Astro x Keystatic x Git x Firebas Hosting で構成されています！
ファイル構成はこんな感じです。
src
├── assets
│ └── # ここには画像やフォントなどの素材が入っています
├── components
│ └── # ここにはHPの表紙のコンポーネントが入っています
├── content
│ └── blog # ここにはblog記事のMarkDownファイルが入っています
├── layouts
│ └── # ここにはblog記事を一覧表示する際のレイアウト定義ファイルが入っています
├── pages
│ └── # ここにはblog記事を表示するためのスラグ変換などの機能が入っています
├── styles
│ └── global.css
└── utils
└── # ここにはさまざまなヘルパーメソッドなどが入っていますデザイン自体は、 TailwindCSSv4 を利用しています。
リンク集
なぜWordPressなどを用いていないの？
ブログ記事などを管理するには、高価なマネージドサービスやSaaS, VPS、WordPressやDrupalといったCMSサービス が必要だと考えていませんか？
実は、個人規模や小規模団体のブログ付きHPは、そのようなサービスを 必要としません 。
なぜかというとそもそも、そこまでの権限管理や記事管理能力、全体のデータベースなどを必要とするのは大企業レベルのWebサービスのみです。 また、WordPressやDrupalといったところは、そういったところをターゲットとしているため、機能が爆発的に多いのです。 利用しない機能のせいで、負荷が高くなってしまった結果、動かすためにはVPSなどを契約する必要が生まれてくるのです。
また少し技術的な話をすると、WordPressやDrupalはPHPなどを用いた、HTMLレンダリング をおこなっています。 これは、いわゆるSSRの一貫の技術ですが、こういった随時レンダリングが必要となることから、ページを表示するだけだとしてもサーバーが必要になるのです。 ただし、その分高機能になるわけですね！
リンク集
では改めて、なぜFirebase Hostingでいいの？
これは、Astroの強固な事前レンダリング機能を用いてる、ということにつきます。 Astroは事前にHTMLをレンダリングし、そのファイルを生成しておくことで、HPなどのWebページを構築します。
そのため、サーバーに求められるのは、事前にレンダリングしたファイルを返すことのみ。 動的な作業は一切必要ないのです。
だからこそ、静的ファイルホスティングに切り替えることができ、 FirebaseHosting のみで、動作が実現するのです。
ブログ投稿の基盤としてAstroを採用するメリットデメリット
メリットとしては、やっぱりさっきのバックエンドサービスが最低限でいいということ、レンダリングが事前に行われることや独自の最適化技術により、パフォーマンスがめちゃ高いことが あげられると思います。
ただし、弊害もあります。 ブログ記事の管理が、ファイルベースになり、管理画面などを用意するのが非常に面倒だということ。 あと、記事が増えるたびに全ビルドするので、ビルド時間が伸びるということです。
これ何がめんどくさいって、ある程度 MarkDownやAstro に対して理解がある人以外編集できなくなるんです。 いわゆる、CMSがないことによる弊害ですね。
それを解決できるのが、 Keystatic x Git 差分記録対応記事管理システム です。
Keystaticのすごいところ
これは、ファイルベースでCMSを実現でき、かつ保存にGitを組み込んでいることから、自動的に差分管理や権限管理が行えてしまうことです。
確かに軽量なCMSとして MicroCMS などがありますし、こちらもかなり便利です。 しかも、逐一アクセスが存在しないAstroとは相性抜群です。
しかし、やっぱり安く済ませたいということ、ある程度ファイルは自分で管理したいということ、これ以上機能を煩雑にしたいくないということを鑑みて、 Keystatic の導入を決定しました。
リンク集
最終定なLinkFarm Tech. としての記事投稿フロー
最終的には次の流れで、記事を定期的に投稿することになりました！
- 記事の内容を決める（Shu が Ryousuke が）
- 記事の内容をMarkDonwに整形する（Shu が）
- Keystaticを用いて記事ファイルを作成する（Shu が）
- ビルドして崩れないことを確認する（Shu が）
- Firebase へデプロイする（Shu が）
- 実際の表示テスト、Google Search Console へのインデックスリクエストの発行（Shu が）
今後は、誰でも投稿できるようなシステム整備を進める必要があるなと感じています…！！
改めてSEO対策は？
私たちが行なっているSEO対策は次のとおりです。
- 一旦色んな人にリンクを教えて、Googleのブラウザ経由でアクセスしてもらう
- Google Search Confole に登録してインデックスしてもらうようにサイトマップを渡す
- タグシステムを実装する
- JSON-LD方式 でメタタグを付与する
- XやFacebookようにカード情報を付与する
- Blogの投稿数を増やす
- 単語をふんだんに使う
特に、GSCは確実にやらないといけないことで、インデックスしてもらわないと、まず検索される資格すらありません、っ感じにされます。
また、特に有効だと言われているのは、 JSON-LD などに、メタタグを設定することが早いと言われています。 タイトルやディスクリプションなどを入れていくのが効果的だと言われています！
ご意見質問、アドバイスいただける方はぜひ、ご連絡ください！
終わりに
今回は、 ** 技術開発的な記事 ** を書いてみました。 案外、色々書けるぐらいには頑張っているんだなーと、自分を勝手に褒めております。 もっとすごい人がいるのはわかっていますが、頑張った自分は自分が誉めなければ！！
まだまだ、成長していけるように頑張りますので、ぜひ応援よろしくお願いいたします！
また、定期的に、** 技術的な内容や農業コラム ** なども挙げていけるように、頑張ってまいりますので、ぜひご覧ください。
今後のスケジュール
- 7月〜9月：準備期間・活動を一緒に支えてくれる協賛パートナーの募集
- 9月：現地での田植え・苗植えイベント（第1回）
- 10月〜：奈良の農業とスマート技術を学ぶ農業講座
- 翌年2月：みんなで収穫し、美味しい料理を作って食べる収穫祭
皆さんと一緒に、新しい農業の形を作っていけることを楽しみにしています！ プロジェクトへの参加やご支援に興味がある方は、ぜひお気軽にお問い合わせください。
LinkFarm Tech. 一同