1047136540_6751eba3ce_q

Photo:Click By:Fotos Nikon D40/D50

ちょっとした工夫でブログに貼ったテキストリンクやボタンリンクをクリックして貰いやすくなるって知ってました?

アフィリエイトを勉強する上で、ボク自身が学んだ事の1つなので紹介したいと思います。

Photo:Click By Fotos Nikon D40/D50

クリック率があがるテキストリンクの配色は青!?

皆さん、テキストリンクをイメージした時に1番最初に頭に浮かぶのは「青色」ではないでしょうか?

大手サイトの影響もあり、無意識的に青色はテキストリンクだと認識する事が多いようです。

当ブログで使用させて貰っているWordPressテンプレート「Stinger3」も、テキストリンク配色は「#5484C8」の青色を使用しています。

しかし一言に「青」と言っても、さまざまな色があります。その中で最もクリックされやすい「青」とは一体どんな色なんでしょうか?

実は、その調査を行った会社があります。皆もご存知な会社ですよ。

 

Microsoft社です!

 

Microsoft社がBingを設計していた時に、膨大な数の色を検証しユーザーの関心を持つ色を調査したようです。

その結果が青であり、その中でも「#0044CC」が最もクリックされやすいという事が分かったのです。少し古い調査ではありますが、詳細はこちらを参考にして下さい。

 

「この青色には、少なくとも8000万ドルの価値があった」

参考:「Bing」の検索リンクが青い理由–マイクロソフトが配色決定の裏側を説明

というコトで、当ブログもテキストリンクを「#0044CC」に変更してみました。

その結果はまだ出ていませんが、今後変化が出るのか楽しみです。というか、この記事を読んだ方はクリックしてくれればいいのです。笑

 

ボタンリンクは癒やしの色がダントツのトップ!

ao_btn

midori_btn

orange_btn

上の3つのボタンリンク・・・どのボタンをクリックしますか?あんまり意識するとダメですよ、自然に・・・そう自然に押したくなるボタン色はどれでしょうか?

テキストリンクでは青色が最もクリックされやすいという結果でしたが、ボタンリンクでは違った結果が出ています。

これは2009年にFirefoxでお馴染みのMozilla社が行った調査で、「どの色のボタンが1番クリックされやすいか?」というモノです。

 

color_results
参考: Firefox is Green

この結果を見ると、ダントツで”green=緑”がクリックされているのが分かるでしょう。

目立つコトを考えるなら”赤色”などを使用した方が良さそうですが、これは人間の心理にも関わってくるのでしょう。

  • 赤:興奮、闘争心、危険…
  • 緑:安心感、安定、調和…

他にも色がもたらすイメージはありますが3つずつ挙げてみました。赤色は活力を掻き立てるイメージを持っていますが、逆に”危険”というイメージもあるためクリックを躊躇させる可能性もあります。

緑色は癒しの色とも言われているように、”安心感を与える”コトでスムーズにクリックしてもらえる確率が高くなるようです。

また、ボクの遊び心で緑色のボタンに「クリックしないで下さい。」としましたが、これも人間の心理をついたモノです。

人間て不思議と「ダメだ!」「するな!」と言われると、やってみたくなる生き物のようですね。笑

だからといって、いつも「クリックしないで下さい。」と書いても本当にクリックされない場合もあるので・・・たまに使ってみるのも良いかもしれません。

意外とクリック率が伸びるかもしれませんよ!?

 

アフィリエイトテキストリンクに画像を差し替える方法

アフィリエイトでAmazonアソシエイトを利用している方が多いと思うので、Amazonの商品を参考に差し替え方法を紹介したいと思います。

これは楽天などのアフィリエイト生成でも使用出来るので、覚えておくと便利です。しかしちょっとグレーかもしれませんが…。ではやってみましょう!

上にあるCRYSTAL ARMORのガラスフィルムが画像リンクで生成したアフィリエイトリンクです。

これを任意の画像に差し替えていきます。先述したように緑のボタンなどにしたい場合に使用出来ますね。

 

<a href="http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&camp=247&creative=7399&creativeASIN=B00IYPFDOQ&linkCode=as2&tag=xxxx-22">【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5</a><img src="http://ir-jp.amazon-adsystem.com/e/ir?t=xxxx-22&l=as2&o=9&a=B00IYPFDOQ" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />

ボタン画像へと差し替える場合、まずテキストリンクを生成し、一部をいじってあげます。

 

<a>タグと<img>タグの2つに分けてみる!

<a href=”http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22″>【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5</a>

 

<img style=”border: none !important; margin: 0px !important;” src=”http://ir-jp.amazon-adsystem.com/e/ir?t=xxxx-22&amp;l=as2&amp;o=9&amp;a=B00IYPFDOQ” alt=”” width=”1″ height=”1″ border=”0″ />

分かりやすように<a>タグと<img>タグに分解してみました。改変するのは<a>タグの箇所になります。

 

<a>タグの2箇所を改変する!

<a href=”http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22″>【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5</a>

テキストとなる文字の前の「>」を削除して「target=”_blank”><img src=”” alt=”」に変更してあげます。

 

<a href=”http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22″>【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5</a>

テキストとなる文字の後の「<」を削除して「” /><」に変更して、<img>タグをくっつけてあげると・・・

 

<a href=”http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22″ target=”_blank”><img src=”” alt=”【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5″ /></a><img style=”border: none !important; margin: 0px !important;” src=”http://ir-jp.amazon-adsystem.com/e/ir?t=xxxx-22&amp;l=as2&amp;o=9&amp;a=B00IYPFDOQ” alt=”” width=”1″ height=”1″ border=”0″ />

 

任意の画像を挿入する!

<a href=”http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22″ target=”_blank”><img src=”” alt=”【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5″ /></a><img style=”border: none !important; margin: 0px !important;” src=”http://ir-jp.amazon-adsystem.com/e/ir?t=xxxx-22&amp;l=as2&amp;o=9&amp;a=B00IYPFDOQ” alt=”” width=”1″ height=”1″ border=”0″ />

最後に赤文字にある「img src=”画像URL“」を入れます。ここでは緑のクリックしないで下さいボタンのURLを入れてみましょう。

 

完成したアフィリエイトリンク

<a href="http://www.amazon.co.jp/gp/product/B00IYPFDOQ/ref=as_li_ss_tl?ie=UTF8&amp;camp=247&amp;creative=7399&amp;creativeASIN=B00IYPFDOQ&amp;linkCode=as2&amp;tag=xxxx-22" target="_blank"><img src="//acr0mania.com/wp-content/uploads/2014/04/midori_btn.jpg" alt="【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5" /></a><img style="border: none !important; margin: 0px !important;" src="http://ir-jp.amazon-adsystem.com/e/ir?t=xxxx-22&amp;l=as2&amp;o=9&amp;a=B00IYPFDOQ" alt="" width="1" height="1" border="0" />

これをWordPressのテキストエディタに貼り付けると・・・

 

【API-PPT001】クリスタルアーマー PAPER THINラウンドエッジ強化ガラス 液晶保護フィルム for iPhone 5s/5c/5

このようにボタンリンクにするコトが出来ました!

ちょっとアフィリエイトリンクが沢山書いてあるので見づらいですが、ゆっくりやればどなたでも作るコトが出来るので試してみて下さいね。

 

 

あくろのまとめ!

人間の心理を考えたアフィリエイトリンクの配色やボタンカラーって、非常に面白いですよね。

ボタンリンクへの変更は、グレーな部分もありますので各アフィリエイトの規約をよく読んで利用してみて下さい。

 
あくろが勉強しているアフィリエイトの教材はコレ!

この記事が役に立ったらいいね!しよう

最新情報をお届けします

Twitterでアクロマニアをフォローしよう!