Добавлен: 24.04.2023
Просмотров: 216
Скачиваний: 2
Введение
Актуальность выполнения данной работы обусловлена тем, что современное информационное пространство характеризуется использованием огромного количества технологий. Скорость разработки имеет ключевое значение, а вот выбор технологических решений ложится на плечи разработчика. В этой ситуации заказчику необходимы определенные гарантии получаемой программной системы. Одним из подходов является валидация исходного кода.
Валидация представляет собой специализированную проверку документа на соответствие web-стандартам и выявление имеющихся ошибок. Соответственно, валидным будет являться такой web-документ, который прошел подобную процедуру и не имеет ошибок в программном коде. Код web-страницы должен подчиняться уставновленным правилам, которые называются спецификацией, ее разрабатывает W3 Консорциум (www.w3c.org) при непосредственной поддержке разработчиков браузеров.
Сокращенное обозначение стандартов W3C состоит из фразы – World Wide Web звучащей в переводе как Всемирная паутина и слова Consortium (консорциум – сообщество, соучастие). Эта организация была создана чтобы с помощью штатных сотрудников поддерживать и развивать данные веб-стандарты, основанные на открытой платформе. Эти шаблоны позволяют проверять насколько хорошо отформатированы HTML и XHTML разметки документов.
Проведение такого анализа является важным шагом на пути к обеспечению технического качества страниц любого виртуального проекта при отображении на разнообразных устройствах. W3C проверка является процессом исследования кода веб-проектов, чтобы определить насколько он соответствует стандартам форматирования. Если не проводить проверку страниц ресурса на основе стандартов W3C, то может оказаться, что продвижение сайта, скорее всего, страдает от ошибок или плохого трафика вследствие ужасного форматирования на экранах различных устройств.
Объект исследования – язык HTML.
Предмет исследования – основы программирования.
Целью данной работы является изучение основ программирования на языке HTML.
В соответствии с целью была определена необходимость постановки и решения следующих задач:
– дать характеристику языку гипертекстовой разметки HTML;
– описать структуру HTML документа;
– изучить объектную модель HTML;
– дать понятие валидации и отладки;
– описать практические аспекты использования HTML.
1. Теоретические аспекты HTML
1.1. Характеристика языка гипертекстовой разметки HTML
HTML (от англ. HyperText Markup Language «язык гипертекстовой разметки») представляет собой стандартизированный язык разметки документов во Всемирной паутине Internet. Большая часть web-страниц содержат описание разметки на языке гипертекстовой разметки HTML (или XHTML). Язык гипертекстовой разметки HTML интерпретируется по средствам использования средств браузеров; полученный в результате непосредственной интерпретации обработанный текст выводится на экране монитора персонального компьютера или любого другого мобильного устройства [1]. В тоже время необходимо отметить, что язык гипертекстовой разметки HTML не является языком программирования.
Язык гипертекстовой разметки HTML до 5-й версии определялся как приложение SGML (стандартного обобщённого языка разметки в рамках стандарта ISO 8879). Спецификации языка гипертекстовой разметки HTML5 формулируются в терминах DOM (объектной модели документа).
Язык гипертекстовой разметки XHTML является более строгим вариантом HTML, он следует синтаксису XML и является специализированным приложением языка XML в области разметки гипертекста web-страниц глобальной сети Internet [3].
Во всемирной паутине Internet HTML-страницы, как правило, передаются по средствам использования средств браузеров от сервера при помощи протоколов HTTP или HTTPS, в виде обычного текста или с практическим использованием шифрования.
Изначально язык гипертекстовой разметки HTML был задуман и разработан как специализированное средство непосредственного структурирования и форматирования web-документов без их непосредственной привязки к имеющимся средствам воспроизведения (отображения содержимого документа). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного персонального компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или специализированного устройства и прикладной программы голосового воспроизведения текстов). Однако современное применение языка гипертекстовой разметки HTML очень далеко от его изначальной задачи.
1.2. Структура HTML документа
Гипертекстовый документ представляет собой текстовый файл, который имеет специальные метки, которые называются тегами, впоследствии опознаются браузерами и используются ими для непосредственного отображения содержимого файла па экране персонального компьютера.
При помощи практического использования таких меток можно выполнить выделение заголовков документа, изменять цвет, размер и начертание букв, вставлять различные таблицы и графические изображения. Но в тоже время, основным преимуществом практического использования гипертекста перед обычным текстом является наличие возможностей по добавлению к содержимому электронного документа специальных гиперссылок – конструкций языка гипертекстовой разметки HTML, позволяющие щелчком мыши перейти к непосредственному просмотру другого электронного документа или его части [7].
HTML-документ состоит из двух частей: собственно текста, т.е. данных, которые составляют непосредственное содержимое электронного документа, и специальных тегов – конструкций языка гипертекстовой разметки HTML, которые используются для непосредственной разметки документа и управляющих его практическим отображением.
Теги языка гипертекстовой разметки HTML позволяют в полной мере определить, в каком именно виде будет представлен выводимый текст, какие именно его компоненты будут исполнять роль гипертекстовых ссылок, какие графические или мультимедийные объекты должны быть включены в электронный документ.
Графическая и звуковая информация, которая может быть включена в HTML-документ, хранится в специальных отдельных файлах, с соответствующим расширением. Программы просмотра HTML-документов (браузер) выполняет интерпретацию флагов разметки и располагает текст и графику на экране персонального компьютера соответствующим образом. Для файлов, которые содержат HTML-документы приняты расширения .htm или .html.
В большей части случаев теги используются в виде пар, состоящих из открывающего <имя_тега> и закрывающего </имя_тега> тегов. Действие любого парного тега начинается с того места, где встретился открывающий тег, и заканчивается при непосредственной встрече соответствующего закрывающего тега [8].
Последовательность символов, которая составляет текст может состоять из пробелов, табуляций, символов перехода на новую строку, символов возврата каретки, букв, знаков препинания, цифр, и специальных символов (например #, +, $, @), за исключением следующих четырех символов, имеющих в HTML специальный смысл: < (меньше), > (больше), & (амперсанд) и " (двойная кавычка).
Самым главным из тегов языка гипертекстовой разметки HTML является одноименный тег <html>. Он всегда открывает электронный документ HTML, так же, как тег </html> должен непременно стоять в последней его строке. Эти теги позволяют обозначить, что находящиеся между ними строки представляют собой единый гипертекстовый документ HTML. Без наличия этих тегов браузеры или другие прикладные программы просмотра web будут не в состоянии идентифицировать формат данного документа и правильно его интерпретировать для пользователя.
Чаще всего в заголовок документа включают парный тег <title>... </title>, который позволяет определить непосредственное название документа HTML. Большое количество программ просмотра используют его как специальный заголовок окна, в котором выводят документ.
Тело документа является обязательным элементом, так как в нем располагается весь материал документа. Тело документа размещается между специальными тегами <body> и </body>. Все, что размещено между этими тегами, будет интерпретироваться браузерами в соответствии с правилами языка гипертекстовой разметки HTML позволяющими корректно отображать web-страницу на экране монитора персонального компьютера [5].
Текст в HTML разделяется на абзацы при помощи практического использования тега <р>. Он размещается в начале каждого отдельного абзаца, и программа непосредственного просмотра, встречая его, отделяет абзацы друг от друга пустой строкой.
При непосредственном использовании логического форматирования текста браузерами выделяются разные части текста в соответствии со структурой разрабатываемого документа. Чтобы выполнить отображение названия, определенный тег заголовка. Язык гипертекстовой разметки HTML позволяет задать несколько уровней заголовков: h1 (заголовок первого уровня), h2, h3, h4, h5 и h6 [11]. Список основных HTML-элементов представлен в Приложении.
Для создания гипертекстовой ссылки используется пара тегов <а>... </а>. Фрагмент текста, изображение или любой другой объект, расположенный между этими тегами, отображается в окне браузера как гипертекстовая ссылка. Активация такого объекта приводит к загрузке в окно браузера нового документа или к отображению другой части текущей Web-страницы.
1.3. Объектная модель HTML
Объектная модель документа (document object model – DOM) является распространенным средством представления XML-документов. В связи с тем, что язык гипертекстовой разметки HTML есть подмножество XML, изучение DOM-моделей использует и здесь. Таким образом, html-страница (объектная модель) – состоит из набора следующих стандартных элементов, к которым относятся:
– фреймы – позволяют разбить окно просмотра браузера на несколько прямоугольных подобластпей, располагающихся рядом друг с другом. В каждую из подобластей можно загрузить отдельный html-документ, просмотр которого осуществляется независимо от других;
– блоки с текстом – блоковые тэги описывают более крупные структуры документов, по сравнению с последовательными блоками;
– таблицы (тег table) – является одним из наиболее мощных средств HTML. Одним из применений является организация расположения разнообразных данных на странице, которые могут состоять из простого текста, изображений, других таблиц;
– формы для ввода и отправки необходимых данных – данный элемент позволяет создавать необходимые формы ввода и отправки необходимых данных;
– поле для ввода необходимого текста;
– переключатели (тег input, тип checkbox, radio);
– кнопки, используемые для отправки данных с форм;
– прочие html-элементы [2].
Объектная модель документа связывает в единое целое HTML, язык сценариев и каскадные таблицы стилей, предоставляя разработчикам web-документов инструмент с совершенно новыми качествами – динамический HTML.
По своей сути объектная модель документа DOM является интерфейсом прикладного программирования (API) для документов HTML. Она определяет логическую структуру документа и способ доступа и манипулирования составляющими документ элементами. Все, что определено в документе тэгами языка разметки страниц, становится доступным для изменения, удаления и добавления [9].
Следует заметить, что объектная модель документа DOM может применяться не только в web-страницах, но и к любым других документам. В частности, она может в полной мере использоваться с любыми словарями XML, причем одним из таких словарей является язык гипертекстовой разметки HTML, а точнее, XHTML.
Объектная модель документа DOM является постоянно развивающимся стандартом и разбита на несколько уровней. Первый уровень является базовой версией данного стандарта и пока что является единственно законченным. Он состоит из двух разделов: первый образует ядро и определяет ключевые принципы непосредственной манипуляции со структурой документа (среди которых можно выделить генерацию и навигацию), а второй посвящен непосредственному представлению в DOM элементов языка гипертекстовой разметки HTML, которые определяются одноименными тегами.