Основы №1

HTML (Hypertext Markup Language) - этo код, который используется для структурирования и отображения веб-страницы и её контента. Например, контент может быть структурирован внутри множества параграфов, маркированных списков или с использованием изображений и таблиц данных.
CSS (Cascading Style Sheets «каскадные таблицы стилей») — формальный язык описания внешнего вида документа (веб-страницы), написанного с использованием языка разметки (чаще всего HTML или XHTML). Также может применяться к любым XML-документам, например, к SVG или XUL.
JavaScript – это язык программирования, который добавляет интерактивность на твой веб-сайт (Отклики при нажатии кнопок (например для форм), анимации и тп, тд).
Примечание что к JS`y можно подключать плагины и библиотеки, которые уже в свою очередь очень сильно облегчают работу

HTML – Скелет, CSS – Внешность, JAVASCRIPT (сокр. JS) – Головной мозг.

С чего нужно начинать писать код?

*Структура с которой начинается написание кода*:


Что такое тег в HTML Вообще? Тег в HTML (HyperText Markup Language) - это ключевое слово, которое используется для определения структуры и содержания веб-страницы. Теги позволяют браузеру интерпретировать различные элементы страницы, такие как текст, изображения, ссылки, таблицы и другие элементы. Теги HTML состоят из двух частей: открывающего тега и закрывающего тега. Открывающий тег указывает на начало элемента, а закрывающий тег - на его конец. Например, тег <p> используется для определения абзаца текста и имеет следующую структуру:
<p>Текст абзаца</p>

Здесь тег <p> - это открывающий тег, который указывает на начало абзаца, а </p> - это закрывающий тег, который указывает на его конец.Некоторые теги не имеют закрывающего тега и называются одиночными тегами. Например, тег <img> используется для вставки изображений на страницу и имеет следующую структуру:
<img src="image.jpg" alt="Описание изображения">

<!DOCTYPE html> — это объявление типа документа, которое используется для указания типа документа, который будет обрабатываться браузером при отображении веб-страницы. Это объявление обычно расположено в самом начале HTML-документа, перед открывающим тегом . В веб-разработке, в том числе и в веб3, использование очень важно, поскольку это помогает браузерам корректно интерпретировать код HTML. Оно определяет, каким образом браузер должен обрабатывать содержимое HTML-документа, и какие правила стандарта HTML должны применяться к его отображению. Если объявление типа документа не указано, браузер может иметь трудности с интерпретацией кода и отображением веб-страницы. В WEB, объявление типа документа <!DOCTYPE html> необходимо для создания веб-страниц, которые соответствуют стандартам HTML5, который является основным стандартом для разработки веб-страниц в настоящее время. Использование этого объявления позволяет гарантировать, что ваш код будет правильно интерпретирован браузером и соответствует последним стандартам веб-разработки.

Тег <html> используется в HTML-документах для указания начала и конца содержимого документа. В веб-разработке, в том числе и в веб3, тег <html> является обязательным элементом, поскольку он определяет начало и конец HTML-документа и все элементы, которые входят в его содержимое, должны быть вложены в этот тег. Тег <html> содержит информацию о языке, на котором написан HTML-документ, а также ссылки на таблицы стилей и скрипты, используемые на странице. Кроме того, внутри тега <html> указываются элементы документа, такие как <head> и <body>, которые содержат информацию о заголовке и теле документа соответственно. В веб3, использование тега <html> необходимо для правильной структурирования веб-страницы и для обеспечения ее корректного отображения в браузере. Тег <html> также позволяет определить кодировку символов документа и указать другие метаданные, такие как автор, описание и ключевые слова страницы, которые помогают поисковым системам более точно определять содержимое страницы и ее релевантность для запросов пользователей. В целом, использование тега <html> является необходимым элементом в веб-разработке и позволяет обеспечить правильную структуру и отображение веб-страницы.

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

В элемент <head> в веб-страницах включаются следующие элементы:

  1. Заголовок страницы (<title>), который отображается в верхней части окна браузера и является одним из основных факторов поисковой оптимизации страницы.
  2. Метатеги (), которые содержат информацию о странице, такую как описание (<meta name="description" content="...">), ключевые слова (<meta name="keywords" content="...">), автор (<meta name="author" content="...">) и другие метатеги.
  3. Ссылки на стили CSS (<link rel="stylesheet" href="...">), скрипты JavaScript (<script src="..."></script>) и другие ресурсы, которые используются для отображения страницы.
  4. Определение кодировки символов (<meta charset="UTF-8">), которая используется для отображения текста на странице.
  5. Определение источника данных (<base href="...">), который используется для определения базового URL-адреса для относительных ссылок на странице.
  6. Метатеги Open Graph (<meta property="og:..." content="...">), которые используются для определения заголовка, описания, изображения и других параметров, которые используются при расшаривании страницы в социальных сетях.
В общем, элемент <head> является важной частью веб-страницы и позволяет разработчикам контролировать отображение и поведение страницы в браузере, что может влиять на ее поисковую оптимизацию, визуальное оформление и функциональность веб-приложений.

Элемент <meta charset="utf-8"> используется для указания кодировки символов, которая используется для отображения текста на веб-странице. Кодировка символов определяет, как браузер должен интерпретировать байты информации, переданные на страницу, и как он должен отображать соответствующие символы на экране. Кодировка utf-8 является одним из наиболее распространенных форматов кодировки символов в интернете и поддерживает большинство языков мира. Указание кодировки символов в элементе <meta charset="utf-8"> является важным шагом для обеспечения правильного отображения текста на веб-странице. Если кодировка символов не указана, браузер может неправильно интерпретировать текст и отображать его с ошибками. Поэтому рекомендуется всегда включать элемент <meta charset="utf-8"> в веб-страницы, чтобы гарантировать правильное отображение текста на любом языке и в любой стране.

Элемент <meta name="viewport" content="width=device-width, initial-scale=1"> используется для определения ширины экрана устройства и начального уровня масштабирования при отображении веб-страницы на мобильных устройствах. Опция width=device-width указывает браузеру, что ширина содержимого страницы должна соответствовать ширине экрана устройства, что позволяет контенту растягиваться или сжиматься под размер экрана. Опция initial-scale=1 указывает, что при первой загрузке страницы должен использоваться начальный уровень масштабирования 1:1, что обеспечивает правильное отображение контента на мобильных устройствах без необходимости увеличения или уменьшения масштаба страницы. Элемент <meta name="viewport"> важен для обеспечения корректного отображения веб-страниц на мобильных устройствах, так как мобильные устройства имеют разные размеры экранов и разные плотности пикселей, которые могут влиять на отображение содержимого. Правильное использование этого элемента помогает сделать веб-страницу более доступной для пользователей мобильных устройств и улучшить их пользовательский опыт.

Элемент <title>Название документа</title> используется для задания заголовка веб-страницы, который отображается в окне браузера и является ее идентификатором. Заголовок страницы, указанный в элементе <title>, используется не только для отображения в окне браузера, но и для отображения в поисковой выдаче, закладках и социальных сетях, когда пользователи делятся ссылкой на страницу. Поэтому важно написать информативный и точный заголовок страницы, который точно передает ее содержание. Кроме того, поисковые системы используют заголовок страницы для оценки ее содержания и понимания, на какие темы она может быть релевантна. Правильно написанный заголовок страницы может улучшить ее поисковую оптимизацию и привлечь больше пользователей из поисковых систем. Поэтому рекомендуется всегда использовать элемент <title> в каждой веб-странице и писать информативный заголовок страницы, который точно передает ее содержание.

<body> - это один из основных тегов языка HTML (HyperText Markup Language), который определяет основное содержимое веб-страницы, которое будет отображаться в браузере. Тег <body> начинается с открывающего тега <body> и заканчивается закрывающим тегом </body>. Внутри тега <body> размещается весь контент страницы, включая текст, изображения, ссылки, таблицы, формы и другие элементы.