せろりのセオリー | Webサイト100選

Webデザイン未経験の私が、魅力的で優れたWebサイトを見て考察力、表現力を学ぶ学習サイトです。

No.58 Renovation Soup

■概要

リノベーション・リフォーム事業を展開している会社CRAFTのオリジナル情報を提供するオウンドメディア。

 

■ターゲット

・家のリノベーションやリフォームを検討している人
・リノベーション・リフォームについて興味を持っている人

 

 

■視点

他者との差別化を図るために企業オリジナルのウェブサイトや広報誌を出す企業が増えてきている。企業のホームページだけでは伝えられないボリュームのある内容を、いかにユーザーに分かりやすく離脱しないように伝えるかに着目する。

 

 

 

■FV

ヘッダー中央にロゴを大きく配置。ページを開いた瞬間に最初に目に入りインパクトがある。
ナビゲーションは、英語表示だが、カーソルを持ってくるとめくれるような感じで日本語表記に変わるアニメーションが付けられていて面白い。ナビゲーションの下には、リノベーションやインテリア関連のトピックがスライドで流れている。

1枚目の写真以外は2カラムに統一されていて、クラシックで洗練された部屋の写真と、無地背景にテキストという組み合わせがスタイリッシュですっきりと見える。右半分の背景色も落ち着いた色でかつ写真を映えさせる色。

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

 

 

■特徴

・全体

各項目がグリッドデザインでまとめられていて統一感がある。写真はホバーすると拡大される。

 

 

・Articles

住まいに関する記事を紹介。記事は一番上にタグを表示。数字が大きく表示されていて何かの順番を指すものかと思っていたが、よく見ると配信の日付。日にちだけ大きくすることで、メリハリが出る。レイアウトの統一性があるためお洒落に感じる。

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

 

 

 

建築物、部屋、テイスト別で検索が出来る部分では、選択キーワードが多いのだが黒塗りに白字を使うことで視認性が高くなり見分けやすい。キーワードを細かく設定することで、ユーザーが目的別で探しやすい。

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

 

 

 

施工例の写真は、シンプルなものからヴィンテージと多様で、色んなテイストの施工が可能という訴求になっている。事例の写真が多く建築物を確認することで、ユーザーにとっても目的のものがイメージしやすい。

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

 

 

■ロゴ

線画のイラストと手書き風の文字を組み合わせたロゴ。独特なフォントとイラストで印象に残りやすい。

 

 

 

■フォント

・欧文:Lato
・テキスト:游ゴシック

 

 

 

■配色

・テキスト:#fff、#000、#231F20
・ベースカラー:#E6E7E8
・アクセントカラー:#399AB3#231F20

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

 

 

 

 

 

Webサイト:Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

せろりのセオリー/ Webサイト100選 No.58  Renovation Soup

次へ 投稿

前へ 投稿

返信する

© 2025 せろりのセオリー | Webサイト100選

テーマの著者 Anders Norén