Butoane Facebook pe blog sau website WordPress

Butoane Facebook: Like si Share pentru Blogul tau

Exista o multitudine de module WordPress pentru a adauga butoane facebook pe blogul tau. De multe ori, folosirea acestor module este varianta cea mai usoara, la indemana oricui, chiar si fara inclinatii tehnice, fara cunostinte temeinice de php sau WordPress.

Exista insa si cazuri in care doar pentru aceasta functie suplimentara, nu doresti sa adaugi un modul in plus, pur si simplu nu doresti sa ingreunezi incarcarea website-ului tau sau sa adaugi la vulnerabilitatile care vin la pachet cu un site ce are mai multe module decat are neaparata nevoie.

Adaugarea de butoane Like si Share pe Facebook este un lucru relativ usor, ce poate fi facut in cativa pasi:

Pasi de urmat

Accesam pagina de mai jos pentru a obtine codul pentru butoanele Like si Share

Butoane Like Facebook pe Blog

In campul „URL to Like”, introducem temporar, adresa blogului nostru. Putem folosi diversele optiuni pentru a personaliza aceste butoane.

Apasam butonul „Get Code”, iar in fereastra aparuta, alegem tab-ul „IFrame” pentru a integra aceste butoane intr-un mod mai usor

Selectam codul general, si il copiem in clipboard.

Butoane Like si Share Facebook

Acum ca avem codul, acesta arata in felul urmator:


<iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.manifest.ro&width=450&layout=standard&action=like&size=small&show_faces=true&share=true&height=80&appId" width="450" height="80" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>

Inlocuim in codul de mai sus, bucata care contine adresa site-ului nostru, cu urmatorul cod php:


<?php the_permalink(); ?>

Acest cod va face ca in fiecare loc in care folosim acest iframe cu codurile Like si Share, sa apara adresa corecta, a paginii sau articolului pe care dorim sa il promovam pe reteaua Facebook.

Acum, tot ce ramane de facut, este sa introducem acest cod, acolo unde dorim sa apara butoanele.

Fiecare tip de pagina, are un template corespunzator, accesibil din interfata WordPress, din back-end, meniul Aspect -> Editor teme

Pentru o pagina statica, alegem din tema curenta, fisierul page.php. Pentru un articol postat pe blog, alegem single.php. Pentru o pagina index, continand o colectie de articole, editam index.php sau archive.php

Atentie – codul de mai sus, fiind html, trebuie sa ne asiguram ca este introdus in fisierul php, intr-un mod corect.

Daca ne aflam intr-un bloc de cod php, prefixam codul nostru cu ?> urmand ca imediat dupa codul nostru, sa redeschidem blocul php, prin folosirea <?php . Daca inseram codul intr-o sectiune de cod html, nu trebuie sa modificam codul, il inseram exact cum este.

Pentru paginile cu o colectie de postari (index.php sau archive.php), pentru a avea aceste butoane sub fiecare postare, cautam bucla while care parcurge lista de postari, si plasam codul nostru inainte de inchiderea buclei, prin cuvantul cheie endwhile;.

Daca ti-a fost de folos acest material, asteptam comentariile tale mai jos! De asemenea, nu strica un Like sau Share ­čÖé

Pentru comenzi de site-uri web, contracte de suport si mentenanta, sau orice proiect de web development, te asteptam sa ne contactezi.

Cum sa cresti traficul pe site-ul tau – 10 sfaturi practice

Prezentam in continuare 10 sfaturi practice care te vor ajuta sa cresti prezenta online a site-ului tau web, sfaturi practice care daca vor fi urmate cu consecventa, vor aduce intr-un timp mai scurt sau mai lung un trafic organic mai sanatos, o clasare superioara in cautari dar si o conversie imbunatatita. Prin conversie sau rata de conversie, intelegem numarul mediu de evenimente utile care au loc in urma a 100 de vizite pe site-ul web. Aceste evenimente utile pot fi in functie de specificul site-ului: plasarea unei comenzi, trimiterea unui mesaj, inscrierea intr-o lista de newsletter, completarea unui formular, etc.

Ordinea in care am expus aceste sfaturi practice este aleatorie, toate sunt importante si merita luate in calcul daca doresti sa ai un site web „sanatos”.

10 Sfaturi practice

1. Website responsive.

In ziua de astazi, a avea un website responsive nu mai este un plus, este o necesitate. Conform ultimelor statistici, majoritatea vizitelor pe un site web vin de pe device-uri mobile. A ignora acest public si a prezenta acestuia un site invechit, cu un layout gandit pentru ecranul monitorului, fortand utilizatorul la un zoom-in/zoom-out continuu, este o foarte mare greseala. In plus, conform unui anunt al gigantului Google, site-urile web care nu au o varianta optimizata pentru device-uri mobile sunt declasate in ierarhia rezultatelor cautarilor organice efectuate pe astfel de device-uri.

2. Siguranta.

Daca nu ai achizitionat pana acum un certificat SSL pentru site-ul tau web, nu mai pierde niciun minut. Este o investitie relativ mica ce te scuteste de nenumarate neplaceri. Mai multe informatii despre necesitatea securizarii website-ului am scris in aceasta postare.

3. Rapiditate in raspunsuri.

Un client potential care acceseaza site-ul tau web si trimite o intrebare sau o cerere de oferta folosind formularul tau de contact, nu va sta foarte mult in asteptarea raspunsului. Cu atat mai mult daca el a trimis intrebari similare catre inca cateva site-uri web concurente. A castiga clientul devine astfel o cursa contra cronometru. Aloca zilnic timp pentru acest aspect, raspunde solicitarilor cat de repede este posibil, ideal in mai putin de o ora de la primirea mesajului. Daca ai posibilitatea, instaleaza pe site-ul tau web si un tool pentru live chat, pentru a intra in legatura cu clientul si a raspunde eventualelor intrebari pe care le poate avea chiar in momentul cand se afla pe siteul tau. Exista foarte multe astfel de unelte disponibile, unele contra cost dar exista si variante gratuite.

4. Optimizeaza continutul site-ului web

Ai fi surprins sa vezi ce diferente semnificative pot exista intre versiuni similare ale aceluiasi titlu sau ale aceleiasi descrieri. Felul in care formulezi CTA-ul (Call To Action – denumeste indemnul de pe site catre o actiune, fie ca este vorba de cumparare, download, inscriere sau vizitarea unei sectiuni), felul in care asezi elementele pe pagina sau culorile pe care le utilizezi, toate pot influenta rata de conversie. Exista unelte foarte specializate pentru a masura eficienta diferitelor variante. Aceste experimente, denumite A/B Testing, sunt setate in asa fel incat traficul sa fie impartit in mod egal intre variante. Testul se ruleaza un numar de zile sau saptamani iar la final, se retine si se implementeaza ca varianta definitiva evident cea cu rezultate superioare. Un exemplu de astfel de unealta folosita cu succes de Manifest Media in proiectele noastre, este Visual Website Optimizer. Exista si variante gratuite, precum Google Content Experiments sau de ce nu, implementarea si monitorizarea rezultatelor prin cod propriu, varianta de asemenea utilizata de noi in cazul unor proiecte.

5. Integrarea cu diferite platforme de Social Media

Asta ar trebui sa fie deja un no-brainer, toata lumea stie cat de importanta este prezenta companiei pe Facebook si alte platforme similare. Fiti consecventi, postati regulat pe toate aceste platforme, si creati linkuri in toate directiile – de pe site catre aceste platforme dar si din postari catre website. Incercati sa atrageti publicul vostru sa interactioneze prin comentarii si aprecieri. Toate vor ajuta in timp sa creasca traficul pe site-ul vostru web.

6. Viteza de incarcare a paginii web

Viteza de incarcare a site-ului web a devenit un factor foarte important in ultima vreme, fapt confirmat si de importanta acordata de Google acestui aspect in algoritmul de ierarhizare a paginilor intr-o cautare organica. Mai multe sfaturi despre cum poti optimiza pagina ta web pentru o incarcare cat mai rapida, am scris in acest articol.

7. Actualizeaza continutul!

Nu lasa sa se puna praful pe paginile website-ului tau! Adauga cat de des poti continut nou, relevant. Gandeste-te ce ar dori sa stie clientii tai potentiali si scrie articole care sa raspunda acestor intrebari. Incearca sa iti faci un obicei din asta, scrie cate un material nou saptamanal daca se poate, sau macar odata pe luna. Va da roade in timp! Beneficiile sunt duble: continut nou, relevant pentru vizitatorii tai, dar si mai mult material indexabil pentru motoarele de cautare. Daca stii si cum sa iti scrii materialul in asa fel incat fiecare articol nou sa se concentreze pe cate un cuvant cheie, e si mai bine.

8. Foloseste tot ce iti pune Google la dispozitie!

Fii cu ochii in patru! Exista atatea unelte valoroase pe care le poti utiliza, este pacat sa nu beneficiezi la maxim de ele. Inscrie-ti siteul in toate aceste unelte: Google Analytics – iti ofera informatii foarte valoroase despre publicul care iti acceseaza site-ul, Webmasters Tools – despre cum este perceput siteul tau de Google, cum este indexat si cum apare in cautarile organice, Compania mea pe Google – date despre firma ta, locatia pe Google Maps, etc.

9. Pastreaza o structura clara si prietenoasa

Degeaba ai cea mai buna oferta si cel mai bun pret, daca aceste informatii sunt greu de gasit pe site-ul tau. Asigura-te ca meniul principal este cat se poate de clar, elementele nu sunt ingramadite pe pagina, renunta la sectiunile „plictisitoare” sau gaseste-le o modalitate de prezentare, inserate pe ici si colo astfel incat experienta vizitatorului sa fie cat mai buna. Gandeste-te intotdeauna ca rabdarea vizitatorului este scurta, va pleca repede de pe site daca nu gaseste in primele cateva secunde ceea ce cauta. Un bun indicator in acest caz fiind Bounce Rate-ul din rapoartele disponibile in Google Analytics.

10. Fara broken links

Asigura-te ca toate linkurile de pe site-ul tau sunt functionale, nu dau erori, nu trimit catre resurse devenite indisponibile in timp. Poti verifica manual linkurile din site, sau poti urmari rapoartele din Webmasters Tools, unde poti vedea paginile care afiseaza erori de tip 404 Not found.

Speram ca iti vor fi de folos aceste sfaturi practice. Daca ai nevoie de ajutor pentru implementarea oricarui punct din aceasta lista de sfaturi practice, te rugam sa ne contactezi, te putem ajuta punctual, sau daca doresti, prin incheierea unui contract de suport si mentenanta website.

Site virusat. Ce ma fac?

Ni s-a intamplat de-a lungul timpului sa ne contacteze clienti, spunand ca au un site virusat, infectat cu malware iar in cazurile mai grave, daca nu a fost observat din timp si remediat, google a declasat siteul din cautari iar browserul afiseaza un ecran rosu cu mesaje disperate sa fugi de acolo cat te tin picioarele.

Ca in multe alte cazuri, problema securitatii siteurilor web trebuie tratata din 2 perspective: preventie si remediere.

Preventie : Bune practici de urmat, pentru a nu avea un site virusat, infectat cu malware

Desi aceste masuri sunt elementare, chiar evidente, pentru oricine a avut un contact cat de cat cu lumea virtuala, le amintim fara a detalia prea mult. Le putem imparti in 3 categorii, in functie zona pe care urmarim sa o protejam. De retinut ca siguranta sistemului depinde de veriga cea mai slaba dintre aceste trei elemente, este de ajuns ca atacatorul sa gaseasca o bresa intr-una dintre aceste zone, pentru a afecta intreg sistemul, rezultand nu doar un site virusat, ci si un server compromis, folosit de atacatori ulterior pentru a trimite spam si/sau raspandi virusul sau chiar un calculator personal infectat.

  • masuri pentru a securiza serverul (sau doar contul nostru de hosting daca nu avem acces la intreg serverul)
    Aici este vorba de felul in care este configurat serverul, firewall-ul sau alte restrictii la accesul zonelor sensibile, aplicatiile si modulele instalate sa fie intotdeauna upgradate la ultima versiune disponibila, etc.
  • masuri pentru a securiza calculatorul personal de unde accesam zonele private ale site-ului (zona de administrare, contul de hosting, ftp, etc)
    Antivirus updatat la zi precum si o grija maxima pentru locatiile pe care le vizitam pe net, fisierele pe care le download-am, aplicatiile pe care le instalam, unde tinem parolele salvate (de preferinta nu in browser si clientul de ftp), etc.
  • masuri pentru a securiza siteul web propriu zis
    Acestea de regula sunt in sarcina autorului siteului web, si presupun printre altele (dar nu numai) grija pentru a valida orice input, restrictii la uploadul de fisiere pe server, un cod sursa fara vulnerabilitati la sql injection, cross-site scripting, etc. Daca aceste vulnerabilitati exista in site, se poate interveni si ulterior in codul sitelui web, intarind securitatea acestuia.

Pentru ca nu putem preveni orice scenariu, este foarte indicat sa pastram local o copie a site-ului web, iar daca site-ul este unul actualizat frecvent, atunci este bine sa facem backup-uri periodic, eventual chiar cu pastrarea, daca spatiul fizic permite, a mai multor astfel de versiuni de backup, denumite intr-un mod clar (ex nume_site-backup-29-04-2016.zip). De asemenea, de fiecare data cand facem un astfel de backup, este bine sa facem acelasi lucru si cu baza de date, exportand continutul acesteia intr-un fisier, folosind interfata de administrare phpMyAdmin disponibila de regula in contul nostru de gazduire.

Pentru a fi cu un pas inainte, sa fiti avertizati cat de repede cu putinta ca aveti un site virusat, noi la Manifest Media recomandam clientilor nostri, pe langa toate aceste bune practici, instalarea unui script ce ruleaza periodic pe server, care scaneaza fisierele de pe server si trimite un email de avertizare in cazul unei modificari aparute pe server. Instalam acest script pe siteurile clientilor carora le asiguram suport si mentenanta.

… si totusi avem un site virusat, ce ne facem acum?

In primul rand, schimbam toate parolele, cat de repede posibil: parole de acces la contul de gazduire, de ssh, ftp, baze de date, sectiune de administrare a siteului.

Daca am fost precauti si avem la dispozitie un backup al site-ului de dinainte de a fi infectat, suntem norocosi, procedeul de curatire este relativ usor si fara riscuri. Putem in acest caz sa restauram copia locala, uploadand-o direct pe site. Daca dorim sa vedem mai multe detalii, ce parti din site au fost infectate si in ce fel – acest lucru putand sa ne ofere informatii pretioase asupra vulnerabilitatilor din site – atunci putem compara copia locala cu ce se afla pe server, urmarind exact ce fisiere s-au modificat, atat ca dimensiune cat si ca data ultimei modificari. Aceasta comparatie o putem face foarte usor cu Total Commander, un file manager popular disponibil in regim shareware.

Deschidem intr-un panel al Total Commander-ului siteul de pe server (accesand prin ftp contul) iar in cealalta parte, fisierele locale. Putem folosi acum functia Syncronize Directories:

site virusat - Syncronize directories - Total Commander - Devirusare Site Web

In fereastra de sincronizare, ne asiguram ca urmatoarele optiuni sunt setate:

Subdirs – bifat – in acest fel, cautarea se va face recursiv in toate directoarele site-ului si nu doar in directorul radacina

Ignore date – debifat – in afest fel, vom fi avertizati de fisiere care si-au modificat data ultimei modificari, fata de copia locala pe care o avem. (Nota: Pentru a putea folosi data modificarii fisierelor in comparatie, trebuie sa avem backupul local facut in asa fel incat sa pastreze exact timestamp-ul original al fisierelor de pe server. Acest lucru il putem face prin crearea unei arhive pe server si descarcarea arhivei. Daca copiem structura de fisiere de pe server direct pe calculatorul local, vom avea copia locala avand toate fisierele cu data curenta, a transferului de pe server).

Cele 4 butoane de sub ‘Show’ ne asiguram ca sunt apasate toate mai putin cel cu semnul ‘=’, astfel vom vedea toate diferentele dintre cele 2 panel-uri.

Dupa ce ne asiguram ca aceste setari sunt facute in acest mod, apasam pe Compare si asteptam ca scanarea sa se termine. In functie de marimea siteului si de viteza conexiunii noastre la internet, aceasta scanare poate dura de la cateva secunde la cateva minute.

site virusat - total commander - syncronize and compare direcotries - devirusare site web Cluj-Napoca

Daca exista fisiere infectate, le vom vedea intr-o lista, putand ulterior sa le consultam rand pe rand, vazand ce exact s-a modificat pe server. Putem realiza o comparatie linie cu linie, direct din aceasta fereastra de sincronizare, actionand dublu-click pe fisierul pe care dorim sa il vizualizam.

Fisierele la care ar trebui sa acordam o atentie speciala – fiind tinta acestor atacuri, sunt fisierele .html, .html, .js, .php (sau alte limbaje server side scripting: asp,┬á etc.)

Din aceasta fereastra putem sa efectuam si uploadul fisierelor locale peste fisierele infectate, odata ce am terminat de inspectat fisierele modificate. Facem selectia fisierelor pe care dorim sa le sincronizam, apoi cu butonul Syncronize, incepem sincronizarea.

Daca a trecut ceva timp de la infectare fara sa remediem problema si Google a apucat sa detecteze paginile infectate, va declasa din rezultatul cautarilor site-ul nostru si va afisa un warning cand acesta va fi accesat. Odata ce am curatat siteul si ne-am asigurat ca am indepartat si vulnerabilitatile care au cauzat aceasta infectare, putem cere reincluderea in rezultate si eliminarea warning-ului de site infectat, prin intermediul Search Console (anterior numit Webmaster’s Tools).

Daca suntem mai putin norocosi si nu avem acest backup la dispozitie, curatarea acestui site virusat este un proces mai dificil, fiind nevoie de inspectarea cu atentie a fiecarui fisier modificat, recunoasterea codului strain injectat in sursa si eliminarea acestuia, daca virusul doar si-a adaugat codul la codul existent, fara sa stearga nimic din ce era. Altfel, curatarea unui site virusat devine si mai dificila, necesitand cunostinte tehnice de specialitate, pentru a nu face editari care sa afecteze functionarea site-ului web.

Daca va confruntati cu astfel de probleme neplacute avand un site virusat si doriti ajutor specializat, va stam la dispozitie prin serviciile noastre de Suport si Mentenanta Web Site – daca doriti un serviciu constant de monitorizare si interventie. Daca doriti un serviciu punctual, one-time, de curatare site virusat, atunci in urma analizarii complexitatii site-ului dvs, va vom trimite o oferta in cel mai scurt timp.

 

Website custom sau Website construit pe WordPress?

Ce sa alegem intre un site custom si unul bazat pe WordPress? aceasta cred ca este o intrebare pe care multi si-au pus-o la inceputul drumului in „online”. Voi incerca sa schitez cateva argumente pro si contra fiecarei variante, neavand pretentia insa ca voi epuiza toate aspectele importante. Va astept sa veniti cu parerile voastre, sa completam┬á lista cu ce va atrage pe voi la fiecare varianta.

Desigur ca WordPress nu este singura platforma „off the shelf” disponibila, exista multe alte solutii mai mult sau mai putin asemanatoare, insa cred ca nu gresesc daca afirm ca este cea mai populara solutie disponibila daca dorim sa umblam pe drumuri bine batatorite. Conform unei statistici culese de aici, WordPress „motorizeaza” mai mult de jumatate din toate site-urile ce folosesc un CMS (Content Management System – adica site-uri web care au un continut administrabil printr-o interfata prietenoasa, fara a avea nevoie in principiu de cunostinte tehnice). Urmatorul CMS este Drupal, care vine insa la o mare distanta, avand un pic peste 10% cota de piata.

Care sunt avantajele folosirii WordPress?

Cred ca principalul avantaj este rapiditatea cu care putem incropi si lansa un site. WordPress este solutia ideala cand ne propunem sa facem un blog unde vom posta articole, sa construim un site unde beneficiarul va avea nevoie frecventa sa adauge pagini noi, pagini personale sau de prezentare al unui portofoliu, website-uri ale unor companii locale de dimensiune mica spre medie, etc.

Odata ce te-ai familiarizat cu interfata de administrare, este foarte usor sa adaugi materiale noi, sa instalezi module noi pentru diverse functionalitati, sa urmaresti statistici ale vizitelor, etc. Optimizarea pentru motoarele de cautare este o joaca, exista module specializate care se ocupa de gestionarea meta-tagurilor, sitemapuri, titluri SE friendly, etc.

Exista resurse aproape inepuizabile de teme, module, widgeturi, totul se poate adauga si configura din cateva click-uri de mouse. Exista foarte multe teme dezvoltate pentru WordPress, multe fiind de o calitate foarte buna, aspectuoase, moderne, sunt optimizate pentru vizualizarea pe device-uri mobile (teme responsive), folosesc ultimele briz-brizuri la moda (animatii CSS3, fundaluri parallax, etc) sunt adaptabile pentru aproape orice cerinta.

Exista si dezavantaje?

Totul suna foarte bine, in favoarea folosirii acestei platforme. Dar totusi exista si neajunsuri, unde folosirea unei solutii custom poate fi mai avantajoasa. Datorita usurintei cu care poate fi instalat si configurat un astfel de site, WordPress-ul a devenit o unealta extrem de accesibila, chiar si celor fara experienta in programarea site-urilor web, fara cunostinte temeinice in html, css, javascript sau php. Acest fapt este si el in sine un avantaj pentru WordPress, doar ca aceasta accesibilitate universala, face ca fiecare tema existenta, fiecare layout disponibil, sa fie folosit pe efectiv mii si mii de site-uri web. Aceasta poate fi o reala problema care poate dauna imaginii unui business. Desigur ca aceste teme pot fi modificate oricat de mult, adaptate aproape oricaror nevoi, dar de regula acest lucru deja presupune cunostinte avansate si alocarea de resurse semnificative proiectului, diminuand avantajele folosirii acestei platforme, putand inclina balanta in mod decisiv catre o solutie custom.

Un alt aspect ce poate reprezenta un dezavantaj al folosirii WordPress, ar fi siguranta. Fiind o platforma open source, adica fiind gratuit si avand codul sursa disponibil la vedere, reprezinta un deliciu pentru hackerii ce vaneaza vulnerabilitati in sistem. In momentul in care ei descopera o vulnerabilitate ce le permite accesul pe server, ei au practic acces liber pe toate site-urile web care folosesc respectiva versiune de WordPress in care s-a descoperit vulnerabilitatea. Cu siguranta ca nici autorii platformei nu neglijeaza acest aspect si lucreaza in mod continuu la eliminarea acestor posibile vulnerabilitati, publicand patch-uri si versiuni noi care rezolva aceste eventuale gauri. Din acest motiv, este nevoie din partea administratorul site-ului de un plus de vigilenta, el trebuie in permanenta sa faca toate update-urile de software necesare pentru minimizarea pe cat se poate a riscurilor.

Un alt posibil dezavantaj al folosirii WordPress, este viteza de incarcare a paginilor. Daca creste numarul vizitatorilor, creste complexitatea site-ului, a numarului de module instalate, site-ul poate deveni unul foarte greoi, necesitand resurse mari si timp considerabil de incarcare. Pana la un punct, acest lucru poate fi tinut sub control prin folosirea unor module de cache-ing, insa cred ca aici site-urile custom pot avea un real avantaj, avand un control mult mai bun asupra resurselor folosite pentru randarea unei pagini.

Desi poate parea ca reinventam roata, consider ca de multe ori un site custom poate fi o solutie mai avantajoasa si prin flexibilitatea de a realiza totul exact asa cum ne dorim. Pe de alta parte, uneltele oferite de WordPress sunt trecute prin focul incercarilor, sunt temeinic testate de comunitatea numeroasa de fani WordPress, codul fiind astfel unul in general mai stabil.

In concluzie

Ca in multe alte domenii, nu cred ca se poate da un raspuns transant, o varianta care sa fie universal avantajoasa. Trebuie cantarite toate aspectele, cerintele clientului, ce isi doreste acesta  de la site, cui i se adreseaza site-ul web, cat de des va dori clientul sa opereze schimbari in continutul site-ului si cine se va ocupa de acestea, cat de mult conteaza unicitatea pentru el, care este bugetul disponibil, etc.

Noi, la Manifest Media Cluj-Napoca, putem raspunde cerintelor clientilor nostri prin ambele solutii constructive, incercand astfel sa oferim cea mai buna varianta in functie de nevoi si bugetul alocat proiectului.

Cateva sfaturi pentru incarcarea rapida a paginii site-ului web

Speed matters! Simtim asta din plin cand navigam pe net. Cu totii ne aducem aminte de momente in care ne-am pierdut rabdarea si nu am mai asteptat ca o pagina sa se incarce in intregime, abandonand vizita, trecand la urmatorul rezultat al motorului de cautare. Problema abandonului din cauza vitezei prea mici de incarcare, este o problema reala cu care se confrunta toti detinatorii de site-uri preocupati de imbunatatirea continua a calitatii experientei vizitatorilor online. In acest articol voi incerca sa dau unele sfaturi pentru incarcarea rapida a paginii site-ului web, adresandu-ma in primul rand amatorilor sau incepatorilor in domeniu.

Exista pe net, disponibile tuturor care cauta date exacte, o multime de studii, grafice, rapoarte care dovedesc importanta vitezei de incarcare. Nu voi insista in acest articol pe astfel de date, insa este bine de stiut faptul ca rata abandonului vizitei in cazul unui site „greoi” este foarte mare. Fiecare secunda smulsa in plus conteaza enorm, poate face diferenta intre un vizitator care ramane sa citeasca continutul paginii si un vizitator care apasa butonul „back” mergand mai departe in alte locuri.

Cum pot sa evaluez viteza de incarcare a site-ului meu?

Ai la dispozitie mai multe variante. Cea mai la indemana, ar fi testarea directa, in browser. Eu personal, sunt un fan Firefox (da, stiu ca este un memory hog, problema nerezolvata de foooarte multa vreme, dar totusi, puterea obisnuintei e mare). Folosesc extensia Firebug, disponibila gratuit, care ofera o sumedenie de unelte indispensabile cand lucrezi pe site-uri web. Iubitorii de Chrome, au o functie similara, parte integranta a browserului, functia „Inspect”.┬áLa fel si IE are ceva asemanator, dar din pacate pentru Microsoft, au cam pierdut batalia browserelor, nu stiu cine mai foloseste IE, alegand constient acest browser.

Odata deschisa unealta „Firebug”, exista tab-ul „Net”, care arata un timeline al incarcarii tuturor resurselor folosite de site. Daca dai un refresh pe pagina, vei vedea lista tututor acestor resurse, fiecare cat timp dureaza pana se incarca, precum si timpul total al incarcarii paginii.

Sfat: Pentru a nu lasa cache-ul browserului sa afecteze evaluarea, stergeti intreg cache-ul inainte de reincarcarea paginii, sau folositi Ctrl-F5 pentru a forta reincarcarea tuturor resurselor. Daca unele resurse sunt incarcate din cache, timpul total va fi mult mai mic, dar irelevant pentru a evalua experienta unui vizitator nou.

Optimizare Site Web - incarcarea rapida a paginii

O alta varianta la dispozitie, ar fi folosirea de unelte online, precum Pingdom Speed Test. Acesta permite testarea vitezei de incarcare din mai multe locatii de pe glob, oferind informatii detaliate asupra resurselor incarcate, un scor general dar si o pozitionare relativa fata de toate paginile testate de ei.

O altfel de evaluare, care insa nu ne spune nimic despre pagina in sine, ne spune doar cat de repede raspunde serverul unui pachet de date, este comanda „ping”. Se deschide o fereastra de comanda (pentru utilizatorii de Windows, se scrie cmd┬áintr-o fereastra de „Run”) si se tasteaza:

ping domeniul-de-testat.ro -t [Enter]

si se urmareasc timpii de raspuns. Acestia trebuie sa fie cat mai mici si constanti, fara fluctuatii prea mari sau erori de time-out. Evident, „domeniul-de-testat.ro” se inlocuieste cu numele domeniului de testat.

Este indicat sa se faca astfel de masuratori de mai multe ori, in momente diferite ale zilei. O masurare unica poate fi influentata de anumite probleme punctuale ale retelei, fiind nerelevanta pentru incarcarea rapida a paginii.

Cum aleg serverul care sa gazduiasca pagina?

Locatia serverului are o importanta deosebita (poate cea mai mare) pentru viteza de incarcare a paginii. De aceea, trebuie sa faceti alegerea in functie de localizarea publicului tinta. Daca siteul tau se adreseaza in principal clientilor din Romania, este recomandat sa se aleaga un server dintr-un datacenter din Romania (sau cel mult Europa, daca conexiunile sunt rapide). In niciun caz, nu se va opta pentru o gazduire in locatii foarte indepartate, de exemplu SUA, chiar daca sunt multi provideri acolo care ofera resurse practic nelimitate pentru bani foarte putini. Timpul de incarcare al paginii va fi grav afectat daca este o distanta mare intre server si client.

Cum pot optimiza site-ul web pentru incarcarea rapida a paginii?

Parcurgand lista de resurse, puteti foarte usor identifica daca sunt elemente care au un timp mult mai mare de incarcare, ingreunand pagina. Puteti decide punctual, daca doriti sa pastrati elementul sau sa renuntati la acesta. In unele cazuri, se pot face optimizari pentru a reduce dimensiunea resursei. In cazul imaginilor, optimizarea se face de regula in detrimentul calitatii imaginii, deci trebuie gasit compromisul ideal intre dimensiune si calitate. O calitate mai buna va insemna si o resursa mai mare, mai greoaie de incarcat si invers.

In cazul resurselor text (fisiere CSS, JS) optimizarea este fara pierderi, fisierele se pot minimiza prin eliminarea comentariilor, spatiilor in plus, denumiri cu nume cat se poate de scurte, etc. Acest lucru nu influenteaza negativ aspectul sau functionarea siteului, insa ingreuneaza viitoare interventii asupra codului sursa, acesta fiind┬ámai putin inteligibil. Puteti desigur sa va faceti un obicei in a lucra┬ápe o versiune ‘full’, iar cand bucata pe care lucrati este gata, testata si aprobata, generati versiunea minimizata si o puneti pe server.

In cazul multor resurse uzuale „3rd party” incluse in site (de exemplu jQuery, bootstrap, teme CSS pentru UI, etc) exista posibilitatea incarcarii lor de pe CDN-uri, acestea fiind de regula mult mai rapide decat serverul propriu. Trebuie insa avuta putina atentie, mai ales atunci cand site-ul foloseste si un certificat SSL pentru transferul criptat al continutului. Deoarece┬áincarcarea acestor resurse presupune folosirea unei caii absolute, daca folositi http://www…. in aceasta cale, puteti┬áinvalida securitatea paginii, browserul afisand un mesaj de atentionare. Pentru a evita acest lucru, se poate┬áomite „http:” din calea respectiva, scriind doar calea incepand cu caracterele „//”.

Concluzii pentru incarcarea rapida a paginii

Incarcarea rapida a paginii┬áeste esentiala, poate fi elementul decisiv care va face diferenta intre┬ásucces si┬áesec.┬áO durata ideala nu ar trebui sa depaseasca cateva secunde (maxim 5, unii zic chiar┬á2). Daca continutul este de asa natura incat nu se poate ajunge nicicum la o astfel de valoare, trebuie cel putin avut grija ca partea de continut „above the fold”, adica partea vizibila fara a folosi bara de scroll, sa se incarce cat de repede, la inceput, urmand ca restul resurselor sa se incarce ulterior.

Noi, la Manifest Media Cluj-Napoca, acordam o atentie deosebita optimizarii site-urilor web, incarcarea rapida a paginii fiind un ingredient esential pentru o experienta cat mai placuta a vizitatorilor.