12 fontos kép SEO tipp, amit tudnod kell

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!