WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

背景全体に動画をいれ、その上にスライダーを重ねて学校生活の様子を伝えている

   

%e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-1

東京都板橋区にある「城北学園 城北中学校・高等学校」のホームページです。

メニューのレイアウトがとても個性的なサイトです。メニューと右上の検索窓やTwitterボタンはページをスクロールしてもついてくるようになっていて、ページのトップに戻らなくてもすぐに他のページに移動することができるようになっています。
トップページの背景全体には動画、右側に縦長のスライダーと、学校の授業風景や部活の様子が動画と写真両方で見れるようになっています。画面いっぱいに表示されるのでインパクトもありますね!

サブページは、左側のメニューとコンテンツの文章や写真が重なってしまわないように、左側は多めに余白を取ってレイアウトを調整しています。
各学年のカリキュラムを紹介しているページでは、内容だけでなく学年ごとのブログも一緒に掲載していて「どの時期にどういうイベントがあるのか」「そのイベントはどういう内容なのか」が分かるように工夫されています。

受験生や学生が普段見るのにはもちろん、保護者や卒業生の方も見やすく使いやすいようになっていて参考になります!

 - 学校

  関連記事

可愛らしいロゴとすっきりとしたレイアウトの組み合わせが絶妙な漫画教室

新宿区四谷三丁目にある漫画教室「漫画教室 いるかM.B.A.」のホームページです …

医療系とは思えないほどカラフルでポップなデザインのサイトが可愛くて楽しそう!

兵庫県神戸市にある医療福祉専門学校「神戸医療福祉専門学校」のホームページです。 …

楽しみながら美容を学べる「九州美容専門学校」

熊本県熊本市にある「九州美容専門学校」のホームページです。 モデルさんの顔を大き …

学校の「楽しそう!」な雰囲気が伝わってくる専門学校

愛知県名古屋市にある、医療系や販売・ITや観光系などのビジネス専門学校「あいちビ …