Что, зачем и каким образом следует проверять и...

QAQuality Assurance

Обеспечение качества

Что такое качество сайта?

• Мера удовлетворения потребностей Заказчика или его ЦА (по сути, «полезность»)

• Мера соответствия ожиданиямЧасто субъективным, вроде «всё работает» или «ничего не тупит»

• Мера исполнения требованийОбъективных и зафиксированных в ТЗ

Эволюция требований

• Сайт не должен тупить• …• У пользователя с каналом 10+ Мбит/с и

пингом <30 мс до М9 некешированная версия главной страницы вместе со всеми ресурсами, но без учёта асинхронной загрузки блока корзины через AJAX, должна загружаться и полностью рендериться в Chrome 28 не более, чем за 2,6 с при работе сайта на гипервизорном VPS заданной конфигурации

Что такое качественный сайт?

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

Что такое качественный сайт?

Это сайт, над которым много работали

Что такое качественный сайт?

Это сайт, в котором всё предусмотрено

Что такое качественный сайт?

Сайт хороший, если никто не сомневается в том, откуда растут руки у его создателей

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

Чеклисты!

Правила хорошего чеклиста• Все пункты независимы (циклы

недопустимы)• Все формулировки однозначны• За обеспечение каждого пункта

отвечает конкретный человек• Возможна «двойная проверка»

Как внедрять?

• Какие-то требования у вас уже есть. Просто запишите их

• Оставьте 10 главных пунктов для начала

• Пройдитесь по существующим проектам

• Расскажите и покажите коллегам

Аккаунт администратора

• Установите кастомное имя пользователя (не admin) для UID1

• Установите кастомный пароль. И не из этого набора: admin adminadmin 112233 qwerty

• Установите действующий e-mail

Защита от подбора

• Создайте отдельный аккаунт для каждого, кто хоть как-то управляет сайтом

• Сгенерируйте всем пароли• Расслабьтесь, ведь в Drupal есть

таблица flood• Установите flood_unblock, если

заказчик сам себя часто брутфорсит

Бэкапы

• Настройте резервное копирование• Храните копии хотя бы в двух

разных местах• Хотя бы иногда проверяйте, что

бэкапы успешно разворачиваются• Вечно храните копию сайта в

состоянии «до переезда на prod» (или «до передачи заказчику»)

Пользователи, роли, права

• Отключите регистрацию• Удалите всех лишних из списка

пользователей• Проверьте все права для роли

анонимов• Настройте форматы ввода

(повнимательнее с better_formats)

Потенциальные опасности

• Проверьте, какие типы файлов разрешено загружать

• Проверьте права на запись• Обновите все модули и ядро• Отключите лишние модули• Установите security_review и

проверьте его отчёт• А также остальные отчёты

Ошибки, логи, крон

• Проверьте лог watchdog• Отключите вывод нотисов на экран и

ограничьте количество записей в dblog

• Если cron делает что-то тяжёлое, то настройте его ежечасное выполнение или используйте ultimate_cron

• Отключите Devel и приберитесь за ним

settings.php

• Установите $conf['maintenance_theme'] = 'mytheme'; в settings.php, если будете останавливать боевой сайт

• Установите уникальный $drupal_hash_salt, если разворачиваете сайт из шаблона

• Можно использовать разные файлы настроек для dev и prod

Контент

• Отключите комментарии в настройках типов материалов

• Нигде в контенте не прописывайте абсолютные ссылки. Поможет pathologic

• В именах файлов — только символы из RFC1738. Поможет transliteration

• Под каждый пункт меню создайте отдельную ноду-заглушку

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

Контент

• Заполните «Информацию о сайте»• В шапке, подвале, на страницах

контактов укажите актуальные телефоны, адрес, почту заказчика

• Контакты в контент вставляйте через token_custom (типа [custom:phone])

• Загрузите кастомный favicon, настройте редирект на него с /favicon.ico

Контент

• Для WYSIWYG рекомендуем ckeditor• Включите принудительную чистку

кода при вставке и форматирование кода, поставьте imce для картинок

• Для удобной загрузки картинок в поля используйте filefield_sources и multiupload_imagefield_widget

• Создайте фильтр «FullHTML без WYSIWYG»

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

Вёрстка

• Проверяйте на 1000px (на нём сидит 10% пользователей)

• Chrome, FF, IE9+, Opera 12, Opera Mini• Используйте виртуалки с образами от

modern.ie• Поставьте расширение PixelPerfect• Проверьте страницу со StyleGuide• Не стыдитесь ручного

регрессионного тестирования

Жило-было на сайте вполне обычное выпадающее меню

Но однажды к нему добавился слайдер картинок на главной странице…

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

UX

• Установите кегль основного текста страницы — не менее 12px в «стандартных условиях»

• Сделайте логотип или название сайта ссылкой на главную страницу

• Настройте хлебные крошки. Поможет path_breadcrumbs или hansel

• Проверьте, как выглядят нотисы и ошибки в формах

Производительность

• Включите кеширование. И почитайте про кеш у @spleshka

• Включите агрегацию CSS/JS• Проверьте время отдачи главной

страницы для анонима — должно быть не более 500 мс

• Общий вес главной страницы со всеми ресурсами — не более 2 МБ

Производительность

• Проверьте доступность из разных точек: ping-admin.ru/free_test

• Протестируйте сайт с помощью расширений YSlow и PageSpeed

• Протестируйте сайт с помощью loadimpact.com и webpagetest.org

Настройка webform

• Во всех webform для оповещений установите почту заказчика

• Отредактируйте тексты оповещений• Для отладки используйте reroute_email• Проверьте, что видит пользователь

после отправки формы?• Защитите формы от ботов.

Рекомендуем simpleantispam от @xandeadx

SEO

• Закройте dev-версию от индексации

• Установите Яндекс.Метрику через yandex_metrics (отключите отслеживание админа)

• Настройте в самой Метрике цели (посещение корзины, заполнение форм и т.д.)

SEO

• Исключите лишнее из sitemap.xml• Закройте служебные ноды через

rabbit_hole• Перенастройте robots.txt для prod-

версии (верните индексацию). Можно использовать robotstxt

• Уменьшите Crawl-delay, пропишите Sitemap и Host

SEO

• Установите redirect, но потом опасайтесь зацикленных ссылок

• Для поиска битых ссылок используйте linkchecker

• На любом сайте ставьте pathauto и globalredirect

• Настройте разные шаблоны адресов для разных типов материалов

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

SEO

• Установите metatag и path_metatags

• Убедитесь, что корректные мета-теги прописаны для главной страницы и для всех вьюх

• Убедитесь, что в <h1> выводится только нод-тайтл, других <h1> на странице не должно быть

Привязка к домену

• Смените ключи API для Mollom, Akismet и пр.

• Подключите сайт к панелям веб-мастеров Яндекса и Google

• Если у вас есть кнопка лайков от VK, обновите приложение под боевой домен

• Ещё раз проверьте robots.txt

Где/чем создавать чеклисты?

• «Add Checklist» при редактировании карточки в trello.com

• «Задачи» в Gmail• qa_checklist, но лучше сделать свой

собственный список на базе checklistapi

• checkvist.com (платный)• checklists.ru (пока сырой)

Чеклисты в Trello

Что почитать?

• Роман Савин. Тестирование DOT COM или Пособие по жестокому обращению с багами в интернет-стартапах

• natalyarukol.ru• software-testing.ru• habrahabr.ru/post/11182

9

Спасибо! Вопросы?

kostin@zavsite.ru

@kostin

Алексей КостинPM в агентствах «Завтрасайт» и «Интернет-маркетологи». Привет нашей команде!