2.4 Проектування веб-сайту

Розробка меню навігації інформаційного web сайта. Будь який Web-сайт є джерелом інформації. Незалежно від тематики, актуальності, затребуваності і практичної цінності цієї інформації, вона звичайно представлена у визначеній логічній послідовності для досягнення максимальної зручності її сприйняття відвідувачами сайта в Інтернеті. У структурному плані така послідовність досягається за рахунок організації системи навігації по сайту.

Поняття системи навігації Наявність навігаційної системи дозволяє відвідувачу візуально визначати цінність інформації, схованої в самих віддалених куточках того чи іншого інтернет-проекту, за допомогою вивчення тематичних заголовків. Кожен заголовок у стиснутій формі характеризує конкретний розділ чи групу підрозділів сайта, присвячених визначеній темі, і є гіперпосиланням на їхній повний варіант. Сукупність таких заголовків складає згадану вище систему навігації по сайту. Типи навігації Існує кілька типів організації навігації по Web-сайту. Розглянемо основні:

Текст

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

Однак 90-і рр. XX століття породили тенденцію до эстетизації складених елементів електронних документів у мережі, що виражалася в стрімкому підвищенні користувальницьких вимог до візуального оформлення сайта, у тому числі до його навігації. Незважаючи на зростаючий інтерес до таблиць стилів, що дозволяє трохи перетворити і прикрасити стандартний вид шрифтів, текстова навігація зрештою поступилася "місце під сонцем" своєму графічному аналогу.

Графіка

Графічний варіант представлення системи навігації є, мабуть, найбільш розповсюдженим в Інтернеті. Воно зрозуміло: сучасні графічні редактори укупі з усілякими надбудовами (plug-іns), ефектами і фільтрами здатні створювати приголомшливі зразки оформлювальних рішень. Застосування фотографічних зображень, малюнків, а також анімації залучило величезну кількість Web-дизайнерів, що віддали перевагу візуальній привабливості.

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

Рисунок 1 - Компонування блоків Web-сайта

Розробка графічного макета майбутнього web-сайта. Компонування макета Під компонуванням макета прийнято розуміти умовне (схематичне) розташування блоків інформації на майбутньому Web-сайті. Усього можна виділити чотири блоки інформації. Розглянемо кожний з них:

1. "шапка" - займає верхню частину сайта у вікні браузера (як правило, не більше 1/4 видимої частини екрана без прокручування) і може містити:

логотип;

слоганы, гасла, девізи;

рекламну інформацію (банери і текстові блоки) та ін.;

2. Меню навігації - воно може бути вертикальним, горизонтальним, містити підменю і т.д. і т.п.

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

4. "Підвал" - нижня частина сайта у вікні браузера, не є обов'язковим блоком, він лише підкреслює чітку структуру. Він може містити:

інформацію про авторське право розроблювачів Web-сайта (повний чи текст посилання на нього);

координати для зв'язку;

дублюючу навігацію (текстову);

рекламну інформацію (баннеры і текстові блоки) і ін.

Ще одним важливим моментом, що передує початку роботи над графічним макетом, є вибір типу верстки. Усього існує два типи:

"фікс" - у цьому випадку сайт "затачивается" під конкретний мінімальний розмір екрана і при зміні розмірів вікна браузера його компонування залишається фіксованим;

"гума" - структура сайта змінюється пропорційно змінам розмірів вікна браузера (тобто сайт "розтягується"). Логічно припустити, що при виборі типу верстки варто виходити з мінімального розміру екрана. У даному випадку вибраний перший тип верстки - "фікс".