Графічний дизайн в житті сучасного суспільства


Графічний дизайн в житті сучасного суспільства

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


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

Теоретичні аспекти розробки дизайну інтернет сайту

1.1 Поняття і види веб-сайту

Сайт (від англ. Website: web - «павутина, мережа» і site - «місце», буквально «місце, сегмент, частина в мережі») - сукупність електронних документів (файлів) приватної особи або організації в комп'ютерній мережі, об'єднаних під одним  адресою (доменним ім'ям або IP-адресою).
Всі сайти в сукупності складають Всесвітню павутину, де комунікація (павутина) об'єднує сегменти інформації світової спільноти в єдине ціле - базу даних і комунікації планетарного масштабу.  Для прямого доступу клієнтів до сайтів на серверах був спеціально розроблений протокол HTTP.

Історія сайтів

Створення першого сайту відноситься до 1990 року.  Його творцем з'явився Тім Бернерс-Лі, засновник головних веб-технологій - HTTP, URI / і HTML.  В основі проекту розробника лежала ідея про те, що гіпертекст може стати основою для мереж обміну даними.  Перший сайт також став і першим в світі інтернет-каталогом, оскільки згодом Тім Бернерс-Лі розмістив на ньому посилання на багато інших сайтів.
Спочатку сайти представляли собою набір статичних сторінок.  Згодом, з появою двигунів - спеціальних комп'ютерних програм на сервері, з'явилася можливість більш гнучкого структуризації і виведення інформації.
З вдосконаленням інтернет-технологій проходила і еволюція сайтів.  Поява і поширення нових онлайн-сервісів робить сайти все більше багатофункціональними і інтерактивними, системи управління контентом (CMS, движок) дозволяють наповнювати сайти новою інформацією найбільш зручним і якісним чином.
Види і функції сайтів
Сайти діляться на кілька категорій за різними ознаками.

  1. Один з основних ознак - природа вмісту сайту .. Згідно з цим ознакою, сайти діляться на статичні і динамічні. Статичний сайт - сайт з підготовленим заздалегідь вмістом.  Файли видаються користувачам у тому ж вигляді, в якому вони зберігаються на сервері.  Перші сайти в Інтернеті ставилися до категорії статичних. Динамічний сайт - вміст сайту створюється за допомогою спеціальних скриптів (сценаріїв) на основі даних з будь-якого іншого джерела. З точки зору користувача сайту дана класифікація не є суттєвою, оскільки простому відвідувачу сторінки в більшості випадків важко навіть визначити, чи є вона статичною або динамічною.
  2. Другий важливий ознака - функціональне призначення сайту.  Сайти служать веб-представництвами компаній і приватних осіб, електронними торговими майданчиками - їх діяльність спрямована на стимулювання прибутку.  Також сайти можуть являти собою довідкові або новинні ресурси.  Першу групу сайтів можна назвати комерційними сайтами або веб-представництвами, другу - інформаційними ресурсами.

Серед комерційних сайтів (веб-представництв) виділяють наступні основні види сайтів:

Тип сайту

Призначення

Функціонал

Сайт-візитка

Веб-представництво компанії (бюджетний варіант)

Кілкість сторінок від 1 до 5, головна сторінка, контакти, прайс-лист, можливість розширення до корпоративного сайту

Корпоративний сайт

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

Інтернет магазин

Електронний майданчик для купівлі-продажу товарів і послуг Розміщення необмеженої кількості товарів, спеціальні сервіси для здійснення угод

Портал

Інформаційно-комерційна багатофункціональний майданчик

Інформаційна і адміністративна частини, можливість розширення функцій, розміщення текстового, відео-та аудіо-контенту

Промо сайт

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

Унікальний сайт

Ресурс, повністю адаптований під потреби і завдання конкретної компанії або індивідуального особи За погодженням із замовником

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

Складові сайту

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

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

Доменне ім'я

Для зручності знаходження сайтів в Мережі, кожен з них має свій унікальний доменним ім'ям.  Домен сайту також називають його адресою в Інтернеті.  Домени мають загальне закінчення (.ua, .com.ua, .eu, .com, .net, .gov, .org) відносяться до однієї і тієї ж доменній зоні, яка вказує або на графічну локалізацію власників сайту (.ua, com.ua - Україна, .eu - країни Європейського Союзу) або  його призначення (.com -комерційний ресурс, .net - тематика сайту пов'язана з Інтернетом, .gov - сайти урядових установ, .org - сайти організацій), і тому подібне.

1.2 Структура сайту

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

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

Можна виділити три основні типи структури сайтів:

  1. Лінійна структура.  Це найбільш проста структура сайту, в якій матеріал не поділяється на рівні.  Всі сторінки такого сайту ієрархічно рівноправні.  Такий сайт досить простий в реалізації, однак - знову-таки в силу своєї простоти має досить обмежене застосування.
    лінійна структура сайту
     
  2. Деревоподібна структура - це найбільш популярний вид структури в сучасному сайтобудуванні.  Це універсальна структура, відповідна для сайтів різних типів.  Ця структура - ієрархічна, вона містить розділи, які в свою чергу включають в себе кілька підрозділів і так далі.  Таким чином різні сторінки сайту мають різні рівні вкладеності.
    деревоподібна структура сайту
     
  3. Ґратчаста структура - найскладніша з представлених структур.  Її відмінність від деревовидної полягає в тому, що користувач може переміщатися по сторінках сайту як вертикально, так і горизонтально - між сторінками різних рівнів.  Часто використовується в інтернет-каталогах.
    ґратчаста структура структура сайту
     

Структура сайту може включати в себе текстові розділи, всілякі програмні модулі (голосування, відгуки, форма зворотного зв'язку і так далі.).

Навігація сайту

Навігаційне меню є відображенням структури сайту, яке бачить користувач, потрапляючи на ресурс.
Відвідувач повинен завжди мати перед очима «провідну нитку» [], якою є кнопка повернення в попередній розділ (сторінку).  Також на кожній сторінці сайту повинна бути розміщена посилання - «повернутися на головну», якщо відвідувач здійснює продаж товарів або послуг, то обов'язково посилання типу «замовити», «купити», «забронювати» і т.п.  Також необхідна посилання на форму зворотного зв'язку, якщо сайт передбачає взаємодію з користувачем.  Всі ці посилання і кнопки не є заміною меню, а тільки доповнюють його, для підвищення комфорту використання сайту.  Таким чином, відвідувач повинен представляти, де він знаходиться і куди йому рухатися далі.  Цікаво, що за допомогою грамотно розставлених посилань можна не тільки спростити навігацію, але і підштовхнути користувача до вчинення певного (потрібного нам) дії.  Наприклад, оформити замовлення, купити товар, завантажити фільм і тому подібне.

Існує кілька типів навігації:

Меню - найбільш поширена навігаційна система, вона схожа на зміст до книги.  Меню складається з коротких текстових активних посилань на певні сторінки сайту.  Меню повинно бути видно з будь-якої сторінки ресурсу, тоді користувач зможе скористатися ним у будь-який момент.  Складання повного меню, завдяки якому буде здійснюватися швидкий перехід на шукані сторінки, для великих сайтів (понад 50 сторінок) практично нездійсненне завдання. Тоді на допомогу приходить спливаюче меню, тобто  коли людина клацає на якусь посилання, відкривається кілька додаткових посилань, що характеризують підрозділи. Можна розміщувати кілька меню: одне під шапкою два інших з боків - справа і зліва.  У тому випадку, якщо сайт невеликий, то краще обмежитися формуванням меню в правій колонці сайту, тому що  це дуже зручно і звично для користувача.  Справа краще розташовувати найважливіші посилання на розділи, оскільки дана зона найбільш активна на сайті (на цей кут відвідувач найчастіше дивиться, напевно, пристосовуючись натиснути на хрестик «закрити» в правому верхньому куті браузера).

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

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

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

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

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

1.3 Теорія створення сайту

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

  1. Розробка дизайну
  2. Верстка сторінками
  3. Веб програмування
  4. Наповнення контентом
  5. Тестування
  6. Розміщення (хостинг)

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

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

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

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

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