Переход на начало страницы

В одной из конкурсных работ после каждого раздела на длинной странице поставлена внутренняя ссылка (якорь):

Хорошо ли это?

Да, это правильное решение. Есть только две рекомендации.

Первая касается дизайна. Такие ссылки кажутся не слишком понятными, когда расположены среди текста на странице. Их лучше выносить на поле слева от текста в виде текстовой ссылки вверх или в виде ссылки-картинки с изображением стрелочки, направленной вверх (в отличие от изображения домика, который обозначает ссылку на главную страницу). Дополнительная рекомендация: рисуйте домик так, чтобы он был на самом деле похож на домик, а стрелочка — на стрелочку.
Второе замечание касается навигации. Якоря усложняют движение по кнопке Назад браузера. Нажав эту кнопку, пользователь ожидает попасть на предыдущую страницу, но браузер “пятится” по якорям-ссылкам на текущей странице. Если якоря щелкались часто, браузер будет долго по ним прыгать, и пользователь перестает понимать: то ли он уже на предыдущей странице, то ли все еще на текущей.

Для навигационного действия “на начало” можно легко обойтись без якоря, заменив его скроллом в начало страницы. Правда, для этого придется воспользоваться функцией окна scroll, написав маленький код на JavaScript. Но это, действительно, очень маленький и простой код:

<A href="javascript:void(0)"
   onclick="scroll(0,0)">вверх</A>

Здесь:

href="javascript:void(0)" — задает “пустую” ссылку;
onclick="scroll(0,0)" — задает скролл в начало при щелчке по тегу.

Описанный код отображается на странице так:

вверх

Атрибут onclick задает действие, которое должен выполнить браузер при щелчке пользователя по образу тега на экране. Значением атрибута в нашем случае является вызов стандартной функции scroll(0,0). Эта функция задает перемещение окна в нужные координаты (в записанном коде — в начало страницы, как по горизонтали, так и по вертикали). Вместо текстовой ссылки можно использовать рисованную кнопку:

<A href="javascript:void(0)" onclick="scroll(0,0)"
  ><IMG src=./pic/up.gif width=35 height=35
        border=0 alt=Вверх hspace=10 vspace=10
></A>

Ниже изображен пример такой навигационной кнопки, расположенной в одной строке с адресом автора.

Иван Сидоров kurs@robotland.pereslavl.ru