Оригинал сообщения

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

Це досить важлива частина при внутрішній оптимізації.

Семантична розмітка  це контент з грамотно проставленими HTML-тегами форматування.

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

Щоб зрозуміти на прикладі, що ж таке семантична розмітка, перегляньте створені вами HTML-документи з відключеним зовнішнім форматуванням (CSS-стилі, JavaScript і зображення).

Ви можете в тексті знайти заголовки, абзаци, посилання і важливі фрази?

Якщо відповідь позитивна, то ваш документ дотримується семантики.

Як же правильно використовувати HTML-елементи для розмітки?

У першу чергу слід виділити заголовки



Заголовки покликані коротенько розяснювати, анотувати текст, який за ними слід. Тому укладати в них великі шматки тексту не має сенсу.

Для однієї сторінки необхідно вичленувати один загальний заголовок і укласти його в

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

після

, пропускаючи

. Це в тому числі означає, що у добре структурованому документі не може бути заголовка другого рівня без заголовка першого.

Так само важливі й інші HTML-елементи: теги абзацу

, списку

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


Раджу використовувати їх для грамотної побудови структури тексту.




Для семантичної розмітки використовують 2 методи верстки: табличний і блоковий (Дівова).




Таблична верстка  на основі основі таблиць. Текст знаходиться в осередках. У цьому випадку код дуже важко сприймається пошуковими, особливо якщо використовуються вкладені таблиці. Цей метод вважається застарілим, тому в таблицях необхідно розміщувати тільки відповідні табличні дані: яку-небудь статистику, розклад, розрахунки та інше. Але з причини простоти використання таблична верстка зустрічається досить часто.




При блокової верстки текст розташований в блоках

з присвоєними їм css-стилями. Метод вважається грамотним і сучасним!

Переваги семантичної розмітки

Без сумніву, семантична розмітка необхідна для веб-сторінок. Ось кілька переваг такого підходу до оптимізації сайту:




•     Підвищується читабельність, тому що сторінки ресурсу не втратять своєї структури навіть при недоступності зображення, скриптів або CSS;


•     Текст веб-сторінок сайту буде зрозумілий для людей, які читають його за допомогою спецпрограм для читання з екрану;


•     Семантична розмітка покращує рівень індексації сторінок і підвищує релевантність під певні запити;


•     Спрощується редагування тексту, знижуються витрати на редизайн;


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





LIci WP