RSS

Компьютерная терминология    1_9  A  B  C  D  E  F  G  H  I  J  K  L  M  N  O  P  Q  R  S  T  U  V  W  X  Y  Z  .....  A  Б  В  Г  Д  Ж  З  И  К  Л  М  Н  О  П  Р  С  Т  У  Ф  Х  Ц  Ч

Изображения-карты

   


  • Как не оказаться обманутым при работе с SEO-агентствами
  • Ошибки в оптимизации контента
  • Распространенные ошибки оптимизации
  • Ссылки приносящие трафик
  • Юзабилити сайта
  • Оптимизация конверсионного пути
  • Основы внутренней оптимизации сайта
  • Поисковая оптимизация или контекстная реклама
  • Руководство по написанию эффективной статьи
  • Продвижение по НЧ-запросам
  • Мобильные версии сайтов и их продвижение
  • Линкбейтинг


  • Юзабилити интернет-магазина
  • Основы комментирования
  • Оптимизация содержимого тегов title, description, keywords
  • Способы уникализации контента на сайте
  • Борьба с дублями страниц
  • Дизайн и SEO
  • Оптимизация поведенческих факторов ранжирования
  • Покупка домена
  • Web-Designed
  • Webhints
  • Файл настроек .htaccess
  • Настройка robots.txt
Консультация юриста
Ваш регион:
Ваше имя:

Ваш телефон

(можно сотовый)

Ваш вопрос (можно кратко)


 

Карты - это способ сделать различные части одного графического изображения гиперссылками. Они позволяют выделить отдельные области изображений и определить для каждой из них свое действие.

Пример изображения-карты В данном примере изображения-карты Вы можете безобоязненно щелкать по ссылкам, они никуда не ведут, а выводят сообщения о том, какие ссылки были нажаты. Кнопки на этом изображении я нарисовал только для того, чтобы можно было видеть ссылки, а не искать их наугад по всему рисунку.

Здесь приводится HTML код данного примера. В нем исключены ссылки на script, который использовался в примере для вывода сообщений.

<IMG SRC="Map_example.jpg" BORDER="0" WIDTH="200" HEIGHT="160" ALT="Пример изображения-карты" USEMAP="#Map_example">
<MAP NAME="Map_example">
<AREA SHAPE="rect" COORDS="11,11,70,24" TITLE="Ссылка 1" HREF="URL">
<AREA SHAPE="rect" COORDS="70,72,128,83" TITLE="Ссылка 2" HREF="URL">
<AREA SHAPE="rect" COORDS="190,136,128,149" TITLE="Ссылка 3" HREF="URL">

Как видите, чтобы создать карту нужно вставить в тег <IMG SRC=""> атрибут USEMAP="#name", где name - имя карты (значок # обязателен). В примере использовалось название Map_example. Я пропускаю остальные атрибуты в этом теге, Вы их должны знать, т.к. о них уже рассказывалось в предыдущей статье

Далее описываем активные области карты. Начинаем с открывающегося тега <MAP NAME="name"> (здесь повторяется имя, но уже без значка #), а заканчиваем закрывающимся тегом </MAP>.

Между этими тегами помещаем описание каждой активной области изображения: <AREA SHAPE="форма" COORDS="координаты" HREF="адрес" TITLE="альтернативный текст">. Элемент <AREA> имеет следующие аттрибуты и их значения:

SHAPE Описывает форму выделяемой области, возможные значения:
RECT - прямоугольник
CIRCLE - круг
POLY - многоугольник
DEFAULT - определяет всю область, т.е весь рисунок может стать ссылкой.
COORDS Координаты, определяющие размеры и положение области на изображении. Все координаты отсчитываются в пикселях от левого верхнего угла изображения. Количество и порядок значений зависит от значения аттрибута SHAPE:
RECT: - левый-X, верхний-Y, правый-X, нижний-Y (т.е. сначала координаты левого верхнего угла, затем правого нижнего)
CIRCLE: - центр-X, центр-Y, радиус (т.е. горизонтальная и вертикальная координаты центра круга и радиус)
POLY: - X1, Y1, X2, Y2, ..., Xn, Yn (просто перечисляются координаты всех вершин многоугольника).
NOHREF Определяет, что данной области не соответствует никакая ссылка. Где это может пригодиться? Ну, например, если вы хотите сделать ссылку не в виде круга, а в виде кольца
ALT Альтернативный текст для выделенной области, используется невизуальными браузерами.
TITLE Название выделенной области, выводится в виде подсказки, всплывающей при наведении курсора на область рисунка.
TARGET Значение этого аттрибута ("_top", "_blank", "_self" или "_parent") определяет, в каком окне будет открыт документ

Для того, чтобы рассчитать точно координаты нужной части изображения существуют специальные программы. Одна из них называется MapEdit.

seo & website usability   inet   os faq   hardware faq   memory   video   cpu   hdd   mainboard faq   printer & scaner   modem   mobiles   hackzone

Технологии поискового маркетинга
Практика поискового маркетинга
Flash
Тэги
XML
DHTML
PHP
MySQL
WebMail
.NET
VBScript
CGI
Графические форматы Интернета
WEB-сайт шаг за шагом
CMS faq
FRAME faq
CSS faq
SSI faq
RSS faq
WAP faq
Web-Designed
Webhints
Файл настроек .htaccess
Настройка robots.txt

po gonn © 2005 "JULI'S BEEHIVE"