オウンドメディアとは、自社が所有するWebメディアのことで、ブログやWebサイト、SNSなどを含めた総称です。オウンドメディアを活用することで、自社のブランドや商品・サービスの魅力を伝えることができます。

ただし、オウンドメディアを運営して効率よく成果を出すためには、質の高いオウンドメディアデザインが欠かせません。なぜなら、オウンドメディアには、ユーザーの興味やニーズに応えるデザイン設計が必要だからです。

そこで今回は、オウンドメディアデザインの事例10選と、成果がでるWebサイト制作のコツを解説します。これからオウンドメディアの構築をお考えの方は、ぜひ参考にしてください。

オウンドメディアデザインとは？目的や重要性を解説

オウンドメディアデザインとは、自社で運営するWebメディアの見た目や構造を決めることです。

オウンドメディアの目的は、自社のブランドや商品・サービスの価値を伝えることや、顧客との関係性を築くことなどが挙げられます。

そのため、オウンドメディアデザインは、目的に合わせた上で、ユーザーに魅力的に見えるように工夫することが重要です。

オウンドメディアデザインの重要性

オウンドメディアデザインの重要性は、以下のような点にあります。

1. ユーザーの注意を引き、興味や信頼を持ってもえるデザインにすること
2. ユーザーのニーズや問題に応えるコンテンツを提供できるデザインにすること
3. ユーザーの行動や反応を測定し、オウンドメディアデザインの改善に活かすこと
4. ユーザーとのコミュニケーションやエンゲージメントを促すこと
5. ユーザーをリピーターやファンに育てること

オウンドメディアデザインの基本ポイント6つ

オウンドメディアの目的は、自社のブランドや商品をPRするだけでなく、ユーザーに有益な情報を提供して信頼関係を築くことです。そのため、オウンドメディアのデザインは、メディアのコンセプトやターゲットに合わせて考える必要があります。

オウンドメディアのデザインで重視したいポイントは以下の通りです。

1. ブランドカラーを統一すること
2. フォントの選択とサイズの調整を行うこと
3. 画像の品質とサイズの最適化を行うこと
4. ヘッダーとフッターの設計を行うこと
5. ナビゲーションの配置と機能を工夫すること
6. レスポンシブデザインの実装を行うこと

それぞれ解説します。

1.ブランドカラーを統一すること

オウンドメディアは自社のブランドイメージを伝えるためのツールです。そのため、自社のロゴや商品に使われている色をメインカラーとして、サイト全体に統一感を持たせることが大切です。

ブランドカラーはユーザーの記憶に残りやすく、認知度や親近感を高める効果があります。例えば、無印良品のオウンドメディア「くらしの良品研究所」では、白と黒を基調としたシンプルなデザインで、無印良品の商品と同じような印象を与えています。

2.フォントの選択とサイズの調整を行うこと

オウンドメディアにはテキストコンテンツが多いため、フォントの選択とサイズの調整は読みやすさに直結します。

そこで、フォントはメディアの雰囲気やテーマに合ったものを選ぶことが重要です。

例えば、ポップカルチャーを扱う「KAI-YOU」では、太めで丸みのあるフォントを使って、若々しく楽しい印象を与えています。また、フォントのサイズは、PCとスマホで適切に調整することで、どのデバイスでも快適に読めるようにすることが必要です。

3.画像の品質とサイズの最適化を行うこと

オウンドメディアでは、画像を多用することで、コンテンツに視覚的な魅力を与えることが可能です。

しかし、画像の品質が低いと、メディアの信頼性やプロフェッショナルさが損なわれる可能性があります。また、画像のサイズが大きすぎると、サイトの表示速度が遅くなり、ユーザーの離脱率が上がるリスクがあります。

そのため、画像の品質とサイズのバランスを考えて、最適化することが大切です。

例えば、スイーツの販売を手がける「THE BAKE MAGAZINE」では、美味しそうなスイーツの画像を高品質で掲載しつつ、サイズは小さくして、サイトの表示速度を高めています。

4.ヘッダーとフッターの設計を行うこと

オウンドメディアのヘッダーとフッターは、サイトの顔と足と言える部分です。

ヘッダーには、メディアのロゴやメニューなど、サイトの概要やナビゲーションを表示することで、ユーザーにメディアのコンセプトや目的を伝えることができます。

一方、フッターには、お問い合わせやプライバシーポリシーなど、サイトの信頼性や安全性を高める情報を表示することで、ユーザーに安心感を与えることが大切です。

例えば、化粧品メーカーの資生堂のオウンドメディア「watashi＋」では、ヘッダーにはピンクと白を基調とした可愛らしいロゴと、オンラインショップや美容の情報などのメニューを表示しています。また、フッターには、お問い合わせや会社概要などの情報とともに、資生堂の公式サイトやSNSのリンクを表示しています。

5.ナビゲーションの配置と機能を工夫すること

オウンドメディアでは、ユーザーが欲しい情報に素早くアクセスできるように、ナビゲーションの配置と機能を工夫することが重要です。

ナビゲーションは、ヘッダーに表示するのが一般的ですが、サイドバーやフッターに表示することもあります。

ナビゲーションの機能は、カテゴリーやタグ、検索ボックスなど、ユーザーがコンテンツを探しやすいようにすることが必要です。

例えば、音楽や映画などのエンタメ情報を扱う「ナタリー」では、ヘッダーに最新・話題・人気・特集などのカテゴリーを表示しています。また、サイドバーにはジャンル別のタグや検索ボックスを表示し、フッターにはコミック・映画・音楽・お笑いなどのサブカテゴリーを表示しています。

このように、ナビゲーションによって、ユーザーが自分の興味のある情報に簡単にたどり着けるような工夫を凝らすことが重要です。

6.レスポンシブデザインの実装を行うこと

オウンドメディアには、PCだけでなくスマホやタブレットなどのモバイルデバイスでも快適に閲覧できるように、レスポンシブデザインを実装することが重要です。

レスポンシブデザインとは、デバイスの画面サイズに応じて、サイトのレイアウトやフォントサイズなどを自動的に調整するデザインのことを指します。

レスポンシブデザインを実装することで、ユーザーがどのデバイスでも同じコンテンツを見ることが可能です。

例えば、チームワークを支援するグループウェアを提供するサイボウズのオウンドメディア「サイボウズ式」では、PCでは3カラム構成で、記事のタイトルやアイキャッチ、サマリーを表示しています。一方、スマホは1カラム構成で、記事のタイトルとアイキャッチのみを表示しています。

このように、PCでは多くの情報を一覧で表示し、スマホでは画面に見やすく収まるような工夫がされている点に注目です。

オウンドメディアデザインの事例10選

オウンドメディアのデザインは、メディアのコンセプトやターゲット、目的に合わせて工夫することが大切です。

そこで以下では、業界別にオウンドメディアデザインの事例を紹介します。

Web・IT・マーケティング業界の事例

Web・IT・マーケティング業界では、自社のサービスやノウハウを発信することで、ブランディングや集客、採用などに役立てるオウンドメディアが多く見られます。

以下に、オウンドメディアのデザインの事例を2つ紹介します。

SEO HACKS公式ブログ

出典：SEO HACKS公式ブログ
SEOに関する情報を発信する「SEO HACKS」のオウンドメディアです。

デザインはブルーを基調とした落ち着いた雰囲気で、専門性の高さをアピールしています。

記事の内容はSEOの初心者から上級者まで幅広くカバーし、実践的なノウハウや事例などを紹介しています。記事の最後には、自社のサービスやセミナーの案内もあります。

サイボウズ式

出典：サイボウズ式
サイボウズ式は、ソフトウェア開発を行う「サイボウズ株式会社」のオウンドメディアです。

コンテンツは自社で企画しており、ユーザーからの共感を集めるコラムやインタビューなどが人気を集めています。

デザインはシンプルで洗練されており、ブランドのイメージに合った雰囲気を醸し出しています。

飲食・食品・飲料業界の事例

飲食・食品・飲料業界では、自社の商品やサービスを紹介するだけでなく、食に関する情報やライフスタイルを発信することで、ブランディングや集客、エンゲージメントなどに役立てるオウンドメディアが多く見られます。

以下に、オウンドメディアのデザインの事例を3つ紹介します。

キユーピーマヨネーズキッチン

出典：キユーピーマヨネーズキッチン
キユーピーマヨネーズキッチンは、キユーピー株式会社のオウンドメディアで、レシピや料理のコツ、食に関するコラムなどを提供しています。

コーポレートカラーである赤と白を基調とした、明るく爽やかなデザインです。

nomoo

出典：nomoo
nomooは、 リカー・イノベーション株式会社のオウンドメディアで、アルコールに関する知識やおすすめのお酒、飲み方などを発信しています。

黒と白を基調とした、シンプルで洗練されたデザインです。

THE BAKE MAGAZINE

出典：THE BAKE MAGAZINE
THE BAKE MAGAZINEは、株式会社ベイクのオウンドメディアで、自社のスイーツや食にまつわるユニークなブランド・企業、業界を牽引するリーダーの方々へのインタビューなどを発信しています。

写真を効果的にちりばめた、雑誌の切り抜きのようなデザインです。

建築・空間・施設業界の事例

建築・空間・施設業界では、自社の事業やプロジェクトを紹介するだけでなく、建築やデザインに関する情報やトレンド、ライフスタイルを発信することで、ブランディングや集客、エンゲージメントなどに役立てるオウンドメディアが多く見られます。

以下に、オウンドメディアのデザインの事例を3つ紹介します。

WORKSIGHT

出典：WORKSIGHT
WORKSIGHTは、コクヨ株式会社のオウンドメディアで、働き方やオフィスに関する情報を発信しています。

コンテンツの種類によってレイアウトや色使いを変えるなど、工夫が見られるデザインです。

消費者リクエストを募集したり、新商品や商品改善の紹介をしたりするコラムを掲載しています。ナチュラルで落ち着いたデザインです。

北欧、暮らしの道具店

出典：北欧、暮らしの道具店
ECサイトとメディアが融合している 「北欧、暮らしの道具店」は、商品紹介や購入機能があるECのページと、ライフスタイルや商品にまつわる物語を伝える読み物コンテンツを一つのメディアに混在させています。

これにより、ユーザーは商品の魅力を深く理解した上で購入することができます。

リビングハウスマガジン

出典：リビングハウスマガジン
リビングハウスマガジンは、株式会社リビングハウスが運営するオウンドメディアで、住宅やリフォームに関する情報を発信しています。

ナチュラルでシンプルなデザインで、住まいの雰囲気を表現しています。

ファッション・美容業界の事例

ファッション・美容業界では、自社製品の情報やレビューだけでなく、トレンドやライフスタイルなど幅広いテーマを発信しています。また、写真や動画を多用して視覚的に魅力的なコンテンツを作成しているのも特徴です。

以下に、オウンドメディアのデザインの事例を2つ紹介します。

Onitsuka Tiger MAGAZINE

出典：Onitsuka Tiger MAGAZINE
Onitsuka Tiger MAGAZINEは、株式会社アシックスが運営するオウンドメディアです。

スニーカーブランド「オニツカタイガー」の新商品情報やコラボレーションの紹介、トレンド情報などを発信しています。

デザインはシンプルで洗練されており、ブランドのイメージに合った雰囲気を醸し出している点が特徴です。また、公式販売サイトへのリンクも設置されており、ユーザーの購買意欲を高める工夫がされています。

FASHION HEADLINE

出典：FASHION HEADLINE
FASHION HEADLINEは、株式会社ファッションヘッドラインが運営するオウンドメディアです。

ファッションに関する最新ニュースやトピックス、インタビューやコラムなどをスピーディーに提供するWebサイトです。

デザインは写真や動画を多用しており、視覚的に魅力的なコンテンツを作成しています。また、広告掲載やプレスメディアとしての役割も果たしており、ファッション業界の情報発信基地となっています。

オウンドメディアデザインを考える際の注意点4つ

オウンドメディアデザインを考える際の注意点は、次の4つが挙げられます。

1. コンセプトに合ったデザインにすること
2. スマートフォン対応にすること
3. 競合他社のデザインをチェックしておくこと
4. ユーザーの利便性にも配慮すること

それぞれ解説します。

1.コンセプトに合ったデザインにすること

コンセプトに合ったデザインとは、オウンドメディアの目的やターゲットに応じて、色やフォント、レイアウトなどの要素を選ぶことです。

例えば、若い女性向けのオウンドメディアなら、明るく可愛らしいデザインが好まれるでしょう。

逆に、ビジネスマン向けのオウンドメディアなら、シンプルで落ち着いたデザインが適切です。

2.スマートフォン対応にすること

スマートフォン対応とは、オウンドメディアのデザインが、パソコンだけでなく、スマートフォンやタブレットなどの様々なデバイスで見やすくなるようにすることです。

現在、インターネットの利用者の多くはスマートフォンからアクセスしています。そのため、スマートフォン対応のデザインは、オウンドメディアの集客やユーザー満足度に大きく影響します。

3.競合他社のデザインをチェックしておくこと

競合他社のデザインをチェックしておくとは、オウンドメディアのデザインを考える前に、同じ業界やジャンルのオウンドメディアのデザインを調べておくことです。

これは、自社のオウンドメディアのデザインが、競合他社と差別化できるかどうかを確認するために重要です。また、競合他社のデザインの良い点や悪い点を分析することで、自社のオウンドメディアのデザインの改善点や参考になる点を見つけることができます。

4.ユーザーの利便性にも配慮すること

ユーザーの利便性にも配慮するとは、オウンドメディアのデザインが、ユーザーにとって使いやすくなるようにすることです。

例えば、オウンドメディアのナビゲーションや検索機能は、ユーザーが目的のコンテンツにたどり着きやすくするために重要です。また、オウンドメディアのデザインは、ユーザーの目を引くだけでなく、コンテンツの内容を伝える役割も果たします。

そのため、デザインの要素は、コンテンツの内容に沿って選ぶことが大切です。

オウンドメディアデザインのまとめ

このように、成果の出るオウンドメディアを制作する際は、運用目的やペルソナ、コンセプトを明確にしたうえで、ユーザーにとって有益なコンテンツを高頻度で発信することが重要です。

ただし、コンテンツ制作においては、SEO対策やKPI設定・効果測定を、効果的に行う必要があります。

そこで、オウンドメディアを制作する際は、株式会社GIGにお気軽にご相談ください。貴社のイメージに最適なデザインやソリューションを提案いたします。

株式会社GIGは、ナショナルクライアントからスタートアップまで、Webコンサルティング、UI/UXデザイン、システム開発など、DX支援をおこなうデジタルコンサルティング企業です。

また、45,000人以上が登録するフリーランス・副業向けマッチングサービス『Workship』や、7,000人以上が登録するデザイナー特化エージェントサービス『クロスデザイナー』、リード獲得に必要な機能を備えたCMS『LeadGrid』、UXコンサルティングサービス『UX Design Lab』などを展開しています。

WebやDX支援のご相談はいつでもご連絡ください。

■株式会社GIG

お仕事のお問い合わせはこちら
会社紹介資料のダウンロードはこちら
採用応募はこちら（GIG採用サイト）
採用応募はこちら（Wantedly）

GIG BLOG編集部

株式会社GIGのメンバーによって構成される編集部。GIG社員のインタビューや、GIGで行われたイベントのレポート、その他GIGにかかわるさまざまな情報をお届けします。