SEO JavaScript: Asigurați-vă că site-ul dvs. este indexabil

Publicat: 2023-09-08

JavaScript este o parte crucială a web-ului modern, dând vie paginilor web cu funcții interactive care pot îmbunătăți experiența utilizatorului. Dar dacă nu ești atent, JavaScript poate încetini site-ul tău, poate cauza probleme de indexare și poate afecta capacitatea site-ului de a se clasa. Deci, puteți încă să vă clasați bine și să utilizați JavaScript? Desigur! Iată ce trebuie să știți despre SEO pentru JavaScript, astfel încât să vă puteți optimiza mai bine site-ul.

Ce este JavaScript SEO?

JavaScript SEO este practica de optimizare a JavaScript pe un site web pentru a maximiza capacitatea site-ului de a se poziționa în motoarele de căutare precum Google. Deoarece optimizăm elementele de pe pagină și deoarece afectează direct valorile tehnice SEO, SEO JavaScript se încadrează în general în categoria SEO tehnic.

JavaScript este rău pentru SEO?

Există o mulțime de site-uri JavaScript. Și în timp ce JavaScript oferă multe beneficii, poate avea un impact negativ și asupra SEO. JavaScript nu este în mod inerent rău pentru SEO, dar atunci când este implementat incorect, poate îngreuna Googlebot să acceseze cu crawlere și să indexeze paginile. În plus, utilizarea excesivă a JavaScript poate crește timpul de încărcare, dăunând direct capacității de clasare și experienței de navigare a utilizatorului.

Nu toate site-urile folosesc JavaScript în același mod. În timp ce unele site-uri utilizează JavaScript în codul lor ici și colo, altele folosesc JavaScript pentru a alimenta cadrele și funcțiile de bază.

De exemplu, cadrele JavaScript precum Angular și React pot ajuta dezvoltatorii să construiască aplicații web mai eficient. Aceste cadre necesită, de asemenea, un cod JavaScript mult mai extins și mai complex decât un site web obișnuit.

Site-urile create folosind acest model de aplicație, în care interfața de utilizare și modulele de date sunt ținute separate, necesită execuția codului JavaScript pentru a afișa conținut care este esențial atât pentru vizitatori, cât și pentru crawlerele de căutare. Astfel, unele site-uri sunt mai expuse riscului de probleme SEO legate de JavaScript decât altele. Site-urile care depind de JavaScript pentru a încărca conținut pe pagină pot întâmpina probleme SEO dacă acel conținut se încarcă corect pentru vizitatori, dar nu pentru crawlerele de căutare.

Cum gestionează Google JavaScript?

Înainte de a mă scufunda în optimizare, să ne uităm puțin mai atent la modul în care Google gestionează de fapt JavaScript.

Diagramă care arată modul în care Googlebot gestionează JavaScript

Google procesează JavaScript în trei faze: accesare cu crawlere, randare și indexare. Googlebot începe procesul prin accesarea cu crawlere a adreselor URL din coada sa. Trimite o solicitare către server folosind un agent de utilizator mobil și extrage codul HTML de pe site. Google are doar o cantitate limitată de resurse de calcul și poate aloca doar atâtea pentru accesarea cu crawlere a oricărui site (bugetul său de accesare cu crawlere). Google procesează mai întâi resursele HTML pentru a salva resursele de accesare cu crawlere și amână resursele JavaScript ale paginii pentru accesarea cu crawlere ulterioară, plasându-le într-o coadă de randare.

Redarea permite Googlebot să execute cod JavaScript și să vadă ce ar vedea un utilizator dacă ar naviga pe site, făcând posibil ca Googlebot să îl indexeze corect. Când aveți de-a face cu site-uri care folosesc foarte mult JavaScript – și în special site-uri care folosesc modelul shell-ului de aplicație pentru a afișa informații critice în JavaScript – Googlebot trebuie mai întâi să execute și să redea codul JavaScript pentru a afla mai multe despre conținutul paginii.

Acest proces de randare creează o întârziere pe măsură ce codul JavaScript este introdus în coada Serviciilor de redare web, unde așteaptă procesarea. În timp ce acest proces obișnuia să dureze o perioadă lungă de timp, Google a declarat recent că întârzierea de redare este de fapt de doar 5 secunde în medie, 90% dintre site-uri fiind procesate în câteva minute. Din păcate, nu asta au experiența SEO. Un studiu a arătat că Google a avut nevoie de nouă ori mai mult pentru a accesa cu crawlere JavaScript decât HTML. În plus, erorile, timeout-urile sau setările robots.txt pot împiedica în continuare Googlebot să redea și să indexeze o pagină.

Necesitatea de a reda JavaScript determină Googlebot să indexeze pagina în două valuri. După ce folosește un Chromium fără cap pentru a reda JavaScript, Googlebot accesează din nou cu crawlere HTML-ul redat și adaugă toate adresele URL descoperite recent la listă pentru accesarea cu crawlere ulterioară. Apoi utilizează codul HTML redat pentru indexarea site-ului.

Redarea JavaScript

Nu doar Googlebot trebuie să vă redeze paginile. Redarea preia codul pe site-ul dvs. și îl generează vizual, astfel încât vizitatorii să-l poată vizualiza în browserele lor. Multe probleme de indexare legate de JavaScript apar din cauza tipului de redare pe care îl folosește un site pentru a-și afișa conținutul. Există mai multe opțiuni diferite când vine vorba de redarea paginilor JavaScript, iar unele sunt mai bune pentru roboții de căutare decât altele.

Redare pe partea serverului

După cum sugerează și numele, randarea pe server (SSR) are loc atunci când procesul de randare are loc direct pe server. După randare, pagina web HTML finală este apoi livrată în browser, unde vizitatorii o pot vizualiza și roboții o pot accesa cu crawlere.

Redarea pe server este considerată o alegere bună pentru SEO, deoarece poate reduce timpii de încărcare a conținutului și poate preveni schimbările de aspect. Abordarea pe partea serverului vă ajută, de asemenea, să vă asigurați că toate elementele dvs. sunt redate efectiv, iar tehnologia pe partea clientului nu le ignoră.

Cu toate acestea, redarea pe partea serverului poate crește și timpul necesar unei pagini pentru a accepta intrările utilizatorului. Acesta este motivul pentru care unele site-uri care se bazează foarte mult pe JavaScript preferă să folosească SSR pe paginile web care contează cu adevărat pentru SEO, dar nu și pe paginile în care funcționalitatea solidă este critică.

Redare pe partea clientului

Redarea pe partea clientului (CSR) transferă sarcina de lucru de randare de pe server către client (browser). În loc să primească codul HTML redat complet direct de la server, utilizatorul primește în schimb niște coduri HTML simple împreună cu un fișier JavaScript pentru ca propriul browser să-l reda.

Deoarece browserul însuși trebuie să gestioneze sarcina de randare, randarea pe partea client este în general mai lentă decât redarea pe partea serverului. Acest lucru poate cauza probleme evidente de SEO, deoarece viteza paginii este unul dintre multele semnale tehnice SEO pe care Google le folosește pentru a clasifica paginile. În plus, vitezele mai mici de încărcare pot crește și rata de respingere și, în timp ce rata de respingere poate să nu fie un semnal în sine, o viteză ridicată ar putea indica o experiență slabă de navigare și vizitatorii site-ului frustrați. Dacă doriți să creșteți viteza site-ului, îndepărtarea de redarea la nivelul clientului ar putea să nu fie o idee rea.

Redare dinamică

Redarea dinamică utilizează atât randarea pe partea client, cât și pe partea serverului în momente diferite. Solicitările venite de la browsere vor primi versiunea pe partea client a paginii, în timp ce solicitările venite de la roboți care ar putea avea probleme cu JavaScript vor primi versiunea pe partea serverului. Acest lucru protejează funcționalitatea celor mai importante pagini, în timp ce facilitează accesul crawlerelor de căutare pe cele care necesită indexare.

Imagine a unui mesaj de avertizare și eroare despre JavaScript

Un site cu mult conținut dinamic care trebuie actualizat și reindexat frecvent poate beneficia de acest stil de randare mai flexibil. Cu toate acestea, în timp ce randarea dinamică poate părea o soluție solidă pentru problemele dvs. de randare, de fapt nu este una sugerată de Google. De fapt, pagina centrală de căutare Google pentru JavaScript avertizează în mod special că randarea dinamică este o „soluție de soluție” și „nu o soluție pe termen lung” din cauza complexităților suplimentare și a cerințelor de resurse. Acestea fiind spuse, poate fi încă o soluție pe termen scurt atunci când este necesar.

Redare statică

Randarea statică, cunoscută și sub denumirea de pre-randare, implică generarea conținutului HTML pentru o pagină în timpul procesului de construire sau implementare, mai degrabă decât în ​​timpul execuției. Fișierele HTML pre-rendate sunt apoi trimise direct browserului sau clientului, la cerere.

În randarea statică, serverul generează fișierele HTML cu tot conținutul și datele necesare paginii, inclusiv elemente dinamice. Aceasta înseamnă că browserul sau clientul primește o pagină HTML redată complet fără a fi nevoie de procesare suplimentară sau de execuție JavaScript.

Fișierele HTML pre-rendate sunt ușor de accesat cu crawlere de către roboții motoarelor de căutare, permițând o indexare mai bună a conținutului site-ului. În plus, randarea statică poate îmbunătăți semnificativ timpul de încărcare a paginii, deoarece conținutul este deja prezent în fișierul HTML și nu necesită randare suplimentară din partea clientului.

Ce tip de randare este cel mai bun pentru SEO?

Google recomandă utilizarea redării pe partea de server, randării statice sau combinarea randării pe partea client și pe partea serverului prin rehidratare (un fel de redare dinamică). Google nu interzice redarea pe partea clientului, dar deoarece poate fi mai problematică, nu este tocmai preferată. Pe măsură ce cantitatea de JavaScript din aplicație sau din pagină crește, poate afecta negativ interacțiunea paginii cu următoarea vopsea (INP, care va face parte din Core Web Vitals în martie 2024) atunci când este redată pe partea clientului. Când vine vorba de JavaScript la nivel de client, Google recomandă abordarea „servici doar ceea ce aveți nevoie, când aveți nevoie”.

Sfaturi pentru reducerea problemelor SEO JavaScript

A face ca site-ul dvs. să fie prietenos cu JavaScript pentru SEO nu trebuie să fie foarte complicat, dar există câteva bune practici pe care ar trebui să le urmați pentru rezultate excelente. Iată câteva sfaturi SEO JavaScript pentru a vă ajuta pe dvs. și echipa dvs. de dezvoltare să creați o strategie JavaScript care să nu vă afecteze clasamentele.

1. Asigurați-vă că Google indexează conținutul JavaScript

Nu aveți încredere că Google va reda și indexa automat conținutul dvs. JavaScript. Acordați-vă timp pentru a verifica personal, efectuând o căutare pe site pentru un anumit șir de text pe pagina dvs., între ghilimele (site: domeniul dvs..ro „text specific). Dacă apare pagina, poți fi sigur că este indexată.

De asemenea, puteți utiliza mai multe instrumente Google diferite (Instrument de inspecție URL, Test pentru dispozitive mobile) și instrumente terțe (Screaming Frog, JetOctopus) pentru a săpa puțin mai adânc și a testa implementarea JavaScript. Consultați secțiunea „Testare și depanare” din partea de jos a acestui ghid pentru a afla mai multe despre utilizarea acestor instrumente pentru a verifica erorile de indexare legate de JavaScript.

În cele din urmă, nu uitați că robots.txt poate împiedica crawlerele de căutare să acceseze anumite pagini. Dacă Google pur și simplu nu indexează o pagină, asigurați-vă că fișierul robots.txt nu îl interzice. Google nu recomandă utilizarea robots.txt pentru a bloca fișierele JavaScript, deoarece acest lucru poate afecta capacitatea Googlebot de a reda corect conținutul din pagină și de a indexa pagina.

2. Urmați cele mai bune practici SEO pe pagină

Doar pentru că lucrezi cu JavaScript în loc de HTML nu înseamnă că procesul SEO pe pagină se va schimba. Toate optimizările tehnice și on-page obișnuite (etichete, titluri, atribute etc.) sunt încă esențiale. De fapt, Google a sugerat dezvoltatorilor să evite utilizarea JavaScript pentru a crea sau gestiona etichete canonice.

3. Utilizați legături interne eficiente

Fără link-uri interne, roboții de căutare nu pot găsi toate paginile din arhitectura site-ului dvs. și vor avea probleme la accesarea cu crawlere sau la clasarea acestora. Pentru scopuri SEO JavaScript, cel mai bine este să aveți legături în HTML și nu în JavaScript, astfel încât acestea să poată fi accesate cu crawlere imediat și nu după randare.

Dacă folosiți JavaScript pentru a introduce link-uri în mod dinamic în codul dvs., asigurați-vă că le configurați în continuare folosind un marcaj HTML adecvat. De asemenea, recomand să utilizați Instrumentul de inspecție URL de la Google pentru a verifica dacă textul ancora este prezent în HTML-ul final redat. În plus, Google recomandă evitarea conectării cu handlere de evenimente JavaScript sau elemente HTML, cum ar fi <div> sau <span>, deoarece acestea pot cauza probleme pentru Googlebot și îl pot împiedica să acceseze linkul cu crawlere.

4. Stai departe de hashuri în URL-uri

SPA (aplicațiile cu o singură pagină) pot folosi URL-uri fragmentate pentru a încărca diferite vizualizări. Cu toate acestea, Google dorește ca administratorii web să evite utilizarea hash-urilor în adrese URL fragmentate, sugerând că nu ar trebui să vă bazați pe ei pentru a lucra cu Googlebot. În schimb, recomandă utilizarea API-ului History pentru a încărca conținut diferit în funcție de URL.

5. Utilizați imagini cu încărcare leneră

Încărcarea lenevă este practica de a întârzia încărcarea elementelor de pagină mai puțin importante sau nevizibile. Este obișnuit pentru optimizarea performanței și UX. Dar dacă nu ești atent la ceea ce întârziești și cum o faci, s-ar putea să ai probleme de indexare.

Googlebot nu defilează atunci când se uită la conținut; doar își redimensionează fereastra. Aceasta înseamnă că evenimentele de defilare cu script nu se pot declanșa, iar conținutul poate să nu fie redat. Google sugerează mai multe moduri diferite de a vă asigura că tot conținutul de pe pagina dvs. este încărcat atunci când se încarcă leneș.

Imaginea care detaliază procesele de încărcare a conținutului.

Probabil că cel mai bine este să lăsați încărcarea leneșă pentru imaginile dvs. Încărcarea leneșă a conținutului este riscantă, deoarece poate expira și poate ajunge să nu fie indexat.

6. Remediați conținutul duplicat

Google afirmă că conținutul duplicat nu este un motiv pentru o acțiune manuală decât dacă este de natură rău intenționată sau înșelătoare. Dar încă îți poate consuma bugetul de accesare cu crawlere, poate întârzia indexarea și poate determina paginile tale să concureze între ele pentru clasare. JavaScript tinde să creeze mai multe adrese URL pentru același conținut, așa că decideți ce versiune doriți să fie indexată și aplicați etichete canonice și noindex restului.

7. Efectuați audituri regulate ale site-ului

Pe măsură ce volumul și complexitatea codului JavaScript al unei pagini se extind, este important să verificați dacă este redat și indexat corect. Auditurile site-ului programate în mod regulat vă pot ajuta să identificați orice ați ratat în timpul rundei inițiale de testare a implementării, așa că nu uitați să faceți SEO JavaScript parte din lista de verificare SEO obișnuită.

Testare și depanare

Există mai multe instrumente diferite pe care le puteți utiliza pentru a testa dacă Google se luptă să indexeze JavaScript pe site-ul dvs. sau dacă remediile recente Google JavaScript SEO funcționează.

Prima ta oprire ar trebui să fie instrumentele web Google - în special Instrumentul de inspecție a URL-ului și instrumentul de testare pentru dispozitive mobile. Aceste instrumente nu sunt perfecte, deoarece generează o versiune a paginii dvs. din resursele disponibile în timp real, nu aceeași versiune în cache pe care o folosește rendererul. Dar ei vă pot oferi totuși o imagine destul de precisă a modului în care Google gestionează JavaScript.

Instrumentul de testare pentru dispozitive mobile vă permite să treceți între codul de pe pagina dvs. și o captură de ecran a ceea ce vede Google, astfel încât să puteți compara cele două pentru JavaScript care este posibil să nu se execute corect. Puteți accesa această funcție făcând clic pe „Vedeți pagina testată” după terminarea testului. Făcând clic pe fila „Mai multe informații”, vă arată, de asemenea, eventualele mesaje de eroare care provin din consola JavaScript și mai multe informații despre resursele paginii care nu s-au încărcat și de ce.

În mod similar, Instrumentul de inspecție URL de la Google vă oferă o captură de ecran a modului în care Googlebot vă vede paginile, astfel încât să puteți inspecta vizual elementele acesteia. De asemenea, afișează starea indexării paginilor dvs., astfel încât să puteți identifica rapid dacă una dintre paginile dvs. cu scripturi grele nu a fost indexată și poate necesita atenție.

Pe lângă aceste instrumente web, există mai multe instrumente terțe pe care le puteți utiliza pentru testare și depanare. Instrumentele crawler precum Screaming Frog și JetOctopus pot reda ambele capturi de ecran JavaScript ale paginilor dvs. Cu toate acestea, rețineți că aceste randări nu sunt neapărat aceleași cu cele pe care le-ar produce Googlebot, deoarece alte crawler-uri le generează.

Obțineți ajutor de la experții tehnici SEO

JavaScript SEO are o mulțime de părți mobile. Cu un partener dedicat, nu trebuie să abordați singur aceste probleme tehnice SEO. Victorious vă poate ajuta pe dvs. și echipa dvs. de dezvoltare să vă asigurați că site-ul dvs. este optimizat corespunzător și eforturile dvs. de SEO contribuie la obiectivele dvs. de afaceri. Solicitați o consultație gratuită pentru a afla mai multe.