«Создание сайтов»: 3 : УРОВЕНЬ 1 : ЯЗЫК HTML: ГРАММАТИКА, СИНТАКСИС и дюжина первых строк
От Музея: а мы продолжаем цикл лекций по основам создания сайтов — для гуманитариев и людей, не обладающих знаниями программистов. И наконец-то переходим к изучению HTML! Лекция Ани Амасовой снова во многом теоретическая, но увлекательная для любителей языков. Плюс небольшая практика в конце.
Текст: Аня Амасова
Иллюстрация: Андрей Коротаев
Вступление
Сегодняшний урок особенно понравится авторам, лингвистам и филологам: мы начнем изучение основ языка html. Словосочетание «язык html» — немножечко тавтология, потому что аббревиатура HTML расшифровывается как HyperText Markup Language. То есть технические специалисты назвали его «Языком Разметки Гипертекста», который представляет собой набор кодов, основанных на базовом английском (раздел «Существительные»).
Мы, гуманитарные люди, понимаем, что вообще-то любой текст и на любом языке является набором кодов для создания мира. Но фантастическая привлекательность именно гипертекстов заключается в том, что в отличие от художественной литературы или журналистики вам не надо ждать пятьдесят лет, десять лет и даже месяц, чтобы увидеть плоды своих трудов в реальности. Все, что вы пишете, созидается сразу, сейчас! В режиме он-лайн. Пусть и в виртуальности, но зато еще при вашей жизни (буквально сегодня) вы увидите результат! По-моему, это заводит.
Итак, вы зарегистрировали доменное имя сайта (лекция 1), вы осознали проект будущего первого сайта — отражения вашей жизни в виртуальной реальности (лекция 2), и получили выделенное место на сервере, где будет размещаться ваш сайт (обе лекции Level 1), и нам не остается ничего иного, как начать понимать простые принципы языка html и приступить к созданию первой — ГЛАВНОЙ — СТРАНИЦЫ.
HTML: правила грамматики
Несмотря на тома словарей и справочников языка — например, «Справочник по HTML» на сайте HTMLBOOK.RU, — как и в любом языке, для того, чтобы начать им пользоваться, совершенно не обязательно изучить весь словарь, — достаточно понимания правил грамматики и нескольких слов.
(Кроме того, доступность информации в современном мире так высока, что, понимая общие принципы, вы всегда сможете найти ответ на любой вопрос, стоит лишь правильно его задать: например, «html объединение ячеек в таблице».)
Язык состоит из набора «слов» — это коды html. Они позволяют отображать на сайте ваш контент, и делать это именно так, как этого хотите вы. Другое их назначение — позволить вам дать описание к странице-документу, которое будет использовано в интернет-пространстве.
Коды html — лексемы языка разметки гипертекста — называются ТЕГАМИ (а те, что важны лишь для Всемирной паутины — метатегами). Разнообразные дополнения и уточнения к ним — АТРИБУТАМИ тегов.
Если сравнивать с русским языком, то тег — это подлежащее, выраженное существительным:
p — ПАРАГРАФ, table — ТАБЛИЦА, img — ИЗОБРАЖЕНИЕ и т. д.
А атрибут — набор уточнений к нему, выраженных через существительное с последующим описанием свойств («значений» или «функций»), приставленных через знак «равно».
Например, запись на языке html:
table align=»center» width=»600″
в переводе на русский звучит так:
ТАБЛИЦА расположение=»центр», ширина=»600 пикселей»
Атрибуты бывают как уникальными (только для конкретного тега), так и повторяющимися (возможными для разных тегов), что значительно упрощает задачу изучения.
Все теги (вместе с их атрибутами) при письме заключаются в угловые скобки:
— так программа определяет, что это именно программный код — разметка вашего контента, а не сам контент. (Именно поэтому я не привожу здесь примеров реальных тегов в угловых скобках: мой сайт, где я пишу этот текст, автоматически воспринимает их как команды и не покажет обычным текстом).
И 95% тегов имеют не только открывающий, но и закрывающий тег — повторение со знаком «/» после первой скобки, что означает «конец фрагмента, к которому применяется это описание». Между этими двумя тегами — открывающим и закрывающим — и размещается ваш контент.
Впрочем, есть коды, которые логичным образом не требуют закрытия. Например, один из таких кодов:
br — РАЗРЫВ СТРОКИ (или «перевод каретки»)
, принудительно переносящий часть вашего текста на следующую строку. Так как никакого текста или элемента между открывающим и закрывающим кодом «РАЗРЫВ СТРОКИ» быть не может, то, следовательно, и закрывающего тега у него нет.
Язык гипертекстовой разметки приятно строг и логичен! Теги могут размещаться внутри других тегов, а внутри них — другие теги. Логика, что надо применить ко всему контенту страницы, что к фрагменту, а что к строке — определяется по порядку закрывающих тегов.
HTML: принцип записи
Иногда начинающих пугает вид страницы с html-кодом, где все теги начинаются с новой строки, теги внутри тегов — имеют отступы, теги третьего уровня — еще большие отступы, и закрывающие теги — стоят на отдельных строчках, вровень с открывающимся тегом. «А-а-а! Сколько клеточек надо отступать?» — спрашивают филологи-перфекционисты, считая такое расположение текста чем-то важным.
Общий вид (фрагмент) файла страницы сайта
Но нет. Для логической машины важна одна лишь последовательность. Вы пишете слева направо последовательность кодов, перемежая их с элементами своего контента, и для программы — а также для мира вашего сайта — в отбивках нет никакого смысла. Мир поймет ваше описание, даже если вы напишете весь текст одной строкой, или будете каждое слово писать с новой строки, или даже разделите все слова в произвольном порядке!
Единственный, кому это надо — это вы. Такое расположение (все эти новые строки и отбивки) имеет визуальное значение для самого создателя. Благодаря отбивкам вы можете отследить: а не забыли ли вы закрыть тег? А где у вас начинается место, куда вы хотите внести исправления? и т.д. — то есть это значительно облегчает вашу навигацию по документу. И только. Единственное, какой бы «принцип записи» вы ни выбрали, я бы рекомендовала для начала новые теги начинать с новой строки. Так действительно удобнее.
Кстати, вот вам еще информация для понимания происходящего: как бы вы ни делили свой собственный текст (текст контента) в файле (и как бы он сам ни делился), как бы ни форматировали путем отточий, «энтеров» и табуляций, — все это решительно никак не повлияет на то, как текст отображается на сайте! Все форматирование происходит либо автоматически (по размеру экрана), либо путем верстки текста через коды — в одной из следующих лекций мы обязательно поговорим об этом.
HTML: «где писать?», кодировка и синтаксис
«Где писать?» — логичный вопрос. Ответ: да хоть в блокноте! Я не шучу: в стандартных программах большинства компьютеров есть такая исключительно текстовая программка «Блокнот». При открытии напоминает простой белый лист с минимумом функций, как у печатной машинки. По-умолчанию, файлы блокнота сохраняются с расширением .txt, но вы можете задать любое расширение, выбрав опцию «все файлы». Как вы помните, нам необходимо расширение .html .
Создание нового файла - главной страницы - в программе «Блокнот»
Что важно в первом варианте:
То, что вы будете создавать у себя на компьютере — вы будете только у себя на компьютере и видеть: файлы будут открываться вашими браузерами. До того момента, пока вы не загрузите свой файл (index.html) или группу файлов и папок на сервер вашего хостинга, ваша работа не будет видна никому, кроме вас. Ах да, файлы с расширением .html автоматически открываются в браузере как страница сайта: для редактирования файла вам необходимо будет настроить его автоматическое открытие в программе «Блокнот», либо каждый раз открывать через выбор.
Однако большинство хостингов предлагает создание файлов прямо на сервере! Это похожие на «Блокнот» программки, но часто — чуточку удобнее. Кроме того, что они могут иметь разлинованное поле и нумерацию строк, частенько они подыгрывают и помогают. Например, при написании тега, который должен непременно закрываться, они могут автоматически подставлять рядом тег закрытия. Или давать подсказки подсветкой, что какой-то тег у вас «повис», оставшись незакрытым, или и вовсе стоит не на месте. Конечно, программа видит не все, но очевидные вещи — да. Также она сама визуально структрирует ваш документ, двигая элементы. Кому-то все это помогает, кому-то, наоборот, мешает — выбирать вам.
Создание нового файла - главной страницы - в программе,
предоставляемой хостингом Beget
если создавать файлы сразу в папке сайта на сервере
Что важно во втором варианте:
Так как вы создаете файлы не на жестком диске своего персонального компьютера, а сразу на сервере хостинга, — все создаваемое вами автоматически располагается во всемирной паутине. Вы можете оперативно консультироваться со своими друзьями, если их участие предусмотрено. Также вы сможете делать тесты — как смотрится эта страница — не только с браузеров, имеющихся на вашем компьютере, но и, к примеру, с телефонов. В этом варианте удобнее редактировать и отражать файлы: при открытии файла с сервера открывается именно файл, а все изменения мгновенно отображаются в интернете, стоит лишь нажать «Сохранить» для файла и «Обновить» для страницы.
Я для показа буду использовать и тот и другой.
Итак, какой бы вариант — «где писать?» — вы ни выбрали, в обоих случаях нам необходимо уже при создании файла сразу задать КОДИРОВКУ ФАЙЛА, т.е. каким символьным набором создана страница. В случае Блокнота кодировка выбирается из списка, расположенного перед кнопкой «сохранить (файл)». В случае программы на хостинге — обычно предлагается собственный список внутри файла. Что брать? При наличии национальной кодировки koi8-r все-таки обычно выбирают из двух более широко распространенных вариантов: utf-8 или windows-1251. Самая оптимальная и интернациональная — и, как говорят интернет-источники, более 95% сайтов во Всемирной паутине пользуются именно ею, — кодировка utf-8. Я тоже предпочитаю ее.
Кроме того, где-то вас могут запросить также прямо при создании файла указать СИНТАКСИС, то есть прояснить для программы, на каком языке вы пишете файл, каким образом ей воспринимать (и соответственно обрабатывать) ваши лексемы. В нашем случае это, разумеется, html.
Созданный новый файл в программе хостинга Beget
и выпадающие списки "Кодировки" и "Синтаксиса",
в которых следует выбрать необходимое
Итак, где-то: либо на вашем компьютере, либо на сервере хостинга, существует папка с вашим доменным именем, а в ней — корневая папка с именем public_html (или www), и в этой корневой папке вы создали файл своей первой главной страницы сайта — index.html, задав файлу верные настройки кодировки (а во втором случае — и синтаксиса).
В учебном примере это (и на моем компьютере, и на сервере хостинга Beget) такая последовательность двух папок и одного файла:
Сам файл при открытии пока девственно чист и ждет ваших первых строчек, которые создадут во Всемирной паутине первый фрагмент созидаемого вами мира.
Созданный новый файл на компьютере в программе "Блокнот"
HTML: структура документа и основные теги
Принцип создания страницы сайта очень похож на создание человека.
Во-первых, у него есть пара тегов — инструкция и корневой тег, — обязательных в начале, чтобы Всемирная паутина поняла, что именно вы создали.
! DOCTYPE html — только, разумеется, в угловых скобках — первая строчка вашего документа. И это просто инструкция (о чем свидетельствует восклицательный знак в начале) для браузеров всемирной паутины, на каком языке и какими технологиями был создан ваш документ и как им следует его читать. Поэтому и закрывающий тег к инструкции не нужен.
html — это корневой тег документа (и парный закрывающий к нему): вторая и последняя строчки вашего документа, между которыми будет расположено абсолютно все! Именно он превращает все написанное с момента открытия и до момента закрытия в гипертекстовую реальность.
А дальше структура документа делится на две части: head и body — голову и тело. Одна вверху, остальное — внизу.
head — голова, т.е. мозг вашего документа. То, что размещается внутри открывающего и закрывающего тега ГОЛОВА — никто снаружи не увидит, но именно сюда вы заложите в последствии важные сведения: как зовут эту страницу, где она живет, о чем она, кто ее создал, какой синтаксис и кодировку она использует, как тело должно отражаться, какие паттерны поведения ему свойственны, какие стили будут использованы и много чего еще.
body — тело вашего документа. То, что отражается браузером и видно всем окружающим. Открывающий тег — будет расположен сразу под головой, а закрывающий — на уровне пяточек, предпоследний тег вашего документа.
Основная разметка документа — страницы сайта
Итак, вы разметили свой документ и теперь знаете, где у него что находится. Но пока мозг нашего нового человечка — странички сайта — чист. Сегодня мы вложим в него минимальные сведения. Мы расскажем страничке, какую кодировку она использует и как ее имя.
meta charset=»utf-8″ — тег МЕТА принадлежит к целому классу разных данных о создаваемом документе, внутри головы их может быть множество: важных и не слишком. Но тег с атрибутом charset (=кодировка) должен появиться среди первых строчек, чтобы сайт читался браузерами корректно. В зависимости от выбранной вами кодировки вы дописываете к атрибуту-уточнению нужное значение. Я использую кодировку utf-8, о чем и сообщаю в первой же строке после тега, заявляющего, что мы говорим «на языке html».
title — а еще я хочу, чтобы страничка знала, как ее имя! Имя страницы, как и имя персонажа, — это «о чем она», какова ее тема, и часто для названия используется заголовок размещаемого на ней контента. Разумеется, имя у каждой странички сайта может быть только одно, поэтому тег title (= имя, название) на каждой странице может быть только один, и лучше бы ему не повторяться на других страницах. Именно имя страницы, заключенное в этом теге, является важным элементом для ее нахождения «поисковиками».
На сегодня для мозга хватит информации! Переходим к телу!
Внутри тега ТЕЛО (=body) может располагаться любая информация. С точки зрения структуры текстовая информация обычно является либо АБЗАЦЕМ (=paragraph), либо ЗАГОЛОВКОМ (=heading). Поэтому для обозначения обычного текста (каждого нового абзаца) используется тег-сокращение от слова paragraph — p, а для заголовков и разнообразных выделений варианты 1-5 рядом с тегом-сокращением от слова heading — h1,,h2, h3 и т.д. (заголовки и как их задавать мы пройдем в следующих лекциях). Про принудительные РАЗРЫВЫ (=break) строк вы уже знаете: это одиночный тег-сокращение от break — br.
ЗДРАВСТВУЙТЕ!
Здесь будет мой будущий сайт!
— вот что я напишу на своей страничке для начала, внутри тега p через атрибут align (=выравнивание) высказывая к этому абзацу пожелание, чтобы он размещался по центру.
Общий вид итогового файла. Начало.
А теперь сохраню его и посмотрю через браузер (если вы создавали страницу на компьютере, то просто откройте ее с помощью браузера; если страница создавалась на хостинге, задайте в строке адрес своего сайта):
Ну вот, обещанная первая дюжина строк вами написана! Поздравляю вас «с новорожденной»! Если вы хотели бы и дальше продолжать ее растить, то:
Специальные символы.
В HTML-документе мы можем использовать стандартным способом только символы(буквы, цифры и знаки) которые есть у нас на клавиатуре. Да и то не все, например если набрать начальную угловую скобку «, то браузер понимает что это начало тега , а не текст. Для того чтобы эта скобка была отображена в браузере нужно знать ее код. Код(ссылка мнемоники) для начальной угловой скобки: <.
Каждый такой код начинается с символа амперсанд, котрый можно набрать с клавиатуры при помощи клавиш «Shift»+«7», после амперсанда идет сам код, который обязательно должен закончиться точкой с запятой.
Коды символов делятся на две категории:
1)символные, это как в моем примере: < , название символа обозначается буквами(символами);
2)номерные, этот тип отличается только тем что ставится номер символа вместо сокращенного названия < = , решетка как раз и говорит о том что это номерной спец.символ.
В свою очередь номерные символы делятся на две под категории, десятеричную и шестнадцатеричную, например символ å можно отобразить в двух вариантах å(10) и å(16). Символ X после # говорит о том что этот символ в шестнадцатеричной системе исчисления. Коды символов в шестнадцатеричной системе исчисления нечувствительны к регистру, но для более наглядно вида используется такой синтаксис: å(X в нижнем, а номер в верхнем) или наоборот å(X в верхнем, а номер в нижнем регистре), это делается только для того чтобы код был более читабельными.
Хотел обратить ваше внимание на несколько спец.символов, которые считаются служебными для HTML:
- < — знак начальная угловая скобка
- > — знак > конечная угловая скобки
- & — знак & символ амперсанда
- " — знак « двойная кавычка
- ‘ — знак ‘ одинарная кавычка
- — знак пробела
Чтобы получить спец.символ вам нужно нажать кнопку:
пуск⇒ все программы⇒ стандартные⇒ служебные⇒ таблица символов.
Далее, найдите нужный символ и кликните на него, после чего в левом нижнем углу у вас появится код, но для использования в HTML его нужно преобразовать, в моем примере U+040E, значит его код будет: Ў, т.е. отрезаем U+ и вместо этого подставляем &#x. А в нижнем правом углу вы видите текст: Клавиша: ALT+0161, это десятеричный номер символа значит его код так-же ¡, но согласно спецификации по HTML, лучше использовать 16-ные коды, по тому что 10-ные не всегда отображаются правильно.
Так-же не все символы из этой программы можно использовать, а только те которые описаны в спецификации по HTML, которую вы можете просмотреть или даже скачать с официального сайта w3.org: спецификация по HTML 4-01 Почему 4-01 ? Об этом вы узнаете в эпилоге. И у меня все по тегу BODY.
Смотрите также:
Хватит дрочить у монитора
Как называются команды в угловых скобках в html
Каждый элемент определяет активные области изображения, которые являются ссылками. Рисунок с привязанными к нему активными областями называется в совокупности картой-изображением. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой. Тег задает форму области, ее размеры, устанавливает адрес документа, на который следует сделать ссылку, а также имя окна или фрейма, куда браузер будет загружать документ. Этот тег всегда располагается в контейнере , который связывает координаты областей с изображением.
Несколько областей могут перекрывать друг друга, сверху будет та, которая в коде HTML располагается выше.
Синтаксис
Атрибуты
accesskey Переход к области с помощью комбинации клавиш. alt Альтернативный текст для области изображения. coords Координаты активной области. href Задает адрес документа, на который следует перейти. hreflang Указывает язык документа, на который ведет ссылка. nohref Область без ссылки на другой документ. shape Форма области. tabindex Задает последовательность перехода между элементами с помощью клавиши Tab. target Имя окна или фрейма, куда браузер будет загружать документ. type Устанавливает MIME-тип документа, на который ведёт ссылка.
Также для этого тега доступны универсальные атрибуты и события.
Закрывающий тег
HTML5 IE Cr Op Sa Fx
Что такое HTML и зачем он нужен
Когда вы открываете любой сайт в интернете, браузер подгружает с сервера HTML-файл — текстовый файл с информацией о структуре сайта. Благодаря этому файлу браузер понимает, какой у страницы дизайн, в каком порядке показывать заголовки и текст, откуда загружать изображения, видео и скрипты.
Текстовый файл с основой веб-страницы пишут на HTML (HyperText Markup Language) — это язык гипертекстовой разметки. Разберемся, что значит этот термин подробнее.
Гипертекст — это система текстов, в которой разработчики прописывают элементы сайта и связывают их между собой ссылками. Благодаря гипертексту мы можем переходить по ссылкам на сайте, открывать видео и картинки. А гипертекстовая разметка — это правила, по которым разработчики создают текст веб-страницы.
Фронтенд-разработчик — с нуля до трудоустройства за 10 месяцев
- Постоянная поддержка от наставника и учебного центра
- Помощь с трудоустройством
- Готовое портфолио к концу обучения
- Практика с первого урока
Вы получите именно те инструменты и навыки, которые позволят вам найти работу
Зачем нужен HTML
Основная цель HTML — структурировать и оформлять контент на сайте.
HTML создает иерархическую структуру веб-страницы, используя заголовки, абзацы, списки и таблицы. Такая структура помогает пользователю легче ориентироваться на сайте.
Также с помощью HTML отображается текст, изображения, таблицы, видео и аудио. А еще благодаря коду на HTML мы можем переходить по ссылкам в интернете с одного сайта на другой.
Возможности HTML
С помощью HTML можно:
- Делать текстовую разметку — форматировать текст, выделять фрагменты, создавать списки, добавление сноски.
- Встраивать медиа. HTML позволяет размещать на сайте изображения, аудио, видео, карты.
- Создавать ссылки и навигацию. Гиперссылки и списки меню помогают быстрее найти информацию и сориентироваться на странице.
- Создавать таблицы. Нередко информацию удобно представить в табличном виде. HTML умеет работать с таблицами.
- Создавать формы. Формы нужны для регистрации посетителей сайта по телефону и электронной почте, оформления заказов, опросов и сбора обратной связи — отзывов, комментариев, предложений.
В HTML можно даже создавать простой дизайн: например, устанавливать цвет и шрифт текста или фоновый цвет блока. Но более сложный дизайн страницы разработчики делают с помощью CSS — языка стилей, который создали специально для работы в связке с HTML.
Возможностей HTML не хватает, чтобы «оживлять» сайты, делать их функциональными и интерактивными. Здесь приходит на помощь язык программирования JavaScript, благодаря которому мы можем взаимодействовать с формами на сайте, видеть динамические элементы и анимации.
Читайте также:
Как выглядит код на HTML
Увидеть HTML-код очень просто. Для этого нажмите клавишу F12 на любом сайте или правую кнопку мыши и выберите «Показать исходный код» или «Просмотр кода страницы». В разных браузерах названия этой команды может отличаться.
Так выглядит HTML-код главной страницы блога Хекслета
HTML-код пишут и сохраняют в документе — текстовом файле с расширением .html или .htm . HTML-файл можно написать в любом текстовом редакторе, даже в стандартном Блокноте Windows. Чтобы просматривать HTML-файлы, интернет не нужен.
Если создать несколько HTML-файлов в одной папке и поставить внутри гиперссылки, то можно переходить по этим ссылкам из одного документа в другой.
Что такое теги HTML
Теги HTML — это команды, которые говорят браузеру, что и в каком порядке показывать на экране. У каждого тега есть имя, которое расположено в угловых скобках.
Самая простая HTML-страница состоит из трех тегов: , и .
Теги и используют на странице только один раз.
HTML-файл всегда начинается с тега , по которому браузер понимает, как правильно отобразить страницу.
В теге хранится служебная информация — заголовок и кодировка страницы.
Внутри тега помещается содержимое страницы, которое отображается в браузере — текст, изображения, видео.
В теге — заголовок веб-страницы. Его браузер отобразит как название и сохранит в описании, если сохранить страницу в закладки.
Тег помещает изображение в нужное место страницы.
Есть парные и непарные HTML-теги, первых — большинство. Парный тег состоит из открывающего и закрывающего тега. Закрывающий тег содержит дополнительный элемент / — эта косая черта называется «слэш».
Например, тег
, внутри которого размещается текст, парный:
Слава роботам!
Тег , который позволяет разместить картинку на сайте, — непарный:
src='robot-bender.jpg' alt='picture-of-Bender-the-robot'> У каждого тега есть атрибуты. Они расширяют возможности тегов: задают стили, добавляют ссылки, управляют мультимедиа.
В примере выше показаны два основных атрибута непарного тега — это src и alt . Атрибут src добавляет ссылку на файл изображения, атрибут alt — подпись к картинке, которую покажет браузер, если файл изображения не загрузится.
Важно помнить про закрытые теги. Если тег не закрыт или закрыт неправильно, то верстка страницы может сломаться и сайт будет отображаться неверно.
Для логичной последовательной подачи информации используют заголовки, абзацы и списки.
Заголовки
Заголовки в HTML — это элементы, которые используются для создания заголовков и подзаголовков на веб-странице. Они определяют важность и иерархию информации на странице.
В HTML применяют шесть тегов заголовков: , , , , и . Тег обычно используется для главного заголовка страницы, а теги — используются для подзаголовков и других заголовков на странице.
Заголовки конкретной страницы помогают поисковым системам вроде Google или «Яндекса» определить ее содержание. Для поисковиков каждый следующий тег заголовка менее важен, чем предыдущий. То есть у заголовка меньшая важность, чем у заголовка .
Абзац
Абзац — это элемент, который используется для создания текстовых блоков на странице. Каждый абзац текста создается парным тегом
.Текст, разбитый на абзацы читать и воспринимать легче, чем сплошное «полотно». Абзац делит содержимое на логически связанные блоки.
Списки
Списки упорядочивают информацию на странице и улучшают ее восприятие. Обычно используются нумерованные и ненумерованные списки.
Ненумерованные или маркированные списки («буллеты») добавляют на страницу тегом . Такие списки применяют, когда последовательность элементов не важна.
Отдельный элемент в списке любого типа вводится тегом . Этот тег нужно закрывать после каждого пункта.
Читайте также:
Преимущества и недостатки HTML
Плюсы HTML
- Простота и доступность. HTML — это простой язык разметки, который легко изучить и использовать. Код на нем можно писать в любом текстовом редакторе.
- Адаптивный дизайн. Теги в современных версиях HTML позволяют делать разные версии одного сайта для удобного просмотра на любом устройстве: от смартфона и планшета до большого монитора.
- Гибкость. На HTML можно создавать простые сайты без использования интерактивных изменяющихся элементов. Например, лендинг, сайт-визитку компании, портфолио, каталоги, справочники, инструкции, небольшие блоги.
Минусы HTML
- Ограниченные возможности. HTML — это язык разметки, а не язык программирования. Делать современные сайты только на HTML не получится. HTML, например, не может создавать динамические веб-страницы, которые изменяются в реальном времени без перезагрузки страницы. Для создания чего-то более сложного не обойтись без CSS и JavaScript.
- Неполная совместимость последних версий HTML и браузеров. Некоторые браузеры не сразу встраивают поддержку новых функций и тегов, старые версии (Internet Explorer версии 8 и более ранней) могут неадекватно интерпретировать новые теги.
Является ли HTML языком программирования
Нет. Языки программирования необходимы для создания сложных веб-сайтов, которые выполняют задачи и взаимодействуют с пользователями.
Чтобы обрабатывать данные, введенные в формы, обмениваться этой информацией с базами данных, хранящимися на сервере, создавать анимацию используют языки программирования JavaScript, PHP и Python.
HTML не обрабатывает данные, а только их отображает. И также HTML не может выполнять вычисления, поэтому назвать его языком программирования будет неправильно.
Освоить HTML можно на курсах Хекслета — пройдите их, чтобы сделать свой первый шаг в профессии фронтенд-разработчика.
Профессия «Фронтенд-разработчик»
- Изучите востребованные JavaScript и TypeScript
- Научитесь создавать пользовательские интерфейсы сайтов и приложений
- Освойте самый популярный фреймворк JavaScript — React
- Познакомьтесь с языками веб-разработки HTML и CSS