Gif animacije - HTML5 video

Koje su prednosti i nedostaci GIF-ova? Jesu li GIF animacije dobre ili loše za SEO? U ovoj objavi saznajte zašto je HTML5 video bolji način za prikaz animacija na webu.

Što je GIF?

GIF je kratica od Graphics Interchange Format, a podržava animirane i statične slike. GIF je postao popularan još osamdesetih godina, a popularnost mu je porasla pojavom pametnih telefona i društvenih mreža gdje nas zabavljaju razne animirane sličice u GIF formatu.

Osim na društvenim mrežama, u komunikaciji s prijateljima putem WhatsAppa i sl., GIF animacije počele su se sve češće koristiti i na webu.

Kako Google indeksira GIF-ove?

Google u ovom trenutku indeksira GIF datoteke na isti način kao i obične slike, stoga je GIF koji se nalazi na vašem webu jednako vrijedan kao i slika te može pomoći u vidljivosti vaše web stranice preko „Google slika“.

Svaki sadržaj na webu koji Google indeksira dobar je za web, ali kada govorimo o SEO optimizaciji, GIF možda i nije najbolji način za prikaz animiranog sadržaja.

Jesu li GIF animacije dobre za SEO?

GIF animacije mogu potaknuti korisnike da se dulje zadrže na web stranici, mogu ih potaknuti na neku radnju pa su zato dobri za SEO web stranice. Oni jednostavno čine naš sadržaj zanimljivijim i zato imaju sposobnost zadržati čitatelja dulje vrijeme.

GIF-ovi mogu biti i loši za SEO, ako recimo usporavaju učitavanje web stranice. To može dovesti do lošeg korisničkog iskustva ili jednostavno natjerati posjetitelja da napusti vašu web stranicu jer posjetitelj nema dovoljno strpljenja da se cijela stranica učita.

Kako kaže statistika, većina posjetitelja weba odlazi ako se stranica ne učita za tri sekunde… ? Nažalost, neki GIF-ovi toliko su veliki da su iznimno loši za SEO i zbog njih stranica može biti niže rangirana, iako sav drugi sadržaj zadovoljava sve standarde.

Kako optimizirati GIF za web?

GIF kao i druge slikovne datoteke poput JPG-a ili PNG-a mogu biti uvršteni u sitemap te na taj način informirati tražilice o tome gdje se na stranici nalaze. Dodatno, potrebno je unijeti i zamjenski, odnosno ALT tekst koji će Google-u dati informaciju o sadržaju GIF-a, kao i čitatelju ako se GIF ne učita ispravno. GIFu još možete dodati i opis.

Da biste smanjili veličinu GIF-a možete koristiti dvije metode:

  • Kompresija s gubitkom (Lossy compression)
  • Optimizacija bez gubitka (Lossless optimization)

Veličinu GIF-a možete komprimirati pomoću brojnih online alata ili u Photoshop-u i tako povećati brzinu svoje web stranice.

Kompresija s gubitkom

Kompresija s gubitkom je metoda pogoršavanja kvalitete slike GIF-a na način da korisniku to pogoršanje nije jako vidljivo. Takvo smanjenje veličine GIF-a može ubrzati učitavanje stranice, ali GIF može izgledati lošije.

Optimizacija bez gubitka

Optimizacija bez gubitka ne uklanja piksele, boje i druge informacije pa bi GIF optimiziran ovom metodom i dalje mogao biti loš za SEO i usporavati učitavanje.

Optimizirati GIF bez gubitka i zadržati najbolju kvalitetu moguće je još ako GIF pretvorite u HTML5 video

HTML5 video umjesto GIF animacija

Na našoj stranici h1 design koristimo mnoštvo animiranih grafika, a svaka stranica je svejedno izuzetno brza. To smo postigli zamjenom GIF-a s MP4 i WEBM video formatima.

HTML5 video obično je potrebno pokrenuti i video ima zvuk pa mnogi misle da animacije nije adekvatno prikazivati na takav način. Međutim, nisu u pravu! Želimo li umjesto GIF animacija koristiti HTML5 video potrebno je samo postaviti automatsko pokretanje videa, beskonačno reproduciranje, ukloniti zvuk i opcije videa.