Файл: Уроки HTML.docx

Постарайтесь сделать так, чтобы смысл был понятен. Я проиллюстрирую этот совет (ссылки выделены жирным шрифтом). Такой абзац содержит непонятную ссылку: Московский Ледовый Цирк - это сплошной праздник. Посещение этого цирка доставит удовольствие отдельным зрителям и целым семьям любого возраста и положения. Кликните на Московском Ледовом Цирке, и вы увидите палатку цирка. Эта палатка знаменита на весь мир. Это самая высокая цирковая палатка на сегодняшний день.

А вот тот же текст с понятной ссылкой: Московский Ледовый Цирк - это сплошной праздник. Посещение этого цирка доставит удовольствие отдельным зрителям и целым семьям любого возраста и положения. Вы непременно захотите увидеть палатку цирка - самую большую цирковую палатку в мире на сегодняшний день.

Ссылки не должны нарушать плавности повествования, как это было в первом примере ("Кликните на..."). Как будто посетители и так не знают, что нужно кликнуть на ссылку. Но вообще на первый взгляд это мелочи, но статистика показывает, что это очень важный элемент.

Предупреждения о ссылках на большие документы

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

Поддерживайте ссылки в действующем состоянии

Когда вы приобретете опыт в создании веб-страниц, на них, скорее всего, бедет целый ряд ссылок на различные части Веба. Эти ссылки со временем устаревают. Веб-страницу, на которую вы ссылаетесь, могут удалить или перенести на другой узел. В среднем раз в несколько месяцев некоторые ваши ссылки будут терять актуальность.

Посетители вашей веб-страницы будут разочарованы, если попытаются воспользоваться такой ссылоки и узнают, что этой страницы больше нет. Периодически проверяйте ссылки на своей веб-странице, чтобы точно знать, что они актуальны. Иначе их лучше не использовать.

Уроки html'а. Урок # 14.

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

Читая материал о том как оживить веб-страницу с помощью графики, вы узнали о том, как графика обогащает Всемирную Паутину и делает страницы интересными для просмотра. В этой главе я расскажу, как сделать еще один шаг вперед и заставить изображения работать на вас.

Разновидность веб-графики, о которой пойдет речь, назвается изображения-карта. Такие изображения удобны в использовании и быстро приобрели популярность среди веб-разработчиков во всем мире. Изображение-карта - это такое изображение, различные фрагменты которого служат ссылками на разные документы. Выбирая с помощью мыши различные фрагменты изображения, посетители могут перемещаться со страницы на страницу. По своей природе изображения-карты более удобны, чем обычные текстовые ссылки, потому что в этом случае не приходится объяснять, что делает каждая ссылка. Посетителю нет необходимости читать о том, куда перенесет его ссылка, он и так это видит.

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

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

Вы уже знакомы с тем, как располагать графику на веб-странице, и умеете использовать изображение в качестве ссылки, вставляя тег <img> в гипертекстовую ссылку, например, так:

В этом примере я ввожу кнопку своего проекта. Если посетитель щелкнет на этом изображении, браузер автоматически загрузит сайт Design Laboratory.

На каком бы месте рисунка вы ни кликнули, вы все равно осуществится ссылка на Design Laboratory. В этом и состоит отличие простого изображения от изображения-карты. Кликнув на разных фрагментах изображения-карты, вы попадаете на различные HTML-файлы.

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

Посмотрите на домашнюю страницу моей подруги (Weirdo). Это замечательный пример изображения-карты. Я поместил на страницу 25 разных изображений, некоторые из которых - изображения-карты. Каждый фрагмент с надписью (chat, about me, favorites) переносит вас на определенную страницу.

Есть много полезных способов применения изображений-карт. Например, можно создать карту Италии. Вы сможете кликать мышью на любом регионе или городе, о котором хотите узнать. Кликните на Риме, и вы увидите Колизей, на Пизе - знаменитую "кривую" башню. Вот и идея для сайта ;). Компания Боинг, например, может вывести расунок своего самолета. Чтобы ознакомиться с моделью, предположим, 777, ему будет достаточно кликнуть на определенный участок рисунка.

Практически любое изображение легко превратить в изображение-карту. При использовании соответствующих средств изображение-карту можно разработать и ввести в веб-страницу за несколько минут.

Изображения-карты не являются новой технологией

Изображения-карты используются давольно давно. Однако с появлением версии Netscape 2.0 их применение на веб-страницах стало намного проще.

Раньше, вводя в свою веб-страницу изображение-карту, вы зависели от программного обеспечения своего сервера. Сервер управляет доступом ко всем веб-страницам на определенном интернет-узле. Чтобы использовать изображение-карту, нужно было найти подходящее изображение, определить, какой его фрагмент будет служить ссылкой на какой документ, а затем произвести необходимые установки на сервере. Это было довольно сложно даже для тех, кто понимал каждый шаг. Некоторые веб-серверы не позволяли использовать изображения-карты, поэтому их применение на веб-страницах было прерогативой профессиональных веб-разработчиков и крупных компаний. Лишь немногие частные лица использовали на своих личных страницах изображения-карты.

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

Различия между серверными и клиентскими изображениями-картами

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

Серверные изображения-карты работают следующим образом. На веб-странице выставляется большое изображение, состоящее из нескольких четко разделенных фрагментов. Вы кликаете на одном из фрагментов. Веб-браузер запоминает координаты и запускает CGI (Common Gate Interface - общий шлюзовой интерфейс), который транслирует координаты в URL'е, т.е. имя файла, соответствующего тому фрагменту, на котором был произведен клик. Затем браузер передает имя файла браузеру, который и загружает соответствующий файл.

Как вы догадываетесь, серверные изображения-карты не слишком эффективны и ими трудно пользоваться, чему есть ряд причин:

Серверные изображения-карты не будут работать, если вы не запустите свой узел на собственном жестком диске, поскольку необходимо прямое соединение с веб-сервером, проще говоря нужен хотя-бы локальный веб-сервер.
Изображения-карты могут перегружать веб-сервер. Если ваш веб-сервер очень популярен, он можнт непрерывно запускать программу транслирования координат в пикселах в HTML-файл. Это сильно замедлит работу всех, кто читает веб-страницы на данном веб-узле.

К счастью, новый вид изображений-карт пришел на смену серверным. Клиентские изображения-карты существенно проще и более эффективны при взаимодействии с веб-серверами. Пользователь видит на экране такое же изображение, но при клике на нем происходит совсем другой процесс. Вместо обмена данными с веб-сервером браузеры сами узнют, на какой из HTML-файлов сделана ссылка, и автоматически переносят вас на тот файл. Этот процесс занимает существенно меньше времени (вы не ждете ответа от сервер) и проще для интерпритации браузером. Каждому фрагменту изображения соответствуют собственные координаты в пикселах. Эти координаты заданы в том же HTML-файле, что и остальная часть веб-страницы, и вы можете осуществить ссылку на другую HTML-страницу так же, как и при использовании обычного тега <a href>.

Клиентские изображения-карты проще создавать, и они удобнее для посетителей. В конце концов, клиентские изображения-карты полностью вытесняют серверные.