Як зробити банер клікабельним


 

Незважаючи на значне зниження популярності з моменту своєї появи, банери сьогодні все ще залишаються одним з основних рекламних засобів в інтернеті. Найпростіший баннер являє собою звичайне зображення. Але для того, щоб він повноцінно виконував свою функцію, потрібно зробити його клікабельним.


Вам знадобиться

— можливість зміни розмітки web-сторінки.

Інструкція

  1. Зробіть баннер клікабельним шляхом його приміщення в гіперпосилання. Використовуйте HTML-елемент A. Додайте початковий тег з атрибутом href, значення якого вказує на цільовий ресурс, а також завершальний тег . Наприклад:



    Це найпростіший і найбільш часто використовуваний спосіб додавання банерів в web-сторінки. Фактично зображення тут є анкором посилання.
        
  2. Застосуйте клієнтські карти для створення декількох активних областей-посилань на зображенні банера. В HTML-розмітку документа додайте елемент MAP з атрибутом name, визначальним ім’я карти. В MAP помістіть один або кілька дочірніх елементів AREA, з атрибутами href, shape і coords, що мають коректні значення. Наприклад:

    цель 1

    цель 2

    цель 3


    Елементу IMG, що визначає банер, додайте атрибут usemap, який посилається на клієнтську карту. Наприклад:



    Даний метод дозволяє використовувати один банер для перенаправлення користувача на різні ресурси в залежності від того, яка з областей була активована.
        

  3. Використовуйте можливість обробки подій для користувача введення клієнтськими скриптами для ініціалізації процесу переходу до іншого ресурсу при кліці по банеру. Встановіть обробник onclick відповідного елементу документа. Це можна зробити, додавши атрибут onclick в HTML-розмітку:



    або ж безпосередньо з скрипта:


    Подібний метод дозволяє гнучко управляти процесом перенаправлення користувача при кліці по банеру, однак не працює, коли скрипти в браузері відключені.
        

  4. Впровадити банер в web-сторінку за допомогою елемента INPUT типу image, що входить до складу форми для того, щоб він був клікабельним. Елемент INPUT з атрибутом type, які мають значення image, визначає графічну кнопку відправки. Адреса ресурсу зображення задається атрибутом src. Наприклад:




    Застосування даного методу відображення банера надає великі можливості. Так, можна передати на сервер досить великий обсяг додаткових даних за допомогою hidden-полів, особливо використовуючи POST-запит для відправки форми. Можна провести які-небудь дії з формою перед відправкою, призначивши обробник onsubmit. Зображенню кнопки допустимо призначати клієнтську карту за допомогою атрибута usemap.