Žinau, kad tavo įvaizdis apie mane yra toks, kokio tikiuosi būti

Vaizdo optimizavimas SEO tikslais yra menas, kurį turėtumėte išmokti įvaldyti. Kadangi vaizdai jūsų svetainėje užima daug vietos, natūralu, kad yra būdų juos optimizuoti ne tik siekiant geresnės vartotojo patirties ir funkcionalumo, bet ir geresnio rango bei srauto. Didžioji dilema yra rasti pusiausvyrą tarp gerai optimizuoto vaizdo, kuris vis dar išsaugo savo vizualinę kokybę ir greitą, aukštos kokybės svetainę. Taigi, geriau užduoti klausimą: ar optimizuoti vaizdai gali padėti / papildyti jūsų SEO pastangas ?

 

 

Neturėtume pridėti nuotraukų prie savo turinio, kad turėtume ką nors sugadinti mūsų turinį ir sukurti daugiau eilučių. Tai nerekomenduojamas vaizdinio turinio naudojimo būdas. Yra daugybė situacijų, kai aukojami pikseliai, o nuotraukos turi blogos išvaizdos aspektą. Kodėl kai kurie nekalti paveikslėliai turėtų būti pikseliuoti po suglaudinimo, kai yra daugybė kitų būdų, kaip optimizuoti vaizdus ir vis tiek išlaikyti vaizdinį aspektą? Taigi, mes surinkome svarbiausius patarimus, kurie padės ne tik optimizuoti SEO vaizdus, ​​bet ir pagreitins jūsų svetainę bei padės jums siekti SEO.

 

1. Pasirinkite tinkamą vaizdo formatą
2. Optimizuokite vaizdo failo svorį
3. Išsaugokite vaizdus mažesne raiška
4. Pakeiskite vaizdų dydį
5. Sumažinkite failo dydį naudodami papildinius
6. Pašalinkite visus nesusijusius ar nereikalingus metaduomenis
7. Pavadinkite savo atvaizdus ir pridėkite alternatyvius SEO sėkmės aprašus
8. Naudokite SVG failus, kad turėtumėte didesnį aiškumą ir lengvesnę svetainę

 

Ankstesni mūsų tyrimai ir atvejų tyrimai apie vaizdų ir SEO ryšį paskatino mus pereiti prie šios vaizdo optimizavimo temos. Tada pastebėjome, kad „Google“ gali skaityti tekstą iš vaizdų, o tai ateityje gali turėti didžiulę reikšmę reitingams ir „Google“ vaizdų paieškos pasauliui.

 

Labai tikėtina, kad artimiausiu metu „Google“ tikriausiai pakeis algoritmus dėl vaizdų reitingavimo būdo. Šis pokytis dramatiškai paveiks paiešką, taigi ir SEO pasaulį. Juolab kad „Google“ naudoja objektų aptikimą vaizduose . Todėl geriausia būti pasirengusiam ir vadovautis kitais mūsų vaizdų SEO patarimais, kurie padės „Google“ artimiausiu metu „perskaityti“ ir suskirstyti jūsų vaizdus į eilę. 

1. Pasirinkite tinkamą vaizdo formatą

 

Vaizdiniam turiniui yra keli failų tipai, kurių kiekvienas naudojamas skirtingiems tikslams. Jei pasirinksite tinkamą failą, jis pasirodys esąs didžiulis patobulinimas. Žiniatinkliui galite pasirinkti:

• JPEG formatas, kai turite daug spalvų, spalvų gradiento ir šešėlių turinčių nuotraukų.
• PNG formatas, kai turite logotipą arba tai yra paveikslėlis su daugybe vienspalvių spalvų arba jums reikia naudoti skaidrumą.
• GIF formatas, kai turite animaciją arba paaiškinta toje pačioje situacijoje, arba PNG formatas.

 

JPEG	PNG	GIF

 

Ilya Grigorik, „Google“ žiniatinklio našumo inžinierius, paaiškina, kaip galite pasirinkti geriausią paveikslėlio failo formatą per kitą „Google Developer“ svetainės „ Web Fundamentals“ atstovą .

 

 

Tinkamas formatas ir tinkamas paveikslėlis gali labai paveikti jūsų turinio ateitį. Vis daugiau verslų investuoja į vizualų savo turinio vaizdą. Štai kodėl  51 procentas B2B rinkodaros specialistų teikia pirmenybę vaizdinių išteklių kūrimui kaip savo turinio strategijos daliai.

2. Optimizuokite vaizdo failo svorį

 

Sumažinus vaizdo kokybę, svetainė gali greičiau įkelti puslapį. Greitos svetainės reiškia geresnę vartotojo patirtį, o tai savo ruožtu padidina konversijų skaičių. Pagal „Kissmetrics“ tyrimą, pavėlavus puslapio atsakymą, 1 sekundė gali sumažinti konversijų skaičių 7% .

 

Dar didesnė problema yra mobiliojo ryšio vartotojams . Vaizdai sudaro 68% viso puslapio svorio  ir būna per dideli, per daug ir dažnai nereikalingi, sulėtindami puslapio apkrovą ir neleisdami vartotojui pasiekti informacijos.

 

Vaizdo dydį nustato jo kokybė arba taškų skaičius. Jei paveikslėlyje yra daugiau taškų, tai padidins jo dydį, matmenis ir kokybę. Štai kodėl JPEG ir PNG formatams rekomenduojama sumažinti kokybę 15–20%. Šią galimybę turi daugybė specialių programinių programų.

 

Pavyzdžiui, „Adobe Photoshop“ JPEG ir PNG formatuose yra galimybė optimizuoti vaizdus žiniatinkliui. Veiksmai yra gana paprasti: Eksportuoti »Išsaugoti žiniatinkliui» Kokybė 85% (naudokite kairėje esančią nuotraukų peržiūros priemonę, kad nustatytumėte, ar galite labiau suspausti paveikslėlį ir kaip jis atrodo) »Spustelėkite Išsaugoti .

 

 

Kuo didesnis procentas, tuo geresnė nuotraukos kokybė. PNG paveikslėliams galite rinktis kitas optimizavimo galimybes, pvz., PNG 8 bitų ir PNG 24 bitų. Rekomenduojama išsaugoti jį kaip 8 bitų png, kad nuotraukoje būtų lengvo dydžio.

 

 

„Affinity Photo“ yra dar viena galimybė suspausti vaizdus, ​​kurie gali būti panašūs į „Photoshop“, bet pigesni. Žemiau pateiktame pavyzdyje galite pamatyti, kad vaizdo dydis yra 3,19 MB.

 

 

Norint pasiekti didelį eksporto suspaudimo efektyvumą esant 55% kokybei, dydis sumažės 303 kB, o tai yra 10 kartų mažiau.

 

 

Norint sumažinti vaizdo kokybę, yra papildomų, lengviau naudojamų programinių programų, tokių kaip „Gimp“ ir kitos mažos programinės įrangos pradedantiesiems, tokios kaip „ GIFsicle“ , „ JPEGtran“ , „ JPEG Mini“ , „ OptiPNG“ , „ pngquant“ , „ FileOptimizer“ , „ ImageOptim“ (žr. Paveikslėlį žemiau).

 

 

Jei norite pasirinkti lengviausią būdą ir neatsisiųsti jokios programinės įrangos, vaizdams suspausti yra galimybė naudoti internetinius redagavimo įrankius. „TinyPNG“ ir „Trimage“ yra du dažniausiai naudojami.

 

 

Taip pat yra „ PageWeight by imgIX“, kur galite pridėti savo svetainę ir įvertinti vaizdinio turinio „kiekį“. Tam yra apskaičiuota trys pagrindinės kiekvienos svetainės metrikos, pateikiamos naudojant spalvų juostas (šviesią, rekomenduojamą ir sunkią), kaip matote toliau pateiktoje ekrano kopijoje. Mūsų pavyzdyje yra nedidelis svetainės turinio svoris, nedidelis vaizdo svoris ir kelios rekomendacijos, kaip geriau optimizuoti vaizdą.

 

 

Žemiau galime pamatyti pavyzdinę ataskaitą ir veiksmus, kurių reikia imtis:

• Kaip vaizdai veikia jūsų puslapio svorį;
• Jūsų blogiausiai veikiantis vaizdas;
• Jūsų puslapio vaizdų suskirstymas.

 

 

Kiekvienam rezultatui yra keletas rekomenduojamų veiksmų, kuriuos galime atlikti norėdami pagerinti jūsų įkėlimo puslapio vėlavimą, optimizuoti vaizdus, ​​kad sumažintumėte svorį.

3. Išsaugokite vaizdus mažesne raiška

 

Kitas vaizdo optimizavimo sprendimas yra išsaugoti nuotraukas mažesne raiška. Rezoliucijos nurodo vaizdo taškų skaičių. Redagavimo programinė įranga skiriamąją gebą identifikuoja kaip vaizdo plotį ir aukštį bei taškų skaičių tame paveikslėlyje.

 

Pavyzdžiui, jei turite 500 pikselių pločio ir 281 pikselių aukščio (500 × 281) vaizdą, jis turės 140 500 pikselių (padauginome pikselių skaičių pagal plotį ir aukštį), o tai reiškia 141 KP.

 

Didesnio vaizdo raiška bus didesnė. Pavyzdžiui, jei turime aukštos kokybės vaizdą, kurio dydis yra 1920 × 1080, skiriamoji geba bus 2,07 Megapikseliai.

 

Grafikos redagavimo programinėje įrangoje mes turime galimybę pasirinkti jūsų vaizdo matmenis ir skiriamąją gebą, o tai gali būti šiek tiek klaidinantis, nes mes negalime turėti vienodo dydžio vaizdų skirtingomis raiškomis.

 

 

500 × 281, 72 ppi, 300 ppi ir 1000 ppi, vaizdas atrodys visiškai toks pat, o taškų skaičius bus 141 KP.

 

HTTP archyvas atliko keletą įdomių analizių, susijusių su svetainės suskirstymu pagal turinio tipą . Rezultatai buvo neįtikėtini. Žemiau galite pamatyti tos ataskaitos duomenis. Galite lengvai pamatyti, kad vaizdai turi didžiausią svorį svetainėje. 

 

 

Diagramoje pateikti dydžiai yra perdavimo dydžiai, todėl suspausti atsakymai laikomi mažesniais nei originalus, nesuspaustas turinys.

 

„Google“ puslapio spartos įžvalgos gali parodyti vaizdus, ​​kuriuos reikia suspausti, ir vietą, kurią sutaupysite po to. Žemiau pateiktame pavyzdyje galite pamatyti failus, kuriuos reikia suglaudinti. Jei juos suglaudinsite, sutaupysite 1,1 MB.

 

 

„Pixlr Online Photo Editor“ yra nemokama ir internetinė galimybė, reikalinga daugeliui redagavimo poreikių, ir ji gali būti naudojama vaizdams išsaugoti mažesne raiška. Be to, galite naudoti sluoksnius ir efektus. Jis turi panašią sąsają kaip „Adobe Photoshop“. 

4. Pakeiskite vaizdų dydį

 

Kai įkeliate vaizdus į savo svetainę ir norite juos optimizuoti, rekomenduojama juos keisti pagal mastelį, o ne leisti CSS juos keisti. Šis metodas gali būti taikomas tik tuo atveju, jei neturite interaktyvių puslapių, kitaip jis nėra aktualus. Dar vienas dalykas, kurį verta paminėti, yra tai, kad nereikėtų vien tik mastelinti vaizdų neatsižvelgiant į jokias kitas optimizavimo technikas. Tai geriausiai tinka kitai rekomendacijai, naudojant papildinius sumažinamas failų dydis.

 

Būdamas „WordPress“ vartotojas, turite daug privalumų. Pavyzdžiui, šiuo atveju jūsų vaizdai bus keičiami pagal numatytuosius nustatymus, kai juos pridėsite prie medijos bibliotekos. Galite lengvai pasiekti šią parinktį, jei eisite į Nustatymai »Medija . Maksimalus paveikslėlio plotis turi būti artimas jūsų svetainės plotiui. Tokiu būdu CSS nepakeis jūsų vaizdų dydžio, kad tilptų į vidų.

 

 

Šiuo atveju verta paminėti keletą kitų rekomendacijų:

• Kuo daugiau naudokite CSS3 efektus;
• Išsaugokite vaizdus norimu dydžiu, užuot leidę HTML ar CSS jų dydį pakeisti;
• Apkirpkite atvaizdų baltąsias erdves ir atkurkite jas naudodami CSS, kad užpildytumėte;
• Sumažinkite bitų gylį iki mažesnės spalvų paletės;
• Pasirinkite žiniatinklio šriftus ir venkite įdėti teksto į vaizdus, ​​nes tokiu būdu neturėsite problemų dėl mastelio keitimo ir tai sutaupys vietos;
• Rastrinius vaizdus (vaizduojamus nesuskaičiuojamų mažų kvadratų / pikselių kolekcija) naudokite tik scenoms su daugybe formų ir detalių;
• Sumažinkite vaizdus glaudindami „Gzip“.

5. Sumažinkite failo dydį naudodami papildinius

 

Jei esate „WordPress“ vartotojas, turėtumėte džiaugtis sužinoję, kad yra ir automatinių būdų suspausti vaizdus naudojant papildinius.

 

Papildiniai gali labai gerai veikti kaip antras žingsnis suspaudžiant vaizdus. Niekada nenaudokite jo vieni. Pvz., Pridėjus paveikslėlį, kurio bibliotekoje yra 2 MB, galite išnaudoti savo žiniatinklio prieglobos disko vietą tikrai greitai. Turite pasirinkti jums labiausiai tinkančius įskiepius ir pradėti dirbti. Kiekvieno papildinio veiksmus lengva atlikti:

 

Prisijunkite prie savo „WordPress“ papildinių » Pridėti naują » Ieškokite papildinio » Įdiekite dabar ir palaukite kelias sekundes» Suaktyvinti . Tada, jei jums patinka, galite eiti į konkretų papildinį ir peržiūrėti „Nustatymus“, kad įsitikintumėte, jog viskas atitinka jūsų poreikius.

 

„WP Smush“, „CW Image Optimizer“, „Insanity“, „Hammy“, „SEO Friendly“ vaizdai arba „PB Responsive Images“ yra tik keli papildinių pavyzdžiai, kurie automatiškai ir be nuostolių suglaudins jūsų vaizdus. Visus papildinius galima naudoti norint optimizuoti vaizdus, ​​kurie anksčiau buvo įkelti arba pridėti po įdiegimo.

 

Žemiau galite pamatyti greičio testą, kurį „Kinsta“ atliko naudodama „Pingdom“ prieš ir suspausdama vaizdus. Nesuspaustų JPEG svetainių įkėlimo laikas buvo 1,55 sekundės, o bendras puslapio dydis – 14,7 MB.

 

 

Suspaustų JPEG failų įkėlimo laikas sumažėjo 54,88%, o puslapio dydis – 80,27%. Rezultatai kalba patys už save:

 

 

Siūlydami turėtumėte išlaikyti didesnį vaizdą (1920 piks. Ir didesnis) atvaizdo failo svorį, mažesnį nei 120 kb, o mažesnių – dar lengvesnį. Paprastai geriausia, kad dauguma vaizdų būtų apie 50 kb.

 

Brianas Jacksonas , rež. „Kinsta“ atvykstamojo marketingo, paaiškinta straipsnyje apie „ Optimus“ , skirtingi glaudinimo tipai, kai reikia sumažinti jūsų vaizdų dydį žiniatinklyje.

 

Netinkamas glaudinimas reiškia glaudinimą, kai prarandama dalis pradinio failo (JPEG) duomenų. Procesas yra negrįžtamas, kai jūs konvertuojate į nuostolingą, jūs negalite grįžti atgal. Ir kuo daugiau jį suspaudi, tuo daugiau degradacijos įvyksta.
	BRIANAS JACKSONAS
	Rež. Atvykstamasis rinkodaros Kinsta

Kitoje pusėje,

„Lossless compression“ reiškia glaudinimą, kai vaizdas sumažinamas neprarandant kokybės. Paprastai tai daroma pašalinant nereikalingus metaduomenis iš JPEG ir PNG failų. RAW, BMP, GIF ir PNG yra visi vaizdų formatai be nuostolių.
	BRIANAS JACKSONAS
	Rež. Atvykstamasis rinkodaros Kinsta

6. Pašalinkite visus nesusijusius ar nereikalingus metaduomenis

 

Metaduomenys yra informacija, saugoma vaizdo faile, ir paprastai ją automatiškai sugeneruoja vaizdas užfiksavęs įrenginys.

 

Papildomus metaduomenis, tokius kaip EXIF ​​duomenys (visų fotoaparato nustatymų įrašas), galima pridėti rankiniu būdu naudojant specialią programinę įrangą arba tiesiogiai skaitmeniniuose fotoaparatuose. Į paveikslėlį galima įdėti įvairiausią informaciją, pvz., Ekspozicijos laiką, diafragmos nustatymus, fotoaparato tipą, fotografavimo datą, autorių ir kitą informaciją. Ši informacija yra labai svarbi konkrečioms svetainėms (pavyzdžiui, fotografijai), o kitoms svetainėms ji gali būti visiškai nesvarbi.

 

Dezinfekuoti vaizdą gali būti nepaprastai naudinga pagerinti svetainės įkėlimo greitį. Pažvelgę ​​į kitą paveikslėlį pamatysite, kokią informaciją galima įterpti į atvaizdą. Galite lengvai pasiekti tuos duomenis, jei eisite į atvaizdo ypatybes ir tada pasirinkite Išsami informacija .

 

 

Pasirinkite, ką ištrinti ir ką palikti, lengvai eidami į kiekvienos nuosavybės langelį Vertė ir ištrindami turinį. Jei failas veikia tik skaitymo režimu, negalėsite redaguoti šios informacijos. Tačiau yra ir kitų būdų, kaip jį peržiūrėti, naudojant „Google Chrome“ plėtinį „ EXIF“ peržiūros priemonę , kurią pasieksite maža fotoaparatu iš jūsų naršyklės. Vos vienu paspaudimu ant piktogramos gausite visus „Exif“ duomenis.

 

„Photoshop“ arba „Adobe Lightroom“ yra kiti pavyzdžiai, kurie gali padėti atsikratyti nereikalingų EXIF ​​duomenų. Eikite į Failas »Failo informacija.

 

 

Įsitikinkite, kad išsaugojote jums svarbius duomenis ir ištrinkite nereikalingus vaizdo duomenis. Tokiu būdu galite optimizuoti savo atvaizdus ir padėti paieškos sistemoms geriau suprasti jūsų vaizdinį turinį.

7. Pavadinkite savo atvaizdus ir pridėkite alternatyvius SEO sėkmės aprašus

 

Tai, kad „Google“ galėtų lengvai perskaityti vaizdus ir padaryti juos draugiškus, suteiks SEO sėkmę jūsų svetainėje. Savo SEO žaidimą galite pakelti aukštyn, suteikdami savo atvaizdams atitinkamus pavadinimus ir raktinių žodžių turtingus alternatyvaus teksto aprašymus, tuo nepasinaudodami ir nepraktikuodami raktinių žodžių įdaro.

 

Jei reikia, naudokite paveikslėlio ar antraštės aprašymą. Šiuos elementus galite pridėti atlikdami ankstesnį veiksmą, kuriame galite išsaugoti metaduomenis, susijusius su aprašymu, autoriumi ir vardu ar failu.

 

Jei neturite šios informacijos į failą, pridėkite ją tiesiogiai, kai įkeliate vaizdą į savo svetainę. „WordPress“ leidžia vartotojui lengviau redaguoti duomenis, kuriuos jie nori pasiekti „Google“.

 

 

Paieškos sistemos tikrina ir jūsų svetainės tekstą, ir įterptą į jūsų vaizdus. Įsitikinkite, kad nenaudojate bendrinių pavadinimų, tokių kaip DSCN093298.png, Image01.jpg arba animation-version1.gif ir pan., O aprašomieji failų pavadinimai. Pavadinimų žymos ir vaizdų tekstai yra labai svarbūs, kai naršyklė negali tinkamai pateikti jūsų svetainės.

8. Naudokite SVG failus, kad turėtumėte didesnį aiškumą ir lengvesnę svetainę

 

SVG naudojamas logotipams, piktogramoms, tekstui ir paprastiems vaizdams kurti. Visas „Scalable Vector Graphics“ turinys yra tik tekstas. Tiesiog pažvelkite į „ W3Schools “ pavyzdį . Kairėje pusėje yra failo turinys, o dešinėje – atvaizduota teksto versija, kurioje galite pamatyti, kaip tai atrodo. Būtent taip vartotojai matys SVG failą. Jei bandysite pakeisti spalvą ar matmenis, vaizdo kokybė nebus pažeista, ji bus išsaugota.

 

 

SVG failo naudojimas yra dar viena rekomendacija kurti geresnes svetaines. Savo svetainėje vis tiek galite turėti PNG ir JPEG, tačiau, be to, labai gerai, kai tik įmanoma, naudoti vektorinius vaizdus.

 

Ilya Grigorik paaiškino vaizdo vektorių ir rastrinių vaizdų skirtumą. Kaip jau minėjau anksčiau, rastriniai vaizdai naudojami sudėtingoms, netaisyklingos formos ir detalių scenoms. Kita vertus, vektoriniai vaizdai idealiai tinka vaizdams, susidedantiems iš geometrinių figūrų.   

 

 

Vektoriniai vaizdai turi didelių privalumų:

• Jie yra keičiami tiek naršyklėje, tiek redagavimo įrankiuose. Galite priartinti ir nutolinti, nepaveikdami kokybės;
• Jūs neprarandate SEO kokybės. SVG yra „Google“ indeksuojami taip pat, kaip JPEG ir PNG;
• Paprastai SVG yra mažesni nei JPEG ir PNG.

 

Išvada

 

Kai kas nors naršo internete, naršyklė turi atsisiųsti visus failus iš savo svetainės, kad juos būtų galima pateikti. Dideliu mastu tai reiškia paveikslėlius, kuriuose galima saugoti daug nesusijusių duomenų ir taškų.

 

Išnagrinėjome temą ir radome daug nepatogiai paprastų būdų sumažinti vaizdo failo dydį redaguojant kokybės nustatymus. Surinkome patarimus ir išteklius, kurių kruopščiai laikėmės per metus. Vaizdo išsaugojimas žiniatinklyje, naudojant vaizdo optimizavimo įrankius, nereikšmingų metaduomenų pašalinimas, vaizdo dydžio keitimas pagal mastelį yra tik keli pavyzdžiai, kaip galėtumėte optimizuoti vaizdus.

 

Naudokite GIF ir PNG formatus, nes jie yra be nuostolių. Pageidaujamas formatas yra PNG, nes galite pasiekti geriausią suspaudimo laipsnį su geresne vaizdo kokybe.

 

Galų gale įsitikinkite, kad išbandėte savo vaizdinį turinį naudodami papildinius, įrankius ir programinę įrangą, kad palengvintumėte procesą.