バナーとは？ 意味やメリットを初心者向けにわかりやすく解説
更新日：2024.11.21
- 「バナーという言葉をよく聞くけど何のこと？」
- 「バナーにはどのようなメリットがあるの？」
- 「会社のホームページにバナーを設置したいけど、何から手を付ければいいかわからない！」
このような考えをお持ちの方も多いのではないでしょうか。
今回はバナーについて、バナーの意味や役割、バナーを使うメリットや作成方法などを初心者の方でもわかりやすいように解説します。
今回はバナーについて、バナーの意味や役割、バナーを使うメリットや作成方法などを初心者の方でもわかりやすいように解説します。
また後半は、企業ホームページにバナーを設置する重要性や、バナー作成のポイントについてお話していきます。
目次
バナーとは
バナー(Banner)は、直訳すると「旗」や「のぼり」という意味です。
Webにおけるバナーとは、他のWebページを紹介するために設置する、お店ののぼりや看板のような意味をもつものです。
Webページを見ていると、特集やキャンペーン情報などの画像ファイルを見ることがあります。それらが特集やキャンペーン情報のページを紹介するためのものであり、バナーです。
バナーは基本的にリンクされており、リンク先は同じWebサイト内のページであることもあれば、外部のWebサイトの場合もあります。
バナーは「サイトバナー」と「広告用バナー」に大きく分かれる
またバナーには2つの種類があります。それが「サイトバナー」と「広告用バナー」です。
サイトバナーは、同一サイト内の他のページへの移動を簡便にするのが主な役割です。
広告用バナーは、広告枠に掲載して会社や製品を紹介するバナーのことです。
広告用バナーはユーザーを自サイトに呼び込むために、他社の広告バナーよりも目立たせる必要があります。
また、サイトバナーは基本的に自社が管理しているサイト内に設置されますが、広告用バナーが設置されるのは外部のサイトです。
広告用バナーは、外部のWebサイト・ブログや、Facebook・Twitter・InstagramなどのSNS、YouTubeなどの動画サイトといった広告枠に設置されます。
以下のような楽天・Amazonのバナーも、典型的な広告用バナーです。
いちばんよくわかるWebデザインの基本きちんと入門［第2版］
posted with ヨメレバ
- 作者:伊藤 庄平/益子 貴寛/久保 知己/宮田 優希/伊藤 由暁
- 出版社:SBクリエイティブ
- 発売日: 2021年08月23日頃
バナーの役割
バナーはWeb上で案内したい情報や、移動してもらいたいページを目立たせる役割をもっています。
バナーの目的は、見てほしいWebページを紹介してクリックしてもらうことです。
クリックしてもらうためには、ユーザーに興味をもってもらわなければなりません。
バナーは文章や文字リンクと比べて、画像を使用するため視覚的な印象が残りやすくなります。
文章の場合は読み飛ばされてしまう可能性がありますが、画像は目に止まりやすいからです。
バナーを設置するメリット
バナーを使用する最大のメリットは、Webページの中でユーザーに見つけてもらいやすくなり、印象に残るという点です。
Webページの中に、特集やキャンペーン情報のバナーがあると目を引かれます。
そして、1度見たバナーは何となく頭の中に残ることが多いのではないでしょうか。
また、サイトバナーではお問い合わせや資料請求、導入事例などの、他のコンテンツを視覚的にわかりやすく紹介できます。
また、サイトバナーではお問い合わせや資料請求、導入事例などの、他のコンテンツを視覚的にわかりやすく紹介できます。
文章は無機質なもので、なかなか見つけづらく、印象も薄いです。
そんな時にバナーを用いればユーザーは意識していなくても何となく覚えていることがあり、Webページの紹介として、PR効果は抜群です。
そんな時にバナーを用いればユーザーは意識していなくても何となく覚えていることがあり、Webページの紹介として、PR効果は抜群です。
なお、弊社のCMS（ホームページを簡単作成できるシステム）、おりこうブログではバナーの設置も簡単にでき、企業のPRに効果的です。ご興味のある方は、ぜひ以下から詳細をご覧ください。
広告用バナー設置のルール
広告用バナーを制作するうえで、基本的にそれが広告と分かるように制作をすることが暗黙の了解となっています。
また、バナーサイズには国際標準がありますので、そちらの基準に合わせて制作するのがおすすめです。
※ただし、広告用バナーではなくサイトバナーであればそこまで厳密に基準を遵守する必要はありません。
サイズに関しては、ピクセル(px)を単位として、「横×縦」で表現します。バナー国際標準を作っているIAB(米インターネット広告協会)が２年ごとにサイズの見直しを行っているため注意が必要です。
また、バナーサイズには国際標準がありますので、そちらの基準に合わせて制作するのがおすすめです。
※ただし、広告用バナーではなくサイトバナーであればそこまで厳密に基準を遵守する必要はありません。
サイズに関しては、ピクセル(px)を単位として、「横×縦」で表現します。バナー国際標準を作っているIAB(米インターネット広告協会)が２年ごとにサイズの見直しを行っているため注意が必要です。
広告用バナーのサイズ
次に一般的な広告用バナーのサイズについて紹介します。
バナーのサイズには多くのタイプがあります。ここではサイズごとの使い方もあわせて詳しく説明します。
バナーのサイズには多くのタイプがあります。ここではサイズごとの使い方もあわせて詳しく説明します。
※以下は2022年現在時点の国際標準に沿って紹介しています。
最新の国際標準を知りたい方は、「バナー 国際標準」などのキーワードで検索して随時ご確認ください。
レクタングル
レクタングルは最も一般的なタイプのバナーです。右の図のように、太めの長方形になっています。
350×250などがレクタングルのサイズとされており、表示位置はWebページの横側(サイドカラム)に用いられることが多いです。
広告のターゲットが、パソコンとスマートフォンのどちらも対象となる場合は、レクタングルタイプのサイズを使用すれば間違いありません。サイズ選びに迷っている時にもおすすめです。
ただし、一般的に目にすることが多いサイズで、ページの横側に位置しやすいことから、強いアピール力はあまり期待できません。
350×250などがレクタングルのサイズとされており、表示位置はWebページの横側(サイドカラム)に用いられることが多いです。
広告のターゲットが、パソコンとスマートフォンのどちらも対象となる場合は、レクタングルタイプのサイズを使用すれば間違いありません。サイズ選びに迷っている時にもおすすめです。
ただし、一般的に目にすることが多いサイズで、ページの横側に位置しやすいことから、強いアピール力はあまり期待できません。
スクエア
こちらもレクタングルと同様に使用される頻度の多いサイズです。
名前の通り正方形で、パソコンとスマートフォンのどちらにも対応しています。特にスマートフォンの画面で見ると存在感があり、SNS内で見かけることが多いです。
サイズは配信先によって違いがあり、Googleでは250×250、Yahooでは300×300が適応されるなど、規定に合わせてサイズの確認が必要です。
そのため、両方の配信先でスクエアタイプを利用する際は、別々の大きさを準備しなければなりません。
バナー
横長で視界にも入りやすく、アピール力があって目立つことから、高いクリック率にもつながるタイプです。
スマートフォンの画面には対応しないため、パソコン専用の広告として使用します。
ほかのサイズと比べて、大きくスペースを使うため、画像などのイメージだけでなく、テキストも使用した掲載方法が多いです。
テキストを使用できることで、より具体的な広告内容を載せられるため、ユーザーの興味を引きやすく、広告の効果を高めやすいサイズになっています。
大きさは728×90が一般的で、位置は横長の広告がコンテンツの妨げにならないように、上部や下部に掲載する場合が多いです。
スカイスクレイパー
スカイスクレイパーは縦長のスタイルで、ある程度の幅も必要とするため、非常に強いアピール力のあるバナー広告です。
大きさは120×600で、とても広いスペースを使用するため、ウェブコンテンツを見るユーザーからも注目されやすくなります。高いアピール力や視認性の高さから、一般的にはブランドの認知度を高める目的として使用されるサイズになっています。
ただし、大きなサイズはスマートフォンの画面には適用されないため、パソコン専用のバナーとして使用しなければなりません。
大きさは120×600で、とても広いスペースを使用するため、ウェブコンテンツを見るユーザーからも注目されやすくなります。高いアピール力や視認性の高さから、一般的にはブランドの認知度を高める目的として使用されるサイズになっています。
ただし、大きなサイズはスマートフォンの画面には適用されないため、パソコン専用のバナーとして使用しなければなりません。
このように広告用バナーのサイズには多くの種類があり、効果を高めるためには、ターゲットや目的に応じてサイズを選ぶ必要があります。
なお、現在は「Google広告」の「レスポンシブディスプレイ広告」のように、広告枠の大きさに合わせて自動的に画像サイズを調整してくれるサービスも増えています。
そのため、バナー画像のサイズ調整を以前ほど厳密にしなくてもよい場面も多いです。
なお、現在は「Google広告」の「レスポンシブディスプレイ広告」のように、広告枠の大きさに合わせて自動的に画像サイズを調整してくれるサービスも増えています。
そのため、バナー画像のサイズ調整を以前ほど厳密にしなくてもよい場面も多いです。
※弊社では、Webサイトを運用するうえで必要な用語の基礎知識をまとめた資料を無料で配布しています。ご興味のある方は、以下のバナーからダウンロードしてください。
バナーの作成方法
ここからはバナーの作成方法について紹介していきます。
バナーを作成すると一言でいっても、広告用バナーとサイト内の遷移バナー（サイトバナー）では目的が異なります。
また、どのような内容にするか、設置個所のレイアウトやサイズなどによっても内容が大きく変化します。
だからこそ、いきなり作成に取り掛かるのではなく、まずはバナーを作成する目的を整理しておくことが大切です。
- ターゲットは誰なのか(年齢、性別、職業など)
- ターゲットの悩み
- 自社の何を告知していきたいのか など
ターゲットの人物像や、ターゲットの課題は何なのか、自社が告知したい内容をシンプルに伝えるための方法などを考えたうえで、作成に取り掛かるようにしましょう。
1.自主作成する場合
バナーを自主制作する場合は、「illustrator」や「Photoshop」などの画像編集ソフトを利用するのが一般的です。
ただ、画像編集ソフトは高機能なため初心者にはハードルが高い面があるのも事実です。
「デザインの知識・技術はないので、簡単にバナーを作りたい」という方は、「バナー 作成 ツール」などの言葉でGoogle検索するといくつかバナー作成専用ツールがヒットしますので、それらを利用してみるのもよいでしょう。
他にも「PowerPoint」や「Excel」などで作成することもできます。
2.業務委託サービスを利用する場合
バナーをプロの専門業者や、作成が得意な人に依頼して作成したり、無料作成サイト等を利用したりする方法もあります。
「バナー制作」「バナー 作成代行」などのキーワードで検索し、いくつかの業者を比較して、信頼できそうな会社に相談・お問い合わせしてみるとよいでしょう。
専門業者に依頼する場合は、1000円程度から発注できることもあります。
「バナー制作」「バナー 作成代行」などのキーワードで検索し、いくつかの業者を比較して、信頼できそうな会社に相談・お問い合わせしてみるとよいでしょう。
専門業者に依頼する場合は、1000円程度から発注できることもあります。
3.CMSの内部機能で作成する場合（サイトバナー）
主にサイトバナーの場合になりますが、弊社のホームページ作成ソフト「おりこうブログ」のようなCMSでは、バナーを作成する機能が搭載されていることがあります。
画像のサイズ調整などを簡単に行えるため、初心者の方はそちらを活用するのがおすすめです。
参考ページ：CMSとは？ その意味と企業ホームページへの導入のメリットを初心者にもわかりやすく解説
画像のサイズ調整などを簡単に行えるため、初心者の方はそちらを活用するのがおすすめです。
参考ページ：CMSとは？ その意味と企業ホームページへの導入のメリットを初心者にもわかりやすく解説
参考ページ：CMSのメリット・デメリットを初心者向けに解説
なお、弊社の企業向けホームページ作成ソフト（CMS）・おりこうブログにご興味のある方は、ぜひ以下より詳細をご覧ください。
企業ホームページにバナーを設置する重要性
次に、企業ホームページにバナーを設置する重要性について大きく4つ説明します。
1.サイトバナーを設置することで、訪問者がページ間を移動しやすくなる
サイトバナーを設置することで、Webサイトの訪問者がページ間をスムーズに移動できます。
ページの遷移がしやすいサイトはユーザーに見てもらいやすくなるため、サイトバナーの設置はWebサイトを多く見てもらうためにも大切なものであると言えます。
2.コンバージョンに直結するバナーを設置することで、売り上げ・人材確保につながる
最終的に商談や採用応募に直結するバナーを設置することで、商品の売上アップや人材の確保につなげられます。
具体的には「お問い合わせ」や「無料相談」「無料ダウンロード」、「資料請求」、「採用応募」などのページにつながるバナーのことです。
企業ホームページは単に閲覧されるだけでは意味がなく、訪問者に何らかのアクションを起こしてもらわなければなりません。
ホームページで獲得目標にしているアクションのことを、コンバージョンと呼びます。
参考ページ：Webマーケティングの理解に不可欠な言葉、コンバージョンとは何か？ ゴールを明確にすれば、ホームページの方針が決まる!
企業ホームページは単に閲覧されるだけでは意味がなく、訪問者に何らかのアクションを起こしてもらわなければなりません。
ホームページで獲得目標にしているアクションのことを、コンバージョンと呼びます。
参考ページ：Webマーケティングの理解に不可欠な言葉、コンバージョンとは何か？ ゴールを明確にすれば、ホームページの方針が決まる!
コンバージョンにつながるバナーをより魅力的に作成することで、ユーザーのクリック回数を増やし、より多く商品・サービスの購入や採用ページを見てもらえるようになります。
3.SEO効果の上昇が期待できる
先程、サイトバナーを設置することでページ間をスムーズに移動することができると述べましたが、これはGoogleやYahoo!のような検索エンジンのクローラーも同じです。
クローラーとは、Webサイト・Webページの内容を読み取り、検索エンジンに伝える役割を担っているコンピュータープログラムのことです。
クローラーが巡回しやすいバナーを設置することで、SEO効果の上昇も期待できます。
※SEOについて詳しく知りたい方は、以下の参考ページをご覧ください。
4.Web広告の入り口になる
企業で広告用バナーを利用する場合、商品ページへとユーザーをつなげるためのWeb広告の入り口としてバナーを用いることが多いです。
バナーのクオリティ次第で広告のコストパフォーマンスも大きく変わってきます。
Web広告でバナーが使われるのは、主に「ディスプレイ広告」と「SNS広告」の2つです。
ディスプレイ広告とは、Webサイトの広告枠に表示される画像広告、動画広告、テキスト広告のことです。
一方、SNS広告とはFacebook・Twitter・Instagram・LINEといったSNSのプラットフォームに配信する広告のことを指します。
それぞれの媒体によって、効果的なバナーの作り方も変化しますので、各プラットフォームのユーザー層に沿ったバナー作りをすることが大切です。
なお、弊社ではコストをかけずに集客力・売上げをアップさせる方法についてまとめた資料を無料で配布しています。ご興味のある方は、以下のバナーからダウンロードしてください。
バナーを設置する際のポイント
最後に、バナーを設置する際のポイントを3つ紹介します。
1.色の使い方
バナーを作成するうえで、色はとても大切なポイントになります。
例えば、ネットショップでは店舗やブランドのイメージに合わせた配色を使用しますが、特別なイベントの際などはいつもと違った配色でバナーを作成すると効果的です。
いつもと価格帯が違うときは目立たせるために赤や黄色といった色を使うなど、目的に沿った色を使うことがポイントです。
また、サイトバナーにおいては「資料請求」・「お問い合わせ」・「無料相談」・「採用応募」などのコンバージョンに直結するバナーは、他のバナーとは色を変えて目立たせたほうがクリック率を高められます。
（例：他のページにリンクするバナーが青色であれば、コンバージョンに直結するバナーの色をオレンジにする…など）
（例：他のページにリンクするバナーが青色であれば、コンバージョンに直結するバナーの色をオレンジにする…など）
2.フォントの選び方
バナーを作る際には、最適なフォントを考えることも大切です。
基本的には1つのバナーに対して多数のフォントを混在させると、何が一番重要なのかユーザーは認識しづらくなります。
フォントの組み合わせをシンプルにすることで、情報を混乱させず、しっかり訪問者に見てもらえる可能性が高まります。
3.端的なキャッチコピーを考える
さて、ここまでバナーのデザインについてお話してきましたが、キャッチコピーも非常に重要です。
画像を使用した広告バナーの中に文章を詰め込んでしまうと、せっかくの画像が台無しになってしまいます。
製品画像などとともにテキストを用いる場合は、ユーザーの興味を引くことができる端的なキャッチコピーを考えましょう。
ターゲットや用途に合わせたバナーの作成が重要！
ここまで紹介してきた通り、バナーには様々な用途があります。
ターゲットや用途に合わせたバナーの作成を心がければ、ユーザーをより自社のWebページに惹きつけることができます。
特にサイトバナーはシンプルに分かりやすく、広告用バナーは一目見ただけで興味をそそるような印象付けのできるものを作成することが大切です。
バナーを目にするのはどんな人で、どんな思いを持っているのかも想定したうえで、バナーを作成するとよいでしょう。
バナーを目にするのはどんな人で、どんな思いを持っているのかも想定したうえで、バナーを作成するとよいでしょう。
なお、コストをかけずにホームページのアクセス数を10倍にアップさせる方法を知りたい方は、以下の資料をダウンロードしてください。
【おすすめ書籍】
いちばんよくわかるWebデザインの基本きちんと入門［第2版］
posted with ヨメレバ
- 作者:伊藤 庄平/益子 貴寛/久保 知己/宮田 優希/伊藤 由暁
- 出版社:SBクリエイティブ
- 発売日: 2021年08月23日頃
Webサイト運用やSEOに関するお役立ち情報を一括ダウンロードできます。
国産Webサイトサービス満足度No.1のおりこうブログで、自社サイトを開設・リニューアル！
- 「会社・団体のWebサイトを開設・リニューアルしたいけれど、あまり知識がないのでどうしたらいいかわからない…」
- 「今のWebサイトでは情報を自由に更新・追加できないので困っている…」
おりこうブログはレビューサイト「ITreview」において、ホームページ制作部門で顧客満足度NO.1や、「ITreview Best Software in Japan」のTOP50に選定されています。
初回は日本全国に配置された担当者が訪問してWebサイトの編集方法をレクチャーするプランもありますので、パソコン・Webが苦手な方でも安心です。
みなさまのお問い合わせの獲得や売上げアップをサポートしますので、まずは以下から詳細をご覧ください。
