- Проектирование, включающее создание ТЗ.
- Работа над креативной концепцией сайта.
- Макеты страниц.
- Дизайн-концепция.
- Мультимедиа, flash-элементы.
- Непосредственно верстка.
- Программирование серверной и клиентской части.
- Тестирование на соответствие ожиданиям заказчика.
- Публикация на хостинге.
- Обслуживание проекта.
Теперь чуть конкретнее о каждом этапе. Проектирование предполагает создание технического задания. Менеджер (или аналитик) определяет назначение сайта, аудиторию, содержание, формы, интерактивные элементы и проч.
Далее — работа дизайнера. После утверждения дизайна подключается верстальщик. Когда макеты готовы, начинает работу программист. Пригодность работы оценивает тестировщик, здесь же может понадобиться и дизайнер.
Создать сайт — это только половина дела. После размещения файлов сайта на хостинге ресурс наполняют контентом, проводят внутреннюю и внешнюю SEO-оптимизацию.
Таким образом, над проектом работают специалисты разных направлений:
- информационные архитекторы;
- веб-дизайнеры;
- верстальщики;
- программисты;
- тестировщики;
- SEO;
- копирайтеры;
- контент-менеджеры.
Разделение ответственностей в веб-разработке
Для удобства понимания языки веб-программирования можно разделить на клиентские и серверные. В первом случае фронтенд, во втором бэкенд. Бэкенд представляет собой аппаратно-программную часть, задача бэкенд-разработчика — осуществлять функционирование внутренней части сайта, скрытой от пользователя. Фронтенд — про работу с интерфейсом, то есть с тем, что взаимодействует с пользователем.
Технологии фронтенд: html, css. Javasript. Технологии бэкенд: python, react.js, php и прочие. Остановимся на этом подробнее.
Frontend
Фронт — лицевая сторона web-разработки. Пользователь взаимодействует с визуалом, его элементами. Клиентская часть должна покрывать запросы, быть удобной, красивой, корректно работающей на устройствах, с любыми браузерами, шрифтами и проч. Удобное меню, интуитивный интерфейс, простота оформления заказа, красиво всплывающие уведомления, это и прочее — заслуга фронта. Работа для настоящих педантов.
Backend
Скрытая, но не менее важная часть. Такой разработчик трудится над созданием баз данных, настраивает систему резервного копирования данных, работает с ценной информацией, шифрует пароли, пишет программы, записывающие информацию в базу и это далеко не все его задачи.
Бэкендеры работают на python, php, node.js. Также необходимо освоить системы управления базами данных — MySQL, например. Backend для тех, кто любит работать с данными.
Верстка
Неважно, выберете вы работу с серверной или с клиентской стороной, в любом случае необходимо освоить технологии HTMLи CSS, простые, но незаменимые.
HTML не считают языком программирования — это стандартизированный язык разметки. Благодаря ему создается структура и содержание. В его основе — теги. Создать сайт вы можете и сами: откройте блокнот, оставьте там запись, а когда будете сохранять, поменяйте расширение txt на html, откройте файл при помощи браузера.
Стандарты языка разметки обновляются, и специалисту важно держать руку на пульсе, знать об обновлениях.
CSS необходим для стилизации. Так, при помощи него мы меняем цвет текста, выравниваем по нужному краю, меняем углы картинок, шрифты и т.д.
Благодаря этим двум языкам разметки можно создать очень простенький сайт, тем не менее — с текстовым наполнением, картинками, таблицами. Этого, разумеется, недостаточно, и без серверных и браузерных языков программирования не обойтись.
Знание основ HTML и CSS позволит создавать несложные сайты с текстовым наполнением. Если хотите посложнее, не обойтись без языков программирования, как и без знания баз данных.
Программирование
Чтобы сделать страницу живее, добавив обработку действий пользователя, например, необходимо обратиться к JavaScript. Любой сайт, с которым приходилось работать, содержит и джаваскрипт-код.
JS — браузерный язык программирования, а самый популярный представитель серверных языков — PHP. Код PHP внедряется в HTML.
Возьмем наглядный пример. Открывая страницу социальной сети и вводя личные данные, мы с нашего устройства отправляем запрос с данными на сервер. На серверной стороне PHP берет информацию из сервера и отправляет снова на наше устройство. На фронтенд передается информация для заполнения полей, результат формируется в виде HTML документа и отображается в браузере.
Как и JS, PHP относительно несложен, но знать его недостаточно. Раскрыть возможности этого серверного языка помогут другие технологии. Так, необходима работа с MySQL или другими базами данных.
Базы данных хранят данные сайта. Вся информация — размещенные тексты, пользователи с логинами и паролями, личная информация, каталоги товаров и прочее. PHP обеспечивает серверную логику проектов, среди которых — популярные соцсети, информационные сайты, интернет-магазины.
Чтобы оптимизировать написание кода, сэкономить время, стоит иметь под рукой готовые решения, которые покроют типовые задачи. Для этого стоит изучить, например, React — это библиотека на JS, и изучать ее приходится отдельно. Впрочем, освоившему JS это не покажется сверхзадачей.
