Разработка сайтов 2024
Об уроке

Введение

Что такое HTML?

HTML (HyperText Markup Language) — это язык разметки гипертекста, используемый для создания структуры веб-страниц. Он не является языком программирования, потому что:

  • Не может программировать действия или принимать решения.
  • Не выполняет расчёты или не реагирует на действия пользователя, как это делают языки программирования.
  • HTML — это инструкция для оформления страницы, а не инструмент для создания интерактивных программ.

Что такое язык программирования?

Язык программирования — это формализованная система команд и инструкций, используемая для написания компьютерных программ, то есть последовательностей команд, предназначенных для выполнения определённых задач компьютером.

Основные критерии для определения языка программирования:

  1. Синтаксис и семантика:
    • Синтаксис — правила и структура языка, определяющие, как правильно записывать код.
    • Семантика — смысл и последствия команд, определяющие, что будет выполнено.
  2. Типизация:
    • Статическая типизация — тип переменных определяется во время компиляции.
    • Динамическая типизация — тип переменных определяется во время выполнения.
  3. Парадигма программирования:
    • Процедурное, объектно-ориентированное, функциональное программирование и т.д.
  4. Компиляция и интерпретация:
    • Компиляция — код преобразуется в машинный код.
    • Интерпретация — каждая строка кода преобразуется и выполняется по мере чтения.
  5. Уровень абстракции:
    • Языки более высокого уровня предоставляют абстрактные средства для описания операций.
    • Языки более низкого уровня требуют детального управления ресурсами компьютера.

Основы HTML

Что такое HTML?

HTML представляет собой стандартный язык разметки, используемый для создания и оформления веб-страниц. Он определяет структуру и содержание веб-страницы с помощью тегов и атрибутов.

Основные теги HTML

  1. <!DOCTYPE html> — Определяет тип документа и версию HTML.
  2. <html> — Корневой элемент HTML-документа.
  3. <head> — Содержит метаданные (информация о документе, заголовки, ссылки на стили, скрипты и т.д.).
    • <title> — Определяет заголовок страницы, отображаемый в заголовке браузера.
    • <meta> — Определяет метаданные, такие как кодировка, описание страницы и т.д.
  4. <body> — Содержит содержимое страницы, отображаемое в браузере.
    • <h1> — <h6> — Заголовки разного уровня.
    • <p> — Параграф.
    • <a> — Гиперссылка.
    • <img> — Изображение.
    • <ul>, <ol>, <li> — Списки (нумерованные и маркированные).
    • <div> — Блочный элемент, используемый для группировки других элементов.
    • <span> — Строчный элемент, используемый для группировки текста.

HTML и его дополнение с помощью JavaScript и PHP

  1. JavaScript:

    • Используется на стороне клиента (в браузере пользователя).
    • Позволяет добавлять интерактивность на веб-страницы.
    • Примеры: создание кнопок, динамическое изменение содержимого страницы без её перезагрузки.
  2. PHP:

    • Работает на стороне сервера.
    • Используется для обработки данных, отправленных на сервер.
    • Может обращаться к базе данных, сохранять или извлекать информацию, отправлять данные обратно на веб-страницу.

Структура HTML-документа

<!DOCTYPE html>
<html>
<head>
<title>Пример HTML-документа</title>
<meta charset="UTF-8">
</head>
<body>
<h1>Заголовок страницы</h1>
<p>Это пример параграфа.</p>
<a href="https://example.com">Пример ссылки</a>
<img src="image.jpg" alt="Пример изображения">
<ul>
<li>Элемент списка 1</li>
<li>Элемент списка 2</li>
</ul>
</body>
</html>

Заключение

HTML — это фундаментальный язык для создания веб-страниц. Понимание его структуры и основных тегов важно для любого веб-разработчика. В следующих уроках мы углубимся в использование CSS для стилизации страниц и JavaScript для добавления интерактивности.