Обзор технологий проектирование Веб-сайтов

Веб-разработка – это достаточно сложный процесс с огромным набором правил и методов, о которых должен знать каждый проектировщик Веб-сайта. Если необходимо, чтобы Веб-сайт выглядел и функционировал так, как нужно заказчику, то требуется применять современные Веб-технологии, которые помогут достичь целей создания сайта [2].
В самом простейшем случае разработка приложения или Веб-сайта обычно сводится к знанию 3 основных языков: JavaScript , CSS и HTML.
Веб-технологии – это языки разметки и мультимедийные пакеты, которые компьютеры используют для общения.
Поскольку Веб-разработка претерпела существенные изменения, то в настоящее время принято выделять такие области разработки Веб-сайтов [3]:
Фронтэнд (frontend);
Бэкэнд (backend).
Frontend и Backend – это два самых популярных термина, используемых в Веб-индустрии, но разница между ними довольно существенная. Это две самые фундаментальные части разработки программного обеспечения, которые играют важную роль в Веб-разработке. Внешний интерфейс – это то, что видит пользователь и с чем взаимодействует, а внутренний – то, как происходит обработка данных.
Внешний интерфейс может ссылаться на графический интерфейс пользователя, тогда как внутренний интерфейс – это та часть Веб-сайта, которую пользователь не может видеть или с которой не может взаимодействовать.
Веб-интерфейс – это часть Веб-сайта, с которой пользователь может напрямую работать и взаимодействовать, чтобы получить бэкэнд-возможности системы. Он включает в себя все, что пользователь может увидеть и испытать. Роль Веб-дизайнера сильно изменилась за эти годы, но основные функции разработки Веб-сайтов остались прежними.
Frontend – это все дизайнерские и оформительские решения, которые пользователь видит на Веб-сайте, таких как графический пользовательский интерфейс, включая яркие кнопки, красочные изображения, навигационные меню и т.д. Frontend также называют «клиентской», поскольку действие происходит на клиенте – стороне информационного обмена, которая в этом случае является пользователем. Как правило, клиент относится к компьютерному приложению, такому как Веб-браузер, который его просматривает.
Frontend – это в основном Веб-браузер, и все, что пользователь видит и взаимодействует на Веб-сайте, является частью разработки Веб-интерфейса. Лучшее взаимодействие с пользователем с точки зрения дизайна и простоты использования может быть связано с разработкой Веб-интерфейса, а Веб-дизайнер должен хорошо разрабатывать Веб-сайты.
Следует отметить, что Веб-дизайнер не имеет дело с кодом

. На самом деле он отвечает за все аспекты создания и перепроектирования Веб-сайтов, которые будут содержать как визуально привлекательные элементы, так и удобный дизайн. Роль разработчика Веб-интерфейса заключается в создании среды, которую пользователь может видеть и изменять с помощью комбинации нескольких инструментов, включая HTML, CSS и JavaScript [4].
Бэкэнд представляет собой серверную часть, также называемая «серверной стороной», является частью Веб-сайта, с которой пользователь не может взаимодействовать напрямую. По сути, все, что происходит за пределами форм пользовательского интерфейса, можно отнести к серверной Веб-разработке.
Это часть системы, которая не вступает в прямой контакт с пользователями. В отличие от внешнего интерфейса, он работает на стороне сервера, но взаимодействует с внешним интерфейсом, чтобы гарантировать, что система предоставляет нужный пользователю функционал. В каждом приложении есть также значительная часть кода не пользовательского интерфейса, который имеет дело со всеми сложными системами, которые происходят в фоновом режиме. Люди, которые имеют дело с бэкэндом, обычно являются программистами и разработчиками.
Бэкэнд-разработчики обрабатывают все, что не связано с созданием пользовательского интерфейса, например, написание API, создание библиотек или добавление утилит ко всему, что создает Веб-дизайнер. Они облегчают связь между уровнем представления и уровнем бизнес логики. Они играют решающую роль в Веб-разработке, и их роль тесно связана с Веб-дизайнерами. Короче говоря, бэкэнд-Веб-разработка – это сочетание разработки и поддержки основной функциональной логики программного приложения. Проще говоря, разработчики бэкэнда пишут код, чтобы убедиться, что все работает на внешнем интерфейсе. Они тратят больше времени на реализацию логики и реализацию алгоритмов, чем Веб-дизайнеры, чтобы обеспечить правильную работу сайта.
Связь бэкэнда и фронтэнда представлена на рисунке 1.1.
Рисунок 1.1 – Связь бэкэнда и фронтэнда
Рассмотрим технологии создания Веб-сайтов, которые применяются на стороне Фронтэнда.
Во-первых, это HTML и CSS.
HTML, CSS являются строительными блоками для Веб-разработки. Их фреймворки, такие как Bootstrap и Materialize, наиболее широко используются в Веб-разработке. Twitter Bootstrap популярен благодаря адаптивному дизайну, а Flexbox и CSS Grid System также являются популярными темами в CSS, и они используются без какой-либо инфраструктуры для разработки адаптивных Веб-сайтов [5].
Другой популярной технологией разработки является Motion UI