You are on page 1of 17

Care este legatura dintre web design si SEO?

De cele mai multe ori, incepatorii nu fac legatura intre partea de web design a site-ului si partea de optimizare pentru motoarele de cautare, iar aceasta este o greseala fundamentala care duce la un site de PROASTA CALITATE. Trebuie spus de la inceput ca motoarele de cautare (din care ne intereseaza Google, pentru ca acesta este motorul de cautare folosit de 85% dintre romani), pozitioneaza mai bine siturile care pot fi accesate la fel de usor de pe orice tip de computer, orice fel de conexiune la Internet, orice sistem de operare, adica site-urile CAT MAI APROPIATE DE HTML. Deci, este bine ca situl sa fie in format HTML, si nu Flash. A doua problema: vizitatorii si motoarele de cautare apreciaza site-urile care se incarca foarte repede. Si aici sunt cazuri cand web designul trebuie sa se raporteze de la inceput la regulile SEO. Adica, imaginile grafice nu vor fi foarte multe, si de o inalta rezolutie. Pentru a verifica viteza de incarcare a oricarui site, putem accesa:www.verificare.seosite.ro/

Dati click la web site speed test, tastati url-ul site-ului si aflati viteza de incarcare a site-ului: Load Time.

Prima intrebare la care trebuie sa raspundem cand incepem proiectarea de web design este: ce promovam prin site. Poate fi un produs, un serviciu, un brand. Sa presupunem ca dorim sa promovam produse cosmetice, ale unei firme nou aparuta pe piata romaneasca. A doua intrebare: cui promovam, adica stabilirea pietei tinte. Atentie: promovarea unui produs pe piata romaneasca nu prea respecta regulile aplicabile in Occident. Vrem sau nu, suntem o tara in care scandalurile sunt mai mediatizate decat aparitia unei carti bune, unde un spectacol al unui manelist cunoscut face mai multa valva decat un concert al unui cunoscut vilonist. Cum stabilim corect care este piatra tinta: Se face in functie de mai multe carateristici. Economic adica puterea de cumparare a utilizatorilor site-ului. Vom vinde produse persoanelor cu venituri sub medii, venituri medii sau venituri mari? Avand in vedere ca cei cu venituri mari cumpara produse de firma, iar produsele firmei noastre sunt necunoscute,

rezulta ca ne vom adresa primelor 2 categorii. Din cele doua, baza o va reprezenta segmentul cu venituri medii. Al doilea aspect este aspectul pregatirii profesionale. Sunt trei segmente: persoane cu studii minime, studii medii sau superioare. Ne vom adresa in cazul nostru tuturor celor 3 categorii, insa prponderent persoanelor cu studii medii. Al treilea aspect este varsta. Ne vom adresa persoanelor cu varste cuprinse intre 16 si 45 de ani. Ultimul aspect este sexul: in cazul nostru, vor cumpara atat femei, cat si barbati, cei din urma pentru uz personal sau pentru cadouri, surprize facute sexului feminin. In acest caz, vom alege 24 de persoane din cercul nostru de cunoscuti sau al prietenilor nostri: 12 persoane de sex feminin 12 persoane de sex masculin 24 de persoane cu venituri mici si medii, din care 18 persoane cu venituri medii si 6 persoane cu venit minim 24 de persoane cu varste cuprinse intre 16 si 45 de ani, astfel: 12 persoane cu varste cuprinse intre 25 si 35 de anu, 6 persoane cu varste cuprinse intre 16 si 25 ani, 6 persoane cu varste cuprinse intre 35 si 45 de ani. La ce ne foloseste aceasta esantionare? Intocmim un chestionar, cu intrebari simple si care admit raspunsuri de genul DA/NU. Se vor nota raspunsurile pe o scara de la 1 la 10: 1. Este acest produs util pentru dvs? 2. Este ieftin in raport cu alte produse? 3. Este cunoscut pentru dvs? 4. Este usor de procurat? Pe baza raspunsurilor primite, se va intocmi un clasament: daca produsul este ieftin pentru utilizator, atunci in textul paginii se va insista pe acest lucru, daca utilizatorul nu constientizeaza utilitatea lui, se va insista pe avantajele pe care le aduce folosirea lui, etc.

Care este concurenta noastra?

Dupa o cautare pe Google, se stabilesc care vor fi competitorii nostri. Se noteaza din siturile lor: lista de cuvinte cheie folosite, lista frazelor, se analizeaza frecventa cuvintelor cheie. Se poate folosi instrumentul de analiza de mai sus:

Dupa ce am creionat profilul utilizatorului, sa gasim culorile cele mai potrivite. Din studiile efectuate la nivel mondial rezulta urmatoarele asocieri: rosu pasionat , irascibil galben posesiv, nesigur albastru calm, perfectionist verde prietenos, autoritar alb inocent, simplu negru sobru, serios violet fantezist, fanatic portocaliu sexualitate , caldura roz tinerete , bucuria de a trai

In cazul grupului nostru tinta, vom alege culoare predominanta in background, roz/portocaliu, impreuna cu tente de rosu/violet. Alegem codul culorilor:

AntiqueWhite Aqua Aquamarine Azure Beige Bisque Black

#FAEBD7 #00FFFF #7FFFD4 #F0FFFF #F5F5DC #FFE4C4 #000000

BlanchedAlmond Blue BlueViolet Brown BurlyWood CadetBlue Chartreuse Chocolate Coral CornflowerBlue Cornsilk Crimson Cyan DarkBlue DarkCyan DarkGoldenRod DarkGray

#FFEBCD #0000FF #8A2BE2 #A52A2A #DEB887 #5F9EA0 #7FFF00 #D2691E #FF7F50 #6495ED #FFF8DC #DC143C #00FFFF #00008B #008B8B #B8860B #A9A9A9

DarkGreen DarkKhaki DarkMagenta DarkOliveGreen Darkorange DarkOrchid DarkRed DarkSalmon DarkSeaGreen DarkSlateBlue DarkSlateGray DarkTurquoise DarkViolet DeepPink DeepSkyBlue DimGray DodgerBlue

#006400 #BDB76B #8B008B #556B2F #FF8C00 #9932CC #8B0000 #E9967A #8FBC8F #483D8B #2F4F4F #00CED1 #9400D3 #FF1493 #00BFFF #696969 #1E90FF

Feldspar FireBrick FloralWhite ForestGreen Fuchsia Gainsboro GhostWhite Gold GoldenRod Gray Green GreenYellow HoneyDew HotPink IndianRed Indigo Ivory

#D19275 #B22222 #FFFAF0 #228B22 #FF00FF #DCDCDC #F8F8FF #FFD700 #DAA520 #808080 #008000 #ADFF2F #F0FFF0 #FF69B4 #CD5C5C #4B0082 #FFFFF0

Khaki Lavender LavenderBlush LawnGreen LemonChiffon LightBlue LightCoral LightCyan LightGoldenRodYellow LightGrey LightGreen LightPink LightSalmon LightSeaGreen LightSkyBlue LightSlateBlue LightSlateGray

#F0E68C #E6E6FA #FFF0F5 #7CFC00 #FFFACD #ADD8E6 #F08080 #E0FFFF #FAFAD2 #D3D3D3 #90EE90 #FFB6C1 #FFA07A #20B2AA #87CEFA #8470FF #778899

LightSteelBlue LightYellow Lime LimeGreen Linen Magenta Maroon MediumAquaMarine MediumBlue MediumOrchid MediumPurple MediumSeaGreen MediumSlateBlue MediumSpringGreen MediumTurquoise MediumVioletRed MidnightBlue

#B0C4DE #FFFFE0 #00FF00 #32CD32 #FAF0E6 #FF00FF #800000 #66CDAA #0000CD #BA55D3 #9370D8 #3CB371 #7B68EE #00FA9A #48D1CC #C71585 #191970

MintCream MistyRose Moccasin NavajoWhite Navy OldLace Olive OliveDrab Orange OrangeRed Orchid PaleGoldenRod PaleGreen PaleTurquoise PaleVioletRed PapayaWhip PeachPuff

#F5FFFA #FFE4E1 #FFE4B5 #FFDEAD #000080 #FDF5E6 #808000 #6B8E23 #FFA500 #FF4500 #DA70D6 #EEE8AA #98FB98 #AFEEEE #D87093 #FFEFD5 #FFDAB9

Peru Pink Plum PowderBlue Purple Red RosyBrown RoyalBlue SaddleBrown Salmon SandyBrown SeaGreen SeaShell Sienna Silver SkyBlue SlateBlue

#CD853F #FFC0CB #DDA0DD #B0E0E6 #800080 #FF0000 #BC8F8F #4169E1 #8B4513 #FA8072 #F4A460 #2E8B57 #FFF5EE #A0522D #C0C0C0 #87CEEB #6A5ACD

SlateGray Snow SpringGreen SteelBlue Tan Teal Thistle Tomato Turquoise Violet VioletRed Wheat White WhiteSmoke Yellow YellowGreen

#708090 #FFFAFA #00FF7F #4682B4 #D2B48C #008080 #D8BFD8 #FF6347 #40E0D0 #EE82EE #D02090 #F5DEB3 #FFFFFF #F5F5F5 #FFFF00 #9ACD32

Dupa ce am ales codul culorilor care vor domina backgroundul, alegem contrastul , care este

foarte important intr-o pagina web. Contrastul intr-o pagina web. Din tabelul de mai jos, vom alege culorile cele mai potrivite pentru text. Background Ros Portocali Galbe Verd Albastr Negr Violet Alb Gri u u n e u u Rosu Portocali Slab u Galben Prim plan Verde Bun Bun Slab Slab Slab Bun Bun Bun Slab Bun Bun Slab Slab Bun Bun Slab Slab Bun Bun Bun Bun Slab Slab Slab Bun Slab Bun Slab Slab Slab Slab Slab Slab Bun Bun Slab Bun Slab Bun Slab Bun Slab Bun Slab Slab Bun Bun Slab Sla Slab b Sla Bun b Sla Bun b Bun Slab Bun Slab Bun Slab Bun

Albastru Slab Slab Violet Negru Alb Gri Slab Slab Slab Bun Bun Bun Slab Slab

Rezulta in cazul nostru ca cea mai buna culoare pentru text este culoarea alba. Urmatoarea etapa este sexualitatea sitului, unde prin sexualitate nu se intelege in nici un caz prezenta elementelor grafice erotice sau pornografice.. Ne place sau nu, sexualitatea ne guverneaza psihicul. Despre acest subiect, s-au scrise mii de pagini si exista mii de studii. Prin sexualitate noi vom intelege si linii, forme, culori cu tenta sexuala, pe care le vom introduce pe site sub forma unor imagini ce ating subconstientul, asa numitele imagini subliminale (despre crearea lor si exemple, in cursul 4). Urmatoarea etapa: ce vocabular folosim? Avand in vedere piata noastra tinta, vom folosi un limbaj de o complexitate medie, bazata pe fraze comune cu cei ce folosesc un vocabular comun. Urmatoarea etapa este modul de transmitere a mesajului: direct (produsul nostru este cel mai ieftin- mai ieftin nu se poate!), semidirect (studiile de piata arata ca obtineti avantaje daca folositi produsul nostru) si non direct (acestea sunt produsele noastre), Alegerea se va face in functie de piata tinta si de rezultatele chestionarului. In cazul nostru am ales modul direct de transmitere a mesajului. Alegerea elementului title Cum trebuie sa arate un element title corespunzator: trebuie sa contina primele doua cuvinte cheie

trebuie sa faca referire la primele 5 cuvinte din site Optimizarea imaginilor Am vazut multe imagini postate chiar pe situri profesionale, dar neoptimizate atat din punct de vedere al rezolutiei si al redimensionarii corecte, cat si tag-ului HTML folosit pentru includerea imaginilor in pagina. Un program free care are optiunile de mai sus, este RIOT (Radical Image Optimization Tool). Nu este singurul free, dar este singurul care are optiunea SaveForWeb.

Adaugarea uni meta-tag corect Se poate face din aceeasi resursa expusa inainte.

In continuare, derulam mai jos si facem setarile pentru limba si celelalte elemente:

You might also like