We stand for 🇺🇦 Ukraine. You can find more information and donate here

0Ви дізнались тільки
% інформації

SEO та дизайн сайтів: усе, що вам потрібно знати

Generic selectors
Exact matches only
Search in title
Search in content

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

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

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

Що зазвичай відбувається…

Лунає дзвінок в офісі Lemarbet.

Андрій: “Добрий день, Lemarbet на зв’язку. Чим ми можемо вам допомогти?”

Той, хто телефонує: “Привіт. Ми тільки що створили веб-сайт і, здається, ми втрачаємо значну кількість трафіку…”. АБО: “Ключові слова, які ми використовували, здається, не працюють…”. АБО: “Ми не отримуємо ефекту, на який розраховували”. АБО: “Ми хочемо зрозуміти, що ми можемо зробити, щоб оптимізувати SEO”.

Андрій: “Ок. Повідомте нам свій URL і телефонний номер, за яким із вами можна зв’язатися. Ми подивимося, які рішення можна запропонувати для вас “.

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

Розробка SEO-дружнього веб-сайту

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

SEO

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

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

Основне

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

Домен

Як основний домен ваша компанія може використовувати example.com або будь-які інші варіанти. Дуже важливо, щоб усі варіанти і піддомени правильно вказували на головний сайт.

Інтернет-бізнес із назвою Lemarbet, знаходиться в Україні. Природно, що його основний домен – lemarbet. Усі субдомени перенаправляють на головну URL-адресу lemarbet.

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

Хостинг

Хостинг теж дуже важливий. Сайт, що працює повільно, – джерело невдоволення користувачів. Вибирайте хостинг, спираючися на здоровий глузд. Розташовуйтеся там, де знаходиться ваша аудиторія. Будьте швидкими. WP Engine – відмінний приклад, оскільки він надає платформу, адаптовану до веб-сайтів WordPress.

CMS

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

Сканування і доступність

Насамперед переконайтеся, що пошукова система може знайти ваш сайт і зрозуміти – де, що та як він робить.

Індексація

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

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

Структура посилань

Щоб проіндексувати ваш контент за межами домашньої сторінки, вам потрібні внутрішні посилання, які пошукова система може сканувати. Ваша основна навігація, директиви пошукових систем і такі інструменти, як XML-карти сайту, допомагають пошуковій системі сканувати сайт і відкривати нові сторінки. Такі інструменти, як Screaming Frog, нададуть вам реальну допомогу.

Інформаційна ієрархія і структурування вашого сайту

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

Розглянемо структуру сайту Lemarbet як приклад:

Головна

– Просування

– – SEO

– – – Просування інтернет-магазинів

Головна

– Створення

– – Створення інтернет-магазинів

– – – Створення інтернет-магазину: що важливо знати власнику бізнесу?

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

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

URL-адреси

Грамотний набір URL-адрес дозволить забезпечити кращі умови для пошукових систем і відвідувачів сайту. Нижче наведені два набори гіпотетичних URL-адрес, які можуть відображатися на шляху Services>SEO>SEO Audit, але перший із них має сенс, а другий марний.

www.example.com

www.example.com/services/

www.example.com/services/seo/

www.example.com/services/seo/audits/

www.example.com

www.example.com/s123/

www.example.com/s123/s1/

www.example.com/s123/s1/75/

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

Навігація

Якщо сайт грамотно структурований, навігація взаємодіє із URL-адресами та іншими компонентами, такими як файли Sitemap XML, щоб допомогти закріпити кожну сторінку, кожну частину контенту.

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

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

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

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

signpost

Інтуїтивно мій мозок обирає лінію зліва направо, тому я повертаю направо, проте, це неправильно – автостоянка знаходиться зліва. Таким чином мені доводиться кілька разів подумати і зробити помилку, перш ніж знайти правильний шлях. Але ваші користувачі вчинять інакше. На практиці, якщо вони відразу не знайдуть те, що шукають, вони підуть, щоб знову поринути у безмежний океан конкуренції, який надають їм результати пошуку Google.

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

Загальні проблеми

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

Наприклад:

  • “Осиротілий” (загублений) контент, який неможливо відшукати;
  • Контент, доступний тільки через пошук по сайту;
  • Flash-файли, програми Java, аудіофайли, відеофайли;
  • AJAX * та інші ефекти;
  • Фрейми – контент, запроваджений з іншого сайту, теж можуть стати джерелом проблем;
  • Субдомени – вміст розділяється на піддомени, а не папки.

* Google став набагато краще читати сторінки AJAX, але як і раніше можна приховати зміст безглуздими ефектами.

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

Підсумки

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

Мобільно-дружній дизайн

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

Проте, мобільно-дружній дизайн все ще недостатньо поширений. Ми говорили про те, наскільки важлива “гнучкість” дизайну, ще у 2012 році. За останні п’ять років відбулися істотні зміни – стрімкий розвиток науково-технічного прогресу, значні поліпшення у мобільних мережах передачі даних і так далі. Усе це призвело до того, що ваші потенційні клієнти використовують мобільні телефони як перший (або навіть єдиний) пристрій для взаємодії із вашим бізнес-ресурсом.

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

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

Швидкість завантаження сторінки

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

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

Юзабіліті

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

  • Макет сторінки. Важливим елементам – пріоритет.
  • Візуальна ієрархія. Важливим об’єктам – більше площі та простору.
  • Навігація сайту (і головної сторінки). Чіткі орієнтири (вказівні знаки) для користувачів.
  • Пошук. Великим сайтам необхідний розташований на видному місці і ефективно функціонуючий пошук.
  • Форми реєстрації та оформлення замовлення. Гранично прості і легкі для заповнення.
  • Дизайн. Відмінний дизайн робить рішення усіх інших проблем простішим.

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

Маркетингова воронка для наповнення контентом

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

Структурований спосіб розгляду контенту являє собою типову маркетингову воронку:

Поінформованість. Інформаційний контент, як правило, – це ваш блог і статті. Усе це допомагає вашому потенційному клієнтові у вирішенні проблем, із якими він стикається, ілюструє ваш досвід і надійність.

  • Повідомлення у блозі;
  • Інформаційні статті;
  • Вебінари;
  • Довідники;
  • Питання та відповіді.

Розгляд. Цей контент допомагає порівняти запропоновані вами перспективи із іншими пропозиціями. Зазвичай, це практичний контент, який допомагає клієнтові прийняти рішення.

  • Тематичні дослідження;
  • Інформація про продукт або послугу;
  • Демонстраційні відеоролики;
  • Інструкції для користувача.

Конверсія. Контент стимулює конверсію і м’яко (неагресивно) стимулює продажі.

  • Відгуки;
  • Рекомендації;
  • Безкоштовна пробна версія;
  • Безкоштовна консультація.

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

SEO – гайки й болти

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

Орієнтування за ключовими словами

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

– Сервіси

– – SEO

– – – SEO аудит

www.example.com/services/

www.example.com/services/seo/

www.example.com/services/seo/audits/

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

Головна

– агентство цифрового маркетингу

– компанія цифрового маркетингу

+ Львів

+ Україна

Сервіси

– маркетингові послуги

– послуги цифрового маркетингу

+ Львів

+ Україна

SEO

– SEO

– Пошукова оптимізація

+ Компанія

+ Агентство

+ Львів

+ Україна

Аудиторські перевірки

– SEO-аудит

– Технічний SEO-аудит

+ Агентство

+ Компанія

+ Львів

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

HTML тег Title

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

Кращі рекомендації для тега title наступні:

  • Ключові слова помістіть на початок.
  • Дотримуйтеся розміру від 50 до 60 символів.
  • Використовуйте ключові слова і фрази у природному входженні.
  • Використовуйте роздільники для категорій і брендів.
  • Зосередьтеся на кліках і кінцевому споживачеві.
  • Забезпечте послідовний шлях усім сайтом.

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

Мета-теги description

Мета-теги description на ранжування безпосередньо не впливають. Ми усі це знаємо, чи не так? Але насправді усе дещо інакше. Мета-тег description – це короткий опис вашої сторінки, який використовується пошуковими системами для визначення вашої позиції у результатах пошукової видачі. Він покращує видимість і абсолютно необхідний для залучення користувачів на сторінки вашого сайту.

Мета-теги description повинні:

  • Правдиво описувати вміст сторінки;
  • Рекламувати сторінку і підвищувати кількість кліків.
  • Давати користувачеві уявлення про те, чому він повинен перейти на цю сторінку.
  • Містити ключові слова, коли це буде доречно і природно.

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

Теги header

Теги header допомагають структурувати сторінку та визначають ієрархію у документі: H1, H2, H3 і так далі. Їхній текст зовсім трохи впливає на поліпшення ранжирування, але набагато важливішим є вирівнювання структури сайту і самого контенту. Грамотна побудова, прозора для користувача, допомагає також пошуковим системам класифікувати наш контент, опрацьовуючи кожен окремий простий фрагмент.

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

Вміст сторінки

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

Контент сторінки повинен бути ясним, логічним, доступним. Для його створення повинні використовуватися синоніми і природна мова. Рекомендації з написання відмінного контенту наступні:

  • Помірне використання ключових слів.
  • Розташування ключових слів у вмісті – чим вище, тим краще.
  • Структурування сторінки.
  • Синоніми та альтернативи.
  • Природне входження ключових слів – що ще зробить ваш документ якісним і читабельним?

Оптимізація зображень

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

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

hobbit

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

Технічно оптимізація зображень є абсолютно простою:

  • Назва зображення – вкажіть назву, яка буде чітко окреслювати те, що зображено на картинці.
  • Alt text – використовуйте альтернативний текст, щоб допомогти тим, хто не бачить зображення.
  • Додайте OpenGraph і Twitter Cards для взаємодії із соціальними мережами.
  • Використовуйте правильний розмір фото, щоб забезпечити швидке завантаження.
  • Спробуйте додати зображення до XML-карти.
  • Не використовуйте спам у найменуваннях файлів і alt-текстах за допомогою ключових слів.

Загальні проблеми

SEO-проекти у Lemarbet зазвичай починаються із SEO-аудиту. Тут ми не можемо прокоментувати усі можливі проблеми, із якими доводиться стикатися, тому розглянемо лише найпоширеніші.

Дубльований контент.

Зазвичай зустрічається два види дубльованого контенту – повне дублювання і часткове. У першому випадку одна і та ж сторінка доступна за різними URL. Часткові дублікати – це дублювання на різних сторінках будь-якого блоку контенту. Таке деколи зустрічається на сторінках категорій і описів товарів.

Каннібалізація ключових слів.

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

Домени і піддомени.

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

Розглянемо інтернет-бізнес з двома доменами:

  • Example.com
  • Example.co.uk

З версіями www і non-www:

  • Example.com
  • Example.co.uk
  • www.example.com
  • www.example.co.uk

І сайт працює по HTTP і HTTPS:

  • http://example.com
  • http://example.co.uk
  • http://www.example.com
  • http://www.example.co.uk
  • https://example.com
  • https://example.co.uk
  • https://www.example.com
  • https://www.example.co.uk

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

Джерело: http://searchengineland.com/seo-website-design-everything-need-know-272899

Задати запитання

Залишіть запитання чи коментар до статті:

Your email address will not be published. Required fields are marked *