ワードプレス初心者向け情報サイト『webcode』WordPress初心者向けにwordpress(ワードプレス)に関するお役立ち情報が掲載されています。おすすめプラグインやおすすめ有料テーマ(テンプレート)、おすすめ無料テーマ(テンプレート)なども紹介しております。Goope初心者向けにグーペに関するお役立ち情報が掲載されています。リアルな口コミやメリット・デメリット、グーペの利用がおすすめな人や他のCMSとの比較情報などもご紹介しています。2018年8月17日webcode編集部FacebookTwitterはてブPocketFeedlyWebデザインの仕事の中では、バナーを作る作業が起こることがあります。制作経験の無い方からすると、「なんであんな綺麗なものが創れるんだろう...」と思うこともあるかもしれません。誰でも「初めの内」は上手く作れないものです。そこで今回は、筆者が初めてバナーを作るようになった頃に取り組んでいたことをご紹介していきます。いうサービスがありますので、1.5万円ぐらい払える方はバナープラスを利用されるのが一番簡単かと思います。初心者向けのバナーの作り方のまとめバナーの前提を理解するまずは、何のためにバナーを作るか?を再確認します。これをしておかないと、とにかく派手に作ろう!みたいな感じで始めてしまい、結果としてグチャグチャになってしまうことがあります。バナーの前提としてとりあえず押さえておくべきだと個人的に思っているのは、以下の3点です。クリックされる要素が入っていること文字が読みやすいこと画像の画質が汚くないことこれらについて、もう少しお伝えします。バナーにクリックされる要素が入っていることが重要まずは、バナーにクリックされる要素が入っていることが重要です。action)の要素としてとても大事なことです。CTAを簡単に言うと「ユーザーにアクションを促すもの」です。バナー画像は基本的に、どこかにリンクを飛ばす際に使います。ユーザーがそのバナーを見てリンクを踏んでくれなかったら作った意味がありません。いうことは、デザイナーとしては「リンクを踏む工夫」をしてなかったら意味が無いのです。CTAの要素が入った文章としては、「詳しくはこちら」「今すぐクリック」などがあります。次は、文字が読みやすいことです。最近は、画像メインのデザインが流行しているので、バナーにも綺麗な画像をいれて終わり!としたい気持ちはわかります。ほとんどのユーザーは、バナーの文字を読んでクリックします。ユーザーは、クリックする時に「怪しいサイトに飛んだりしないか?」などの不安を感じ、文字をしっかり読みます。そのため、バナーを作る際には、文字が読みやすいかどうかは確認しましょう。最後に、画像についてです。バナーの画像はもちろん、綺麗に越したことはないです。そのため、時間の限り拘ることをおすすめします。サイズが合わなかったり等で、画質が汚くなる時があります。画質が汚くなって見栄えが悪くなるくらいでしたら、いっそのこと画像を使わない方が良いとさえ思います。バナーの作り方に入る前の下準備3つそれでは、実際にバナーを作り始める前に下準備をしましょう。最初のうちは画像が揃ったり、photoshopを前にしたりすると、考えがごちゃごちゃしてしまい、最終的に訳が分からなくなったりしてしまいます。実際に画像が揃ってきてしまうと、「その画像に合わせた文章」「その画像が好きそうなユーザー」を考えてしまのです。そのようなトラップに陥らないように、下記の手順を踏まれるのがおすすめです。文言(文章)を決めようまずは、バナーに入れる文章を決めます。この時、キャッチコピーみたいなイメージで作っても良いのですが、まず一旦は文字数を気にせずに書き出してみるのがおすすめです。それを段々と短くしていく作業をするのが効率的です。いらない助詞や、改行すれば省けるものなどは省いていきましょう。最後に、音読して意味が伝わればOKだと思います。バナーを見ることになるユーザーを想像しよう次は、バナーを見ることになるユーザーをイメージします。できれば、頭のなかで「この人!」と一人設定しておけると、バナーがぐっと作りやすくなります。その際は、なるべく細かく年齢や性別、ライフスタイルなどをイメージしておくのがおすすめです。参考バナーを取っておく最後に、ここまでの手順が整ったら、参考バナーを見つけるのがおすすめです。)には色んなバナーがありますので、登録されてその中から近い広告を探したりするのもおすすめです。公式サイト:A8.netこうして、文字数や対象のユーザーが似ているバナーを見つけたら、画像を保存しておきましょう。このようなASPで使われて続けているバナーというのは、基本的に効果が出ていますので、最初のうちはそれらを参考にすべきだと思います。簡単なバナーの作り方4ステップそれでは、実際のバナーの作り方に入っていきましょう。いっても、細かなツールの使い方やレイアウトの組み方というよりは、もっと初歩的な部分にフォーカスしています。1.文字を書き出すまずは、文字を書き出しましょう。さっきの下準備で用意した文章を、書き出しておいてください。2.画像を準備する次は、画像を準備してきます。クライアントから依頼を受けていて、画像が既にいくつか渡されているという方は、そこから選抜してください。練習のために作っているという方は、フリー画像でも良いと思われます。3.バナーサイズを決めるそして、バナーのサイズを決めます。国際標準でバナーのサイズはある程度参考にできたりするので、下のURLを参考にしてみてください。作っておくと便利なバナーサイズ一覧(ネットワーク広告対応)4.実際に作り始めるそれでは、実際に作り始めましょう。細かな工程については、具体的に書いてある記事がたくさんありましたので、それを紹介しておきます。高品質バナーの作り方!どちらも、モノクロでの書き出しを一度おすすめしていますね。バナーの作り方の注意点2つ最後に、バナー製作時の注意点についてお話します。色は最後!フォントは途中で変えてもOKまず、製作途中に、文字の色やフォントを変えたくて仕方なくなる瞬間があると思います。色は途中で変えず最後に変えましょう。一方で、フォントは途中で変えてもOKです。言うと、色はもともと他の要素との兼ね合い・組み合わせで綺麗に見えたりするものだからです。途中で変え始めてしまうと、あとから画像を追加した時にまた色を変えたいと思うことがあるからです。一方で、フォントの場合はフォントを変えると文字幅が変わったりするので、早い内に変えておきましょう。最後の最後にレイアウト崩れをすると凹みます。一度出来上がったら他人に見てもらう続いて、一度出来上がったら他人に見てもらうのがおすすめです。自分で作った作品は、総じて綺麗に見えてしまいます。自分が重要なポイントと思って盛り込んだ要素は、一番最初に目についてしまいます。そのため、他人に一度見てもらって、客観的なフィードバックをもらうのがおすすめです。自分が作ったバナーを見せる時の聴き方としては、「このバナーどう?」ではなく、「これってクリックしたくなる?」の方が、良いフィードバックがもらえます。初心者向けのバナーの作り方のまとめ以上、いかがでしたか?今回は、バナーの作り方でした。作った頃は、どんなこと考えていたかなと思って記事を書いていたら懐かしくなってしまいました。3つ目くらいの作品を作った時に、クライアントからクソミソに言われた気がします。初めのうちは、そういうこともたまにありますね。これからバナー画像を作ってみようという方は、参考にしてみてください。ある程度お金を払っても良いようでしたら、バナープラスの利用がおすすめです。公式サイト(バナープラス):https://rider-store.jp/banner-plus/最後まで読んでいただき、ありがとうございました。LIGの評判や料金は高い?WordPressデザインを学ぶおすすめスクールを比較2019年11月16日IllustratorとPhotoshopの違いは?使い方を初心者向けに解説コンセプトメイキングとは?手法や具体例は?決めておいた方が良いポイントまとめおすすめの記事レンタルサーバーロリポップのエンタープライズプランの口コミ!スタンダードプランとの違いやメリット・デメリットレンタルサーバーのロリポップ!には、4つのプランがあります。その最上位がエンタープライズプランなのですが、月額自体は若干高めである半面、様...Goope(グーペ)ペライチでSEO対策は可能?他サービスと比較した口コミペライチは、ホームページを簡単に作れるサービスです。サイト運営を始めた当初は、ナビ...WordPress(ワードプレス)EmanonProやBusinessの評判は?他テーマと比較しておすすめな方を紹介Web集客に特化したWordPressテーマの一つにEmanon[エマノン]があります。webcodezeroRANKINGShopify(ショピファイ)の評判は?カラーミーショップやリピートとの比較エックスサーバーの使い方をワードプレス初心者にわかりやすく画像で解説【経験談付き】ロリポップはライトプランで十分?ワードプレスを複数するならどのlolipopのプランが良い?バインドアップ(BiNDup)の評判は?料金比較やメリット・デメリットを解説ヘテムルとエックスサーバーの比較!wordpress初心者におすすめはどっち?CATEGORYWordPress(ワードプレス)初心者向けにwordpress(ワードプレス)に関するお役立ち情報が掲載されています。おすすめプラグインやおすすめ有料テーマ(テンプレート)、おすすめ無料テーマ(テンプレート)なども紹介しております。Goope(グーペ)初心者向けにグーペに関するお役立ち情報が掲載されています。リアルな口コミやメリット・デメリット、グーペの利用がおすすめな人や他のCMSとの比較情報などもご紹介しています。Jimdo(ジンドゥー)初心者向けにjimdoに関するお役立ち情報が掲載されています。リアルな口コミやメリット・デメリット、jimdoの利用がおすすめな人や他のCMSとの比較情報などもご紹介しています。WIX(ウィックス)初心者向けにWIX(ウィックス)に関するお役立ち情報が掲載されています。口コミや評判、メリット・デメリット、WIXの利用がおすすめな人や、他のCMSやホームページ作成ツールとの比較情報などもご紹介しています。RentalServer(レンタルサーバー)レンタルサーバーに関する口コミや評判、メリット・デメリット・料金比較などが掲載されています。ワードプレス(wordpress)運用におすすめのレンタルサーバーもご紹介しております。