Що треба знати веб-розробнику про SEO?
Файно зробити добрий сайт.
Не менш важливо - потому сайт розкрутити.
І значною мірою те, як ваш сайт буде розкручуватися, залежить від технічного SEO.
Імплементувавши принципи дружнього до SEO коду під час первинної розробки, ви одразу ж дасте своєму дітищеві хорошу фору в розкрутці.
Ба й зекономите час і нерви:
Не доведеться-бо перекопувати й переробляти код і дизайн вже на готовому веб-застосунку чи то веб-сайті.
Що варто знати веб-розробнику про SEO, перш ніж розробляти сайт?
Що таке SEO?
SEO - з англійської Search Engine Optimization - пошукова оптимізація, або оптимізація для пошукових систем. У просторіччі просто сео (це нашими літерами, не плутати з сі-і-оу, Chief Executive Operator).
Я визначаю SEO так:
"...[це] комплекс заходів, спрямований вивести сторінки сайту на найвищі позиції в видачі пошукових систем за дотичними пошуковими запитами."
Простими словами, головна проблема й ціль SEO - як зробити так, щоб ваш сайт знаходили через пошук у (зазвичай) Ґуґлі.
А топ-позиції в пошуку потрібні, бо на перші позиції таки клікають найчастіше.
Наріжні стовпи пошукової оптимізації:
- технічне SEO - коригувати код так, аби його легше було читати пошуковим ботам
- контент - власне, те, що користувачі будуть шукати в Ґуґлі
- юзабіліті - користувачі мають почувати на вашому сайті зручно (Ґуґл має засоби це враховувати)
Також зовнішня оптимізація - ланкобудування (linkbuilding), себто здобувати вхідні посилання на сторінки вашого сайту.
Але зовнішнє - то робота винятково маркетингових спеціалістів.
Нижче я говоритиму про важливі компоненти трьох перших аспектів що об'єднуються поняттям внутрішньої оптимізації (все, що робиться на самому сайті). Яка без сумніву торкається розробників сайтів і веб-застосунків - особливо технічне SEO.
SEO-дружня структура сайту
Читабельна для пошукових ботів структура сайту - це основа.
Почнімо з того, як діють пошукові боти, котрі передають пошуковим системам усю потрібну для роботи інформацію.
Пошукові боти сканують сирий HTML-код сторінки, переходячи на інші сторінки через гіперпосилання. Гіперпосилання як на інші веб-сайти (називаються зовнішні посилання) - так посилання в межах одного сайту (внутрішні посилання).
Що треба робити з внутрішніми посиланнями? Власне, мати їх на сайті, аби вони допомагали пошукових ботам знаходити і сканувати ваші ж веб-сторінки.
По-друге, тіла посилань (зокрема внутрішніх) дають пошуковикам контекст - отже, Ґуґл та ін. краще розуміють, про що йдеться на вашому сайті (що важливо, гіперпосилання дають контекст як про цільову, так і про вихідну сторінку).
Додаткове читання:
The complete guide to internal linking (Neil Patel)
Рекомендовані інструменти:
Вихідні посилання - вікно надвір?
Побутує повір'я, що всі вихідні посилання мусять бути невислідними. Себто містити атрибут rel="nofollow" і не подавати посилання як рекомендацію сайту, на який веде. Інакше - кака в плані SEO.
Можу уявити, звідки це повір'я походить. Припускаю, оригінальна версія звучала так: "Всі вихідні посилання мають бути невислідними. Окрім тих, за які нам заплатили."
Однак Ґуґл вже давненько штрафує за проплачені вислідні посилання. Тому "закупляти/продавати силки" - не варіянт.
(Бінґ, до речі, дозволяє платні беклінки. Але кого це колише? :) )
Що це все означає для простору вашого сайту?
Звісно, спамо-помийниці як деякі т.зв. "веб-каталоги" з купою неоковирного сміття - Ґуґл розглядає як низькоякісне й шкідливе “г”.
Але (з доброго сайту) посилатися на добрі, якісні, авторитетні у вашій ніші сайти - природнім чином, вставляючи питомі лінки, де треба (питомо) - це навіть додає в SEO. І геть не варто в таких випадках боятися вислідних посилань. Навпаки!
Невислідний атрибут на вихідні посилання варто ставити лише якщо ви непевні в якості сайту, або то не зовсім дотичний чи не авторитетний сайт.
По-друге, є ідея голистичного SEO. Як то кажуть: віддавай - і вернеться.
А для нас також важить патріотичний аспект. Якщо ви вже на сайті бібліотеки вебу українською, припускаю, вам це буде близьке. Так ось:
Чому б не підтримувати класні українські проекти "рекомендаціями" вислідних посилань?
Питання риторичне.
От можете перевірити в мене на блозі (artemis.in.ua, коли що). Я посилаюся на css.in.ua лише вислідними посиланнями. Бо це класний і потрібний проект. Мені не шкода підтримати наше.
Мобільна оптимізація
Mobile-first пошуку Ґуґла - це вже факт.
Вам як розробникам звісно краще знати як оптимізувати дизайн вашого сайту для мобільних.
Чи респонсивний дизайн, чи осібна мобільна версія (зазвичай суб-домен на кшталт m.example.com), ачи динамічна версія - діло ваше.
(Хоча варто зазначити, що в світі домінує перше - респонсивний дизайн, коли макети розтягуються чи стискаються залежно від розміру та пропорцій екрану користувача.)
Чи так воно важливо? Так.
Мало того, що для мобільних юзерів (яких більшість) Ґуґл сканує спершу мобільний варіант сторінки (оте Mobile-first), так ще й ранжує результати видачі в пошуку почасти зважаючи на мобільну дружність.
Так, Ґуґлоботи аж такі розумні, що навіть визначають чи достатньо великі елементи взаємодії (і.е. кнопки) вашого сайту - щоб юзерам було зручно тепати з мобілки.
Кілька зауваг по мобільності:
- користувацький досвід має бути націлений радше на те, щоби скролити, ніж клікати
- знов же таки, кнопки й елементи дизайну мають бути крупними, а шрифт - великим
- користувачі смартфонів переважно дивляться відоси в вертикальному положенні екрану - варто пересвідчитися, що ваші медіа не надто широкі для вузьких мобільних екранів
- уникайте довгих абзаців: по-перше, вони не влазять в екран мобілки, по-друге, вертикальна структура може робити довгі шматки тексту громіздкими і важкочитабельними
- швидкість завантаження (про це докладніше трохи нижче) - пам'ятаємо, що на мобілках часто бравзять з повільнішого мобільного інтернету
Дружність веб-сторінки до мобілок можна перевірити за допомогою тулзи Ґуґла: https://search.google.com/test/mobile-friendly
Швидкий сайт - любов навіки
Ґуґл пильно слідкує, чи зручний ваш сайт користувачеві.
І те, наскільки швидко завантажуються ваші веб-сторінки - один з найзначніших факторів юзабельності, що його відстежують пошукові системи (слідом за Ґуґлом підхопили й інші).
Сторінка має завантажуватися (до перших змістовних обрисів) не довше 3 сек. Бажано менше 1 сек. А по-хорошому - ЧИМШВИДШЕ.
Цифри: 47% відвідувачів очікують, що веб-сторінка завантажиться менше ніж за 2 секунди. 53% користувачів покидають веб-сторінку, якщо вона завантажується довше 3 сек. (Джерело)
(А час, проведений відвідувачами на сторінках вашого сайту, до речі, Ґуґл також пильно відстежує та враховує як один з важливих факторів ранжування. Пруф тут.)
Перевірити швидкість можете власне за допомогою тулзи Ґуґла: https://developers.google.com/speed/pagespeed/insights/
Так, ніхто не любить чекати, тим паче в інтернеті. Тому треба зробити все можливе, аби пришвидшити сторінки.
Я як SEO-спеціаліст у тому не порадник. Це треба стискати CSS та JS файли, мінімізувати час, за який завантажуються скріпти, зменшити час, за який відповідає сервер (напр., змінивши хостинг). І прочая, прочая, прочая (що є частиною діяльності розробника).
До речі, вище згаданий PageSpeed Insights дає короткі поради як ви можете оптимізувати швидкість з якою завантажуються ваші веб-сторінки.
AMP
От про що я хочу додати зі свого боку - це Accelerated Mobile Pages, технологія яку підтримує Ґуґл і яка завантажує сторінки просто миттєво. І звісно ж порадити її використовувати для вашого блоґу (журналу, лоґу, новин - коротше кажучи, регулярних постів).
Можливо ви вже знаєте, але нагадаю: AMP робить сторінки неймовірно швидкими, що критично для мобільних юзерів (особливо на нешвидкому мобільному інтернеті)
Я б не радив звісно робити сайт AMP-first. Це вбиває ідентичність сайту.
Втім зробити AMP-версію дефолтною для мобільних юзерів у Ґуґлі - безцінно.
Якось так:
Рекомендовані ресурси:
Доменне ім'я і SEO
Створюючи сайт, вам треба дати йому ім'я. Принаймні доменне ім'я, без якого жоден сайт не може бути.
Вплив доменного імені на пошукову видачу не такий як у прадавні часи, коли можна було демпити ключовиками в URL-адресі - проте є важливі елементи.
HTTPS - усьому голова (або: Безпечність впливає на пошукове ранжування)
Вже доконаний факт, що безпечний протокол передачі даних є одним з відчутних факторів ранжування в Ґуґлі.
Власне, на css.in.ua вже про це писали з точки зору розробника.
Що таке SSL сертифікат і навіщо він потрібен?
Я лише наголошую, що SSL сертифікат важливий для ранжування в Ґуґлі.
Також не варто оминати увагою безпечні заголовки (HDD Headers): https://securityheaders.com/?q=artemis.in.ua&followRedirects=on
Кілька інших SEO зауваг по домену
- вживайте без дефісів смислову частину веб-адреси
- в плаґу вживайте дефіси, щоб розділяти слова (а НЕ нижні підкреслювання)
Щодо Exact-Match Domain. За деякими даними ключові слова в доменному імені все одно впливають на видачу, хоч і звісно не на 100% як раніше. Тому якщо матимете ключовик у веб-адресі сайту - добре (як от у нашому css.in.ua). Хоча як на мене (і не тільки на мене) тут ідеться радше про людський фактор. І тому я б не радив цим заморочуватися, особливо сайтам які працюють радше на власний бренд. Тим паче, що сам Ґуґл каже: ключовики в доменному імені геть не впливають на ранжування.
Моя інфографіка стане в пригоді (клікніть, щоби відкрити в повному розмірі):
Рекомендовані ресурси:
Як веб-адреса сайту (доменне ім'я) важить для SEO
Мета-дані
Мета-дані - це спеціальний текст веб-сторінки, який читають пошукові боти, а пошукові системи показують у результатах. От як тут:
Складових частин мета-даних дві:
1. Мета-назва
(теґ HTML <meta name='title'>)
Мета-назва - це назва веб-сторінки, яка відображатиметься в пошукових системах. На скріншоті це "Artemis | Блоґ про інтернет-маркетинг".
В мета-назві звісно ж варто писати ключові слова.
Другий момент - рекомендовано дотримуватися довжини до близько 50-60 знаків, аби вся назва влазила в сніпети пошукових результатів.
2. Мета Опис
(теґ HTML <meta name='description'>)
Мета-опис - це розлогий опис, про що є сторінка. Спрямований на користувачів, які шукають певну інформацію в Ґуґлі (чи де-інде) - тому відповідно й треба звертатися.
На скріншоті це: "Набридло читати про інтернет-маркетинг машинний переклад? Тоді вам сюди. Корисні статті про SEO, SMM та інше."
Рекомендовано не дуже розводитися в мета-описі - бо частину тексту буде просто не видно в пошуку (рекомендовано до ~160 символів). Але й надто коротким робити опис не радять (скажімо, SEO-плаґін Yoast починає підсвічувати зеленим лише з 121 символу).
По ключовиках у мета-описі поради дві:
- по-перше, вони мають бути
- по-друге, вони мають бути якомога ближче до початку
Що треба знати ще?
Часом Ґуґл може заміняти мета-опис зі вказаного авторами веб-сторінки на той, що дужче підходить під запит.
Наприклад, за запитом "які цілі пошукової оптимізації" на першу сторінку вигулькнула стаття з мого Глосарію "Оптимізація для пошукових систем (SEO)", проте мета-опис не той, що я його зазначав, створюючи статтю - а уривки тексту з підрозділу "Цілі пошукової оптимізації".
Медіа, медіа всюди
Бажано на кожну сторінку додати бодай одне зображення.
Це, в принципі, все, що хотів тут сказати й показати. Зображення - маст-гев.
Соціальний
Соціальні сигнали - один з важливих факторів ранжування (№9 за дослідженням MOZ).
Популярність сайту/бренду в соцмережах - добрий сигнал Ґуґлові, що сайт корисний суспільності. Особливо якщо йдеться про локальний бізнес.
А третій на глобальному ринку пошуковиків Бінґ взагалі офіційно визначає соціальні сигнали як основний фактор ранжування.
Що можу порадити зробити на початках?
Зразу забийте імена профілів (УРЛи) для ваших соціальних профілів. Навіть якщо наразі не збираєтесь активно вести соціалки - просто забийте місце.
Наприклад, якщо плануєте створити сайт з назвою developer.ua - створіть зразу Твітер-акаунт з нікнеймом на кшталт @developer_ua.
Також зареєструйте бренд у Google My Business, де користувачі зможуть лишати відгуки про ваш бренд.
Останнє і Загальне: Менше (Джаваскріпту) Свистунців!
По-хорошому, сайт має працювати цілковито без Джаваскріпту.
Перевірити це просто: вимкнути JS-підтримку в браузері й спробувати покористуватися вашим сайтом.
Якщо сайт геть не працює без ДжС - погані новини. Це сигнал Ґуґлові і про гіршу юзабельність, і - самі знаєте, що багато Джаваскріпту заповільнює сайт.
А я наостанок скажу інше - пошуковики досі читають сайти як HTML і текст. Тож розробникам варто пересвідчитися, що ні текст, ні медіа-файли не закодовані в Джаваскріпт. Отже, пошуковики розуміють краще, про що йдеться на сторінках веб-сайту.
Ну і взагалі - менше коду, більше контенту! (Хто сказав AMP?)
Кілька SEO-інструментів
(про які варто знати всім)
Початкове:
WooRank - швидко перевірте, наскільки SEO-дружній ваш сайт.
Google Search Console - доконечний інструмент SEO від Ґуґла (як сайту буде публічний, зразу ж додайте до GSC XML-мапу сайту)
Bing Webmasters - трохи трафіку є і з Бінґу (теж додайте туди XML-мапу сайту)
Google Analytics - докладна веб-аналітика від Ґуґла
Я також додаю XML-мапу сайту до Yandex Webmasters - Яндекс досі лишається другою пошуковою системою в Україні, навіть попри блокування. До того, DuckDuckGo значною мірою бере інфу про українські сайти Яндексу. Business is business.
Просунуте:
MOZ Link Explorer - хороша тулза від гіганта SEO-індустрії, котра оповість про силу вашого домену чи лінку, кількість беклінків, беклінкуючих доменів тощо.
SEMrush - загальний SEM-сервіс, який пропонує низку різноспрямованих інструментів для SEO, пошукової реклами, брендингу, SMM; має безкоштовну версію і преміум, який розширює можливості
ahrefs - платний професійний SEO-інструмент (навіть проба на тиждень коштує $7), втім на думку багатьох найкращий; цілком підтримує роботу з українським контентом і ключовиками українською; коли що, там пів-команди з України, то можете вільно звертатися в сапорт нашою мовою :)
Додатки до бравзера:
Nofollow - дуже простий, але й дуже корисний додаток, який показує на сторінках невислідні посилання (є для Хрому і Мозіли)
Open SEO Stats - додаток з відкритими SEO-даними по будь-якому сайту - зручно!
Післямова
Наостанок скажу:
SEO - це завжди для людей.
Як й інтернет-маркетинг загалом. Як і веб-розробка.
Тож:
Робімо добре для людей.
Робімо добре для нас - українців.
І всьо буде чотко.
https://www.youtube.com/embed/UX6EGrbX_IQ
Автор: Артем Бебик — письменник, блоґер, маркетинг-спеціаліст. Народився в Миколаєві, живу у Львові. Публікувався в літературних журналах "Дзвін", "Соборна вулиця". Більше 10 років працюю в інтернет-маркетингу.