Безліч компаній, що пропонують послуги веб-дизайну, будь то великодосвідчені професіонали своєї справи - відомі дизайн-студії, або ж фірми-одноденки, які використовують «шаблонний дизайн», намагаються позиціонуватися як розробники «якісного» веб-дизайну. Однак далеко не всі з них розуміють, що «якість» такого дизайну складається не тільки з краси сторінок сайту, зручності «юзабіліті» для користувачів або клієнтів, але і з того, як «бачать» дизайн сайту пошукові системи. Тобто при розробці концепції дизайну майбутнього сайту слід враховувати і так звані «вимоги» до сайту з точки зору пошукових систем. З загальними короткими порадами з даного питання можна ознайомитися в розділі допомоги у кожної пошукової системи. В даному майстер-класі спробуємо подивитися на веб-дизайн з різних кутів - з точки зору, як користувачів, так і пошукових систем, опишемо можливі помилки, вкажемо шляхи їх вирішення.
2. Дизайн «очима» користувачів: очікування, думки, вимоги
Веб-дизайн - діяльність творча. Результати цієї діяльності в результаті виявляються представлені на загальний огляд аудиторії мережі Інтернет. Але дати реальну оцінку завершеному дизайнерським проектом і оцінити трудовитрати на нього можуть тільки фахівці в області технологій веб-дизайну. Звичайні користувачі Інтернету оцінюють тільки зовнішній вигляд сайту, картинки, кольору - тобто, образно кажучи, «вершину айсберга». Високу оцінку, дану сайту фахівцями дизайну, пересічному користувачеві пояснити досить проблематично. Професійна термінологія в даному випадку буде зведена до поняття «якісний дизайн», яким повсюдно оперують як розробники сайтів, так і користувачі. Навіть якщо спробувати задати запит «якісний дизайн», наприклад пошуковій системі Яндекс, то на першій сторінці результатів пошуку навряд чи будуть посилання на корисні матеріали для дизайнерів; топові місця займають різноманітні компанії, що надають послуги веб-дизайну, до речі, зовсім не обов'язково «якісного».
Дизайн служить для залучення уваги користувачів - потенційних клієнтів (для комерційних проектів). Він дозволяє отримувати задоволення від роботи з сайтом, в результаті чого з великою часткою ймовірності прості користувачі перетворяться в покупців. Для некомерційних ресурсів, дизайн цілком може бути «шаблонним»; для них набагато важливіший контент, його смислове навантаження. Сайтам, орієнтованим на збільшення продажів, клієнтської бази компанії-власника сайту, потрібні більш вагомі витрати на дизайн, який цілком може бути засобом конкурентної боротьби між їх власниками. Найчастіше компанія-власник більш якісно створеного і промальовані сайту виглядає більш процвітаючої і перспективною.
Розглянемо веб-дизайн з точки зору користувача. Можна висунути деякі важливі вимоги до оформлення сайту, спрогнозувавши очікування середнього користувача.
Дана вимога обмежує розмір сторінок сайту. Нормальним розміром завантажується сторінки прийнято вважати розмір, що не перевищує 70-80 Kb (кілобайт). Сторінки, розмір яких перевищує цю вимогу, завантажуються дуже довго у відвідувачів, які використовують модемне Dial-Up з'єднання.
Для того, щоб не перевищувати граничний розмір сторінки, дизайнерам необхідно використовувати прийоми мінімізації графіки.
Правило «спільності» оформлення сайту можна озвучити так: оформлення повторюваних елементів верстки (графіки, таблиць, фреймів. Шрифтів і т.д.) повинно бути однаковим для всіх сторінок сайту.
Як приклад - просто спробуйте використовувати в одному тексті на сторінці кілька варіантів шрифтів. Очевидно, що виглядати це буде далеко не кращим чином ...Масштабна структура в більшості випадків має на увазі «гумовий (тягнеться) дизайн». Дизайн повинен бути настільки «гумовим» наскільки це потрібно: не слід розтягувати картинку на весь екран, якщо при цьому рядки виходять довгими і мало зручними для читання. Такий дизайн повинен добре виглядати на встановленому призначеному для користувача дозволі екрану навіть 800х600 пікселів.
Дизайнерське оформлення сайту має відповідати поставленим перед ним цілям.
Наприклад, якщо сайт є презентаційним (промо-сайт, PR бренду - невеликий за змістом), то в даній ситуації дизайн повинен бути найбільш привабливим для користувача. Нескладна структура подібного сайту цілком дозволяє це реалізувати.
Інший приклад - великий пошуковий Інтернет-портал на замовлення і бронювання туристичних путівок, авіа та ж / д квитків. У цьому випадку необхідний простий, швидко завантажується, максимально зрозумілий, але професійно виконаний дизайн. Адже такі портали використовують величезну постійно оновлювану базу даних, і запит користувача обробляється протягом деякого часу, іноді, досить тривалого. А якщо при цьому ще й безліч графіки вантажитиметься на сторінці, то користувач і взагалі може, не дочекавшись завантаження закрити сайт.
3. Дизайн «очима» пошукових систем: закони, правила, вимоги
Відомо, що один з найважливіших текстових критеріїв, що впливає на ранжування сайтів в пошукових системах - положення ключових слів на сторінці і їх щільність по відношенню до решти словами. Згідно з цим критерієм і потрібно вибудовувати концепцію дизайну сайту. При заході на сайт, робот пошукової системи повинен отримати «потрібну» інформацію у верхній частині сторінки і щільність ключових слів на сторінці повинна бути досить висока (в межах розумного). Тому при розробці дизайн-проекту сайту варто задуматися про обов'язкове виділення місця під потрібну кількість текстового наповнення сторінок і розташуванні самого тексту по відношенню до інших елементів верстки.
Сформулюємо одні з основних вимог до веб-дизайну з точки зору пошукових систем:
Дана вимога відрізняється від описаного вище з точки зору користувачів, тим, що роботи пошукових систем не скачують графіком, а тільки код сторінки. При цьому пошукові системи не індексують частина коду сторінки, що перевищує деякий певне значення, різне для різних пошукових систем. Для «Рамблера», наприклад, ця цифра становить 200 кілобайт. Оптимальним для просування сторінки в пошуку можна назвати будь-яке значення розміру її коду з діапазону 5-80 кілобайт.
При створенні дизайн-проекту веб-сайту обов'язково потрібно передбачати місця, для розміщення текстових блоків і уникати створення так званих «вхідних сторінок» - невеликих сторінок, «що пропонують» користувачеві перейти нарешті на головну сторінку сайту.
4. Основні помилки дизайнерського рішення при розкручуванні сайту
Сенс цієї помилки у відсутності контрасту між текстовими елементами і фоном веб-сторінки, а також в можливу наявність занадто дрібним шрифтом. Ще гірше, якщо будь-які елементи контенту будуть повністю збігатися за кольором із загальним тлом, що може привести до виключення сайту з індексу пошукових систем, і, відповідно, неможливість його подальшого пошукового просування (до зняття з сайту санкцій).
Наявність неробочих посилань, тобто посилань, при переході за якими користувач отримує 404 відповідь, і посилань на порожні сторінки типу «under construction» негативно позначається як на пошуковому просуванні, так і на іміджі сайту.
Проблема в тому, що багато вебмастера розміщують на сторінці текст, який не вкладається навіть в 5-10 «прокручувань» екрану. При цьому, основні ключові слова розчиняються в загальній величезній масі інших слів, і сторінка втрачає релевантність за цими ключовими словами в пошукових системах. Слід також пам'ятати, що сайт - це свого роду книга. А книга не перебуває з однієї сторінки, на якій викладена вся інформація. У книги, також як і у сайту, є глави, розділи, підрозділи, розбиті посторінково.
Найчастіше, дизайнери, захопившись створенням красот зовнішнього вигляду веб-сторінки, геть-чисто забувають про те, що крім безлічі зображень, сторінка повинна також містити грамотно розміщений і легкий для читання текст, так необхідний для успішного просування сайту в пошукових системах.
Дана помилка позначається також на швидкості завантаження сторінки, особливо при неоптимізованою графіку і наявності великої кількості анімації.
Клоакинг - від англійського cloaking - маскування, приховування. CSS-клоакинг текстів - є маскування HTML-тегів, що збільшують релевантність документа за ключовим словом, за допомогою CSS, - каскадних таблиць стилів. Наприклад, весь текст на сторінці, навіть не відноситься до заголовку поміщений в тег. для якого за допомогою CSS створений стиль, точно такий же, який має і звичайний текст. Як результат - весь текст на сторінці є для роботів пошукових систем заголовком, а для пересічних користувачів - цілком звичайним текстом. У наявності обман пошукової системи, за який її модератори можуть накласти санкції на сайт у вигляді заборони його до індексації.
В даний час пошукове просування сайту є дуже важливим процесом, як для комерційних, так і некомерційних проектів. У зв'язку з цим, знаючи деякі вимоги до сайтів з боку пошукових машин, багато «оптимізатори» жертвують дизайном на догоду пошукового просування. З одного боку, це правильно, тому що це приносить прибуток компанії-власнику сайту. Однак якщо задуматися, то в кінцевому підсумку сайт робиться виключно для користувачів, потенційних і вже наявних клієнтів, а не для пошукових систем. Тут важливо знайти «золоту середину» між дизайном і пошуковим просуванням сайту. Один із шляхів прагнення до неї - це, очевидно, врахування вимог до веб-сайту як користувачів, так і пошукових сістем.Как знайти «золоту середину» - питання, яке спільно повинні вирішувати дизайнери, розробники і маркетологи. А даний майстер-клас, сподіваємося, допоможе їм у цьому.
Олександр Алаев - Ваше завдання - зібрати весь трафік в своєму регіоні. Це можна зробити зібравши взагалі всю семантику і всі запити, підготувати цільові сторінки, навіть якщо запити під них приносять 5 осіб в місяць. І кінцева мета - завоювати ТОП-3 за всіма цільовими запитами. Все це достигнется, коли ваш сайт буде краще конкурентів, більш пророблений і якісний. Далі можна і блог розвивати, правда, не думаю, що там буде багато користі, але трафік у всякому разі зберете, експертність свою розвивати будете, якщо статті будуть не бездушні копірайтери писати.
Анна Макарова - Шановний S1, я теж розумію, що є такі люди, які помітивши допущену неточність несуться на всіх вітрилах продемонструвати "силу" свого розуму. Спасибі вам за пильну увагу. Це допоможе нам бути краще.