Search Engine Optimization: On-page optimization

January 19th, 2008 la 13:01

SEO: On-page optimization Pentru început trebuie să atrag atenţia la un moment foarte important: când vine vorba despre optimizarea unui site, de fapt, se face optimizare pe fiecare pagină a acestuia. În motoarele de căutare, fiecare pagină web are “autoritatea” sa proprie. Deci este posibil să aveţi pe un site câteva pagini bine optimizate, şi câteva care sunt proaste de tot. De aceea, tehnicile menţionate mai jos trebuiesc aplicate pentru fiecare pagină pe site, şi doar în ansamblu ele vor avea efecte pozitive.

On-page search engine optimization este alcătuită din mai multe etape, fiecare are o importanţă, sau mai mică sau mai mare. 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

De unde motoarele de căutare cunosc că, pe o pagină cu circa 1000 de cuvinte, anume “Optimizare Web”
este tema articolului şi nu “consumul trafficului”? Cum motoarele de căutare sunt în stare să identifice cele mai importante cuvinte cheie? Exact! prin utilizarea corectă a tag-urilor html.

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>Search Engine Optimization - On-page optimization</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. Nu cred că este nevoie să explic beneficiile :)

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.

6. Concluzie

Încercaţi să ţineţi cont de aceste sfaturi atunci când elaboraţi un site nou. Îndată pot să spun că este nevoie de timp pentru a vă obişnui cu această abordare, cu unele tehnici şi procedee. Nu vă aşteptaţi ca rezultatul să apară imediat şi din prima dată. Experienţa este foarte importantă în acest domeniu, doar cu teoria departe nu ajungi.

În articolul următor voi vorbi despre optimizarea Off-page şi despre Google PageRank. Dacă la cineva apar întrebări sau nedumeriri, lăsaţi comentarii şi voi încerca să răspund în următoarele articole.

9 Responses to “Search Engine Optimization: On-page optimization”

  1. Pavel Ciorici a scris:

    Am citit cu interes :) multe lucruri chiar nu le stiam..

  2. vitalie a scris:

    3. Optimizarea imaginilor.

    aici as completa cu urmatoarele: fiecare tag img trebuie sa contina si atributul title=”bla bla”. Anume acest atribut vorbeste motorului de cautare despre o anumita relevanta tematica a unei imagini.
    Nota: FireFox, spre deosebire de IE, nu reda continutul alt pe ecran cand duci cursorul deasupra unei imagini care contine in codul HTML numai atributul alt.

    In resumat:

    - continutul atributului alt este folosit pentru a fi redat in browserele care nu pot arata imaginile.
    - continutul atributului title este utilizat pentru trasmiterea unui mesaj despre imaginea data atata utilzatorului cat si motorului de cautare.
    Este corecta utilizarea ambelor.

  3. Dumitru Brînzan a scris:

    De fapt nu sunt deacord cu tine. Atributul title nu influenţează nicidecum motoarele de căutare. Deseori alt şi title sunt confundate, şi mulţi consideră că title= este important deoarece acesta se manifestă “vizual”. Adică, dacă la IMG sau la A pui title, atunci la mouseover va apărea un tooltip, aşa cum şi ai spus mai sus.
    Dar este fals conceptul că TITLE ajută. Desigur că prezenţa acestuia nu are nici un impact negativ, aşa că poate fi şi el pus fără probleme.

    În rezumat: nu ai dreptate :) Alt este important, title nu este important. Ambele atribute pot fi utilizate împreună, nu se bat între ele :)

  4. vitalie a scris:

    Bineinteles ca tu ai dreptate, intre timp consulta:

    cautare google alt title attributes

    sau

    cautare WebmasterWorld.com - alt title attributes

  5. Dumitru Brînzan a scris:

    Cam nimic nou nu am aflat :) Unica ce, nu am avut niciodată de furcă cu “screen readers”, deci nu ştiam că conţinutul atributului title este citit de ele.

    Unicul lucru favorabil de la atributul title (pe lângă acel menţionat puţin mai sus), mai poate fi ridicarea densităţii cuvintelor cheie, însă această monedă are două părţi. În primul rând, dacă raportul şi aşa este normal sau aproape de “prea mare”, acest atribut title poate declanşa alerta de keyword stuffing, şi ulterior poţi primi un -50 sau -100 penalty, dacă nu mai rău.

    P.S. title nu intră în standardele XHTML Transitional, aşa că utilizarea acestuia rămâne la discreţia developerilor :)

  6. Pharaon a scris:

    Din cate cunosc, title se recomanda a fi folosit nu numai la imagini, ci si la tabele, div-uri, liste etc.

    De ex, o lista cu scurt titlu in “heading” ar putea fi explicata in “title” mai in detalii pentru Google Bots.

    5 sfaturi pentru SEO

    Tableless HTML/CSS coding

  7. Dumitru Brînzan a scris:

    Cum am mai spus, nu am constatat vreo valoare din punct de vedere a SEO a atributului title, şi alţi webmasteri afirmă acelaşi lucru.

    Chiar dacă acest lucru poate ajuta niţel la compatibilitate, totuşi cred că nicidecum nu influenţează SEO.

    http://www.webmasterworld.com/forum30/32726.htm

  8. vitalie a scris:

    am scris un comentariu referitor la relatia alt si title in tag+ul img, dar a iesit f. lung asa ca l-am lasat in notepad ca sa se mai coaca. intre timp mai studiez intrebarea cu informatia noua, din ultima 1/2 de an, ca, sa fiu sincer, de vreun an am bagat piciorul in SEO deoarece google e ca un armasar infârnat in ultimul timp. Datorita aiurelilor lui nu te costa pielea cat dubala.

  9. Dumitru Brînzan a scris:

    Ok, aşteptăm :) Dacă publici pe undeva, lasă aici un trackback :)

Adaugă un comentariu