Урок 1. HTML

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

Для того чтобы научиться писать простейшие сайты, никаких особых навыков и сред разработки не нужно. Для написания простого сайта достаточно текстового документа, который нужно сохранить с расширением html и всё, сайт готов.

Например, если создать в блокноте пустой текстовый документ, добавить туда текст “Урок 1” и сохранить документ как “Урок 1.html”, то это будет готовый простейший сайт. Это легко можно проверить открыв его в браузере.

Браузер - это программа, которая помогает просматривать интернет страницы. Браузеры бывают разные, но смысл и принципы их работы одинаковы.

Рисунок 1. - Фрагмент интернет страницы с текстом “Урок 1”.

Для того чтобы придать тексту различную функциональность и эффекты, нужно его разметить специальным образом. Это и делается с помощью языка HTML.

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

Все теги можно разделить на две большие группы: одиночные и парные. Парные теги состоят из двух - открывающий и закрывающий тег. Закрывающий тэг содержит символ /. Пример закрывающего тега:

<p>Это пример парного тега</p>

Как вы видите тег <p> имеет пару: закрывающий тег </p>. Парными тегами обычно выделяют часть текста, которую нужно оформить. Есть и такие элементы, которые итак являются одиночными. Например, разделительная полоса или изображение. Для них достаточно одиночного тэга, парный не нужен.

И ещё один момент, как и во многих других языках программирования, иногда требуется писать комментарии, здесь они будут следующего вида:

<!-- это комментарий-->

Теги могут быть вложены друг в друга. Например, так:

<p>Урок 1:<strong>Привет, мир!</strong></p>

Здесь в тег <p> - параграф, вложен тег <strong> - полужирного шрифта. И тот текст, который обрамляет тег <strong> будет полужирным.

Если открыть этот документ в браузере, увидим:

Рисунок 2. Вложенные теги.

Запомнить:

  • Теги - это как кирпичики в построении сайтов на языке HTML
  • Теги бывают парные и тогда они имеют свою пару с символом слэша и бывают одиночные и тогда они не требуют закрывающей пары
  • Теги могут быть вложены друг в друга

Предыдущий урок

Следующий урок