SenDesign este o agenție online care pune accentul pe calitate, inovație și viteză. Utilizăm tehnologia pentru a obține cele mai bune rezultate.
Design-ul este o artă! Design-ul website-ului tău reprezintă perspectiva ta de afaceri. Prima impresie chiar contează!
Oferim servicii de dezvoltare atât în scopuri comerciale dar și în scopuri de uz intern. Dezvoltăm aplicații pentru toate platformele de care ai nevoie.
Este locul unde îți punem la dispoziție cele mai noi publicații SenDesign.
Ultima lansare: WordPress Design pentru Începători.
SenDesign este o agenție online care pune accentul pe calitate, inovație și viteză. Utilizăm tehnologia pentru a obține cele mai bune rezultate.
Design-ul este o artă! Design-ul website-ului tău reprezintă perspectiva ta de afaceri. Prima impresie chiar contează!
Oferim servicii de dezvoltare atât în scopuri comerciale dar și în scopuri de uz intern. Dezvoltăm aplicații pentru toate platformele de care ai nevoie.
Este locul unde îți punem la dispoziție cele mai noi publicații SenDesign.
Ultima lansare: WordPress Design pentru Începători.
Viteza website-ului este primul indice de calitate. Da, website-ul tău este foarte frumos, atractiv și intuitiv, dar dacă nu se încarcă în maxim 5 secunde, nu îl va observa nimeni.
Ca și în cazul articolelor precedente, dacă nu ai citit Web Design de Succes sau Ghidul Afacerii în Mediul Online, îți recomand să citești articolul Optimizarea vitezei website-ului: Introducere, ghid rapid și sfaturi utile
pentru a înțelege ce este este optimizarea vitezei. Îți voi recomanda două abordări: una gratuită și una ce necesită o mică investiție.
Începem cu optimizarea imaginilor care are loc absolut gratuit. Instalează și activează modulul reSmush.it.
Mergi la Media apoi la reSmush.it. În partea dreaptă vei găsi un meniu de setări. Image quality definește cât de tare să fie compresate imaginile. Setează-o pe 80. Este un prag bun ce nu afectează foarte mult calitatea. Bifa Optimize on upload asigură că toate imaginile vor fi optimizate pe măsură ce le încarci. În funcție de viteza de încărcare a serverului este posibil ca încărcarea imaginilor să dureze mai mult. Apasă pe Salvează modificările. Pentru a optimiza imaginile încărcate până la momentul curent, apasă Optimize all pictures.
La dezactivarea modulului, toate imaginile încărcate vor reveni la forma inițială. Nu se pierde nimic.
Am vorbit mult în articole și cărți despre noul format de imagine WebP (web picture). Așadar, al doilea modul pentru optimizarea imaginilor pe care în vom folosii este WebP Express. Acesta creează automat copii ale imaginilor convertite în formatul webp. Dacă browser-ul vizitatorului suportă formatul, va primi imaginea webp. Dacă nu, va primi imaginea jpg.
Modulul are toate configurările necesare gata făcute, trebuie doar activate. Mergi la Setări, WebP Express. Derulează până la secțiunea Conversion method. Aici sunt listate cu o bifă verde, felurile în care serverul pe care se află website-ul tău poate converti imaginile. Dacă nu este nimic bifat, serverul nu va putea face conversia și nu vei putea utiliza modulul. Apasă pe Save settings pentru a-l activa.
Vom instala două module care facilitează optimizarea codului și activează cache-ul. Primul este Autoptimize. Acesta va genera fișierele cache la nivel de serve. Din bara de sus, apasă pe Autoptimize. Alternativ, mergi la Setări, Autoptimize. Activează Optimize JavaScript Code și Aggregate JS-files. Codul JavaScript va fi minificat și concatenat.
Din secțiunea CSS, activează Optimize CSS Code, Aggregate CSS-files și Also aggregate inline CSS. Din secțiunea HTML activează Optimize HTML Code. Codurile CSS și HTML vor fi optimizate.
Apasă butonul Save Changes din partea de jos. De fiecare dată când faci modificări asupra paginilor, produselor, articolelor sau a structurii website-ului, este bine să cureți cache-ul pentru a te asigura că acestea vor fi vizibile. Pune cursorul pe butonul Autoptimize și apasă Delete Cache.
Pentru a activa cache-ul la nivel de browser, vom folosi WP Super Cache. După activare, mergi la Setări, WP Super Cache. Bifează Memorarea în cache pornită și apasă Actualizează starea.
Mergi la tab-ul Avansate și Bifează următoarele:
Mergi mai jos și apasă butonul Actualizează Starea.
Pentru a șterge cache-ul, în bara de sus apasă butonul Șterge cache.
Cele două module de mai sus pot fi echivalate cu unul singur: WP Fastest Cache. În varianta sa gratuită, nu este la fel de eficient. În schimb, varianta premium aduce câteva funcții foarte interesante. Nu le combina cu modulele gratuite, având aceeași funcționalitate vor apărea conflicte. Instalează și activează modulul atât în varianta gratuită cât și premium. Folosind noul buton din meniul lateral WordPress numit WP Fastest Cache, mergi la pagina de opțiuni. Bifează toate opțiunile cu excepția Mobile și Mobile Theme. Apasă Submit.
Explicația acestora este următoarea:
Pentru a șterge cache-ul, pune cursorul pe butonul Delete Cache din partea de sus a panoului de control, și apasă pe Delete Cache and Minified CSS/JS.
WordPress este precum un briceag, vine cu foarte multe unelte de care s-ar putea să nu ai nevoie. Pentru asta avem modulul Perfmatters. Mergi la Setări, Permatters. Din setările General bifează următoarele:
Restul opțiunilor depind de fiecare caz și combinație de module în parte. După activate trebuie retestată funcționalitatea.
Din secțiunea WooCommerce, ce apare doar dacă există modulul prezent, poți activa:
Din secțiunea Lazy Loading, poți activa decalarea afișării Imaginilor bifând Images, Video-urilor bifând iFrames and Videos sau chiar a conținutului bifând DOM, până când utilizatorul derulează în dreptul acestora.
Din secțiunea Fonts poți dezactiva font-urile Google bifând Disable Google Fonts cu totul dacă vrei să folosești un font de sistem precum Arial sau Times New Roman. Dacă nu, activează opțiunea Local Google Fonts ce va servii font-urile direct din serverul tău, fără a mai face o conexiune HTTP către Google.
În secțiunea Analytics poți configura Google Analytics. Enable Local Analytics permite servirea fișierelor direct din serverul tău fără a mai fac o conexiune către Google. În câmpul Tracking ID poți introduce codul de Analytics.
Nu este un pas pe care trebuie să îl faci la început, ci este ceva ce reglezi în timp. Pe măsură ce instalezi și dezinstalezi teme sau module, scrii articole și pagini, se strâng în baza de date intrări reziduale. Acestea trebuie curățate odată la ceva. Atunci când se strâng prea multe, baza de date este încetinită. Rezultatul diferă în funcție de cât de frecvent faci curățarea. Dacă o faci după 2-3 ani, s-ar putea să câștigi câteva secunde. Mare atenție! Întotdeauna fă un backup înainte de a optimiza baza de date.
Pentru optimizare, vom folosi modulul WP-Sweep. Mergi la Unelte, apoi la Sweep. Fiecare categorie are un buton numit Sweep. Poți să le apeși individual, sau să apeși butonul Sweep All din partea de jos.
Ca și până acum, dacă ai întrebări sau nevoie de ajutor, te aștept pe grupul de Facebook Comunitatea SenDesign! Aici se încheie seria de tutoriale. De aici poți aprofunda WordPress prin multă practică. Cartea Web Design de Succes este următorul pas, vei găsi toată teoria de care ai nevoie pentru a fi un web designer de succes.