De Ce să Nu Utilizați un Slider pe WordPress
Sliderele de imagine pot fi o caracteristică destul de populară printre site-urile WordPress, dar valoarea lor adăugată este aproape de zero. De fapt, fie că întrebați un dezvoltator web care se gândește la performanță, un expert SEO sau un specialist în rata de conversie, majoritatea vă vor spune că sliderele – sau caruselele – nu sunt o idee bună. Și nu aș putea să nu fiu de acord, sunt doar cu caracter estetic și de aceea spun să nu utilizați un slider pe WordPress.
De Ce un Slider nu este Bun Pentru Performanță
Sliderele și performanța web sunt departe de a fi compatibile. Cu slidere, site-ul dvs. ar putea fi destul de lent.
Pentru ca un slider să funcționeze pe site-ul dvs., va avea nevoie de mai mult cod:
- Stiluri CSS
- JavaScript suplimentar
De cele mai multe ori, acest lucru duce la:
- Dimensiunea paginii a crescut
- Timpul de încărcare a paginii a crescut
- Număr mai mare de solicitări HTTP
Toate acestea determină performanțe mai scăzute, valori mai slabe ale Core Web Vitals și pagini mai lente, chiar și atunci când WP Rocket rulează pe site-ul dvs. web (mai multe despre acest lucru mai târziu în acest articol).
Mai precis, caruselele vă pot afecta Core Web Vitals în următoarele moduri:
- LCP – Largest Contentful Paint – Elementul LCP al unei pagini poate fi adesea găsit în sliderele de imagine de deasupra paginii. Dacă aceste slidere nu sunt optimizate corespunzător, acest lucru vă poate afecta negativ LCP.
- FID – First Input Delay – Dacă sliderele dvs. conțin fișiere JavaScript grele, timpul de execuție JavaScript va fi mai lung. Ca urmare, firul principal ar putea deveni ocupat și blocat, iar pagina ar putea să nu poată răspunde la interacțiunile utilizatorului.
- CLS – Cumulative Layout Shift – Multe slidere sunt, din păcate, instabile vizual, ceea ce poate duce la o notă CLS slabă.
Desigur, nu toate sliderele de imagine vor avea același impact asupra site-ului dvs., în funcție de cât de personalizate sunt, dimensiunea bibliotecii și așa mai departe. Dar chiar și în cazul așa-numitelor pluginuri de slidere pentru imagini „rapide”, efectele vor fi dăunătoare performanței tale:
Timp de încărcare a paginii | Mărimea paginii | Solicitări HTTP | |
Control (No Slider) | 0.9 s | 515 | 12 |
Nivo Slider | 0.8 s | 554 | 15 |
MetaSlider | 0.9 s | 562 | 17 |
Soliloquy | 1.1 s | 567 | 23 |
Smart Slider 3 | 1.0 s | 616 | 18 |
Layer Slider | 1.0 s | 657 | 20 |
Slider by 10Web | 1.5 s | 670 | 20 |
Slider Revolution | 0.9 s | 699 | 20 |
Alte Practici Proaste de Performanță
În general, animațiile plasate deasupra pliului nu sunt cei mai buni prieteni ai site-ului tău. Aceasta include și animații de text care prezintă aceleași capcane ca sliderele de imagine. Animațiile prezente în partea de sus a paginii nu sunt doar irelevante pentru conversii, ci și împing în jos conținutul dvs. Cu excepția cazului în care joacă un rol important în transmiterea imaginii dvs. de brand, amintiți-vă că conținutul dvs. vinde, clasează și convertește, nu animațiile dvs.
De asemenea, vă recomandăm să nu folosiți preîncărcarea paginilor (adică, rotorul sau bara de încărcare, unele site-uri afișează înainte de apariția conținutului real). Dacă utilizați unul în același timp cu întârzierea fișierelor JavaScript, acest lucru va determina afișarea preîncărcătorului până la interacțiunea cu utilizatorul. Și dacă nu există nicio interacțiune cu utilizatorul, spinnerul se va învârti pur și simplu la nesfârșit. Preîncărcările împiedică utilizatorii să vadă conținutul imediat, ceea ce nu este grozav pentru UX. Ca să nu mai vorbim că sunt contraproductive, deoarece încetinesc site-urile web. De ce să adăugați o secundă de spinner când ați putea avea un site web cu încărcare mai rapidă?
De Ce Nu Veți Profita la Maximum de Funcția JS de Întârziere
O întrebare pe care cineva și-ar putea pune este următoarea: rularea WP Rocket pe site-ul meu nu ar trebui să compenseze impactul negativ al sliderelor (sau al altor practici proaste) asupra performanței? Din păcate, nu este atât de simplu. Dacă utilizați slidere pe site-ul dvs. web, nu veți putea experimenta WP Rocket în cea mai mare măsură.
Luați una dintre cele mai noi – și cele mai puternice – caracteristici ale WP Rocket, de exemplu, funcția de întârziere a executării JavaScript. Ideea din spatele acestei funcții este că nu toate fișierele sunt relevante pentru redarea inițială a unei pagini, iar întârzierea acestora poate îmbunătăți timpul de încărcare și Scorul PageSpeed.
Întârzierea execuției JavaScript îmbunătățește performanța prin întârzierea încărcării fișierelor JavaScript până când există o interacțiune cu utilizatorul. Când această caracteristică este activată, toate fișierele JavaScript sunt întârziate și încărcate numai atunci când utilizatorii au nevoie de ele, adică atunci când este detectată o interacțiune a utilizatorului (de exemplu, derulare, clic pe un buton).
Dar iată și problema: dacă aveți un slider în partea de sus a unei pagini și funcția Delay JS este activată, conținutul sliderului va fi amânat și conținutul nu se va afișa în timpul redării inițiale a paginii. Inutil, nu? Soluția este, din păcate, de a dezactiva funcția pentru fișierele JavaScript legate de slider.
Având în vedere cât de populare sunt sliderurile, echipa de asistență pentru clienți ajută frecvent utilizatorii WP Rocket care se confruntă cu probleme cu sliderurile lor atunci când funcția este activată. „De multe ori trebuie să excludă fișierele legate de slidere pentru a le face să funcționeze fără interacțiunile utilizatorului”, explică Vasilis, inginerul de asistență pentru clienți de la WP Rocket. Fără această funcție, acești utilizatori pierd un avantaj excelent pentru îmbunătățirea performanței.
Slidere și Performanță Web: Dovada Este Clară
Pentru a vedea exact cum sliderele pot afecta negativ performanța WP Rocket, s-a efectuat o serie de teste pe un site web cu și fără un slider.
Am acoperit 4 audituri:
- Auditul 1: am măsurat performanța site-ului cu Revolution Slider, dar fără a fi activată funcția Delay JavaScript Execution.
- Auditul 2: am măsurat performanța site-ului cu Revolution Slider și cu funcția Delay JavaScript Execution activată.
- Auditul 3: Am măsurat performanța site-ului cu Revolution Slider și cu funcția Delay JavaScript Execution activată. Scriptul legat de slider a fost exclus.
- Auditul 4: Am măsurat performanța site-ului cu o imagine statică și cu funcția Delay JavaScript Execution activată.
Să vedem rezultatele:
Auditul nr. 1: Slider Revolution fără întârzierea executării JavaScript
După cum puteți vedea, scorul este portocaliu (55/100) și Core Web Vitals nu sunt foarte sănătoși.
Există destul de multe probleme legate de resursele neutilizate.
Audit nr. 2: Slider Revolution cu Execuție JavaScript Întârziată
După cum puteți vedea, scorul este în verde (90/100) și am obținut rezultate mult mai bune per total.
Problema a fost că sliderul nu a apărut înainte de interacțiunea utilizatorului.
Auditul nr. 3: Slider Revolution cu Execuție JavaScript întârziată și Slider Exclus
După cum puteți vedea, scorul este verde, dar nu la fel de mare (86/100) și există din nou probleme cu resursele și imaginile neutilizate.
Audit nr. 4: Fără Slider cu Execuție JavaScript Întârziată
În loc să folosim un slider, de această dată am adăugat o imagine statică:
După cum puteți vedea, rezultatele au fost cele mai bune dintre toate scenariile, scorul a fost în verde și am scăpat de problemele JavaScript neutilizate.
Un slider din antet pur și simplu distruge performanța site-ului dvs. și chiar și cel mai puternic plugin de optimizare (cum ar fi WP Rocket) nu va compensa. Sfatul nostru? Nu utilizați slidere.
Cum Pot Afecta Sliderele SEO
Cei de la WP Rocket, sunt obsedați de performanța web, dar există și alte motive pentru care nu recomandă sliderele. De fapt, există acest lucru mic numit SEO care nu este întotdeauna de acord cu sliderele.
Odată cu lansarea Core Web Vitals, optimizarea vitezei paginii dvs. pe WordPress este acum mai importantă ca niciodată pentru SEO. După cum tocmai am văzut, sliderele încetinesc paginile, nu există nicio cale de ocolire. Iar cercetările arată că performanța slabă este doar un aspect al sliderelor care afectează negativ SEO. Alte probleme raportate includ mai multe titluri H1 și utilizarea flash, de exemplu.
În plus, ultima actualizare Google este legată de experiența utilizatorului: pentru a vă clasa bine, pagina dvs. trebuie să ofere utilizatorilor cea mai bună experiență posibilă. Din păcate, gradul de utilizare și caruselele nu merg mână în mână. Sliderele pot fi confuze pentru utilizatori: ofertele rotative nu clarifică ceea ce doriți să prezentați. Dacă nu poți alege, nici vizitatorii nu vor putea! Și în aceste zile, UX-ul rău nu poate decât să submineze eforturile dvs. de SEO. Sliderele ridică probleme de accesibilitate pentru utilizatorii cu probleme și folosesc tastatura și cititoare de ecran, care la rândul lor, vă vor afecta SEO.
Sliderele și Ratele de Conversie
După cum tocmai am arătat, sliderele au un efect negativ asupra experienței generale a utilizatorului. Adăugați și faptul că doar 1% dintre oameni dau clic efectiv pe un slider, care este aproape întotdeauna primul slider, în acest caz, este destul de ușor să ajungeți la concluzia că sliderele nu convertesc.
Având în vedere interacțiunea redusă pe care o creează, sliderele reprezintă un mod complet ineficient de a ajunge la publicul țintă. Conținutul de după primul diapozitiv va fi ratat în întregime de utilizatorii dvs. În unele cazuri, vizitatorii pot sări peste sliderul dvs. din cauza „orbirii bannerului” sau crezând că este un anunț. Oricum, nu vei transmite mesajul tău.
Concluzia este că, dacă scopul site-ului dvs. este de a declanșa conversii, va trebui să încercați să vă îmbunătățiți timpul de încărcare, precum și valorile Core Web Vitals decât să adăugați slidere sau orice fel de animație.
Alternativele Potrivite
Crezi că nu poți trăi fără un carusel? Mai gândește-te. „Proprietarii de site-uri web pot folosi o singură imagine statică în locul sliderelor”, explică Vasilis. „O imagine este ceva care va ieși în evidență și va transmite mesajul pe care doresc să-l transmită.” Dacă doriți să prezentați mai multe imagini, creați-vă propria galerie foto.
Sliderele statice ar putea fi, de asemenea o alternativă. Acestea au încă probleme de utilizare și conversie, dar impactul lor asupra performanței nu este la fel de rea. În orice caz, evitați animațiile și sliderele.