ミクロジ HP を Google Site へ移行した話

ミクロジのYamamotoです。

この2023年3月に、ミクロジはホームページ（以下、HP）を Google Site へ移行しました。この記事では、なぜ移行するに至ったかやなぜ Google Site にしたのか等について記したいと思います。

なぜ移行する必要があったのか？

一言でいえば、Web 制作の負担を軽減するためです。

ミクロジのHPはHTML+CSS+Bootstrapで作成しており、作成したHTMLファイル等をレンタルサーバへアップロードすることで公開しています。ミクロジのHPは2019年に刷新され、下記の見た目になりました。

また、ミクロジでは大体毎年ライブを開催しており、ライブ毎に特設ページを作成しています。この特設ページも同様にHTML+CSS+Bootstrapで作成し、レンタルサーバへアップロードして公開しています。

> 2019年冬に開催したライブの特設ページ: Nagaoka Mikunological Live 2019 in アオーレ

自分は2019年からミクロジの Web 制作を担当していたのですが、2023年3月で大学院を卒業するため後輩メンバーへ引き継ぐ必要がありました。しかし、自分の代が卒業するとサークルから Web 制作の経験のあるメンバーがいなくなってしまうという問題がありました。

HTML をべた書きして1から Web ページを作るのは非常に労力がかかります。ミクロジはライブ毎に特設ページを作っていたので、ライブ毎にこの労力がかかります。加えて、自分たちの代が卒業するまでにミクロジHPのメンテナンス作業も引き継ぎしなければなりません。引き継ぎの話が出た時点で卒業まであと半年というところで、あと半年で Web 制作が未経験のメンバーにスキルを取得してもらって引き継ぎまで完了させるのはちょっと難しそうでした。

また、ミクロジのメインの活動はライブ制作であり、サークル人数にも限りがあることから、ライブ制作とは直接関係のない Web 制作にあまり労力をかけられないという事情もありました。

そこで、ノーコードの Web 制作ツールを導入することで、専門的なスキルが無くても少ない労力で Web 制作を行えるようにしようと考えました。

なぜ Google Site を採用したのか？

どのツールを導入するかを色々検討した結果、最終的に Google Site に落ち着きました。理由は下記のとおりです:

1. 無料で作成から一般公開＆インデックス化まで行える

2. ツールへの学習コストがほぼ0

3. Google ドライブ上で作成できる

1点目について。無料で使える点は非常に魅力的でした。特に、無料で Google 検索に載るようインデックス作成まで行える点が意外と他のツールに無くて魅力的でした（ esa.io の外部公開機能だと nofollow 、 noindex となる仕様 、Notionだと有料プラン でした）。

2点目について。ツールの学習がほぼ不要で、初めての使う人がいきなり触り始めてもある程度使える点は、ツール導入の目的である「専門的なスキルが無くても少ない労力で Web 制作を行えるようにする」という点と非常にマッチしました。自分が初めて使ったときは、触り始めて2～3時間ほどでこんな感じのライブレポートページが作成できました（STUDIOも検討したのですが、意外と学習コストが高くて断念しました…）。

3点目について。Google ドライブ上でサイトが作成できる＝レンタルサーバを使わないということなので、レンタルサーバ周りの引き継ぎを簡略化できます。例えば、レンタルサーバへのFTPクライアントの接続などは引き継がなくて良くなります。

ツール導入後にやったこと

Google Site 導入を決めた後にやったことは以下の通りです:

1. Google Site へのリプレイス実施

2. HP 更新方法についてのドキュメント整備

3. 実際に後輩メンバーに HP 更新をやってみてもらう

① Google Site へのリプレイス実施

まず、 Google Site で新しいミクロジ HP を作成しました。リプレイス後の HP がこちらです:

> URL: https://sites.google.com/view/mikunological/

作った後は、レンタルサーバの設定を変更して現在のミクロジ HP にアクセスするとリプレイス後のページへリダイレクトするようにしました（他にも Google Search Console や Google Analytics (GA4) との連携も行ったのですが、ここでは割愛します）。

リプレイスに際して HP の構造変更も実施し、より訪問者に親切な作りにするとともに HP 更新がしやすくなるようにしました。主な変更点としては、今までは1ページで全ての情報を掲載する構造だったところを、掲載内容（過去ライブ特設ページへのリンク、ミクロジオリジナル楽曲など）ごとにページを分割する構造へ変更しました。

ページを分割した理由は2つあります。1つ目はトップページをシンプルにしてトップページへ載せたい情報へフォーカスしやすくするためです。2つ目は、1ページに全部の情報を載せていくと徐々にページが長くなり、 HP 更新作業が面倒になっていくと考えたからです。

② HP 更新方法についてのドキュメント整備

後輩メンバーが HP の更新ができるよう「こういうときはこのページをこう編集してください」というのをドキュメントにまとめました。実際に作成したドキュメントがこちらです:

③ 実際に後輩メンバーに HP 更新をやってみてもらう

作成したドキュメントをもとに、実際に後輩メンバーに HP の更新をやってもらいました。ちょうど別件で後輩メンバーと「これブログ記事にしよう」というのを進めていたので、そのブログ記事の作成・公開をやってみてもらいました。

実際に、ドキュメントに従って作成してもらったページや更新してもらった箇所がこちらです:

> 実際に作成してもらったページ: TextAliveの中の人とお話ししてきました！

※ こちら、とても素晴らしいブログ記事に仕上げてくれているので、是非お読みください！

ドキュメントの指示通りになっていなかった箇所が一部あったので修正してもらったり自分の方で細かい最終調整をしたりなどはあったのですが、ほぼほぼ後輩メンバーがドキュメントをもとに自力でやってくれました。

これで、ミクロジ HP のメンテナンス作業を引き継げたとともに、当初の目的だった「Web 制作の負担軽減」をミクロジ HP に関しては達成することができました。

苦労した点

Google Site で作ったサイトが中々 Google 検索にインデックスされなかった点が非常に苦労しました…

Google Search Console にミクロジHP の URL （ https://sites.google.com/view/mikunological/ ）をプロパティとして登録しインデックス登録のリクエストを送ったのですが、2週間ほど待っても一向に登録されませんでした。

色々調べたのですが、ページへの流入量を増やす以外に方法は無さそうでした。

参考:

• サイトを公開しましたが、Google検索結果に表示 / 上位表示されません | STUDIO U

• URL 検査ツール - Search Console ヘルプ

現在では、一定の流入量を獲得できたのか、トップページのみインデックスされています。

結び

この記事では、「 Web 制作の 負担軽減」を目的としてミクロジ HP を Google Site へ移行した話について記しました。

もう少し時間などに余裕があればライブ毎の特設ページについてもテンプレを用意するなどできれば良かったのですが、そこまでは至れなかったのが若干心残りです…。

とはいえ、無事、当初の目的を達成し、 HP 更新作業の引き継ぎ完了＆ Web 制作が未経験のメンバーでも簡単に HP 更新ができる状態に持って行けたのでとても良かったなと思います！

HP 更新が簡単になったことで、これから HP で制作コンテンツを載せたり色々お知らせしたりしていければと思いますので、是非ご確認ください！

ここまでお読みいただきありがとうございました！

おまけ: リプレイス中に得られた Google Site の TIPS

「やったらできた。良いのかは知らん」くらいの TIPS です。

その①: カバー画像に GIF 画像が使える

Google Site 版ミクロジ HP のトップページの画像切り替えは GIF 画像で実現しています。カバー画像で「画像を変更」から GIF 画像を探してみると、選択可能であることが分かります。

その②: カバー画像の上に画像は置ける

Google Site 版ミクロジ HP のトップページの「 mikunological 」というロゴはこれで実現しています。画像ブロックを設置してタイトルへドラッグ＆ドロップしてみると、カバー画像の上に画像が設置できることが分かります。