読者です 読者をやめる 読者になる 読者になる

攻めは飛車角銀桂守りは金銀三枚

ITとアコースティックギター、そして日常のひとこま。

これでクリック率アップ間違いなし。文字列リンクの広告をCSSでおしゃれに装飾してみる。実験的記事。

アフィリエイト
スポンサーリンク

広告リンク、ほぼクリックされませんね。

まぁ、上手に紹介してキーワードでSEOしてアクセス集めて・・・なんてやってないので当然かもしれません。

文字列リンクの広告をCSSでおしゃれに装飾

で今日はちょっと時間があいたのでCSSと戯れてみます。

例えば普通に文字リンク広告を貼ると
ロリポップ!のドメインは選べる全104種類!!

とこんな感じ。

これを

にしてみると少しはクリック率違うんだろうか?

作ったCSSは

.ad-link {
    width:250px;
    margin:0px;
    padding:0px;
    display:block;
    border-style : none;
    clear: both;
} 
/* 768px以上 */
@media (min-width: 768px) {
.ad-link {
    width:500px;
    margin:0px;
    padding:0px;
    display:block;
    border-style : none;
    clear: both;
} 
}
.ad-link > img{
    display: none;
}
.ad-link > a {
    clear: both;
    display:block;
    width:90%;
    height:28px;
    text-decoration: none;
    text-align:center;
    vertical-align:middle;
    background-color:deepskyblue;
    font-weight: bold;
    color: white;
    margin: 0 auto;
    padding:5px;
    border-radius: 10px; 
}

一応スマホ表示も考えてる雰囲気はありますが、確認してないので、変かもしれません。
(iPadではどっちになるんだろうか・・・?)

色を変えて

とかなら目立つ?

押したくなった?


CSSは苦手。そんなあなたに

ということで、もう少しかっこよくしてくれる人募集中。

まとめ

記事のタイトルはちょっと釣り気味です。こんなんでアップしたら苦労はしません。