【2024年版】現役デザイナーが選ぶ！おしゃれなホームページ15選

2024年も残りわずかとなりました。締めくくりとして、webデザイナー10年目の筆者が今年特におしゃれだと感じたホームページを15サイトご紹介します。おしゃれと聞くとビジュアルのみのイメージですが、ホームページは眺めるだけでなく操作が必要なので「ユーザーに配慮した設計になっているか」も鑑みて選定しています。

これからホームページを立ち上げる人やリニューアルを考えている人は、ぜひ参考にしてみてください。

【食品・飲食サービス編】

飲食物を扱うサイトでは「商品写真が魅力的に写っているか」が特に重要です。商品写真はくすみを飛ばし明るくはっきりしたコントラストにし、エネルギッシュで新鮮な印象になるよう調整しましょう。食品を扱うためサイト全体の清潔感も必要なので、濁った色や食欲が減退するような色の使い方には注意しましょう。

CRAZY PIZZA : LIFE

本格ピザ専門店「CRAZY PIZZA」が作る「冷凍ピザ」のオンラインストアです。ページを開いた瞬間から食欲をそそるピザがインパクトを与えます。数々の賞を受賞したピザの魅力を、極太ゴシックフォントでしっかり伝えています。大きく写真を使いながらも、読ませたいエリアの邪魔をせず整列されているのでとても読みやすいです。

澤田屋 – くろ玉

山梨県にある老舗和菓子店のコーポレートサイトです。浮遊する謎の黒い玉から始まり、横スクロールすると黒い玉の正体が明かされていきます。「余計なものを足さない」というコピーに合った、シンプルで素朴なデザインですが、細かな動きがあるため見ていて飽きません。「PHILOSOPHY」エリアでは雰囲気が一転し、イラストベースの絵本の中のような世界観に切り替わり、違う面白さと温かみを感じます。

のろしファーム

富山県魚津市でお米を育てながら様々な商品を開発・販売しているWebサイトです。よく見るとロゴが稲穂で作られていて強いこだわりを感じます。波のように切り抜かれた写真は、水を張った田んぼをイメージしているように見えます。手書き風のゆるいイラストがアクセントになり可愛らしい印象です。

【建設・不動産編】

建設や不動産業界のWebサイトでは信頼感と専門性を伝えることが大切です。不動産系と聞くと堅い印象があるかもしれませんが、ブランドの良さを打ち出しユーザーを引き込む工夫を取り入れたいところです。

エムトラスト株式会社 | 不動産売買

都内を中心に不動産事業を展開している企業のコーポレートサイトです。スクロールに合わせて要素が動き、キーカラーである青のグラデーションが美しく印象に残ります。下層ページも1ページ1ページ力を入れて作られているように見え、強いこだわりを感じます。

鈴木建設株式会社

千葉県にある総合建設会社のコーポレートサイトでは、ページを開いた瞬間から鮮やかな黄緑のテキストが目を引きます。地域密着型をテーマにしており、親しみやすいゴシックフォントや遊び心のある写真の置き方がテーマとマッチしています。

ouno御堂筋

ダイビル株式会社が展開するシェアオフィスサービスのWebサイトです。トップページではロゴの丸モチーフを随所に使用し、動きをつけることでユーザーを飽きさせません。黄土色・グレー・白の色味が落ち着いているので、アグレッシブな動きにもうっとうしさを感じません。

【ホテル・宿泊編】

ホテル・宿泊系のWebサイトは実際に「どんな体験ができるのか」を分かりやすく伝えることが大切です。期待感を煽る写真やキャッチコピーでユーザーをワクワクさせましょう。

株式会社水星 / SUISEI Inc. | ホテルプロデュースカンパニー

ホテル開発・空間プロデュース事業を展開しているコーポレートサイトです。サイトを開くと、鮮やかな空と砂浜しかない空間に目を奪われます。何もないところをクリックすると写真が現われ、異様な雰囲気を感じますが、その下からはサービス内容や事例紹介などしっかりブランドについて記載されています。運営しているホテルのホームページも個性的で、興味を惹かれます。

運営しているホテル：香林居 https://www.korinkyo.com/top

COCOSHUKU（ココシュク） 

ただ泊まるだけでなく料理や仕事ができる自由なプライベートホテルのWebサイトです。トップに出てくるイラストは体験可能なさまざまなシチュエーションを想像させます。写真が大きく、グリッドで整列されておりとても使いやすい印象です。

日光市の一棟貸し貸し別荘-日光松原の宿 而今 -jicon-

1日1組限定の天然素材の宿のWebサイトです。趣のある写真と縦書きのテキストが宿の世界観を表しています。素泊まりのため周辺のおすすめ食事処も写真付きで紹介しており、ユーザーへの配慮が伺えます。洗練されながらも重要な情報はしっかり記載されている美しいサイトだと感じます。

【webサービス・アプリ編】

webサービス・アプリのホームページでは、製品やサービスの魅力を効果的に伝えることが重要です。

メリットや他社との違う部分を分かりやすく記載しましょう。

manekiNEO

リアルに存在する場所にARやVRなどで新しい体験価値を付加し、より魅力的に見せて人を「招く」アプリの紹介サイトです。要素の邪魔をしない程度に、背景一面にモノクロの地図が引かれ、写真や装飾は独特ながらも全体的にきれいにまとめられています。現実世界とAR・VRの世界を混ぜた感じが上手く表現されています。

LINE GROUND

LINEで展開しているサービスの紹介と、基盤となる会社の考え方などを掲載しているWebサイトです。メインビジュアルは1つの本から始まり、キーカラーのグリーンを上手く使いながらスタイリッシュにまとめられています。お馴染みのLINE FRIENDSも登場し、スクロールするたびにさまざまな動きが織り交ぜられ、ワクワクするデザインです。

株式会社High Link

「Coloria（カラリア）」という香りの総合プラットフォームを展開する会社のコーポレートサイトです。

オレンジをキーカラーとし、スルスル動くアニメーションはワクワクします。広すぎず狭すぎずのちょうど良い余白で要素をグルーピングしていてとても読みやすいです。

【アパレル・インテリア編】

アパレル・インテリア系業界では、商品の魅力を最大限に発揮し、より購買意欲を高めるデザインにする必要があります。商品のディテールや質感がしっかり伝わる高画質な画像や動画で、ユーザーを釘付けにしましょう。

Next 10 Chairs

10人のクリエイターが10脚の椅子の制作を通して、未来を切り拓くプロジェクトのWebサイトです。

ページを開くとインパクトのある極太ゴシックがスタイリッシュに登場し、クリエイターたちの個性的な椅子に視線が誘導されます。要素の位置が画面の幅にあわせて柔軟に変化するリキッドデザインが施され、どんな画面幅でも美しく整列されて見えます。サイト全体は白・黒・グレーの3色を中心に構成し、主役である椅子を映えさせています。

デニム祭 | 45R

「45R」はジーンズ、Tシャツ、バンダナをメインとしたメンズ＆レディースのカジュアルな服を扱うアパレル会社です。全国で開かれるイベント「デニム祭」の特設サイトです。（24年12月現在）和のテイストとデニムを上手く融合させた唯一無二の世界観を感じます。「デニム祭とは」エリアでは、イベントの様子の写真をユーザーがめくるように見られる工夫や、細かい遊び心が伺えます。「デニム小噺」エリアカードは、サムネイルを邪魔しないグラデーションで華やかさを増しています。

雑誌Begin(ビギン)

「ほしい！」が見つかるGOOD LIFE BIBLE 雑誌Begin(ビギン)公式サイトです。

ページを開いた第一印象はごちゃっとしていますが、要素にマウスオーバーするとその記事へ遷移できるようになっています。メインビジュアル以外は基本的にグリッドデザインになっており、多い情報量をきれいに整理しています。トップページの中段にある「モノ知り用語集」エリアでは、ファッション特有のキーワードが流れ、気になったワードを検索することができます。

【まとめ】

今回は「見た目の良さ＋使いやすさ」を重視した15サイトをご紹介しました。ホームページは平面デザインだけでなく、アニメーションなどの動きを取り入れるとブランドやサービスにあった世界観をより引き出すことができます。「うちもこんなWebサイトがほしい…！！」とワクワクした方は、ぜひプライムナンバーズにご相談ください。