ウェブバナーの作り方

ウェブバナーの作り方

ウェブページのバナーは、私たちにとって馴染み深いものです。通常、バナーはウェブページの上部に表示され、会社名とロゴが表示されます。また、広告の形で表示されることもあります。商業ウェブサイトのバナーは、多くの場合、会社名と広告を表示する機能を持っています。 Web バナーには、Web サイトを訪れるユーザーを引き付けるために、必要な情報が含まれており、興味深く魅力的なデザインになっている必要があります。さて、それではウェブバナーの作り方をお教えしましょう。

方法1方法1/6:

Photoshopで作成

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/94\/Make-a-Banner-Step-1-Version-4.jpg\/v4-460px-Make-a-Banner-Step-1-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/94\/Make-a-Banner-Step-1-Version-4.jpg\/v4-728px-Make-a-Banner-Step-1-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1新しいファイルを作成します。バナーのサイズを設定します。通常、Web ページのバナーには標準サイズがあります。 [1] このガイドでは、468 x 60 ピクセルの「全幅バナー」を例として使用します。
    • 注: 上記のサイズは標準サイズですが、必ずしもこれに従う必要はありません。必要に応じてサイズを変更することもできます。
  2. 2背景レイヤーを塗りつぶします Web ページのスタイルに一致する色を選択して、背景レイヤーを塗りつぶします。
    • 前景色をクリックしてカラーピッカーを表示し、塗りつぶします。
    • ペイント バケットを選択して、選択した色で背景レイヤーを塗りつぶします。
  3. 3 新しいレイヤーを作成しますテキストとロゴを目立たせるために、このレイヤーはより彩度の高い色で塗りつぶす必要があります。このレイヤーは、元のレイヤーのサイズに比例し、中央に配置する必要があります。
    • 新しいレイヤーで、元のレイヤーよりも少し小さい範囲を選択し、選択した色で塗りつぶします。
    • 選択範囲を中央に配置します。レイヤー全体を選択するには、Ctrl+A (PC) または Command+A (Mac) を押します。
    • 次に、レイヤーメニューで、「レイヤーを選択範囲に合わせて整列」-「垂直中央」を選択し、レイヤーを選択して、「レイヤー」-「レイヤーを選択範囲に合わせて整列」-「水平中央」をクリックします。こうすることで、新しいレイヤーが元のレイヤーの真ん中に配置されます。
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/75\/Make-a-Banner-Step-4-Version-4.jpg\/v4-460px-Make-a-Banner-Step-4-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/75\/Make-a-Banner-Step-4-Version-4.jpg\/v4-728px-Make-a-Banner-Step-4-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4ロゴを追加します。ロゴ ファイルを開いてコピーし、編集中のバナー ファイルに直接貼り付けます。ロゴが新しいレイヤーとして表示されます。必要に応じて、レイヤーのサイズを変更します。 Ctrl+T (PC) または Command+T (Mac) を押し、ハンドルをドラッグしてレイヤーのサイズを変更します。Shift キーを押すと、比例してサイズが変更されます。
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/f5\/Make-a-Banner-Step-5-Version-4.jpg\/v4-460px-Make-a-Banner-Step-5-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/f5\/Make-a-Banner-Step-5-Version-4.jpg\/v4-828px-Make-a-Banner-Step-5-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 5会社名または Web サイト名を追加します。テキスト ツールを選択し、お気に入りのフォントを選択して、テキストを入力します。サイズを調整する必要がある場合は、前の手順の方法を参照してください。
  6. 6 他の要素を追加しますバナーによっては、ロゴと名前だけで十分なものもありますが、魅力を高めるためにスローガンや装飾が必要なものもあります。これらの要素を追加するときは、新しいレイヤーを作成して、変更が必要な場合に元のレイヤーに触れる必要がないようにします。
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b0\/Make-a-Banner-Step-7-Version-4.jpg\/v4-460px-Make-a-Banner-Step-7-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b0\/Make-a-Banner-Step-7-Version-4.jpg\/v4-728px-Make-a-Banner-Step-7-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 7位置を調整します。ロゴ、名前、その他の要素の位置を調整して保存します。 広告する
方法2方法2/6:

ペイントで作成

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/be\/Make-a-Banner-Step-8-Version-4.jpg\/v4-460px-Make-a-Banner-Step-8-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/be\/Make-a-Banner-Step-8-Version-4.jpg\/v4-728px-Make-a-Banner-Step-8-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1新しいファイルを作成します。
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cc\/Make-a-Banner-Step-9-Version-2.jpg\/v4-460px-Make-a-Banner-Step-9-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cc\/Make-a-Banner-Step-9-Version-2.jpg\/v4-728px-Make-a-Banner-Step-9-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 2バナーサイズの選択領域をドラッグしてサイズを自分で設定するか、 [1]の標準サイズを参考にしてください。
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cc\/Make-a-Banner-Step-10-Version-3.jpg\/v4-460px-Make-a-Banner-Step-10-Version-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cc\/Make-a-Banner-Step-10-Version-3.jpg\/v4-728px-Make-a-Banner-Step-10-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 3背景を色で塗りつぶしたい場合は、「塗りつぶし」ツールを選択し、お好みの色で塗りつぶします。もちろん、選択した色は Web ページのスタイルと一致する必要があります。
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/11\/Make-a-Banner-Step-11-Version-3.jpg\/v4-460px-Make-a-Banner-Step-11-Version-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/11\/Make-a-Banner-Step-11-Version-3.jpg\/v4-828px-Make-a-Banner-Step-11-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4画像とテキストを追加します。 [貼り付け]タブをクリックし、メニューから[貼り付け元]を選択します。
    • 必要な画像を見つけて、最後に「開く」ボタンをクリックします。
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7e\/Make-a-Banner-Step-12-Version-3.jpg\/v4-460px-Make-a-Banner-Step-12-Version-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7e\/Make-a-Banner-Step-12-Version-3.jpg\/v4-728px-Make-a-Banner-Step-12-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 5画像のサイズを変更します。 「サイズ変更」タブをクリックし、 「ピクセル」をタップして、バナーのサイズに合わせて画像の高さを設定します。
    • 画像を適切な場所に移動します。
    • 好きなだけ写真を追加できます (もちろん、Web サイトのスタイルと一致していることを確認してください)。
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/29\/Make-a-Banner-Step-13-Version-3.jpg\/v4-460px-Make-a-Banner-Step-13-Version-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/29\/Make-a-Banner-Step-13-Version-3.jpg\/v4-828px-Make-a-Banner-Step-13-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 6署名を追加します。署名やその他のテキストを追加するには、テキストツール ( Aボタン) を使用します。
  7. 7 バナーをトリミングします選択ツールを使用して、バナーの周囲に最終的に希望するサイズの選択範囲を描画し、 「切り抜き」をクリックします。
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/be\/Make-a-Banner-Step-15-Version-3.jpg\/v4-460px-Make-a-Banner-Step-15-Version-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/be\/Make-a-Banner-Step-15-Version-3.jpg\/v4-728px-Make-a-Banner-Step-15-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 8完了したら保存します。広告する
方法3方法3/6:

パワーポイントで作成

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/ad\/Make-a-Banner-Step-16-Version-4.jpg\/v4-460px-Make-a-Banner-Step-16-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/ad\/Make-a-Banner-Step-16-Version-4.jpg\/v4-728px-Make-a-Banner-Step-16-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1新しい空白のプレゼンテーションを作成します。
    • 表示を100%に調整します。
  2. 2 背景を描きますバナーサイズは標準サイズから選択可能[2] またはカスタマイズすることもできます。
    • [図形]タブをクリックし、[長方形] を選択します。
    • 指定されたサイズの長方形を描き、それを色で塗りつぶします。デフォルトの色を使用したり、[図形の塗りつぶし] または[図形の効果]メニューから選択したり、 [クイック スタイル]メニューからプリセット スタイルを選択したりできます。
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/60\/Make-a-Banner-Step-18-Version-4.jpg\/v4-460px-Make-a-Banner-Step-18-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/60\/Make-a-Banner-Step-18-Version-4.jpg\/v4-828px-Make-a-Banner-Step-18-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 3画像またはロゴを追加します。バナーに写真、ロゴ、グラフィックを追加できるようになりましたが、ここでは例としてクリップ アートを使用します。 「画像」ボタンをクリックし、必要な画像タイプを選択してから、画像を追加し、画像サイズを調整して、最後に適切な場所に移動します。
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/03\/Make-a-Banner-Step-19-Version-4.jpg\/v4-460px-Make-a-Banner-Step-19-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/03\/Make-a-Banner-Step-19-Version-4.jpg\/v4-828px-Make-a-Banner-Step-19-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4テキストやその他の要素を追加します。会社名、キャッチフレーズ、その他必要な情報を追加します。
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/32\/Make-a-Banner-Step-20-Version-4.jpg\/v4-460px-Make-a-Banner-Step-20-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/32\/Make-a-Banner-Step-20-Version-4.jpg\/v4-728px-Make-a-Banner-Step-20-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 5バナーを選択します。 [編集]メニューから[すべて選択] を選択するか、Ctrl+A (PC) または Command+A (Mac) を押します。重要: バナーが描画され、スライドに余分なものがないことを確認してください。
    • バナー上のテキスト以外のオブジェクトはすべて、右クリックして「画像として保存」して保存する必要があります。
  6. 6 バナーを保存しますもう一度開いて、希望する効果かどうかを確認し、Web ページに適用します。 広告する
方法4方法4/6:

オンラインバナーメーカーで作成する

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/52\/Make-a-Banner-Step-22-Version-4.jpg\/v4-460px-Make-a-Banner-Step-22-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/52\/Make-a-Banner-Step-22-Version-4.jpg\/v4-728px-Make-a-Banner-Step-22-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1.まず、BannersABC.com、Addesigner.com、mybannermaker.com などの Web サイトにログインしてください (Google でさらに検索できます)。オンラインで利用できるバナー ジェネレーターは多種多様です。時間をかけてさまざまなジェネレーターの結果を比較し、最も気に入ったものを選択してください。
  2. 2 テキストと画像を追加しますウェブページのヒントと方法に従って、バナーを段階的に作成します。これらのウェブサイトには通常、選択できる既成の画像が用意されています。もちろん、自分で作成した画像をインポートすることもできます。
  3. 3 バナーを生成しますバナーが作成されると、通常、Web サイトにエクスポート機能があり、バナーを指定したフォルダーまたはディレクトリに保存できます。また、保存する画像形式 (通常は jpeg として保存) を選択することもできます。ウェブサイトの指示に従って保存、ダウンロードし、自分のウェブページに適用してください。 広告する
方法5方法5/6:

バナーにマッチしたアバターを作成する

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/77\/Make-a-Banner-Step-25-Version-4.jpg\/v4-460px-Make-a-Banner-Step-25-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/77\/Make-a-Banner-Step-25-Version-4.jpg\/v4-728px-Make-a-Banner-Step-25-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1この手順は不要です。ただし、フォーラムにバナーを適用する場合は、一致するアバターを使用することをお勧めします。
  2. 2 切り抜きツールを選択しますほとんどの画像処理ソフトウェアにはトリミング機能があります。バナーを小さな画像に切り取ります。
    • あるいは、画像を小さくして、バナーにいくつかのオブジェクトを含めるように再設計することもできます。ロゴ、画像、または会社名だけでも構いません。重要なのは、それが表す組織をすぐに認識できるようにすることです。
  3. {"smallurl": "https:\/\/www.wikihow.com \/images_en \/thumb \/7 \/7b \/make-a-banner-step-27-version-4.jpg \/vv4-460px-make-a-banner-step-27-version-4.jpg" www.wikihow.com \/images \/thumb \/7 \/7b \/make-a-banner-step-27-version-4.jpg \/v4-728px-make-a-banner-step-27-version-4.jpg "、" smallwidth ":460、" 385 "" biked " Igheight ":546、"ライセンス ":" <div class = \ "mw-parser-output \"> <\/div> "} 3アバターは小さいはずです。アバターの標準サイズは 48 x 48 ピクセルです。
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/d\/dc\/Make-a-Banner-Step-28-Version-4.jpg\/v4-460px-Make-a-Banner-Step-28-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/dc\/Make-a-Banner-Step-28-Version-4.jpg\/v4-728px-Make-a-Banner-Step-28-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":828,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4アバターを保存します。広告する
方法6方法6/6:

フォーラムの署名や Web ページなどにバナーを追加します。

  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c4\/Make-a-Banner-Step-29-Version-4.jpg\/v4-460px-Make-a-Banner-Step-29-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c4\/Make-a-Banner-Step-29-Version-4.jpg\/v4-728px-Make-a-Banner-Step-29-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 1アカウントを登録します。 Photobucket、Flickr、Tumblr などの写真共有 Web サイトにアカウントを登録します。
    • 登録が完了したら、バナーやアバターなどの関連画像をアップロードします。
  2. 2コードを取得しますウェブサイトの共有機能を使用して HTML コードを取得し、フォーラムの署名や Web ページなどにバナーを追加します。 広告する

ヒント

  • コンピュータにさらにフォントをインストールする必要があります。
  • 練習すれば完璧になります。
  • フォーラムやウェブサイトなどを頻繁に訪問して、他の人がどのようにバナーを作成しているかを確認してください。
広告する

警告する

  • バナーを作るには多くの時間と忍耐が必要です。
  • Jpeg および Gif 形式の画像ではランダムなぼかし効果が加わる可能性があるため、バナーを 24 ビットのビットマップとして保存し、Jpeg および Gif 形式で別々に保存するのが最適です。
  • Photobucket に画像をアップロードする場合、Powerpoint で作成された EMF 形式のファイルは認識されないことに注意してください。ファイルを再度開き、JPEG または GIF として保存すると、正常にアップロードできるようになります。
広告する

<<:  Windows 7 をアクティベートする方法

>>:  iPhoneに音楽を同期する方法

推薦する

手術後のシャワーの浴び方

手術後の回復期間中は、日常の簡単な活動さえ困難になり、やる気を失うことがあります。ほとんどの外科手術...

真数を求める方法

対数(「圧縮演算」とも呼ばれます)は、数値を圧縮するために使用される数学的なツールです。これは天文学...

猫の寄生虫の見分け方

猫は、寄生虫とも呼ばれる腸内寄生虫に非常に感染しやすいです。感染経路は様々です。例えば、子猫は母乳を...

限界効用の計算方法

経済学では、限界効用は消費者が消費からどれだけの価値や満足感を得るかを測定します。一般に、限界効用は...

夫婦関係を改善する方法

結婚は恋人同士の究極の絆です。あなたたちは良い時も悪い時も、お互いを深く愛し合うことを誓いましたが、...

コンデンサのパラメータを理解する方法

抵抗器とは異なり、コンデンサはさまざまなコードを使用して特性を表します。小型コンデンサの印刷領域は非...

太陽系モデルの作り方

太陽系と太陽系内の主な惑星は小学生にとって最も基本的な学習内容です。太陽系模型を作ることは、子供たち...

Mac OS XでDVDコピーを作成する方法

個人の映画コレクションをディスクから Mac にコピーすることは、ディスクの破損によるデータ損失を防...

太ももの脂肪を落とす方法

太ももの脂肪を減らしたいなら、食事と運動を組み合わせる必要があります。運動して健康的な食事を摂ること...

トコジラミの刺咬を素早く止める方法

世界中でますます多くの場所でトコジラミが蔓延しています。あなたの家が清潔で整頓されているか、あるいは...

コンピュータの表示言語を変更する方法

このwikiHowでは、コンピューターの表示言語を変更する方法を説明します。 Windows と M...

自然な方法で毛の蓄積を除去する方法

ヘアケア製品に含まれる化学物質や硬水に含まれるミネラルが髪に蓄積し、髪が乾燥して、もろくなり、艶がな...

入学初日に向けての準備方法

夏休みも終わりに近づき、学校の始まりについて考える時期になりました。学校に行くのを楽しみにしている生...

Word文書の書式を調整する方法

Microsoft Word [1] X調査ソースこれは世界で最も人気のあるワードプロセッサプログラ...

Wordで背景を設定する方法

背景画像や透かしを追加すると、特に特定の種類のドキュメントでは魅力的でインパクトのある機能強化になり...