Новий ресурс, що з'являється в мережі Інтернет, повинен з'являтися в пошуковій видачі вище, ніж сайти конкурентів, саме тоді можна розраховувати на хорошу відвідуваність. Щоб seo специалист міг грамотно виконувати свою роботу, про деякі тонкощі розмітки сторінки повинен подбати верстальник на етапі створення сайту.
Будь-сайт, розміщений в мережі, складається з основної розмітки, яка створює його "каркас", таблиці стилів, що допомагає оформити сторінку так, як потрібно, і скриптів, оживляючих статичну верстку. Для того, щоб в майбутньому у seo-оптимізатора або власника сайту з'явилася можливість просунути ресурс в пошуковій видачі, необхідно заздалегідь, на етапі верстки, подбати про те, щоб дотримувалися основні правила. SEO верстка фактично не вимагає від верстальника додаткових зусиль, йому потрібно лише скористатися стандартними рекомендаціями і приділити більше уваги оформленню коду. Але при цьому вона вкрай важлива для комплексного просування бізнесу в інтернеті , І починати варто саме з внутрішньої опрацювання сайту.
базові вимоги
Сайт може складатися як з однієї (Лендінгем), так і з безлічі сторінок, на кожній з яких верстальник повинен передбачити можливість створення унікального заголовка (Title), опису (meta-тег Description) і URL-адреси. Останній повинен бути человекопонятний, тобто відображати загальний вміст сторінки, на яку перейшов людина. Якщо мова йде про новини на інформаційному порталі, URL такої сторінки може виглядати, як заголовок статті, перекладений на латиницю. Важливо дотримуватися вимог для всіх сторінка сайту, адже кожна з них може залучати трафік, не тільки головна.
У процесі верстки важливо стежити за тим, щоб теги заголовків (H1) були наскрізними. Якщо вони стають загальними для всіх сторінок з пагінацією, фільтрами, виходить, що заголовок дублюється по всіх сторінках, і немає ніякої можливості їх оптимізувати і зробити привабливими для пошукових систем. Перевірити це можна за допомогою різних сервісів. Конкретного виконавця рекомендувати не буду, але можу порадити відмінний сайт з рейтингом сервісів для інтернет-бізнесу https://imhocloud.com/ .
Для залучення трафіку рекомендується в першу чергу звернути увагу на сторінки товарів і послуг, а також популярних фільтрів. Якщо сайт підтримує кілька мов, на кожній сторінці потрібно створювати унікальні заголовки, без цього якісне просування просто неможливо.
Щоб перевірити, як виглядають сторінки сайту для пошукача, досить вбити в рядок пошуку site: адреса сайту і подивитися, які сторінки проіндексовані, як вони виглядають. Яндекс і Гугл може видати до тисячі сторінок, важливо переглянути велику їх частину на предмет помилок, додати ключові слова.
Що повинен зробити дизайнер
Як правило, верстальники переносять зовнішній вигляд сайту в код, але сам макет малює професійний дизайнер. Від його грамотної роботи багато в чому залежать можливості верстальника. Якщо всю роботи виконує одна людина, йому важливо буде дізнатися про деякі тонкощі, які допоможуть в подальшій seo-оптимізації ресурсу.
- Потрібно отрисовать зовнішній вигляд тестових заголовків для тегів H1, H2 і H3;
- Абзаци тексту в верстці полягають в тег <p>, але кожен браузер задає свій відступ між блоками. Верстальник повинен знати, на якій відстані вони будуть перебувати, щоб самостійно задати ці стилі в css;
- Дизайнер повинен показати, як будуть виглядати нумеровані і маркіровані списки, гіперпосилання і акцентовані частини тексту;
- Важливо створити структуру меню, продумати поведінку користувача і точки, з яких він зможе потрапити в розділи з головної сторінки або з внутрішніх.
Варто відзначити, що на основі грамотних макетів верстка під seo займає набагато менше часу, ніж виправлення поганого, необдуманого коду після.
Мобільна версія
У 2019 нерозумно думати, що всі користувачі будуть відвідувати сайт виключно через браузер стаціонарного комп'ютера. Статистика показує, що відсоток мобільних користувачів зростає і стає все вище з кожним роком. Саме тому верстальник і людина, яка буде "натягувати" верстку на движок, повинні подбати про швидкої завантаженні сайту, відсутності будь-яких помилок і неточностей.
Далеко не всі ресурси красиво виглядають на маленьких екранах, а якщо вони пропорційно стискаються, то користувач просто може не потрапити за пунктом в меню, не побачити кнопку замовлення, йому буде незручно розглядати картки товару. Все це призведе до того, що людина швидко закриє сайт, а пошуковик подумає, що ресурс не відповідає пошуковому запиту і знизить його в ранжируванні.
Багато верстальники, уважно стежать за трендами і технологіями, рекомендують починати роботу з верстки сайту під мобільні пристрої, користуватися методикою mobile first і уважно стежити за тим, щоб майбутньому користувачеві було зручно "ходити" по ресурсу і отримувати потрібну інформацію.
поширені помилки
У мережі можна знайти величезну кількість "рад" про вдосконалення верстки. Крім перерахованих вище базових і дійсно працюють рад, можна зустріти твердження про необхідність розміщення блоку контенту ближче до початку сторінки, нібито пошуковики так краще індексують сторінки.
Насправді алгоритми пошукових систем змінюються постійно, щоб уникнути розкручування неякісних ресурсів і поліпшити видачу. Тому жоден seo-фахівець не може з імовірністю 100% розкрити всі секрети пошукових систем. Не потрібно вимагати від верстальника абсурдних речей, він напевно знає, як краще побудувати "структуру" сайту, щоб він правильно працював.
Пошукові роботи дивляться на те, щоб ресурси були якісно зверстані, швидко працювали, не змушували користувача довго чекати завантаження сторінки, а також мусять знаходитись на сторінках якісний унікальний контент. Роблячи такі прості речі, правильно оформлюючи нові статті, можна бути впевненим в тому, що ресурс буде просуватися і реальні читачі, які стануть головним його двигуном, дадуть хороший трафік.
Говорячи про найбільш грубі помилки, потрібно відзначити наступне:
- Інформація представлена на зображенні замість тексту. Так робити не можна, важлива інформація повинна бути прописана літерами.
- Flash заставка замість головного екрану. Таку версію оформлення складно зустріти в 2019 році, але деякі дизайнери як і раніше вважають, що це креативно. Насправді багато браузери блокують Flash елементи, а у користувачів такий ресурс не викликає довіру.
- Використання тегів тегів <h1> - <h6> поза тестових заголовків. Всі необхідні елементи укладаються в теги <div>, <span> і інші HTML5 елементи.
- Інлайновие стилі допустимо використовувати тільки під час налагодження та роботи, перед здачею проекту важливо винести їх в файл css.
- Шматки js-коду також потрібно винести в окремий підключається файл.
Вкрай важливо стежити за тим, щоб сайт був кросбраузерності і правильно відображався на різних платформах, для цього варто виділити час на тестування після попереднього здавання проекту. Описані стандарти верстки давно стали правилами хорошого тону серед верстальників і дизайнерів. Вони допомагають не відволікатися на деталі після того, як проект практично завершений, а закривати всі "дірки" відразу, у міру роботи.