見積もり
幼稚園・保育園のホームページ参考デザイン25選事例まとめ【2024年最新版】
「幼稚園のサイトを作りたいけれど、具体的にどんなことに気をつけたらいいかわからない！」
とお悩みではありませんか。
入園につなげるために、大切なのは「安心感」と「信頼感」です。
そこで今回は、Webデザイナーである筆者が「幼稚園・保育園のホームページを制作するときに押さえるべきポイント」を解説します。
※ホームページ制作にあたり、他社事例を参考にされたい方はこちらもあわせてご活用ください。
Webサイト制作事例をまとめました
WEBサイト制作・リニューアル事例集
この資料では以下の内容を紹介しています。
「WEBサイト新規制作事例集」
「WEBサイトリニューアル事例集」
無料でダウンロードする
【プロが厳選】保育園・幼稚園に強いホームページ制作会社まとめ！
保育園・幼稚園のホームページに掲載すべき内容
保育園・幼稚園のホームページに掲載する内容は、保護者の方が求めている情報を考慮して作成する必要があります。
ホームページに掲載すべき具体的な内容は、以下の通りです。
- 施設の概要（所在地、運営時間など基本情報）
- 教育理念と方針
- 提供サービス（カリキュラム、食事等）
- スタッフ紹介
- 施設と設備、安全対策
- イベント・年間行事
- 入園案内（手続きや流れ）
- 料金
保育園・幼稚園の特徴やスタッフの情報や園内の様子などがわかれば、信頼性が高まり安心感が増します。文章だけでなく写真や動画をプラスすると、より魅力が伝わりやすくなるでしょう。
実際に子どもを通わせるイメージをしてもらえる内容を掲載することで、問い合わせ率がアップします。
参考にしたい幼稚園・保育園ホームページのデザイン事例25選
ここでは、実際に幼稚園・保育園のホームページ制作で参考にしたいデザインを25事例ご紹介。
各事例で参考にすべき点を解説しています。ご自身の園のホームページ作りにお役立てください！
当サイト、Web幹事に登録されている実績はこちらからご覧ください。
費用の目安・制作期間・作成した制作会社まで全て閲覧できます。
幼稚園のホームページデザイン事例9選
佛教大学附属幼稚園
「イラスト」と「手書き風フォント」を使って親しみやすく楽しい雰囲気のサイトです。絵本をめくる感覚で思わず最後までスクロールしてしまいます。
子どもたちの写真が大きく使われ、園内の楽しい雰囲気が伝わってきます。文字情報は余白がしっかり取ってありストレスなく読める点もポイントの1つです。
駿河台幼稚園
イラストを大胆に使いつつ、情報はコンパクトにまとめられています。
ファーストビューから１回スクロールすればすべての情報にアクセスできます。
「カレンダー」や「お知らせ」といった更新性のあるコンテンツによって保護者の利便性が考慮されているだけでなく、サイトがきちんと運用されているのがわかります。
サイトがきっちりと運用されていることも「信頼」や「安心」につながりますよね。
のだ山幼稚園
一瞬「企業サイト」かと思うほど直線的でクールなデザインです。イラストもなく色づかいも暗めで、いわゆる「幼稚園っぽいかわいいサイト」ではありませんが、「きちんとした幼稚園」である印象を与えます。
幼稚園・保育園のホームページとしては「珍しい」かもしれません。しかし、だからこそ明確に「差別化」でている好例でもあります。
実際、イラストを入れるのは費用の面でコストが非常にかかります。コストを抑えつつ園のよさをアピールする例としてとても参考になるサイトです。
愛宕幼稚園
幼稚園・保育園のホームページでは手書き風のフォントやゴシック体のフォントがよく使われますが、愛宕幼稚園のサイトでは明朝体のフォントが効果的に使われています。
仏教系の幼稚園ということもあり落ち着いた雰囲気を醸し出しています。
写真を大胆に使いつつも随所にイラストやパターンを加えることで、和風のおしゃれさが感じられるサイトになっています。
入園を検討されている保護者が知りたい情報が網羅されわかりやすく配置されており、ユーザーに信頼感を与えます。
学習院幼稚園
東京都豊島区目白という都会に立地してありながらも、ホームページ上に多くの自然や園児が外で遊ぶ写真を掲載！それゆえに、園がかかげる"遊びをとおして豊かな基礎づくりを"という教育の理念が明確に伝わってくるホームページとなっています。
また、園の雰囲気がよく伝わるよう季節ごとに分けたフォトギャラリーがあり、100枚以上の写真で園の雰囲気を創出！
フォトギャラリーを作っている園のサイトは少ないので良い参考になるのではないでしょうか。
豊多摩幼稚園
笑顔の動物のイラストを各所に散りばめ、丸みがかったフォント、そして薄緑の背景や水色といった落ち着いた色を使用！
The幼稚園のホームページと言わんばかりの可愛らしさを醸し出しています。
また園児の写った写真を積極的に使うことにより、園での1日の生活や一年を通しての行事などをわかり易く表現！楽しそうな園児たちの生活が見受けられます。
御国幼稚園
ファーストビューが動物の口の中に園児たちの写真が表示されるようになっており、可愛らしい印象を与えます。
そしてとにかく多くの写真を使用し、楽しそうな園児の生活や清潔な園内の様子がわかり、自分の子供も同じように楽しんでくれたらなと思わせてしまいます。
また仏教徒の幼稚園であるため、大仏やお坊さんのイラストがあるが、馴染みやすいよう可愛らしくデザインされており、親しみやすさ倍増です！
こくぶ幼稚園
笑顔の園児の写真がトップページに大きく載っているのが特徴。遊んだり、給食を食べたりしている写真から子どもたちの楽しそうな様子が伝わってきます。「自分の子どもも楽しく過ごせるかも」と想像をかき立てられます。
「教育について」のページでは「音楽教育」「英会話」など種類別に、教育内容を丁寧に説明しているのもポイント。英会話に関しては担当者のKEVIN先生から「国際的な子どもに育てるために意識していること」の説明もあり、安心感を与えることができます。
また、年間行事を写真付きで紹介していて、遠足や運動会などの活動を子どもたちがイキイキと楽しんでいる様子が伝わってきます。
大原幼稚園
園内のフロアガイドをオリジナルのイラストを使って示しているのがポイント。手描きのような雰囲気で、温かみが感じられます。
※画像引用：大原幼稚園
さらに「バスコース」のページでは幼稚園の送迎バスがどのエリアを回るかを図で示しています。「うちの地域も送り迎えしてくれるかな？」という点を気にする親御さんも多いため、地図などを使って対応エリアを示すと親切です。
保育園のホームページデザイン事例8選
パレット保育園
パレット保育園は他の幼稚園・保育園とは違って、グループ全体の保育園をまとめて掲載するホームページです。
グループ全体の保育園のホームページであるため、1つの保育園のページよりもコストをかけることができ、規模を大きくすることが可能！多くの保育園を経営している場合は真似する価値があるのではないでしょうか。
また全体的に写真が大きく、パッと見たときの印象がGood。
多くの保育園のホームページであるため、頻繁にサイトが更新され、安心感・信頼感のあるサイトとなっています。
茶々保育園
茶々保育園もまた、グループ全体の保育園をまとめて掲載するホームページです。
幼稚園・保育園のホームページにはあまりなかった、ファーストビューで動画を使用し、ホームページに高級感を出すことで、保護者に信頼できる保育園だと思ってもらうことが可能！
ブラウン系の色を多く使い、雰囲気を統一。ホームページをおしゃれに見せています。
アイン保育園
一般的な幼稚園・保育園のホームページでは丸みを帯びた文字や写真により優しさを表現！
ところがアイン保育園のホームページでは写真もほとんど切り抜かれず四角のまま。角ばった文字を使用しており、きちんと教育してくれるといった印象を持つことができます。
また毎日ブログが更新されており、常に園児たちの様子がわかることも保護者から見ると安心して子供を預けられる要素となるでしょう。
ひより保育園
大企業のECサイトかと思わせるほどの落ち着きを放ち、写真撮影・選択に相当な力を投入していることがうかがえます。
スライドショーに写る写真は田舎のような雰囲気で統一されており、皆さんがホームページを制作する際の参考になるのではないでしょうか。
また職員全員を写真とQ&Aとともに紹介。親しみやすさを表現しており、保護者が安心して子供を預けられる要素となるでしょう。
松翠保育園
今までご紹介してきたホームページに比べると、かなりシンプルです。
しかしその分、情報が探しやすい構造になっています。
ページトップではグローバルメニューに、コンテンツエリアではサイドバーにメニューの項目がまとめられています。色分けされているので見やすいですね。
「手作りおやつ・おかず」の写真が使われているのも、保護者の興味・関心を引きます。写真の明るさや鮮やかさを少し調整すると、より美味しそうな写真になります。
調整はむずかしそうに感じるかもしれませんが、スマホのアプリやカメラの標準機能でも簡単にできますよ。
木ノ下保育園
今まで紹介してきた幼稚園・保育園のホームページとは大きく異なり、写真よりもイラストの方が多くなっています。
イラストには、見る人に物事を想像させる効果があり、幼稚園・保育園の場合は保護者に子供の園での生活を想像させ、ホームページへの滞在時間を長くする可能！
またシンプルなサイト設計で、どこに何が書いてあるかがわかり易くなっています。
東筑保育園
園児たちの写真を載せたフォトギャラリーのページで、月々の活動を写真付きでイキイキと伝えているのがポイント。卒園式前のプレゼント作りやゲーム大会、クリスマス会などを元気に楽しむ子どもたちの様子が伝わってきます。
また、可愛らしいイラストがあちこちにあしらわれているのもポイント。明るく、温かみのある雰囲気が伝わります。
のぞみ保育園
トップページに動画を載せているのがポイント。保育園の先生が笑顔で子どもたちに接している様子が伝わり、親御さんに安心感を与えることができます。
また、保育の方針を詳しく説明しているのも特徴です。ハンガリーから取り入れた「マイバ方式」という独自の方針で保育を行い、子どもたちの自主性を尊重していることを保育園の1日の流れや、 0～2歳児、3～5歳児のクラスごとに丁寧に説明しています。子どもたちが笑顔でのびのびと遊ぶ様子の写真や動画も多くあり、親御さんに信頼感を与えます。
園内マップやアクセス情報で手書き風の独自のイラストを用いているのも特徴で、温もりが伝わってきます。
こども園のホームページデザイン事例3選
押原こども園
保護者の方が気になる「園の方針」を明確にわかりやすく提示しています。
「押原こども園はどんなところなのか」がキャッチフレーズから始まって徐々に詳しくわかるように設計されています。
ざっと知りたい人にはひと目で、詳しく知りたい人にはしっかりと内容が伝わるように情報が整理されています。
おおやけこどもえん
情報の配置がシンプルで、テンプレートデザインを使っても少しのカスタマイズで実現できそうです。しかしかけるべきところにはきちんと手がかかっています。
ベージュを基調にしてところどころにイラストを入れて、ホームページ全体が「こども園」であるかのように演出されています。
また園の様子を伝えるためにトップページで動画を使っているのが特徴的です。
動画はよりいきいきと園の様子を伝えられる一方で、表示に時間がかかったり制作費用がかかったりします。予算に合わせて検討するのがGoodです。
おおやけこどもえんの場合は、動画で興味をもってくれた方がすぐに入園募集の情報にアクセスできるようになっており、動画が効果的に使われています。
風と緑の認定こども園
動画を多く載せているのがポイント。トップページにも大きく動画が載っていて、子どもたちが自然豊かな環境の中で木登りをしたり、泥遊びをしてのびのびと楽しんでいる様子が伝わります。
また「園の様子MOVIE」というページでは、同園の紹介動画を視聴でき、子どもたちが楽しめるように園舎のデザインにこだわっていること、給食は毎日調理員の方が手作りしていることなどが詳しく説明されています。子どもたちが元気に楽しく過ごすために様々な配慮がなされていることが伝わり、安心感を与えることができます。
低予算で作られた保育園・幼稚園のホームぺージデザイン事例5選
International Kids in TOKYO
インターナショナルスクールのホームページです。モンテッソーリ式の教育方針を取り入れているなど、教育方針が伝わりやすいホームページとなっています。
イラストや写真から、子どもの自由な発想を大切にしているイメージを与えます。
こちらのホームページの費用目安は30万円程度、制作期間は約1ヶ月〜2ヶ月です。低予算でも、おしゃれでわかりやすいホームページが作れます。
あたご幼稚園
あたご幼稚園のホームページは、子どもたちが見ても楽しいと感じられるようなサイトデザインです。シンボリックな園舎をサイト内のデザインに落とし込み、可愛らしい鳥や雲などのイラストが導入されています。
園の紹介動画の埋め込みや、卒園者の声を掲載している点も園の魅力が伝わりやすくなっているポイントといえるでしょう。
こちらのホームページの費用は31〜50万円程度、制作期間は約2ヶ月が目安です。
埼玉県某幼稚園
低予算のホームページの事例として、埼玉県某幼稚園のページも挙げられます。こちらのホームページの費用目安は31〜50万円程度です。全体的に柔らかい印象のデザインです。スタッフや子ども達の様子が伝わりやすく、乳幼児期をのびのびと過ごせるような印象を与えます。
学校法人永田学園 昭和幼稚園
大切にしている方針が伝わりやすいページとなっており、子ども達の可能性が広がるようなイキイキとした印象を与えます。園の取り組みや子ども達の日々の様子が豊富に掲載されているのも特徴です。こちらのこちらのホームページの費用は31〜50万円程度、制作期間は約1ヶ月が目安です。
那須幼稚園
長い歴史があり多くのファンがいる園で、保護者様へのアンケートをもとに設計されたホームページです。教育目標や園での1日の様子が伝わるホームページとなっています。お問い合わせへの導線がわかりやすいのもポイントです。
こちらのこちらのホームページの費用目安は31〜50万円程度、制作期間は約2ヶ月です。
そのほかの事例は以下から検索できますので、あわせてご覧ください。
また、無料でダウンロードできるWebサイト制作事例集をご用意しています。こちらもあわせてご活用ください。
Webサイト制作前にチェック必須！
Webサイト制作前の課題と効果がわかる事例をまとめました。
無料でダウンロードする
幼稚園・保育園のホームページを作成できる無料のツール3選
お金をかけないで、自分でホームページを作りたい！という方のために、無料でホームページを作成できるツールを紹介します。
初心者向きでカスタマイズもできる 「Wix」
画像引用：Wix公式サイト
Wixのおすすめポイント
・テンプレートの種類や写真・動画素材が豊富
・質問に答えるだけでAIが自動作成する機能「Wix ADI」
Wix（ウィックス）は、世界190カ国で2億人以上が利用するホームページ作成ソフト。
テンプレートが800種類以上あり、写真・動画素材が2万点以上用意されています。豊富なテンプレート、素材の中から自由に選んで作成可能です。
直感的な操作で作成できるのもポイントで、マウスでドラッグ＆ドロップして作成できます。また、質問に答えるだけでAIがホームページを自動作成する「Wix ADI」という機能もあります。業種や好みのデザインなど、いくつかの質問に答えるだけで、AIが最適なレイアウトや画像、テキストを組み合わせてサイトを自動作成します。
有料プランは4種類あり、独自ドメインの利用が可能になる他、プランに応じて以下の機能が追加されます。
|
プラン |
月額料金（税込み） |
機能 |
|
ドメイン接続 |
500円 |
・帯域幅（多いほど読み込みが速い）：1GB ・データ容量：500MB |
|
ベーシック |
900円 |
・広告非表示 ・帯域幅：2GB ・データ容量：3GB ・動画アップロード：30分 |
|
アドバンス |
1,500円 |
・広告非表示 ・帯域幅：無制限 ・データ容量：10GB ・動画アップロード：1時間 ・分析などのアプリ、1年間使用無料 |
|
VIP |
2,700円 |
・広告非表示 ・帯域幅：無制限 ・データ容量：35GB ・動画アップロード：5時間 ・分析などのアプリ、1年間使用無料 ・ロゴ作成 |
スマホだけでもホームページ作成ができる「Crayon」
画像引用：Crayon公式サイト
Crayonのおすすめポイント
・スマホアプリからのみでも、簡単なサイト作成が可能
・専門的な知識は不要、簡単な操作で作成できる
・パソコンを持っていない人にもおすすめ
Crayon（クレヨン）はスマートフォンのアプリから簡単にホームページ作成できるサービスです。テキストや写真をパーツとし、それを組み合わせることでWebサイトを作成できます。
スマホで写真を撮って、そのままホームページに載せることも可能です。専門的な知識は必要なく、パソコンを持っていない人にもおすすめのツールです。
無料プラン「フリー」は、お問い合わせフォームの作成やブログ投稿が可能です。ただし公開できるのは3ページまで、登録画像は10枚までです。ページ数や登録画像数を増やしたい場合は、有料プランにする必要があります。有料プランは2種類あり、プランごとに以下の機能が追加され、さらに独自ドメイン取得可能、広告非表示になります。
|
プラン |
月額料金（税込み） |
機能 |
|
ライト |
990円 |
・ページ数：30 ・登録画像：100枚 |
|
プロ |
3,190円 |
・ページ数：300 ・登録画像：1,000枚 |
オリジナリティあるサイト作成が可能「WordPress」
画像引用：WordPress公式サイト
WordPressのおすすめポイント
・豊富なデザインテーマ
・独自性あるホームページを作ることができる
・サイト作成にある程度慣れた人から上級者向き
WordPress（ワードプレス）は、世界でもっとも利用されるホームページ作成ツール。
Webサイト全体の43％がWordPressを利用して作成されており、デザインテーマは数千種類以上と豊富。
すべて自分で選択し作り上げる必要があるため、ある程度操作に慣れた人から上級者向きのツールです。HTMLやCSSの知識があれば、独自性あるホームページを作成できるでしょう。
一般的なホームページ作成プランのうち、有料プランは3種類あり、独自ドメインの使用や以下の機能が追加されます。有料のビジネスプランであれば、機能を追加するための「プラグイン」というツールを使って、自由にカスタマイズ可能です。お問い合わせフォームの作成やセキュリティ強化など、さまざまな機能を追加できます。
|
プラン |
月額料金（税込み） |
機能 |
|
パーソナル |
500 |
・カスタムドメイン1年間無料 ・広告を削除 ・ホスティングサービス |
|
プレミアム |
900 |
パーソナルの機能に加えて ・ライブチャットでのサポート |
|
ビジネス |
2900 |
プレミアムの機能に加えて ・プラグプラグイン機能 |
幼稚園・保育園のホームページを作るなら押さえるべき４つのポイント
保護者をターゲットにしたデザインを心がけよう
ホームページをを見るのは子どもたちの保護者です。
保護者の方は、「うちの子を預けても大丈夫かどうか」を検討するためにホームページを見ています。
保護者の方が知りたい情報を、「先回りして」「見やすく」「簡単にたどり着けるように」配置しましょう。
写真素材は力を入れよう
写真コンテンツは重要です。写真が魅力的であると、ホームページの安心感や信頼感がグッと上がります。
- 子ども達（園児達）の笑顔の写真
- 園や施設の様子がよく分かる写真
上記の２種類を入れましょう。施設の写真からは「園の様子」が、園児の笑顔からは「園の雰囲気」が伝わります。
しかし、いざ自分で撮ると今ひとつ心に響かない写真になりがちです。
可能であれば、写真撮影をプロに依頼するのも1つの方法です。近くの写真館や、ココナラのようなサービスを利用するのもいいでしょう。
お問い合わせへの導線を目立たせる
「ホームページが完成したのに来園につながらない」といったケースを避けるためにも、お問い合わせへの導線を作る必要があります。
「お問い合わせ」「見学予約」などのボタンを目立たせることで、ユーザーの行動を誘発できます。
適切な箇所にボタンを設置して、最終的なゴールへユーザーの行動を導く設計にすることが重要です。
スマホ対応は絶対にしよう
ホームページのスマートフォン対応は今や必須です。なぜなら、スマートフォンやタブレットからホームページを見る人のほうがPCで見る人より多いからです。
インターネット利用端末の種類（出典：総務省ホームページ ）
幼稚園や保育園を探す保護者の方も、スマートフォンを使ってホームページを見る可能性が高いです。
どこでも閲覧できる一方で、スマートフォンの画面は小さく見づらければすぐに離脱されてしまいます。離脱を防ぐために、スマートフォン対応を行なっておくことが重要です。
【コラム】格安のテンプレートデザインは要注意？
テンプレートを使うと、決まった型にはめ込むだけで手軽にサイトを作ることができます。
- 制作期間が短い
- 制作費用が安い
上記のようなメリットがあり、おもに費用を抑えたい場合によく利用されます。
一方で、以下のようなデメリットもあります。
- デザインによる差別化がむずかしい
- できることが限られているため、希望通りのサイトにはならない
ここで考えていただきたいのは、「なぜホームページを作りたいのか」ということです。
新規の入園につなげることが目的の場合、テンプレートで作ったホームページで目的は達成できるでしょうか。少なくとも、今回ご紹介した事例のようなサイトはテンプレートでは作れません。
ご紹介したホームページは、漠然と可愛いものや楽しそうな雰囲気を作ろうとしているわけではありません。「園のどういったことを知ってもらいたいか」「どうしたらうまく伝えられるか」を考えた結果、それぞれのデザインになっているのです。
テンプレートで制作するホームページは、思うようなカスタマイズができません。デメリットをを理解したうえで、テンプレートと作りたいホームページの条件が合えば費用をおさえることが可能です。
テンプレートを使う際には「目的に合ったサイトができるか」をよく検討してください。
費用面だけで、判断するのはおすすめしません。
幼稚園・保育園のホームページデザイン・コンテンツまとめ
幼稚園・保育園のホームページは「安心感」と「信頼感」を与えられるものにしましょう。
大事なのは、保護者の方が見たいであろう情報を「先回りして」「見やすく」「探しやすいように」配置することです。
さらに見やすさを高めるために「写真に力を入れる」「スマホ対応を絶対にする」の２点を押さえておけばかなり印象のよいサイトになるはずです。
幼稚園・保育園のホームページはとかく「かわいい」「楽しそうな」ものになりがちですが、そこが肝ではありません。
園の姿勢や内容を保護者の方にわかりやすく提示することを第一に考えて、ホームページのデザインに取り組んでみてください。
幼稚園・保育園のホームページをプロに依頼したい場合
幼稚園・保育園のホームページをプロに依頼したいが、下記のようなお悩みをお持ちの方は多いかと思います。
- ホームページ制作会社がたくさんあって選べない
- 制作会社の具体的な費用が良くわからない
- 本当にこの制作会社でいいのか判断できない
そのような時は、当サイト「Web幹事」にご相談ください。
Web幹事は、あなたに最適なホームページ制作会社を「人力で」マッチングするサービス。
実際にWeb制作を経験したプロのコンサルタントが対応するため、業者選びの手間なく、質の高いマッチングを受けることが可能です！
Q. 参考になる幼稚園・保育園のホームページにはどのようなものがある？
参考になる幼稚園・保育園のホームページとして「佛教大学附属幼稚園」「駿河台幼稚園」等が挙げられます。その他の事例は記事をご参照ください。
Q. 幼稚園のホームページはどのように作ればいいですか？
子供たちへ安心感と信頼感を提供するために、写真や動画を使って園の様子を掲載するのが大切です。また保護者が知りたい情報を見やすく配置し、スマホ対応も忘れずに行いましょう。
