Вибір інформаційної архітектури

Проектування структури сайту

Після визначення мети створення сайту можна розпочинати проектування структури сайту, насамперед його системи навігації. Якщо відвідувач не зуміє зорієнтуватись у ній, він просто залишить веб-сайт. Тому варто подумати над схемою гіперпосилань, які поєднають окремі сторінки в одне ціле.

Термін навігація означає систему, схему пересування у просторі. Цим терміном можна назвати схему пересування інформаційним простором як усього Інтернету, так і окремого сайту.

Кожен веб-сайт повинен містити відомості про автора, контактну інформацію, а також повідомлення про права інтелектуальної власності на вміст ресурсу. Корисним є повідомлення про дату останнього оновлення веб-сайту: це допомагає відвідувачам оцінити достовірність, надійність та актуальність наведеної інформації.

Вибір інформаційної архітектури

Інформаційна архітектура сайту — це сукупність методів та способів створення структури з веб-сторінок.

Можна виділити такі різновиди інформаційних архітектур сайту.

- Все в одному. Це найпростіша модель: всю інформацію розміщують на одній сторінці (рис. 7.9). Якщо матеріалу для сайту не дуже багато і його можна розмістити на одній сторінці, то зазвичай так і слід зробити — не варто ускладнювати структуру вигаданими розділами та непотрібними гіперпосиланнями. Проте на такій сторінці обов'язково потрібно розмістити всю необхідну інформацію, зокрема контактну.

- Однорівнева модель. Всі сторінки є рівнозначними, і на кожну можна перейти з будь-якої іншої (рис. 7.10). Це найпоширеніша модель для простих сайтів, які містять невелику кількість розділів, наприклад, «Головна сторінка», «Про нас», «Контакти», «Товари».

- Ромашка. Ця модель є корисною для подання чітких лінійних залежностей, коли одна дія чітко має йти за іншою, а всі вони в будь-якому разі починатимуться на головній сторінці (рис. 7.12). Прикладом сайту з такою структурою є сервіс електронної пошти, де відвідувач може створити лист, а у процесі його написання прикріпити до нього файл. Цю дію не можна виконувати на головній сторінці, а лише після переходу до написання листа.

- Чітка ієрархія. На сторінку нижчого рівня можна потрапити лише через її «батька» (рис. 7.13). Прикладом використання такої архітектури є сайт розподілу офісів певної компанії по містах України, адже кожен офіс може бути розташований лише в одному місті. Так само і гілка обговорень у форумі стосується однієї теми, водночас одна тема може мати кілька гілок обговорення.

- Багатовимірна ієрархія. За такої організації вмісту сайту відвідувач може знайти той самий матеріал різними способами, тобто реалізовано кілька ієрархій, які перетинаються між собою (рис. 7.14). Типовим прикладом такої архітектури є сайт Амазон (http://www. amazon.com/), за допомогою якого виконувати пошук книжки можна за жанром, автором чи назвою твору.

- Пошукова система. Функція пошуку часто може бути використана як навігаційна можливість чи елемент архітектури (рис. 7.15). Відвідувачу на головній сторінці сайту пропонують виконати пошук, після чого йому надають перелік сторінок сайту, що відповідають заданим критеріям. Це дає змогу відразу переходити до шуканих матеріалів, не користуючись ієрархіями чи індексами. Проте така функція потребує досить якісного пошукового механізму, який має бути вбудований у сайт.

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

• доступність — навігація є одним із найважливіших елементів будь-якої сторінки, тому необхідно зробити її доступною в будь-який момент, тобто навігація має бути реалізована (або принаймні дубльована) простими HTML-кодами, а не ефектами Flash, Java, JavaScript, які можуть відтворюватися не на всіх комп'ютерах відвідувачів;

• ЗМІСТОВНІСТЬ — ЗМІСТ гіперпосилань має відповідати змісту ресурсів, на які вони посилаються, щоб людина, яка вперше потрапила на сайт, розуміла його структуру;

• видимість — гіперпосилання повинні виділятися з навколишніх елементів у певний спосіб;

• цілісність — можливість навігації слід реалізувати на всіх сторінках сайту (не обов'язково за допомогою однакових меню, але засоби навігації повинні бути впізнавані).

Часто виникає проблема деталізації структури, тобто питання про те, на скільки блоків слід розбивати вміст сайту. Під час її вирішення слід пам'ятати про одну особливість веб-сторінок: відвідувачі не люблять горизонтальних лінійок прокручування! Якщо вертикальні лінійки допустимі, то в жодному разі не можна змушувати відвідувачів гортати текст горизонтально. Нормальним вважають розташування матеріалу на 2-3 екранах із вертикальним прокручуванням.

Крім того, слід враховувати й розміри файлів веб-сторінки. Відвідувач розраховує на те, що вона завантажуватиметься не довше десяти секунд. Якщо це відбувається упродовж однієї секунди, він не відчуває дискомфорту, якщо до десяти секунд — не відволікається на інші завдання. Коли процес очікування триває довше зазначеного терміну, відвідувач починає відкривати інші сторінки і навряд чи дочекається повного завантаження першої. Це також необхідно враховувати, поділяючи матеріал на частини. Таке обменайбільше впливає на мультимедійні елементи — графіку, аудіо- та відео-матеріали, тому варто оптимізувати їхній розмір перед розміщенням в Інтернеті.

Засоби навігації

Інтернет є навігаційною системою: основна взаємодія з ним відвідувачів полягає у використанні гіперпосилань для переміщення в інформаційному просторі. Система ця є дуже складною — кожен сайт містить десятки, а то й сотні гіперпосилань. Одні з них відкривають інші сторінки того самого сайту, другі — забезпечують перехід на інші сайти, а треті визначають переміщення у межах однієї сторінки. Відвідувач завжди повинен знати, де він перебуває, де вже побував і куди може перейти.

Покажчик місця перебування. Користувач має чітко ідентифікувати своє місцеперебування на кожній сторінці сайту. Яке б гіперпосилання не вибрав відвідувач, він повинен розуміти, що перебуває на певному сайті і ще не вийшов за його межі. Це означає, що на кожній сторінці варто розмістити логотип чи загальну назву сайту. Крім того, потрібно продумати меню і назви сторінок так, щоб підказати відвідувачу, в якому саме розділі сайту він перебуває.

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

Важливе значення також мають назви веб-сторінок, вказані у тегу <TITLE>. Саме під ними зберігаються адреси сторінок у папці Вибране, вони відображаються у заголовку вікна браузера, а також у меню кнопки Назад. Тому доцільно, щоб заголовок точно описував назву, зміст і призначення сторінки.

Подальший перегляд. Щоб відвідувач міг визначитися з тим, куди він бажає перейти з певної сторінки, він повинен розуміти загальну структуру сайту та бачити гіперпосилання, які б відповідали його потребам.

Можна виділити кілька навігаційних рішень, які дадуть відвідувачу змогу швидко та ефективно орієнтуватись у структурі сайту.

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

• Горизонтальне меню — відвідувач читає сторінку згори донизу, тож цілком логічно розмістити вгорі сторінки меню, яке дасть змогу орієнтуватись у змісті сайту (рис. 7.16). Створюючи горизонтальні меню, необхідно враховувати те, що не можна перевищувати ширину сторінки. Використання такого меню доречне у випадку, коли невелика кількість його пунктів визначена заздалегідь, і воно не змінюватиметься.

• Рядок навігації — відображає весь шлях від домашньої сторінки сайту до тієї, на якій перебуває відвідувач у поточний момент (рис. 7.17). Так, клацнувши будь-яке гіперпосилання з навігаційного рядка, відвідувач може перейти на певний рівень структури сайту.

Закладки — це різновид горизонтального меню (рис. 7.18). Вони вказують на активний у поточний момент розділ сайту і є реалістичнішими порівняно з меню, адже саме закладки використовують у паперових папках для позначення різних тематик матеріалу.

Бокове меню — є найпоширенішим рішенням для сайтів. Здебільшого його використовують тоді, коли навігація має лише один рівень і є достатньо сталою.

Спливаюче меню — принцип його дії полягає в тому, що відвідувач клацає потрібний пункт, після чого з'являється меню наступного рівня (рис. 7.19). Іноді це відбувається без клацання — лише після наведення вказівника миші. Інколи таке меню може мати кілька рівнів.

Багаторівневе дерево навігації — схоже на традиційні меню програм; на екрані відображається вся ієрархічна будова сайту, і відвідувач легко може зробити вибір (рис. 7.20). Така реалізація дає змогу досить чітко й зрозуміло відобразити складні структури веб-сайтів.

Сторінки — матеріал поділяють на кілька сторінок (зазвичай це роблять із довгими статтями, індексами, форумами чи результатами пошуку) (рис. 7.21). Відвідувачу надають можливість пересуватися сторінками, клацаючи їх номери або буквені позначення. Крім того, зазвичай створюють гіперпосилання на попередню та наступну сторінку.

Макет сторінки

За сталими традиціями інформація розподіляється наступним чином:

1. В верхній частині сторінки (шапка, хедер, header) містяться:

· Логотип.

· Заголовок.

· Слоган.

· Телефон.

· Вибір мовної версії.

· Меню навігації (по сайту).

2. В середній (основній) частині сторінки:

· Меню навігації по тематичних розділах сайту.

· Основна інформація.

· Зображення, банери.

3. В нижній частині сторінки (підвал, футер, footer):

· Копірайти.

· Адреси, телефони.

· Лічильники і банери.

· Додаткове меню навігації (по сайту, по розділах сайту).

Модульна сітка

Модульна сітка є набором невидимих ліній, вздовж яких розташовуються елементи сторінки. Це полегшує розміщення даних в документі, забезпечує візуальний зв'язок між окремими блоками і зберігає цілісність дизайну при переході від однієї сторінки до іншої.

При цьому, зазвичай, дані розташовуються по колонках, тому при плануванні структури сторінки вживають терміни одно, двох, трьохколонна структури.

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

При розгляді найбільш поширених модульних сіток, в поясненнях будуть застосовані схематичні значки.

Не нашли, что искали? Воспользуйтесь поиском: