1 of 19

Правила ергономічного розміщення відомостей на веб-сторінці

За навчальною програмою 2018 року

Урок 29

10

(11)

2 of 19

Актуалізація опорних знань і життєвого досвіду

Розділ 5 § 29

Пропоную визначити свої асоціації до слова «ергономіка».

10�(11)

3 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Дизайн веб-сайту, як і дизайн комп'ютерних презентацій, базується на законах:

Композиції

Колористики

Ергономіки

10�(11)

4 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Вимоги до ергономіки веб-сайту обумовлені призначенням сайтів та особливостями сприйняття відомостей, що подаються у вікні браузера.

У процесі створення веб-сайту важливо спланувати його структуру так, щоб користувачам Інтернету було максимально зручно працювати з вашим сайтом.

10�(11)

5 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Ергономіка — це наука, яка вивчає особливості виробничої діяльності людини з метою забезпечення ефективності, безпеки та зручності цієї діяльності.

Ергономічний сайт — це сайт, що забезпечує необхідні зручності відвідувачеві, зменшує фізичну та психологічну втому, зберігає здоров'я та працездатність.

10�(11)

6 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Складовою частиною ергономіки сайту є ступінь зручності та простоти веб-сайтів у використанні для користувача без потреби проходження спеціального навчання.

Будь-яка людина повинна мати можливість інтуїтивно пов'язувати дії, які потрібно виконати на веб-сторінці, з об'єктами, що вона бачить.

10�(11)

7 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Під час розробки структури веб-сторінок потрібно:

  • подавати відомості у зрозумілій і стислій формі;
  • пропонувати кілька посилань для переходу на одну й ту саму сторінку, щоб забезпечити кожному користувачу можливість вибрати найбільш зручне або очевидне;
  • усувати будь-яку двозначність щодо наслідків дій після вибору елементів керування на веб-сторінці.

10�(11)

8 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Ергономіка сайту стосується:

Розміщення

відомостей на

веб-сторінках

Системи

навігації

Оформлення

сторінок

Швидкості їх

завантаження

10�(11)

9 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Наведемо опис критеріїв, за якими оцінюється ергономічність веб-сторінок.

Критерії оцінювання ергономічності веб-сторінок

Назва сайту — в заголовку всіх сторінок.

На будь-якій сторінці можна чітко бачити, до якого тематичного розділу вона входить.

Найважливіші відомості — на початку сторінки.

Колонок з контентом — не більше ніж три.

Не допустимі горизонтальні смуги прокручування під час перегляду веб-сторінки.

Нижній колонтитул (підвал) дублює меню, зазначає авторські права (копірайт) дизайнера сайту, містить контактні дані власника ресурсу та дизайнера

Розташування відомостей на сторінці

Опис

Критерій

10�(11)

10 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Критерії оцінювання ергономічності веб-сторінок

З будь-якої сторінки є можливість перейти до перегляду головної (домашньої) веб-сторінки сайту.

Сайт має не більше ніж три рівні вкладеності веб-сторінок. Меню сайту — велике та помітне, легке в розумінні. Гіперпосилань в одному блоці навігації — не більше ніж 7, інші – у вкладених меню або інших блоках.

Кнопки крупні, зі зрозумілими підписами або зображеннями. Гіперпосилання в тексті чітко відрізняються від решти контенту. На сторінках з великим обсягом тексту присутні засоби для навігації усередині веб-сторінки

Зручність навігації

Опис

Критерій

10�(11)

11 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Критерії оцінювання ергономічності веб-сторінок

Єдиний стиль оформлення та компоновки матеріалу на всіх сторінках.

Кольори фону сторінки та тексту контрастні.

Заголовки статей виділено шрифтом збільшеного розміру.

Текст статей вирівняно за шириною.

Якісні зображення, з можливістю збільшення для перегляду.

Мінімум анімованих зображень, що відволікають увагу.

Порожній простір (поля) навколо тексту та зображень

Оформлення

Опис

Критерій

Час завантаження сторінки — якомога менший.

Зображення — оптимізовані для веб-простору, бажано не більше ніж 40 Кбайт

Швидкість завантаження

10�(11)

12 of 19

Ергономіка розміщення�об'єктів на веб-сторінці

Розділ 5 § 29

Під час розробки веб-сайту потрібно враховувати можливість надання зручності для користувачів з особливими потребами. Для цього варто звертати увагу на таке:

  • розмір шрифту повинен бути достатнім, щоб без масштабування сторінок його змогли прочитати без напруження зору більшість користувачів; для людей з вадами зору бажано надавати можливість змінення розміру шрифту;
  • зображення повинні мати підписи та текст заміщення, щоб люди з вадами зору змогли зорієнтуватися у змісті зображення;
  • за можливості додавати на веб-сторінки елементи, що озвучують важливі відомості на сайті.

10�(11)

13 of 19

Для тих, хто хоче знати більше

Розділ 5 § 29

Новим піонером медіа називають Якоба Нільсена (нар. 1957 р.) — датського вченого, одного з провідних консультантів з ергономіки сайтів, доктора наук наукового напряму людино-комп'ютерної взаємодії Технічного Університету Данії в Копенгагені.

Якоб Нільсен

10�(11)

14 of 19

Для тих, хто хоче знати більше

Розділ 5 § 29

Він має 79 патентів США, більшість з яких отримано за винаходи з полегшення використання веб-ресурсів. На основі методу евристичної оцінки, який він винайшов, здійснюється ергономічний аудит веб-сайтів для поліпшення користувацького інтерфейсу.

10�(11)

15 of 19

Розгадайте ребус

Ергономіка

Розділ 5 § 29

10�(11)

16 of 19

Запитання для рефлексії

Розділ 5 § 29

  1. Що нового я дізнався на уроці?
  1. Чи була для мене корисна інформація?
  1. Чи задоволений я результатом роботи на уроці?
  1. Які питання я хочу вивчити під час самоосвіти?

10�(11)

17 of 19

Домашнє завдання

Розділ 5 § 29

Розмістити матеріал у соціальній мережі. Проаналізувати коментарі та поради

10�(11)

18 of 19

Працюємо за комп’ютером

Розділ 5 § 29

10�(11)

19 of 19

Дякую за увагу!

За навчальною програмою 2018 року

Урок 29

10

(11)