Этапы разработки сайтов

Тема 3. Этапы разработки сайтов

Учебные вопросы темы:

1. Этапы разработки сайтов.
2. Специалисты, разрабатывающий сайты и веб-приложения.
3. Технологии.

Вопрос 1. Этапы разработки.

Традиционно, этапы разработки сайтов выглядят следующим образом:

• Осознание цели разработки веб-представительства.
• Фиксация внешних условий, в которых будет функционировать представительство, и определение характеристик целевой группы посетителей.
• Придумывание и регистрация доменного имени.
• Дизайн-проектирование веб-представительства.
• Выбор средств (технологий) создания веб-сайта.
• Разработка структуры сайта. Конструирование веб-страниц.
• Информационное наполнение веб-страниц.
• Тестирование сайта.
• Размещение сайта на веб-сервере (перенос с тестового домена).
• Объявление о существовании сайта.

Некоторые этапы можно объединить, соответственно рассмотрим подробнее их в несколько объединенном виде.

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

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

Когда техническое задание утверждено и договор подписан, можно приступать к воплощению идей, описанных в техническом задании. Другими словами, заниматься непосредственной работой по сайту, которые делятся на 6 основных этапов Некоторые этапы.

1 этап. Проработка структуры сайта и компоновка страниц.

На основании технического задания составляется план сайт, рисуется карта существующих разделов. В самих разделах компонуются информационные блоки. Разделы группируются по типу предоставляемой информации. Проектируется страницы сайта.

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

3 этап. HTML верстка шаблонов сайта. Для того чтобы перевести нарисованный шаблон в форму, воспринимаемую интернет обозревателем (браузером), верстальщик использует специальный язык HTML. А также создает специальные каскадные таблицы стилей CSS. Параллельно с версткой программируются клиентские скрипты на языке Javascript. C помощью этих скриптов на веб странице можно воспроизводить определенные функции и графические эффекты. После того, как шаблон сайта сверстан он проверяется на наличие ошибок специальным валидатором и тестируется в различных интернет обозревателях (Internet Explorer, Opera, Chrome, Mozilla) (тестирование).

4 этап. Программирование сайта. Программирование сайта ведется в соответствии с техническим заданием. Самыми популярными средами программирования являются PHP и ASP программирование. В этих средах работает большинство существующих в сети сайтов. В помощь программистов существуют специальные фреймворки, облегчающие создание необходимых функций. За базис в программировании часто выбирают специализированную систему управления сайтом CMS, что значительно упрощает процесс создания.

После того, как программная часть сайта написана и проверена, сайт подвергается тестированию. Ошибки, найденные в ходе тестирования, устраняются.

5 этап. Наполнение сайта информацией. Все разделы сайта наполняются необходимой информацией. Параллельно с этим наполнением происходит обучение персонала. Пишется инструкция по работе с сайтом.

6 этап. Запуск сайта. Сайт с локального сервера разработчиков переносится на хостинг заказчика. Настраивается подключение к базе данных. Создаются почтовые ящики.

Вопрос 2. Специалисты, разрабатывающий сайты и веб-приложения.

Коллектив разработчиков может включать в свой состав:

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

Вопрос 3. Технологии.

На сегодняшний день существует большой выбор технологий создания сайтов:

• Предварительный дизайн и прототипирование сайтов.
• Верстка сайтов (HTML и CSS).
• Программирование на языке JavaScript.
• Программирование на PHP.
• Использование CMS.
• Использование Фреймворков.
• Применение СУБД.
• Технические технологии.

Предварительный дизайн включает в себя:

• Предварительный дизайн (графический) всех страниц будущего сайта.
• Навигационный дизайн по сайту.
• Прототипирование.

Верстка сайта (HTML и CSS) включает в себя: HTML предоставляет следующие возможности:

• Издавать сетевые документы с заголовками, текстом, таблицами, списками, фотографиями и т.п.
• Получать информацию из Сети через ссылки гипертекста при нажатии кнопки.
• Создавать формы для посылки запросов на удаленные компьютеры, чтобы производить поиск информации, осуществлять бронирование, заказывать товары и т.п.
• Включать электронные таблицы, видео клипы, аудио клипы, и другие программные приложения непосредственно в их документы.

Программирование на JS:

Это пока еще относительно молодой язык программирования, но уже очень популярный в области технологий создания сайтов. На данный момент, работа над ним еще не закончена. Он постоянно дорабатывается и совершенствуется.

Программирование на PHP:

Благодаря своей простоте, скорости выполнения, богатой функциональности, распространению исходных кодов на основе лицензии PHP, этот язык является чуть ли не самым популярным в области технологий создания сайтов. Отличается наличием ядра и подключаемых модулей, «расширений»: для работы с базами данных, сокетами, динамической графикой, криптографическими библиотеками, документами формата PDF и т.п.

Технология CMS (веб скрипты):

На данный момент примерно 60% сайтов в интернете созданы благодаря CMS. Исследования показывают отчетливую положительную тенденцию в сторону увеличения доли сайтов с CMS, а всё потому, что эти инструменты делают вашу жизнь проще. Существует множество CMS, и вы можете выбрать наиболее подходящую для себя, в зависимости от целей и специфики вашего веб-сайта.

Технологии Фреймворк:

программная платформа, определяющая структуру программной системы; программное обеспечение, облегчающее разработку и объединение разных компонентов большого программного проекта.

Самые распространенные представители:

• Angular.
• React.
• Vue.

СУБД MySQL:

SQL (от Structured Query Language – структурированный язык запросов) – создан для работы с реляционными базами данных. Он позволяет пользователям взаимодействовать с базами данных (просматривать, искать, добавлять, управлять данными). MySQL – многопользовательский, многопоточный сервер базы данных SQL. Имеет хорошую скорость и гибкость, если использовать его для хранения изображений и файлов.

Вопросы для самопроверки:

1. Первым этапом разработки любого сайта является:
   • Осознание цели разработки веб-представительства.
   • Фиксация внешних условий, в которых будет функционировать представительство.
   • Дизайн-проектирование веб-представительства.
   • Разработка структуры сайта. Конструирование веб-страниц.
2. Следующий специалист подбирает цвет, форму изложения материала, планировку экрана и т. д.;:
   • Информационный разработчик.
   • Сценарист.
   • Инженер-разработчик.
   • Редактор проекта.
3. Следующий специалист является экспертом по тематике разрабатываемого сайта:
   • Редактор проекта.
   • Сценарист.
   • Инженер-разработчик.
   • Информационный разработчик.
4. Следующие технологии используются для верстки сайтов:
   • CSS.
   • JavaScript.
   • PHP.
   • MySQL.
5. MySQL представляет из себя:
   • Систему управления базами данных.
   • Средство верстки сайтов.
   • Средство программирования.
   • Средство предварительного дизайна.