Семантично, правилно изграденият уеб сайт или дадена целева страница от сайта, с всички спазени HTML5 правила и указания в кода, може да окаже допълнително влияние върху класирането на сайта в търсачката. Една от основните причини, поради която това е важно, е да се подобри достъпността на уеб сайта, основно за хора с увреждания. Например, всеки незрящ човек, използващ екранен четец, има необходимост от възможността да се придвижи до различни секции на страницата с определено съдържание в тях, вместо да изчита нейното цяло съдържание, от началото до края. Използването на правилните маркери (h1, h2, h3…) във всяка секция, прави това още по-лесно. Потребителят може да прослуша всички заглавия на секциите, след което да прецени и да се спре на тази част от страницата, която е интересна за него, ако разбира се има такива.
HTML5 семантика за по-добра достъпност
Какво е HTML5 семантика и кои са по-известните HTML5 семантични елементи. Как да ги използваме в процеса по изработка на сайт и каква е тяхната полза, значение и влияние по отношение на SEO оптимизацията на сайта.
Какво е HTML5?
HTML5 е последния проект на HyperText Markup Language, в който са добавени няколко нови HTML семантични елементи и правила, способстващи за по-добра достъпност и по-точно индексиране и определяне съдържанието на уеб страницата, от търсачките. HTML5 е най-новата версия на HTML – Интернет стандарт, на базата на който се осъществява изработването на всеки уеб сайт.
Какво е ползата на HTML5 за SEO?
Стандартните HTML заглавни тагове – h1, h2, h3 и т.н. в кода на уеб страницата, формират базата на нейната SEO оптимизация. Търсачките използват тези маркери, за да разберат по-добре, какво представлява съдържанието на съответната страница. Оптимизирането на тези тагове е основна SEO практика за подобряване на класирането в резултатите от търсене. Освен тези заглавни маркери, HTML5 предоставя няколко нови семантични елемента, които също може да бъдат използвани в процеса на оптимизирането на уеб сайта.
Какво е HTML семантичен елемент?
Всеки от HTML семантичните елементи има свое специфично предназначение. Например тагът <h1> е семантичен елемент, който съобщава на ботовете на Google и други търсачки, че затвореното съдържание в маркера е най-значимото заглавие, съдържащо се в HTML документа или в съответната секция от сайта. Тагът <div>, от друга страна, е несемантичен елемент, тъй като той само указва разделяне в HTML документа и не дава информация на търсачаката, за значението и определянето на съдържанието в рамките на маркера.
Кои са новите семантични маркери в HTML5?
Издаването на HTML5 доведе до появата на някои нови семантични маркера, които предоставят още по-точна информация за ботовете на търсачките, по отношение на съдържанието в уеб страницата. Някои от по-важните, нови HTML5 семантични елементи и тяхното значение по отношение на SEO оптимизацията:
<article> : Този елемент улеснява маркирането на нови публикации и статии в блогове или новинарски уеб сайтове. Този маркер може да придаде по-голяма тежест за търсачките, на съдържанието в него. Също така спомага за по-добър и изчистен HTML код, като намалява необходимостта от използването на маркерите <div>.
<section> : Съдържанието в сайта обикновено е разделено на различни секции, като по този начин потребителите, най-вече тези с увреждания, ще намират по-лесно това, което търсят. Маркерът <section> може да бъде използван в случаите, когато е необходимо уточняване на тези раздели и подраздели със съдържание.
<header> : Маркерът <header> може да се използва за определяне и фиксиране на заглавката в уеб страницата, да съдържа лого, навигационно меню и други елементи. Също така, този маркер може да се използва и за обозначаване на заглавната част на страница и да съдържа <h1> маркер, навигационни връзки и друг подходящ текст.
<footer> : Въпреки че не е толкова полезен, маркерът <footer> също предлага някои SEO предимства, тъй като може да бъде използван за определяне на съдържанието в долната част на уеб сайта, като например име на автор, информация за авторски права, декларация за поверителност, контактна информация, полезни връзки и др.
<nav> : Навигацията несъмнено е един от най-важните аспекти на даден уеб сайт. Маркерът <nav> може да се използва, за да се уточнят вътрешните връзки в сайта, както тези от главната навигация, така и други връзки за странициране на публикации.
<video> : Този маркер е един от най-полезните нови маркери, тъй като позволява съвместимост между различни браузъри, по отношение на визуализиране на видеоклипове, без да се налага използването на Flash. HTML5 също така дава възможност за включване на допълнителна информация за видеоклипа.
<figure> : Този елемент може да съдържа изображение, илюстрация, диаграма или кодов фрагмент и е самостоятелен, което означава, че може да бъде преместен, без това да засегне главния поток на документа. Маркерът <figure> може съдържа и <figcaption> в себе си, ако е необходимо да се добави надпис към изображението.
<aside> : Етикетът <aside> може да послужи като маркер на раздел, в който е поместено вторично съдържание от сайта. Този елемент е подходящ за маркиране на странична лента или секция под основната статия.
Това ще спомогне ли за по-добро класиране на уеб сайта?
Отговорите на този въпрос са доста противоречиви. Има малко публикувани казуси или официални потвърждения от страна на Google, че ако уеб сайтът притежава правилен семантичен HTML5 код, това ще повлияе за неговото по-добро класиране в резултатите от търсене или ще създаде по-добра експозиция от обществени търсения. Все пак е добре да се изтъкне факта, че колкото повече семантични подробности предоставя един уеб сайт на ботовете, толкова по-добре търсачките ще могат да разберат и индексират съдържанието му. За това, може да бъдете убедени, че правилното използване на HTML5 семантични елементи със сигурност би било от полза за Вашето съдържание и би направило сайта по-достъпен, като цяло. Все пак не забравяйте, че водещ параметър за по-добра SEO оптимизация е богатото и уникално съдържание в сайта.