5. «Сестринским элементом» называется элемент одного уровня с рассматриваемым элементом, с которым имеется общий родительский элемент.
Как уже было упомянуто выше, элемент <html> является корневым элементом документа. Это означает, что все остальные элементы расположены внутри тегов <html>…</html>. Все, что расположено за пределами данных тегов, браузером никак им не обрабатывается, так как не воспринимается код HTML.
Внутри тегов <html>…</html> расположено два основных элемента:
1. <head>,
2. <body>.
Элемент <head>, ограничен тегами <head>…</head> и содержит следующую техническую информацию о рассматриваемой странице:
· заголовок,
· кодировку,
· описание,
· ключевые слова для поисковых машин, и т.д.
Информация, расположенная в данном разделе не отображается в окне браузера. Её роль заключается в передаче браузеру информации о том, каким образом следует обрабатывать данную страницу.
Элемент <body> располагается между тегами <body>…</body>.
Именно в этом разделе находится содержимое документа, которое несет основную информационную нагрузку.
Рассмотрим подробнее элемент <head>…<head>, который состоит из нескольких обязательных и необязательных элементов.
К обязательным элементам относится элемент <title>. Содержимое данного тега отображается в заголовке веб-браузера. Для того, чтобы заголовок отображался полностью, его длина не должна превышать шестидесяти символов. Текст, используемый в качестве заголовка, должен максимально точно передавать содержимое веб-страницы.
Также существует ряд необязательных элементов, перечисленных ниже:
1. элемент <meta>,
2. элемент <style>,
3. элемент <link>,
4. элемент <script>.
Рассмотрим каждый из них подробнее.
Тег <meta> позволяет задать описание содержимого веб-страницы, а также указать автора документа HTML, ключевые слова для поисковых машин и т.д.
В состав элемента <head> могут входить несколько элементов <meta>. Это связано с тем, что они могут содержать различную информацию в зависимости от используемых атрибутов.
Тег <style> позволяет задавать стили, которые используются при оформлении страницы. Для определения стилей в HTML-документе применяется язык CSS. Также как и элементов <meta>, элементов <style> может быть несколько.
Тег <link> позволяет задавать стили для документа, записав их в отдельный файл с расширением.css.
Тег <script> позволяет присоединять к документу различные сценарии двумя способами:
1. текст сценария расположен внутри данного элемента,
2. текст сценария находится во внешнем файле (в этом случае он подключается с помощью атрибутов элемента) [8].
Создание сайта с помощью языка гипертекстовой разметки требует базовых знаний в данной области и некоторого опыта разработки.
Однако, в последнее время в информационных технологиях просматривается тенденция привлечения к простых разработке веб-сайтов и веб-приложений, людей которые не являются специалистами в данной области (обычно вместо включения в штат отдельного сотрудника, отвечающего за веб-разработку, обязанности по созданию и поддержке сайта в качестве дополнительных передаются специалисту другого профиля).
Учитывая данную тенденцию, было создано большое количество инструментов, с помощью которых даже если создатель сайта никогда не сталкивался с рассмотренными выше технологиями, он может самостоятельно создать простой сайт. На сегодняшний день существует большое количество инструментов, которые позволяют создать сайт, не имея специальных знаний и навыков.
Рассмотрим подробнее наиболее часто используемые для веб-программирования языки и инструменты.
2. Языки и инструменты веб-программирования
2.1 Инструменты
Web Builder
Web Builder является визуальным конструктором страниц сайта, для создания которых в данном конструкторе не требуются глубокие знания в программировании, так как для разработки страницы нет необходимости в написании кода - весь процесс разработки заключается в перетаскивании нужных элементов на создаваемую страницу. Интерфейс конструктора интуитивно понятен, что позволяет использовать его даже человеку, не владеющему специальными навыками в области программирования.
К достоинствам Web Builder можно отнести:
· простоту использования - для создания сайта не требуются никакие специальные знания,
· скорость разработки сайта,
· наличие встроенных конструкторов,
· безопасность - защита паролем,
· наличие встроенной системы управление контентом CMS,
· возможность моментальной публикации,
· поддержка шаблонов,
· отсутствие привязки к определенному серверу - сайт может располагаться на любом хостинге (Web Builder предоставляет возможность конвертации страниц сайта из формата.wbs в формат.html),
· возможность создания собственной страницы без скачивания и использования шаблонов,
· обеспечение поддержки большинства особенностей языка гипертекстовой разметки HTML5 и библиотеки стилей CSS3,
· наличие специальных расширений, которые позволяют расширить стандартные возможности редактора,
· оптимизация страниц сайта для индексирования в поисковых системах.
К недостаткам Web Builder можно отнести:
· отсутствие возможности предварительного просмотра,
· отсутствие возможности открытия файла, созданного в одной версии конструктора, другой его версией,
· работа только с операционной системой Windows,
· ограничение дискового пространства.
· размещение рекламы при использовании бесплатного конструктора,
· плохая SEO оптимизация,
· отсутствие возможности работы с несколькими сайтами одновременно.
WordPress
WordPress является конструктором, позволяющим создавать веб-сайты любой сложности. Разработка качественных сайтов возможна благодаря наличию встроенной в него системы плагинов, а также хорошей архитектуре.
В настоящее время WordPress считается самым популярным конструктором веб-сайтов. Популярность данного конструктора является следствием его удобства для начинающих создателей сайтов, так как он бесплатен, не требует никаких специализированных навыков.
Расширить возможности функционала шаблона в WordPress возможно, используя плагины, многие из которых бесплатны.
К достоинствам данного конструктора можно отнести:
· бесплатное использование движка и шаблонов,
· широкий выбор шаблонов,
· скорость установки,
· простоту и интуитивную понятность,
· возможность расширения функционала за счет использования плагинов,
· возможность редактирования кода шаблона,
· удобное руководство пользователя.
К недостаткам WordPress можно отнести:
· слабая система защиты,
· отсутствие полной русификации,
· ограниченный функционал при использовании бесплатной версии,
· большая нагрузка на сервер,
· дублирование изображений и страниц.
Joomla
Joomla является бесплатной системой, предназначенной для создания веб-сайтов. Данная система, являясь проектом с открытым исходным кодом, постоянно развивается.
В состав стартового пакета Joomla входит минимальный набор инструментов, которые могут затем быть расширены. Данная система позволяет отображать интерфейс как фронтальной, так и административной частей сайта на любом языке, так как каталог расширений включает в себя большое количество языковых пакетов (в том числе русский, украинский и белорусский), устанавливаемых штатными средствами администрирования.
К достоинствам данной системы можно отнести:
· простой интерфейс,
· возможность расширения функционала с помощью дополнительных расширений,
· гибкость создания внешний вид сайта благодаря системе платных и бесплатных, а также возможности самостоятельного создания оригинальных шаблонов,
· регулярность обновления,
· безопасность.
К недостаткам Joomla можно отнести:
· дублирование материалов при редактировании адреса (это негативно влияет на SEO),
· более высокие требования к начальной подготовке создателя сайта по сравнению с рассмотренными выше аналогами,
· отсутствие оптимизации внутренней структура (отрицательно сказывается на продвижении сайта).
Drupal
Drupal является популярной системой управления контентом с открытым исходным кодом, разработка сложных сайтов на которой проще чем создание их с нуля, благодаря её мощному функционалу.
К достоинствам Drupal можно отнести:
· открытый код,
· гибкость конфигурирования - данное свойство позволяет применять его при создании сайтов любых типов:
1. форумов,
2. социальных медиа-сайтов,
3. галерей,
4. портфолио,
· сообщество пользователей и разработчиков - данное свойство является причиной наличия большого количества качественных модулей, быстрово исправления ошибок, а также наличия большого количества документации,
· наличие большого количества модулей, позволяющих существенно расширить стандартный функционал,
· ориентированность на разработчиков, а не на пользовательский интерфейс,
· встроенная система кеширования - следствием данного свойства является малое время генерации страницы, а также низкая нагрузка на сервер,
· встроенная поисковая система.
К недостаткам данной системы можно отнести:
· длительный процесс обучения - изучение данной системы займет больше времени, чем изучение перечисленных выше аналогов,
· ориентированность на разработчиков - для использования Drupal требуются специализированные навыки, которые вряд ли есть у начинающего разработчика сайтов,
· сложный интерфейс - сложный для понимания интерфейс, который вряд ли можно назвать дружественным.
2.2 Веб-языки
В веб-программировании возможно использование множества языков, основными и наиболее часто используемыми из которых являются следующие:
· JavaScript,
· Java,
· PHP.
Некоторые из этих языков предназначены в основном для работы с веб-технологиями и создания веб-сайтов, в то время как другие могут использоваться для создания разных приложений, из которых веб-приложения составляют лишь малую часть.
Рассмотрим каждый из перечисленных выше языков программирования подробнее.
Java
Java представляет собой сильно типизированный объектно-ориентированный язык программирования.
Программы на Java транслируются в байт-код Java, который выполняется виртуальной машиной Java (JVM), являющейся программой, которая обрабатывает байтовый код и передает инструкции оборудованию как интерпретатор.
Достоинством данного способа выполнения программ является полная независимость байт-кода от операционной системы и оборудования, что позволяет выполнять Java-приложения на любом устройстве, для которого существует соответствующая виртуальная машина [4].
Другой важной особенностью технологии Java является гибкая система безопасности, в рамках которой исполнение программы полностью контролируется виртуальной машиной. Любые операции, которые превышают установленные полномочия программы (например, попытка несанкционированного доступа к данным или соединения с другим компьютером), вызывают немедленное прерывание.
Основным недостатком данного языка является снижение производительности.
К достоинствам Java можно отнести [9]:
· большой набор средств фильтрации ввода-вывода,
· унифицированный доступ к базам данных,
· поддержка замыканий, лямбд и т.д.,
· большое количество возможностей для реализации многопоточных программ,
· набор стандартных коллекций,
· расширенные возможности обработки исключений.
К недостаткам данного языка в качестве инструмента для начинающего разработчика необходимо отнести следующие параметры [1]:
· необходимость наличия узко специализированных знаний и навыков, на получение которых уходит очень много времени,
· необходимость установки среды разработки (любая из наиболее популярных сред разработки занимает много места и использует много ресурсов компьютера, что приводит к значительному замедлению его работы).
JavaScript
JavaScript представляет собой мультипарадигменный язык программирования, который поддерживает сразу несколько стилей [6]:
· императивный,
· функциональный,
· объектно-ориентированный.
Наиболее часто данный язык программирования используется в качестве встраиваемого языка, обеспечивающего программный доступ к объектам приложений.
Данный язык широко применяется для создания интерактивных веб-страниц в качестве языка сценариев.
Характерные черты JavaScript:
· слабая типизация,
· динамическая типизация,