Добавил:
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
WEB - дизайн / Лекції / Лекція 2.doc
Скачиваний:
19
Добавлен:
30.05.2020
Размер:
71.68 Кб
Скачать
  1. Головне про веб-дизайн.

Щоб вивчити основи веб-дизайну  необхідно знати етапи розробки сайту, від тематики сайту, до реалізації графічної ідеї і розміщення готового сайту в інтернет. Для цього, вивчимо що таке веб-дизайн, етапи створення сайту, види сайтів.

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

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

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

  • Проектування навігації| на сайті.

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

Грамотно розташовані інформаційні блоки і проста, зрозуміла, навігація запорука успіху майбутнього сайту.

  • Елементни дизайну сайту.

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

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

Правильно розроблений сайт включає такі важливі моменти як: - зручна навігація

- впорядковані інформаційні блоки

- всі матеріали сайту повинні мати тематичну спрямованість сайту (для певного круга користувачів)

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

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

  • Елементи веб-дизайну сайту.

Елементи дизайну сайту грають важливу роль в сприйнятті відвідувачами. Відомо, що людина здатна одночасно сприйняти 5-9 однотипних елементів. Відповідно, найбільш зрозумілим стане меню, що складається з оптимальних 5-7 елементів. Можна збільшити до 9, але це максимум, рекомендувати який, ми б не стали. Саме така кількість пунктів меню дасть відвідувачеві можливість швидко запам'ятати їх назви, адаптуватися до графіки, і в цьому випадку стати постійним користувачем вашого сайту.

Які елементи веб-сервера-дизайну впливають на перше враження і встановлення довірчих відносин між відвідувачем і сайтом?

Логотип

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

Навігація

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

Шрифт

Вибір правильного виду шрифту, його зображення, колір і розмір (кегль) також грає важливу роль в сприйнятті сайту відвідувачем. Розмір краще задавати у відсотках, щоб була можливість його збільшити при необхідності в браузері|. Не бажано використовувати в дизайні сайтів чітко фіксований розмір кегля. Вибір колірного рішення повинен відповідати профілю діяльності компанії. Білий, світлий колір - основний в оформленні сайту. Графічний заголовок дозволяє використовувати незалежні від встановлених на клієнтському комп'ютері шрифти. У інтернет існує безліч думок по даному пункту, але білий колір - найбільш відповідний для читання текстів. Погоджуся, що наприклад, сайт фотографа, може мати основним кольором фону - чорний, оскільки фотографії краще є видимими. Але читати білий текст на темному фоні - це не професійно!

Фотографії.

Доведено, погляд людини притягується до малюнка менше, ніж фотографії, яку хочеться роздивлятися.

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

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

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

Другорядні дані.

Це можуть бути графічні банери спонсорів, партнерських проектів, або текстова реклама.

Види сайтів в інтернет за уявленням інформації,   об'єму і категорії завдань можна виділити наступні типи веб-ресурсів|:

Інтернет-представництва власників бізнесу (торгівля і послуги, не завжди пов'язані безпосередньо з Інтернетом): 

 Сайт-візитка  — даний сайт містить загальні дані про власника сайту (організація або індивідуальний підприємець). Вид діяльності, історія створення, можливе оформлення прайс-листа, контактні дані, реквізити компанії, карта проїзду. Тобто візитна картка компанії в Інтернет|.

 Корпоративний сайт — повніший опис діяльності компанії, містить повноцінну інформацію про компанію - її власника, послуги і продукцію, новини і події в житті компанії. Відрізняється від сайту-візитки повнотою представленої інформації, часто містить різні функціональні інструменти для роботи із змістом (пошук і фільтри, календарі подій, фотогалереї, корпоративні блоги|, форуми). Може бути інтегрований з внутрішніми інформаційними системами компанії-власника (КИЦЬ, CRM|, бухгалтерськими системами). Може містити закриті розділи для окремих груп користувачів — співробітників, ділерів і ін.

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

- автоматична пересилка рахунку факсом

- розрахунки за допомогою пластикових карт.

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

  Промо-сайт| — мета даного сайту реклама конкретної торгової марки або продукту, розміщується повна інформація про бренд, і рекламні акції, що проводяться (ігри, конкурси, вікторини, і так далі).

  Сайт-квест — Інтернет-ресурс, на якому проходять змагання по розгадуванню логічних загадок і різних видів ігор.

  Сайт-блог — Авторський інтернет-ресурс, на якому користувачі залишають свої повідомлення і обмінюються думками. "Блоггер" - людина сайт, що має, для взаємної комунікації.

3. Етапи проектування сайту.

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

1. Технічне завдання (ТЗ)

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

2. Структуризація інформації (юзабіліті|)

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

3. Графічне оформлення

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

4. Верстка

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

5. Вебмастерінг

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