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

1. QA
Quality Assurance
Обеспечение качества

2. Что такое качество сайта?
• Мера удовлетворения потребностей
Заказчика или его ЦА (по сути, «полезность»)
• Мера соответствия ожиданиям
Часто субъективным, вроде «всѐ работает» или
«ничего не тупит»
• Мера исполнения требований
Объективных и зафиксированных в ТЗ

3. Эволюция требований
• Сайт не должен тупить
• …
• У пользователя с каналом 10+ Мбит/с и пингом
<30 мс до М9 некешированная версия главной
страницы вместе со всеми ресурсами, но без
учѐта асинхронной загрузки блока корзины через
AJAX, должна загружаться и полностью
рендериться в Chrome 28 не более, чем за 2,6 с
при работе сайта на гипервизорном VPS
заданной конфигурации

4. Что такое качественный сайт?
Это сайт, который не бесит ни
заказчика, ни его клиентов

5. Что такое качественный сайт?
Это сайт, над которым много работали

6. Что такое качественный сайт?
Это сайт, в котором всѐ предусмотрено

7. Что такое качественный сайт?
Сайт хороший, если никто не сомневается в
том, откуда растут руки у его создателей

8. Кто виноват? Что делать?

9. Чеклисты!

10. Правила хорошего чеклиста
• Все пункты независимы (циклы
недопустимы)
• Все формулировки однозначны
• За обеспечение каждого пункта
отвечает конкретный человек
• Возможна «двойная проверка»

11. Как внедрять?
• Какие-то требования у вас уже есть.
Просто запишите их
• Оставьте 10 главных пунктов для
начала
• Пройдитесь по существующим
проектам
• Расскажите и покажите коллегам

12. Аккаунт администратора
• Установите кастомное имя
пользователя (не admin) для UID1
• Установите кастомный пароль. И не из
этого набора:




admin
adminadmin
112233
qwerty
• Установите действующий e-mail

13. Защита от подбора
• Создайте отдельный аккаунт для
каждого, кто хоть как-то управляет
сайтом
• Сгенерируйте всем пароли
• Расслабьтесь, ведь в Drupal есть
таблица flood
• Установите flood_unblock, если заказчик
сам себя часто брутфорсит

14. Бэкапы
• Настройте резервное копирование
• Храните копии хотя бы в двух разных
местах
• Хотя бы иногда проверяйте, что бэкапы
успешно разворачиваются
• Вечно храните копию сайта в состоянии
«до переезда на prod» (или «до
передачи заказчику»)

15. Пользователи, роли, права
• Отключите регистрацию
• Удалите всех лишних из списка
пользователей
• Проверьте все права для роли
анонимов
• Настройте форматы ввода
(повнимательнее с better_formats)

16. Потенциальные опасности
• Проверьте, какие типы файлов
разрешено загружать
• Проверьте права на запись
• Обновите все модули и ядро
• Отключите лишние модули
• Установите security_review и проверьте
его отчѐт
• А также остальные отчѐты

17. Ошибки, логи, крон
• Проверьте лог watchdog
• Отключите вывод нотисов на экран и
ограничьте количество записей в dblog
• Если cron делает что-то тяжѐлое, то
настройте его ежечасное выполнение
или используйте ultimate_cron
• Отключите Devel и приберитесь за ним

18. settings.php
• Установите
$conf['maintenance_theme'] =
'mytheme'; в settings.php, если
будете останавливать боевой сайт
• Установите уникальный
$drupal_hash_salt, если
разворачиваете сайт из шаблона
• Можно использовать разные файлы
настроек для dev и prod

19. Контент
• Отключите комментарии в настройках
типов материалов
• Нигде в контенте не прописывайте
абсолютные ссылки. Поможет pathologic
• В именах файлов — только символы из
RFC1738. Поможет transliteration
• Под каждый пункт меню создайте
отдельную ноду-заглушку

20. Угадайте: на какой странице мы
находимся?

21. Контент
• Заполните «Информацию о сайте»
• В шапке, подвале, на страницах
контактов укажите актуальные
телефоны, адрес, почту заказчика
• Контакты в контент вставляйте через
token_custom (типа [custom:phone])
• Загрузите кастомный favicon, настройте
редирект на него с /favicon.ico

22. Контент
• Для WYSIWYG рекомендуем ckeditor
• Включите принудительную чистку кода
при вставке и форматирование кода,
поставьте imce для картинок
• Для удобной загрузки картинок в поля
используйте filefield_sources и
multiupload_imagefield_widget
• Создайте фильтр «FullHTML без
WYSIWYG»

23. Сайт в шаге от катастрофы

24. Вѐрстка
• Проверяйте на 1000px (на нѐм сидит 10%
пользователей)
• Chrome, FF, IE9+, Opera 12, Opera Mini
• Используйте виртуалки с образами от
modern.ie
• Поставьте расширение PixelPerfect
• Проверьте страницу со StyleGuide
• Не стыдитесь ручного регрессионного
тестирования

25. Жило-было на
сайте вполне
обычное
выпадающее
меню
Но однажды к
нему добавился
слайдер
картинок на
главной
странице…

26. Регрессионное тестирование — это не
сказка, а суровая необходимость

27. UX
• Установите кегль основного текста
страницы — не менее 12px в
«стандартных условиях»
• Сделайте логотип или название сайта
ссылкой на главную страницу
• Настройте хлебные крошки. Поможет
path_breadcrumbs или hansel
• Проверьте, как выглядят нотисы и
ошибки в формах

28. Производительность
• Включите кеширование. И почитайте
про кеш у @spleshka
• Включите агрегацию CSS/JS
• Проверьте время отдачи главной
страницы для анонима — должно быть
не более 500 мс
• Общий вес главной страницы со всеми
ресурсами — не более 2 МБ

29. Производительность
• Проверьте доступность из разных точек:
ping-admin.ru/free_test
• Протестируйте сайт с помощью
расширений YSlow и PageSpeed
• Протестируйте сайт с помощью
loadimpact.com и webpagetest.org

30. Настройка webform
• Во всех webform для оповещений
установите почту заказчика
• Отредактируйте тексты оповещений
• Для отладки используйте reroute_email
• Проверьте, что видит пользователь после
отправки формы?
• Защитите формы от ботов. Рекомендуем
simpleantispam от @xandeadx

31. SEO
• Закройте dev-версию от индексации
• Установите Яндекс.Метрику через
yandex_metrics (отключите
отслеживание админа)
• Настройте в самой Метрике цели
(посещение корзины, заполнение форм
и т.д.)

32. SEO
• Исключите лишнее из sitemap.xml
• Закройте служебные ноды через
rabbit_hole
• Перенастройте robots.txt для prodверсии (верните индексацию). Можно
использовать robotstxt
• Уменьшите Crawl-delay, пропишите
Sitemap и Host

33. SEO
• Установите redirect, но потом
опасайтесь зацикленных ссылок
• Для поиска битых ссылок используйте
linkchecker
• На любом сайте ставьте pathauto и
globalredirect
• Настройте разные шаблоны адресов
для разных типов материалов

34. Что бывает без pathauto

35. SEO
• Установите metatag и path_metatags
• Убедитесь, что корректные мета-теги
прописаны для главной страницы и для
всех вьюх
• Убедитесь, что в <h1> выводится только
нод-тайтл, других <h1> на странице не
должно быть

36. Привязка к домену
• Смените ключи API для Mollom, Akismet
и пр.
• Подключите сайт к панелям вебмастеров Яндекса и Google
• Если у вас есть кнопка лайков от
VK, обновите приложение под боевой
домен
• Ещѐ раз проверьте robots.txt

37. Где/чем создавать чеклисты?
• «Add Checklist» при редактировании
карточки в trello.com
• «Задачи» в Gmail
• qa_checklist, но лучше сделать свой
собственный список на базе checklistapi
• checkvist.com (платный)
• checklists.ru (пока сырой)

38. Чеклисты в Trello

39. Что почитать?
• Роман Савин.
Тестирование DOT COM
или Пособие по жестокому
обращению с багами в
интернет-стартапах
• natalyarukol.ru
• software-testing.ru
• habrahabr.ru/post/111829

40. Спасибо! Вопросы?
Алексей Костин
PM в агентствах «Завтрасайт» и «Интернетмаркетологи». Привет нашей команде!
kostin@zavsite.ru
@kostin