Intro
A képek gyakran a weboldalak legnagyobb részét teszik ki, és a Google találati listáján külön lapot kapnak. Ezek a képek a teljes SEO-stratégia kulcsfontosságú részét képezik, ezért optimalizálásuk elengedhetetlen a jobb láthatóság érdekében.
Hogyan indexelik és értelmezik a keresőmotorok a képeket
A keresőmotorok a weboldalakat átnézik, hogy felfedezzék a képeket, és adatokat, például metaadatokat és fájlneveket nyerjenek ki belőlük. A Google olyan tényezőket használ, mint a környező szöveg, a képfájl neve, az alt szöveg, a feliratok és az oldal tartalma, hogy megértse a képek kontextusát és tartalmát.
Mi az Image SEO?
A képoptimalizálás magában foglalja a keresőmotorok találati oldalain (SERP) való láthatóság növelésére szolgáló technikákat a képek tömörítése, a reszponzív képek használata, a lusta betöltés megvalósítása, a releváns alt szöveg hozzáadása, a leíró fájlnevek használata és a strukturált adatok alkalmazása révén.
1. Válassza ki a megfelelő képformátumot
A Google olyan formátumokat támogat, mint a JPEG, PNG, WebP, BMP, GIF és SVG. Mindegyik formátumnak megvannak a maga előnyei és hátrányai:
-
PNG: veszteségmentes tömörítés, jobb minőség, támogatja az átláthatóságot, nagyobb fájlméret.
-
JPEG: veszteséges tömörítés, állítható minőség, kisebb fájlméret.
-
WebP: Hatékony, kisebb fájlméret, minden nagyobb böngésző támogatja.
-
GIF: Egyszerű grafikák és animációk készítésére alkalmas.
-
SVG: Vektoralapú, méretezhető, ideális logókhoz és ikonokhoz.
-
BMP: Nagyméretű, tömörítetlen, jó minőségű, a méret miatt nem alkalmas webes felhasználásra.
Ajánlás: Használjon PNG-t és konvertálja WebP-be a webes telepítéshez az optimális minőség és betöltési idő érdekében.
2. Egyedi képek létrehozása
Kerülje az általános készletfotókat. Használjon eredeti, kiváló minőségű képeket a felhasználói élmény és a SEO javítása érdekében. A Google azt ajánlja, hogy a képek legalább 1200px szélesek legyenek, és a robotok meta-tagjában a max-image-preview:large beállítást használják, hogy nagyméretű képként jelenjenek meg a Google Discoverben.
<meta name='robots' content='index, follow, max-image-preview:large' />3. Képfájlnevek optimalizálása
Használjon leíró, kulcsszavakban gazdag fájlneveket, hogy a keresőmotorok könnyebben megértsék a kép témáját. Kerülje az olyan alapértelmezett neveket, mint az "IMG_722019".
4. Írjon SEO-barát Alt szöveget
Az Alt címkék leírják a kép tartalmát, és javítják a hozzáférhetőséget. Segítenek a keresőmotoroknak is megérteni a kép kontextusát, ami segíti a jobb helyezéseket.
Példa:
<img src="chocolate-1.jpg" alt="étcsokoládé kávé ízű szelet"/>5. Optimalizálja az oldal címét és leírását
A képkeresési rangsorolás javítása érdekében az oldal címébe és leírásába írjon be releváns kulcsszavakat. Győződjön meg róla, hogy az összes on-page SEO tényező optimalizálva van.
6. Határozza meg a dimenziókat
Tartalmazzon szélességi és magassági attribútumokat minden képhez a Cumulative Layout Shift (CLS) problémák megelőzése és a Core Web Vitals pontszámok javítása érdekében.
7. Tegye a képeket mobil-baráttá
Használja az srcset és sizes attribútumokat a reszponzív képekhez, amelyek a felhasználó eszközének megfelelően skálázódnak.
Példa:
<picture> <source type="image/webp" srcset="image-300w.webp 300w, image-600w.webp 600w, image-1200w.webp 1200w" sizes="(max-width: 600px) 300px, (max-width: 900px) 600px, 1200px"> <img src="image-300w.jpg" srcset="image-300w.jpg 300w, image-600w.jpg 600w, image-1200w.jpg 1200w" sizes="(max-szélesség: 600px) 300px, (max-szélesség: 900px) 600px, 1200px" alt="A kép leírása"> </picture>8. Lusta betöltés és előtöltés
Használja a lusta betöltést a nem a nézetablakban lévő képek esetében, hogy javítsa az oldal teljesítményét. Használjon preload vagy fetchpriority="high" érték et a hajtás feletti képekhez.
Példa:
<img src="image.jpg" loading="lazy" srcset="image-300w.jpg 300w, image-600w.jpg 600w" alt="Leírás">9. Képek hozzáadása az Oldaltérképhez
A képek beépítése a webhelytérképbe növeli annak az esélyét, hogy a keresőmotorok feltérképezik és indexelik azokat. Használjon olyan bővítményeket, mint a Yoast vagy a RankMath for WordPress, vagy olyan eszközöket, mint a Screaming Frog.
10. Strukturált adatok hozzáadása
A képek strukturált adatokkal való bővítése a keresési eredményekben való láthatóság javítása érdekében. Használja a sémajelölést az olyan részletek, mint az ár, a rendelkezésre állás és a minősítések feltüntetéséhez.
Példa:
{ "@context": "http://schema.org", "@type": "Article", "headline": "Article Title", "image": [ "https://example.com/photos/1x1/image.jpg", "https://example.com/photos/4x3/image.jpg", "https://example.com/photos/16x9/image.jpg" ], "datePublished": "2024-01-10T08:00:00+08:00", "dateModified": "2024-01-10T09:20:00+08:00", "author": { "@type": "Person", "name": "Szerző neve" } } }11. CDN használata a gyorsabb képkiszállításhoz
A tartalomszolgáltató hálózat (CDN) optimalizálja és gyorsabban szolgáltatja a képeket, mivel a felhasználóhoz közelebbi helyekről szolgáltatja ki azokat. Fontolja meg az olyan szolgáltatások használatát, mint a Cloudflare, az Amazon CloudFront, az ImageKit vagy a KeyCDN.
12. Vigyázzon a szerzői jogokkal
Győződjön meg arról, hogy rendelkezik a képek felhasználási jogával, hogy elkerülje a drága pereket. Használjon licencelt képeket olyan szolgáltatóktól, mint a Getty, a Shutterstock vagy a DepositFiles.
Képoptimalizálás legfontosabb tudnivalók
-
Válassza ki a megfelelő fájlformátumot és -méretet a gyorsabb betöltési idő érdekében.
-
Győződjön meg arról, hogy a SEO-elemek az oldalon optimalizálva vannak.
-
Hozzon létre egy képi oldaltérképet a jobb feltérképezhetőség érdekében.
Ha követi ezeket a tippeket, javíthatja webhelye arculatának SEO-ját és általános keresési láthatóságát. Boldog optimalizálást!
