こんにちは、Apricotです。
今日は久々にブログ運営ネタです。最近お気づきの方もいらっしゃるかもしれませんが、ブログにいくつかの「バナー」を貼ってみました。
私のブログは元々のデザインが「黒っぽい」ので、「もうちょっとブログが楽しい雰囲気になったらいいんだけどな〜」と思っていた私。でも、デザインをあれこれ変える技術力がなく（苦笑）、ふと他の方のブログなんかを見ていて「バナーとか貼ったらどうだろう」と思い立ったのが始まりでした。
調べてみたら、ありました、無料で作れるバナーサイト！しかも使ってみたら、簡単なのに出来上がりもいい感じ☆
- ブログをもっと楽しい雰囲気にしたい
- 読んでもらいたい記事になかなか誘導できていない
- いつもブログが変わり映えしない
- もっと複数のページを読んでもらいたい
今日は、こんなお悩みがある方必見！の「無料バナー作成サイト」のご紹介、そして「バナー工房」と「Canva」の”ダブル使い”で素人でもいい感じにバナーを作る方法をお伝えしたいと思います♪Wordpress以外の無料ブログにも貼れますよ！
おすすめサイトその１「バナー工房」
まず最初にご紹介するのが「バナー工房」。日本語のサイトで、検索するとすぐに出てくるのでご存知の方も多いかもしれません。
「バナー作成」というと、グラフィックソフトの「イラストレーター」などを使って作るのが一般的。でも、イラストレーターって購入するのに何万円もするうえに、操作するにも知識が必要。なかなか素人が使うにはハードルが高いですよね。
その点、「バナー工房」は、テンプレートの選択や文字入れ、スタンプの挿入、画像加工など、バナー作成に必要な行程が全てウェブサイト上で簡単にできるので、わざわざソフトをインストールする必要もないし、知識がなくても簡単にバナーが作れるんです♪
「バナー工房」ならこんなことができる！
それでは、「バナー工房」の具体的な機能を一緒に見ていきましょう！
「そのまま使える」本格テンプレート
「バナー工房」には、さまざまなデザインテンプレートが用意されています。上の図↑は「母の日・父の日」というカテゴリーのテンプレートの一部。
既にデザインが出来上がっているので、文字を入れるだけで、あたかも「一からデザインしたような」本格的なバナーが作れるのが、このサイトの良いところ♪
テンプレートは「カラー別」と「カテゴリー別」から探すことができます。「カテゴリー」には、例えば「ゴールデンウィーク」や「夏」などといった「季節関連」のほか、「ウェディング」や「入学・新生活」といった「イベント関連」、「ペット」や「トラベル」などの「ホビー関連」、そして「運送」や「飲食店」のような「業界関連」などなど。「和」や「ランキング」といったカテゴリーもありますよ！
テンプレートはどれもポップなデザインなので、「楽しさ」を演出するには最適！老若男女に対応するデザインなのも嬉しいですね☆
ちなみに、このサイトのテンプレートを選ばずに、自分で好きな画像をアップロードして、加工することも可能です。
女性に嬉しい「手書きフォント」が秀逸！
テンプレートが決まったら、文字を入れていきます。
この「文字入れ機能」は、「バナー工房」の機能の中でも特に秀逸！日本語対応の「手書きフォント」が充実しているので、女性ブロガーに特にオススメです☆
上の画像では、「コスメ」カテゴリーから選んだテンプレートに、手書きフォントなど3つのフォントを使って文字入れしてみました。手書き風なだけで「こなれた印象」になり、なんだか既にいい感じの「バナー」になっていると思いませんか！？
スタンプやフレームで簡単アレンジも☆
さらに、お好みで「スタンプ」や「フレーム」「ライン」を加えることも可能。ちょっと見づらいですが、上の図ではハートやキラキラスタンプを足してみました☆↑
スタンプには、ハートなどの基本シェイプ以外にも、人物や食べ物など様々なデザインが充実。テンプレートを自分好みにアレンジすることで、よりオリジナル感を出せますね♡
スクリーンショットやGIF作成までできちゃう
ここまでの機能を使えばバナー作成には十分ですが、よりハイレベルなバナーを目指したい方には、「動くバナー」（GIFバナーやチカチカ点滅するバナーなど）を作れる機能や、ウェブサイトをそのままスキャン（コピー）できる「スクリーンショット」機能も。
スクリーンショットは通常「Ctrl」＋「Alt」＋「prt sq」を押すことで画面のコピーを取ることができますが、「画面そのまま」をコピーしてしまうので、一緒に写り込んでしまう余計な背景などを切り取ったり、「図」として保存し直したりするのが結構面倒。。
その点、この「バナー工房」のスクリーンショット機能なら、スキャンしたい画面のURLを入力するだけで簡単にサイトをコピーでき、そのままダウンロードボタンを押せば、必要な画面だけあっという間に保存も完了！これは便利♪
しかしこの機能はどうやら万能ではないようで、（上のブログ画像のように）本来サイトに載っているはずの画像や広告が、スクリーンショット上では非表示になってしまったり、正しいURLを打ち込んでも、なぜかそのページのスクリーンショットを撮れなかったり…といったことがしばしば発生(ﾟoﾟ;;
ページによるようなので、うまく行く場合に限り「使える」機能だなと感じました☆
「バナー工房」はこんな人におすすめ
いろいろな機能をご紹介してきましたが、まとめると「バナー工房」はこんな方におすすめ！
- ECサイトなどのショップ運営者
- ポップなテイストが好きな方
- 手書きフォントでオシャレなバナーを作りたい女性ブロガー
「バナー工房」のテンプレートは先にご紹介したとおり、季節やイベント、趣味や仕事など「明確なテーマ」を持ったデザインが豊富なので、ネットショッピングのサイト運営者など「商用利用」に使いやすいのが特長☆
ただ、逆にいうと、「シンプルなデザインが用意されていない」というデメリットも。テンプレートのデザイン自体はカスタマイズできないので、イメージしたデザインが見つからない場合は、他でテンプレートを用意しなければいけないのが不便です。。
でもそれさえクリアすれば、とにかく素人でも簡単に本格的なバナーが作れるので、個人的にはとってもオススメです！
おすすめサイトその２「Canva」
さて、次にご紹介するのは「Canva」というサイト。こちらは海外のサイトなので英語のみになりますが、海外のサイトだということを忘れてしまうくらい、「直感的に操作ができる」ので、英語が苦手な方でも抵抗なく使うことができます☆ 最初に会員登録をする必要がありますが、このサイトも無料で利用できますよ！
「Canva」ならこんなことができる！
「Canva」には、先ほどの「バナー工房」とはまた違った機能&良さがあります。
バナーもポスターも！あらゆる目的・サイズに対応
「バナー工房」でも、バナーサイズはいくつか選べるのですが、「Canva」はバナーに限らず、あらゆるウェブサイトや紙媒体に対応したテンプレートサイズを選べます。
例えば、FacebookやYouTube用の画像サイズのほか、広告用サイズ、メールヘッダー、ドキュメントにポスター、パンフレットやポストカードまで！…それぞれ作りたいものに最適なサイズを選ぶことができるんです♪
「Canva」を使えば、バナー以外にも、プレゼン資料や年賀状だって無料でデザインできてしまうなんて、画期的ですよね！
とにかくハイセンスなテンプレートが満載！
「Canva」の魅力はなんといっても、そのハイセンスなテンプレートデザイン！
海外の一流クリエイターが作ったような、お洒落でフォトジェニックなテンプレートが盛りだくさん！「バナー工房」と比べるとグッと大人な雰囲気です。
「Canva」のテンプレートには、画像はもちろん、配色やフォントも予め最適なバランスでレイアウトされているので、自分でちょっと文字や位置を修正を加えるだけであっという間にハイセンスなバナーの出来上がり♪
私のようにデザインや配色に自信がなくても、「Canva」なら間違いありません（笑）
背景素材やスタンプのストックも豊富でカスタマイズしやすい
「Canva」の場合は、「バナー工房」と比べてテンプレートのカスタマイズがしやすいのもポイント。
背景素材（無地もある）やスタンプ、フォントを一から組み合わせて自分だけのオリジナルデザインを作ることもできますし、用意されたテンプレートの一部（色やフォントなど）だけをカスタマイズすることも可能。
上の図では、もともと用意されたテンプレートに、スタンプ（手書き風のバッグ）を追加してみました☆
「Canva」には素材のストックが豊富で、一部有料の素材もありますが、無料でも十分使える素材が揃っています♪
英字ならフォントも超オシャレ♡
さらに、オシャレな英字フォントも選び放題♪こんな感じ↑で、色やフォントを変えるだけでもイメージが変わりますよね。
エレガントな筆記体やビンテージライクなブロックフォント、洗練された活字フォント…などなど、とにかくお洒落なフォントが見つかります♡
ただ、唯一残念なのは、フォントは「英字対応のみ」なこと。つまり、日本語で文字を入れても、お洒落に変換されないばかりか、漢字が中国語変換されてしまうことも…（涙）
「Canva」で日本語を入力すると編集時点では良いのですが、JPEGやPNGで保存したとたん、こんな悲しい結果に…(；▽；)↓
これはイタダケナイ…（嘆）海外サイトなので仕方がないのですが、これだけが唯一残念！！
この記事のＵＰ後、2017年5月24日に「CANVA」が日本に上陸していたようです！これにともない、現在は「日本語フォント」も選べるようになりました♪
「Canva」はこんな人におすすめ
さて、いろいろな機能をご紹介してきましたが、まとめると「Canva」はズバリこんな人にオススメ！
- とにかくお洒落なバナーを作りたい方
- 一からオリジナルでバナーをデザインしたい方
- シックでカッコ良いバナーを作りたい男性ブロガー
「わかりやすさ」が肝心な商用利用には「バナー工房」がオススメでしたが、もっとブランドイメージやグラフィックを大事にしたい方には「Canva」がおすすめ。先にご紹介したとおり、デザインのカスタマイズも自由自在なので、自分のイメージに合ったバナーを作れるのも嬉しいですね。
また、「バナー工房」はちょっと可愛すぎる！という男性諸君にも、「Canva」なら満足のいくデザインがきっと見つかるはず☆
本当にグラフィックデザインがお洒落なので、バナー作成の予定がない方にも、画像加工にぜひオススメしたいサイトです♡
ズバリ「バナー工房」と「Canva」のダブル使いが最強！
さて、ここまで「バナー工房」と「Canva」の各機能やメリット・デメリットをご紹介してきましたが、それぞれの良いところを活かすなら…そう、両サイトの「ダブル使い」が最強！
グラフィックの優れた「Canva」と、文字入れが秀逸な「バナー工房」を組み合わせれば、素人でもクオリティの高いバナーを作ることができます。以下では、私が実際にやってみた作り方をご紹介しますね！
1. Canvaでベースを作る
まずはベースとなるデザインを「Canva」で作成します。バナーサイズを選んだら、お気に入りのテンプレートや背景、スタンプなどを組み合わせてレイアウト。
日本語の文字は化けてしまうので、文字を入れる前の状態まで作っておきます。英語フォントなら、ぜひこの時点で入れておいてくださいね♪
出来上がったら、「Download」を押して「png」ファイルでパソコンやスマホにいったん保存しておきましょう。
2. バナー工房で文字入れする
次に、「バナー工房」のウェブサイトを開いて、「Home」画面から先ほど保存したベースのバナー画像をアップロードします。
画面左上に表示される「文字入れ」を選択し、文字を入力。フォントや大きさ、縁取りや影の有無などを選択し、都度バランスを見ながら配置していきます。フォントは、1種類よりも2～3種類を混ぜて、強弱をつけながら配置するのが動きを出すコツ☆
もちろん、画面左上のボタンから、「フレーム」「合成／スタンプ画像の挿入」を選んでお好みでアレンジしてもＯＫ！
完成形はこんな感じになりました↓これでバナーデザインは出来上がり！
3. HTMLを作ってアップロード
出来上がったバナーデザインは、このままではただの「画像」なので、この画像が別サイトにリンクするように「URLを埋め込む」必要があります。
まず、どのサイトにリンクするようにしたいのか、あらかじめリンク先のページを選んでURLをコピーしておきます。私の場合は、自分のブログの「アメリカ移住」カテゴリーのURLをコピー。
次は、いよいよ画像をブログに取り込んでいきます。私はWordpressを使っていますが、アメブロなどの無料ブログでもほぼ同じことができるはず。
まず、ブログの「新規投稿」（記事作成画面）を開きます。実際に記事を書くわけではないのですが、便宜上、リンク埋め込みに必要な「HTMLコード」を作成するために、真っさらな新規投稿ページを使います。
ここに、通常の画像挿入と同じ要領で、先ほどの「完成バナー画像」をアップロード。画像をアップロードすると、Wordpressでは画面の右側に「リンク先」という項目があるので、「カスタムURL」を選び、先ほどコピーしておいたリンク先URLをここに貼り付けます。ここまで出来たら「投稿に挿入」をクリック。
そうすると、投稿画面にバナー画像が挿入されます。この時点で、このバナー画像には既にリンク先URLが埋め込まれているのですが、これをHTMLコードに変換しなければなりません。
このHTMLコードを取得するには、投稿画面の右上「テキスト」タブをクリックします。すると上の画像のようにHTMLコードが表示されているので、これを丸ごとコピー。
あとは、ブログの貼りたい場所（サイドバーなど）にこの「HTMLコード」を貼るだけ！
WordPressでは「HTMLコードを貼れるウィジェット」（私は「テキスト」というウィジェットを使っています）に、このコードを貼り付けます。無料ブログでも、同じように「HTMLコードを貼れるブログパーツ」を選んで、そこにコードを貼り付ければ完了です！
すると、こんなふうにバナーが表示され、クリックすると指定したURLに飛ぶことができるようになります♪（私はもう1つ同じ手順で作って、2コ目のバナーも貼りました）
ちなみに、このやり方は私が勝手に発案した方法なので（笑）、もしかしたらもっとスマートで簡単な方法があるのかもしれませんが…あしからず（＾＾；
さて、いかがでしたでしょうか？
こういう「ガジェットネタ」は私の得意とするところでは全くないので…今回はヒイヒイいいながらなんとか記事に仕立てました（苦笑）
バナーを貼ることで、ブログがメディアっぽくなるだけでなく、読者にも視覚的にわかりやすく、結果として回遊率（たくさんの記事を読んでもらえる）に繋がるのではないかと思っています。本当は、その効果のほどを検証したかったのですが、今のところその方法が確立できていなくて今回はご紹介できないのが残念(>_<)
でも、見た目で差別化できることは間違いないので、興味のある方はぜひお試しくださいね☆
それでは、今日もお付き合いいただきありがとうございました！また次回もよろしくお願いします！
