Cum marim viteza de incarcare a siteului

Nimanui nu ii place sa astepte dupa ceva, acest lucru este valabil si in cazul siteurilor web unde un vizitator nu sta in medie mai mult de 5 secunde pentru a vizita o pagina web.

De asemenea si Google claseaza siteurile si dupa viteza incarcare a acestora, astfel paginile web care se incarca mai repede vor fi afisate mai sus in cautari decat cele care se incarca mai greu.

Optimizarea pagini web poate aduce benefici atat pentru vizitatori cat si pentru webmasteri astfel siteurile nu vor mai consuma atat de mult trafic si vizitatori vor avea o navigare mai placuta pe siteul dvs.

Sa vedem practic ce putem face pentru a mari viteza de incarcare a siteului, aceasta este influentata de mai multi factori:

- Gazduirea web
- Multitudinea de cereri http
- Complexitatea paginii
- Designul paginii
- Marimiea fisierelor descarcate

In cele ce urmeaza va vom prezenta cateva metode de marire a vitezei de incarcare a pagini:

Deseori folosirea programelor gen WebSiteMaker, CoffeCup sau a oricarui generator de coduri html nu este recomandata precum si
exportul din Phtotoshop cu slides, deoarece contine foarte mult cod si foloseste tabele in loc de div-uri.
Fundalul pagini web de multe ori este de multe ori mai mare decat e necesar si prea complex.
Folositi unde e posibil doar o culoare sau o imagine mica care se repeta.
Folositi fisiere css/js externe pentru ca fisierele externe sunt salvate in cacheul browserului.
Folositi “font-weight:700;” in locul “font-weight:bold;”, incercati sa definiti padding-ul/margin-ul/border-ul
dintr-un singur rand (ex in loc de “padding-top:5px; padding-left:10px; padding-bottom:15px; padding-right:50px;” padding:5px 10px 15px 50px;).
Culorile care au codul hex format din 3 caractere care se repeta se pot scrie in forma lor scurta:

#000 = #000000
#fff = #ffffff
#f0f = #f0ff0f

Exemplele de culori pot continua.
Scoateti toate chestiile inutile de pe pagina cum ar fi topuri gen utils.ro/popup, popunder, cursoare si altele.
Marimea recomandata a unei pagini web este de maxim 100kb.
Fisierele CSS se includ in sectiunea HEAD si cele javascript, care permit se includ inainte de sfarsitul tagului BODY.

Folositi CSS sprits, folosirea unei singure imagine cu “background-position” pentru div-uri/clase diferite,
mai jos aveti codul css si imaginea:


#Logo{
background-position:2px -35px;
width:225px;
height:49px;
}

#sbutton2{
background:url('images/sliders_buttons.gif');
width:131px;
height:35px;
background-position:-131px 0;
}
#sbutton3 {
background:url('images/sliders_buttons.gif');
width:131px;
height:35px;
background-position:-262px 0;
}


Folositi Add-on-ul pentru firefox Page Speed.
In cazul in care folositi tag-ul IMG precizati inaltimea si latimea imaginilor pentru ca browserul sa poata “desena” layoutul paginii inainte sa aibe toate imaginile descarcate si sa nu fie nevoit sa modifice pagina incarcata.

Folositi siteul GTmetrix pentru a optimiza siteul.
Un articol pentru vorbitori de limba engleza gasiti aici cu mai multe sfaturi despre cum se face o incarcare rapida a pagini web.