Слайд 2Зачем это нужно?
Клиентам: повышение продаж
Разработчикам: …повышение продаж!
![Зачем это нужно? Клиентам: повышение продаж Разработчикам: …повышение продаж!](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-1.jpg)
Слайд 3Что нужно сделать
Что такое usability?
ISO 9241-11 (1998) Guidance on Usability:
The extent to
![Что нужно сделать Что такое usability? ISO 9241-11 (1998) Guidance on Usability:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-2.jpg)
which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use
Перевод из ru.wikipedia.org:
«cтепень, в которой продукт может быть использован определёнными пользователями при определённом контексте использования для достижения определённых целей с должной эффективностью, продуктивностью и удовлетворённостью»
Слайд 4Что нужно сделать
Usability в применении к интернет-системам означает, что:
Информация должна быть
Информация должна
![Что нужно сделать Usability в применении к интернет-системам означает, что: Информация должна](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-3.jpg)
быть находима
Информация должна быть используема
Слайд 5Что нужно сделать
Следовательно, при разработке вы должны:
Определить, что должно быть на сайте,
![Что нужно сделать Следовательно, при разработке вы должны: Определить, что должно быть](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-4.jpg)
исходя из интересов ЦА, а не кого-либо еще (см. определение usability)
Построить систему навигации так, чтобы она обладала прозрачностью и предсказуемостью
Построить контент (и тексты, и сервисы) так, чтобы он был удобен в использовании (см. определение usability)
Слайд 6Как это сделать: в ходе разработки
Выделенный usability-специалист или распределенные знания?
Выделенный специалист по
![Как это сделать: в ходе разработки Выделенный usability-специалист или распределенные знания? Выделенный](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-5.jpg)
взаимодействию системы и пользователя – идеальный вариант
Но таких почти нет
Поэтому остается распределить знания по технологической цепочке
Слайд 7Как это сделать: в ходе разработки
Выполнять анализ и проектирование
Собирать данные о ЦА
![Как это сделать: в ходе разработки Выполнять анализ и проектирование Собирать данные](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-6.jpg)
Если этого не делать, состав вашей системы будет «из головы»
Подсказка: как ведет себя ЦА, конкуренты знают лучше маркетологов; загляните на http://www.archive.org/
Проектировать интерфейсы
Проектируют интерфейсы не разработчики
и даже не дизайнеры
Использовать разумных дизайнеров
Которые подчинят свою фантазию суровой необходимости
…и при этом сделают классный дизайн
Слайд 8Как это сделать: в ходе разработки
Разработчики, понимающие принципы usability, очень помогают
Разработчики 1С-Битрикс
![Как это сделать: в ходе разработки Разработчики, понимающие принципы usability, очень помогают](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-7.jpg)
и Влад Головач
Слайд 9Как это сделать: в ходе разработки
Помнить про «мелочи»:
Технический дизайн
Контент
Обучение
![Как это сделать: в ходе разработки Помнить про «мелочи»: Технический дизайн Контент Обучение](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-8.jpg)
Слайд 10Как это сделать: в ходе разработки
«Хозяйке на заметку»:
Готовить стили для всех текстовых
![Как это сделать: в ходе разработки «Хозяйке на заметку»: Готовить стили для](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-9.jpg)
элементов
Готовить изображения
Думать над использованием компонент для повторяющихся элементов
Обрабатывать файлы (пиктограмма, размер)
Помнить про обработку ошибок, в частности, 404
Следить за валидностью карты сайта
Контакты в футере должны быть!
Ссылка на главную должна быть и должна быть легко находима
«Хлебные крошки»
Индикация обязательных полей в формах и сохранение пользовательских данных
…и многое другое
Слайд 11Как это сделать: после разработки
Сделанный сайт – это готовый микроскоп.
Гвозди им
![Как это сделать: после разработки Сделанный сайт – это готовый микроскоп. Гвозди им еще надо забить.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-10.jpg)
еще надо забить.
Слайд 12Как это сделать: после разработки
Все, кто управляет сайтом:
должны быть обучены
должны знать ЦА
![Как это сделать: после разработки Все, кто управляет сайтом: должны быть обучены](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-11.jpg)
и то, как сайт на ЦА воздействует
должны писать по-русски
Слайд 13Как это сделать: после разработки
"Приятные мелочи" - заранее заданные стили оформления текста,
![Как это сделать: после разработки "Приятные мелочи" - заранее заданные стили оформления](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-12.jpg)
изображений, различных ссылок, согласованные основные принципы подачи контента (например, "Вы/вы/ты")
Слайд 14Как это сделать: после разработки
Поведение системы нужно изучать и корректировать
Статистика: обязательно настройте
![Как это сделать: после разработки Поведение системы нужно изучать и корректировать Статистика:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/463697/slide-13.jpg)
«Веб-аналитику»!
Наблюдение за пользователями
Готовность к доработкам и изменениям: мы уже не в XX веке