Kép és videó SEO

A kép és videó SEO azt jelenti, hogy a vizuális tartalmaidat úgy készíted el, nevezed el, tömöríted, jelölöd és ágyazod be, hogy a keresők megértsék, gyorsan betöltsék és megjeleníthessék őket a képkeresésben, a videós találatokban és a normál találati listában. Az alapja a jó fájlnév, az értelmes alt szöveg, a megfelelő formátum, a strukturált adat és a vizuális elemet körülvevő releváns szöveg.

Bevezetés

A legtöbb webhelyen a képek és videók utólag kerülnek a szövegbe. Valaki megírja a cikket, aztán keres hozzá egy illusztrációt, feltölti a IMG_4821.jpg nevű fájlt négy megabájtban, alt szöveg nélkül, és ezzel a vizuális rész le is van tudva. A keresőnek ebből szinte semmi hasznos jel nem jut el, a látogató pedig lassabban kapja meg az oldalt. A kép és videó SEO ezt a hozzáállást fordítja meg: a vizuális tartalom ugyanúgy tervezett elem, mint a címsor vagy a bevezető bekezdés.

Miért érdemes vele foglalkozni? Mert a vizuális tartalom több helyen is forgalmat hozhat. Megjelenhet a képkeresésben, a normál találatok között képes vagy videós elemként, a videós fülön, és a vizuális keresés (például amikor valaki egy fotóval keres) is képekre épül. Ezen felül a képek és videók erősen befolyásolják az oldal sebességét és stabilitását, ami közvetve az egész oldal teljesítményére hat.

Kinek szól ez a terület?

Szinte mindenkinek, aki weboldalt üzemeltet, de nem egyforma súllyal. Egy webáruháznál a termékfotó a döntés egyik alapja, ott a képoptimalizálás közvetlen bevételi tényező. Egy receptoldalnál, lakberendezési blognál vagy utazási oldalnál a képkeresés komoly forgalmi forrás lehet. Egy B2B szolgáltatónál inkább a betöltési sebesség és a magyarázó videók szerepe nagyobb. Egy oktatási vagy szoftveres oldalnál a videós útmutatók megjelenése a találatok között lehet a fő cél.

Mit nem old meg a kép és videó SEO?

Fontos tisztán látni a korlátokat. Egy gyenge, a keresési szándékot nem kiszolgáló oldalt nem fog egy jól megjelölt kép felhúzni. A vizuális optimalizálás erősítő tényező: ha az oldal tartalma releváns, segít jobban megjelenni és több csatornán láthatóvá válni. Ha az oldal tartalma nem releváns, a kép önmagában ritkán változtat ezen.

Ugyanígy nem varázsszer a strukturált adat sem. A jelölés segít a keresőnek értelmezni a tartalmat, de nem garantálja, hogy a kép vagy a videó kiemelt formában megjelenik. A megjelenésről mindig a kereső dönt.

Gyakori tévhitek röviden

"Az alt szöveg kulcsszógyűjtésre való." Nem. Az alt szöveg elsősorban akadálymentesítési elem, a képet írja le annak, aki nem látja. A túltömött alt szöveg rontja a felhasználói élményt.
"A YouTube-videó beágyazása automatikusan hoz forgalmat." Nem feltétlenül. Ha a videó a YouTube-on jelenik meg a találatok között, a kattintás gyakran oda megy, nem a te oldaladra.
"Minél kisebb a kép, annál jobb." A túltömörített, homályos kép rontja a minőségérzetet és a konverziót. Az egyensúly a cél.
"A lazy loading mindenhol jó." Az oldal tetején, az első képernyőn látható fő képnél a késleltetett betöltés lassíthatja a legnagyobb tartalmi elem megjelenését.

A következő fejezetek sorra veszik a fogalmakat, a részterületeket, egy megismételhető munkafolyamatot és egy döntési útvonalat, amellyel eldöntheted, mire érdemes először időt fordítani.

Fő fogalmak

Mielőtt munkafolyamatot építenél, érdemes tisztázni a szókincset. Sok félreértés abból adódik, hogy valaki összemossa például a title attribútumot az alt szöveggel, vagy a videós sitemapet a strukturált adattal. Az alábbi fogalmak lefedik a terület gerincét.

Alt szöveg (alternatív szöveg)

Az img elem alt attribútuma. Képernyőolvasó felolvassa, betöltési hibánál megjelenik a kép helyén, és a kereső is felhasználja a kép tartalmának megértéséhez. Jó alt szöveg leírja, mi látható a képen, abban a kontextusban, amiben az oldalon szerepel. Díszítő elemeknél (elválasztó vonal, háttérminta) az üres alt érték a helyes megoldás, mert így a képernyőolvasó átugorja.

Fájlnév és URL

A kép fájlneve és elérési útja szintén jel. A barna-bor-csizma-oldalnezet.webp többet mond, mint a DSC0091.jpg. Kötőjeles, kisbetűs, ékezet nélküli fájlnév a biztonságos választás, mert ékezetes karakterek URL-ben kódolva jelennek meg és technikai gondot okozhatnak.

Képformátumok

Formátum	Mire jó	Mire figyelj
JPEG	Fotók, széles kompatibilitás	Nincs átlátszóság, nagyobb fájlméret, mint a modern formátumoknál
PNG	Átlátszó háttér, éles grafika, képernyőkép	Fotóknál gyakran túl nagy
WebP	Fotó és grafika, általában kisebb méret	Ma a böngészők túlnyomó része támogatja
AVIF	Erős tömörítés, jó minőség	Kódolása lassabb lehet, érdemes tartalékot adni
SVG	Logó, ikon, vektoros ábra	Fotóhoz nem való, feltöltésnél biztonsági szűrés kell

Reszponzív képek

A srcset és sizes attribútumokkal, illetve a picture elemmel a böngésző a képernyőhöz illő méretű változatot tölti le. Így egy mobil nem kap asztali méretű, 2000 pixel széles képet.

Lazy loading és méretezés

A loading="lazy" attribútum késlelteti a látómezőn kívüli képek betöltését. A width és height megadása lefoglalja a helyet, így a tartalom nem ugrál betöltés közben. Ez a vizuális stabilitás (Cumulative Layout Shift) szempontjából lényeges.

Strukturált adat

A schema.org szótár szerinti jelölés, jellemzően JSON-LD formában. Képeknél az ImageObject és a termék, recept vagy cikk típusokon belüli image tulajdonság a gyakori. Videóknál a VideoObject a kulcs, amelynek alapvető tulajdonságai a név, a bélyegkép URL-je és a feltöltés dátuma. Videórészletekhez létezik Clip és SeekToAction jelölés is.

Kép- és videós sitemap

Az XML sitemap kiegészíthető kép- és videós adatokkal. Ez abban segít, hogy a kereső megtalálja azokat a vizuális fájlokat, amelyeket a normál bejárás során nehezen érne el, például JavaScripttel betöltött galériákat.

Bélyegkép, beágyazás, hosztolás

A bélyegkép (thumbnail) az az előnézeti kép, amely a videós találatnál megjelenik. A hosztolás azt jelenti, hol tárolod a videót: saját szerveren, videós szolgáltatónál vagy közösségi videóplatformon. A beágyazás pedig az a mód, ahogy a lejátszó az oldaladra kerül. Ez a három döntés együtt határozza meg, hogy a videós forgalom hozzád vagy a platformhoz érkezik.

Fő részterületek

A kép és videó SEO nem egyetlen feladat, hanem több, egymásra épülő részterület. Érdemes külön kezelni őket, mert más-más szakember (fejlesztő, tartalomgyártó, fotós, videós) felel értük, és más eszközökkel mérhetők.

1. Vizuális tartalom kiválasztása és előállítása

Itt dől el, hogy a kép vagy videó egyáltalán értéket ad-e. Egy saját fotó a termékről, egy saját ábra a folyamatról vagy egy saját felvétel a használatról olyan információt hordoz, amit a stockfotó nem. A keresők egyre jobban felismerik a képek tartalmát, és a felhasználó is érzi a különbséget. Egy illusztratív stockkép nem baj, de ritkán lesz önálló forgalmi forrás.

2. Technikai optimalizálás

Formátum, tömörítés, méretezés, reszponzív változatok, lazy loading, CDN, gyorsítótárazás. Ez a rész inkább fejlesztői terület, és elsősorban a sebességet, a stabilitást és a feltérképezhetőséget szolgálja. Ha egy galéria csak kattintás után, JavaScriptből tölti be a képeket, és az img elem nem jelenik meg a HTML-ben, a kereső könnyen kihagyhatja őket.

3. Szemantikai jelzések

Fájlnév, alt szöveg, képaláírás, a kép közelében lévő szöveg, a címsor, amely alá a kép tartozik. A kereső a képet a környezetéből érti meg. Egy "piros futócipő" alt szövegű kép egy futócipőkről szóló oldalon, a megfelelő termékleírás mellett erős jelet ad. Ugyanez a kép egy nem kapcsolódó oldalon gyenge.

4. Strukturált adat és sitemapek

A jelölés és a kiterjesztett sitemap gépileg olvasható módon közli, mi a kép vagy videó, ki a szerzője, mikor készült, mennyi ideig tart. Videóknál ez különösen fontos, mert a lejátszó tartalmát a kereső nehezebben látja.

5. Videós megjelenés és hosztolási stratégia

Ide tartozik, hogy hol hosztolod a videót, mi lesz a bélyegkép, van-e átirat, vannak-e fejezetek, és a videó az oldal fő tartalma-e. A Google a videós találati megjelenítést elsősorban azokhoz az oldalakhoz köti, ahol a videó az oldal fő tartalma, nem egy mellékes elem a lap alján. Ezért egy blogcikk aljára beszúrt videó ritkán hoz videós megjelenést az adott oldalnak.

6. Mérés

A Search Console teljesítményjelentésében külön szűrhetsz keresési típusra (kép, videó), és van videóoldalakra vonatkozó indexelési jelentés is. Ezekből látod, mely oldalak kapnak vizuális megjelenést, és hol akad el az indexelés.

Részterületek és felelősök

Részterület	Tipikus felelős	Fő hatás
Kiválasztás, előállítás	Tartalomgyártó, fotós, videós	Egyediség, felhasználói érték
Technikai optimalizálás	Fejlesztő	Sebesség, stabilitás, bejárhatóság
Szemantikai jelzések	Szerkesztő, SEO	Megértés, relevancia, akadálymentesség
Strukturált adat, sitemap	SEO, fejlesztő	Gépi értelmezés, kiemelt megjelenés esélye
Videós stratégia	Marketing, SEO	Forgalom iránya, videós találatok
Mérés	SEO, analitikus	Prioritás, visszacsatolás

A részterületek közötti határok a gyakorlatban összefolynak, de a felosztás segít abban, hogy egy auditnál semmi ne maradjon ki, és mindenki tudja, mi a saját feladata.

Módszertan

Az alábbi munkafolyamat egy közepes méretű webhelyre készült, de kisebb oldalra is lebontható. A lényege, hogy a vizuális elemek kezelése ne eseti döntés legyen, hanem minden új tartalomnál ugyanaz a rutin fusson le.

A folyamat lépései

Szándékvizsgálat. Nézd meg a célkulcsszó találati oldalát. Van képes blokk? Vannak videós találatok? Ha a képkeresés vagy a videó erősen jelen van, a vizuális tartalom elsődleges, nem kiegészítő.
Vizuális terv. Döntsd el a szöveg megírása előtt, milyen képek és videók kellenek, és melyik bekezdést magyarázzák. Jelöld meg, mi lesz saját anyag.
Előállítás és export. Exportáld a képet a legnagyobb megjelenítési méret körülbelül kétszeresére (nagy felbontású kijelzők miatt), majd készíts kisebb változatokat.
Tömörítés és formátum. Fotóknál modern formátum, tartalékkal. Grafikánál SVG vagy PNG, ha indokolt.
Elnevezés. Leíró, kötőjeles fájlnév, mielőtt feltöltöd. Utólag átnevezni macerás, mert minden hivatkozást frissíteni kell.
Beágyazás. Alt szöveg, szükség esetén képaláírás, width és height megadása, a fő kép kivételével lazy loading.
Jelölés. A releváns schema típus kitöltése, videónál VideoObject, átirat, fejezetek.
Sitemap. Ellenőrizd, hogy a kép- és videós adatok bekerülnek-e a sitemapbe, ha a rendszered ezt kezeli.
Validálás. Strukturált adat tesztelése, oldalsebesség-mérés, URL-ellenőrzés a Search Console-ban.
Visszamérés. Néhány hét után nézd meg a kép- és videós keresési típus adatait.

Kidolgozott példa: egy kerékpárszerviz útmutatója

Vegyünk egy szemléltető esetet. Egy kerékpárszerviz cikket ír arról, hogyan kell láncot cserélni. A találati oldalon videós eredmények és képek is vannak, tehát a vizuális tartalom elsődleges.

A vizuális terv: hat lépésfotó, egy közeli kép a láncbontóról, és egy körülbelül négyperces saját videó. A fotókat a szerelő telefonnal készíti, egységes háttér előtt. Fájlnevek például: lanccsere-lancbonto-hasznalata.webp, lanccsere-uj-lanc-hosszanak-merese.webp.

Az alt szövegek a látványt írják le: "Láncbontó szerszám a kerékpárlánc egyik csapjára illesztve". Nem: "lánccsere kerékpár lánc csere szerviz Budapest olcsó".

A videó a cikk elején, a bevezető után szerepel, mert ez az oldal fő tartalma. A videóhoz átirat és időbélyeges fejezetek tartoznak, a VideoObject jelölés tartalmazza a nevet, a leírást, a bélyegképet, a feltöltés dátumát és az időtartamot. A bélyegkép egy jól olvasható közeli kép a lánccseréről, nem a szerelő arca a műhely előtt.

Szemléltető méretadatok: ha az eredeti fotók egyenként néhány megabájtosak, 1600 pixel szélességre méretezve és modern formátumba tömörítve jellemzően néhány száz kilobájtra csökkennek. A pontos érték a képtől függ, ezért mindig mérd le a saját fájljaidon.

Döntési szabályok a munkafolyamatban

Ha a kép információt hordoz, kap leíró alt szöveget. Ha csak díszít, üres alt értéket.
Ha a kép az első képernyőn van és ez a legnagyobb elem, nem kap lazy loadingot, inkább kiemelt betöltési prioritást.
Ha a videó csak kiegészítés, ne várj tőle videós találatot az oldalra. Ha videós találat a cél, készíts olyan oldalt, ahol a videó a fő tartalom.
Ha a forgalmat a saját oldaladra szeretnéd, ne csak közösségi videóplatformon publikálj, legyen saját oldalad a videóval.

Ellenőrzőlista publikálás előtt

Minden kép fájlneve leíró?
Minden informatív képnek van alt szövege, a díszítőknek üres?
Meg van adva a szélesség és a magasság?
Van reszponzív változat?
A fő kép nem lazy loadingos?
A videónak van bélyegképe, címe, leírása, átirata?
Átmegy a strukturált adat a validáláson?
Az oldal sebessége mobilon elfogadható?

Kapcsolódó clusterek

A kép és videó SEO pillérhez több részletesebb téma kapcsolódik. Mindegyik önálló mélységben is feldolgozható, és mindegyik a fenti részterületek valamelyikét bontja tovább. Az alábbi felosztás segít eldönteni, melyik irányba érdemes továbbmenned, ha egy konkrét problémát kell megoldanod.

Képekhez kapcsolódó témakörök

Alt szöveg írása: hogyan írj leíró, akadálymentes alt szöveget termékképhez, ábrához, képernyőképhez, és mikor legyen üres.
Képtömörítés és formátumválasztás: mikor WebP, mikor AVIF, mikor PNG vagy SVG, és hogyan adj tartalékot régebbi böngészőknek.
Reszponzív képek: srcset, sizes és picture elem a gyakorlatban, töréspontok kiválasztása.
Lazy loading és Core Web Vitals: hogyan hat a kép a legnagyobb tartalmi elem betöltési idejére és az elrendezés stabilitására.
Képes sitemap: mikor hasznos, és hogyan illeszkedik a normál sitemaphez.
Termékfotók webáruházban: több nézet, egységes háttér, nagyítás, termékjelölés.

Videókhoz kapcsolódó témakörök

VideoObject jelölés: kötelező és ajánlott tulajdonságok, gyakori hibák.
Videós sitemap: mikor érdemes használni, milyen adatokat tartalmaz.
Videófejezetek és kulcsmomentumok: időbélyegek, Clip és SeekToAction jelölés.
Hosztolási döntés: saját tárhely, videós szolgáltató vagy közösségi platform, és ezek hatása a forgalom irányára.
Bélyegkép-optimalizálás: olvashatóság kis méretben, egyezés a tartalommal.
Átiratok és feliratok: akadálymentesség és szöveges kontextus a videó mellé.

Határterületek

Néhány téma átfed más pillérekkel. Az oldalsebesség a technikai SEO része is, a strukturált adat önálló pillér lehet, a vizuális keresés pedig összefügg a helyi és a termékkeresési láthatósággal. Ezeknél érdemes a kép és videó szempontot külön kiemelni, de nem itt elmélyíteni.

Hogyan válassz a témák közül?

Ha a problémád	Ezzel kezdj
Lassú az oldal mobilon	Tömörítés, formátum, reszponzív képek, lazy loading
A képeid nem jelennek meg a képkeresésben	Bejárhatóság, fájlnév, alt szöveg, képes sitemap
A videód nem kap videós megjelenést	Videó mint fő tartalom, VideoObject, videós indexelési jelentés
A forgalom a videóplatformra megy	Hosztolási döntés, saját videós oldal
Ugrál az oldal betöltéskor	Szélesség és magasság megadása, helyfoglalás

A témák sorrendje nem kötött. A legjobb belépési pont mindig az, ahol a mérés a legnagyobb hiányt mutatja.

Döntési útvonal

A vizuális optimalizálásnál a legtöbb idő azzal megy el, hogy valaki mindent egyszerre akar rendbe tenni. Egy több ezer képet tartalmazó oldalon ez nem reális. Az alábbi döntési útvonal abban segít, hogy a hatás szerint haladj.

1. kérdés: Hoz-e a téma vizuális keresési forgalmat?

Nézd meg a Search Console-ban a keresési típus szerinti bontást. Ha a képes keresés már most hoz megjelenést, ott van alap, amire építeni lehet. Ha nulla, nézd meg a célkulcsszavak találati oldalait: ha ott sincsenek képes blokkok, a képkeresési forgalom nem lesz fő cél, a képoptimalizálás inkább sebességi kérdés.

2. kérdés: Mi a lassúság fő oka?

Futtass oldalsebesség-mérést a legfontosabb sablonokon (főoldal, kategória, termék, cikk). Ha a legnagyobb tartalmi elem egy kép, és az a lassú, ez az első feladat. Ha a képek rendben vannak, de harmadik féltől jövő videólejátszó lassít, érdemes kattintásra betöltődő lejátszót (előnézeti kép, majd valódi lejátszó) fontolóra venni.

3. kérdés: Sablonszintű vagy egyedi a probléma?

Ez a legfontosabb prioritási szabály. Ha a terméksablon minden képe hiányos méretadattal kerül ki, egyetlen fejlesztési módosítás több ezer oldalt javít. Az egyedi alt szövegek pótlása viszont oldalanként kézi munka. Előbb a sablon, aztán a tartalom.

4. kérdés: A videó fő tartalom vagy kiegészítés?

Fő tartalom: legyen saját oldala, a videó a lap tetején, VideoObject jelöléssel, átirattal, leírással. Ebben az esetben a videós megjelenés reális cél.
Kiegészítés: a videó segítse a szöveget, de a sebesség ne romoljon miatta. Videós találatot ne várj ettől az oldaltól.

5. kérdés: Kié legyen a kattintás?

Ha a márkaismertség és a csatornanövekedés a cél, a közösségi videóplatform jó választás. Ha az, hogy a látogató a te oldaladra érkezzen és ott konvertáljon, legyen olyan saját oldal, ahol a videó a fő tartalom. A kettő kombinálható, de tudatosan kell dönteni, melyik oldal legyen a fő célpont.

Prioritási mátrix

Feladat	Hatás	Ráfordítás	Javasolt sorrend
Méretadat, lazy loading a sablonban	Magas	Alacsony	1.
Automatikus tömörítés, modern formátum	Magas	Közepes	2.
Reszponzív képváltozatok	Közepes vagy magas	Közepes	3.
Alt szövegek a legfontosabb oldalakon	Közepes	Közepes	4.
VideoObject és videós oldalak	Témától függ	Közepes	5.
Teljes képállomány utólagos átnevezése	Alacsony	Magas	Csak indokolt esetben

Határeset: a tömeges átnevezés

Csábító lehet minden régi kép fájlnevét leíróra cserélni. Ez viszont új URL-eket jelent, ami átirányításokat és újraindexelést igényel, és a már megszerzett képes megjelenések átmenetileg el is tűnhetnek. Ellenpéldaként: ha egy régi kép már hoz forgalmat a képkeresésből, a rossz fájlnév ellenére se nyúlj hozzá csak a név miatt. Az új feltöltéseknél viszont kezdd el a helyes elnevezést.

Összefoglalás

A kép és videó SEO három kérdés köré épül: megérti-e a kereső, mi van a képen vagy a videóban; gyorsan és stabilan töltődik-e be; és a megfelelő helyre irányítja-e a forgalmat. A megértést a fájlnév, az alt szöveg, a környező szöveg és a strukturált adat szolgálja. A sebességet a formátum, a tömörítés, a reszponzív változatok és a helyesen használt lazy loading. A forgalom irányát pedig a hosztolási döntés és az, hogy a videó egy oldal fő tartalma-e.

A legfontosabb szabályok egy helyen

A vizuális tartalmat a szöveg előtt tervezd meg, ne utólag keress hozzá képet.
Saját fotó, ábra és videó többet ér, mint az általános stockanyag.
Az alt szöveg leírja a képet, nem kulcsszólista. Díszítő képnél üres.
Minden képnél legyen megadva a szélesség és a magasság.
Az első képernyő fő képe ne legyen lazy loadingos.
Videós megjelenést olyan oldaltól várj, ahol a videó a fő tartalom.
Előbb a sablonszintű javítások, utána az egyedi tartalmi finomítás.
A strukturált adat esélyt ad, nem garanciát.

Mit csinálj a következő héten?

Nyisd meg a Search Console teljesítményjelentését, és szűrj kép, majd videó keresési típusra. Írd fel a legerősebb oldalakat.
Mérd meg a négy legfontosabb sablon sebességét mobilon, és jelöld meg, hol kép vagy videó a legnagyobb elem.
Ellenőrizd, hogy a sablonok minden képnél kiírják-e a méretadatokat.
Válassz ki tíz kiemelt oldalt, és nézd át az alt szövegeiket, fájlneveiket.
Ha van videód, döntsd el, melyik legyen fő tartalom saját oldalon, és ott pótold a jelölést, az átiratot és a fejezeteket.

Hogyan mérd a haladást?

Ne csak a helyezést figyeld. Kövesd a kép- és videós keresési típus megjelenéseit és kattintásait, a videós indexelési jelentés állapotát, valamint az oldalsebesség mutatóit. A változások gyakran hetek alatt jelennek meg, és a szezonális ingadozás is torzíthat, ezért érdemes azonos időszakokat összevetni.

A kép és videó SEO akkor működik jól, ha nem külön projekt, hanem a tartalomgyártás része. Ha minden új oldalnál lefut ugyanaz a rövid ellenőrzőlista, a vizuális tartalom fokozatosan önálló forgalmi forrássá válik, és közben az oldal is gyorsabb, használhatóbb lesz.