バックページトップ (BPTリンク)

バックページトップとは

ページを作成する際、見やすさを重視して横にスクロールをしないように横の幅を調整すると、どうしても縦長の画面になってしまいます。

このような縦に長い画面で構成されるページの本文を読んでいく場合、本文の一番下までスクロールした後、再度画面の最初のメニューが見える位置までスクロールをしながら戻るのは大変です。

一発で画面の最初に戻れるようにするには

そこで一発で画面の最初に戻れるように考えられたのが、このBPT(バックページトップ)リンクです。

これを実現するのは意外と簡単です。

リンクのターゲット指定を用いて、画面の最初にリンクラベルを書き、本文の最後に「最初の画面に戻る」というようなリンクを付け足せば良いのです。

記入例

画面の最初に戻るには、ページの最初にラベルを付ける必要があります。

また、総合メニューが最上位にある場合には、メニュー付近にラベルを追加しても良いでしょう。

以下の2つの操作が必要です。

1. ラベル付け

<a name=”top”><img src=”spacer.gif” width=”0″ height=”0″ border=”0″ alt=””><br></a>

具体的な挿入場所は、<body>タグの直下、もしくはメニュー付近が良いでしょう。

リンクタグの間は必ず何か書かなければならないので(<a name=”top”></a>はダメ)、上の例では、透明な画像(スペーサーGIF)で代用しています。

2. ターゲットでページ内リンク

<a href=”#top”>画面の最初に戻る</a>

途中途中で

本文の最後だけにこのBPTリンクを入れても、本文途中で最初の画面に戻りたい場合には対応できないので、本文の途中、段落や大きな項目毎に入れておくのも良いかもしれません。

訪問者へのちょっとした気配りが、サイト全体の使いやすさをぐっと向上させます。

バックページトップは特に難しい機能ではないので、出来る限りページにつけるようにしましょう。

リンクの指定方法は?

リンクの挿入

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

CSSを駆使したモダンなWebデザインを学ぶなら

SEOについて学ぶなら

最新情報をチェックしよう!