Măreşte viteza de încărcare a blogului

După ce Google a anunţat că viteza de încărcare a paginii reprezintă un criteriu care poate modifica rezultatele în SERPs, toată lumea a început, înnebunită, să facă tot posibilul pentru ca site-ul lor să se încarce tot mai repede.

Din punctul meu de vedere, viteza de încărcare a site-ului este importantă, dar nu atât de importantă pe cât au făcut-o toţi să pară. Dacă site-ul tău se încarcă puţin mai greuţ, asta nu înseamnă că vei fi ultimul în Google pe nu-ştiu-ce cuvânt cheie. Google a spus că viteza de încărcare este un criteriu, nu singurul criteriu şi nici cel mai important. Aşadar, până când faci ca site-ul tău să fie cel mai rapid, mai ai multe altele de rezolvat pentru a putea apărea pe un loc nobil în Google SERPs.

Bineînţeles, trebuie să ne prezentăm cu bloguri al cărui timp de încărcare să fie cât mai mic. Nu neapărat de frica rezultatelor din Google, cât din respect pentru cititorii noştri (care s-ar putea să dispară dacă-i punem să aştepte prea mult până când se încarcă blogul).

Modalităţi cu ajutorul cărora îţi poţi face blogul mai rapid, sunt foarte multe, dar astăzi vreau să mă leg strict de imaginile de pe blog. Am să vă prezint două metode care, folosite împreună, vor face blogul vostru mai rapid.

1. Micşorează imaginile

Cu cât o imagine este mai mare, atât în dimensiune (rezoluţie), cât şi în mărime (size – kilobytes), aceasta se va încărca mai greu. Dacă cel care-ţi vizitează blogul are internet mobil, cu o viteză groaznică, până i se încarcă lui header-ul blogului tău, s-ar putea să-i cadă conexiunea.

Noi trebuie să facem în aşa fel încât imaginile să fie cât mai mici, dar claritatea lor să rămână aceeaşi. Pentru asta, Yahoo a inventat Smush.it, un tool care-ţi permite să urci imaginile acolo şi să le scoţi compresate, gata de pus pe web.

Bineînţeles, nu ştiu cine stă să urce fiecare imagine acolo înainte s-o pună pe blog, dar încearcă să-ţi compresezi imaginile din temă (gen header-ul blogului, iconiţa de la feed-ul RSS, Twitter etc.), pentru a face viaţa mai frumoasă cititorilor tăi.

Later edit: Acum stă cineva să urce fiecare imagine acolo. Am descoperit o metodă care te va face să zâmbeşti de bucurie. Am scris aici despre ea.

2. Cache-uieşte imaginile

De această metodă am aflat de curând, de la Sergiu Tot, autor pe minunatul Lamp.ro.

El ne oferă un cod pe care trebuie să-l adăugăm în fişierul .htaccess şi cu ajutorul căruia modificăm cache-ul browserului (atât al nostru, cât şi al fiecărui vizitator în parte), astfel încât imaginile (că asta ne interesează) şi fişierele cu extensia .txt, .js, sau .css (nu am zis că vorbim despre ele, dar metoda include şi aceste fişiere) vor fi păstrate într-un cache al browserului fiecărui utilizator în funcţie de timpul setat de noi (în cazul codului oferit de Sergiu, o săptămână pentru imagini şi 3 ore pentru texte).

Aşadar, adăugaţi în fişerul .htaccess al blogului vostru, următoarele linii de cod:

<ifmodule mod_headers.c>
    # O saptamana pentru imagini
    <filesmatch ".(jpg|jpeg|png|gif|swf)$">
        Header set Cache-Control "max-age=604800, public"
    </filesmatch>
 
    # 3 ore pentru texte
    <filesmatch ".(txt|js|css)$">
        Header set Cache-Control "max-age=10800"
    </filesmatch>
</ifmodule>

<ifmodule mod_expires.c>
    ExpiresActive On
    ExpiresDefault A0
 
    # O saptamana
    <filesmatch ".(jpg|jpeg|png|gif|swf)$">
        ExpiresDefault A604800
    </filesmatch>
 
    # 3 ore
    <filesmatch ".(txt|js|css)$">
        ExpiresDefault A10800
    </filesmatch>
</ifmodule>

Pentru o explicaţie amănunţită asupra codului de mai sus, vă rog să vizitaţi articolul de pe lamp.ro.

Lasă un comentariu

21 comentarii

  • Sorin 29 Iul 2010, ora 10:36

    informatiile sunt folositoare, intr-adevar, dar sunt mult mai multe modaliati prin care poti face blogul mai rapid…
    astept si continuarea articolului care sa contina si celelalate modalitati.
    Spor:)

    • Florea Cristian 29 Iul 2010, ora 10:37

      m-am gandit sa fac articolul pe mai multe parti, pentru ca nu vreau nici sa aiba un kilometru, dar nici sa scriu modalitatile fara sa intru deloc in detalii

  • Alter Ego Blog 29 Iul 2010, ora 10:40

    Eu folosesc pluginul WP Super Cache si crede-ma ca-si face treaba cu brio… si daca nu ma insel face si browser cache (totusi nu sunt 100% sigur)

    • Florea Cristian 29 Iul 2010, ora 10:50

      Si eu folosesc W3 Cache si-si face treaba cu brio, dar cateva optimizari in plus nu strica.

  • A.Dragos 29 Iul 2010, ora 10:56

    Foarte util Cristi, multumim! :) Va trebui sa imi pun si eu acel cod pentru imagini neaparat.

  • Dan Stefan 29 Iul 2010, ora 11:42

    Nice!

    15 Quick Ways to Shrink Page Load Times

  • articole copii 29 Iul 2010, ora 14:03

    Informatii utile si folositoare tuturor. Orice blog trebuie sa se deschida cu viteza, daca doriti multe vizualizari.

  • laborator 29 Iul 2010, ora 15:14

    Am pus bookmark pe link-uri. Multam de ponturi! :)

  • Serginho 29 Iul 2010, ora 15:34

    E bine de stiut, dar te-ai uitat in footer sa vezi ca ti-au cam disparut imaginile?

    • Florea Cristian 29 Iul 2010, ora 16:29

      mi le-am scos singur :))

      • Serginho 29 Iul 2010, ora 16:37

        No, trist. :))

  • George Jipa 29 Iul 2010, ora 22:12

    As mai adauga:
    1. „Minificarea” (alta traducere nu mi-a venit la ora asta) fisierele js si css
    2. Folosirea un CDN (Content delivery network) de la Amazon (sau orice alta companie care ofera asemenea servicii).. pentru gazduirea fisierelor de tip imagine, js, css. Se poate trimite content gata compresat (gzip) si se face cache (se poate seta si timpul de cache) pe serverele amazon in functie de zona din care este accesat. Totodata se micsoreaza numarul de request-uri dns.. catre acelasi domeniu, fapt ce duce la o incarcare mai rapida pentru ca resursele vor fi accesate de pe un subdomeniu (de exemplu cdn.grimcris.com).
    Este destul de ieftin (defapt.. foarte ieftin!) si rezultatul este surprinzator de bun :)
    3. Folosirea CSS Sprite-urilor. Reduce numarul de request-uri pentru afisarea imaginilor. Mai rapid se incarca o singura imagine (sau doua) cu toate elementele site-ului, decat 20-30 de imagini separate.
    4. Modificarea imaginilor si salvarea lor „for web”. Se reduce destul de bine dimensiunea (uneori cu cateva zeci sau sute Kb) imaginii, dar calitatea ramane aproape aceeasi.

    • George Jipa 29 Iul 2010, ora 22:26

      Am uitat sa specific! In cazul folosirii unui CDN, nu mai este necesar pasul 2.. prezentat de tine :)

    • Florea Cristian 29 Iul 2010, ora 22:27

      despre astea probabil voi vorbi intr-un articol viitor. multe se rezolva cu un plugin bun de cache, dar altele necesita mai mult de-atat.

  • Tudor 29 Iul 2010, ora 23:49

    Multi termeni din cei prezentati mai sus sunt cam tehnici pentru unii – special pentru ei, spun ca cea mai mare greseala pe care o pot face este sa puna pe blog o fotografie exact cum o salveaza de pe cardul aparatului foto.

  • Ndrey 30 Iul 2010, ora 16:38

    daca ai host din romania tot degeaba, la aia oricum se incarca mai greu.

  • Stefan 30 Iul 2010, ora 22:04

    Este foarte normal ca blogurile sa se deschida cu o viteza mare,nu??
    Si cred ca inform,atiile si recomandarilke sunt foarte utile tuturor!Multa bafta!

  • Marius 20 Aug 2013, ora 01:54

    Daca tot le arunci aici… verifica si tu daca functioneaza… eroare 505.

    • Cristian Florea 20 Aug 2013, ora 09:50

      Articolul a fost scris în 2010. Sper că n-ai pretenţia să verific toate link-urile puse pe blog din 2010 până azi.