Учим HTML - основу веб-разработки [#1] HTML - HyperText Markup Language или просто язык разметки. Неправильно этот язык называть языком программирования, он таковым не является. Для начала давайте разберемся, зачем вообще он нужен в вебе? Самый простой сайт (обычный, информационный), который не содержит никакого функционала обычно пишется на трёх языках - html, css, javascript (Про функциональность поговорим в следующих статьях, для начала разберемся в самом простом) Итак, за что отвечает каждый из языков: CSS - дизайн сайта, то есть это цвета, рамки, расположение элементов на странице и тд. С помощью CSS можно указать размеры различных блоков на вашем сайте. JavaScript - динамика сайта. То есть если вы напишите сайт только на html и css он будет статическим (ничего двигаться на странице не будет). Если вы добавляете скрипты на Javascript, то сайт становится визуально приятнее и воспринимается легче. То есть например вы создали интернет-магазин. С помощью джаваскрипта можно сделать анимацию добавления товара в корзину - как будто картинка летит в корзину. И наконец HTML - помогает сверстать страницу, то есть расположить логические блоки сайта так как надо. (Например меню сайта сверху, основной информационный блок ровно под меню, колонка с новостями правее и тд.) Приведу пример последовательной разработки сайта: Пишется структура сайта на html (Создаются разные блоки) Затем с помощью CSS вы эти блоки украшаете. Ну и наконец делаете динамику с помощью JavaScript. Теперь перейдем конкретно к HTML (если до этого этапа что-либо не понятно - не волнуйтесь, в процессе последовательного изучения всё встанет на свои места) Структура пустой html-страницы: Разберём по порядку: Базовым элементом в html является тэг. Тэги бывают как двойными, так и одинарными. Двойные теги - имеют открывающий и закрывающий теги То есть например: <html> - открывающий тег </html> - закрывающий тег Тут html - название тега. Как понять, каким является тег - открывающим или закрывающим? В закрывающих тегах перед их названием обязательно ставится наклонный слеш. Таким образом в нашем примере 4 тега: <html>, <head>, <title>, <body> Каждый из них имеет закрывающий тег. Вообще структуру html-кода стоит рассматривать как капусту. Теги вкладываются в теги То есть например всё что находится между тегами <html> и </html> является их содержимым. Для тегов <head> и </head> содержимым является всё, что между ними (Тег <title>) У каждой страницы есть тег <title> - внутри него пишется название страницы, которое будет отображаться в названии вкладке Вот например в коде этого сайта внутри тега title написано Telegraph Обычно в теге <head> пишется техническая информация о сайте, которая почти нигде не отображается. Всё содержимое сайта, которое увидит пользователь располагается внутри тега <body> Думаю, для первого (или далеко не первого) знакомства с вебом достаточно. Не буду сильно перегружать вас. Если есть желание поизучать структуры html-страниц различных сайтов - прямо на нужном сайте можно нажать правой кнопкой мыши и выбрать "просмотр кода страницы". Откроется новая вкладка, вы там сможете увидеть кучу кода, но попытайтесь на таких страницах найти теги, которые мы уже разобрали и убедитесь что внутри них находится именно то, что и должно быть.