HTML: язык гипертекстовой разметки

HTML (HyperText Markup Language — язык гипертекстовой разметки) — это основной строительный блок Всемирной паутины. Он определяет значение и структуру веб-контента. Для описания внешнего вида/представления веб-страницы обычно используются другие технологии помимо HTML (CSS), а для описания функциональности/поведения — JavaScript.

«Гипертекст» — это ссылки, которые соединяют веб-страницы друг с другом как в пределах одного сайта, так и между сайтами. Ссылки — фундаментальная составляющая Всемирной паутины. Публикуя контент в Интернете и связывая его со страницами, созданными другими людьми, вы становитесь активным участником Всемирной паутины.

HTML использует «разметку», чтобы снабжать текст, изображения и другой контент указаниями для отображения в веб-браузере. Разметка HTML включает специальные «элементы», такие как <head>, <title>, <body>, <header>, <footer>, <article>, <section>, <p>, <div>, <span>, <img>, <aside>, <audio>, <canvas>, <datalist>, <details>, <embed>, <nav>, <search>, <output>, <progress>, <video>, <ul>, <ol>, <li> и многие другие.

HTML-элемент отделяется от остального текста документа «тегами», состоящими из имени элемента, заключённого между < и >. Регистр букв в имени элемента внутри тега не имеет значения. То есть имя можно записать прописными или строчными буквами либо их сочетанием. Например, тег <title> можно записать как <Title>, <TITLE> или любым другим способом. Однако общепринятая и рекомендуемая практика — записывать теги строчными буквами.

Статьи ниже помогут вам узнать больше об HTML.

Учебные материалы для начинающих

В наших основных модулях по изучению веб-разработки собраны современные и актуальные учебные материалы, охватывающие основы HTML.

Ваш первый сайт: создание контента

В этой статье вкратце рассказывается, что такое HTML и как его использовать. Она предназначена для тех, кто только начинает заниматься веб-разработкой.

Структурирование контента с помощью HTML

В этом модуле рассматриваются основы языка HTML, а затем ключевые темы, такие как структура документа, ссылки, списки, изображения, формы и многое другое.

Формы HTML

Формы — очень важная часть Всемирной паутины: они обеспечивают многие функции, необходимые для взаимодействия с веб-сайтами, например регистрацию и вход в систему, отправку отзывов, покупку товаров и многое другое. Этот модуль поможет вам приступить к созданию клиентской части форм.

Руководства

Руководства по HTML помогут вам создавать веб-страницы с помощью HTML. В них рассматриваются такие темы, как формы, CORS, предварительная загрузка контента и адаптивные изображения.

Шпаргалка по синтаксису HTML и типовым задачам

Краткий справочник по распространённому синтаксису HTML и типовым задачам.

Использование комментариев HTML <!-- … -->

Комментарии HTML используются для добавления пояснений в разметку или для того, чтобы браузер не интерпретировал определённые части документа.

Проверка HTML-форм и Constraint Validation API

В HTML5 появилась проверка ограничений, упрощающая проверку форм на стороне клиента. Простые ограничения можно проверить без JavaScript, задав атрибуты элементов формы.

Категории контента

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

Использование форматов даты и времени в HTML

Некоторые элементы HTML используют значения даты и/или времени. В этом руководстве описаны форматы строк, задающих эти значения.

Использование микроразметки в HTML

Микроразметка позволяет встраивать метаданные в существующий контент веб-страниц. Поисковые системы и веб-роботы могут извлекать и обрабатывать микроразметку, чтобы сделать просмотр страниц удобнее.

Использование микроформатов в HTML

Микроформаты — это стандарты для встраивания семантики и структурированных данных в HTML, предназначенные для использования социальными веб-приложениями, поисковыми системами, агрегаторами и другими инструментами.

Режимы совместимости и стандартов

Историческая справка о режиме совместимости и режиме стандартов.

Использование адаптивных изображений в HTML

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

Типы и форматы мультимедиа в Интернете

Элементы <audio> и <video> позволяют воспроизводить аудио и видео непосредственно в контенте без поддержки внешнего программного обеспечения.

Практические руководства

Определение терминов с помощью HTML

HTML предоставляет несколько способов передавать семантику описания — как в строке, так и в виде структурированных глоссариев. В этой статье показано, как правильно размечать ключевые слова при их определении.

Использование атрибутов данных

HTML5 создан с учётом возможности расширения для данных, связанных с определённым элементом, но не имеющих заданного значения. Атрибуты data-* позволяют хранить дополнительную информацию в стандартных семантических элементах HTML.

Использование изображений с другого источника в canvas

У некоторых элементов HTML, поддерживающих CORS, например <img> или <video>, есть атрибут crossorigin (свойство crossOrigin), позволяющий настраивать CORS-запросы для получаемых данных элемента.

Создание карты ссылок поверх изображения

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

Создание быстро загружающихся HTML-страниц

Эти советы основаны на общих знаниях и практическом опыте. Оптимизированная веб-страница не только обеспечивает более отзывчивую работу сайта для посетителей, но и снижает нагрузку на веб-серверы и интернет-соединение.

Добавление JavaScript на веб-страницу

В этой статье объясняется, как добавить код JavaScript в HTML-файл.

Справочник

HTML состоит из элементов, каждый из которых может быть изменён с помощью различных атрибутов. HTML-документы связываются друг с другом с помощью ссылок. Ознакомьтесь с полным справочником по HTML.

Элементы HTML

Справочник по всем HTML-элементам.

Атрибуты HTML

Справочник по всем атрибутам HTML. Атрибуты — это дополнительные значения, которые настраивают элементы или по-разному изменяют их поведение.

Глобальные атрибуты

Справочник по глобальным атрибутам, которые можно задавать для всех элементов HTML, даже не предусмотренных стандартом. Это означает, что даже нестандартные элементы должны допускать использование этих атрибутов, хотя такие элементы делают документ несовместимым со стандартом HTML5.

Атрибуты по элементам

Типы input

Используются для создания интерактивных элементов управления в веб-формах.

Типы скриптов

Указывает тип скрипта, представленного элементом.

meta name

Предоставляет метаданные в виде пар «имя — значение» для всей страницы.

Значения атрибутов

Ключевые слова rel

Определяет отношение между связанным ресурсом и текущим документом.

Связанные темы

Применение цвета к элементам HTML с помощью CSS

В этой статье рассматриваются основные способы использования CSS для добавления цвета в HTML-контент: перечисляются части HTML-документов, которым можно задать цвет, и свойства CSS, которые для этого используются.