HTML — это язык разметки, который служит основой Всемирной паутины.
HTML — одна из трех основных технологий Интернета.
Это язык разметки, который служит основой Всемирной паутины и дает вам хорошую основу для других языков, таких как CSS и JavaScript.
Давайте более подробно рассмотрим HTML, изучим, как он работает, и обсудим, для чего он используется.
Что такое HTML?
HTML означает язык гипертекстовой разметки. Он был создан английским ученым-компьютерщиком Тимом Бернерсом-Ли , наиболее известным как изобретатель Всемирной паутины.
В 1989 году он написал меморандум, описывающий его идею гипертекстовой интернет-системы, а в 1991 году опубликовал документ под названием «HTML-теги». В этом документе Тим Бернерс-Ли описал первые 18 тегов HTML.
С тех пор HTML
- HTML2 был опубликован 24 ноября 1995 года.
- HTML3 был опубликован 14 января 1997 года в качестве рекомендации Консорциума World Wide Web*.
- HTML4 был опубликован 18 декабря 1997 года по рекомендации Консорциума World Wide Web.
- HTML5 , текущая версия HTML, была опубликована 28 октября 2014 года в качестве рекомендации Консорциума World Wide Web.
* Консорциум World Wide Web , также известный как W3C, — это организация, устанавливающая международные стандарты для World Wide Web.
Кроме того, с момента появления HTML в 1991 году еще две технологии стали неотъемлемой частью всемирной паутины: каскадные таблицы стилей (CSS) и JavaScript (JS).
HTML используется на 94,5% всех веб-сайтов, CSS — на 96,9% , а JavaScript — на 97,9% всех веб-сайтов.
Вот как эти три технологии работают вместе, чтобы создать Интернет, каким мы его знаем:
- HTML — это язык гипертекстовой разметки, используемый для создания и форматирования содержимого веб-страниц.
- CSS — это язык таблиц стилей, используемый для стилизации содержимого веб-страниц.
- JavaScript — это язык сценариев, используемый для добавления динамических и интерактивных элементов на веб-страницы.
Из этих трех языков HTML является основным. На самом деле, вы можете создать веб-сайт только на HTML, без каких-либо CSS или JavaScript, хотя это будет вероятно не просто.
HTML против HTML5: в чем разница?
HTML означает язык гипертекстовой разметки. Он используется в веб-разработке с каскадными таблицами стилей (CSS) и JavaScript (JS).
HTML5 — это текущая версия HTML, считающаяся стандартом в веб-разработке.
Как работает HTML
Теперь, когда вы понимаете, что такое HTML, давайте подробнее рассмотрим, как он работает.
HTML-элементы
HTML-элементы — это отдельные компоненты HTML-документа, обозначаемые HTML-тегами .
Например:
<p> Это абзац. </p>
Теги HTML и атрибуты HTML
HTML-теги
Теги используются для обозначения начала и конца элементов HTML. Вы можете распознать теги по разделителям, также известным как угловые скобки «<>» и «</>» — первый обозначает открывающий тег, а последний обозначает закрывающий тег.
HTML-атрибуты
Атрибуты используются для предоставления дополнительной информации об элементах HTML.
Например:
<p> … </p> — это тег HTML, используемый для обозначения абзаца.
Вы можете использовать атрибут стиля, чтобы предоставить дополнительную информацию об этом элементе HTML.
<p style=»color: blue;»> Это абзац. </p>
Популярные HTML-теги
Все теги HTML имеют одинаковую структуру:
- <tagname> обозначает открытие тега.
- </tagname> обозначает закрытие тега.
Вот некоторые из наиболее часто используемых тегов HTML :
- <HTML> … </HTML> обозначает начало и конец HTML-документа. Все HTML-страницы должны включать этот тег.
- <HEAD> … </HEAD> обозначает раздел заголовка HTML-документа, который содержит метаинформацию. Он может включать тег заголовка, метатеги, CSS и многое другое. Обратите внимание, что это не то же самое, что тег <HEADER>!
- <TITLE> … </TITLE> обозначает заголовок страницы. Он будет отображаться в веб-браузере.
- <BODY> … </BODY> обозначает основной раздел HTML-документа, который содержит содержимое этой HTML-страницы.
- <H1> … </H1> обозначает заголовок первого уровня. Заголовки варьируются от уровня один (самый большой) до уровня 6 (самый маленький). Вы можете изменить номер в этом теге в зависимости от того, какой тип заголовка вы хотите использовать.
- <P> … </P> обозначает абзац.
- <BR> обозначает разрыв строки.
- <AHREF=»HTTPS://WEBFLOW.COM»> . . . </A> обозначает ссылку.
- <DL> … </DL> обозначает список определений.
- <IMG SRC=»IMAGE.JPG»> обозначает встроенное изображение.
- <B> … </B> обозначает полужирный текст.
- <I> … </I> обозначает текст, выделенный курсивом.
- <TABLE> … </TABLE> обозначает таблицу.
Вот видео об использовании тегов в Webflow, чтобы ускорить процесс веб-дизайна.https://www.youtube.com/embed/1HlU4tjxsQI
Какая связь между HTML и CSS?
Вы можете стилизовать содержимое веб-страниц, используя только HTML. Однако, если вы попытаетесь сделать это, вы быстро обнаружите, что такой подход может быть невероятно утомительным. Это связано с тем, что вам необходимо вручную добавить нужные атрибуты к каждому элементу HTML.
Допустим, вы хотите, чтобы текст был определенного цвета. Вам нужно будет установить цвет шрифта для каждого абзаца, используя атрибут стиля. Можете ли вы представить себе, что вы просматриваете статью из 2000+ слов и вручную устанавливаете цвет шрифта для каждого абзаца? А затем сделать то же самое для всех статей на вашем сайте? Какой кошмар!
К счастью, сейчас не 1995 год, поэтому вместо этого вы можете использовать каскадные таблицы стилей (CSS). CSS позволяет вам создать внешнюю таблицу стилей, которая будет служить руководством по стилю для всех элементов HTML на вашем веб-сайте.
Затем вы можете добавить эту таблицу стилей в каждый HTML-документ, используя этот HTML-код:
<!DOCTYPE html>
<html>
<head>
<link rel=»stylesheet» href=»mystyle.css»>
</head>
Это говорит веб-браузеру использовать информацию из таблицы стилей при отображении содержимого этой веб-страницы. Таким образом, вам нужно будет описать каждый элемент только один раз, вместо того, чтобы делать это каждый раз, когда вы сталкиваетесь с ним.
Вы можете установить цвет шрифта абзаца во внешней таблице стилей, которую вы будете использовать для всех тегов <p> на своем веб-сайте.https://www.youtube.com/embed/w-kBRUXsuSQ
Когда используется HTML?
Как уже упоминалось, HTML используется на 94,5% всех веб-сайтов — это означает, что он служит основой практически для всего, что вы видите в Интернете.
Вы можете использовать его для создания:
- Персональные сайты
- Сайты-портфолио
- Бизнес-сайты
- И многое другое
Посетите самые популярные веб- сайты HTML нашего сообщества, чтобы увидеть, что возможно.
Каковы основные преимущества HTML?
Вот некоторые из основных преимуществ HTML:
- Его легко освоить : HTML — это отправная точка для изучения веб-разработки. К счастью, этот язык легко освоить, даже если вы никогда не программировали.
- Он хорошо поддерживается : HTML является одной из трех основных веб-технологий, а это означает, что вы можете найти соответствующее руководство по HTML для всего, что вы хотите сделать с ним.
- Он универсален : HTML используется для создания веб-сайтов, а также для разработки веб-приложений и мобильных приложений. Вы не сможете сделать последнее, используя только HTML, но как только вы добавите в смесь CSS и JavaScript, все будет готово.
HTML является основой для веб-разработчиков и дизайнеров.
Изучение HTML невероятно полезно, если вы веб-разработчик — даже если вы используете конструкторы такие как Tilda или Webflow для создания своих сайтов.
Когда вы изучите HTML, вы сможете понять, как создаются веб-сайты и, что более важно, как элементы веб-сайтов взаимодействуют друг с другом.