Як прописати h1 на сайті

1. Що означає h1-h6?
2. Основні правила роботи з заголовками
3. Як перевірити наявність h1 на сторінці?
4. Якщо проблема знайдена, як її вирішувати?

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

Що означає h1-h6?

Почати в будь-якому випадку потрібно з теорії, тому що без цього неможливо рухатися далі. Отже, це html-теги, в які поміщають текст, який повинен стати заголовком. H1 - це головний заголовок сторінки, він повинен бути єдиним, h2 - підзаголовок статті або розділу глави (якщо мова йде про книгу), h3 - заголовок в розділі і т.д.

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

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

Практичний курс по верстці адаптивного сайту з нуля!

Вивчіть курс і дізнайтеся, як верстати сучасні сайти на HTML5 та CSS3

Основні правила роботи з заголовками

Скільки h1 може бути на сайті? Скільки завгодно, адже інтернет-ресурс може складатися з безлічі сторінок. Тут набагато важливіше дотримуватися іншого правила - на кожній окремій сторінці вашого сайту повинен бути ОДИН h1. Все тому, що це головний заголовок, а головним завжди повинен бути один.

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

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

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

Очевидно, що h1 повинен бути на самому початку статті. Це не те ж саме, що мета-тег title. Title видно при пошуковій видачі і в назві вкладки браузера, а h1 - безпосередньо на сторінці. Решту заголовків (h2-h6) може бути скільки завгодно, в будь-якій кількості.

Як перевірити наявність h1 на сторінці?

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

По-перше, відкрити вихідний код і зробити в ньому пошук. Вихідний код відкривається за допомогою комбінації клавіш Ctrl + U. Далі вам знадобиться комбінація Ctrl + F, щоб відкрити пошук. Введіть в ньому назву потрібного тега, а саме - h1.

Практичний курс по верстці адаптивного сайту з нуля!

Вивчіть курс і дізнайтеся, як верстати сучасні сайти на HTML5 та CSS3

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

По-друге, ви можете скористатися будь-яким сервісом, який аналізує сайт на показники його пошукової оптимізації та видає звіт. Таких сервісів дуже багато, я приведу лише деякі: pr-cy.ru, audit.megaindex.ru/

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

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

Якщо проблема знайдена, як її вирішувати?

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

Наприклад, в WordPress вам потрібно буде редагувати файли page.php (шаблон сторінки) і single.php (шаблон записи). Також корисно буде переглянути файли index.php (головна сторінка) і archive.php (архіви за датою і автору), а іноді в темах є ще category.php (записи окремої рубрики).

Ну, припустимо, знайшли і відкрили ви потрібний файл, що робити далі? Далі скористайтеся все тим же пошуком (Ctrl + F). Знову введіть туди назву тега. Якщо коду у файлі трохи, то ви і самі можете переглянути його і знайти потрібні рядки. Тут перебіг подій залежить від того, що саме потрібно виправити.

Наприклад, в одному шаблоні назва посади виводилося в h2. Можливо, його розробник не розбирається в SEO, тому і допустив таку помилку. Але це легко виправляється. Редагуємо single.php і міняємо в ньому h2 на h1. Це можна зробити як вручну, так і за допомогою функції автоматичної заміни.

Можливо, так само знадобиться редагування бічної колонки (sidebar.php). Власне, зайві h1 можуть бути де завгодно: в заголовках віджетів, в меню і навіть в футере (footer.php). Все це потрібно знайти і прибрати.

Ну а що робити, якщо в самій статті кілька h1? Тоді проблема вирішується ще легше - редагуванням самої статті. Приберіть всі зайві h1, залишивши тільки один головний верхній заголовок.

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

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

Практичний курс по верстці адаптивного сайту з нуля!

Вивчіть курс і дізнайтеся, як верстати сучасні сайти на HTML5 та CSS3

Подивіться відео і дізнайтеся покроковий план по створенню сайту з нуля!