(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Типичные ошибки разработки интернет-магазиновКонстантин Обухов, генеральный директор интернет-агентства «Инфоспайс»

_____________________________

в е б - с т у д и я м и

Программа

1. Договор. Как не попасть в впросак юридически и финансово?

2. Ошибки проектирования интерфейсов магазинов и сайтов.

3. Ошибки на этапах дизайна и верстки.

4. Ошибки программирования.

5. Тестирование и безопасность.

6. Гарантия и поддержка.

7. Вопросы и ответы.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Договор

• Нереальные сроки

• Неясные деньги

• Нереальные санкции

• Нет ответственных

Проектирование

• Нет целей• Нет прототипов• «Странная»

Платформа• Плохое ТЗ• Не учтена нагрузка• Нет тестов

Реализация

• Нет данных• > Сроки• < Контроль• Усложнение• Подводные

камни• Все и сразу

Тестирование

• Нет тестов на клиентах

• Нет проверок безопасности и качества

• Гарантия и поддержка

Типовые ошибки

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Как выбрать «правильную» веб-студию

Дано:1. Нужен сайт/магазин.2. Нет рекомендаций

от знакомых.3. Несколько/много веб-

студий.4. Нет ТЗ, есть краткое

описание проекта.

Выбираем:1. У студии есть адрес,

реквизиты.2. Есть фотографии

руководства/сотрудников.3. На сайте есть хотя бы один

неприятный отзыв клиента.4. Ищем отзывы в яндексе

или соцсетях/звоним клиентам.

5. Есть описание процесса работы.

6. Называют вилку цен и сроков, а не точные данные.

7. Не предлагают откаты.8. Высылают договор

и структуру ТЗ.9. Работают поэтапно.10.Есть похожие проекты.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Составляем «правильный» договор

Предусматриваем в договоре:1. Предмет – разработка сайта или

выполнение работ по сайту (в приложениях по договору).

2. ТЗ как приложение к договору или результат первого этапа.

3. Детальная смета и сроки – после первого этапа.

4. Прописаны случаи изменения цен в смете.5. Указана ответственность сторон за

нарушение сроков (досудебная).6. Прописан чужой копирайт.7. Указаны ответственные лица.8. Платежи разбиты на этапы, 50/50.9. Передача прав, исходных материалов,

документации.10.Гарантия.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Проектирование и ТЗЗачем нужен этот этап:1. Определяет четкие цели сайта и сценарии

поведения посетителей.2. Уменьшает стоимость проекта и вероятность

провала.3. Позволяет клиенту реально осознать проект,

а студии войти в курс. 4. Получаем детальную смета и точные сроки.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Прототипы

Ошибки проектирования:1. Нет четких целей и сценариев поведения посетителей.2. Забыли про мобильные устройства.3. Изобретаем велосипед сайт с нуля,

а не используем стандарты.4. Интерфейс проектирует клиент, а не студия.5. Усложнение функций/страниц сайта

без реальной необходимости.6. Нет в прототипах – нет на сайте.7. Не учитываются особенности CMS.8. Нет интерактивности в прототипах.9. Нет тестирования не реальных покупателях.10. Дизайнер не утверждает прототип.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Техническое задание

Ошибки этапа ТЗ:1. ТЗ составлено поверхностно, типа « а вот тут у нас

фильтр».2. Не описана структуры данных.3. Пишется без учета CMS.4. Не используются типовые компоненты «1С-Битрикс».5. Нет требований по нагрузке, скорости загрузке страниц,

тестам монитора качества «1С-Битрикс».6. Используются нереальные/не утвержденные данные

каталога товаров.7. Не описаны сценарии тестирования.8. ТЗ не читается/корректируется заказчиком.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Этап дизайна

www.infospice.ru

Ошибки этапа:1. Дизайн делает непрофессионал.2. Игнорируются цветовые влияния.3. Дизайн копируется у конкурента.4. Делается акцент на неважные блоки на

странице.5. Дизайн делается для «директора», а не для

клиента.6. Клиент не знает, чего хочет.7. Студия не проводит аналитику фирменного

стиля.8. Не учитываются реальные данные.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Этап верстки

Ошибки этапа верстки:1. Не пишется ТЗ на верстку.2. Верстка не тестируется в разных браузерах3. Верстка не проходит валидацию (html -

validator.w3.org , css - jigsaw.w3.org/css-validator/).

4. Не учитываются мобильные устройства.5. Не проверяется резиновость блоков.6. Нет сверки с дизайном Pixel Perfect (Firefox).7. Программисты не проверяют верстку.

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Программирование: как «не сесть в лужу»

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Этап программирования

Ошибки этапа:1. Нет реальных данных (по каталогу и т.п.). 2. Проект делают непрофессионалы.3. Проект делается весь и сразу,

а не по итерациям/версиям.4. Нет контроля качества кода.5. Не проверяется безопасность кода,

не настраивается проактивная защита в Битриксе.

6. Вносятся правки в ядро Битрикса.7. Не тестируется нагрузка.8. Проект не тестируется исполнителем/на

клиентах.9. Не закладывается время на

«неожиданности» и «додумки».

10.Сайт не подготовлен для поисковых систем.(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Контроль качества, безопасности. Аудит:1. Безопасность:

I. Настраиваем Проактивную защиту

в «1С-Битрикс»II. Проверяем сайт в

мониторе безопасности.

2. Качество1. Монитор качества

«1С-Битрикс».2. Внешняя проверка

качества.3. Аудит

1. От компании «1С-Битрикс».

Этап программирования

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Нагрузки:1. Средствами «1С-

Битрикс»:I. Монитор

производительности.II. Режим отладки.

2. Свои средства1. Написание

нагрузочных тестов.2. Внешняя проверка.

3. Аудит 1С-Битрикс.

Этап программирования

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Приемка сайта, гарантия, поддержка

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Приемка сайта:1. Принимайте по ТЗ.2. Привлекайте все заинтересованные отделы

компании.3. Пусть несколько лояльных клиентов за

бонус пройдутся по сценариям работы с сайтом/магазином.

4. Составляйте список багов и будущих доработок.

5. Обязательно проверьте работоспособность сайта после переноса на Ваш хостинг.

6. Битрикс должен быть последней версии и не иметь доступных стабильных обновлений.

7. Заложите в проект нужное на тестирование время.

Приемка сайта

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Кто отвечает по гарантии:1. Исполнитель дает гарантию на свой код.2. За движок «1С-Битрикс» отвечает

техподдержка «1С-Битрикс».

Как не лишится гарантии:3. Не правьте код Исполнителя или Ядро Битрикса.4. Делайте резервную копию сайта перед

правками.5. Уточняйте «гарантийность» по ТЗ.6. Используйте рекомендованный Битриксом

хостинг.7. Для корректной работы сайта инструмент

«Проверка сайта» в Битриксе не должен иметь «красных строк».

Гарантия

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Что входит в гарантийную поддержку Исполнителем:1. Исправление багов своего кода.2. Оптимизация скорости загрузки страниц.3. Доработка «забытого» функционала.

Как правильно писать в ТП «1С-Битрикс»:4. Сначала проверьте сайт инструментом

«Проверка сайта» и устраните неполадки. Установите последние обновления «1С-Битрикса».

5. Сначала почитайте учебные курсы и поищите на dev.1c-bitrix.ru.

6. Точно опишите проблему, приведите примеры, приложите скриншоты.

7. Предоставляйте админский доступ на сайт.8. Будьте вежливы и терпеливы .

Гарантия и техподдержка

(c) Интернет-агентство «Инфоспайс», инфоспайс.рф

Что дальше?

Первые шаги после запуска:1. Установите Яндекс.Метрику,

смотрите за аналитикой и поведением пользователей.

2. Добавляйте улучшающие опыт взаимодействия сервисы и элементы дизайна.

3. Анализруйте error_log.

Спасибо за внимание!

Контакты

Тел. 8 (499)501-61-37Отдел продаж – sales@infospice.ru

www.infospice.ruTwitter – www.twitter.com/infospice

Facebook – www.facebook.com/infospice Yotube www.yutube.com/user/okinfospice

Интернет-магазин Битрикс – www.infospice.ru/shop/