主に集客やブランディングを目的として制作されるオウンドメディアですが、コーポレートサイトや採用サイトなどに比べると少しデザインが凝りにくく、独自性を出すのが難しいという欠点があります。
デザインはユーザーにどのように情報を伝えるかに直結しているので、アクセス数やブランディング、商品販売などの結果にも大きな影響を与える重要な要素です。
そこで今回はオウンドメディアのデザインで気をつけるべきポイントや実際のサイトを例にして、どのようなところにこだわっているのかを紹介していきます。
この記事を読んだらわかること
・コンテンツの内容に合わせたデザインにする
・企業のイメージカラーに合わせたデザインにする
・スマートフォンにも対応したデザインにする
・見た目だけでなく文字装飾や説明画像など読みやすいデザインにする
オウンドメディアはSEOが重要で、上位表示されなければコンテンツを配信しても意味がありません。我々は自社でもオウンドメディアを運用することでそのノウハウを蓄積し、SEOに強いオウンドメディアの戦略から運用まで提案できますので、お気軽にご相談ください！
オウンドメディアのデザインで意識する4つのポイント
まずはオウンドメディアのデザインで意識すべきポイントについて紹介をしていきます。デザインは単純に見た目を良くすればいいというわいけではなく、特定の目的に沿って作らなければいけません。
そのポイントとは以下の4つになります。
・コンセプトに合ったデザイン
・コンテンツテーマに合わせたデザイン
・企業のイメージカラーに合わせたデザイン
・スマホにも対応したデザイン
それぞれの詳細を以下で詳しく解説していきます。
コンセプトに合ったデザイン
オウンドメディアのデザインで意識すべきポイントの1つ目はコンセプトに合ったデザインにするということです。
コンセプトとは商品やサービスの認知度を向上させる、コーポレートサイトなどへのアクセスを増やす、自社に興味を持ってもらい人材採用に繋げるなどの目的を指し、それに合わせてデザインも大きく変えなければいけません。
例えば自社商品の認知を目的とする場合は画像をトップページやヘッダーなどの目立つ場所に配置し、サイトの色合いなども商品に合わせたものにして、連想をさせやすくします。
参考になるのがマヨネーズのキユーピーのオウンドメディアです。以下のように商品の画像をトップに配置し、文字やメニューの背景色も商品カラーに合わせた赤、白、薄めのクリーム色で構成されています。
色合いや画像を活用するとユーザーにイメージをしてもらいやすくなるので、商品の紹介だけでなくブランド認知や人事採用といった幅広い目的で使用可能です。
コンテンツテーマに合わせたデザイン
オウンドメディアは上述したコンセプトに合わせて配信するコンテンツ内容を考えなければならず、デザインもコンテンツに合ったものにする必要があります。
例えば以下のサイトは機密文書などのデータ管理サービスなどを提供する鈴与株式会社のドキュメントセンターが提供するオウンドメディアで、配信しているコンテンツは文書管理に関するノウハウです。
このサイトは背景画像や色合いを工夫して紙のような質感を表現したり、ノウハウの提供＝指南という意味で巻物や虎の巻、指南書といったワードやイメージ画像を使ってコンテンツ内容を連想させやすいデザインにしています。
他にも働く女性向けならおしゃれさと可愛さを表現する、小さいお子さんがいるお母さん向けなら柔らかくほのぼのとした雰囲気を出すなどターゲットとする人に合わせてデザインを考えるのも1つの手段です。
企業のイメージカラーに合わせたデザイン
大手企業ですでに認知度が高い企業のオウンドメディアであれば、あえて企業カラーと合わせたデザインにするという手法もあります。
例えば不動産や住宅情報を紹介しているSUUMOはCMやYouTubeに出てくるマスコットキャラクターのスーモが人気です。そのため、オウンドメディアでもスーモの色合いである黄緑色をデザインに反映させています。
また、こだわっているポイントとして通常は白と黒がメインの色合いであるのに対し、特定の項目にマウスカーソルを合わせると黄緑色に変わるという点です。
前述したキユーピーもそうでしたが、色合いはイメージの紐づけがしやすいので、企業カラーをうまくオウンドメディアに盛り込むと商品やサービスの認知度と相まって集客力が高まります。
スマホにも対応したデザイン
冒頭でも述べたようにデザインはオウンドメディアの成果に直結するので、スマートフォンやタブレットといった利用率の高いデバイスに向けたデザイン開発も必要です。
PC向けのデザインのままではページが見切れたり、クリックがしにくいといった不具合が起こり、それによってユーザーのページ離脱や企業のイメージ低下を引き起こしてしまいます。
スマートフォンやタブレットの画面に対応したサイズに変えて解決するのではなく、予算や手間はかかりますが、あえてデバイスごとに異なるデザインを用意し、見やすさを追求すると他社との差別化が計れるので、余裕があれば検討してみましょう。
また、コンテンツのデザインがバラバラとユーザーに読みにくさを与えてしまうので、「文字の装飾は1色~2色、最も重要なものに赤色、そこそこ重要なものは下線」といった具合にコンテンツごとにデザインのルールを決め、統一性を持たせましょう。
ZERO式オウンドメディア構築・支援はこちら
参考にしたいおすすめオウンドメディア10選
デザインで注意すべきポイントがわかったところで、次に参考になるオウンドメディアを紹介していきます。
ここで紹介するサイトは前述したポイントが反映されているので、自社のオウンドメディアのデザインを作る際の参考にしてみてください。
侍エンジニア塾ブログ
このサイトはエンジニアの育成や転職支援を行う株式会社侍が運営しているオウンドメディアです。
コンセプトはプログラミング学習への申込みやサービスの認知になるので、トップページやサイドメニューではサービスを紹介する説明画像を活用した宣伝が行われています。
他にも全体的に赤系の色合いが使われていますが、これはコーポレートサイトのイメージに合わせてデザインされたものです。企業カラーをオウンドメディアに反映させることでブランド認知も図られています。
サービスの認知度向上もこのサイトのようにイメージ写真と文字を組み合わせた画像を作ることで可能なので参考にしてみましょう。
メルカン
このサイトはフリマアプリでお馴染みのメルカリが運営するオウンドメディアです。目的は人材採用となっていて、コンテンツも社内の取り組みや働き方、社員同士のインタビューなどが中心となっています。
会社について知ってもらい、興味を持ってもらうためにデザイン面でもファーストビューに大きな人物の写真を表示したり、各記事のページではサイドメニューを表示させず、内容に注目させるといった工夫がなされている点が特徴です。
他にもトップページのサイドメニューにはタグを設置して、ユーザーが関心のあるコンテンツに到達しやすいよう配慮した作りになっています。
ジモコロ
このサイトは求人サイトを運営するアイデム社とソーシャルメディアで話題になるコンテンツを提供するバーグハンバーグバーグ社、イベント企画やコンテンツ制作を行うHuuuu社が共同で運営するオウンドメディアです。
地方情報など地元に密着したコンセプトを中心にあまり知られていない仕事や海外の働き方、ハウツーといった情報を提供しています。
トップページには地元を連想させるような写真が取り入れられていますし、漫画を使った記事やアイキャッチ画像をイラストにするなど全体的にポップな印象を与えるデザインが特徴です。
各地の面白い情報を元に集客を行い、最終的にはアイデム社の求人サイトへ誘導して地方の活性化を目指そうという目的に沿った導線設計もしっかりとできています。
FASHION HEADLINE
このサイトはデパートの三越伊勢丹とメディア事業などを手がけるイード社が共同出資して作り上げたファッション総合ニュースサイトです。
百貨店業界の活性化を目的として立ち上げられたメディアで、三越の情報ばかりを配信しているわけではなく、ファッションやライフスタイル、美容などに関連するコンテンツで関心のあるユーザーを引きつけ、百貨店へ足を運ぶきっかけ作りを行っています。
ターゲットが比較的若い世代であることからSNSへの導線もしっかりと作られています。実際にこのメディアはSNSの拡散によって立ち上げ2年で300万PVを達成するなどターゲットに合わせたサイト設計がされているオウンドメディアです。
北欧、暮らしの道具店
このサイトはクラシコム社が運営するオウンドメディアで、北欧のライフスタイルを取り入れた生活を体験してもらうべく日用雑貨の販売や紹介を行っています。
ECサイトとオウンドメディアが混ざったサイトで、最終的には商品の販売が目的ですが、ライフスタイルや北欧に関する情報を提供し、商品を知るきっかけを提供しているサイトです。
デザイン面では商品紹介と読み物という形でコンテンツを分け、商品を探したいユーザーと知識を得たいユーザーがそれぞれの目的に沿った行動が取りやすいよう配慮された設計となっています。
商品紹介ではその良さを伝えるためにイメージ写真が多く使われていたり、細かい説明の前に購入ボタンを設置してすぐに購入したいユーザーにストレスを与えないデザインになっている点も要注目です。
経理プラス
このサイトはクラウドサービスなどを提供するラクス社が運営するオウンドメディアで、配信しているコンテンツは自社サービスに関連する経理や業務効率化などに関するものが中心です。
最終的な目的であるサービスの申し込みへと繋げるために、サイドメニューやコンテンツ内にはサービス紹介サイトへ飛ぶバナーがあったり、他にも画面をスクロールするとメールマガジンの登録や無料セミナーの紹介が表示されます。
また、単純に自社サービスをプッシュしているわけではなく、役立つ無料レポートを提供したり、川柳で経理あるあるを紹介するなど全体的にファンの育成を視野に入れたデザインになっています。
メルラボ
こちらも前述したラクス社が提供しているオウンドメディアで、経理プラス同様にコンテンツを通して顧客を育成し、自社サービスの申し込みへと繋げることを目的としています。
経理プラスと違うのはラクス社のHPに合わせたオレンジ色を主体としたデザインになっている点やセミナーのレポートや調査データといった実用性重視のコンテンツを提供している点です。
複数のオウンドメディアを運営する場合はターゲットや目的、商品やサービスの内容に応じてデザインを変えることも大切になります。そういった点でラクス社が提供している2つのオウンドメディアは非常に参考になるので比較をしてみましょう。
名刺管理Hacks
このサイトは名刺管理サービスを提供するSansan社が運営するオウンドメディアで、名刺の整理術や管理方法といった情報主に提供しています。
自社のサービス認知や申込みをしてもらうことが目的ですが、自社サービスの紹介をするだけでなく、他社サービスの紹介や自社サービスとの比較を行い、ユーザーに適したサービスが見つかるよう配慮されています。
他にもダウンロードコンテンツではエクセルで名刺管理をするためのテンプレートや名刺管理で業績がアップした事例を提供するなどユーザーの満足度向上やファンの育成にも力を入れているサイトです。
バシャログ
このサイトはWeb制作やアプリなどのシステム開発を行うシーブレイン社が運営するオウンドメディアで、目的は人材採用です。
コンテンツの内容もHTMLやCSS、WordPressなど企業が求める人材が興味を持ちそうなものや社員が行ったお店や読んだ本など働いているスタッフの人柄がわかるような記事も少なくありません。
オウンドメディアの色合いはHPと同じく緑色を中心としたものになっていて、全体的には余計な情報を省いたシンプルで無駄のないデザインになっています。
cotas
このサイトは電通デジタル社が運営するオウンドメディアで、ビジネス、アカデミア、エンターテイメントという3つのカテゴリに関する情報をコンテンツ化し配信しています。
上述した各分野で活躍する人たちの活動に注目し、取材を通して新しいものづくりやサービス開発へとつなげていくことが主な目的です。
デザイン面などは非常にシンプルでサイドメニューには注目記事とFacebookへのリンクしか設置しておらず、記事を読ませることに特化した作りになっています。
コンテンツの内容が非常に濃く、興味を持ったユーザーは引きつけられますし、メディアを制作している人たちにも注目が集まるので企業のブランディングにも役立つオウンドメディアです。
まとめ：オウンドメディアのデザインはコンセプトに合わせる
今回はオウンドメディアのデザインに注目をして解説をしてきましたが、大切なのはオウンドメディアのコンセプトに合わせる、コンテンツテーマに合わせる、企業のイメージカラーに合わせる、スマートフォンに対応させるという4つです。
特にスマートフォン対応は時代の流れから見ても外すことはできないので、最低限これだけはしっかりと取り入れつつ、後はユーザーにとって読みやすいメディアになるよう考えながら最適なデザインを作り上げましょう。
この記事のおさらいポイント
・独自性を出すにはデザインを変える必要がある
・オウンドメディアの目的（商品販売、認知度向上、人材採用など）に合わせたデザインにする
・どんなコンテンツを配信するかに合わせたデザインにする
・企業のイメージカラーやキャラクターなどに合わせたデザインにする
・スマートフォンにも対応したデザインにする
・読みやすくなるよう文字装飾にもこだわる
オウンドメディアはSEOが重要で、上位表示されなければコンテンツを配信しても意味がありません。我々は自社でもオウンドメディアを運用することでそのノウハウを蓄積し、SEOに強いオウンドメディアの戦略から運用まで提案できますので、お気軽にご相談ください！
