Вам понадобится
  • - возможность изменения разметки web-страницы.
Инструкция
1
Сделайте баннер кликабельным путем его помещения в гиперссылку. Используйте HTML-элемент A. Добавьте начальный тег <a> с атрибутом href, значение которого указывает на целевой ресурс, а также завершающий тег </a>. Например:<a href="target.html"><img src="a.png" /></a>Это самый простой и наиболее часто используемый способ добавления баннеров в web-страницы. Фактически изображение здесь является анкором ссылки.
2
Примените клиентские карты для создания нескольких активных областей-ссылок на изображении баннера. В HTML-разметку документа добавьте элемент MAP с атрибутом name, определяющим имя карты. В MAP поместите один или несколько дочерних элементов AREA, с атрибутами href, shape и coords, имеющими корректные значения. Например:<map name="bannermap">    <area href="target1.html" shape="rect" coords="0,0,32,64" alt="цель 1" />    <area href="target2.html" shape="circle" coords="64,32,32" alt="цель 2" />    <area href="target3.html" shape="poly" coords="96,0,127,0,127,64" alt="цель 3" /></map>Элементу IMG, определяющему баннер, добавьте атрибут usemap, ссылающийся на клиентскую карту. Например:<img src="image.png" usemap="#bannermap" />Данный метод позволяет использовать один баннер для перенаправления пользователя на разные ресурсы в зависимости от того, какая из областей была активирована.
3
Используйте возможность обработки событий пользовательского ввода клиентскими скриптами для инициализации процесса перехода к другому ресурсу при клике по баннеру. Установите обработчик onclick соответствующему элементу документа. Это можно сделать, добавив атрибут onclick в HTML-разметку:<img src="image.png" onclick="document.location='target.html';" />или же непосредственно из скрипта:<img src="image.png" id="ID_BANNER" /><script type="text/javascript"><!--function OnBannerClick(){    document.location = "target.html";}document.getElementById("ID_BANNER").onclick = OnBannerClick;--></script>Подобный метод позволяет гибко управлять процессом перенаправления пользователя при клике по баннеру, однако не работает, когда скрипты в браузере отключены.
4
Внедрите баннер в web-страницу при помощи элемента INPUT типа image, входящего в состав формы для того, чтобы он был кликабельным. Элемент INPUT с атрибутом type, имеющим значение image, определяет графическую кнопку отправки. Адрес ресурса изображения задается атрибутом src. Например:<form action="target.php" method="post">    <input type="image" src="image.png" />    <input type="hidden" value="дополнительная информация" /></form>Применение данного метода отображения баннера предоставляет большие возможности. Так, можно передать на сервер достаточно большой объем дополнительных данных при помощи hidden-полей, особенно используя POST-запрос для отправки формы. Можно произвести какие-либо действия с формой перед отправкой, назначив обработчик onsubmit. Изображению кнопки допустимо назначать клиентскую карту при помощи атрибута usemap.