Optimizare on-page

Optimizare on-page este alcătuită din mai multe etape. Voi enumera aceste etape în ordinea lor logică.

1. Tableless HTML/CSS coding

Acesta este primul pas spre optimizare şi cel mai important. Sunt numeroase articole despre beneficiile unui cod html/css table-less (fără utilizarea tabelelor pentru layout).

Dar cele mai importante sunt:

• Minimizarea codului html ce este inutil pentru motoarele de căutare. Regula de bază este: cu cât mai puţin cod html e pe pagină , şi cu cât mai mult conţinut (text) este prezent – cu atât este mai bine. Raportul între conţinut şi cod html trebuie să fie cât mai mare posibil. De aceea tabelele nu sunt binevenite (pentru layout). Recomand spre citire următorul articol: Why tables for layout is stupid: problems defined, solutions offered.
• Minimizarea codului html duce şi la reducerea mărimii paginii. Eu am re-codat mai multe site-uri, şi majoritatea paginilor care aveau în jur de 40kb (fără imagini), au fost reduse până la 13-18kb. Astfel, pe lângă faptul că timpul de aşteptare a vizitătorului se reduce simţitor, şi consumul trafficului este redus.
• Codul curat html/css este mult mai accesibil pentru handhelds: telefoane mobile, PDA, etc.
• Întreţinerea unui astfel de cod este mai simplă şi mai comodă.

2. Utilizarea semantică (corectă) a HTML tag-urilor

Printre cele mai importante tag-uri pe pagină sunt: <title></title> şi <h1></h1> – <h6></h6>. Motoarele de căutare acordă valoare deosebită cuvintelor cheie aflate în aceste tag-uri.

Tag-ul <title></title> trebuie să conţină titlul PAGINII, şi nu a site-ului. Se recomandă ca un titlu să conţină între 3 şi max. 6 cuvinte. Nu încercaţi să băgaţi vreo 100 de cuvinte în <title></title> (da, am întâlnit aşa ceva), căci nu vă va ajuta cu nimic.

Tag-urile <h1><h2><h3><h4><h5><h6> sunt “headings”, adică sub-titluri. Importanţa lor scade de la <h1> la <h6>. Astfel, dacă avem o pagină (ca aceasta), care este separată în mai multe părţi logice, este corect să utilizăm aceste headings astfel:

<h1>Optimizare on-page</h1> – Titlul articolului

<h2>Tableless HTML/CSS coding</h2>, <h2>Utilizarea semantică (corectă) a HTML tag-urilor</h2>, etc. etc. Deci fiecare “sub-capitol” primeşte un heading respectiv.

ATENŢIE! O pagină poate conţine un singur <h1></h1> tag. Pentru restul limită nu există, dar totuşi se recomandă să nu abuzaţi de headings. Ele trebuie să conţină titlurile respective pentru paragrafele sau modulele ce urmează.

P.S. Stilul (formatarea) tag-urilor <h1>-<h6> poate fi efectuată prin CSS. Deci nu vă speriaţi dacă browserul by default reprezintă <h1> cu un font-size prea mare. Stilaţi prin CSS aceste tag-uri.

Codul rezultant este bine să-l validaţi (să verificaţi dacă nu conţine erori de sintaxă). Aceasta o puteţi face aici: W3C Markup Validation şi W3C CSS Validation.

3. Optimizarea imaginilor

Foarte mulţi designeri şi mai ales developeri uită de un segment important a internetului, şi anume utilizatorii ce au dizabilităţi vizuale, utilizatorii ce au blocat în browser descărcarea imaginilor, utilizatorii ce navighează de pe PDA şi telefoane mobile, etc. Deci, concluzia: imaginea nu trebuie să conţină informaţii vitale pentru site, aşa ca preţurile produselor, telefonul de contact, etc.

Pe lângă aceasta, mai există un attribute important la tag-ul <img>, şi anume alt=””. Spre exemplu avem: <img src=”images/site_logo.gif” mce_src=”images/site_logo.gif” width=”100″ height=”100″ alt=”” />. Atributul alt= semnifică “alternative”. Adică, ce va apărea la utilizatorii ce nu pot descărca imaginea. Se recomandă aici să fie descris conţinutul imaginii. Astfel, dacă pe imagine avem scris numărul de telefon sau adresa companiei, atunci în alt=”” este bine să rescrieţi acelaşi text, de exemplu aşa: <img src=”images/tel.gif” mce_src=”images/tel.gif” alt=”Telefon de contact: 555-5555″ />.

Totodată, astfel de motoare ca Google Images vor indexa imaginile de pe site (dacă este permis) anume cu aceste descrieri.

4. Evitarea javascript-urilor şi utilizarea corectă a animaţiilor FLASH

Majoritatea site-urilor utilizează javascript-uri într-o măsură oarecare. Este important să înţelegeţi că, motoarele de căutare, când vizitează site-ul, nu au posibilitatea să execute aceste javascripturi. Dacă aveţi pe site javascript-uri – verificaţi ca totul să lucreze în browser şi atunci când faceţi disable la JS.

Ceea ce ţine de Adobe Flash. Foarte mulţi începători fac o greşeală imensă prin realizarea navigării site-ului în Flash. Pe lângă faptul că nu toţi utilizatorii au în browser instalat/activat Flash player, motoarele de căutare încă nu sunt capabile să citească conţinutul Flash-ului. Deci orice link conţinut în flash nu va fi urmat. Astfel, dacă nu aveţi un Sitemap pe site ce poate fi accesat de oricine, probabilitatea este mare că motoarele de căutare nu vor indexa toate paginile de pe site-ul Dstră.

5. Prezentarea unui Sitemap

Este recomandat ca orice site ce are conţinut mai mult de 5-10 pagini, acestea fiind organizate în mai multe nivele, să prezinte şi un sitemap (harta site-ului). De exemplu, dacă aveţi o pagină personală cu vreo 3-4 pagini, toate fiind accesibile direct de pe prima pagină, nu aveţi nevoie de un sitemap. Dacă aveţi un site de dimensiuni mai mari, unde aveţi o navigare după categorii, subcategorii, etc. (mai multe nivele), o hartă a site-ului este foarte binevenită. Se mai recomandă ca harta să nu conţină mai mult de 50-60 de linkuri. Deci, dacă aveţi spre exemplu un forum, nu este recomandat ca harta să conţină toate publicaţiile de pe forum, este suficient doar paginile cu categorii şi teme.

Publicitate