/
Что такое доменное имя сайта и как выбрать доменное имя для сайта ? Анализ страниц поисковыми машинами Какую выбрать тематику сайта ? Seo-копирайтинг в двух словах Уровень вложенности страницы что это ?

Что такое доменное имя сайта и как выбрать доменное имя для сайта ?


Что такое доменное имя сайта? Доменное имя – это определенный набор символов, который используется для того, чтобы абсолютно любой пользователь интернета смог найти нужный ему ресурс. 16 дней назад
Что такое доменное имя сайта и как выбрать доменное имя для сайта ?
Что такое доменное имя сайта и как выбрать доменное имя для сайта ?
Анализ страниц поисковыми машинами
Анализ страниц поисковыми машинами
Какую выбрать тематику сайта ?
Какую выбрать тематику сайта ?
Seo-копирайтинг в двух словах
Seo-копирайтинг в двух словах
Уровень вложенности страницы что это ?
Уровень вложенности страницы что это ?

Урок 6. Изображения в HTML

Урок 6. Изображения в HTML

Тег <img/>

Чтобы вставить изображение в нашу HTML страницу необходимо использовать тег <img/>Тег <img/> содержит атрибуты и не имеет закрывающего тега.

Ссылка на изображение добавляется при помощи атрибута scr (source-источник).

<img src="image.png" />

Давайте немного потренируемся:

  1. Создайте папку на вашем компьютере и скопируйте внутрь свою HTML страницу, у меня это к примеру first.html.
  2. Загрузите в папку любое изображение и назовите его image.
  3. Вставим изображение с помощью тега <img/> в нашу HTML страницу.
<html>
 <head>
  <title>Название сайта</title>
 </head>
 <body>
  <h1 align="center">Заголовок первого уровня по центру</h1>
  <hr/> <!--Линия после заголовка -->
  <img src="image.png" />
 </body>
</html> 
 

Атрибут alt

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

<html>
 <head>
  <title>Название сайта</title>
 </head>
 <body>
  <h1 align="center">Заголовок первого уровня по центру</h1>
  <hr/> <!--Линия после заголовка -->
  <!--Испортим ссылку на изображение с помощью / -->
  <img src="/image.png" alt="Альтернативный текст"/>
 </body>
</html> 
 

Размер изображения

Чтобы указать размер изображения используются атрибутыwidth(ширина) и heigth(высота).

Размер может быть указан в процентах(%) или же в пикселях(px).

По умолчанию размер моего изображения 800(ШИРИНА)х600(ВЫСОТА)px, уменьшим его.

<html>
 <head>
  <title>Название сайта</title>
 </head>
 <body>
  <h1 align="center">Заголовок первого уровня по центру</h1>
  <hr/> <!--Линия после заголовка -->
  <!--Не забудьте убрать / для корректного отображения изображения -->
  <img src="image.png" width="400px" heigth="300px" 
   alt="Альтернативный текст"/>
  <!--Или -->
  <img src="image.png" width="%" heigth="10%" alt="Альтернативный текст"/>
 </body>
</html> 

Не старайтесь загружать изображения больших размеров, так как это замедляет загрузку сайта и негативно сказывается на его продвижении.

Рамка вокруг изображения

По умолчанию вокруг изображения нет рамки. Рамку можно добавить с помощью атрибута border.

Размер рамки указываем в px(пикселях).

<html>
 <head>
  <title>Название сайта</title>
 </head>
 <body>
  <h1 align="center">Заголовок первого уровня по центру</h1>
  <hr/> <!--Линия после заголовка -->
  <img src="image.png" width="400px" heigth="300px" border="2px"
   alt="Альтернативный текст"/>
 </body>
</html> 
 

В уроке мы не станем затрагивать такие атрибуты как align, hspace(атрибут отвечающий за отступ от изображения по горизонтали), vspace (атрибут отвечающий за отступ от изображения по вертикали).

Некоторые из них устарели и используются вСss.

Урок 7. Ссылки в HTML

22:49
98
RSS
Нет комментариев. Ваш будет первым!
Загрузка...