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

Вставка изображений на страницу сайта - тэг и атрибуты, примеры
Начало HTML. Работаем с изображением

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

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

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

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

Например:

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

Получаем:

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

  • align="left" - картинка слева. фактически получаем: float: left; vertical-align: top;
  • 2 align="right" - картинка справа. получаем: float: right; vertical-align: top;
  • 3 align="center" - картинка по центру, по вертикали. получаем: vertical-align: middle;

Например:

<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">


Может будет интересно?

На чем сделать сайт

На чем сделать сайт

Чтобы сделать сайт, необходимо сперва понять, с помощью какой системы вы будете им управлять. Для управления содержимым ресурса разработаны специальные системы СMS, дающие возможность использовать готовые шаблоны, которые остается лишь дополнить необходимой информацией и спроектировать его дизайн. Таких систем создано немало (как платных, так и бесплатных), и, прежде чем приступать к собственно созданию сайта, стоит ознакомиться с каждой из них, чтобы понять, в чем сильные и слабые стороны каждой из них

Дата-центры

Дата-центры

Виртуальный хостинг, виртуальный сервер, выделенный сервер – все три услуги, оказываемые хостинг-провайдером, зависят от дата-центра (ДЦ). Что же это такое, и почему так важно выбрать «правильный» дата-центр?

Топ хостинг-провайдеров