Kép SEO: Mi az az ALT-szöveg és miért érdemes használni?

Az Alt text (alternatív szöveg), más néven alt tag, alt description vagy alt attribútum egy HTML-attribútum, amelyet egy kép leírására használnak.

Alt szöveg HTML-ben:

A fenti példát használva a kép alt attribútuma a “kép alternatív szövege” .

Alt vs. Title attribútum

Először is meg kell említenünk, hogy mindkét attribútum feltüntetése nem kötelező (tehát technikailag nem kell használni őket).

A fenti példában látható az alt szöveg és a cím szövege. A legtöbb ember azonban összekeveri ezt a két tulajdonságot, és nem igazán tudja, mi a különbség köztük.

• Alt szöveg – a kép rövid leírása (a képernyőolvasók és a keresőmotorok számára is). Ha a kép nem töltődik be, akkor az alt jelenik meg helyette.
• Címszöveg – egy tooltip szöveg, amely akkor jelenik meg, amikor az egér a kép fölé mozog. A tooltipek nem jelennek meg a mobiltelefonokon és más érintőképernyős eszközökön.

Ha megnézi az alábbi képet, láthatja, hogy a törött kép alt szövege megjelenik (a kép bal oldalán). A jobb oldali példa azt mutatja, hogyan jelenik meg a cím attribútum tooltipje, amikor a kurzor a kép fölé kerül.

Ha nincs alt szöveg vagy címszöveg a képhez, akkor a kép üres képként jelenik meg, és a felhasználók nem láthatnak semmit.

Ebben a cikkben főként az alt attribútumokról fogunk beszélni, és arról, hogy miért van szükség a használatukra.

Az Alt attribútumok fontossága

Íme öt ok, amiért fontos, hogy minden képhez alt szöveget adjon:

1. Az Alt szöveg segíthet a képek jobb helyezésében a Google Képek listáján.

A SparkToro és a Jumpshot 2019-es tanulmánya szerint (lásd az alábbi kördiagramot) a Google Images a második legnagyobb keresőmotor a Google után.

Kép forrása: https://images.sparktoro.com/blog/wp-content/uploads/2019/08/search-engine-market-share-q2-2019.png

Ha alt szöveget ad a képekhez, akkor a képek a Google Képek keresőprogramjában megjelenhetnek a releváns hosszú távú kulcsszavakra, és forgalmat generálhatnak a weboldalára.

Ez különösen olyan ágazatokban működik jól, ahol az emberek látni akarják a terméket, mielőtt vásárolnának (például élelmiszer, divat,…).

Képmező a Google keresési eredményekben

A képek optimalizálása nem csak a Google Images keresésnél fontos, hanem a teljes szöveges kereséseknél is, mivel a Google folyamatosan újabb és újabb SERP funkciókat ad hozzá számos keresési lekérdezéshez.

Az alábbi példában látható, hogy a “naptár sablon” keresési eredmények a “Képek dobozát” adják vissza a SERP tetején, a többi szerves keresési eredmény pedig “el van rejtve” e funkció alatt.

Az alt szöveg nélküli képek esetében nagyon nehéz lenne megjelenni az ilyen típusú keresési lekérdezéseknél. Ha nem ad alt szöveget a képekhez, akkor potenciálisan ügyfeleket és értékes forgalmat veszít a weboldalára.

John Mu, a Google munkatársa is megerősítette az alt szöveg fontosságát a kép SEO szempontjából:

2. Az Alt szöveg lehetővé teszi a nem vizuális olvasók számára, hogy megértsék a képeket.

Világszerte több mint 39 millió ember vak, és több mint 246 millióan szenvednek súlyos látáskárosodásban. A legtöbb látássérült ember képernyőolvasót használ, amely lehetővé teszi számukra a készülékek használatát és a tartalom olvasását. Ha az alt tag nem tartalmaz szöveget, akkor a képernyőolvasók figyelmen kívül hagyják a képet. Esetenként, ha nincs alt szöveg, a képernyőolvasó a kép fájlnevét is beolvassa helyette. Gyakran előfordul azonban, hogy ez a név nagyon általános (például: IMG_21646486.jpg), és nem magyarázza meg, hogy a kép valójában mit tartalmaz. Ezért nagyon fontos, hogy a kép címe egyszerű és leíró legyen, hogy ne zavarja a képernyőolvasó technológiát használókat.

Azáltal, hogy alt szöveget ad a képekhez, segít a látássérülteknek megérteni az üzenetet, mivel a képernyőolvasójuk is képes lesz elolvasni a képeket.

3. Az Alt szöveg kontextust ad a képnek

A tartalom olvashatóbbá tétele érdekében fontos, hogy vonzó képekkel emészthető és esztétikus darabokra bontsa a szöveget. A képeknek azonban célt kell szolgálniuk, nem csak azért vannak, hogy szépen nézzenek ki. Az alt attribútumok feltüntetésével segít a keresőmotoroknak jobban megérteni a képek témáját.

Az Alt szövegnek a tartalomhoz kell kapcsolódnia (erről bővebben is beszélünk majd a bejegyzés további részében), hogy a keresőmotorok jobban megértsék, miről szól az oldal.

Ha például egy laptopokról szóló cikket ír, akkor a képhez hozzáadhat egy alternatív szöveget, amely így szól: “Stílusos laptop Acer Aspire 5 kék színben”, hogy a keresőmotor jobban megértse az oldal tartalmát.

4. Az Alt szöveg egyenértékű a horgonyszöveggel (a linkelt képek esetében).

A hiperhivatkozások esetében a szöveg a király. A linknek azonban nem kell csak szövegből állnia. Ez lehet kép vagy bármilyen más HTML-elem.

Minden linkben található képnek rendelkeznie kell alt szöveggel, amely azonosítja a link célját. A linkelt képek Alt szövege egyenértékű a horgonyszöveggel. Lehetőséget jelent arra, hogy az oldal jelentését és kontextusát közölje a Google-lal.

5. Alt szöveg jelenik meg, ha egy kép nem töltődik be.

Ahogy korábban említettük (vagy ahogy az előző példánkban láthattad), az alternatív attribútum jelenik meg a kép helyett, ha a kép nem töltődik be megfelelően.

Ha nincs alt szöveg megadva, akkor ez üres lesz.

Hogyan ellenőrizhető az alt szöveg?

Kézi ellenőrzés

Az egyik leggyorsabb módja annak, hogy megtudja, használ-e alt szöveget a képekhez, ha bármelyik weboldal forráskódjában ellenőrzi azt.

Először is, meg kell látogatnia a weboldalt (pl. egy blogbejegyzést), amelyet ellenőrizni szeretne az alt címkék tekintetében. Ezután kattintson a jobb gombbal, és válassza az ‘Ellenőrzés‘ lehetőséget.

Most már meg kell tudnia nézni az oldal forráskódját az alt szöveggel és a kép egyéb attribútumaival:

Ebben az esetben az alt címke látható, mivel már hozzá lett adva a képhez. A Marketing Miner projektértékben a versenytársak beállításait is mutatja.

Ha nem találsz alt=”” értéket a képek mellett, az azt jelenti, hogy nincs is nekik.

Marketing Miner – Tartalomelemzés bányász

Ha több száz vagy ezer képet kell átnézned, hogy kiderítsd, van-e hozzájuk alt attribútum, akkor van értelme, hogy ne kézzel kelljen ezt megtenned, nem igaz?

Ezt automatizálási eszközökkel (úgynevezett crawlerekkel) lehet elvégezni, amelyek átnézik az összes céloldalt, ellenőrzik az összes képet, és listázzák azokat, amelyekhez nem adtak hozzá alternatív attribútumot.

A tartalomelemző minerek segítségével a következő adatokhoz juthat:

• Képek száma – a feltérképezett oldalon talált képek száma
• Alt szöveg nélküli képek – az alt szöveg nélküli képek száma

Hogyan optimalizálhatod az alt szövegedet

Amikor alt szöveget ír, ne feledje, hogy a leírást olyan személyeknek írja, akik nem látják a képet. Csukja be a szemét, és használjon képernyőolvasót az alt szöveg felolvasásához. Ezen információk alapján próbálja meg elképzelni, hogy mit hallott az imént. Megfelel a látomásod annak, amit a kép mutat? Akkor az alt szöveged helyes!

Az alábbi 5 tipp segít a hatékony alt szöveg megírásában:

• Legyen rövid és leíró – Próbáljon meg tömören fogalmazni a kép leírásakor. A legtöbb képernyőolvasó körülbelül 125 karakternél vágja le az alt szöveget, ezért próbálja meg ezt a karakterszámot vagy annál kevesebbet tartani.
• Legyen releváns – Amikor megírja az alt szöveget, kérdezze meg magától, hogy megértené-e a relevanciát, ha nem látná a képet. Tartalmaznia kell egy releváns célkulcsszót és a kép egyértelmű leírását, hogy a keresőmotorok megértsék a kontextust.
• Kerülje a kulcsszavakkal való tömést – Koncentráljon arra, hogy a képnek kontextust adjon a kulcsszavakkal együtt. De ne ess túlzásba a kulcsszavakkal!
• Légy pontos – Képesnek kell lenned arra, hogy pontosan leírd a képeid tartalmát (ugyanakkor elég rövidnek és leírónak kell lenned, ahogy fentebb említettük).
• Ne használjon kifejezéseket “ image of “ kifejezéseket a kép leírására – a felhasználó számára általában nyilvánvaló, hogy képről van szó, ezért inkább ugorjon bele a leírásba.

Hatékony alt szöveg írása példákkal

Nézzünk néhány példát az alt szövegre a gyakorlatban:

Rossz: <img src=”IMG_12358.png” alt=”árazás”> – nem elég leíró jellegű.

Nem ajánlott: <img src=”IMG_12358.png” alt=”árazás, tervek, árak, előfizetések”> – kulcsszótömés.

Jó: <img src=”marketing_miner_pricing.png” alt=”Marketing Miner tervek és árlista”>

Rossz: <img src=”torte.png” alt=”torte”> – nem túl szemléletes.

Nem ajánlott: <img src=”torte.png” alt=”chocolate torte”> – málo výstižné

Jó: <img src=”chocolate torte.png” alt=”Csokoládétorta eperrel a tetején egy desszertes tányéron”>

További információ a Google képekkel kapcsolatos legjobb gyakorlatokról itt: https://support.google.com/webmasters/answer/114016?hl=en

A képkeresési adatok ellenőrzése a Google Search Console-ban

A Google Search Console-ban mérheti az arculati SEO-erőfeszítések eredményeit is.

Jelentkezzen be a Google Search Console fiókjába, kattintson a Teljesítmény fülre, és válassza a Képet a Keresés típusa szűrőben.

Most már láthatja az összes eredményt, amely a Képkeresés eredményei lapon jelenik meg.

• Összes kattintás – hányszor kattintott át egy felhasználó az Ön webhelyére.
• Összes megjelenés – hányszor látta a felhasználó az Ön oldalára mutató linket a keresési eredményekben.
• Átlagos CTR –a megjelenítések azon százalékos aránya, amelyek egy képre való kattintást eredményeztek.
• Átlagos pozíció – a kép átlagos pozíciója a keresési eredményekben.

Van egy táblázat is, amelyből megtudhatja, hogy mely kulcsszavakra vagy oldalakra kattintanak a legtöbben.

Következtetés

Ahogy fentebb említettük, az alt szöveg hozzáadása a képekhez kulcsfontosságú. Ha nincs alt szöveg a képeiden, akkor ezt azonnal ki kell javítanod!

Javasoljuk, hogy nézze meg a Google Analyticset, hogy lássa a webhelye legnépszerűbb céloldalait, és összpontosítson arra, hogy alt szöveget adjon a képekhez.

Ezután a Google Search Console-ban megvizsgálhatja, hogy történt-e bármilyen teljesítménybeli változás, és mérheti a sikert.