研Q3.トップページに戻るボタンの作り方

トップページに戻るボタンは超簡単なアクセスアップカスタマイズです。

photo:(view on black) Model house on model field, subtle by mendhak

ブログのナビゲーションが使いやすいと、確実にアクセス数（PV：ページビュー）が増えます。


検索エンジンから初めて来ていただいて、
「このブログ、おもしろいかも！？」と思ったお客様はほかの記事も読みたくなります。

読みたいと思ったときに、いかに簡単にほかのページに移動できるかが、運命の分かれ道です。

ごく一般的には、ブログのトップページに飛んでみるのではないでしょうか。


このブログの右上には、
↓こんなボタンがつけてあります。



右上につけてあるボタンは、ページをスクロールしても、いつも同じ場所に表示されています。

どのウェブサイトでもページのいちばん上まで行けばトップページに行くためのリンクがあるので、
トップに行きたいなと思ったら右側のスクロールバーの上のほうに目が行くはず。

ということで右の上につけてあります。

トップページに戻るボタンの設置方法

ブログのHTMLに↓こんなタグを組み込んであります。

<div style="position: fixed; top: 20px; right: 0px;z-index: 1500;"><a href="トップページのURL" title="このブログのトップページへ" alt="このブログのトップページへ"><img src="画像のURL" border="0" /><img/a><img/div>

top: 20px は、画面の上端からの距離。

right: 0px は、右端からの距離です。

rightをleftに変えると、画面の左端になります。


ボタン画像の作り方は、ボタン素材 自動生成サイト - ButtonMakerアフラットで作成して、
Paint Shop Plusで透明に加工しました。

ボタン上端の矢印になっている部分の背景は透明にしてあります。

当ブログで使っているボタン画像でよろしければ、自由にダウンロードして使っていただいてけっこうです。
クレジット表示などは不要です。

アメーバブログのようにテンプレートのHTMLを編集できないブログでは、（アメブロならば）フリースペースにタグを組み込む。
それもできなければ、本文中にタグを組み込んでもOKです。
ブログに表示される場所にタグを組み込んでおけば、タグコードは表示されずにボタンだけが表示されます。

初めて当ブログに訪れた方や何度か当ブログにお越しいただいているみなさま。
もしブログの内容を気に入って頂けましたらRSSリーダーの登録よろしくお願いします。
　　　

ツイッター でも、更新案内を流しています。　　　　　　　　　　　　　　　　　　　　　　　　　　

RSSリーダーとは？⇒ ＲＳＳってなんなの？

　　リンク切れ、動画削除などを発見されましたら、コメントで教えていただけると非常にありがたいです。

▲ネットビジネス研Ｑ室のトップページに戻る▲　　●ネットビジネス研Ｑ室の記事一覧●

記事末尾110posted by +M Inamura (水村亜里)