Веб-дизайн и юзабилити

Профессии

• Информационный архитектор
• Веб-дизайнер
• Юзабилити-инженер
• Верстальщик веб-страниц
• Программист
• Тестировщик
• Поисковый оптимизатор
• Копирайтер (писатель)
• Контент-менеджер

• Информационная архитектура — сочетание схем организации, предметизации и навигации, реализованных в информационной системе.

• Веб-дизайн  — отрасль веб-разработки, в задачи которой входит проектирование пользовательских веб-интерфейсов для сайтов.

Веб-дизайнеры проектируют логическую структуру веб-страниц, продумывают наиболее удобные решения подачи информации и занимаются художественным оформлением веб-проекта.

• Юзабилити — это научно-прикладная дисциплина, занимающаяся по­вышением эффективности, продуктивности и удобства пользова­ния инструментами деятельности. От эргономики юзабилити отличает заинтересованность в эффективности работы пользователя (потребителя), а не человеко-машинной системы в целом.

• Вёрстка веб-страниц  — создание структуры html-кода, размещающего элементы веб-страницы (изображения, текст и т. д.) в окне браузера, согласно разработанному макету, таким образом, чтобы элементы дизайна выглядели аналогично макету

• Web-программист – это профессионал в сфере компьютерных технологий, а если быть точнее, в области web-программирования. Его основная задача – претворять в жизнь разработки web-дизайнеров, создавая качественные и функциональные сайты. Для этого ему необходимо знать JAVA, HTML, РНР, JAVAScript, Perl, CGI .
• Тестировщик  — специалист, занимающийся тестированием. В его обязанность входит поиск вероятных ошибок и сбоев в функционировании сайта. 

• Поисковая оптимизация (SEO) — комплекс мер для поднятия позиций сайта в выдаче поисковых запросов пользователей, с целью увеличения сетевого трафика и потенциальных клиентов.
• Контент-менеджер  — редактор сайтов. В обязанности контент-менеджера входит наполнение сайта текстовой, графической и другими видами информации
• Копирайтинг  — профессиональная деятельность по написанию рекламных и презентационных текстов. 

Веб-дизайнер

Юзабилити-инженер

Верстальщик веб-страниц

Веб-дизайнер

Информационный архитектор

Верстальщик веб-страниц

Программист

Тестировщик

Программист

Frontend - разработчик

Веб-разработчик Веб-мастер

Поисковый оптимизатор

Копирайтер (писатель)

SMM, SMO менеджер

Сeo менеджер

Копирайтер (писатель)

Контент-менеджер

Верстальщик веб-страниц

Программист

Контент-менеджер

Что такое Web-дизайн?

• Содержимое. Сюда входят форма и организация содержимого сайта.
• Зрительные образы. Это относится к компоновке экранного пространства на сайте. Создается с помощью HTML, CSS, Flash.
• Технология. HTML ,CSS , WEB-программирование (JavaScript, PHP).
• Доставка. Скорость и безотказность доставки сайта по сети Internet.
• Назначение. Причина, по которой сайт существует.

Визуальные классификации

• Тексто-ориентированные

Визуальные классификации

• Сайты в стиле GUI

Визуальные классификации

• Метафорические сайты

Визуальные классификации

• Экспериментальные сайты

Цветовая схема– три цвета, задающие текст, ссылки и фон (все текстовые элементы должны хорошо читаться на странице!). 

Все страницы должны оформляться в едином стиле (посетитель должен понимать что он находится на вашем сайте, а не перешел на другой).

Предусмотрите для посетителя возможность перехода с любой страницы на главную (дабы не заблудиться в дебрях информации). 

Для всех изображений используйте альтернативный текст, т.к. многие пользователи отключают графику.

Для привлечения посетителей все средства хороши, но во всем нужна мера, всегда больше привлекает строгий, выдержанный стиль, а не «новогодние фейерверки»!

Баланс формы и функции

• Обеспечьте связь внешнего вида сайта и его назначения
• Исполнение сайта должно быть безукоризненным или практически безупречным
• Выполняйте разработки для среднестатистического пользователя, но учитывайте различия
• Высказывайте должное уважение к соглашениям, связанным с графическим пользовательским интерфейсом
• Не существует никакого «правильного» WEB-дизайна, подходящего для любого сайта

Дизайн, ориентированный на пользователя

• Общепринятая ошибка, совершаемая при Web-разработке, состоит в том, что слишком часто сайты создаются скорее для дизайнеров и удовлетворения их нужд, чем для непосредственных пользователей.
• Вы- не пользователь
• Пользователи не дизайнеры

Юзабилити

• Юзабилити - (англ. usability — дословно «возможность использования) - удобство использования сайта с точки зрения посетителей.

Знакомимся ближе

Какова основная задача у юзабилити продающего сайта?

От чего зависит юзабилити сайта?

Что зависит от юзабилити сайта?

Структура

Дизайн

Наполнение

ЮЗАБИЛИТИ

Посетитель сайта

Покупатель продукта

Удобство

Доступность

Скорость

восприятия

информации

работы

SEO

Юзабилити сайта: общие рекомендации

• Стремитесь к логичности во всех деталях создаваемого сайта;

• Любой диалог должен быть законченным;

• Принцип Поретто: для 80% посетителей полезным окажется 20% сайта;

• Указывайте больше вариантов связи с вами: Тел., Факс, E-mail, Skype, ICQ;

• Есть правило, чем больше у человека данных и чем меньше ему нужно переходить со страницы на страницу, тем проще ему принять решение о покупке.

Основные правила:

1. Скорость

Скорость загрузки вашего ресурса – это основа основ. Чем дольше загружается страница, тем больше вероятность того, что пользователь не дождется ее завершения.

Основные правила:

2. Простота навигации (не менее важна чем скорость загрузки).

Если страница загрузилась очень быстро, но вы не можете понять, куда направляться дальше — ресурс непродуктивный, большой процент отказов.

Вообще, навигация — это, пожалуй, самый сложный и ответственный этап проектирования сайта, так что относиться к нему следует с должным уважением. Навигация на сайте должна быть прозрачна и очевидна – что бы даже самый неопытный пользователь разобрался, как

найти необходимую ему

информацию.

Основные правила:

3. Оптимизация для мобильных устройств

Основные правила:

4. Использование социальных медиа

-вид массовой коммуникации, осуществляемый посредством Интернет ).

Виды Социальных медиа:

• Интернет-сообщества;
• Блоги;
• Виртуальные игры;
• Социальные сети;
• Сообщества по производству совместного контента;
• Совместные проекты;
• Геосоциальные сервисы.

Основные правила:

5. Фирменный стиль

Сделайте из своего ресурса бренд. Не рекомендуется качать бесплатные шаблоны, использовать бесплатные клип-арты (набор графических элементов дизайна для составления целостного графического дизайна). Лучше заказать дизайн у профессионала (примерно 20000 рублей).

Основные правила:

6. Поиск

Поставьте его на самое видное место, желательно рядом с навигацией. Им пользуются и довольно активно. Хорошо организованный поиск = увеличение просмотра страниц и уменьшение количества отказов.

Основные правила:

7. Правильная расстановка ключевых слов

Не следует помещать ключевые слова в каждое предложение. Пишите так, чтобы было интересно и полезно. Люди приходят за информацией, а не за тем, что бы узнать всевозможные вариации того или иного слова или термина.

Основные правила:

8. Грамотное расположение элементов на странице

Большие информативные заголовки, иконки социальных сетей на видном месте, а не в «тазной области сайта», контрастный текст и цепляющие изображения – пожалуй вот он, секрет успеха.