admin 
Neseniai vykusiame „Google's Search Off The Record Podcast“ epizode Martinas Splittas ir Johnas Muelleris paaiškino, kaip CSS veikia SEO.
Nors kai kurie CSS aspektai neturi įtakos SEO, kiti gali tiesiogiai paveikti tai, kaip paieškos sistemos aiškina ir reitinguoja turinį.
Štai kas svarbu, o kas ne.
Klasių pavadinimai neturi reikšmės reitingams
Vienas aiškiausių šio epizodo pasirodymų yra tas, kad CSS klasės pavadinimai neturi įtakos „Google“ paieškai.
Split pareiškė:
„Nemanau, kad taip yra. Nemanau, kad mums rūpi, nes CSS klasės pavadinimai yra būtent tokie. Jie tiesiog priskiria elementams šiek tiek identifikuojamą stiliaus lentelės taisyklių ir viskas. Tai viskas. Galite juos visus pavadinti” Blurb „. Tai nepadarytų skirtumo nuo SEO perspektyvos. “
Klasių pavadinimai, jų paaiškinta, yra naudojami tik vaizdiniam stiliui pritaikyti. Jie nelaikomi puslapio turinio dalimi. Taigi „GoogleBot“ ir kiti HTML analizatoriai jų ignoruoja, kai išgaunama prasminga informacija.
Net jei jūs maitinate HTML į kalbos modelį ar pagrindinį tikrintį, klasių pavadinimai neįvertins, nebent jūsų sistema būtų aiškiai sukurta perskaityti tuos atributus.
Kodėl turinys pseudo elementuose yra problema
Nors klasių pavadinimai yra nekenksmingi, komanda perspėjo apie prasmingo turinio pateikimą CSS pseudo elementuose, pavyzdžiui, :before ir :after.
Split pareiškė:
„Vėl idėja – originali idėja – atskirti pristatymą nuo turinio. Taigi turinys yra HTML, o kaip ji pateikiama, yra CSS. Taigi su
beforeirafterjei pridėsite dekoratyvinių elementų, pavyzdžiui, šiek tiek trikampio ar šiek tiek taško ar šiek tiek lemputės ar kaip šiek tiek vienaragio – kad ir kas, manau, manau, kad tai gerai, nes tai yra dekoratyvinė. Tai neturi prasmės turinio prasme. Be jo vis tiek būtų gerai “.
Pridėti vaizdinius klestėjimą yra priimtina, tačiau įterpti antraštes, pastraipas ar bet kokį vartotojo turinį į pseudo elementus sulaužo pagrindinį žiniatinklio kūrimo principą.
Šis turinys tampa nematomas paieškos varikliams, ekrano skaitytojams ir kitiems įrankiams, kurie tiesiogiai remiasi HTML analize.
Muelleris pasidalino realaus pasaulio pavyzdžiu, kaip tai gali suklysti:
„Kažkada buvo rodomosios komandos eskalacija, kurioje sakoma, kad turėtume susisiekti su svetaine ir liepti jiems nustoti naudoti
beforeirafter… Jie naudojobeforePseudo klasė prideda skaičių ženklą prie visko, ką, jų manymu, buvo laikomos žymos. Ir mūsų indeksavimo sistema buvo tokia, kaip būtų taip malonu, jei galėtume atpažinti šias hashtagas puslapyje, nes galbūt jie kažkam naudingi “.
Kadangi „Hashtag“ simboliai buvo pridedami per CSS, „Google“ sistemos niekada jų nematė.
„Splitt“ tiesiogiai išbandė įrašymo metu ir patvirtino:
„Tai nėra DOM …, todėl jis nėra pasiimtas perteikdamas“.
Negabaritinis CS gali pakenkti našumui
Epizode taip pat buvo paliesti spektaklio problemos, susijusios su išsipūtusiais stiliais.
Remiantis HTTP archyvo 2022 m. „Web AlManac“ duomenimis, CSS failo vidutinis dydis išaugo iki maždaug 68 kb mobiliesiems ir 72 kb darbalaukyje.
Muelleris pareiškė:
„Žiniatinklio almanachas sako, kad kiekvienais metais matome, kad CSS auga, o 2022 m. Vidutinio stiliaus lentelės dydis buvo 68 kilobaitai arba 72 kilobaitai. Jie taip pat paminėjo didžiausią, kuris, jų manymu, buvo 78 megabaitai. … Tai yra tekstiniai failai.“
Toks pūsėjimas gali neigiamai paveikti pagrindinius žiniatinklio gyvybingus ir bendrą vartotojo patirtį, tai yra dvi sritys, kurios padaryti Įtakos reitingas. Sandros ir išankstinės segmentinės bibliotekos dažnai yra priežastis.
Nors kūrėjai gali tai sušvelninti mažindami ir nenaudojamą taisyklių genėjimą, ne visi tai daro. Tai daro CSS optimizavimą vertingu elementu jūsų techniniame SEO kontroliniame sąraše.
Laikykite CSS nuskaitytą
Nepaisant riboto CSS vaidmens reitinge, „Google“ vis tiek rekomenduoja CSS failus nuskaityti.
Muelleris juokavo:
„„ Google “gairėse sakoma, kad turėtumėte priversti savo CSS failus nuskaityti. Taigi ten turi būti kažkokia magija, tiesa?”
Tikroji priežastis yra labiau techninė nei magiška. „GoogleBot“ naudoja CSS failus, kad puslapius pateiktų taip, kaip vartotojai juos matytų.
CSS blokavimas gali turėti įtakos jūsų puslapių interpretams, ypač išdėstymui, draugiškumui mobiliesiems ar tokiems elementams kaip paslėptas turinys.
Praktiniai patarimai SEO profesionalams
Štai ką šis epizodas reiškia jūsų SEO praktikai:
- Nustokite optimizuoti klasės pavadinimus: Raktiniai žodžiai CSS klasėse nepadės jūsų reitingams.
- Patikrinkite pseudo elementus: Bet koks tikrasis turinys, pavyzdžiui, tekstas, skirtas perskaityti, turėtų gyventi HTML, o ne
:beforearba:after. - Audito stiliaus lentelės dydis: Dideli CSS failai gali pakenkti puslapio greičiui ir pagrindinėms žiniatinklio gyvybinėms medžiagoms. Apkirpkite, ką galite.
- Įsitikinkite, kad CSS yra nuskaitytas: Stilių blokavimo lentelės gali sutrikdyti perteikimą ir paveikti tai, kaip „Google“ supranta jūsų puslapį.
Komanda taip pat pabrėžė, kaip svarbu naudoti tinkamas HTML žymes prasmingiems vaizdams:
„Jei vaizdas yra turinio dalis ir jūs panašus į:„ Pažvelk į šį namą, kurį ką tik nusipirkau “, tada norite
imgvaizdo žyma arba apictureŽyma, kuri iš tikrųjų turi tikrąjį vaizdą kaip DOM dalį, nes norite, kad mes matytume, kaip, ah, todėl šis puslapis turi šį vaizdą, kuris nėra tik dekoravimas “.
Naudokite CSS stiliaus formavimui ir HTML prasmei. Šis atskyrimas padeda abiem vartotojams ir paieškos sistemoms.
Klausykite viso podcast'o epizodo žemiau:
