Как сделать в html кликабельные картинки

Вопрос кликабельности картинки наверное возникает у каждого вебмастера. Как ее сделать такой, что бы при клике по картинке она, как ссылка, приводила на нужный автору блога(сайта) на нужную ему страницу(URL) в браузере?

Для создания кликабельных картинок( по сути баннеров) можно использовать специальные сервисы-редакторы, однако, как мне кажется, не на всех платформах это возможно. Проще научиться в сообщениях  в режиме HTML составлять небольшие коды используя для этого специальные теги.

Для вывода изображений в html используется тег <img>. Выглядит это таким образом: <img src=»адрес картинки»

Разумеется этого недостаточно. Теперь нам нужен адрес(URL) страницы, на которую будет осуществлен переход при клике на картинку. Для этого используется тег <a>. Таким вот образом:<a href=»адрес ссылки» >Название ссылки, если необходимо</a>.

Ну, а теперь адрес картинки вставляем в «тело» этой анкороной ссылки: <a href=»адрес ссылки» ><img src=»адрес картинки» ></a>

Это объединение и даст возможность получить кликабельную картинку.

Теперь подробнее. Вы нашли нужную  вам картинку в интернете. Разумеется у нее есть адрес. Для того, что бы его узнать, нужно на странице какого либо сайта кликнуть правой кнопкой мыши по картинке и из контекстного меню выбрать строку «Открыть изображение». В появившейся адресной строке браузера вы увидите адрес картинки.  Например эта картинка:
alpha_business_key
имеет вот такой адрес: http://prt56.ru/wp-content/uploads/2012/01/alpha_business_key_white1.png. Теперь, допустим, я хочу  переадресовать посетителя блога (указав ему, что картинка кликабельна) на нужную мне страницу. Значит в режиме НTML своего редактора новых записей мой код должен выглядеть как-то так:

<a href=»http://prt56.ru/internet-bisnes/» ><img src=» http://prt56.ru/wp-content/uploads/2012/01/alpha_business_key_white1.png» ></a>


Адрес страницы я указал тот, на котором я разместил соответствующую статью «ВСЕ СКРЫТЫЕ МОМЕНТЫ И КЛЮЧИ УСПЕХА ИНТЕРНЕТ-БИЗНЕСА ДЛЯ НАЧИНАЮЩИХ». А вот  та же самая самая картинка, но теперь она уже кликабельна. Кликаем и переходим на вышеуказанную полезную статью:
Кроме того я теперь использую созданные кликабельные таким образом коды для кликабельных картинок-виджетов сайдбара, используя виджет «Текст». Впрочем, что-то подобное представляют сайты для работы с партнерами: баннеры сайтов-партнеров и тизерной рекламы, счетчики посещаемости и т. п. — ничто иное, как кликабельные картинки.
Источник: http://prt56.ru/sozdaem-klikabelnuyu-kartinku/

Закрыть ... [X]

Как сделать кликабельные картинки html - Азбука блоггера Как сделать шорты круче

Как сделать в html кликабельные картинки Как сделать картинку ссылкой в html
Как сделать в html кликабельные картинки Как сделать кликабельную и не кликабельную картинку Avitra
Как сделать в html кликабельные картинки Кликабельная картинка Создание сайта
Как сделать в html кликабельные картинки 1000 выкроек игрушек - делаем своими руками
Как сделать в html кликабельные картинки Автомобилист. org - Клуб любителей автомобилей
Как сделать в html кликабельные картинки Альпийские горки на даче своими руками: что это, виды горок
Как сделать в html кликабельные картинки Беседка из профильной трубы своими руками
Биокамин своими руками из подручных материалов фото и видео Декоративные банки своими руками Как изменить шрифт и размер букв в Word Как сделать мыло своими руками: рецепты с фото и Каталог видео о системах отопления, водоснабжения, канализации Мама для мам: Пасхальные поделки своими руками