Html: теги /
Содержание:
The декларация
HTML документ должен содержать объявление <!DOCTYPE> на самой первой строчке. Объявление <!DOCTYPE> это — инструкция для веб-браузера о том, на какой версии HTML написана страница. Это непарный тег, то есть у него нет закрывающего тега. Текущая версия HTML 5 использует следующую декларацию:
<!DOCTYPE html>
Cуществует несколько видов DOCTYPE. Есть строгие виды (strict), которые работают на основе только определенных тегов, есть переходные (transitional), которые допускают возможность включения дополнительных тегов, есть такие, которые работают с фреймами (frameset).
В HTML 4.01 doctype ссылается на Document Type Definition (DTD описывает схему документа для конкретного языка разметки посредством набора объявлений), который основан на SGML. Есть 3 разных типа doctype в версии HTML 4.01.
HTML 4.01 Strict
Этот DTD содержит все элементы HTML и аттрибуты, но ИСКЛЮЧАЕТ устаревшие или стилевые элементы (например, тег font). Также в strict не допускается использование frameset (фреймов).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional
Этот DTD содержит все HTML элементы и аттрибуты, ВКЛЮЧАЯ стилевые и устаревшие элементы. Frameset (фреймы) не допускаются.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset
Этот DTD тоже содержит все HTML элементы и аттрибуты, ВКЛЮЧАЯ стилевые и устаревшие элементы. В отличие от HTML 4.01 Transitional, но он допускает использование frameset (фреймов).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
В версии HTML5 есть только один doctype и определяется он следующим образом:
<!DOCTYPE html>
Правила DOCTYPE HTML5 являются универсальными, включают в себя правила предыдущей версии, а также возможность работы с HTML 4 тегами и в какой-то степени с XHTML, и объединяют в себе возможности всех своих предшественников, адаптируя их для работы в новых браузерах.
По сравнению с прежними своими собратьями, DOCTYPE HTML5 не основан на SGML (стандартном обобщённом языке разметки), поэтому там нет тех данных, которые указывались до этого, а следовательно — в нем присутствует только короткая команда. И дальше уже идет сам документ.
При отсутствии тега <!DOCTYPE> разные Web-браузеры мо
гут по-разному отображать веб-страницу.
Весь текст HTML-документа расположен между тегами <html> и </html>. HTML-документ состоит из двух разделов — заголовка (между тегами <head> и </head> ) и содержательной части (между тегами <body> и </body> ).
Теги форматирования¶
Теги форматирования используются для визуального и логического выделения фрагментов текста.
Тег Описание Определяет акроним.Не поддерживается в HTML5.
Определяет аббревиатуру или акроним.
Переопределяет текущее направление текста. Определяет шрифт большего размера.Не поддерживается в HTML5․ Рекомендуется использование CSS стилей.
Определяет длинную цитату.
Определяет фрагмент компьютерного кода. Определяет удаленный текст. Содержит определение термина или слова. По умолчанию, выделяется курсивом. Используется для акцентирования фрагмента текста. Выделяется курсивом. Определяет шрифт, цвет и размер текста. Не поддерживается в HTML5․ Рекомендуется использование CSS стилей.
Выделяет фрагмент текста курсивным начертанием. Определяет вставленный текст, который отображается подчеркнутым. Определяет вводимые пользователем нажатия клавиш или текст, набираемый на клавиатуре. Содержит выделенный/подсвеченный текст. Новый элемент в HTML5. Определяет скалярную величину в том же диапазоне или графическое представление дробного числа. Определяет предварительно отформатированный текст. Определяет индикатора прогресса выполнения задачи (progress bar).Новый элемент в HTML5.
Определяет короткую цитату. Содержит альтернативный текст, который показывается в браузере, не поддерживающем тег .Новый элемент в HTML5. Содержит аннотации сверху или снизу от текста, заключенного в тег (для западно-азиатских языков). Новый элемент в HTML5.
Содержит аннотации сверху или снизу от текста, заключенного в тег (для восточно-азиатских языков).Новый элемент в HTML5. Содержит текст, который уже не актуален. Содержит результат вывода компьютерной программы или скрипта.
Подчеркивает важность выделенного фрагмента текста. Определяет текст с нижним индексом
Определяет текст с верхним индексом. Определяет шаблон. Определяет время/дату.Новый элемент в HTML5.
Отображает шрифт моноширинным текстом.Не поддерживается в HTML5․ Рекомендуется использование CSS стилей.
Определяет текст, стилистически отличающийся от обычного текста. Определяет математические/переменные величины. Указывает браузеру, что при необходимости можно сделать перенос строки. Новый элемент в HTML5.
Встраивание элементов
<img></img> — вставка изображения. Имеет атрибут src, который указывает на адрес нужного файла. Есть и другие атрибуты:
<img src=»name» align=?> — выравнивание к одной из сторон документа. Например, значение right переместит рисунок в правый край, а left — в левый.
<img src=»name» border=?> — позволяет настроить в пикселях толщину рамки вокруг изображения.
<picture></picture> — контейнер для расположения элемента <img> без <source>, который даёт браузеру возможность самостоятельно выбрать подходящую картинку.
<audio></audio> — вставка звукового контента.
<video></video> — вставка видео (поддерживается Ogg, WebM и MP4).
<source></source> — указывает местоположение файла для <video>, <audio> и <picture>
<track> — формирует субтитры для <video> и <audio>.
<object></object> — контейнер, через который встраиваются мультимедийные файлы. Для передачи параметров применяется тег <param>.
<hr> — размещает на странице горизонтальную линию. Имеет несколько атрибутов.
<hr size=?> — устанавливает высоту линии.
<hr width=?> — устанавливает ширину линии.
<hr noshade> — убирает тень у линии.
<hr color=?> — задаёт цвет линии.
<script></script> — определяет выполнение сценария на стороне посетителя сайта. Может содержать сам скрипт или иметь ссылку на внешний источник.
<noscript></noscript> — ограничивает фрагмент документа, в котором скрипт не выполняется.
Добавление ключевых слов к видеоролику
Добавление ключевых слов к видеоролику также происходит в Творческой студии, во вкладке «Видео», в разделе, отвечающем за редактирование. Под заголовком и описанием будет окно «Теги». Название не должно вводить вас в заблуждение, на самом деле это ключевые слова. Всё, что относится к теме видеоролика, должно быть отражено в ключевых словах. Ключевых слов может быть сколь угодно много, единственное условие — уложиться в 500 символов.
вкладка теги
Использование ключевой фразы в названии YouTube видео ролика будет очень хорошей идеей.
ключевая фраза в заголовке
Для канала
Ключевые слова для канала нужны, в первую очередь, для алгоритмов YouTube и поисковых роботов, для передачи им информации о канале.
На канале вышеупомянутого Пупкина будет логичным использование следующих тегов: продвижение в соцсетях, раскрутка в соцсетях, smm, смм, раскрутка в Инстаграм, раскрутка ВКонтакте, раскрутка в тикток, раскрутка Facebook, продвижение Инстаграм.
На Машином канале о handmade можно использовать следующие теги: handmade, diy, diy блогер, хендмейд, уроки хендмейда, своими руками.
Прописываем ключевые слова для канала
Делается это в Творческой студии в разделе настроек.
Творческая студия / настройки
Переходим на вкладку «Канал».
Канал
В разделе «Основная информация» вы найдете поле для ввода ключевых слов. Пишем и сохраняем.
поле для ввода ключевых слов
Открытие ссылок в новом окне
Чтобы создать ссылку, открывающую страницу в новом окне браузера, вы можете воспользоваться атрибутом target открывающего тега элемента <a>. Значение этого атрибута должно быть установлено _blank. Чаще всего ссылки данного вида ставятся, если они перебрасывают посетителя на сторонний сайт. В этом случае создатели сайтов надеются, что посетитель вернется на их сайт по завершении просмотра открывшейся страницы, так как в этом случае ваш сайт остается открытым в исходном окне посетителя и не дает ему забыть о вас. Одни пользователи любят средство отображения в отдельном окне, а у других новые окна могут вызывать скорее чувство раздражения, чем комфорта. Поэтому пользуйтесь этим приемом экономно, лишь к некоторым ссылкам и, при этом, будет не лишним заранее предупредить посетителя, что страница откроется в новом окне.
В следующем примере показано как создать ссылку, открывающую страницу в новом окне браузера:
Если установить значение _blank для всех ссылок на веб-странице, то каждая из этих ссылок будет открываться у посетителя в новом окне, в результате перед пользователем может оказаться великое множество открытых окон. Для избегания подобной ситуации можно присвоить целевому окну индивидуальное имя, которое можно будет указывать в ссылках вместо значения _blank. Следующая ссылка откроется в новом окне с именем _window:
Укажите в каждой ссылке, на своей веб-странице, значение _window вместо _blank и все документы, к которым будет осуществляться переход по ссылкам, будут открываться в том же самом втором окне, а ваш сайт остается открытым в исходном окне.
Атрибут target может принимать следующие значения:
| Значение | Описание |
|---|---|
| _blank | Открыть страницу в новом окне или вкладке. |
| _self | Открыть страницу в том же окне (это значение задается по умолчанию). |
| _parent | Используется при работе с фреймами и позволяет открыть страницу в родительском фрейме; если на текущей странице нет фреймов, то это значение работает как _self. |
| _top | Применяется при работе с фреймами и позволяет открыть страницу в полном окне браузера, заменяя собой все фреймы, которые были на странице; если на текущей странице нет фреймов, то это значение работает как _self. |
| framename | Открыть страницу в новом окне с именем framename. |
Базовые теги
<!—…—> — тег для добавления комментариев в документ. Помещённые внутри него теги не интерпретируются браузером.
<!DOCTYPE> — показывает браузеру тип документа, сообщает его версию и язык.
<html></html> — корневой тег, который сообщает браузеру, что это HTML-документ. Все остальные элементы помещаются внутри него.
<head></head>— контейнер, в который помещаются метаданные документа, не видимые пользователям, но считываемые поисковыми роботами: например, <title> или <style>.
<meta> — тег для оформления метаданных документа, используемых браузером для обработки страницы, а поисковиками — для индексации.
<body></body> — тег, обрамляющий видимую пользователям часть документа. Всё, что вы укажите внутри этого контейнера, отобразится на странице. Тег <body> имеет несколько атрибутов, позволяющих управлять цветами.
<body bgcolor=?> — цвет фона документа в формате RGB.
<body text=?> — цвет текста.
<body link=?> — цвет гиперссылок.
<body vlink=?> — цвет гиперссылок, по которым уже переходили.
<body alink=?> — цвет гиперссылок при нажатии.
<title></title>— метатег, который задаёт название страницы, отображаемое на вкладке браузера.
<header></header> — определяет содержимое блока с вводной информацией сайта или группой ссылок.
