Один сплошной текст может казаться довольно скучным и плоским. Но ведь Интернет не только текст. Это мультимедийная сеть, и наиболее распространенная форма медийного представления информации – изображение.
Для того чтобы определить изображение в HTML документе, используется тег <img>. И выглядит это следующим образом:
<img src="http://www.msiter.ru/images/logo.gif" width="157" height="70" alt="MSITER.RU" />
Атрибут src показывает браузеру, где находится изображение. Как и при определении ссылки (о чем рассказывалось ранее) путь может быть абсолютным, как в примере, но обычно используется относительный путь. Например, если вы создадите свое изображение и сохраните его под именем "alienpie.jpg" в директории "images", то тег примет следующий вид: <img src='images/alienpie.jpg'…
Атрибуты width и height определяют ширину и высоту изображения в пикселях. Хотя это и необязательные атрибуты, лучше всего их указывать, так как если их опустить, то браузер будет рассчитывать размер изображения по мере его загрузки, что может привести к искажениям внешнего вида веб-страницы. Кроме этого эти атрибуты позволяют манипулировать отображаемыми размерами изображения. Тем не менее, следует помнить, что реальный размер файла изображения в килобайтах останется прежним, и прежним будет время его загрузки.
Атрибут alt – альтернативное описание. Оно полезно, если браузеру по той или иной причине не удалось загрузить изображение; при этом в том месте, где должно быть изображение, будет показан текст этого атрибута. В последних стандартах HTML этот атрибут перестал быть необязательным, а стал настоятельно рекомендуемым.
Обратите внимание, что тег <img> не имеет закрывающего тега и закрывает сам себя при помощи завершающей конструкции "/>".
Создание изображений для сети находится немного в стороне от темы данного учебника, однако стоить упомянуть несколько вещей…
Наиболее часто используемые форматы изображений – это GIF и JPEG. Оба эти формата сжимают исходное изображение, чтобы файл этого изображения был меньших размеров, и имеют различное предназначение.
Изображения в формате GIF могут содержать не более 256 цветов, и этим цветам приходится представлять цвета исходного изображения. Здесь действует правило – чем меньше цветов в изображении, тем меньше размер файла этого изображения.
GIF ДОЛЖЕН ИСПОЛЬЗОВАТЬСЯ ДЛЯ СЖАТИЯ ИЗОБРАЖЕНИЙ С ЦВЕТАМИ БЕЗ ГРАДАЦИЙ.
С другой стороны формат JPEG для сжатия изображения использует специальный математический алгоритм, и это чуть-чуть искажает оригинал.
JPEG ДОЛЖЕН ИСПОЛЬЗОВАТЬСЯ ДЛЯ ТАКИХ ИЗОБРАЖЕНИЙ, КАК ФОТОГРАФИИ.
Изображения – это, вероятно, самые большие файлы, с которыми веб-дизайнеру приходится иметь дело. Забывчивость о размере файла – очень распространенная ошибка, а этот самый размер может быть весьма и весьма значителен. Веб-страницы должны загружаться как можно быстрее, и если вспомнить, что большинство людей до сих пор для доступа в Интернет используют модемы со скоростью 5-7кБ/с, то вы легко сможете подсчитать, насколько большие размеры некоторых файлов увеличивают общее время загрузки веб-страницы.
Необходимо соблюдать разумный баланс между качеством изображения и размером его файла. Большинство современных программ манипулирования изображениями позволяют осуществлять их сжатие в различных форматах и режимах, и единственный способ найти золотую середину – это путь проб и ошибок.
