バナーリンク（１）；貼り方　の続き。前回アップしたバナー（画像）にリンクを貼る方法。

★ブログのアクセスアップにはブログランキングが有効⇒人気blogランキング 人気ブログランキング | ブログ アクセスアップ

人気ブログランキング：バナーリンクの貼り方（２）　

リンクとは、バナーリンク（１）；貼り方　のように通常は下線が引いてあり青字で表示されるテキストリンクのことだ。
もっともこの下線や文字色はスタイルシートでいかようにでも出来る。

下線がなく、文字色が青でなくてもポインターを持っていくと、ポインターが指差しの形に変わるのがリンクである。
前回からのテーマのバナーリンクもその一つだ。
そして、リンクをクリックすると他のページに移動することが出来る。

リンクのタグは次の通り。
<A href="URL（ファイルのアドレス）">テキスト又はバナー（画像）</A>
前回の記事バナーリンク（１）；貼り方　をタグであらわす。
<A href="https://afdoh.com/blog-accessup/2007/07/post_06d4.html"target="_blank">バナーリンク（１）；貼り方</A>

それではいよいよ人気ブログランキングのバナーリンクを作成しよう。

人気blogランキングの開いたページ上の『システム概要』をクリック。
次に『参加方法』の『リンク方法とpingの送信先確認』と言うリンクをクリック。
登録IDとパスワードを入れてログイン。

<A HREF="http://blog.with2.net/link.php?貴方のID">人気blogランキングへ</A>
をコピーしてメモ帳などに貼る。

次にテキストとバナーを差し替える。
画像の表示には<imag src="ファイルのアドレス">というタグを使う。
私の場合は、
<img src="http://3month-putiganbou.cocolog-nifty.com/banner_02.gif">

従って、
<A HREF="http://blog.with2.net/link.php?貴方のID"><img src="http://3month-putiganbou.cocolog-nifty.com/banner_02.gif"></A>

これでも良いのだが、バナーに外枠が付いてしまっている。
そこで、バナー（画像）タグに　border="0" を追加する。
<A HREF="http://blog.with2.net/link.php?貴方のID"><img src="http://3month-putiganbou.cocolog-nifty.com/banner_02.gif "border="0"></A>
これで外枠が表示されなくなった。

更にバナー（画像）タグにalt属性を入れるのが基本。
これはバナー（画像）が表示されない時でもテキストで表示され、SEO（検索エンジン最適化）上も有効である。
そこで、alt="人気ブログランキング"を追加する。
<A HREF="http://blog.with2.net/link.php?貴方のID"><img src="http://3month-putiganbou.cocolog-nifty.com/banner_02.gif"border="0" alt="人気ブログランキング"></A>

さて、最後の仕上げである。
リンクをクリックした時、移動するページをどのように表示させるか？

人気ブログランキングをクリックすると人気ブログランキングのページに移動し、元のページはどこかへ行ってしまう。
元のページに戻るには、ブラウザ上の『戻る』をクリックしなければならない。

リンクページを参照しながら、元の記事を読みたい（あるいは読んでもらいたい）。
そういう時は、リンクタグに　target="_blank"　を加える。
<A HREF="http://blog.with2.net/link.php?貴方のID"target="_blank"><img src="http://3month-putiganbou.cocolog-nifty.com/banner_02.gif"border="0" alt="人気ブログランキング"></A>

最後に、リンクをクリックしてきちんと表示されるかをチェックする。
人気ブログランキング

★記事が参考になりましたら⇒人気blogランキング

スポンサードリンク

ブログ超初心者の無料 アクセスアップ法トップへ