CSS Osztálynevek és SEO: Amit Tudnod Érdemes!

A Google legutóbbi podcast epizódjában a keresőoptimalizálás szempontjából fontos kérdésekre adtak választ, különösen a CSS (Cascading Style Sheets) használatával kapcsolatban. Martin Splitt és John Mueller részletesen megvitatták, hogy a CSS különböző elemei hogyan befolyásolják a keresőmotorok működését, és eloszlatták a CSS osztálynevekkel kapcsolatos tévhiteket.

A CSS osztálynevek hatása a SEO-ra

Az egyik legmeglepőbb megállapítás az volt, hogy a CSS osztályneveknek nincs hatásuk a keresési rangsorolásra. Splitt kifejtette, hogy a CSS osztálynevek csupán vizuális stílusok alkalmazására szolgálnak, és nem képezik a weboldal tartalmát. Ezért a Googlebot, a Google keresőmotorja, figyelmen kívül hagyja ezeket a neveket, amikor értelmezi a weboldalakat. Még ha valaki minden osztálynevet „blurb”-nak nevezne is, az SEO szempontból nem számítana.

Bár az osztálynevek nem befolyásolják a rangsorolást, a szakértők figyelmeztettek arra, hogy a CSS pszeudoelemek, mint például a :before és :after, használata problémákat okozhat. Az ilyen elemekbe rejtett tartalom a keresőmotorok számára láthatatlanná válik, ami ellentétes a webfejlesztés alapelveivel. Az értelmezhető tartalmat mindig az HTML kódba kell integrálni, nem pedig a CSS-be.

A CSS optimalizálás fontossága

A podcast során a szakértők a CSS fájlok méretének problémáira is kitértek. Az HTTP Archive 2022-es Web Almanac adatai szerint a CSS fájlok medián mérete mobil eszközökön 68 KB, míg asztali gépeken 72 KB volt. Ez a bloat hatással van a weboldalak teljesítményére, különösen a Core Web Vitals mutatókra, amelyek a rangsorolás szempontjából is fontosak. A felesleges CSS szabályok eltávolítása és a fájlok minifikálása elengedhetetlen a gyors betöltődési idő és a felhasználói élmény javítása érdekében.

A Google szakértői azt is ajánlják, hogy a CSS fájlokat úgy kell kezelni, hogy azok „crawlable”-ek legyenek, azaz a Googlebot számára hozzáférhetőek. Ez azért fontos, mert a CSS fájlok segítik a weboldalak renderelését és a felhasználói élmény javítását. Ha a CSS nem érhető el, az hátrányosan befolyásolhatja a weboldal megjelenését a keresőmotorokban.

Praktikus tanácsok SEO szakembereknek

A podcast alapján az alábbi javaslatokat érdemes figyelembe venni a SEO gyakorlatok során:

1. **Ne optimalizálj osztályneveket**: A CSS osztálynevekben található kulcsszavak nem segítik a rangsorolást.
2. **Ellenőrizd a pszeudoelemeket**: Bármilyen valódi, olvasásra szánt tartalomnak az HTML-ben kell lennie, nem a :before vagy :after elemekben.
3. **Auditáld a stíluslapok méretét**: A nagy CSS fájlok hátrányosan befolyásolhatják az oldal sebességét és a Core Web Vitals mutatókat.
4. **Biztosítsd, hogy a CSS crawlable legyen**: A stíluslapok blokkolása megzavarhatja a renderelést, és befolyásolhatja a Google értelmezését a weboldaladról.

A CSS-t a stílusozásra, míg az HTML-t a jelentésre kell használni. Ez a megközelítés segít abban, hogy a felhasználók és a keresőmotorok is egyaránt könnyebben értelmezzék a weboldalt.

Mi a véleménye a szakértőnek?

Megkérdeztük Császár Viktor SEO szakértőt, hogy kommentálja a Google legújabb bejelentéseit a CSS és SEO kapcsolatáról. Viktor elmondta: „A Google szakértői világosan rávilágítottak, hogy a CSS osztálynevek nem befolyásolják a rangsorolást, ami sok SEO szakemberben tévhiteket oszlat el. Fontos, hogy a tartalom és a megjelenés elkülönítése a webfejlesztés alapelvei közé tartozik, és a szöveges tartalomnak mindig az HTML-ben kell lennie. Ezen kívül a CSS optimalizálása kiemelt fontosságú a weboldalak teljesítményének javítása érdekében. A SEO szakembereknek érdemes figyelniük a CSS fájlok méretét és tartalmát is, hogy elkerüljék a rangsorolás romlását.”

További információkért látogass el weboldalamra: Császár Viktor SEO szakértő.

Forrás: SearchEngineJournal.com