Тестирование вёрсткиТестирование вёрсткиРекомендации для разработчиков и Рекомендации для разработчиков и QAQA

по тестированию по тестированию XHTML/CSS/JS XHTML/CSS/JS

прототиповпрототипов

Алексей РыбаковАлексей РыбаковРазработчик интерфейсовРазработчик интерфейсовalex@flack.rualex@flack.ru

www.rit2007.ru

СодержаниеСодержание

1). Соответствие реализации дизайн-прототипам

2). Браузеры

3). Разрешение экрана

4). Доступность 4.1). Навигация по сайту с отключенной графикой 4.2). Навигация по сайту с отключенным javascript’ом или flash’ем4.3). Размер шрифта

5). Формы 5.1). Работоспособность 5.2). Доступность

6). Соответствие стандартам 6.1). Автоматизация валидации

7). Идеальный баг-репорт

www.rit2007.ru

Соответствие дизайнуСоответствие дизайну

Цвета Шрифты Размеры и отступы элементов Поведение при изменении размеров окна браузера Поведение ссылок (hover, visited, etc.) Качество нарезки графики

www.rit2007.ru

БраузерыБраузеры

Градация по уровням поддержки

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

Второй уровень — допускает пропуск несущественных ошибок в оформлении и акцентирован на полную доступность всей информации, представленной на сайте. Приоритет — средний.

www.rit2007.ru

БраузерыБраузеры

Первый уровень:

Internet Explorer 5.0 Internet Explorer 5.5 Internet Explorer 6.0 Internet Explorer 7.0 Opera 9 Firefox 2 Safari 2

Второй уровень:

Opera 7.5, 8.5 Netscape 8 Mozilla 1.7.8 Konqueror 3.5

www.rit2007.ru

БраузерыБраузеры

Старые версии браузеров можно найти по следующим адресам:

http://releases.mozilla.org/pub/mozilla.org/firefox/releases/ (Firefox) http://releases.mozilla.org/pub/mozilla.org/mozilla/releases/ (Mozilla) http://arc.opera.com/pub/opera/win/ (Opera) http://browser.netscape.com/ns8/download/archive.jsp (Netscape) http://tredosoft.com/Multiple_IE (Internet Explorer) http://www.michelf.com/projects/multi-safari/ (Safari)

www.rit2007.ru

Разрешение экранаРазрешение экрана

Размеры и отступы элементов Поведение текста (неудачные переносы, etc.) Поведение графики (коллажи, etc.) Заданная минимальная ширина макета

Приоритет — от среднего до максимального.

www.rit2007.ru

ДоступностьДоступность

Навигация по сайту с отключенной графикой

Зарезервированное под изображения пространство Возможность навигации (графические меню) Наличие осмысленного альтернативного текста для

изображений, несущих информацию

Приоритет — от среднего до максимального.

www.rit2007.ru

ДоступностьДоступность

www.rit2007.ru

ДоступностьДоступность

www.rit2007.ru

ДоступностьДоступность

Навигация по сайту с отключенным javascript’ом или flash’ем

Возможность работы с формами Возможность навигации (попапы, etc.) Доступность всей информации Сохранение целостности макета

Приоритет — от среднего до максимального.

www.rit2007.ru

ДоступностьДоступность

Размер шрифта

Минимальное представление текста в виде графики Целостность макета при увеличении размера шрифта:

до «Largest» в Internet Explorer На два шага по «CTRL-+» в Firefox

Приоритет — средний.

www.rit2007.ru

ФормыФормы

Работоспособность

Валидация полей Возможность использования и отправки форм

Приоритет — максимальный.

www.rit2007.ru

ФормыФормы

Доступность

Работоспособность label’ов

Работа с клавиатуры

Приоритет — низкий.

www.rit2007.ru

Автоматизация валидацииАвтоматизация валидации

Технические требования

Apache Ant 1.6.5 или выше wget validate.xml validate.cmd папка /dtd

www.rit2007.ru

Автоматизация валидацииАвтоматизация валидации

Запуск

validate http://your.url.here

www.rit2007.ru

Автоматизация валидацииАвтоматизация валидации

Результат

Файл _errors.txt[xmlvalidate] C:\1\site\contact\index.html:38:84: Attribute

"name" must be declared for element type "form".

[xmlvalidate] C:\1\site\contact\index.html:66:50: Element type "select" must be followed by either attribute specifications, ">" or "/>".

[xmlvalidate] C:\1\site\introduce\benefits.asp.html:25:86: Attribute "alt" is required and must be specified for element type "img".

[xmlvalidate] C:\1\site\introduce\benefits.asp.html:26:295: Invalid byte 1 of 1-byte UTF-8 sequence.

etc.

www.rit2007.ru

Идеальный баг-репортИдеальный баг-репорт

Структура

Название репортаКонтент-навигация. Некорректное поведение фонового изображения пункта списка при увеличении шрифта

Тактико-технические характеристикиDownloads page — Firefox 2.0.0.2 — 1280*1024 — Text size: 2x«Ctrl-+»

Скриншот

ПриоритетСредний