Înțelegerea atributului titlului imaginii

Optimizarea imaginilor site-ului dvs. web nu este o sarcină mică. Nu numai că trebuie să vă asigurați că dimensiunile fișierelor lor sunt gestionabile pentru a preveni timpii lungi de încărcare a paginilor, dar prezintă și multe oportunități de a vă îmbunătăți optimizarea motorului de căutare (SEO), care sunt ușor de trecut cu vederea. De exemplu, este posibil să nu știți atributul titlului imaginii și rolul pe care îl joacă în elementele vizuale ale site-ului dvs.

În această postare, vom arunca o lumină asupra atributului titlului imaginii, vom discuta despre diferența de atributul alt și vom vorbi despre ce înseamnă pentru strategia dvs. SEO. De asemenea, vă vom arăta cum să îl ascundeți de vizitatorii site-ului dvs.

Hai să ne scufundăm chiar înăuntru!

Abonați-vă la canalul nostru Youtube

Introducere în atributul titlului imaginii

Primul lucru este primul: atributul titlului imaginii nu este același cu numele fișierului imaginii. Mai degrabă, sunt informații care pot fi incluse în eticheta HTML a fotografiei sau a graficului. Iată un exemplu, cu atributul title la final:

<img src="filename.jpg" alt="description of your image" title="image title">

Cel mai notabil impact pe care îl are atributul de titlu este că utilizatorii îl pot vedea ca un „sfat de instrumente” în partea din față a site-ului dvs. atunci când trec cu mouse-ul peste imagine:

Nu toate browserele acceptă această caracteristică. Cu toate acestea, Firefox este unul dintre puținele care există și este al treilea cel mai popular browser de pe web. Puteți adăuga atribute ale titlului imaginii în WordPress prin biblioteca dvs. media. Doar faceți clic pe imaginea în cauză și completați câmpul Titlu :

De asemenea, îl puteți adăuga direct în Editorul de blocuri. Extindeți setările avansate pentru blocul de imagine și completați câmpul Atribut titlu :

Scopul de a face vizibil titlul imaginii pe hover este de a oferi un pic de context suplimentar vizitatorilor dvs. De exemplu, unii creatori de conținut vor include numele persoanelor descrise în imagine sau detaliile cheie pe care utilizatorii le pot beneficia de la cunoaștere.

Cu toate acestea, nu doriți să vă bazați exclusiv pe atributul title, mai ales că nu este vizibil pentru utilizatori în toate browserele. În unele cazuri, o legendă ar putea fi mai eficientă. De asemenea, trebuie să vă asigurați întotdeauna că adăugați text alternativ la imaginile dvs., chiar dacă acestea au atribute de titlu.

Când vă creați atributele de titlu, cel mai bine este să le păstrați la doar câteva cuvinte. Fii selectiv și descriptiv, astfel încât textul cu mouse-ul să nu fie prea lung și să ofere valoare vizitatorilor tăi.

Diferența dintre atributul de titlu și atributul Alt

Am menționat mai devreme că este important să adăugați text alternativ la imaginile dvs. chiar dacă ați inclus un atribut de titlu. Este o greșeală obișnuită pentru creatorii de conținut să confunde atributul titlului imaginii pentru atributul alt sau să presupună că utilizarea ambelor este o exagerare.

Atributul alt specifică textul alternativ al imaginii în eticheta HTML. Este al doilea atribut enumerat în exemplul nostru dinainte:

<img src="filename.jpg" alt="description of your image" title="image title">

Scopul textului alternativ este de a descrie elemente vizuale utilizatorilor care nu le pot vedea, fie pentru că imaginea nu s-a încărcat, fie pentru că utilizează un cititor de ecran. Acest text va fi afișat în locul imaginii în cazurile în care nu poate fi redat:

În WordPress, puteți adăuga text alternativ la imagini prin biblioteca dvs. media sau setările oricărui bloc de imagini din Editorul de blocuri. Aceasta este cheia pentru a vă asigura că site-ul dvs. respectă standardele de accesibilitate, așa că vă încurajăm cu tărie să faceți acest lucru.

Este extrem de important să nu încercați să utilizați atributul titlului imaginii pentru a înlocui atributul alt. Nu toți cititorii de ecran acceptă atributul titlu și nu există nicio modalitate prin care utilizatorii care se bazează pe navigarea de pe tastatură să treacă peste o imagine să o vadă, deci acest lucru ar putea duce la probleme serioase de accesibilitate pe site-ul dvs.

Cum afectează atributul titlului imaginii SEO

Există o mulțime de mesaje mixte atunci când vine vorba de importanța atributului titlului imaginii pentru SEO. Unii susțin că este un mod excelent de a încorpora cuvinte cheie suplimentare, în timp ce alții spun că roboții motoarelor de căutare nici măcar nu îl accesează cu crawlere.

Pentru a reduce la urmărire, atributul titlului imaginii nu este un factor de clasare directă. Optimizarea imaginilor dvs. prin adăugarea de titluri la toate acestea probabil nu va face o schimbare semnificativă în vizibilitatea paginilor dvs. în rezultatele motorului de căutare.

Cu toate acestea, inclusiv atributele de titlu nu vă vor afecta site-ul din punct de vedere SEO. De fapt, Google o recomandă. Dacă roboții motoarelor de căutare îi accesează cu crawlere și încorporați cuvinte cheie, este posibil să puteți da imaginilor dvs. un impuls cel puțin în rezultatele căutării Google Image.

În plus, titlurile imaginilor pot îmbunătăți experiența utilizatorului (UX) a site-ului dvs. prin partajarea detaliilor cheie vizitatorilor. Acest lucru poate contribui indirect la SEO prin influențarea factorilor de clasificare, cum ar fi vizualizările de pagină, durata sesiunii și alte astfel de valori.

Chiar și așa, așa cum am menționat de mai multe ori, nu toate browserele și dispozitivele acceptă textul cu mouse-ul. Parcurgerea bibliotecii media și adăugarea de titluri în fiecare fișier ar putea fi o pierdere uriașă de timp dacă majoritatea utilizatorilor dvs. nu o vor vedea niciodată.

Cum să ascundeți sfatul pentru titlul imaginii în WordPress

S-ar putea să preferați să ascundeți sfatul de instrument al titlului imaginii. Poate că sunteți îngrijorat că vizitatorii vor găsi asta enervant sau vor să-l folosească în principal în scopuri SEO, dar nu consideră că este necesar pentru a ajuta cititorii să vă înțeleagă conținutul.

Puteți doar să eliminați atributul de titlu din imaginile dvs. din Editorul de blocuri și biblioteca dvs. media. Cu toate acestea, veți pierde eventualele beneficii SEO potențiale pe care le-ați putea vedea din acesta.

Majoritatea persoanelor care doresc să ascundă sfatul de instrumente ajung să adauge JavaScript pe site-urile lor, astfel încât să poată păstra atributul în etichetele de imagine, dar să împiedice afișarea acestuia în partea frontală. Vă recomandăm să utilizați un plugin precum Insert Headers and Footers pentru a facilita acest proces.

Adăugați următorul cod în secțiunea <head> , înfășurat în etichete de script:

jQuery(document).ready(function($) {
    $('img[title]').each(function() { $(this).removeAttr('title'); });
});

Dacă utilizați Divi, puteți sări peste instalarea pluginului suplimentar și puteți adăuga acest cod navigând la Divi> Opțiuni temă> Integrare :

Primul editor de cod de pe acest ecran va adăuga JavaScript la secțiunea <head> a site-ului dvs., așa cum ar face Insert Headers and Footers.

Concluzie

Este posibil să creați conținut online de ani de zile și să nu vă gândiți niciodată la atributele titlului imaginilor dvs. Cu toate acestea, ignorarea lor completă ar putea fi o ocazie ratată de a oferi utilizatorilor un context suplimentar. Mai important, utilizarea greșită a acestui atribut ar putea avea consecințe negative asupra accesibilității site-ului și SEO.

În acest post, am discutat despre diferențele dintre atributul titlului imaginii și atributul alt, astfel încât să vă puteți maximiza SEO-ul. De asemenea, v-am prezentat cum să ascundeți sfatul de instrumente pentru titlul imaginii în partea frontală, astfel încât vizitatorii să nu o poată vedea atunci când trec pe o fotografie sau o imagine.

Aveți întrebări despre atributul titlului imaginii sau despre optimizarea imaginii? Lasă-le pentru noi în secțiunea de comentarii de mai jos!

Imagine de Jane Kelly / Shutterstock.com