ブログ関連記事

バナーの作り方 サイズや画像加工、リンク先の構成HTMLタグ

アフィリなどやっていると、ASPですでに完成されたバナー広告があるのですが、

アフィリリンクにテキストしかない時があります。

そんな時は、自身でもバナーを作成出来るので作成してみましょう。

 

こちらが私が作成したバナーです。

クリックするとTwitterの画面に飛びます。

 

 

バナー画像の作成方法

 

では、早速バナーの作成に取り掛かりましょう。

まず、バナーの画像から作成していきます。

今回私は。

canvat

というサイトで画像を作成しました。

canva公式ページ

 

 

他にも特にどんなサイトで作るなど縛りはありませんので。

文字入れしないのであれば無料素材の画像でも良いですし。

他のアプリなどを使用しても大丈夫です。

 

Brain購入はコチラ

⇓⇓⇓


 

 

この、私のBrainのサムネイル画像ですが。これに関しては

スマホアプリのsnowphontというアプリの2つを使用して作成しました。

 

Excelやスプレッドシートなどでも作成可能です。

使用しなれているもので作成しましょう。

 

バナーリンクの作成方法

 

バナーリンクはHTMLを使用して作成します。

 

<strong>同じウィンドウで新しいリンク先を開く場合</strong>

<a href="リンク先URL"><img src="画像URL" alt="" border="0" /></a>

<strong>別ウィンドウで新しいリンク先を開く場合</strong>

<a href="リンク先URL" target="_blank"><img src="画像URL" alt="" border="0" /></a>

 

上記をコピペしてリンクURLと画像URLを挿入して作成します。

 

リンクURL

クリックした際に飛んで欲しい。リンクを貼りつけます。

このバナーに関しては

https://brmk.io/Jt9N

これを挿入しました。

 

画像URL

画像を一度ブログに挿入します。

これをビジュアル画面に貼りつけして。

テキスト画面を見ると。

 

このようになっているので。

 

http://chip-secret0209.gladcry.com/wp-content/uploads/2021/09/スクリーンショット-2021-09-26-224831-300x17.png

この部分だけ使用します。

 

まとめ

HTMLのテンプレを使用すると意外と簡単にバナーは作成出来ます。

アフィリでテキストしかない場合でバナーの方が良いと判断した際や。

他のリンク先に飛べるようにする際にバナーの方が分かりやすいと感じた際は。

この記事を参考に、バナーを作成してみて下さい。

-ブログ関連記事