Друзья, небольшое отступление - это будет первая статья из раздела программирования, в основном у нас походная тематика, ну посмотрим, если тематика HTML будет в "тренде", буду выпускать попутно и статьи по программированию - нет, значит только походная тематика.
HTML расшифровывается как Hyper Text Markup Language, т.е. язык гипертекстовой разметки — основной строительный блок веб-страниц, используется для создания и визуального представления веб-станиц.
Создание HTML-файла
Для того, чтобы создать HTML документ необходимо:
- Открыть любой текстовый редактор (например блокнот);
- Набрать произвольный текст и разметить его HTML тегами;
- Cохранить файл с расширением .html.
Пример простейшего HTML-файла
<!DOCTYPE html>
<html>
<head>
<title>Заголовок страницы</title> </head>
<body>
<h1>Это заголовок</h1>
<p>Это параграф.</p>
</body>
</html>
Далее просто сохраняете файл, и не закрывая блокнот (а просто сворачивая его), открываете наш файл, кликая по нему 2 раза ЛКМ
Теги
Как говорилось ранее, HTML это язык разметки, который использует различные теги для форматирования содержимого документа. Эти теги заключены в угловые скобки <имя тега>. За исключением нескольких тегов, большинство тегов имеют соответствующие им закрывающие теги. Например <html> имеет свой закрывающий тег </html>, а тег <body> в свою очередь, имеет свой закрывающий тег </body> и т.д.
Несколько тегов:
<html> - Этот тег является корневым элементом HTML страницы и заключает в себе весь HTML - документ
<head> - Этот тег содержит мета-информацию о документе и может содержать другие теги, такие как <title>, <link> и т.д.
<title> - Этот тег определяет заголовок веб-страницы, в браузере вы его видите вверху на текущей вкладке.
<meta> - Этот тег предназначен для предоставления структурированных метаданных о веб-странице. В нашем примере определяет кодировку документа.
<body> - Элемент содержит видимое содержимое страницы, который включает в себя другие HTML-теги, например <h1>, <div>, <p> и т.д.
<h1> - Этот тег представляет собой заголовок.
<p> - Этот тег представляет собой абзац.
Раздел HEAD
Раздел HEAD содержит техническую информацию о веб-странице — заголовок, ее описание и ключевые слова для поисковых машин, данные об авторе документа, времени создания страницы, базовом адресе страницы, кодировке документа и т. д. Единственным обязательным тегом в разделе HEAD является тег <title>.
Текст, расположенный между тегами <title> и </title>, отображается в строке заголовка веб-браузера. Длина заголовка должна быть не более 60 символов, иначе он не полностью поместится в заголовке веб-браузера: <title>Заголовок страницы</title>. Попробуем изменить "заголовок страницы" на свой, я изменю на "Статьи от Binokl'я" и посмотрим, что получиться.
С помощью одинарного тега <meta> можно задать описание содержимого веб-страницы, а также ключевые слова для поискового портала. Если текст между тегами <title> и </title> используется в качестве текста ссылки на эту страницу, то описание из тега <meta> будет отображено под ссылкой на веб-страницу:
<meta name="description" content="Описание содержимого страницы">
<meta name="keywords" content="Ключевые слова через запятую">
На этом пока все, про остальные базовые теги и как их использовать будет следующая статья!
Не забудь оценить статью, а также напиши в комментарии и прикрепи скрин, получается ли у тебя создать начало своего сайта! Спасибо за прочтение!