Si të zgjedhim imazhet e tua që të jenë miqësore me SEO (Udhëzues i plotë)

Performanca e uebfaqes suaj varet nga disa faktorë që variojnë nga hosti specifik i uebit që zgjidhni, mbi vijimin e udhëzimeve të aksesit në uebfaqe, deri te madhësitë e skedarëve të figurës që përdorni.


Formatimi i tyre për madhësinë e duhur, megjithatë, mund të ulë cilësinë për shkak të modifikimeve që ju bëni. Lajmi i mirë është se ju mund të ruani cilësinë optimale të imazhit dhe të merrni madhësinë e duhur me disa teknika dhe mashtrime.

Farë është Optimizimi i Imazhit?

dimensionet e optimizmit të imazhitFaqet në internet mund të pësojnë një ngadalësim të konsiderueshëm kur paraqiten imazhe të mëdha. Kjo mund të zvogëlojë kohën e ngarkimit dhe ta bëjë subpar-in e përgjithshëm të përvojës për vizitorët e faqes tuaj.

Ulja e madhësisë së skedarit është optimizimi i figurës. Ju mund të përdorni një skenar ose një shtojcë për këtë.

Kjo më pas rezulton në kohë më të shpejtë ngarkimi për faqet tuaja. Kompresimi pa humbje dhe humbje janë dy metodat më të zakonshme të optimizmit.

Përfitimet e formatimit të figurës

madhësive mesatare të imazhit në internetVlerësohet se afërsisht 54 përqind e peshës totale të një faqe në internet është për shkak të imazheve.

Kur jeni duke punuar në optimizimin e faqes në internet, imazhet tuaja duhet të jenë detyra juaj e parë për shkak të kësaj. Përfitimet e formatimit të imazhit përfshijnë:

  • Shpejtësia e përmirësuar e ngarkimit të faqeve
  • Shtë më e shpejtë për të krijuar kopje rezervë
  • Kërkohet më pak hapësirë ​​për ruajtjen e serverit
  • SEO e përmirësuar me shtojcën e duhur SEO
  • Përdoret më pak gjerësia e bandës

Si të përmirësoni performancën me optimizimin e figurës

Qëllimi është të ekuilibroni në mënyrë të barabartë cilësinë e pranueshme dhe madhësinë më të ulët të mundshme të skedarit. Ka më shumë se një mënyrë që ju ta bëni këtë. Para se të ngarkoni, kompresimi i imazheve tuaja është një mundësi e zakonshme. Për këtë qëllim mund të përdorni një mjet ose një plugin (këtu janë disa).

Shtë e rëndësishme të merrni parasysh llojin e kompresimit dhe formatin e skedarëve që përdorni. Kombinimi i duhur bën të mundur uljen e madhësisë së figurës suaj deri në pesë herë.

Eksperimentoni me formate të ndryshme skedarësh dhe lloje kompresimi për të përcaktuar kombinimin më të mirë për nevojat tuaja.

Zgjidh formatin më të mirë të skedarit

Për të zgjedhur llojin më të mirë të skedarit, është e rëndësishme të dini se cilat janë në dispozicion. Këto janë më të zakonshmet:

  • JPEG: Ky lloj shfrytëzon optimizmin pa humbje dhe humbje. Mund të arrini një ekuilibër të madh të madhësisë dhe cilësisë së skedarit duke rregulluar nivelin e cilësisë.
  • PNG: Ky lloj ka tendencë të ketë një madhësi më të madhe të skedarit, por imazhet janë më të larta në cilësi. Ju mund të përdorni kompresim humbës ose pa humbje.
  • GIF: Kjo është ideale për imazhe të animuara. Ju mund të përdorni vetëm kompresim pa humbje. Përdor vetëm 256 ngjyra.

formatet e skedarëve të figurave

Ka mundësi të tjera, por këto janë ndër më të zakonshmet dhe më të lehtat për tu punuar. Opsione të tjera përfshijnë JPEG XR dhe WebP. Jo të gjithë shfletuesit i mbështesin këto dy, prandaj ki kujdes për këtë.

Megjithatë, ato mund të jenë një zgjedhje e vlefshme. Për shembull, në krahasim me një imazh të krahasueshëm JPEG, ka një ulje të madhësisë së skedarëve 30 përqind me WebP, mesatarisht.

Për shkak të mungesës së mbështetjes universale për këto dy mundësi, aplikacioni juaj do të ketë nevojë për logjikë shtesë në serverët ose aplikacionin tuaj për të siguruar burimin e duhur:

  • Optimizimi i figurës është një shërbim i ofruar nga disa CDN, përfshirë ofrimin e WebP dhe JPEG XR.
  • Për të zbuluar klientin, siguroni formatin më të mirë të figurës në dispozicion dhe kontrolloni formatet e mbështetura është e mundur të shtoni logjikë shtesë të aplikacionit.
  • Disa mjete me burim të hapur automatizojnë bisedën, optimizimin dhe shërbimin e pasurive të përshtatshme.

Madhësia vs cilësia e kompresimit

Kompresimi i ulët ka tendencë të japë një cilësi më të lartë, por madhësitë e skedarëve janë zakonisht më të mëdha. E kundërta është e vërtetë me kompresim të lartë. Skedarët janë më të vegjël, por cilësia ka tendencë të ulet.

cilësia e figurës vs kompresimi

Në mënyrë ideale, ju doni një total prej një ose dy MB për peshën e përgjithshme të faqes tuaj. Pra, merrni parasysh sa imazhe duhet të përdorni dhe ndajeni këtë numër me rreth 1.5. Kjo ju jep madhësinë për figurë që lejon shpejtësinë më të mirë të ngarkimit.

Lossless vs Optimizimi i Humbur

Këto janë dy llojet e kompresimit që do të përdorni. Shtë e rëndësishme të kuptoni se çfarë bëjnë:

  • compression humbje vs humbjelossless: Kjo kompreson të dhënat dhe është një filtër. Para se të jepni imazhin, duhet të jetë e pakompromis. Sidoqoftë, cilësia nuk është ulur. Ekzistojnë disa mjete që kryejnë kompresim pa humbje.
  • lossy: Kjo eliminon disa të dhëna dhe është një filtër. Jini të vetëdijshëm për sa reduktim ju bëni sepse do të degradojë imazhin. Ju mund të përdorni redaktorë dhe mjete të ndryshme për të rregulluar cilësimet e cilësisë së figurës.

Konfigurimi optimal i konfigurimit ose pa humbje ose i humbur varet nga kriteret tuaja, të tilla si shkëmbimi i sendeve të paraqitura dhe madhësia e skedarit, si dhe përmbajtja e figurës.

Nuk ka asnjë cilësim të vetëm universal që vlen për të gjitha imazhet. Në fund të fundit, ju dëshironi të luani me imazhe të ndryshme për të parë se cilat funksionojnë më mirë.

Ndryshimi i figurave në shkallë

Falë faqeve të përgjegjshme në faqet, të tilla si WordPress, do të merrni disa madhësi skedarësh në bibliotekën tuaj të mediave. Shfletuesi juaj mund të zgjedhë madhësinë më të mirë dhe ta shkarkojë atë. Madhësia që shfletuesi zgjedh bazohet në rezolucionin e pajisjes.

imazhi i madhësisë në wordpress

Dosja origjinale mbetet e paprekur dhe e ruajtur. Ju mund të përdorni shtojca për të mos kursyer origjinalin për të ruajtur hapësirën e diskut, nëse preferoni.

Zëvendësimi dhe eleminimi i figurave

Keni nevojë për të gjitha imazhet në një faqe në internet? Nëse jo, hiqni ato që janë të panevojshme. Sidoqoftë, nëse të gjitha kanë të bëjnë me përmbajtjen, konsideroni të zëvendësoni imazhet me cilësi më të madhe ose më të ulët me mundësi më të mira.

Në disa raste, shkronjat në internet dhe efektet CSS mund të zënë vendin e imazheve duke siguruar akoma një estetikë të këndshme vizuale në faqe. Me shkronjat në internet, format e këndshme të këndshme mund të ndihmojnë për të përmirësuar përdorshmërinë dhe për të siguruar një pamje më të përsosur në faqet tuaja.

Mund të përmirësojë lexueshmërinë dhe markën tuaj. Vetëm sigurohuni që ju mund të kërkoni me lehtësi, zgjidhni dhe ndryshoni madhësinë e tekstit pa pasur problem të lexueshmërisë.

Efektet CSS përfshijnë elemente, siç janë hijet dhe gradientët. Këto gjithashtu mund të markojnë më tej. Animacionet mund të ofrojnë tërheqje vizuale në faqen tuaj në çdo nivel dhe rezolucion zmadhimi. Në krahasim me skedarët e figurave, këto janë një pjesë e bajtëve.

Raster vs Imazhe vektoriale

rastor vs vektor

Rasteri dhe vektori janë dy nga llojet kryesore të skedarëve të figurave. Programet me bazë pixel, një skaner ose një aparat fotografik përdoren për të krijuar imazhe në raster.

Këto përdoren gjerësisht në internet dhe përdoren më shpesh. Softueri i vektorit përdoret për të krijuar imazhe vektoriale. Këto janë të zakonshme për imazhet që shkojnë në produkte fizike, dhe në inxhinieri, CAD dhe grafika 3D.

Imazhet vektoriale janë të pavarura nga rezolucioni dhe nga zmadhimi. Kur përfshihen forma gjeometrike, vektori është ideal. Kur imazhet janë komplekse dhe kanë mjaft detaje dhe forma të parregullta, preferohen imazhet në raster.

Grafika raster kodon vlerat individuale të secilit pixel brenda një rrjeti drejtkëndëshe për të përfaqësuar një imazh. Grafikat vektoriale paraqesin një imazh duke përdorur pika, linja dhe poligone.

Implikimet me ekran me rezolucion të lartë

Shtë e rëndësishme të bëhet dallimi midis dy llojeve të ndryshme të pikselave, të cilat përfshijnë piksele të pajisjeve dhe piksele CSS. Pixel të shumëfishtë të pajisjes mund të jenë të pranishëm në një pixel të vetëm CSS. Detaji në ekran bëhet më i hollësishëm me më shumë pixel të pajisjes.

css pixel vs pixel pajisjesPër të përfituar plotësisht nga numërimet më të larta të pikselave të pajisjes, aktivet e figurës duhet të kenë më shumë detaje.

Kjo detyrë është ideale për imazhe vektoriale pasi ato mund të japin rezultate të mprehta kur jepet në çdo rezolutë.

Meqenëse imazhet në raster përdorin një bazë për pixel për të koduar të dhënat e figurave, ato janë më sfiduese. Kjo ndërsa madhësitë e skedarëve raster rriten ndërsa pixels rriten.

Pra, ekranet me rezolucion të lartë kanë nevojë për imazhe me rezolucion të lartë për të korrur përfitimet. Imazhet vektoriale janë më e mira për ekranet me rezolucion të lartë pasi ato japin gjithmonë rezultate të mprehta për shkak të pavarësisë së rezolucionit.

Vetëm mos harroni se pavarësisht nga rezolucioni, teknikat e optimizimit të imazhit janë të njëjta.

Optimizimi i Imazheve Vektore

Grafika Vektore e Shkallëzueshme (SVG) mbështetet nga të gjithë shfletuesit modernë.

Kjo është ideale për grafika dy-dimensionale dhe formati është i bazuar në XML-image. Skedarët SVG mund të krijohen me dorë duke përdorur redaktorin e tekstit që preferoni ose me shumicën e llojeve të softuerëve të bazuar në vektorë.

Për të zvogëluar madhësinë e skedarëve SVG, ato duhet të minimizohen. GZIP duhet të përdoret kur kompresoni skedarët SVG.

Optimizimi i Imazheve në Raster

Një rrjet pikselësh përbën një imazh të rasterit. Pixelet individualë janë në një rrjet dy-dimensionale. Për shembull, një sekuencë prej 10,000 pikselësh përbën një imazh prej 100 në 100 piksele. Everydo piksel kodon transparencën dhe informacionin e ngjyrave.

raster i rëndëVlerat RGBA ruhen nga secila pixel. Kjo perfshin:

  • Kanali i kuq
  • Kanali blu
  • Kanali jeshil
  • Kanali alfa (transparencë)

256 hije (vlera) ndahen nga brenda nga shfletuesi. Për kanalin, kjo përkthehet në tetë bit. Për pixel, kjo është katër bajtë. Kjo bën të mundur llogaritjen e madhësisë së skedarit duke përdorur dimensionet e rrjetit. Nuk duhet shumë që madhësia e skedarit të bëhet shumë e madhe.

Pra, për të zvogëluar madhësinë e skedarit të figurës, ekzistojnë disa strategji:

  • Ulja e thellësisë së imazhit. Ju mund ta bëni këtë duke përdorur një paletë me ngjyra më të vogla.
  • Optimizoni të dhënat që pixelet individuale janë duke i ruajtur.

Akordimi i mjeteve dhe parametrave

Nuk ka asnjë mjet të përsosur për imazhe, një sërë parametrash ose format optimizues që do të funksionojnë për çdo imazh. Përmbajtja e figurës dhe kërkesat e saj teknike dhe vizuale do të përcaktojnë se cilat duhet të përdorni.

Pasi të gjeni një set të mirë për vendosjen, mund të përdorni në të ardhmen për imazhe të ngjashme për të kursyer kohë. Sidoqoftë, sigurohuni që kurrë të mos supozoni se të njëjtat cilësime duhet të përdoren për të kompresuar të gjitha imazhet.

Mësoni rreth disa mjeteve të zakonshme mund t’ju ndihmojnë të bëni zgjedhjen e duhur. Këto katër janë ndër më të përdorurat:

  • Gifsicle: Kjo ju lejon të zgjedhni dhe krijoni imazhe të ndryshme GIF.
  • Optipng: Kjo përdoret për të lejuar optimizimin pa humbje të PNG-së.
  • Jpegtran: Kjo ju lejon të optimizoni imazhet JPEG.
  • Pngquant: Kjo përdoret për të lejuar optimizimin e humbur të PNG-së.

Dorëzimi i Aseteve të Shkallëzuara të Shkallëzuara

Ekzistojnë dy kritere kryesore për tu marrë parasysh kur jeni duke bërë optimizimin e imazhit:

  • Optimizimi i numrit të përgjithshëm të pikselave të një imazhi.
  • Optimizimi i sa bajtëve është i nevojshëm për të koduar çdo piksel në një imazh.

pemë e formës së imazhitMadhësia e skedarit tuaj të imazhit zbërthehet në piksele totale shumohen me totalin e bajtëve të nevojshëm për kodimin individual të pikselave. Kjo eshte. Mbajeni këtë në mendje kur jeni duke punuar për të përcaktuar madhësinë optimale për skedarët e figurave në faqen tuaj të internetit.

Për shkak të kësaj, mënyra më e efektshme dhe e lehtë për të optimizuar imazhet është të siguroheni që nuk po transportoni më shumë pixel që ju duhet absolutisht për të treguar aktivin në shfletues në madhësinë e tij të synuar.

Kështu që, mos u mbështetni vetëm në shfletuesin tuaj për të rivendosur imazhe. Kjo mund të bëjë që ata të shfaqen në një rezolucion më të ulët. Ai gjithashtu përdor shumë burime shtesë të CPU-së.

Në përgjithësi nuk është e mundur të garantohet madhësia e saktë e ekranit për secilën pasuri të dorëzuar. Sidoqoftë, është e rëndësishme të siguroheni që i mbani të gjitha pikselet e panevojshme në minimum.

Shtë gjithashtu e domosdoshme që ju të dorëzoni asetet tuaja të mëdha sa më afër madhësisë së tyre të ekranit.

Lista e kontrollit të optimizmit të imazhit

Të gjitha informacionet këtu ju lejojnë të optimizoni imazhet tuaja në mënyrë që faqet e internetit tuaja të jenë më të shpejta. Do të jeni akoma në gjendje të përdorni imazhe të bukura, por ato nuk do të shkaktojnë një ngadalësim të ndjeshëm me kohën e ngarkimit të faqes tuaj.

Kjo do t’i bëjë vizitorët tuaj të lumtur dhe do të përmirësojnë funksionin e përgjithshëm të uebfaqes tuaj. Konsideroni pikat e listës së mëposhtme kur jeni duke optimizuar imazhet tuaja:

  • Konsideroni formatet vektoriale pasi ato punojnë për pajisje me rezolucion të lartë dhe të shumëfishtë sepse janë të pavarur në shkallë dhe rezolucion.
  • Të gjitha pasuritë e SVG duhet të kompresohen dhe minimizohen. Kjo heq metadatat e panevojshme.
  • Për formatet e rasterit, luani me cilësimet optimale të cilësisë. Kjo mund t’ju ​​kursejë një numër të konsiderueshëm bajtësh.
  • Për secilën pasuri, përcaktoni kërkesat tuaja funksionale dhe zgjedhni formatin më të mirë për imazhet e rasterit.
  • Automated sa herë që të keni mundësi për të siguruar një optimizim të qëndrueshëm të imazhit.
  • Shërbeni imazhe të shkallëzuara në mënyrë që madhësia natyrale e imazhit dhe madhësia e ekranit të jenë sa më të ngjashme.

Për ta përmbledhur, ekziston një shkencë dhe një art për të optimizuar imazhin. Algoritmet dhe teknikat që janë shumë të zhvilluara shërbejnë si shkencë.

Mungesa e përgjigjeve përfundimtare në lidhje me kompresimin individual të imazhit është arti. Në fund të fundit, ju duhet të luani përreth dhe të eksperimentoni. Kjo ju lejon të bëni zgjedhjen më të mirë për skedarët tuaj të imazhit dhe mënyrën se si ato kontribuojnë në shpejtësinë e faqes tuaj.

Me rritjen e popullaritetit dhe sofistikimit të krijuesve të faqeve të treta të faqeve si Wix, është e lehtë për dizajnerët të zhvishen, por të qëndrojnë të përqendruar në zhvillimin dhe mirëmbajtjen e proceseve të mira të optimizimit të imazhit, qoftë duke ulur poshtë një shabllon ose duke ndërtuar një sit nga e para.

Referenca dhe kredi për imazh:

  • PicupMedia.com
  • Computing.HomeDNS.org
  • CognitiveSEO.com
  • StackOverflow.com
  • EngineThemes.com
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me

About the author

Adblock
detector