Создание сайта: изображения
Ни один приличный сайт не может обойтись без изображений, разного рода картинок иконок и т. д. При выборе изображений Вам следует учесть некоторые факторы, а именно:
1. Процесс загрузки веб-страницы осуществляется по сети. Соответственно большое значение имеет объем изображения. Если он окажется слишком велик то страница будет загружаться медленно, а ни один человек в здравом уме не станет терпеть это издевательство и уйдет с Вашего сайта раньше чем тот успеет загрузится.
2. Следует ограничить размеры изображения, ибо, если оно будет больше допустимого - появятся стрелки прокрутки, и человеку необходимо будет вертеть Ваш сайт вправо/влево, вверх/вниз, что невероятно раздражает, особенно если надо, что-нибудь быстро найти.
Помните о том, что создание веб-сайтов и добавление графических материалов тесно переплетены: какой бы интересный материал не присутствовал на вашем ресурсе, пользователи в первую очередь будут обращать внимание на оформление контента и самого сайта. И именно от качества оформления во многом зависит, вернется ли посетитель на ваш сайт снова или забудет его как страшный сон.
Теперь поговорим о характере самих изображений. Изображения могут быть представлены в таких форматах, как GIF, JPEG или PNG – выбирайте любой на Ваше усмотрение. Важно соблюсти соотношение цена/качество – то есть достигнуть максимального качества изображения при минимальном его объеме.
Как вставить изображение на страницу? Очень просто. Используем html коды.
1. Когда изображение хранится в той же папке, что и страница.
<img src="nero.jpg">2. Если изображение берется из других источников, то указываем также адрес источника. Например:
<img src="images/nero.jpg">Или:
<img src="http://www.pobuhat.com/nero.jpg">Или:
<img src="http://www.pobuhat.com/images/nero.jpg">Полезные в настройке изображений «Атрибуты» позволяющие выравнивать картину по той или иной стороне и обтекать ее текстом – это:
ALIGN – Изображение выравнивается по горизонтали, а текст обтекает ее без отступов.
<p align="justify"> <img src=" nero.jpg" width="65" height="59" align="left">Условный текст.</p>HSPACE и VSPACE - То же самое но текст обтекает изображение с отступами по горизонтали и по вертикали.
<p align="justify"> <img src=" nero.jpg" width="65" height="59" hspace="15" vspace="15" align="right">Условный текст.</p>HEIGHT и WIDTH – Установка изображения по высоте и ширине (очень важно не ошибиться) лучше всего задавать реальные размеры изображения. Необходимо для того, что бы каждая картинка не загружалась по отдельности – это очень долго и не красиво.
<p align="justify"> <img src="nero.jpg" width="65" height="59" hspace="15" vspace="15" align="left">Условный текст.</p>
