Vai vēlaties augšupielādēt attēlus savā WordPress vietnē, bet nezināt, kādiem izmēriem vai faila tipiem jābūt šiem attēliem? Vai neesat pazīstams ar tīmeklī paredzēto attēlu izmēru maiņas un saspiešanas procesu? Šajā rakstā es paskaidrošu, kāpēc jūsu vietnei ir svarīgi izmantot pareizu attēla izmēru, kā arī parādīšu, kā mainīt attēlu izmērus un saspiest, izmantojot bezmaksas fotoattēlu redaktoru GIMP.

Kāpēc ir svarīgi mainīt vietnes attēlu izmērus?

Sāksim ar to, kāpēc vietnes attēlu lieluma maiņa ir tik svarīga.

Saskaņā ar WordPress.org, attēla kopējam “fiziskajam izmēram” ir liela nozīme vietnes lapas veiktspējā. “Faila lielums [attēla] nosaka laiku, kas nepieciešams jūsu lapas ielādei; jo lielāks faila izmērs… jo ilgāk [lapas] ielāde būs nepieciešama. Citiem vārdiem sakot, liela izmēra faila augšupielāde savā vietnē palēninās tās lapas veiktspēju, kurai pievienojat saturu, parasti vietnes analītikas datos tas tiek parādīts kā lēnāks lapas ielādes ātrums.

“Faila lielums [attēla] nosaka laiku, kas nepieciešams jūsu lapas ielādei; jo lielāks faila izmērs… jo ilgāk būs nepieciešams [lapas] ielāde.

-WordPress.org

Lapas ielādes ātrums, ko dēvē arī vienkārši par "Lapa Ātrums”, ir “cik ātri tiek ielādēts saturs jūsu lapā”, saskaņā ar SEO vietne Moz. Lēnākas lapas var radīt augstākuatlēcienu līmenis”, kas ir iedomātā metrika, kas atspoguļo sesijas, kurās vietnes apmeklētājs atstāj jūsu vietni pēc vienas lapas apskatīšanas. Lēnākas lapas var arī samazināt laiku, ko apmeklētāji pavada jūsu vietnes lapās, jo cilvēki var kļūt nepacietīgi, gaidot, kad lapas saturs tiks ielādēts, un ātrāk pamest vietni.

Šie rādītāji ir svarīgi, jo jūs parasti vēlaties, lai lietotāji pavadītu vairāk laika jūsu vietnē un skatītu vairāk jūsu vietnes lapu.

Tie ir svarīgi arī tāpēc, ka tiem ir nozīme jūsu vietnes pozīcijās meklētājprogrammu rezultātu lapās jeb SERP. SERPs ir vienkārši rezultātu lapas, kas tiek parādītas, ierakstot vārdu vai frāzi Google tīklā un nospiežot taustiņu Enter. Tā kā lielāki attēli liecina par sliktu tīmekļa dizaina praksi un negatīvi ietekmē lietotāja pieredzi jūsu vietnē, meklētājprogrammas, piemēram, Google, var sodīt jūsu vietnei, lai iegūtu šos lielākos attēlus un ierindojiet savu vietni zemāk par citām vietnēm, kas darbojas labāk.

Piemēram, jo ​​zemāka ir jūsu vietne Google tīklā, jo mazāka ir jūsu vietne un jo lielāka trafika tiks novirzīta jūsu konkurentiem, kuri meklēšanas rezultātos atrodas augstāk par jums.

Samazinot savā tīmekļa vietnē esošo attēlu faila lielumu, varat uzlabot savu Lapa Ātrums un tādējādi uzlabot citus rādītājus, piemēram lielība likme un laiks page, lai galu galā uzlabotu savu klasifikāciju meklētājprogrammās.

Ņemiet vērā, ka ir daudzi citi svarīgi mainīgie, kas tiek iekļauti meklēšanas ranžēšanā, tāpēc attēlu labošana ir tikai daļa no stabilas SEO (Search Engine Optimization) stratēģija. Tomēr tas noteikti ir ļoti svarīgi, lai palīdzētu jūsu vietnei ieņemt augstāku vietu tādās vietās kā Google, lai palīdzētu palielināt vietnes trafiku.

Kā mainīt WordPress attēlu izmērus programmā GIMP

Tātad, kā pareizi mainīt attēlu izmērus WordPress?

Varat samazināt attēla faila lielumu, vienkārši samazinot attēla kopējo izmēru, izmantojot mērogošana un augkopība pirms augšupielādējat to savā vietnē. Turklāt jūs varat izmantot to, ko sauc par "kompresija”, lai vēl vairāk samazinātu tā izmēru.

GIMP, bezmaksas un atvērtā koda fotoattēlu redaktors, var veikt visus šos uzdevumus, vienlaikus eksportējot uz ieteicamajiem “nākamās paaudzes” failu formātiem, lai vēl vairāk samazinātu attēlu faila lielumu un uzlabotu vietnes veiktspēju.

Mērogojiet savu attēlu

Lai sāktu šo procesu, programmā GIMP atveriet attēlu, kuru vēlaties augšupielādēt savā vietnē. To var izdarīt, velkot un nometot attēlu no datora GIMP attēla logā, vai arī varat vienkārši doties uz Fails> Atvērt, atrodoties GIMP.

Ja izmantojat metodi Fails>Atvērt, atveriet attēla atrašanās vietu datorā no parādītā dialoga “Atvērt attēlu” un veiciet dubultklikšķi uz attēla faila, kad tas ir atrasts, lai to atvērtu programmā GIMP (vai noklikšķiniet uz Poga “Atvērt” dialoga loga apakšējā labajā stūrī).

GIMP loga pašā augšdaļā ir funkcija, ko sauc par “Title Bar” (sarkanā bultiņa attēlā iepriekš). Šeit jūs redzēsiet sava attēla pašreizējos izmērus (palielināts zaļš lodziņš fotoattēlā). Mans attēls ir 1920 × 1280 — pirmais cipars 1920 apzīmē mana attēla platumu (pikseļos), bet otrais skaitlis — 1280 — mana attēla augstumu. Galīgie attēla izmēri, ko vēlaties izmantot savam attēlam, būs atkarīgi no tā, kur programmā WordPress plānojat attēlu izmantot, kā arī no izmantotā motīva.

Šajā apmācībā es mainīšu sava attēla izmēru uz standarta 1200 × 630 pikseļu izmēru, kas ir ieteicams emuāra ierakstu attēliem.

Paturot to prātā, pirmā lieta, ko es vēlos darīt, ir apgriezt savu attēlu tā, lai mana sākotnējā attēla malu attiecība atbilstu ieteicamā izmēra malu attiecībai. Lai to izdarītu, es satveru savu apgriešanas rīku, nospiežot taustiņu Shift+c uz tastatūras vai noklikšķinot uz apgriešanas rīka ikonas GIMP rīklodziņā (sarkanā bultiņa attēlā iepriekš).

Pēc tam šī rīka rīka opcijās atzīmēšu izvēles rūtiņu blakus “Fiksēts” (zaļa bultiņa) un noklikšķiniet uz nolaižamās izvēlnes, lai atlasītu “Aspect ratio” (zilā bultiņa).

Es ierakstīšu “1200:630”, lai iestatītu savu malu attiecību teksta laukā zem nolaižamā saraksta (dzeltenā bultiņa). Tas atbilst ieteicamā attēla izmēra malu attiecībai, kuru es vēlos, lai mans galīgais attēls būtu.

Izmantojot apgriešanas rīku, es tagad noklikšķināšu un velku peli pāri attēlam, lai uzzīmētu apgriešanas apgabalu. Atlaižot peli, viss, kas atrodas ārpus apgriešanas apgabala, tiks aptumšots (sarkanā bultiņa attēlā iepriekš — pieņemot, ka rīka opcijās ir atzīmēta opcija “Izcelt”, kas parasti ir pēc noklusējuma).

Pēc noklusējuma manā apgriešanas apgabalā vadotnes ir iestatītas kā “Centra līnijas” (dzeltenā bultiņa attēlā iepriekš). Šo iestatījumu varu mainīt, izmantojot ceļvežu nolaižamo izvēlni Rīka opciju apakšā. Piemēram, es nomainīšu savus ceļvežus uz “Trešdaļas noteikums” (zaļā bultiņa). Dažādās ceļveža opcijas šeit ir balstītas uz fotografēšanas principiem, kas ļauj ērti ierāmēt kompozīciju, izmantojot šos principus.

Varat virzīt peles kursoru virs jebkuras apgriešanas apgabala malas vai stūra (ti, iezīmētā apgabala, kas iepriekš attēlā apzīmēts ar sarkano bultiņu), pēc tam noklikšķiniet un velciet, lai mainītu apgriešanas apgabala robežu. Ņemiet vērā, ka vienmēr varat redzēt apgriešanas laukuma lielumu laukos “Izmērs”, kas atrodas rīka opcijās (augšējā attēlā norādīts zaļā krāsā). Jūs vēlaties, lai kopējais apgriešanas apgabala izmērs būtu lielāks par attēla galīgo izmēru 1200 × 630.

Varat arī noklikšķināt un vilkt peli apgriešanas apgabala vidū (sarkanā bultiņa), lai pārvietotu attēla apgriešanu.

Kad esat gatavs apgriezt attēlu, vienreiz noklikšķiniet apgriešanas apgabalā, un attēls tiks apgriezts.

Ņemiet vērā: ja rīka opcijās nav atzīmēta opcija “Dzēst apgrieztos pikseļus” (zaļā bultiņa attēlā iepriekš), sākotnējā attēla robeža joprojām tiks parādīta ap attēlu, izmantojot dzeltenu punktētu līniju (sarkanu bultiņu). Varat atjaunot sākotnējo attēlu, tādējādi atceļot apgriešanu, dodoties uz Attēls > Fit Canvas to Layers. Tiks eksportēts tikai tas attēla apgabals, kas atrodas audekla robežās.

Mūsu attēls tagad ir apgriezts līdz vēlamajai malu attiecībai, taču, ja vēlreiz apskatīsit mūsu attēla izmērus “titru joslā”, jūs redzēsit, ka attēls ir 1532 × 804 (iepriekš redzamajā fotoattēlā iezīmēts zaļā krāsā un palielināts - jūsu izmēri, iespējams, nedaudz atšķirsies atkarībā no tā, cik lielu attēla apgriešanas laukumu esat uzzīmējis). Tagad mums būs jāmēro mūsu attēls, lai tas atbilstu mūsu vēlamajiem izmēriem.

Lai to izdarītu, dodieties uz Attēls> Mērogot attēlu (sarkanā bultiņa).

Parādītajā lodziņā “Mērogot attēlu” sadaļā “Attēla lielums” pārliecinieties, vai ķēdes saites ikona blakus lodziņam “platums” un “augstums” ir saistīta (sarkanā bultiņa iepriekš redzamajā fotoattēlā). Pēc tam mainiet attēla “platumu” uz 1200 (zaļā bultiņa). Nospiediet tabulēšanas taustiņu. Attēla augstums tiks automātiski atjaunināts uz “630”. Sadaļā “Kvalitāte” pārliecinieties, vai nolaižamajā izvēlnē “Interpolācija” (zilā bultiņa) ir iestatīta vērtība “NoHalo” vai “LoHalo”, lai pēc mērogošanas iegūtu vislabāko attēla kvalitāti. (Lai iegūtu vairāk informācijas par interpolāciju, apskatiet manu pamācību par šo tēmu).

Nospiediet pogu “Mērogs”, lai mērogotu attēlu (dzeltenā bultiņa).

Kad mērogošana ir pabeigta, virsrakstjoslā pārbaudiet attēla izmērus. Tagad jums vajadzētu redzēt attēla izmēru 1200 × 630 — tieši tādu, kādu mēs vēlamies! Tātad, ko mēs tagad darām?

Saspiediet savu attēlu, eksportējot to uz WebP

Attēla apgriešana un mērogošana samazināja faila lielumu, samazinot attēla augstumu no 1920 līdz 1200 pikseļiem un platumu no 1280 līdz 630 pikseļiem, taču attēla izmēru var samazināt vēl vairāk, izmantojot saspiešanu, kad mēs eksportējam attēlu.  

Tātad, tagad mums ir jāeksportē attēls faila formātā, kas attēlam izmantos saspiešanu, ievērojami nesamazinot attēla kvalitāti. Lai gan JPEG vienmēr ir laba iespēja, tagad ir pieejama vēl labāka iespēja: WebP.

WebP formāts izmanto lielāku kompresiju nekā JPEG, vienlaikus ietekmējot attēla kvalitāti mazāk nekā JPEG. Citiem vārdiem sakot, jūs iegūsit labāku attēlu ar mazāku faila izmēru. Turklāt WebP formātus atbalsta visas 5 populārākās tīmekļa pārlūkprogrammas.

Lai eksportētu uz WebP, dodieties uz Fails> Eksportēt kā (sarkanā bultiņa).

Noklikšķiniet uz jebkuras mapes sadaļā Vietas (izcelta zaļā krāsā), lai datorā izvēlētos attēlu, kurā vēlaties saglabāt attēlu. Varat vienkārši veikt dubultklikšķi uz mapes, lai to ievadītu, un redzēt, kurā mapē atrodaties blakus nosaukumam “Saglabāt mapē” (sarkanā bultiņa). Pēc tam pārdēvējiet savu attēlu uz kādu vien vēlaties — vienkārši pārliecinieties, ka attēla nosaukuma beigās ir paplašinājums “.webp” (zilā bultiņa), lai eksportētu attēlu WebP formātā. Kad esat gatavs, noklikšķiniet uz “Eksportēt” loga apakšējā labajā stūrī (dzeltenā bultiņa).

Pēc tam parādīsies dialoglodziņš “Eksportēt attēlu kā WebP”. Pārliecinieties, vai nav atzīmēta izvēles rūtiņa “Bezzaudējumi” (sarkanā bultiņa). Es parasti iestatīju “Attēla kvalitāti” uz 80 (zilā bultiņa — tas ir procents, tāpēc, jo zemāks procents, jo zemāka būs attēla kvalitāte, bet jo mazāks būs attēla faila izmērs). Ja jūsu attēlā nav caurspīdīguma (ti, logotips bez fona), jums nav jāuztraucas par slīdni “Alfa kvalitāte” (faktiski manā veiktajā eksperimentā alfa kvalitāte tika nedaudz pazemināta no 100 uz 90 palielināja faila lielumu attēlam ar caurspīdīgu fonu no 8.50 kb līdz 8.52 kb). Nolaižamajā izvēlnē “Avota veids” varat iestatīt vērtību “Noklusējums”.

Tas, vai vēlaties pārbaudīt vai noņemt atzīmi no metadatu opcijām, tostarp Exif datiem, ITPC datiem un XMP datiem, ir atkarīgs no jums. Exif un XMP dati ir jūsu kameras parasti piešķirtie metadati, kas apraksta informāciju par jūsu fotoattēlu, piemēram, kāds kameras modelis tika izmantots vai kāda veida objektīvs tika izmantots. No otras puses, ITPC izmanto preses pārstāvji un piešķir jūsu attēlam informāciju, piemēram, īpašumtiesības, tiesības un licences. Ja neesat pārliecināts, kā rīkoties, vienkārši atstājiet šīs opcijas atzīmētas.

Tāpat varat atstāt neatzīmētu opciju “Saglabāt krāsu profilu”, jo lielākā daļa pārlūkprogrammu automātiski izmantos sRGB krāsu telpu, lai parādītu attēlu, ko izmanto GIMP. Ja izmantojat citu krāsu profilu, ieteicams atstāt šo atzīmi atzīmētu. Turklāt, ja uztraucaties par to, ka attēls netiek pareizi parādīts noteiktās pārlūkprogrammās, tā atstāšana atzīmēta tikai par dažiem kb kopējam attēla izmēram.

Visbeidzot, opcija “Saglabāt sīktēlu” var palikt neatzīmēta, kas mums vēl vairāk ietaupīs dažus kilobaitus.

Noklikšķiniet uz "Eksportēt" (dzeltenā bultiņa attēlā iepriekš), lai eksportētu attēlu WebP formātā. Salīdzinot eksportēto WebP failu ar tāda paša izmēra JPEG failu, kura kvalitāte ir iestatīta uz “80”, WebP attēla izmērs ir aptuveni 30 kb jeb aptuveni par 25%, kas ir mazāks nekā JPEG.

Tagad varat pieteikties savā WordPress vietnē un pāriet uz lapu vai ziņu, kurā vēlaties augšupielādēt savu attēlu, vai vienkārši pārejiet uz sadaļu "Multivide", izmantojot galveno navigāciju, un velciet un nometiet attēlu multivides bibliotēkā. Manā gadījumā es pāreju uz “Post”, izmantojot galveno navigāciju (sarkanā bultiņa attēlā iepriekš), un noklikšķināšu uz “Emuāra 1. ziņa” (zilā bultiņa), lai rediģētu šo emuāra ziņu.

Pēc tam es atvēršu ziņu iestatījumu sānjoslu (sarkanā bultiņa) un ritināšu uz leju līdz sadaļai “Piedāvātais attēls” un izvēršu šo sadaļu (zilā bultiņa). Pēc tam es noklikšķināšu uz attēla, lai aizstātu to ar savu jauno attēlu.

Es pārešu uz cilni “Augšupielādēt failus” (sarkanā bultiņa) un varu vilkt un nomest attēlu no sava datora uz WordPress (zilās bultiņas).

Visbeidzot, es noklikšķināšu uz “Iestatīt piedāvāto attēlu”, lai lietotu šīs izmaiņas (sarkanā bultiņa).

Noklikšķiniet uz “Atjaunināt” (sarkanā bultiņa), lai atjauninātu savu lapu ar jauno piedāvāto attēlu.

Ja es noklikšķinu uz Skatīt ziņu (zilā bultiņa)…

…tagad mana emuāra augšdaļā redzēsit jauno piedāvāto attēlu.

Tas ir viss šai apmācībai! Ja vēlaties uzzināt vairāk par WordPress vietnes izveidi, iesaku apskatīt manu Kurss WordPress 6.0 nekodētājiem! Vai arī, ja vēlaties uzzināt vairāk par GIMP, skatiet manu GIMP 2.10 meistarklase par Udemy!   

Pin It uz Pinterest