
- •О. Н. Романюк, д. І. Катєльніков, о. П. Косовець
- •О. Н. Романюк, д. І. Катєльніков, о. П. Косовець
- •1 Базові визначення. Основні етапи розробки веб-ресурсів
- •1.1 Основні принципи побудови та функціонування мережі Internet
- •Контрольні питання
- •1.2 Основні етапи розробки Web-сайта
- •1.2.1 Концептуальне проектування
- •1.2.2 Логічне проектування
- •1.2.3 Фізичне проектування
- •4. Виробництво і контроль якості 5. Запуск і супровід
- •Контрольні питання
- •2 Основи композиції
- •Контрольні питання
- •3 Основи шрифтового дизайну
- •3.1 Основні елементи побудови літер
- •3.2 Накреслення
- •3.3 Класифікації гарнітур і шрифтів
- •3.4 Метричні параметри тексту
- •3.5. Розмір пробілу, бокові поля і ємність шрифту
- •3.6. Виділення параграфів
- •3.7. Розміщення символів тексту
- •3.8 Комп’ютерні шрифти
- •3.9 Кодування шрифту
- •3.10 Особливості використання шрифтів у Web-дизайні
- •3.11 Рекомендована кількість шрифтів
- •3.12 Вибір кольору тексту
- •Контрольні питання
- •4 Розробка контента сайта
- •4.1 Особливості сприйняття текстової інформації на Веб-сторінці
- •4.2 Складання текстів для Internet
- •4.3 Поради щодо написання статей
- •4.4 Поради щодо написання заголовків
- •4.5 Джерела контенту та систематизація
- •4.6 Організація інформації
- •4.7 Тестування контенту
- •Контрольні питання
- •5 Теорія кольору
- •5.1 Сприйняття кольору через зоровий канал людини
- •5.2 Системи змішування основних кольорів
- •5.3 Основні характеристики та кутові поля зору людського ока
- •5.4 Особливості сприйняття кольору
- •5.5 Сприйняття кольору
- •5.6 Емоційний вплив кольору
- •5.7 Психологічне сприйняття окремих кольорів і їх поєднань
- •5.8 Вибір палітри для різних демографічних груп, національні особливості, сучасні тенденції
- •5.9 Вибір кольорів з використанням колориметричних кіл
- •Контрольні питання
- •6 Основи сканування
- •6.2 Рекомендації щодо сканування зображень
- •Контрольні питання
- •7 Розробка системи навігації
- •Контрольні питання
- •8 Розробка логотипу
- •8.1 Термінологія
- •8.2 Найбільш відомі логотипи
- •8.3 Класифікація логотипів
- •8.4 Характеристики логотипу
- •8.5 Особливості розробки логотипів
- •8.6 Вибір геометричних форм для логотипів
- •8.7 Вибір кольорової гамми для логотипу
- •8.8 Стиль у дизайні логотипів
- •8.9 Символізм зображень тварин
- •Контрольні питання
- •9 Формати графічних файлів та рекомендації до їх вибору
- •9.1 Аналіз форматів графічних файлів
- •9.2 Рекомендації для вибору графічних форматів
- •Контрольні запитання
- •Література
- •Науково-методичний відділ внту
- •21021, М. Вінниця, Хмельницьке шосе, 95, внту
- •Вінницького національного технічного університету
- •21021, М. Вінниця, Хмельницьке шосе, 95, внту
4.5 Джерела контенту та систематизація
Для початківця пошук контенту може бути досить важкою справою, тому слід звернути увагу на такі рекомендації.
Залежно від поставлених цілей джерелом контента можуть бути:
каталог товарів та послуг;
матеріали виставок;
технічна документація;
бесіди з фахівцями фірми, які годинами можуть розповідати про свою роботу;
друковані роботи за тематикою фірми:
книги (підручники, довідники тощо) ;
дипломні роботи та дисертації;
статті;
патенти;
доповіді на семінарах, конференціях та симпозіумах;
інтерв’ю у ЗМІ;
тести виступів на радіо та телебаченні.
Слід починати збирати докупи всі доступні матеріали у вигляді текстів, графіків, рисунків, таблиць, фотографій, відеороликів на паперовому, електронному або іншому носієві. Якщо якась частина сайта не знадобиться веб-дизайнеру, то йому буде з чого обирати. Надлишок інформації кращий за нестачу. Інформацію слід збирати у таких форматах:
Графіка – у різних графічних форматах, з будь якою роздільною здатністю та розмірами. Фон рисунків бажано робити білим, прозорим або одного світлого кольору.
Формат тексту - txt або Word (ХР, 2003).
Формат таблиц - Exсel (XP, 2003) або Access (XP, 2003).
Бажано зберегти всі матеріали на CD.
Контент сайта не є сталим, а завжди може бути покращений у майбутньому. Тому доцільно одразу починати роботу над контентом, не очікуючи поки надійде натхнення. Сайт потрібен для роботи фірми вже зараз.
Тільки у випадку, коли в процесі підготовки сайта будуть брати участь керівники фірми високого рангу, можна отримати якісний сайт, який правильно розкриває бачення ситуації з точки зору фірми та підкреслює переваги продукції фірми в порівнянні з конкурентами.
Простий спосіб систематизації контента сайта:
Роздрукуйте контент, який хотіли б розмістити на сайті.
Об'єднайте наявний текст, враховуючи його відношення до певного розділу.
Прикладайте до текстових матеріалів фотографії або рисунки, які пояснюють або доповнюють наявний текст. Знизу фотографій або рисунків зробіть відповідний текстовий напис або проставте певний номер для правильної ідентифікації.
Розкладіть матеріали так, ніби ви готовили до випуску книгу, підготовляли матеріали для надання у видавництво.
Зверху розмістіть текст головної (домашньої) сторінки. Зміст цього тексту, за своєю суттю є анотацією, тобто коротким змістом самого сайта.
Крім анотації сайта на головній сторінці вкажіть найменування розділів, що ввійшли до сайта.
4.6 Організація інформації
Організація даних у вигляді впорядкованої структури повинна сповістити відвідувачеві, яку інформацію він може знайти на сайті і де її шукати. Структура сайта нагадує зміст книги. Якщо вона добре написана, стає зрозуміло, що очікувати від книги, ще не прочитавши її. Інформація повинна бути організована таким чином, щоб відвідувач знав, що його чекає на наступній сторінці вже за назвою посилання.
Організація інформації на сайті може бути: лінійною; ієрархічною; контекстно-залежною; комбінованою.
Лінійна структура
Найбільш проста організація даних. Вона являє собою набір Веб-сторінок, які слідують одна за одною. До лінійної структури можна віднести покрокове виконання операцій.
Ієрархічна структура
Найпоширеніший варіант розміщення інформації. Передбачає застосування головної сторінки, на якій розміщається меню з посиланнями на розділи сайта, розташовані на наступних сторінках. Розділи можуть містити в собі підрозділи та іншу детальну інформацію.
Контекстно-залежна структура
У подібній структурі посилання на інші розділи сайта формуються в залежності від певних дій користувача. До прикладів такої структури відносяться елементи інтернет-магазинів, пошук за ключовими словами.
Комбінована структура
Являє собою з’єднання декількох попередніх структур. Наприклад, на сайті може бути передбачено ієрархічну структура, яка в деякому місці може містити виконання покрокових дій (лінійну структуру).
Для прикладу роздивимось організацію сайта “Візитна картка” з 10 html сторінок. Такий сайт може включати до 25 сторінок тексту формату А-4 і до 50 фотографій (рисунків).
Рисунок 4.2 – Ієрархічна структура сайта "Візитна картка" з 10 сторінок: 1 - головна (домашня) сторінка; 2 - прайс-лист; 3 - фото (каталог) товарів; 4 - довідкова інформація; 5 - про фірму; 6 - офіс; 7 - партнери; 8 - вакансії; 9 – потреби; 10 - сервіси
Головна сторінка. Відомості про призначення й зміст сайта. Користувач сайта повинен відразу зрозуміти, для кого призначений сайт і чому він присвячений. Перебуваючи на головній сторінці відвідувач повинен зрозуміти, з яких розділів складається сайт. Основний текст для головної сторінки випливає зі змісту наступних сторінок сайта й містить 400 - 600 знаків із пробілами.
Прайс-лист. Його заповнення звичайно не викликає труднощів, тому що він може мати такий же зміст, що й у повсякденній практиці фірми.
Фото. Фотографії товарів, що дозволяють відвідувачеві зрозуміти суть того, що йому пропонується купити або замовити. Поруч із кожною фотографією доцільно привести назву товару, його умовну позначку за прайс-листом й будь-яку іншу інформацію, що дозволяє цей товар відрізнити від іншого (короткі технічні характеристики й т.п.).
Довідкова інформація. Відомості про стандарти, технічні умови та інших нормативні матеріали, яким відповідають пропоновані товари або послуги. Описуються основні переваги в порівнянні з іншими товарами або послугами аналогічного призначення.
Про фірму. Відомості про фірму, які можуть зацікавити відвідувача.
Офіс. Адреса знаходження офісу фірми, час її роботи, контактні телефони, відомості про те, як дістатись до офісу міським транспортом і на автомобілі. Відомості про місцезнаходження складу і як доїхати до нього. Доцільно вказати контактні телефони й режим роботи складу.
Партнери. Якщо це не комерційна таємниця, то приводиться перелік партнерів, з якими співпрацює фірма.
Вакансії. Перелік вакансій фірми.
Потреби. Перелік товарів, матеріалів, сировини або послуг, у яких фірма відчуває потребу. Тут слід надати конкретний опис продукції, яка потрібна фірмі, товарів й умов їхнього придбання.
Сервіси. Перелік послуг, які може виконувати фірма для своїх клієнтів.
Internet надає можливість утворювати нелінійні тексти. Нажаль розробники ще не досить повно оволоділи цією можливістю, адже вона являє собою потужний інструмент для організації інформації. З іншого боку, не слід зловживати можливістю створення неймовірно складного гіпертекстового документа, зв'язки якого будуть поширюватися по величезній кількості напрямків. Доцільніше оперувати невеликими блоками інформації, з яких уже збирається щось більше. Оптимальний спосіб полягає в тому, що головна інформація, яку хочеться донести до користувача, повинна подаватися в основному у вигляді лінійної послідовності. Блоки інформації, які містять додаткові відомості й детальні описи різних компонентів, уже можуть "відгалужуватися" у різні сторони від основної послідовності. Припустимо, що ви є експертом в області охорони здоров'я собак і вирішили створити велику Web-сторінку, де в одній великій масі будуть подані всі знання, накопичені за довгі роки. Але власники собак із більшим задоволенням будуть вивчати простий сайт про здоров'я собак, тому основну інформаційну лінію можна побудувати на проблемах харчування собак і основних питань догляду за ними. Додаткові сторінки можуть містити детальніший опис цих тем із правильно розміщеними гіперпосиланнями на сторінки з інформацією про розпізнавання симптомів хвороб собак. На цих же сторінках можна помістити посилання на ще більш спеціалізовані сторінки - про хвороби собак і їх лікування, які можуть бути цікавіші ветеринарам, ніж звичайним власникам собак. Такий сайт може стати дуже корисним величезній кількості людей, поки його форма й вміст сприяють тому, щоб залучати користувачів і кваліфіковано супроводжувати на той інформаційний рівень, який для них саме необхідний.