【2020年版】 Google サイトは本当に素人でも使いこなせる? 実際に社内ポータルを作ってみた

Google が提供している、Google サイトというサービスをご存知ですか?
Google サイトは直感的に操作ができて簡単にWebサイトが作れる画期的なツールですが、使ったことがあるという人はあまり多くないのではないでしょうか。
今回はテンプレートを活用して誰にでも使こなせる、社内ポータルの作り方について説明します。

WEB知識がなくても Google サイトを使えばWebページが作れる?

今回、社内ポータルサイトを作るのはらくらく出版総務部の宗さん。Google Workspace(旧G Suite)のヘビーユーザーではありますが、Web制作の知識はからっきし。
なのに今回は「社内ポータルを作りたい!」という社長からのリクエストに応えて社内ポータル立ち上げを担当することになりました。
さすがに1人で作るのは少し不安なので、システム担当の阿井 にレクチャーしてもらうことになりましたが、果たして社内ポータルを立ちあげることはできるのでしょうか。

宗さん

こんにちは、らくらく出版社の総務をしている宗睦美(そう むつみ)と言います。
今回、社内で社員用のポータルサイトを作ることになりました。 まったくサーバーやHTMLなどの知識がないのでかなり不安なのですが、Google サイトならだれでも簡単にWebサイトを作ることができると聞いて、挑戦してみることにしました。

阿井さん

おなじく、らくらく出版のシステム担当をしている阿井 貞一(あい ていいち)と言います。 最初は僕に社内ポータル立ち上げの打診があったのですがECサイトのリニューアルを優先することになり、今回は宗さんにレクチャーするという形でポータルの立ち上げに関わることになりました。

技術的なスキルがなくても Google サイトなら簡単にサイトが作れる

宗さん

阿井くん、今回は社内ポータル立ち上げのサポートよろしくね。 部長が、Google サイトを使えばWebの素人でもサイトが使えるって言ってたんだけどそれって本当?

阿井さん

こちらこそ、よろしくおねがいします。 僕は、大学のゼミの連絡ツールのために Google サイトを使ってサイトを立ち上げたことがあるんですけど、すごく簡単でしたよ。 宗さんは普段 Google ドキュメントとかのツールを使いこなしているから、そういう人にとってはすごく使いやすいと思います。

宗さん

サーバーのこととか、HTMLについての知識がまったくないんだけど、大丈夫かなぁ。

阿井さん

HTMLを使う必要はないですし、サーバの設定をしてファイルをFTPであげたりする必要はないので安心してください。

宗さん

そうなんだ。ちょっとほっとした!じゃあさっそく社内ポータルの作成を開始してみますか!

Google サイトは簡単に他のメンバーとの合同編集できる

宗さん

あ、一つ質問があるんだけど。

阿井さん

なんですか?

宗さん

今回は私のアカウントでサイトを作る予定なんだけど、この社内ポータルは社長とか人事も更新する予定なんだよね。 そういう場合は、他のユーザーも編集することはできるの?

阿井さん

Google サイトは、Google ドキュメントやスプレッドシートみたいに、他のユーザーに編集権限を渡すことができますよ。

宗さん

よかった!そういうところもやっぱり Google らしいね!

新しい Google サイトはスマホ対応

宗さん

あともう一つ、編集とか営業が出先で見ることがあるからスマホ対応にしてほしいっていう要望が来たんだけど、そんなこともできるの?

阿井さん

新しい Google サイトはレスポンシブ対応なんで、スマホでも見やすい仕様になっていますよ! 特別な設定をする必要もありません。

※新旧の Google サイトの違いについては「社内掲示板として使うならどっち? rakumo ボードと Google サイト比較してみた!」の「簡単に本格的なサイトが作成できる! Google サイト機能紹介」を参考にしてください。

宗さん

オッケー。これでだいぶ Google サイトへの心配が解消されたかも!

サイトを作成する前にやっておきたいこと

サイトの構成を考える

宗さん

よーしそれじゃ早速作ってみよう!

阿井さん

あ、その前にやっておきたいことがあります。 どんな内容を社内ポータルに載せるか、もう決めてありますか?

宗さん

ああ、それなら、こないだミーティングした時に決めておいたよ。 社長と、人事からあがった要望は、会社のキャッチコピー、社長からのおしらせ、社則、社内スケジュールのカレンダー、人事・総務からのお知らせ、社長への意見箱くらいかな。

阿井さん

では、その内容をどうサイトに表示させるか、ざっくりでいいので事前に構成を考えておくと実際に作り出す時スムーズですよ。

宗さん

なるほど、ちょっと考えてみるね。こんな感じでどうかな。

阿井さん

いいですね。ではこの構成で進めてみましょう。

実際に Google サイトで社内ポータルを作ってみよう

Google サイトにアクセスする

阿井さん

構成もできたので、いよいよサイトを作り始めましょう。 まず、アカウントにログインをしたら Google のアプリ一覧から、「サイト」を選択してください。https://sites.google.com/ に直接アクセスしてもOKです。

テンプレートやテーマ決める

宗さん

Google サイトのギャラリーには、様々なテンプレートが用意されているのね!

阿井さん

まずは、テンプレートを選んでみましょう。
テンプレートは作る人の好みもあるかと思いますが、作りたいサイトのイメージに近いものを選んでみてください。今回は社内ポータルなので「チーム」というテンプレートはどうですか?

宗さん

うん、悪くない!レイアウトやデザインはあとから変えられるのよね?

阿井さん

もちろん、あとから載せたいコンテンツに合わせてカスタマイズできますよ。

テンプレートが決まったら、次にテーマを決めましょう。この辺は作る人のセンスもあるんですが、会社のCI(コーポレートアイデンティティ)とかに合わせてまずはざっくり設定してみましょう。テーマもあとから変更することもできるので。

テーマは右のタブをクリックすると表示されます。

宗さん

じゃあ、まずはテーマを決めてみるね。
うーん、この中だと自分のイメージに近いのは「Vision」かな。テーマカラーは無難に白。フォントはとりあえずデフォルトで。うん、こんな感じかな。

レイアウトを決める

阿井さん

テーマが決まったら「挿入」からレイアウトを決めていきます。さっき作った構成に近いものを選んでみてください。
この、レイアウトの中の区切られたコンテンツのことを「セクション」と言います。

宗さん

デフォルトのテンプレートだとサイトの説明文の下に3分割のコンテンツが入っているので、その上に2分割のコンテンツを挿入したいかな。

阿井さん

では、挿入したい部分に右側の2分割のレイアウトをドラッグしてみてください。

宗さん

上が2分割、下が3分割になった!

要素を削除する

阿井さん

テンプレートには文字や写真など不要な要素が入っていますよね。
使わない要素はあらかじめ削除しちゃいましょう!

宗さん

不要な要素かセクションをクリックで選択して、削除アイコン(ゴミ箱マーク)をクリックすれば簡単に消すことができるのね♪

阿井さん

逆に要素を追加したい場合は、要素を入れたい場所の上のセクションをクリックして、右の「挿入」から任意の要素(テキストボックス、画像、URL埋め込み、Google ドライブ)をクリックすればOKです。

写真や文字を編集する

宗さん

ざっくりとレイアウトができたから次はいよいよコンテンツを編集ね。

阿井さん

構成の内容に沿って写真や文言を編集してみましょう。
まずは左上の「サイト名を入力」というところですが、もし決まってなければ「らくらく出版 社内ポータル」と入れておきましょう。

宗さん

すごい、文字を入れるだけでサイト名が反映された!
[チーム名]のところには、会社のキャッチコピーを入れてみよう。直感的に操作できて、Googleのスライドを使ってるような感覚に近いかも。

阿井さん

「見出しのタイプ」からバナー(メインのビジュアル)の大きさも変更できるんですが、とりあえず今はデフォルトにしておきましょう。
もし、バナーに入れる写真があれば、それも入れちゃいましょう。バナーの上に表示されている「画像を変更」から差し替えられますよ。

宗さん

できたー!できたらどこかにロゴも入れたいかも

阿井さん

ロゴは、サイト名のところにカーソルを合わせると「ロゴを追加」と出るので、そこから挿入することができますよ。

阿井さん

設定画面が表示されるので、ロゴ画像をアップロードしてみてください。

ファビコン(そのWebサイトのシンボルマークで、ブラウザのタブやお気に入りに登録したときに表示される小さな画像のこと)もこの画面から設定できるので、よかったらそこにもロゴを入れてみてください。

宗さん

ロゴを入れたらだいぶサイトっぽくなってきた!じゃあ次は早速コンテンツを入れてみよう♪

阿井さん

では次は構成に合わせて各セクションに文言を入れてみてください。ここも文字を入れるだけなので簡単ですよ。

宗さん

こんな感じで大丈夫かな。本当に文字を直打ちするだけでいいんだね〜。

Google アプリと連携してコンテンツを編集する

阿井さん

今度はいよいよコンテンツを入れていきましょう。各セクションにはどんなコンテンツを入れるイメージですか?

宗さん

社長からのおしらせは動画。

  • 社内スケジュールのカレンダーは、Google のカレンダーが表示できたらいいかな。
  • 社則はクリックすればそのまま社則が書かれたページに遷移してほしい。
  • 人事・総務からのお知らせはクリックすると一覧ページに遷移するイメージ。
  • さらに、お知らせの見出しをクリックしたら各お知らせの詳細ページが見られるようにしたいな。
  • 社長への意見箱は、Google フォームが立ちあがるようにしたいんだよね。

阿井さん

【カレンダーの挿入】

では、簡単なところからやってみましょうか。まず社内スケジュールのカレンダーはすでにあるものを表示させるんですよね。そのカレンダーは、Google のサイトを作成している人のアカウントのマイカレンダーに共有されてないといけないんですけどそこは大丈夫ですか?

宗さん

もともと全社員に共有されているカレンダーだから大丈夫。

阿井さん

では、カレンダーを入れたい場所の追加アイコン(+)をクリックしたら、Google サイトで連携できるアプリが出てくるので、カレンダーを選んでください。

宗さん

マイカレンダーの一覧が出てきた!

阿井さん

その中から表示させたいカレンダーを選んでみてください。デフォルトは1日ごとのカレンダー(予定リスト)になっているので、月表示、週表示にしたい場合はカレンダーをダブルクリックしてカスタマイズしてみましょう。

Google カレンダーが週ごとに表示された

阿井さん

【動画の挿入】

社長メッセージの動画って、あれですよね、限定公開で YouTube に上がっているやつ。

宗さん

そうそう。それがそのまま埋め込みできればOK。

阿井さん

YouTube に上がっている動画をサイトに載せるときは、下記の手順で設定します。

  1. 追加アイコン(+)をクリックしたら「YouTube」を選択してください。
  2. 次に、URLを入れる枠が表示されるので、載せたいYouTubeのURLを入れて検索ボタンをクリックしてみてください。
  3. 最後に、動画のサムネイルが表示されたら「選択」ボタンをクリックします。

宗さん

動画が埋め込まれた!

阿井さん

【Googleのファイルとの連携】

次に社則ですが、社則はどんなファイルで作ってありますか?

宗さん

ページ数が結構多いから、Google スライドにまとめてあるよ。

阿井さん

では、追加アイコン(+)から「ドライブ」を選択してください。Google ドライブの中にある、該当のファイルを選べば完了です。

宗さん

すごい、スライドショーで表示されるようになってる。クリックすれば元のファイルを閲覧できるのね。

阿井さん

【Googleフォームと連携する】

社長への意見箱は Google フォームを利用するとさきほど聞きましたが、すでに Google フォームはできてますか?

宗さん

社長が作ったやつをシェアしてもらってるから、共有ファイルに入ってるよ。

阿井さん

ではここも、追加アイコン(+)をクリックして「ドライブ」から該当する Google フォームのファイルを選択してください。

宗さん

これはクリックするとフォームのページに遷移するのね。ここもこれで完成!

阿井さん

【別階層のページに遷移する】

次は人事・総務からのお知らせですね。
これは1階層下の遷移先ページを新しく作る必要がありますね。

新しいページを作るには、右側のメニューから「ページ」 をクリックして、下の方にある+マークにカーソルを合わせてください。
「新しいページ」をクリックしたら、ページ名を入力して、[完了] をクリックすれば新しいページができ上がります。

阿井さん

もし任意のURLを設定したい場合は、「詳細」をクリックして「カスタムパス」のところにURLに使いたい文字列を入れてみてください。

宗さん

あ、新しいページができた!このページを人事・総務からのお知らせ一覧にしたいから、まずはページの中に見出しを入れていきたいんだけど…。

阿井さん

その場合は右メニューの「挿入」から「テキストボックス」を選んでテキストを入れてみてください。

宗さん

さらにもう1階層下に詳細な情報を入れたい場合はどうすればいいのかな?

阿井さん

さっきと同様にまた新しいページを作ってみてください。そのページにコンテンツを入れたら、下記の手順でリンクを貼ります。

  1. テキストのリンクを貼りたい部分を選択
  2. 「リンクを挿入」をクリック。
  3. 該当するページを選択。
  4. 適用をクリック

宗さん

リンクからバッチリ遷移できるようになった!

阿井さん

宗さん、この短時間でだいぶ操作に慣れてきましたね。では、次はトップページからお知らせページにリンクを貼ってみましょう。
まず、「人事・総務からのお知らせ」の、追加アイコン(+)をクリックして画像を入れます。画像はお知らせのページであることがわかりやすいものがおすすめです。

宗さん

OK、そうしたらさっきの要領で見出しとに画像リンクを貼ればいいのね。できたー!

阿井さん

スマホからも見やすいし、いい感じですね。

左:パソコンの画面 右:スマートフォンの画面

公開設定をしたら公開!

宗さん

これであとは公開するだけだね!

阿井さん

公開するときは右上の「公開」ボタンを押して下記の手順で設定をしていきます。
まず、社内ポータルなので、下記の手順で社内のユーザーだけ閲覧できるようにしましょう。

  1. 右上の「公開」ボタンをクリック
  2. ウェブアドレスを設定するポータルサイトであることがわかりやすいものを入れておきましょう。
  3. 次にサイトを閲覧できるユーザーの設定ですが、デフォルトでは同じ社内のユーザーに限定されています。ポータルサイトは社内限定公開のケースが多いかと思うので、このままにしておきます。
    ※部署やチームごとにGoogleグループを作成している場合は、その特定のグループのみ閲覧できる設定にすることも可能です。

  4. 設定が終わったら「公開」をクリックします。

宗さん

これで社員全員がこのポータルサイトをみられるようになるのね。阿井くんどうもありがとう。
使い方をバッチリ覚えたらから更新は私一人でもできそう!

阿井さん

がんばってポータルサイトのコンテンツを充実させてくださいね。楽しみにしてます!

Google サイトのデメリットや注意点

阿井さん

Google サイトは Google のツールに慣れたユーザーにとっては使い勝手の良い、直感的にサイトが作れるサービスです。
一方、デメリットとして下記が挙げられます。

  • レイアウトの自由度があまり高くない
  • 旧バージョンにあったサイト内検索機能ができない
  • サイト訪問者がコメントを追加する機能がない
  • サイトのページごとに閲覧、編集できるユーザーを指定することができない

Google サイトで社内ポータルを作る際は上記のデメリットを理解した上で導入を検討してみてくださいね。

まとめ

宗さん

今回、Google サイトを使って社内ポータルを作ってみたのですが、本当にWebの知識のない私でもサイトを作ることができました。 HTMLを使うことは一切なく、まるで Google のドキュメントファイルを操作する感覚でした。 普段、仕事で Google Workspace(旧 G Suite)を使っている人なら、直感的に使えるサイトだと思います。 予算もかけず、社内のエンジニアの手を煩わすこともなくサイトを作りたい、と考えている人にとって、Google サイトはまさにニーズに応えるツールですよ!

関連記事