Zašto su HTML5 i Schema dobar izbor za SEO?

Optimizacija sajtova za internet pretraživače (eng. Search Engine Optimization, iliti SEO) postala je sastavni deo veb dizajna. Ako pokrećete sajt, normalno je da želite da on bude viđen, posećen i da, naravno, donosi profit (ako je napravljen u komercijalne svrhe).

Ono što svaki dizajner i programmer treba da imaju na umu jeste da od samog početka izvođenja projekta treba da obrate pažnju da se sajtovi prave za korisnike i pretraživače. Treba da budu tako usklađeni da se obrati posebna pažnja ne samo na funkcionalnost, nego i na opštu organizaciju, planiranje organizacije (kategorizaciju) i obeležavanje bitnog sadržaja.

A to se lako može uraditi pomoću programskog jezika HTML5 i zajedničkog vokabulara za markiranje strukturnih podataka Schema odobrenog od strane WWW konzorcijuma (eng. World Wide Web Consortium, W3C ).

Zašto HTML5?

Da li ste nekada čuli da je semantika HTML5 veoma povoljna za Guglov pretraživač? Stanje stvari je takvo upravo zato što je taj programski jezik tako dobro struktuiran i koristi se praktično od samog početka izrade vebsajtova – upravo on predstavlja stožer svake dobro napravljene veb stranice. Preko HTML-a pretraživač dobija signale gde se šta nalazi, kao npr. slike, video klipovi, skripte itd.

Neki od semantičkih elemenata HTML5 su:

<header> – označava naslov/zaglavlje sekcije ili dokumenta

<main> – ovim elementom se definiše glavni sadržaj dokumenta

<nav> – definiše navigacione linkove

<article> – definiše sadržaj unutar dokumenta (blog članka, komentara itd.)

<section> – definiše sekciju dokumenta

<figure> – definiše nezavisni sadržaj (fotografije, ilustracije, video klipove itd.)

<mark> – definiše označeni/markirani sadržaj

<figcaption> – definiše tekst ispod slike

<hgroup> – definiše grupu tagova/oznaka u zaglavlju

<footer> – definiše zaglavlje dokumenta

<time> – definiše vreme

Iako ovi elementi ne znače puno običnom korisniku, u očima pretraživača – oni su od velike važnosti, te je neophodno da se primenjuju u izradi vebsajtova.

Gugl podržava HTML5

Želeći da podstakne korišćenje jezika HTML5, Gugl je izbacio podršku za Adobe Flash player u svom internet pregledaču Chrome i još u novembru Gugl je najavio izbacivanje oglasa napravljenih u Flešu, a juče je i zvanično potvrđeno da neki oglasi u Flešu više neće biti dozvoljeni na ovom internet pretraživaču, prenosi BBC.

Konačni prekid će se desiti 2. januara 2017. godine, ali, uprkos pretpostavci, firma Adobe neće ostati kratkih rukava. Naime, svesni da je Fleš prestar za novo doba, oni će nastaviti da šalju ažuriranja starim korisnicima, ali će takođe razviti i novu podršku i alate za HTML5 (izvor: CMSWire).

html5

Opšte je poznato da Fleš i SEO ne idu zajedno, pogotovo na mobilnim uređajima, tako da veb dizajn koji se oslanja na upotrebu Fleša Gugl nakon ažuiranja algoritma u aprilu 2015. sajtove sa tom tehnologijom automatski lošije rangira jer su takoreći nevidljivi na npr. ajfonu. S obzirom na to da Gugl diktira pravila igre, ukoliko želite da se vaš sajt dobro rangira na ovom pretraživaču – potrebno je da se pridržavate unapred definisanih pravila u algoritmu.

Zašto Schema?

Opšteusvojeni vokabular Schema (mikropodaci) predstavlja deo kôda koji se dodaje na veb stranice i, naravno, pomaže pretraživačima da bolje shvate šta taj sadržaj zapravo označava. Kada se na vebsajtu dodaju Schema markeri, pretraživač je onda u stanju da u pretrazi korisnicima izvuče određene delove sa tog sajta i pomogne korisniku u shvatanju o čemu se na stranici radi.

Neki od Schema informacija su datum i vreme, adresa, cene, ocene i sl.

[code]

<div itemscope itemtype=“http://schema.org/Restaurant“>
<span itemprop=“name“>MojRestoran</span>

<div itemprop=“aggregateRating“ itemscope itemtype=“http://schema.org/AggregateRating“>
<span itemprop=“ratingValue“>4</span> zvezdice –
based on <span itemprop=“reviewCount“>250</span> broj ocena korisnika
</div>

<div itemprop=“address“ itemscope itemtype=“http://schema.org/PostalAddress“>
<span itemprop=“streetAddress“>Vojvođanskih brigada 123</span>
<span itemprop=“addressLocality“>Novi Sad</span>,
<span itemprop=“addressRegion“>Vojvodina</span> <span itemprop=“postalCode“>21000</span>
</div>

<span itemprop=“telephone“>(021) 123-4567</span>
<a itemprop=“url“ href=“http://www.domain.com“>www.domain.com</a>
Hours:
<meta itemprop=“openingHours“ content=“Mo-Su 11:00-02:30″>pon-ned 11.00-02.30

Categories:
<span itemprop=“servesCuisine“>
Srednjoevropska kuhinja
</span>,
<span itemprop=“servesCuisine“>
Mediteranska kuhinja
</span>
Cenovni rang: <span itemprop=“priceRange“>RSD</span>
Rezervacije: Da
</div>

[/code]

Ukoliko želite da se malo bolje upoznate sa Schema vokabularom, poznati sajt W3schools nudi vam besplatni tutorijal za upoznavanje sa strukturom XML Schema. Takođe, sve potrebne informacije možete pronaći i na zvaničnom sajtu Schema.org.

Očigledno je da se upravo dešavaju promene na vebu, a koliko će male ili velike biti – vreme će pokazati. Do tada je najbolje pratiti zvanična uputstva i ne odstupati od specijalnih pravila rangiranja koja nam Gugl propisuje.