Листинг 4.1

<!DOCTYPE html>

<HTML>

<HEAD>

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">

<TITLE>Тег IMG</TITLE>

</HEAD>

<BODY>

<H1>Тег IMG</H1>

<P>Тег IMG служит для вставки на Web-страницу графического изображения.</P>

<H6>Пример:</H6>

<PRE>&lt;P&gt;&lt;IMG SRC=&quot;image.gif&quot;&gt;&lt;/P&gt;</PRE>

<H6>Результат:</H6>

<P><IMG SRC="image.gif"></P>

</BODY>

</HTML>

 

Здесь предполагается, что графический файл, содержимое которого мы будем выводить на Web-страницу, имеет имя image.gif. Если у вас другое имя файла, соответственно исправьте HTML-код.

Сохраним новую Web-страницу в файле t_img.htm и сразу же откроем в Web-обозревателе (рис. 4.1). На этой Web-странице мы увидим код примера вида

<P><IMG SRC="image.gif"></P> а чуть ниже — результат его выполнения.

 

 

Рис. 4.1.Web-страница t_img.htm в Web-обозревателе

Как видим, ничего сложного в размещении изображения на Web-странице нет. Нужно только приготовить графический файл и вставить в HTML-код один простой тег.

А теперь рассмотрим еще один атрибут тега <IMG>, который может нам пригодиться в дальнейшем.

Поскольку изображение хранится в отдельном от Web-страницы файле, Web- обозревателю придется послать Web-серверу еще один запрос на его получение. Web-серверу нужно найти этот файл и отправить его Web-обозревателю. Файл должен загрузиться по сети. На все это требуется время. Если изображений на Web-странице много, все они велики по размеру, а канал связи медленный, понадобится значительное время. Может случиться так, что сама Web-страница будет успешно загружена и отображена на экране, а изображения — еще нет. И Web-обозреватель вместо не загруженного еще изображения выведет на экран пустой прямоугольник.

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

И если с первой проблемой справиться практически невозможно, то вторую мы вполне способны решить. Для этого тег <IMG> поддерживает необязательный атрибут ALT, с помощью которого указывается так называемый текст замены . Он будет отображаться в пустом прямоугольнике, обозначающем незагруженное изображение, пока это изображение не загрузится:

<P><IMG SRC="image.gif" ALT="Пример изображения"></P>

Здесь мы задали для изображения с Web-страницы t_img.htm текст замены "Пример изображения".

 

НА ЗАМЕТКУ

Хорошим тоном Web-дизайна считается указание текста замены только у значащих изображений. У изображений, являющихся элементами оформления Web-страницы, текст замены обычно не указывают.

 

На этом пока все об интернет-графике. Мы еще вернемся к ней в главе 6 , когда будем рассматривать изображения-гиперссылки и карты-изображения. А сейчас пора начать разговор о…

 

 








Дата добавления: 2015-05-08; просмотров: 960;


Поиск по сайту:

При помощи поиска вы сможете найти нужную вам информацию.

Поделитесь с друзьями:

Если вам перенёс пользу информационный материал, или помог в учебе – поделитесь этим сайтом с друзьями и знакомыми.
helpiks.org - Хелпикс.Орг - 2014-2024 год. Материал сайта представляется для ознакомительного и учебного использования. | Поддержка
Генерация страницы за: 0.006 сек.