Начало HTML. Работаем с изображением

При создании сайта изображения имеют важное значение. Представьте себе Web-страницу без фотографий, клипарта (картинок), пиктограмм и т.д.

Как вы уже наверно заметили физически изображения на страницу обычно не вставляются, а присутствуют в виде ссылок. Например, в редакторе Wordpress (самой распространенной и пожалуй простой CMS) при вставке изображения вы загружаете его в папку «upload» и даете на него ссылку на странице.

Для вставки изображения в Web-страницу применяется тег img который имеет следующие параметры:

1. src — ссылка – прописывается путь к какому-либо файлу в папке в корне сайта или в Интернете. Этот параметр является единственным обязательным, т.е. без него изображения не будет.

Например:

<img src="/image/logo-2.png" />

Получаем:

2. align — значение - вертикальное и/или горизонтальное выравнивание - этот параметр показывает, где будет располагаться изображение и как текст будет обтекать его. Может принимать следующие значения:

Например:

<img src="/image/logo-2.png" align="center" />

3. alt – текстовое описание изображения. Этот атрибут имеет важное значение т.к. учитывается роботами поисковых систем — по нему поисковик ранжирует картинки в поиске по изображениям. Кроме того, если посетитель отключил графику при просмотре сайта, или изображение не загрузилось, то вместо него будет видна рамка с названием картинки.

Для изображения выше можем использовать такой вариант: alt="логотип", или, что ещё лучше, alt="hostingreview.ru - обзоры хостинга", второй вариант будет полезнее ссточки зрения оптимизации. Не забывайте об этом атрибуте.

Например:

<img src="/image/logo-2.png" alt="hostingreview.ru - обзоры хостинга" />

4. Значение border="n" – задается ширина рамки изображения. По умолчанию "0"

1 <img src="..." border="0">

2 <img src="..." border="1">

3 <img src="..." border="3">