WebGallery

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

*

デザインの参考にしたい!スプリットスクリーンを使った旅館のサイト3選!

   

「分割式スクリーンレイアウト」や「分割式レイアウト」とも呼ばれるスプリットスクリーン。レイアウトは同じでも、動きや使い方は異なっていて見ていてとても面白いです!

今回は画面を分割した「スプリットスクリーン」を使った旅館のサイトを3つ紹介します!

 

別邸 越の里

新潟県にある温泉旅館のサイトです。
黒と金を基調とした高級感のある雰囲気のデザインです。左側にメニュー・右側にスライダーを配置することで、アニメーション効果も相まってとても印象的なファーストビューになっています。

 

黒川温泉 旅館 山河

このサイトは、左側は白背景・右側は背景に写真を入れることで左右にメリハリができています。
スクロールすると、それぞれバラバラに動くようになっていて、旅館の色々な写真を見ることができます。
左と右で文字の色も正反対なのも、コントラストが出ていてカッコいいです!

 

 湯の里 肘折温泉

こちらは左側のメニューの方が気持ち幅を広くとっています。
右側の写真は看板や街並みから、どことなく昭和な雰囲気を感じる写真です。こちらのサイトは左側は固定で、右側のみスクロールするようになっています。
メニューにカーソルを合わせると、その下に子メニューが横並びで出てくるようになっていて、白い背景のアクセントになっていてオシャレですね!

 

画面を大きく2つに分割したレイアウトだと、それだけでとてもインパクトのあるwebサイトになっているのですが、旅館やホテルの綺麗な写真が背景に配置されると、よりいっそう印象的なサイトになっていますね!

 - ホテル, 写真で表現, 旅館 , , , , ,

  関連記事

画面いっぱいに画像を配置して文章のインパクトを強くする建築士事務所

愛知県松山市と神奈川県にオフィスを構える建築士事務所「i Landscape」の …

群馬県にある眼科のサイトが、様々なレイアウトでデザインされててカッコいい!

群馬県高崎市にある眼科「だるま眼科」のホームページです。 トップページのレイアウ …

可愛い&おしゃれ!洗濯物が溜まっていなくても思わず行きたくなるコインランドリーのサイト3選!

あっという間に3月ですねー! この時期になると花粉症の人がそろそろ準備をしだすん …

映像で構成されたシンプルなサイト

  株式会社コナミが制作したメタルギア・ソリッドシリーズの主人公に惚れ …

情報の内容ごとに、デザインを変えてそれぞれの印象を持たせる

JR西日本の「あしたセレンディピティ」の特設サイトです。 女性らしく可愛らしいデ …

コンテンツの切り替えで雪を表現する

北海道上川郡美瑛町にある「展望花畑 四季彩の丘」のホームページです。 白黒とアク …

石川県にある道の駅のサイトがシンプルでおしゃれ!

石川県羽咋市にある道の駅「いい道の駅 のと千里浜」のホームページです。 ファース …

情報を記載した部分のみ、スクロールにする

  バイオリニスト「Ayasa」さんの公式ホームページです。何種類かの …

ファーストビューのインパクトのある重機の動画がカッコいい!

農業の機械を世界中に生産している「株式会社クボタ」の「壁がある。だから、行く。」 …

コケの写真が幻想的な通販サイト

大阪市にあるコケリウム専門通販サイト「コケのインテリア コケリウム」のホームペー …