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

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

«Написание» сайта — этапы

1. Составление технического задания

Техническое задание, или ТЗ - это план в котором описаны все ключевые факторы, которые нужно учесть при создании лучших сайтов в Самаре . Обычно ТЗ составляет заказчик: основные пункты должны объяснить исполнителю, каким должен быть ресурс в готовом виде, на какую целевую аудиторию рассчитан, какую цель должен выполнять.

2. Создание прототипа сайта

Когда ТЗ готово, к работе приступают разработчики. Прототипирование является ключевым этапом в создании будущего ресурса: на этом этапе создается упрощенный макет со всеми страницами, на которых условно обозначены все элементы сайта. Сам прототип создается с помощью специальных программ - самой популярной из которых является Axure.

3. Разработка дизайна

Над дизайном может работать как один человек, так и группа веб-дизайнеров, в зависимости от масштабности проекта. Основная работа ведется над определением стилистики дизайна, которая определяется с учетом целевой аудитории сайта. Подбираются шрифты, обычно не больше двух, устанавливается палитра основных цветов. Дизайн сайта зачастую разрабатывается в таких программах: Adobe Photoshop, Sketch, Adobe Illustrator. После выполнения данной работы, PSD макет передается верстальщику проекта.

4. Верстка сайта

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

5. Выбор домена и хостинга

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

6. SEO оптимизация

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

Эти основные этапы и есть главные правила сайтостроения.

Видео
Продолжая тему, предлагаю посмотреть умное и полезное видео с описанием ключевых этапов создания сайтов.

Основное направление деятельности нашей компании – это создание сайтов . Разработка сайта – процесс трудоемкий, в котором обычно участвуют несколько специалистов. Чтобы проект был успешным, необходимо как минимум определить:

• какие задачи возлагаются на сайт,
• на каких посетителей веб-сайт рассчитан,
• какую информацию нужно до них донести,
• какую функциональность стоит заложить в свой веб-сайт, т.е. как он будет работать;
• кто и как будет поддерживать нормальное функционирование сайта, обновление информации, как планируется его расширение?

Процесс разработки веб-сайта можно разделить на следующие этапы:

1. анализ задач, которые должен решать сайт, определение целевой аудитории,
2. регистрация доменного имени сайта (например, www.сайт),
3. планирование структуры будущего сайта (разделы, навигация и т.д.),
4. разработка дизайна сайта (как правило, от 1 до 3 эскизов, в зависимости от бюджета проекта),
5. верстка разработанного макета,
6. интеграция сверстаннного макета в систему управления сайтом Joomla, установка программных компонентов и модулей, отвечающих за расширенную функциональность сайта,
7. наполнение сайта текстами и изображениями, файлами и др. (наполнение контентом).
8. тестирование сайта на соответствие техническому заданию и выкладывание готового проекта в интернет,
9. хостинг сайта,
10. поисковая оптимизация (продвижение) сайта

Давайте теперь рассмотрим каждый из этих этапов подробнее.

1. Анализ

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

2. Регистрация доменного имени

Имя сайта должно быть простым, звучным и запоминающимся. В этом случае пользователи без колебаний и долгих поисков будут заходить на Ваш сайт и рассказывать о нем своим друзьям. Мы поможем Вам подобрать название сайту и зарегистрировать его в соответствии с правилами, принятыми в сети Интернет. В ситуациях, когда подходящее имя в одной доменной зоне кем-то занято, самым простым решением оказывается регистрация сайта с тем же названием, но в другом домене (например, если www.firma.ru не свободно, можно зарегистрировать www.firma.com или www.firma.net), но предпочтительнее использовать все-таки домен в зоне RU.

3. Техническое планирование

Разработка технического задания - это этап, которым часто незаслуженно пренебрегают (Особенно если поджимают сроки или ограничен бюджет ). А ведь давно известно - каждый потраченный на планирование час позволит сэкономить три-четыре часа на этапе разработки. Здесь стоит особое внимание уделить тому, как должна работать навигация (Как посетитель попадет на эту страницу с главной? ). Не забудьте и о программных функциях (Пользователь нажал на вот эту кнопку – что при этом должно произойти? ). Очень важно уже на этом этапе понять, какой будет ваша карта сайта и как будет работать тот или иной программный компонент. Для любого сайта сложнее чем сайт-визитка важно создавать ТЗ.

4. Дизайн сайта

Один из наиболее сложных этапов. Прежде всего потому, что большинство из нас привыкло оценивать дизайн отдельно от самого сайта - картинка нравится или не нравится. Здесь стоит вспомнить о целях, которые вы поставили перед сайтом (Цель поразить всех красивой картинкой? ). Говорит ли дизайн о том, что предлагает ваша компания? Соответствует ли он вашему корпоративному стилю (У вас ведь есть корпоративный стиль? ). Четко ли он показывает ваше отличие от конкурентов? Не помешает ли дизайн в дальнейшем эффективно подвигать сайт? И это только часть вопросов, которые надо себе задать. Дизайн должен обязательно учитывать специфику той группы пользователей, на которую он расчитан, но при этом не должен приниматься в штыки и остальными (например, на "женские" сайты заходят и мужчины, и им тоже должно нравится находиться на сайте)

5. Верстка

Верстка – это перевод дизайна, до сего момента существующего в виде картинки, в HTML-код. Здесь есть свои особенности. Хорошо сверстанный сайт будет одинаково работать во всех основных веб-броузерах и на наиболее распространенных разрешениях (Или вы можете позволить себе терять клиентов? ) и его загрузка не будет заставлять клиентов иди за очередной чашкой кофе.

6. Система управления сайтом (CMS)

Серьезной задачей является выбор программного «движка», позволяющего обновлять информацию на сайте без лишних сложностей . (Если вы можете поручить задачу обновления своей секретарше, и она с этим справится без помощи вашего программиста – значит все ок ). Кроме того, иногда приходится изменять структуру сайта – например, переместить раздел или создать новый. Этот процесс тоже не должен вызывать трудности. Следование открытым стандартам также очень важно – не стоит «приковывать» себя к чьей-то закрытой технологии.

7. Наполнение сайта

В случае использования CMS процесс наполнения становится довольно прост. Конечно, он все же занимает некоторое время. Единственное, на что стоит обратить внимание – это готовность самих текстов. Очень часто именно этот этап является причиной наиболее значительных задержек, так что лучше всего позаботится об этом заранее. Обычно сайт получается запустить в срок в том случае, если и заказчик и исполнитель делают сайт параллельными курсами - разработчики делают дизайн, верстку и программную часть, а заказчик подбирает контент, готовит изображения для сайта.

8. Тестирование и выкладывание

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

И вот, когда тестирование закончено, наступает момент размещения сайта.

9. Хостинг

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

10. Поисковая оптимизация сайта

Поисковая оптимизация сайта – основа продвижения и раскрутки сайта в сети. С помощью раскрутки сайта можно привлечь на веб-ресурс значительное количество целевых посетителей, причем “цена за переход” у них будет очень небольшой. Поисковая оптимизация сайта (раскрутка сайта) – это стратегическая инвестиция в бизнес. Даже супер красивый и удобный сайт не сможет привлечь к себе должного внимания, если о нем никто не узнает.

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

• выкладывать новые материалы
• продвигать сайт в интернете
• опрашивать посетителей и добавлять новую необходимую им функциональность

Это не всегда просто, но оно того стоит - сайт это один из наиболее эффективных инструментов в современном бизнесе.

Разработка сайта — это процесс, состоящий из нескольких последовательных этапов. Заказчик может выбрать любого исполнителя для определенных этапов создания сайта. Впрочем, некоторые фрилансеры или студии предлагают полный пакет своих услуг. Что лучше — решать только заказчику. Можно оплатить полностью всю работу за раз и в итоге получить готовый, функционирующий сайт. А можно заказать работу по частям, то есть один человек делает макет, другой верстает, третий размещает в сети, четвертый раскручивает.

Работу по созданию можно разделить на такие этапы:

— Подготовительный;
— Разработка макета;
— Верстка;
— Программирование;
— Наполнение контентом;
— Раскрутка сайта;
— Администрирование (поддержка) сайта.

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

1. Подготовительный этап

На этом этапе необходимо сформировать основную идею будущего сайта.

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

• Затем определяем целевую аудиторию (пол, возраст, образование), то есть для кого будет этот сайт.

• Так же необходимо выяснить какую информацию ожидают посетители, это поможет с определением контента (текстовой информацией) на сайте.

• Затем нужно определиться с технической стороной. Важно учитывать среднее подключение к сети, а так же программным обеспечением.

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

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

2. Разработка макета

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

После чего предоставляется в формате PSD (со всеми слоями) и в виде картинке, тут можно использовать любой формат (JPEG, PNG), чтобы в дальнейшем передать работу в руки верстальщика. Разработка дизайна сайта обычно занимает от нескольких дней, до нескольких недель, очень сложные работы могут проводиться даже месяц.

3. Верстка

Чтобы нарезать готовый макет на части, и в дальнейшем прикрепить на сайт, потребуется верстальщик. Что такое верстка? Это процесс написания HTML и CSS кодов для веб-страниц. Каждый код отвечает за то, чтобы все элементы на странице размещались там, где нужно. Верстальщик должен знать все особенности браузеров, так как для каждого браузера необходим свой подход верстки.

Виды верстки при создании сайта:

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

• Табличная. В табличной верстке можно создавать колонки, таблицы в браузерах выглядят почти одинаково. Недостатки: индексация такого сайта очень медленная, долго загружаются страницы и код такой верстки слишком большой.

4. Программирование

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

Язык программирования представляет собой знаковую систему,которая предназначена для описания алгоритмов. Самые популярные языки программирования: Java, C, C++, Delphi, Basic, PHP, Perl, Ruby и др.
После всех этих действий сайт публикуется в сети.

5. Наполнение сайта контентом

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

Обычно на сайтах используют SEO-копирайтинг, эта техника создания текстов для сайта, которая учитывается не только особенностью восприятия пользователем, но и необходима для продвижения в поисковой системе. Такие работы имеют свою цену исходя из объема требуемых материалов.

6. Раскрутка сайта

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

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

7. Поддержка сайта

Тут следует учесть каким образом будут добавляться или редактироваться материалы и разделы сайта. Возможно потребуется сделать архив статей, куда будут попадать не актуальные новости. Для таких целей выделяется сотрудник, который будет следить за частотой обновления, предоставлять свежую информацию, убирать старую.

Ресурс можно обновлять как самостоятельно, так и при помощи поддержки специалистов, разумеется на платной основе.

Современные информационные технологии / 3.Программное обеспечение

студ. Телегина М. В., к.т.н. Костарев А. Н.

Российский государственный социальный университет, Россия

Основные этапы разработки web-приложений

Разработка web -приложения (web -разработка) - это комплекс мер и действий по планированию и созданию сайта в сети Internet в зависимости от поставленных целей и задач.

Современный Internet -сайт может решать как маркетинговые задачи - продвигать на рынке товары и услуги предприятия, конкурентные преимущества компании, увеличивать спрос на продукцию и пр. - так и представлять собой информационный ресурс, задачи которого ограничиваются информированием целевой аудитории.

Непосредственно созданию сайта предшествует подробный комплексный анализ, определяющий критерии, которым должен соответствовать будущий web -проект.

Процесс создания web -приложения, в общем случае, включает шесть основных этапов:

· определение целей и задач проекта;

· разработка структуры сайта;

· разработка дизайн-макетов;

· html- вёрстка;

· программирование и контроль качества;

· запуск и сопровождение, SEO -оптимизация.

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

Определение целей и задач проекта

На этапе проектирования формулируются бизнес-цели создаваемого проекта, определяются требования, которым он должен удовлетворять, разрабатывается общая концепция.

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

Для нахождения целевой аудитории целесообразно войти в роль квалифицированного пользователя на аналогичных создаваемому Internet -ресурсах. Помимо прочего это поможет выявить новые креативные концепции для того, чтобы сайт был более конкурентоспособным и «не затерялся» среди множества других.

Когда цели определены, приступают к составлению расширенного плана проекта, отражающего сколько времени, денег и иных средств понадобится для выполнения работ на каждом из последующих этапов. Такой план часто содержит информацию о бюджете проекта, график работ (с соответствующим распределением ролей между web -разработчиками), техническую документацию, а также раздел «деталей и уточнений», где оговорены конкретные аспекты возможных спорных вопросов. В этот раздел также включают предложения о готовых разработках и шаблонах.

После детального рассмотрения и утверждения плана подписывается договор о выполнении работ.

Разработка структуры сайта

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

Карту сайта представляют в виде чертёжа (блок-схемы), на котором каждая страница отображается отдельным прямоугольником. Связи между ними показывают схему переходов по страницам.

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

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

Завершив формирование облика сайта, компоновку страниц и определив размещение содержимого, переходят к следующему этапу web -разработки - к визуальному оформлению.

Разработка дизайн-макетов

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

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

Часто прибегают к использованию готовых дизайн-шаблонов, которые широко представлены в сети Internet или являются встроенными в различные графические редакторы, такие как, Microsoft FrontPage или Adobe PhotoShop . С помощью подобных шаблонов сайт создаётся за максимально сжатое время. Однако следует отметить, что у такого решения имеется ряд существенных недостатков, главный из которых - повторяемость и не уникальность дизайна. Шаблон является оболочкой с минимальным количеством интерактивных элементов и полезных модулей. Поэтому при выборе шаблона стоит обращать внимание не только на дизайн, но и на функциональность.

Важным элементом web -дизайна является графика, которую условно можно разделить на три категории:

· иллюстрированная графика - пояснительные изображения, схемы и чертежи, фотографии;

· функциональная графика - кнопки навигации, счётчики и другие элементы управления сайтом;

· декоративная графика - эстетические элементы дизайна страниц - фоновый рисунок, заголовки, выполненные в виде графических файлов и пр.

Такая классификация предполагает использование различных мультимедийных форматов. Например, для чётких, контрастных изображений с мелкими деталями и тонкими линями используются jpeg -файлы, а для красочных изображений с мягкими переходами цветов - gif -файлы.

Html -вёрстка

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

Основными задачами при вёрстке являются:

· корректность отображения страниц сайта при разных разрешениях экрана;

· кросбраузерность - единообразность отображения страниц сайта в наиболее популярных браузерах - Internet Explorer , Mozilla Firefox , Opera , Chrome .

Программирование и контроль качества

Программирование - это практическая реализация проекта, интеграция наработок по отдельным направлениям. Другими словами, это процесс построения функциональных инструментов для наполнения и обработки данных. Программирование определяет насколько стабильным и защищённым будет функционирование сайта. Выбор платформы, технологий и грамотного подхода к программированию играет существенную роль. На данном этапе важно определиться с подходом к созданию Internet -реусурса: будет ли он статическим или динамическим.

Статический Internet -сайт представляет собой совокупность html -файлов, каждый из которых представляет отдельную страницу (или её часть). Такой подход используется, в основном, для размещения файловых архивов и медиа-коллекций. Статические сайты программирования, как такового, не требуют.

Страницы динамического Internet -сайт формируются сервером в ответ на запрос пользователя (передаваемый в виде URL -адреса страницы). Такие сайты требуют больше затрат на разработку и техническую поддержку, чем статические, но эти затраты окупаются за счёт снижения финансирования на редактирование материалов и развитие информационной структуры.

CMS

Как правило, современные web -проекты включают подсистему управления контентом (содержимым) - CMS (content management system ), либо строятся на основе неё. Назначение системы управления контентом состоит в предоставлении возможности публиковать материалы на сайте человеку, не обладающему специальными знаниями в области создания html -документов, а также в существенном сокращении времени, затрачиваемом на ввод данных.

Такие системы делают возможным совместную работу по наполнению ресурса информацией, позволяют обновлять содержимое страниц и разделов, размещать на сайте текстовую и графическую информацию, вносить изменения, перемещать или удалять информационные блоки или целые страницы, снижают риск непреднамеренного повреждения программного кода. Управление контентом включает в себя также отслеживание актуальности опубликованной информации, её соответствия критериям SEO -оптимизации и пр.

Существует большое разнообразие системы управления контентом: от систем, создаваемых в рамках реализации конкретного проекта для решения специфических задач, до универсальных систем, таких как WordPress , Joomla , 1С-Битрикс и пр.

Инструментальные средства разработки и базы данных

В настоящее время актуальным программным функционалом среди множества сред разработки обладает высокоуровневый фреймворк Ruby on Rails . Его возможности позволяют существенно повысить продуктивность web -программирования по сравнению с такими технологиями, как PHP или Perl .

Язык Ruby , лежащий в основе фреймворка Ruby on Rails , имеет быстрый цикл разработки (редактирование – запуск – редактирование), реализован в виде интерпретатора, поддерживает нетипизированные переменные, не требующие объявления. Ruby on Rails позволяет добиться высокой надёжности и гибкости разработки проектов любого масштаба. Фреймворк включает подсистему тестирования, которая помогает существенно сэкономить время разработки и повысить качество web -проекта.

В основе большинства динамических web -проектов лежит база данных. Существует множество различных систем управления базами данных (СУБД), но в современных хостинг-центрах - организациях по размещению web -проектов на серверах - как правило, применяются СУБД MySQL и PostgreSQL.Причинами тому являются фактическая ориентация этих СУБД на хостинговые задачи, доступность на всех популярных серверных операционных системах, а также относительная простота настройки и администрирования. СУБД упрощает управление данными и сокращает время и издержки на разработку и развёртывание приложений. MySQL и PostgreSQL обеспечивают приемлемый уровень безопасности, надёжности и масштабируемости.

Системы поддержки процесса разработки

Создание web -приложения, как и любого другого программного продукта, подразумевает работу с постоянно меняющейся информацией, данными, файлами. Контроль за вносимыми в проект изменениями помогают обеспечить системы управления версиями (Version Control System - VCS ), которые хранят предыдущие версии исходных файлов проекта, отслеживают производимые в файлах изменения, обеспечивают совместную командную работу над проектом и пр. К наиболее популярным на текущий момент VCS относятся: SVN , GIT , Microsoft VSS . Использование системы контроля версий поднимает общий уровень качества разработки.

Кроме того, создание любого программного продукта (в том числе и web -приложения) сопровождается новыми требованиями к продукту, предложениями по его улучшению, необходимостью исправлять ошибки и пр. Для управления перечисленными аспектами разработки и улучшения качества менеджмента используются системы отслеживания ошибок (Bug Tracking System - BTS ). Главный компонент BTS представляет собой базу данных с удаленным доступом, обеспечивающую централизованный доступ ко всем необходимым файлам, спецификациям, графикам, планам, замечаниям и т.п.

Существует широкое разнообразие систем отслеживания ошибок: B asecamp, Bugzilla , Trac , MantisBT , Redmine и пр.

По завершении этапа активного программирования начинается этап тестирования корректности функционирования созданного web -приложения: проверки на наличие грамматических ошибок, пропущенных картинок, неработающих ссылок и т.д., а также проверки функционирования сайта в различных web -браузерах. Данный этап может быть автоматизирован с помощью средств автоматического тестирования таких, как IBM Rational AppScan , Empirix E -TEST S uite, XSpider, WAS и др.

Запуск и сопровождение

После исправления ошибок и презентации сайта в сети Internet , начинается новый этап работ, связанный с его сопровождением. Основная цель сопровождения - поддержание стабильности работы web -ресурса и актуальности информации. Обязательным условием квалифицированного сопровождения web -сайта является защита информации, включающая в себя антивирусную защиту и защиту баз данных на сервере от действий злоумышленников, в частности, от SQL injection .

Кроме того, необходимо своевременное обновление содержимого сайта, исправление ошибок, не выявленных или не исправленных на стадии проверки качества. Ещё одним важным моментом сопровождения является постоянный мониторинг эффективной работоспособности сайта, контроль посещаемости и учёт данных статистики.

SEO -оптимизация

Поисковая оптимизация ( Search Engine Optimization ) - это комплекс мероприятий, целью которых является увеличение посещаемости Internet -ресурса за счет достижения им высоких позиций в выдаче поисковых систем по заданному набору целевых запросов. SEO -оптимизация базируется на семантическом ядре - списке ключевых слов, по которым планируется продвижение сайта в поисковых системах. Ключевые слова группируются по высоко-, средне- и низкочастотным запросам. От правильности подбора данных слов напрямую зависит успех сайта.

SEO-оптимизация учитывает:

· внутренние факторы ранжирования : число, плотность и расположение ключевых слов на страницах сайта, стилистическое оформление текста, правильность формирования тегов, мета-тегов и т. д.;

· внешние факторы ранжирования : индекс цитируемости, содержание внешних ссылок, релевантность ссылающихся страниц и пр.

Современные системы web -поиска (поисковые машины) анализируют большинство элементов web -страниц: текст, заголовки, служебные html-теги, стилевые и структурные особенности содержания. Результаты работы SEO-роботов сохраняются в специальной базе данных - индексе поисковой системы, - из которой по запросу пользователя выдаются в определенном порядке. Специалисты, чьей профессиональной областью деятельности является SEO-оптимизация, постоянно изучают алгоритмы ранжирования поисковых машин.

Анализ рынка web -разработки

В настоящее время российский рынок w eb-разработок меняется очень быстро и, по ряду оценок, считается самым динамичным за всю историю человечества. Уже на период 2009-го года в России существовало более 2000 компаний, оказывающих подобные услуги. Среди них следует отметить Art Lebedev Group , Actis Wunderman , Айтекс, DEFA Kreativburo . Такой круг лидеров остается более-менее постоянным на протяжении нескольких лет, и только повышение спроса на редкиеуслуги позволяет «выбиться» наверх ранее неизвестным компаниям. Главным «рычагом» web -разработки остается рост аудитории Internet -пользователей, который стимулирует разработчиков к совершенствованию своих web -проектов и увеличению бюджетов на SEO -оптимизацию.

Сейчас в сети Internet совершаются торговые сделки, существует множество электронных валют (Яндекс.Деньги, Webmoney и другие), открыты представительства банков, где пользователи могут работать со своими счетами. Ежедневно миллионы пользователей посещают поисковые системы, электронные энциклопедии, блоги (дневники пользователей), новостные сайты. Последние годы в российском сегменте сети Internet ознаменовались бурным развитием социальных сетей, уже давно завоевавших популярность на западе.

***

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

По информативности Internet -сайт оставляет далеко позади все традиционные источники информации и, что не маловажно, размещенная на сайте информация доступна конечному пользователю в любое время и в любой точке мира.

Литература

1. Гото К., Котлер Э. Веб-редизайн: книга Келли Гото и Эмили Котлер: Пер. с англ. - СПб.: Символ-Плюс, 2007. - 376 с.

2. Лопак Л. Web -дизайн. - 2-е изд.: Пер. с англ. - М.: Издательский дом «Вильямс», 2008. - 304 с.

3. Фернандес О. Путь Rails . Подробное руководство по созданию приложений в среде Ruby on Rails : Пер. с англ. - СПб: Символ-Плюс, 2009. - 768 с.

4. Панфилов К. По ту сторону веб-страницы. - М.: ДМК Пресс, 2008. - 440 с.

Лекция №10,11. Этапы разработки web-сайтов

Веб-разработка - процесс создания веб-сайта или веб-приложения. Основными этапами процесса являются веб-дизайн, вёрстка страниц, программирование для веб на стороне клиента и сервера, а также конфигурирование веб-сервера.

Основные этапы веб-разработки

На сегодняшний день существуют несколько этапов разработки веб-сайта:

· Проектирование сайта или веб-приложения (сбор и анализ требований, разработка Технического задания, проектирование интерфейсов);

· Разработка креативной концепции сайта;

· Создание дизайн-концепции сайта;

· Создание макетов страниц;

· Создание мультимедиа и FLASH-элементов;

· Вёрстка страниц и шаблонов;

· Программирование (разработка функциональных инструментов) или интеграция в систему управления содержимым (CMS);

· Оптимизация и размещение [ уточнить ] материалов сайта;

· Тестирование и внесение корректировок;

· Открытие проекта на публичной площадке;

· Обслуживание работающего сайта или его программной основы.

В зависимости от текущей задачи какие-то из этапов могут отсутствовать, либо быть тесно связаны один с другим.

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

Разработка сайта - это процесс, состоящий из нескольких последовательных этапов. Заказчик может выбрать для любого исполнителя для определенных этапов создания сайта. Впрочем, некоторые фрилансеры или студиипредлагают полный пакет своих услуг. Что лучше - решать только заказчику. Можно оплатить полностью всю работу за раз и в итоге получить готовый, функционирующий сайт. А можно заказать работу по частям, то есть один человек делает макет, другой верстает, третий размещает в сети, четвертый раскручивает.

Работу по созданию можно разделить на такие этапы:

Подготовительный;

Разработка макета;

Верстка;

Программирование;

Наполнение контентом;

Раскрутка сайта;

Администрирование (поддержка) сайта.

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

1. Подготовительный этап

На этом этапе необходимо сформировать основную идею будущего сайта.

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

Затем определяем целевую аудиторию (пол, возраст, образование), то есть для кого будет этот сайт.

Так же необходимо выяснить какую информацию ожидают посетители, это поможет с определением контента (текстовой информацией) на сайте.

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

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

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

На этом же этапе составляется ТЗ (Техническое задание).

2. Разработка макета

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

После чего готовый макет предоставляется в формате PSD (со всеми слоями) и в виде картинке, тут можно использовать любой формат (JPEG, PNG), чтобы в дальнейшем передать работу в руки верстальщика. Разработка дизайна сайта обычно занимает от нескольких дней, до нескольких недель, очень сложные работы могут проводиться даже месяц.

3. Верстка

Чтобы нарезать готовый макет на части, и в дальнейшем прикрепить на сайт, потребуется верстальщик. Что такое верстка? Это процесс написания HTML и CSS кодов для веб-страниц. Каждый код отвечает за то, чтобы все элементы на странице размещались там, где нужно. Верстальщик должен знать все особенности браузеров, так как для каждого браузера необходим свой подход верстки.

Виды верстки при создании сайта:

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

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

4. Программирование

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

Язык программирования представляет собой знаковую систему,которая предназначена для описания алгоритмов. Самые популярные языки программирования: Java, C, C++, Delphi, Basic, PHP, Perl, Ruby и др.

После всех этих действий сайт публикуется в сети.

5. Наполнение сайта контентом

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

Обычно на сайтах используют SEO-копирайтинг, эта техника создания текстов для сайта, которая учитывается не только особенностью восприятия пользователем, но и необходима для продвижения в поисковой системе. Такие работы имеют свою цену исходя из объема требуемых материалов.

6. Раскрутка сайта

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

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

7. Поддержка сайта

Тут следует учесть каким образом будут добавляться или редактироваться материалы и разделы сайта. Возможно потребуется сделать архив статей, куда будут попадать не актуальные новости. Для таких целей выделяется сотрудник, который будет следить за частотой обновления, предоставлять свежую информацию, убирать старую.

Ресурс можно обновлять как самостоятельно, так и при помощи поддержки специалистов, разумеется на платной основе.