Глава 1. HTML и HTML5

HTML — язык разметки веб-страниц, состоящий из html-элементов, или тегов. Теги – строительные блоки, они формируют структуру веб-страницы и не имеют визуального отображения.

1.1. Основы HTML

HTML (HyperText Markup Language) – язык гипертекстовой разметки, позволяющий задать местоположение элементов веб-страницы. Просмотр HTML-документа осуществляется с помощью веб-браузера, который отображает документ на основе исходного кода, описывающего структуру HTML-документа.

1.2. HTML теги

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

1.3. HTML атрибуты

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

1.4. HTML текст

Текст нередко составляет основное содержимое веб-страницы и от того, как он оформлен, зависит удовлетворенность посетителей ресурсом. Главная задача веб-мастера – сделать текст хорошо читаемым, привлекающим внимание. Для этого необходимо использовать все возможности оформления и форматирования с помощью различных HTML-тегов, представленных в спецификации.

1.5. HTML ссылки

HTML ссылки в веб-документах представляют собой концептуальный конструктор, ведь именно они связывают все веб-страницы в единую сеть. Ссылки создаются с помощью тега <a>. Ссылка состоит из двух частей: указателя ссылки и адресной части ссылки.

1.6. HTML изображения

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

1.7. HTML таблицы

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

1.8. HTML списки

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

1.9. Спецсимволы HTML

Специальные символы HTML (символы-мнемоники) представляют собой конструкцию SGML, ссылающуюся на определенные символы из символьного набора документа. В основном они используются для указания символов, которых нет в стандартной компьютерной клавиатуре, либо которые не поддерживает кодировка HTML-страницы (Windows-1251, UTF-8 и т.д.).

1.10. HTML генераторы

HTML5 – новая веха в развитии веб-технологий. Улучшенные возможности, заложенные в HTML5, существенно облегчают создание сайтов благодаря новым элементам разметки и атрибутам. Мы отобрали для вас наиболее интересные и полезные ресурсы, которые помогут разобраться в свойствах HTML5.

1.11. HTML5 семантические элементы

Стандарт HTML5 предоставил новые элементы для структурирования веб-страниц – <header>, <footer>, <nav>, <section>, <aside>, <article>, <main>. Новые семантические элементы позволили улучшить структуру веб-страницы, добавив смысловое значение заключенному в них содержимому. Для отображения внешнего вида элементов не задано никаких правил, поэтому элементы можно стилизовать по своему усмотрению.

1.12. HTML5 аудио

До недавнего времени единственным способом добавления аудиоконтента на веб-страницы было интегрирование фонового звука с помощью тега <bgsound>, который проигрывался во время просмотра пользователем страницы без возможности выключения. Благодаря добавлению в спецификацию HTML5 нового элемента <audio>, появилась возможность добавлять аудиосодержимое со встроенным программным интерфейсом без привлечения подключаемых модулей.

1.13. HTML5 видео

HTML5 видео – новый стандарт для размещения мультимедийных файлов в сети с оригинальным программным интерфейсом без привлечения подключаемых модулей. С помощью элемента <video> появилась возможность добавлять видеосодержимое на веб-страницы, а также стилизовать внешний вид видеоплеера при помощи CSS.

1.14. HTML5 необязательные теги разметки

В спецификации HTML5 некоторые правила разметки были ослаблены. В частности, использование элементов <html>, <head> и <body> уже не является обязательным для разметки HTML5. Тем не менее браузер все равно считает, что они существуют, в чем можно убедиться, просмотрев разметку веб-страницы в Mоzilla Firebug или в Google Chrome Inspector.

1.15. HTML5 формы

HTML формы являются элементами управления, которые применяются для сбора информации от посетителей веб-сайта.
Веб-формы состоят из набора текстовых полей, кнопок, списков и других элементов управления, которые активизируются щелчком мыши. Технически формы передают данные от пользователя удаленному серверу. Для получения и обработки данных форм используются языки веб-программирования, такие как PHP, Perl.