Imaginile WordPress sunt neclare - asta explică de ce

Ce Film Să Vezi?
 
  Imaginile WordPress sunt neclare - asta explică de ce

Imaginile ar trebui să vă înfrumusețeze site-ul. Imaginile neclare fac invers.





Când imaginile dvs. WordPress sunt neclare, trebuie găsită o soluție rapidă. Până când se va întâmpla, utilizatorii tăi vor dispărea în mulțime.

Numeroase cazuri pot duce la neclaritatea imaginii, dar rareori are legătură doar cu setările implicite din WordPress.



Adesea, aceasta se datorează faptului că dimensiunea originală a imaginii era mai mică decât ar trebui să fie.

Pe orice sistem de management al conținutului online, dimensiunile imaginilor sunt modificate pentru a se potrivi cu dimensiunea ecranului utilizatorului.



Problema calității imaginii apare mai mult pe desktop decât pe mobil.

Motivul este că dimensiunile mai mari ale ecranului din vizualizarea desktop permit ca cele mai mici imagini să fie aruncate în aer la dimensiunea completă a ecranului.



Când observați că imaginile sunt neclare, treceți la vizualizarea mobilă și probabil veți vedea că nu este la fel de neclară. Este dezavantajul designului web responsive.

Imaginile WordPress sunt neclare

Două cauze comune ale imaginilor de calitate slabă pe WP sunt încărcarea fișierelor media care nu au fost editate pentru calitate sau încărcarea unei dimensiuni diferite față de ceea ce poate afișa tema. Fără editarea imaginii, cea mai mică discrepanță este amplificată atunci când imaginea este întinsă pentru a se potrivi pe ecrane mai mari.

Găsiți dimensiunile implicite ale temei dvs

Fiecare temă WordPress are reguli de dimensionare implicite codificate în fișierul functions.php.

Accesați editorul de teme, deschideți fișierul functions.php și căutați codul pentru dimensiunile personalizate ale imaginii.

Codul de căutat este „adăugați dimensiunea imaginii”.

Va arata asa

if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'gridme-1222w-autoh-image', 1222, 9999, false );
add_image_size( 'gridme-922w-autoh-image', 922, 9999, false );
add_image_size( 'gridme-480w-360h-image', 480, 360, true );
}

În exemplul de cod de mai sus, arată trei dimensiuni de imagine, dintre care două sunt setate la false, iar cea finală este „480, 360, adevărat”.

Dacă dimensiunile imaginii sunt setate ca „false”, înseamnă că acele dimensiuni nu vor fi aplicate. Setarea dimensiunilor imaginii la „adevărat” va aplica regulile de redimensionare.

Când regulile de dimensiune sunt setate să se întindă fie în înălțime, fie în lățime, rezultatul este neclaritatea.

comutator ultra soare si luna

Dacă tema dvs. mărește automat dimensiunea imaginii, schimbați „adevărat” cu „fals” în fișierul funcțiilor.php pentru teme pentru a dezactiva acea acțiune.

mama a spus să te elimini deadpool

Marea majoritate a temelor WP nu mai fac acest lucru din cauza designului web receptiv.

În era de dinainte de 2012, înainte ca designul web mobil să devină oarecum mainstream, aceste reguli de dimensiune automată au devenit învechite în comunitatea dezvoltatorilor WP.

Totuși, pe teme mai vechi, este posibil ca codul temei să fie depășit pentru standardele actuale de dezvoltare web. Când acesta este cazul, setați regulile de dimensiune automată la „false”.

Cel mai bun sfat

Evitați imaginile neclare încărcând dimensiunea exactă. Dacă acest lucru nu este posibil, încărcați cel mai mare fișier imagine și lăsați WordPress să-l micșoreze.

Încețoșarea are loc atunci când imaginile încărcate sunt mai mici decât dimensiunea pe care sunt afișate. Este mai bine să micșorați o imagine decât să o măriți.

Când măriți un fișier imagine mic, atunci imaginile devin neclare pe WordPress. Face pixelarea la scară mică, mai mare. Astfel, mai evident.

Imaginile WordPress sunt acum neclare după schimbarea temei

Toate temele WordPress sunt codificate diferit. Fiecare are diferite puncte de întrerupere pentru imagini. Ceea ce setați în setările galeriei de imagini nu se reflectă întotdeauna într-un fișier WordPress functions.php.

Ca o notă secundară: un punct de întrerupere este o dimensiune a imaginii care depășește lățimea sau înălțimea maximă care poate fi afișată pe ecranul unui utilizator.

Când schimbați teme, dimensiunile maxime ale imaginii se vor schimba (de obicei).

De exemplu, pe tema blogului proprietarului, dimensiunea maximă pentru imaginile de dimensiune completă este de 1210 px pe 642 px. Pe tema WordPress Twenty-Twenty One, imaginile vor fi afișate ca dimensiunea în care sunt încărcate, cu excepția cazului în care setați reguli de dimensiune folosind HTML.

Valoarea implicită pentru „post-miniaturi” este totuși uriașă. Acestea sunt setate la 1568, 9999... cu alte cuvinte, la fel de mari ca imaginea pe care o încărcați.

Acest lucru este intenționat, deoarece tema Twenty-Twenty-One este o temă WordPress minimalistă.

Miniatura arată ca și cum ar fi antetul postării blogului, urmată de conținutul corpului folosind un aspect cu o singură coloană fără bară laterală de navigare.

Imaginile inserate în postări vor fi afișate fie ca dimensiunile pe care le încărcați, fie redimensionate folosind setările implicite WordPress, care sunt setate în biblioteca dvs. media.

Un truc frumos WP pentru a anula valorile implicite ale atașamentelor de imagine

WordPress are o pagină ascunsă care nu este afișată în bara laterală de administrator. Se găsește accesând site-ul tău.com/wp-admin/options.php.

erwan heussaff anne curtis logodit

Trebuie să fii autentificat ca administrator de site pentru a accesa pagina. Odată ce pagina se încarcă, apare un mesaj care vă spune

„Avertisment: această pagină permite accesul direct la setările site-ului dvs. Puteți sparge lucruri aici. Vă rugăm să fiți atenți!”

Este corect. Ia aminte. Singura setare care trebuie schimbată aici pentru imagini sunt setările de mai jos:

Schimbarea dimensiunii implicite a imaginii la „dimensiune completă” va face ca fiecare imagine pe care o încărcați în biblioteca dvs. media să apară în postările dvs. ca dimensiune completă.

Alte opțiuni vor fi disponibile, dar nu va trebui să le setați manual pentru fiecare imagine pe care o introduceți în postări sau pagini. Fără imagini care se micșorează sau se întinde pentru a se potrivi pe ecrane!

Eroare de fotografie

Este posibil ca imaginile să fie neclare înainte de a fi încărcate pe WordPress.

De obicei, este mai bine să încărcați o fotografie originală de pe un smartphone într-un editor online sau pe un desktop, să curățați fișierul imagine, apoi să îl încărcați pe WordPress.

Problema cu camerele smartphone-urilor este că imaginile arată decent pe ecranele mici, dar puse pe WordPress și afișate la dimensiune completă pe un ecran mai mare, imperfecțiunile devin evidente.

Pentru toți bloggerii de mâncare, vitezele mici ale obturatorului provoacă neclaritatea mișcării și asta duce la imagini neclare. Măriți viteza obturatorului și editați fotografiile înainte de a le încărca pe WordPress.

CMS-ul WordPress este doar pentru afișarea imaginilor. Există plugin-uri disponibile pentru a adăuga funcționalitate de editare a imaginilor.

Dacă mergeți în acea groapă, fiți conștienți de problemele legate de viteza site-ului. Îți pot încetini site-ul.

Pe tema pluginurilor WordPress pentru imagini, singurul esențial este un plugin de compresie a imaginii. Indiferent de dimensiunea fișierului dvs., compresia imaginii economisește lățime de bandă.

Apoi, din nou, dacă vindeți sau oferiți imprimabile de pe un site WordPress, compresia va scădea calitatea imaginii.

Care este dimensiunea potrivită a imaginii pentru a încărca în WordPress pentru a evita neclaritatea?

Mărimea imaginii depinde de lățimea conținutului paginilor și postărilor dvs.

unchiul a desenat cu Kevin Love

Pentru a afla ce folosește tema dvs. WP, utilizați instrumentul de inspecție al browserului. Majoritatea funcționează în mod similar – faceți clic dreapta, apoi selectați inspectați.

Căutați partea de cod etichetată ca „conținutul corpului principal” sau ceva similar. Făcând clic pe secțiunile din inspector, elementul de pe pagină este evidențiat.

Pe pagina dvs. web, în ​​modul de inspectare, partea de sus a paginii va afișa două numere. Primul este lățimea, al doilea este înălțimea. Nu acordați atenție înălțimii, deoarece aceasta va fi masivă. De aceea trebuie să derulați în jos pe o pagină web.

Lățimea ta este limitată. Pe această temă, lățimea paginii este de 990 px. Rețineți că aceasta este pentru zona de conținut, excluzând bara laterală.

Dacă aveți pagini personalizate fără bare laterale, zona de conținut va fi mai largă.

Când știți lățimea maximă a celei mai largi pagini pe care o are tema dvs., utilizați acea lățime ca dimensiune maximă a imaginii înainte de a o încărca.

Cum să redimensionați imaginile pentru a se potrivi cu tema dvs

Pe sistemele Windows, puteți utiliza aplicația pentru fotografii sau Paint. Pe sistemele Mac, puteți redimensiona fotografii folosind Previzualizare sau Fotografii. Utilizatorii de Chromebook pot redimensiona imaginile cu Google Foto.

Dacă sunteți limitat la un smartphone, instrumentele online de editare a imaginilor sunt harul vostru salvator. Câteva opțiuni populare sunt pic maimuță, redimensionarea imaginii și, desigur, Canva.

Canva este alegerea mai bună, deoarece puteți crea un cont gratuit, puteți face o imagine cu dimensiune personalizată, setările vor fi salvate în contul dvs., apoi puteți încărca conținutul media în cloud, îl puteți plasa într-o imagine cu dimensiune personalizată și îl puteți trage. pentru a redimensiona astfel încât să se potrivească perfect.

Descărcați jpg sau png, apoi încărcați-l pe WordPress.

Dacă imaginea este neclară într-un editor de imagini de pe desktop sau într-un editor online, va fi neclară pe WordPress. Remediați neclaritatea editând imaginea înainte de încărcare.

Odată ce o imagine neclară este pe serverul dvs., este inutilă.

Ștergeți imaginea neclară, editați originalul pentru a crește claritatea, redimensionați la lățimea maximă pe care o poate afișa tema sau lățimea maximă la care fotografia dvs. va crește fără a degrada calitatea.

Încărcați imaginea editată și neclaritatea va dispărea.