Googleサイトでコーポレートサイトを作る方法と移行前の判断ポイント
目次
こんにちは。前回の「レンタルサーバーからGoogle Workspaceへ移行する方法(メール編)」に続き、今回はWebサイトを「Googleサイト」で作り直す方法をご紹介します。
Webサイトを公開する方法は様々ですが、せっかくGoogle Workspaceを契約してメールサーバーについては「脱レンタルサーバー」できたのに、Webサイトを公開するためだけにレンタルサーバーを契約するものもったいない気もします。
なお、Google Workspaceの利用者がWebサイトを公開する様々な方法については、こちらの記事で詳しく紹介しています。
Google WorkspaceユーザーがWebサイトを公開するベストな方法とは?
Google Workspaceには「Googleサイト」というWebサイトを簡単に作れる機能が標準搭載されています。できれば余計なコストは削減して、企業のWeb周りはシンプルにGoogle Workspaceで統一してみてはいかがでしょうか?
ということで、今回はGoogleサイトへの移行を検討するときの判断ポイントと、Googleサイトでコーポレートサイトのトップページを作る手順をご紹介します。
- Googleサイトに向いているサイト・向いていないサイト(移行前の判断ポイント)
- Googleサイトで「できること」「できないこと」
- サイト構成の考え方から、コンテンツ・テーマ・ロゴ・ヘッダー/フッターを設定してトップページを作るまでの手順
本記事は「トップページを作るところまで」を扱います。お問い合わせページの作成はその2で解説します。サイトの公開・公開範囲の設定、独自ドメイン(カスタムドメイン)の設定とDNSの切り替えは、記事末尾の「公開・独自ドメインへの切り替えは別作業」で概要と公式ヘルプを紹介しています。
Googleサイトで「できること」「できないこと」
Googleサイトは簡単にWebサイトが作れますが、それ故にできない事も多くあります。以下に簡単にまとめましたので、自身のWebサイトがGoogleサイトで実現できるかどうか検討してみてください。
できること
- 独自ドメインが使える(
www.example.comのようなサブドメインで公開。example.comのようなwwwなしのドメインには対応していません) - HTMLを書かなくても簡単にページが作れる
- Googleドキュメントやフォーム、YouTubeなどGoogleコンテンツの埋め込みができる
- 「挿入」→「埋め込む」→「埋め込みコード」から、HTML・CSS・JavaScriptのコードをページの一部として追加できる
できないこと
- サイト全体のHTMLソースやテーマ(デザインの仕組み)を自由に編集できない
- そのため、テーマで用意された範囲を超える自由なデザインはできない
- 動的なページ(PHPなどのサーバー側プログラム)が作れない
- WordPressのようなブログ機能はない
埋め込みコードはあくまで「ページの中にHTML・CSS・JavaScriptのブロックを追加する」機能で、サイト全体のデザインや動作を書き換えるものではありません。
現在のWebサイトが、ECサイトのようにサーバー側のプログラム(PHPなど)やスクリプトを多用している場合や、WordPressのようなブログ型の構成の場合、Googleサイトに移行するのは難しいでしょう。
一方、コーポレートサイトや、店舗のページ、製品の紹介ページなど、数ページ規模の静的なコンテンツであれば、Googleサイトが適しています。また、動的なページは作れませんが、お問い合わせフォームやアンケートフォームといったページであれば、「Googleフォーム」を利用すれば作成することができます。
なにより、HTMLの知識がなくてもページを作成・更新することができるため、担当者レベルでページ編集できるところがGoogleサイトの強みです。サイト制作を外部に委託しているところは、大きなコスト削減になるでしょう。
コーポレートサイトを作ってみよう
今回は、Googleサイトでコーポレートサイト作りにチャレンジしてみましょう。
サイト構成を考えよう
サイトを作る前に、サイトの構成を考えましょう。すでにWebサイトがある場合は、今の構成を書き出して見てください。
本記事では、私の個人ページを作成してみたいと思います。
-
ホーム
-
サービス内容
- システム開発
- ホームページ制作
- Webサイト運営
-
プロフィール
-
運営サイト
- どんとこい!Google Workspace
-
-
お問い合わせ
「ホーム」と「お問い合わせ」の2ページ構成とし、1ページ目にサービス内容、プロフィール、運営サイトの紹介をしてみます。2ページ目はGoogleフォームを使ったお問い合わせフォームを設置してみます。
Googleサイトを作ってみよう
新しいサイトは、パソコンでGoogleサイト(https://sites.google.com/)を開き、上部の「新しいサイトを作成」からテンプレートを選んで作成します。今回はゼロから作るので、「空白のサイト」を選びます。

作成入口・編集画面・テーマの作成・テーマの色・ヘッダー画像の画面は、2026年9月26日にPCで確認した現行の画面です。それ以外の画面は2022年に撮影したものです(ブランドの画像、フッターの追加、プレビューの操作は2026年9月26日の現行画面でも同じことを確認しています)。Googleサイトの画面や表記は更新されることがあるため、実際の画面と異なる場合はGoogle公式ヘルプ「Google サイトの使い方」もあわせて確認してください。
空のサイトが表示されました。左上の「無題のサイト」となっているところは、サイト名に変更しておきましょう。この名前はGoogleドライブ上のファイル名にもなります。なお、ページ上部の「サイト名を入力」欄は、サイト上に表示するサイト名を入力する欄で、左上の名前とは別に設定します。
今表示されているのが、空のトップページ(1ページ目)です。ここから、右メニューの「挿入」「ページ」「テーマ」のタブを切り替えて、サイトを作っていきます。

コンテンツを埋めていこう
デザインは置いておいて、まずはサイト構成に従い、トップページにコンテンツを入れていきましょう。
Webサイトは階層構成を持たせる事が一般的です。常に「見出し」-「小見出し」-「本文」が繰り返し出現するように構成します。(小見出しは無い場合もあります)
コンテンツは、「挿入」タブからテキストや画像を選択して挿入していきます。「コンテンツブロック」では、レイアウトされたテキストと画像の組み合わせをまとめて挿入することができるので便利です。

すべてのコンテンツを入力しました。テキストブロックの階層に合わせて「見出し」「小見出し」「本文(標準テキスト)」を正しく設定しましょう。
なお、各コンテンツは「セクション」に分かれているので、ドラッグ&ドロップで簡単に順番を入れ替えたりすることができます。

コンテンツを入れていると、色やフォントを変えたい部分がでてくるかと思いますが、ここはぐっと我慢して、まずはコンテンツと見出し設定を入れていってください。
テーマを決めよう
コンテンツを入れ終えたら、「テーマ」タブを選択して、サイトの大まかなテーマを決めましょう。テーマはすべてのページに適用される、ページ装飾の形や色、フォントのスタイルがセットになったものです。今回はオリジナルのテーマを作ってみました。もちろんGoogleが用意している幾つかのテーマから選択して、この章をスキップしても構いません。
テーマタブからカスタムの新規作成(+ボタン)を選択します。

テーマの名前を入力して「次へ」を押します。この画面では「ロゴを追加」(サイトの上部に表示)と「バナー画像を追加」(ヘッダーセクションの背景として表示)もできますが、どちらも後から設定できるため、いったんスキップします。

次にサイトの色を決めます。が、ここではプレビューできないため、ここもいったんデフォルトのまま「次へ」を選択します。

フォントもプレビューできないので、デフォルトのまま「テーマを作成」を押します。

テーマが作成されました。テーマタブでは、色、テキスト、画像、移動、コンポーネント、間隔のカテゴリで詳細な設定ができます。
色
まず、Webサイトの色を決めましょう。Googleサイトのテーマの色は、「デフォルト」の色のほか、背景色と見出し・本文の文字色の組み合わせを「スタイル1」〜「スタイル3」の3個まで保存できます。スタイルを選んでから「背景」「タイトルと見出し」「本文」の色を設定します。今回は白背景、水色背景、薄いグレー背景の3つのスタイルを作成しました。

作成したスタイルは、各セクションの左メニューの「パレットアイコン」で変更することができます。

テキスト
次は、見出し、小見出し、標準テキストなど各テキストのフォントや配置を設定します。こちらも少し調整しました。

その他の画像、移動、コンポーネント、間隔については、今回デフォルトのままとしました。必要に応じて調整してください。
ロゴとファビコンを設定しよう
次にサイトにロゴを設定しましょう。ロゴがあるとWebサイトとして締まりがでますし、訪問者に強く印象付ける事ができます。ちなみにロゴは無料のWebサービスを利用すると簡単に作ることができます。今回は「Canva」というサイトで作成しました。
ロゴは、右上の歯車アイコンから設定ウィンドウを開き、「ブランドの画像」タブからアップロードできます。同時に「ファビコン」もアップロードしておくと良いでしょう。ファビコンとは、ブラウザのタブ部分に表示される小さなアイコンの事です。未設定の場合はGoogleサイトのアイコンが表示されます。

ヘッダー画像とフッターを設定しよう
トップページの仕上げに、ヘッダー画像とフッターを設定します。
ヘッダー画像は、ページ上部のメインビジュアルにマウスを合わせると左下に表示される「画像」メニューから変更できます。手元の画像を使う場合は「アップロード」、用意されている画像から選ぶ場合は「選択」を押します。

「選択」を押すと「画像の選択」画面が開き、ギャラリー、URL、Google 画像検索、写真、Google ドライブから画像を選べます。今回は「ギャラリー」にあるGoogleが用意した画像から選択しました。

続いて、ページ下部の「フッターを追加」から、フッター文字列を設定します。今回はサイト名のコピーライトを設定しました。

これでトップページが完成しました。ページ上部の「プレビュー」ボタンを押して、内容を確認しましょう。プレビューモードではPC、タブレット、スマホの3つのサイズで確認することができます。


公開・独自ドメインへの切り替えは別作業
トップページができても、それだけでは既存サイトからの移行は完了しません。実際に切り替えるときは、Google公式ヘルプに沿って次の作業を行います(2026年9月26日時点の公式ヘルプで確認)。
- 公開と公開範囲の設定:右上の「公開」からサイトのウェブアドレスを決めて公開します。共有設定で「制限付き」か「公開」を選べます(サイトを公開して共有する)
- 公開後の確認:ログインしていないブラウザなど、編集者以外の環境で表示を確認します
- 独自ドメイン(カスタムドメイン)の設定:設定の「カスタムドメイン」から、Search Consoleでのドメインの所有権確認と、DNSへのCNAMEレコード追加を行います。独自ドメインで表示するには、サイトを一般公開している必要があります。反映には最長48時間ほどかかることがあります(サイトにカスタム ドメインを使用する)
- 切り替え前後の確認:旧サイトのページ構成と新サイトを見比べ、リンク切れや表示崩れがないか確認します
DNSを切り替えると、そのアドレス(例:www.example.com)では旧サーバーのWebサイトが表示されなくなります。メールと同じドメインを使っている場合は、Webサイト用のレコードだけを変更し、MXレコードなどメール用の設定を消さないよう注意してください。
次回はお問い合わせページの作成へ
以上、Googleサイトでトップページを作成する方法をご紹介しました。次回は、お問い合わせページを作成する方法をご紹介いたします。
次回の記事はこちら!お疲れ様でした!