HTML — это язык для описания структуры веб-страниц. Страницы, созданные с его помощью, могут быть просмотрены только при помощи специальных программ (браузеров), установленных на компьютерах пользователей.
- Аббревиатура HTML расшифровывается как Hyper Text Markup Language (язык разметки гипертекста).
- Запомните, он не является языком программирования, это язык разметки.
- HTML использует теги разметки, чтобы описать структуру веб-страницы.
Теги
С помощью тегов браузер распознает структуру и значение вашего текста, например, они сообщают браузеру, какая часть текста является заголовком, где начинается новый абзац, что нужно подчеркнуть и где расположить изображение (картинку). Получив эту информацию, браузер использует встроенные в него по умолчанию правила о том, как отображать каждый из этих элементов.
Примечание: в нашем HTML справочнике вы можете посмотреть стили, применяемые по умолчанию, для любого интересующего вас тега.
Урок 26. Тег meta кодировка символов. Язык разметки с нуля.
Без использования HTML тегов браузер выведет просто сплошной поток текста, без отступов, заголовков, абзацев и т.д. Чтобы стало понятнее, рассмотрим это подробнее на примерах.
Так выглядит страница, в которой используются теги для разметки:
Летнее меню
Напитки в нашем кафе
Мультифрукт — 100р.
Фруктовый напиток, содержащий апельсиновый и ананасовый соки.
Молочный коктейль — 150р.
Сливочное мороженое, перемешанное с мякотью фруктов.
То же самое, но без использования тегов:
Напитки в нашем кафе Мультифрукт — 100р. Фруктовый напиток, содержащий апельсиновый и ананасовый соки. Молочный коктейль — 150р. Сливочное мороженое, перемешанное с мякотью фруктов.
С этой темой смотрят:
- Как браузер получает веб-страницы?
- Создание html документа
- HTML элементы
- Структура html-документа
- Введение в CSS
Источник: puzzleweb.ru
Что такое язык разметки HTML
Получи нашу книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».
Подпишись на рассылку и получи книгу в подарок!
НTML — это язык гипертекстовой разметки.
Язык используется для организации веб-страниц. Проведем аналогию. Вы покупаете газету. В ней напечатаны несколько статей. У каждой статьи есть название, в ней есть фотографии. А текст набирается несколькими колонками.
ЯЗЫК РАЗМЕТКИ HTML ЗА 40 МИНУТ ДЛЯ НАЧИНАЮЩИХ. ВСЕ ТЕГИ ВКЛЮЧЕНЫ.
Это — структура газетной страницы.
На сайте все происходит так же. Чтобы сделать правильную структуру статьи — контента — нужно использовать язык разметки текста.
Для чего нужен HTML
Язык HTML нужен, чтобы сообщить браузеру, как нужно отобразить страницу на экране.
Язык распространен повсеместно. Это универсальное средство для оформления контента на странице. Его использование возможно в любой браузере. Если писать код на языке программирования — нужно знать какие-то особенности, операторы, типы данных и так далее.
HTML состоит из набора тегов — команд, и атрибутов — свойств. Их несложно запомнить, и всегда можно найти справочные материалы.
Что такое HTML-код
Код — это команды браузеру, как следует отобразить страницу. Есть структура, которая должна соблюдаться всегда. Например, наличие только одного заголовка H1 на странице, основная информация помещается в раздели т. д.
В языке есть три инструмента.
- Тег — это команда. Она указывает непосредственно на действие. Например,
- — перенести текст на новую строку.
-
— начать новый абзац.
- — поместить текст в начало страницы.
- — здесь тег указывает на то, что в текст вставляется ссылка, а атрибут href — указывает адрес линка.
- — возвращаясь к этому примеру, “semantica.in” — это значение атрибута.
Теги бывают двух видов — парные и одиночные.
-
.
— парный тег, открывающий и закрывающий. Они действуют на текст, помещенный между ними.
-
— одиночный тег, он действует на текст, стоящий после него до следующего тега.
Структура HTML-кода на странице
Язык гипертекстовой разметки HTML
Аннотация: Цель лекции: в сжатой форме изложить принципы реализации разметки гипертекстовых документов, реализованных в языке HTML.
Из истории языка
| около 1991 | Тим Бернерс-Ли изобрел World Wide Web, он создал первые Веб-сервер и Веб-браузер и первую версию HTML |
| 1993 | IETF (Internet Engineering Task Force) опубликовал черновик предложения по стандарту HTML |
| 1995 | Разработана версия 2.0 языка HTML |
| 1997 | Консорциум W3C опубликовал версию HTML 4.0 в качестве рекомендации, которая включила дополнительные специальные расширения браузеров. |
| 1999 | Опубликована версия HTML 4.01 |
| 2000 | Консорциум W3C опубликовал спецификацию XHTML 1.0, которая была реструктуризацией HTML, чтобы сделать его действительным документом XML |
| В настоящее время | Готовится черновик версии HTML 5 |
Структура документа HTML
Документ HTML 4 состоит из трёх частей:
- строка, содержащая информацию о версии HTML,
- объявляющий раздел header/»шапка» (ограниченный элементом HEAD ),
- тело, содержащее собственно сам документ.
Тело может содержаться в элементах BODY или FRAMESET . Пробельные символы (пробелы, символы новой строки, символы табуляции и комментарии) могут появляться до или после этого раздела.
Simple page
Hello world!
Документ начинается с элемента типа документа, или doctype . Он описывает, какой тип HTML будет использован — чтобы клиентское приложение пользователя могло определить, как интерпретировать документ, и решить, следует ли он тем правилам, которым собирался следовать по своему заявлению.
После этого можно видеть открывающей тег элемента html . Это оболочка вокруг всего документа. Закрывающий тег html является последним объектом в любом документе HTML .
Внутри элемента html имеется элемент head . Он содержит информацию о документе ( метаданные ). Внутри head находится элемент title , который определяет заголовок «Simple page» в панели меню .
После элемента head следует элемент body , который является оболочкой, содержащей реальное содержимое страницы — в данном случае только элемент заголовка первого уровня ( h1 ), который содержит текст «Hello world!» .
Элементы часто содержат другие элементы. Тело документа всегда будет содержать множество вложенных друг в друга элементов.
Разделы страницы создают общую структуру документа, и могут содержать подразделы. Они также могут содержать заголовки , параграфы, списки и т.д. Параграфы могут содержать элементы, которые создают ссылки на другие элементы, цитаты, выделения и т.д.
Синтаксис элементов HTML
Базовый элемент в HTML состоит из двух тэгов вокруг блока текста. Существуют элементы, которые не являются оболочкой для текста, и почти в каждом случае элементы могут содержать подэлементы (как html содержит head и body в примере выше).
Элементы могут также иметь атрибуты, которые могут модифицировать поведение элемента и вводить дополнительное значение .
Основы HTML
В этом примере элемент div (раздел страницы, способ разбиения документов на логические блоки) имеет добавленный атрибут id , для которого задано значение masthead . Элемент div содержит элемент h1 (заголовок первого, или самого важного уровня), который в свою очередь содержит некоторый текст. Часть этого текста упакована в элемент abbr (который используется для определения расширения сокращений), который имеет атрибут title , значение которого задано как Hypertext Markup Language.
Многие атрибуты в HTML являются общими для всех элементов, но некоторые являются специфическими для данного элемента или элементов. Все они имеют форму: ключевое_слово=»значение» . Значение должно быть помещено в одиночные или двойные кавычки (в некоторых ситуациях кавычки могут отсутствовать, но это не слишком хорошо с точки зрения предсказуемости, понимания).
Атрибуты и их возможные значения определяются в основном спецификациями HTML (http://www.w3.org/TR/html401/index/attributes.html), поэтому — нельзя создавать свои собственные атрибуты. Единственными реальными исключениями являются атрибуты id и class , значения полностью которых предназначены для добавления в документы вашего собственного значения и семантики.
Элемент внутри другого элемента называют «потомком» этого элемента. В примере выше abbr является потомком h1 , который в свою очередь является потомком div . И наоборот, div является «предком» элемента h1 .
Элементы блочного уровня и строковые элементы
Имеется две основные категории элементов в HTML , которые соответствуют типам контента и структуре, которую представляют эти элементы — элементы блочного уровня и строковые элементы.
Блочный уровень означает более высокий уровень элемента, обычно информирующий о структуре документа. Элементы блочного уровня можно представлять как элементы, которые начинаются с новой строки, отрываясь от того, что было перед этим. Распространенными блочными элементами являются параграфы, пункты списка, заголовки и таблицы.
Строковые элементы содержатся внутри структурных элементов блочного уровня и охватывают только части текста документа, а не целые области. Строковый элемент не приводит к появлению в документе новой строки, т.к. они являются элементами, которые появляются в параграфе текста. Распространенными строковыми элементами являются гипертекстовые ссылки, выделенные слова или фразы и краткие цитаты.
Это заголовок . .
Еще одной функцией заголовка HTML -документа является управление HTTP -обменом через элемент разметки META . При современной практике размещения Веб-узлов компаний на серверах провайдеров администраторы этих узлов могут не иметь возможности управлять программой-сервером. В этом случае для управления обменом остается только одна возможность — через заголовок HTML -документа.
Основные теги заголовка — это элементы HTML -разметки, которые наиболее часто встречаются в заголовке HTML -документа, т.е. внутри элемента разметки HEAD :
- TITLE (заглавие документа);
- BASE (база URL);
- ISINDEX (поисковый шаблон);
- META (метаинформация);
- LINK (общие ссылки);
- STYLE (описатели стилей);
- SCRIPT (сценарии).
Чаще всего применяются элементы TITLE , SCRIPT , STYLE . Использование элемента META говорит об осведомленности автора о правилах индексирования документов в поисковых системах и возможности управления HTTP -обменом данными. BASE и ISINDEX в последнее время практически не применяются. LINK указывают только при использовании внешних относительно данного документа описателей таблиц стилей.
Элемент разметки HEAD содержит заголовок HTML -документа. Данный элемент разметки не является обязательным. При наличии тега начала элемента разметки желательно использовать и тег конца элемента разметки. По умолчанию элемент HEAD закрывается, если встречается либо тег начала контейнера BODY , либо тег начала контейнера FRAMESET .
Контейнер заголовка служит для размещения информации, относящейся ко всему документу в целом.
Элемент разметки TITLE служит для именования документа в World Wide Web . При выборе текста для содержания контейнера TITLE следует учитывать, что отображается он системным шрифтом, так как является заголовком окна браузера.
Синтаксис контейнера TITLE в общем виде выглядит следующим образом:
название документа
Элемент разметки BASE служит для определения базового URL для гипертекстовых ссылок документа, заданных в неполной (частичной) форме. Кроме того, BASE позволяет определить целевое окно загрузки документа по умолчанию при выборе гипертекстовой ссылки текущего документа. Наиболее часто BASE встречается на страницах узлов, которые имеют «зеркала». Часть документов основного сервера по разным причинам на «зеркальный» сервер не переносится. В этом случае документ с принудительно заданным базовым URL всегда будет ссылаться на основной сервер .
Тег начала контейнера содержит один обязательный атрибут HREF , и может содержать один необязательный атрибут TARGET . Синтаксис контейнера BASE в общем виде выглядит следующим образом:
Элемент разметки ISINDEX используется для указания поискового шаблона и унаследован от ранних версий HTML . В HTML 4.0 этот контейнер не определен.
Источник: intuit.ru