Hvernig á að hagræða myndum fyrir WordPress, heildarvísir

Hvernig á að hagræða myndum fyrir WordPress, heildarvísir

Fólk á vefnum hefur ekki mikinn tíma til að neyta gagna – vegna þess að það er svo mikið af þeim síðarnefnda. Það eru svo mikið af gögnum að við höfum einfaldlega ekki tíma til að lesa þetta allt! Sem sýningarstjóri fyrir nútíma vefinn er þitt verkefni að hámarka afköst. Því meira sem þú tjáir þig með minni orðum, því betra er þú í starfi þínu.


Af hverju eru myndir (svo mjög) mikilvægar?

Það eru margar, margar ástæður fyrir því að þú myndir (og ættir) að nota myndir í færslum og greinum:

  • Myndir þjóna sem sjónræn áreiti til aðgerða (CTA). CTA getur verið hvert verkefni sem þú vilt að gesturinn þinn framkvæma. Algengt CTA er meðal annars að gerast áskrifandi að fréttabréfinu þínu, deila greininni þinni á samfélagsmiðlum eða kaupa vöruna þína.
  • Myndir efla tengslin sem rithöfundurinn leitast við að koma á við lesandann.
  • Myndir flytja meira í gegnum minna.

Það er því mjög mikilvægt að við notum réttu myndirnar í kynningum okkar (bloggfærsla, óformleg skýrsla, raunveruleg PowerPoint kynning osfrv.) Til að skilja eftir merki í lesandanum.!

En bíddu! Það er vandamál!

Myndir taka u.þ.b. 63% af bandbreiddinni sem notaðar eru af nútíma vefsíðum, svo það verður sífellt mikilvægara að þær séu réttar búnaðar.

Seinkun á sekúndu á hleðslutímum síðna gæti dregið úr viðskiptahlutfallinu um 7%

Við höfum komist að því að fólk er með stuttan athyglisvið (einn af ókostum nútíma framleiðsluhraðans). Jafnvel ef þú notar réttu myndirnar, ef þær hlaðast ekki innan viðunandi tímaramma, tapast áhuginn.

10 Algengustu villur í myndavæðingu

Meirihluti vefsvæða á í vandræðum – þeir nota framúrskarandi myndir, en hvernig myndin er borin fram fyrir gestinn er léleg. Stór stærð, léleg hagræðing, rangt snið, óþarflega stórar stærðir (stærðir), ósvarandi myndir og kærulausar SEO villur eru nokkur algengustu vandamálin sem nútíma vefurinn stendur frammi fyrir. Í greininni í dag ætlum við að taka á þessum málum!

1. Stórar víddir

„Extra Fries“ eru ekki alltaf góðar

Þessi er klassík. Segjum sem svo að þú þarft 150 × 150 pixla mynd á „Team“ síðu síðunnar. Venjulega munt þú nota 5MP höfuðmynd, breyta því aðeins og að lokum hlaða því upp.

Komstu auga á vandamálið? Sumir hlaða beint 5MP myndinni beint inn! WordPress þemað mun hlaða alla 5MP myndina (það eru 5 x 10 ^ 6 pixlar) og biðja vafrann um að minnka hana í nauðsynlega vídd 150x150px. Í raun sýnir vafrinn aðeins 0,0045% af upprunalegu myndinni!

Þú endar með því að sóa bæði bandbreidd og gestum þínum (jafnvel þó að þú sért að þjóna myndinni í gegnum Content Delivery Network eins og Stackpath CDN), eyðir meira pláss á harða disknum og eykur hleðslutímann. Enginn af þeim eiginleikum er eitthvað sem þú vilt á síðuna þína.

Alltaf að breyta stærðinni (og með stærðinni þá meina ég stærðina) í viðeigandi stærð og hlaða henni síðan upp!

ImageResize.org

Þú þarft ekki fínan hugbúnað til að gera þetta – það eru ókeypis tól á netinu eins og ImageResize.org þú getur notað til að breyta stærð og fínstilla myndirnar þínar fljótt. Hladdu bara upp og stilltu ljósmyndastillingar þínar Þegar þú ert búinn að hlaða niður fínstilltu myndinni til að nota á síðuna þína. Þau bjóða einnig upp á fljótlegan Myndþjöppu ef þú vilt bara skera niður skráarstærð.

Gagnleg verkfæri:

  • IrfanView er frábært ókeypis til að hópur-breyta stærð myndanna þinna með háþróuðum valkostum eins og fínstillingu, vatnsmerki og landamærum.
  • ImageMagick er háþróaður opinn hugbúnaður sem hægt er að nota á ýmsum forritunarmálum og stýrikerfum. Þú getur skrifað þitt eigið app eða einfaldlega notað það í gegnum skipanalínuna.
  • ImageOptim (Mac) gerir þér kleift að draga heilar möppur og fínstilla margar myndir fljótt.
  • TinyPNG er mynddreifingartæki á netinu með API.

2. Rangt myndasnið

shutterstock_108312266

Sniðið sem notað er fyrir myndina gegnir mikilvægu hlutverki. Notaðu venjulega þumalputtaregluna PNG fyrir vektorgrafík og tölvugerðar myndir eins og klippimyndir o.fl. Notkun JPEG fyrir ljósmyndir eða myndir með ýmsum litum. Skoðaðu þetta til að fá nákvæmar skýringar æðislegt svar frá StackOverflow.

3. Notar ekki Progressive JPEG

Grunnlína (Venjuleg) JPG á móti Progressive JPG

Grunnlína (Venjuleg) JPG á móti Progressive JPG

Hjá algengum manni eru JPEG af tvennu tagi – grunnlína og framsækin. Sjónrænt eru báðir eins. Munurinn liggur í því hvernig þeir eru hlaðnir:

  • Grunnlínun JPEG hefur aðeins eitt lag – sem inniheldur alla myndina. Þegar þess er óskað er öll myndin hlaðin í einu.
  • Framsækin JPEG semja myndina með mörgum lögum. Framsækin JPEG-mynd er hlaðin lag fyrir lag, sem eykst smám saman í gæðum og gefur þér að lokum taplausa sýn.
IrfanView styður hópbreytingu með framsækinni JPEG

IrfanView styður hópbreytingu með framsækinni JPEG

Allar helstu myndstærðir gera þér kleift að vista myndir sem Progressive JPEG.

4. Ekki nota lata hleðslu

Latur-hleðsla er frábært sparnað auðlinda tækni þar sem mynd er aðeins hlaðin þegar gesturinn skrunar niður að myndarammi. Hugleiddu grein – „15 af sparneytnustu bílunum árið 2014“. Auðvitað mun þessi grein innihalda að minnsta kosti 15 myndir. Sama hæð skjátækisins – skjár, spjaldtölva eða snjallsími, þú getur ekki passað allar 15 myndirnar í myndarammanum. Þú verður að fletta niður til að skoða allar myndirnar.

Þegar latur hleðsla er virkur verða myndir hlaðnar aðeins þegar gestur er í nágrenni myndarinnar. Með öðrum orðum, myndirnar byrja að hlaða rétt þegar þú flettir niður til að skoða þær. Fyrstu myndirnar eru hins vegar hlaðnar samstundis þar sem þú ert þegar kominn í myndarammann. Latur hleðsla sparar bandbreidd í báðum endum og bætir hleðslutíma! Þú getur notað Lazy Loading í WordPress með BJ Lazy Load Plugin.

5. Notar ekki CDN

CD-net

Með því að nota Content Delivery Network (CDN) þjónar myndin frá netþjóni sem er líkamlega næst staðsetningu gesta. Ef gestur frá Indlandi óskar eftir mynd og CDN er með POP (viðverustað, eða einfaldlega netþjónn) í Tókýó og New York, verður myndin borin fram af netþjóninum sem staðsett er í Tókýó.

Þegar þú ert með talsverða umferð ættirðu að setja upp CDN með WordPress til að lækka hleðslutímann og fá frammistöðu í heild. Hér á WPExplorer, mælum við með Skýjakljúfur. Fyrir nýbakaðar síður mælum við með lista yfir ókeypis CDN þjónustu sem þú gætir prófað.

6. Ekki lýsa yfir eiginleikanum „alt“

Eiginleikinn ‘alt’ lýsir myndinni fyrir leitarvélarnar. Textinn sem þú slærð inn í þennan reit verður sýndur notanda ef ekki er hægt að hlaða myndina. A einhver fjöldi af fólk hafa tilhneigingu til að láta þessa reiti vera autt. Þetta er mjög skaðlegt fyrir SEO og þú tapar umferðinni. Þú ættir alltaf að reyna að láta leitarorð vefsvæðisins fylgja með alt tag myndanna þinna.

7. Ekki fínstilla myndir

blýant-krít-stig

Bjartsýni myndir eru 40% léttari en venjulegar myndir. Þetta bætir álagstíma og sparar bandbreidd. Við viljum mæla með frá lista Freddy yfir bestu WordPress myndauppbótina WPSmush.it til að hámarka myndirnar þínar. Kraken.io er líka frábær valkostur á netinu til að þjappa myndum saman í djóki. Við notum það allan tímann hér á WPExplorer til að hámarka lögun mynda áður en þú hleður þeim inn í færslur og þema kynningu.

8. Móttækilegar myndir

Móttækileg vefhönnun er hér

Móttækileg vefhönnun er hér

Jafnvel þó að vefsíðan þín sé móttækileg þýðir það ekki að myndirnar þínar séu það. Það þýðir að hausamyndin sem þú notar fyrir 22 ”skjáborðsskjá er einnig þjónað 5“ iPhone. Þegar þú hleður upp mynd breytir WordPress henni í margar útgáfur – Smámynd, miðlungs, full stærð, osfrv. Þetta getur verktakinn breytt. Vel kóðuð þema mun þjóna „meðalstóri“ útgáfu myndarinnar og spara þannig bandbreidd.

The Picturefill.WP viðbót mun skipta um myndamerki fyrir nýjan þáttur sem myndi þjóna mismunandi myndum byggðar á fyrirspurnum fjölmiðla. Það er nokkuð tilraunakennt (það þýðir að það eru villur) og ætti ekki að nota það á vefsíðu.

9. Myndatexta

Yfirskrift er ekki alltaf nauðsynleg, þó að í sumum tilvikum sé það krafist – svo sem skjámyndir í einkatími. Myndatexta hjálpar lesendum að skilja efnið betur en efla SEO þinn.

10. Myndnafn

Hugsaðu um skráarnafnið frá sjónarhóli leitarvélarinnar. Notaðu sama texta og þú myndir gera í ‘titlinum’ myndarinnar. Prófaðu einnig að taka með leitarorðunum þínum sem eru mest viðeigandi fyrir síðuna þína.

Niðurstaða

hetja-11

Image SEO er mjög mikilvægt fyrir allar vefsíður – gamlar sem nýjar. Fólk sem innleiðir SEO ímynd almennilega (það getur verið nokkuð hversdagslegt stundum), vertu að fá umtalsvert magn af lífrænum umferð (besta tegund af umferð) í langhlaup.

Ertu með frábæra hagræðingaraðferð? Skjóttu!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map