WebGallery

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

*

アーチ型に切り取られた写真で橋のように見せる

   

名称未設定 1

有限会社「月刊日本橋」が運営する東京日本橋の歴史や文化を紹介するサイト「東京 にほんばし」のホームページです。

江戸から続く文化や伝統を、シンプルで分かりやすくまとめたデザインで紹介しています。トップには白いシルエットがアニメーションになっており、背景のスライダーは歴史や伝統を感じさせる写真が掲載されています。

ある程度下にスクロールすると左上にあったメニューが画面上部に固定で表示される仕組みになっています。メニュー下のラインはアーチ形で橋を連想させる形ですね!

それだけではなく、日本橋の歴史や店舗紹介など各記事に使用されている写真もアーチ形に切り取られています。スマートフォンで見ると2つずつ並んで表示されるので本のようにも見えますね。

 

 - 形で表現 ,

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

フラットデザインで新しい印象に

  東京都にある三田国際学園中学校・高等学校の公式ホームページです。幾 …

イラストや図を用いて分かりやすく説明

「スーパー乗るだけセット」という新車の購入方法を紹介している特設サイトです。カラ …

ひし形のグリットを使って、授業風景などの写真を紹介している倉敷芸術科学大学のサイトがおしゃれ!

岡山県倉敷市にある大学「倉敷芸術科学大学 芸術学部」のサイトです。 ファーストビ …

情報が縦に分かれた面白いレイアウト

沖縄の芸術文化を発信しているサイト「RQ+ リューキュープラス」のホームページで …

中央に重要な情報をまとめて配置することで注目度を上げる

横浜市鶴ヶ峰にある美容室「しの美容室」のホームページです。 キャッチの部分やグロ …

1つ1つのボタンを大きく配置することで、見やすく押しやすいレイアウトに

北海道札幌市にある幼稚園「幸明幼稚園」のホームページです。 全体的に原色に近い色 …

「交通アクセス」のボタンを右上に配置することで、観光客にも優しいデザインに

佐賀県鹿児島市にある「祐徳稲荷神社」のホームページです。 ロゴマークの赤い色と白 …

丸を駆使したデザイン

  全体のオブジェクトが丸いサイトです。写真やロゴマークの背景のお皿、 …

ロゴマークと同じ形をしたメニューとキャッチ画像

東京都武蔵野市吉祥寺にある動物病院「ひだまり動物病院 吉祥寺」のホームページです …

ボーダーの線を真っ直ぐではなく少し曲げることで立体感をだす

新潟県長岡市にある電力会社「大原電業株式会社」のホームページです。 青を基調とし …