Секрети і особливості Веб-графіки.

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

Відомо, що для виручки будь-якого кольору досить змішати у відповідних половинах всього три: червоний (Red), зелений (Green) і синій (Blue) — в англійській абревіатурі RGB.Цей закон широко використовується в кольорових фотоплівках, де, нарікає ступінь засвічення червоного, зеленого і синього шарів, отримують той чи інший колір.З кольорового кіно закон RGB перейшов в кольорове телебачення, де кольори використовуються при суміщенні червоного, зеленого і синього променів різної інтенсивності.Само собою зрозуміло, що з екранів телевізорів він перекочував на екрани комп’ютерних моніторів.Так як останній колір є результатом підсумовування, тому він і називається він аддитивним (additive color).

Але при підготовці зображень на комп’ютері використовується й інший спосіб змішування — віднімання (subtractive color).При цьому виходить видалення з білого, відповідно, негативів вищеназваних кольорів — блакитного (Cyan), пурпурного (Magenta), жовтого (Yellow) і, для виділення кращого контрасту, негативу білого — чорного (blaK).В англійській абревіатурі — CMYK.Вищезгаданий спосіб використовується, щоб, для підготовки зображення до друку на папері і в Веб частіше не застосовується.Однак він нас цікавить остільки, оскільки він взагалі існує.

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

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

Глибина кольору в таблиці визначається кількістю використовуваних бітів на піксель (одиничний елемент, як би, атом зображення).Хоча можна сказати, що глибина кольору, а природно, і кількість квітів у палітрі, може бути скільки завгодно величезним.Але не потрібно забувати, що все відмінно в міру!.Око людини хоч і особливий інструмент для роботи з колірною гамою, але має останню роздільну здатність (можливість розрізняти) за кольором.Крім цього, потрібно враховувати і швидкість обрахунку величезного обсягу зображення (я не говорю про величезні розміри файлів — про це трохи пізніше) комп’ютером, і використанні монітора при великій глибині кольору.Тому приходимо до максимуму — 24 біта на піксель (8 біт на кожен колір в RGB) або 224 = 16,8 млн. кольорів в палітрі.Але не завжди необхідно використовувати повну палітру (true color) при виготовлення зображення для Веб.Більше про це гворіть на даному сайті.

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

Так як зазначалося, не завжди необхідно, використовувати величезну кількість квітів в малюнку.В режимі індексованих кольорів (index color) кольору формуються не традиційним схрещуванням трьох чистих — кожному пікселю малюнка присвоюється індекс (звідси й назва) кольору в таблиці квітів.Але кількість їх може бути різним, але не більше 256.Тим не менш, чим менше квітів у палітрі, тим менше і обсяг файлу малюнка.

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

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

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

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

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

Намагайтеся вибирати тематику банерів, орієнтуючись натематику власного сайтуабо блогу, адже, погодьтеся, досить безглуздо виглядали б банери adult-тематики на дитячому або садівничомусайті.Не обов’язково щоб тематика банера абсолютно точно співпадала зтематикою вашого сайту— часом установка банерів суміжної тематики (наприклад, банери по заробітку вінтернет на сайтахприсвячених сайтобудівництва і СЕО) приносить більший дохід і значно сильніше зацікавлює відвідувачів.

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

У цій статті ми з вами будемо розбиратися в тому, як оптимізувати сторінки свого сайту за обраними ключовими словами.Ну що ж, почнемо …

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

1.Заголовок.

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

2.плотность слів на сторінці сайту.

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

3.Тегі,,.

Отже, теги виділення,,.Ці теги дозволяють виділяти нам текст на сторінці абонапівжирним(,),або курсивом.Як же це все може впливати напошукові системи,запитаєте ви.Давайте розберемося.Точно так самояк і користувачі, пошукові системивідразу ж звертають увагу на виділений текст.У зв’язку з цим, з’явився такий прийом, як виділення ключових слів вищевказаними тегами.Зазвичай всі використовують тегstrong,тому я вам рекомендую саме його і використовувати.З цим все зрозуміло, йдемо далі.

4.Внутренніе посилання.

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

Реєстрація користувача.Вона повинна бути максимально простою.Буквально кілька найважливіших для Вас полів з інформацією про клієнта.Повірте — нікому не потрібно витрачати зайвий час на заповнення зайвої інформації.Емейл, Ім’я, Контактний телефон — ось мабуть і все.Якщо звичайно у Вас з якихось причин (наприклад особливість товару) і виникає бажання взяти більше інформації — оформите цю пропозицію у вигляді виноски, або побудуйте інтернет діалог з клієнтом так, щоб ця інформація давалася їм наприклад виключно після особистої розмови по телефону.Мінімальна інформація про відвідувача до вчинення ним замовлення — нехай людина тільки зайшовши на сайт, на кілька кліків знайде свій товар і зв’яжеться з вами з приводу покупки.

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

Пошук товару.Пошук товару повинен бути доступним завжди.Користувач повинен мати можливість одним кліком активізувати пошук, в якому розділі він би не знаходився.Починаючи створення сайтів, таких як інтернет магазини, компанія UkrbiT використовує технологію Web 2.0.Це дозволяє виводити результати пошуку, додавати товар у кошик та виконувати інші дії без перезавантаження сторінки.Тобто необхідні дії виконуються в динамічному режимі, на поточній сторінці, таким чином користувач не витрачає час на повторну завантаження станиці.Складаючи пошук — робіть 2 варіанти.Короткий і докладний.Короткий пошук — це одне поле для введення одного параметра наприклад назви товару або групи товарів.Докладний пошук — враховує максимальну кількість характеристик товару, таких наприклад як ціна, вага, розмір, назва, рік випуску та ін Пам’ятайте — пошук повинен побут швидким і зручним, а його результати точними і не заплутаними користувача.

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

Контакти.З самого початку, коли тільки проходить розробка сайтів, раджу виводити контакти як в окремий розділ і в «шапку».Гарячий телефон і емейл повинен відображатися завжди.З будь-якого розділу і підрозділу він повинен бути видний.Коли телефон і емейл не потрібно шукати, це не дратує і можливо наштовхує відвідувача на думку зателефонувати і все уточнити, щоб було швидше.Після того як дзвінок зроблений — все залежить від вас).У розділі «контакти» ви можете залишити всю інформацію на свій розсуд, включаючи ICQ, Skype, карту проїзду і т.д.

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

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

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

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

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

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

Суть ще одного різновиду навігації полягає у використанні додаткових інформаційних блоків для комфортного доступу корисної інформації.Все більш популярною стає так звана акцидентна навігація по сайту.Її мета — створення своєрідних «акцентів», які привертають увагу відвідувача до важливої ​​на думку власника сайту інформації.Зазвичай такими акцентами є графічні або текстові об’єкти на сторінці, які інформують про акції, новини, конкурсах.Межтекстовую навігацію застосовують дуже рідко, хоча зміст її дуже простий: посилання на сторінки містяться у текстах самих сторінок.Контекстна навігація дозволяє виводити на сторінку ті посилання на інші матеріали веб-сайту, тематично пов’язані або схожі.Така навігація часто використовується на новинних сайтах або в електронних магазинах.Зрозуміло, що контекстні посилання дають можливість пошуковим роботам бачити більше інформації про ресурс.

До внутрішньої навігації відносять:

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

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

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

Службову навігацію можна побачити на кожному веб-ресурсі.Вона повинна забезпечувати простий доступ до службових розділах («карта сайту», «відправити лист»).

Отже, ось ряд основних моментів, які допоможуть створити якісну навігацію: Перше — це зручна панель навігації.Що це?А це список посилань, який розташований на всіх сторінках сайту.Друге — використання такого інструменту, як карта сайту.Карта сайту — це дерево логічної структури сайту, воно включає список усіх розділів і сторінок сайту.Третє — забезпечте доступність інформації.Дослідники говорять, що якщо відвідувач не може знайти шукане в два — три переходу, то він покидає сайт.Четверте — повторюйте основні посилання, наприклад, внизу кожної сторінки.Це дуже полегшує переміщення по сайту, дозволяє швидко повернутися до основних розділів.П’яте — використовуйте заголовки розділів і сторінок.У кожного розділу або сторінки повинен бути свій власний заголовок.Це дозволить користувачеві завжди знати, де він знаходиться і легко зрозуміти, куди йому рухатися далі.

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

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