Заголовок моей первой страницы (во вкладке браузера)

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

  .

• Потомок. Потомком называют элемент вложенный в другой. То есть — потомок , а потомок .
• Родительский элемент. Родительским элементом называют тег который связан с другими тегами более низкого уровня, и находится на дереве выше их. является родителем только для тегов и .
• Дочерний элемент. Дочерним называют тег который который вложен в тег более высокого уровня, то есть противоположность родительскому элементу. На рисунке тег является дочерним элементом тега .
• Сестринский элемент. Сестринским элементом называют тег имеющий один и тот же родительский тег. То есть, теги и на рисунке — сестринские элементы, так же как и теги с

  .

Тут все довольно просто. Это нужно запомнить и знать. Теперь вы знаете основы HTML.

Расшифровка и перевод тегов

Когда я начинал изучать HTML, я задавался вопросом: как запомнить теги? Самым простым вариантом для меня стал перевод тегов. То есть, каждый HTML-тег это означает что-то на английском языке или это сокращение какого-то английского слова. Давайте разберемся с тегами которые уже нам известны.

Тег	Значение	Перевод
	Hyper Text Markup Language	Язык гипертекстовой разметки
	Head	Голова (документа)
	Body	Тело (документа)
	Title	Название, заголовок
	Heading 1…6	Заголовок с 1 по 6 уровень
	Paragraph	Параграф
	Link	Ссылка
	Style	Стиль

Как это работает?

Теперь у вас есть общее понимание о том, что такое HTML. Возникает вопрос, а как это вообще работает?

Работает это так. Мы пишем HTML-код и сохраняем его с расширением HTML. Наша операционная система (Windows или Linux) понимает что файл с таким расширением нужно открывать при помощи браузера.

Браузер открывает файл и читает (интерпретирует) наш код в виде дерева (DOM) в соответствии с определенными правилами.

После того как браузер «прочитал» и интерпретировал наш код он отображает его нам в привычном виде — в виде текста, таблиц, изображений, ссылок, списков и других элементов.

Элемент DOCTYPE

В конце об элементе DOCTYPE. Почему в конце, а не в начале? В самоучителе для начинающих я не придаю этому тегу особое значение, не не могу не упомянуть о нем.

DOCTYPE задает тип документа. Обычно это html. Указывать тип документа нужно в самом его начале.

      
Заголовок страницы в браузере
 
Любой тест, обычно это Hello World!
  

При помощи этого тега мы даем понять браузеру что мы используем именно HTML код. Возникает вопрос, а что, в HTML-документе может быть другой код? Вообще да, документ может быть XML, но пока об этом думать рано. Нужно знать следующее.

Тип документа зависит от того, какие теги в нем используются и есть три типа синтаксиса. Если вы используете все новые теги, то есть теги HTML5 (на момент написания статьи) то достаточно указать .

Для строгого типа указываем:

Более старые версии HTML сейчас практически не используются.

На этом все, теперь вы знаете основы HTML.

Обучаю HTML, CSS, PHP. Создаю и продвигаю сайты, скрипты и программы. Занимаюсь информационной безопасностью. Рассмотрю различные виды сотрудничества.

Источник

Html разметки гипертекста стандартизированный язык разметки документов во всемирной паутине

HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML).

Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства.

Язык HTML до 5-й версии определялся как приложение SGML (стандартного обобщённого языка разметки по стандарту ISO 8879). Спецификации HTML5 формулируются в терминах DOM (объектной модели документа).

Язык XHTML является более строгим вариантом HTML, он следует синтаксису XML и является приложением языка XML в области разметки гипертекста. Во всемирной паутине HTML-страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS, в виде простого текста или с использованием шифрования.

Тег это базовый элемент языка HTML. То есть HTML состоит именно из тегов и для того чтобы учить HTML, достаточно изучить основные теги, которые чаще всего используются. Если сравнивать с примером из реальной жизни, то тег в HTML — это как кирпич для дома. Кирпич это основной элемент, который используется для строительства дома. То же самое и в HTML, тег это базовый элемент для создания html страницы. С помощью тега мы указываем браузеру, как правильно отобразить содержание html страницы. Тег – это символ разметки, имеющий имя и атрибут. Имя — это строка, состоящая из букв, цифр, строчек и тире (не более 72 символов) Атрибут – это конструкция вида: имя атрибута = значение. Теги пишутся в треугольных скобках &lt…..>

Существует два типа тегов это парные теги и одинарные теги:
• Парные теги это теги, которые состоит из открывающего тега и закрывающего тега. По короче это теги, которые имеют закрывающего тега.
Примеры: &lthtml> и &lt/html>; &lttitle> и &lt/title>; &lthead> и &lthead>; &ltbody> и &lt/body>; &ltp> и &lt/p>;
• Одинарные теги это теги, которые не имею закрывающего тега.
Примеры одинарных тегов: &ltbr/>. &lthr/>

У html страницы есть базовая структура. Базовая структура на всех страницах сайта, выглядит одинаково. Единственное что может отличаться в базовой структуре страниц от сайта к сайту, это элемент DOCTYPE.
Вот как выглядит базовый каркас html страницы:

В начале страницы, перед тегом html всегда указываем DOCTYPE, то есть тип документа. Каждая html страница начинается с тега &lthtml> и заканчивается тегом &lt/html> и состоит из заголовка &lthead>&lt/head> и тела &ltbody>&lt/body>. Внутри заголовка пишется служебные элементы, которые не отображаются на странице в браузере. В основном это:
• Мета теги. Главные из них это мета-тег кодировки, через которого указываем кодировку страницы (&ltmeta http-equiv=»Content-type» content=»text/html; charset=utf-8″/>), мета теги для поисковых систем, это мета-тег c описанием страницы (description) и ключевые слова для страницы (keywords).
• Заголовок страницы, который указывается внутри тега &lttitle>&lt/title>. Этот заголовок отображается во вкладке браузера.
• Блок с внутренними стилями. &ltstyle type=”text/css”> Внутренние стили. &lt/style>
• Одинарный тег &ltlink/>, через которого подключаем внешние файлы.
• А также блок &ltscriptsrc=»https://tct.ru/upload/elekt_uchebnik/HTMLCSS/data/library.js» type=»text/javascript»> &lt/script> в котором пишутся различные скрипты JavaScript.

Внутри тега &ltbody>&lt/body> пишется контент страницы. Контент может содержать текст, изображения, таблицы, списки, ссылки и другие элементы которые отображаются на странице в браузере. Имена тегов можно писать в любом регистре, то есть если напишем &ltBODY>, &ltbOdY>,&ltBody> или &ltbody>, то результат будет один и тот же, но рекомендуется всегда писать в нижнем регистре, то есть &ltbody>.

Когда Вы пишете любой текст на странице, будь это просто абзац или небольшая поясняющая строка под изображением, необходимо этот текст помещать внутрь тега &ltp> &lt/p>.

Моя первая HTML страница
Напечатайте следующий текст:
&lthtml>
&lthead>
&lttitle>Это заголовок страницы&lt/title>
&lt/head>
&ltbody>
&lth1>Здравствуйте!&lt/h1>
&ltp>Это моя первая страница HTML. &ltb>Этот текст выводится жирным шрифтом.&lt/b>&lt/p>
&lt/body>
&lt/html>
Сохраните файл в своей собственной папке под именем page1.html

Коротко об элементах HTML

&lthtml>
&lthead>
&lttitle>Это заголовок страницы&lt/title>
&lt/head>
&ltbody>
&lth1>Здравствуйте!&lt/h1>
&ltp>Это моя первая страница HTML.
&ltb>Этот текст выводится жирным шрифтом.&lt/b>&lt/p>
&lt/body>
&lt/html>

Сохраните файл под именем page2.html

&lthtml>
&ltbody>
&ltp>Это параграф 1.&lt/p>
&ltp>Это параграф 2.&lt/p>
&ltp>Это параграф 3.&lt/p>
&lt/body>
&lt/html>

Сохраните файл под именем 3p.html

Источник

HTML

HTML (от англ. HyperText Markup Language — язык гипертекстовой разметки) — стандартизированный язык разметки документов во Всемирной паутине. Большинство Web — страниц содержат описание разметки на языке HTML (или XHTML ). Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства.

XHTML

Язык XHTML является более строгим вариантом HTML , он следует синтаксису XML и является приложением языка XML в области разметки гипертекста.

Во всемирной паутине HTML — страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS , в виде простого текста или с использованием шифрования.

Общее представление

Язык гипертекстовой разметки HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в стенах ЦЕРНа в Женеве в Швейцарии . HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов. Дескрипторы также часто называют тегами . С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.

Первым общедоступным описанием HTML был документ Теги HTML , впервые упомянутый в Интернете Тимом Бернерсом-Ли в конце 1991 года . В нём описываются 18 элементов , составляющих первоначальный, относительно простой дизайн HTML . За исключением тега гиперссылки, на них сильно повлиял SGMLguid , внутренний формат документации, основанный на стандартном обобщенном языке разметки (SGML ), в CERN . Одиннадцать из этих элементов всё ещё существуют в HTML 4 .

Браузеры

Текстовые документы, содержащие разметку на языке HTML (такие документы традиционно имеют расширение .html или .htm ), обрабатываются специальными приложениями, которые отображают документ в его форматированном виде. Такие приложения, называемые Web -браузерами или интернет-обозревателями , обычно предоставляют пользователю удобный интерфейс для запроса Web -страниц, их просмотра (и вывода на иные внешние устройства) и, при необходимости, отправки введённых пользователем данных на сервер. Наиболее популярными на сегодняшний день браузерами являются Google Chrome, Mozilla Firefox, Opera, Internet Explorer и Safari .

Версии HTML

Версии HTML	Дата опубликования
HTML 2.0	Опубликован IETF как RFC 1866 в статусе Proposed Standard (24 ноября 1995 года)
HTML 3.0	28 марта 1995 года — IETF Internet Draft (до 28 сентября 1995 года)
HTML 3.2	14 января 1997 года
HTML 4.0	18 декабря 1997 года
HTML 4.01	24 декабря 1999 года
ISO/IEC 15445:2000	Так называемый ISO HTML, основан на HTML 4.01 Strict — 15 мая 2000 года
HTML5	28 октября 2014 года
HTML 5.1	Начал разрабатываться 17 декабря 2012 года . Рекомендован к применению с 1 ноября 2016 года
HTML 5.2	Был представлен 14 декабря 2017 года
HTML 5.3	Был представлен 24 декабря 2018 года

Официальной спецификации HTML 1.0 не существует. До 1995 года существовало множество неофициальных стандартов HTML . Чтобы стандартная версия отличалась от них, ей сразу присвоили второй номер.

С основными понятиями HTML мы ознакомились , сейчас можно приступить к созданию простых HTML – страниц , для их написания нам нужен текстовый редактор и Web – браузер для просмотра наших написанных страниц .

Источник