Un pas important in proiectarea de interfete web il reprezinta etapa de design. Desi multi ar spune ca mai important este continutul decat o grafica in care iti scalzi privirea cautand un strop de informatie, anii ’90 au trecut de mult. O pagina alba cu ceva text aruncat si 2 link-uri va fi inchisa inainte de a se incarca complet ?, pe cand un site total inutil dar cu o grafica foarte frumoasa va face repede inconjurul lumii odata ce a fost descoperit, chiar daca nu va mai fi vizitat a doua oara de acelasi webber.
In zilele noastre, un desing bun este o adevarata provocare. Si nu ma refer doar la asezare in pagina si culori, ci trebuie considerate o serie de aspecte cum ar fi:
Continut util (nu am zis niciodata ca nu este important)
Rapiditate. Aici ma refer la timpul de incarcare a paginii. Nimeni nu va astepta mai mult de 20 de secunde pentru a se incarca prima pagina a site-ului.
Grafica si ferestrele nesolicitate sunt “bleah”, “caca”, “nu e voie”. Aici vreau sa dau doua exemple de site-uri pe care le-am gasit prin Internet:
1. http://rentmychest.com/ (oh my god! I’m blind! My eyes! My eyes!...)
2. http://webpagesthatsuck.smugmug.com/gallery/6872802_vfkua#439695817_CxSuG-A-LB Site-ul a fost modificat intre timp (oare de ce?), asa ca link-ul duce spre un film in care este prezentata pagina respective in toata Gloria ei. Oricum… cine @#$% a putut sa vina cu o asemenea idee?
Desi conceptul de multitasking a devenit foarte popular, vizitatorii inca nu au acest skill, asa ca informatia trebuie afisata ordonat, curat, usor de urmarit, usor de trecut de la un topic la altul.
Din nou vin cu un exemplu de site scris de cineva care nu a vazut in viata lui o pagina web: http://www.havenworks.com/ .
Prima mea intrebare cand am vazut site-ul asta a fost: “deci, de unde incep sa citesc?”
Exemple de desing slab sunt multe. Idei traznite apar mereu, si apreciez originalitatea unora in a experimenta noi interfete, dar au incercat macar o data sa se puna in locul unui vizitator?
Iata cateva exemple, ca sa intelegeti la ce ma refer:
http://www.cleanishappy.com/ - Nu chiar asa "happy" cand te intampina cu... fundul.
http://www.brillpublications.com/ - Oamenii astia au luat termenul de "usability" prea in serios. Inteleg ca majoritatea vizitatorilor abia stiu sa dea un click, dar chiar sa ne faca retarzi in asa hal?
miercuri, 7 ianuarie 2009
marți, 6 ianuarie 2009
flashu' si seou'
Pana nu demult siteurile flash erau un cosmar daca nu chiar imposibil de indexat pe google...
Vesti bune.
Totul a pornit de aici.
Promisiuni.
De ce asa tarziu? De ce asa putin? De ce atat de greu?
Gogu ne promite ca va indexa si fisierele audio din flashuri, imagini si cam tot ce ne trece prin cap. De ceva timp ne tot amageste, dulce amagire, cu recunoastere de obiecte in imagini. Sa vezi atunci relevanta in cautari.
Acum astea sunt promisiunile. Fiind proaspat trecut peste o campanie electorala mioritica, imi veti intelege reticentele in a crede tot ce mi se promite.
Ce va fi vom vedea; totusi, e un pas inainte.
Vesti bune.
Totul a pornit de aici.
Promisiuni.
De ce asa tarziu? De ce asa putin? De ce atat de greu?
Gogu ne promite ca va indexa si fisierele audio din flashuri, imagini si cam tot ce ne trece prin cap. De ceva timp ne tot amageste, dulce amagire, cu recunoastere de obiecte in imagini. Sa vezi atunci relevanta in cautari.
Acum astea sunt promisiunile. Fiind proaspat trecut peste o campanie electorala mioritica, imi veti intelege reticentele in a crede tot ce mi se promite.
Ce va fi vom vedea; totusi, e un pas inainte.
sâmbătă, 3 ianuarie 2009
Cresterea Internetului in 2008
Internetul creste pe zi ce trece. Din ce in ce mai multe site-uri WEB vad lumina ochilor utilizatorilor in fiecare zi. De aceea o statistica ca cea care va fi prezentata mai jos este foarte interesanta.
Ea ne arata , pentru piata din US, care sunt site-urile cu ce mai mare crestere, raportata la rata de penetrare.
Nu ar trebui sa ne mire astfel faptul ca retelele sociale au inregistrat cea mai mare crestere anul trecut, de aproape 60% fata de 2007. Ele sunt urmate de site-urile foto, video, de jocuri si serviciile de Multimedia. Toate acestea sunt adresate petrecerii timpului liber pe Internet.
La polul opus, site-urile de auto, Travel si Business au inregistrat cele mai mici cresteri. Probabil din cauza crizei...
In ceea ce priveste rate de penetrare, portalurile si motoarele de cautare domina statisticile, cu rate de peste 85%. Cu alte cuvinte, cam toata lumea le foloseste.
In partea de jos se afla site-urle AUTO (surprinzator) si reltele sociale. Asadar, chiar daca retelele sociale cresc exponential de la an la an, rata lor de penetrare este inca destul de mica. Asta deoarece clasele de varsta de peste 30 de ani sunt oarecum reticiente la astfel de aplicatii, preferand mai batranele sisteme de mail.
Ea ne arata , pentru piata din US, care sunt site-urile cu ce mai mare crestere, raportata la rata de penetrare.
Nu ar trebui sa ne mire astfel faptul ca retelele sociale au inregistrat cea mai mare crestere anul trecut, de aproape 60% fata de 2007. Ele sunt urmate de site-urile foto, video, de jocuri si serviciile de Multimedia. Toate acestea sunt adresate petrecerii timpului liber pe Internet.La polul opus, site-urile de auto, Travel si Business au inregistrat cele mai mici cresteri. Probabil din cauza crizei...
In ceea ce priveste rate de penetrare, portalurile si motoarele de cautare domina statisticile, cu rate de peste 85%. Cu alte cuvinte, cam toata lumea le foloseste.
In partea de jos se afla site-urle AUTO (surprinzator) si reltele sociale. Asadar, chiar daca retelele sociale cresc exponential de la an la an, rata lor de penetrare este inca destul de mica. Asta deoarece clasele de varsta de peste 30 de ani sunt oarecum reticiente la astfel de aplicatii, preferand mai batranele sisteme de mail.
duminică, 28 decembrie 2008
Importanta codului in rankarea unui site
Regula de baza pe care cel ce inceraca sa optimizeze un site pentru motorul de cautare este simpla: Bot-ul nu vede ce vezi tu, ci codul din spate.
De aceea pe el nu il intereseaza cat de frumos e site-ul, ci alte aspecte: ce si cata informatie ofera, cat de bine e structurata aceasta si in ce mod, cati citesc si apreciaza acea informatie si multe altele.
Asadar, atunci cand analizeaza o pagina, bot-ul citeste cod pe care apoi il interpreteaza. Bot-ul nu este insa genial. Ne putem gandi la el ca la un copilas de 3-4 ani, de aceea este foarte important ca acest cod sa prezinte informatia pe intelesul bot-ului. Cum facem acest lucru? Respectam o serie de reguli de baza:
De aceea pe el nu il intereseaza cat de frumos e site-ul, ci alte aspecte: ce si cata informatie ofera, cat de bine e structurata aceasta si in ce mod, cati citesc si apreciaza acea informatie si multe altele.
Asadar, atunci cand analizeaza o pagina, bot-ul citeste cod pe care apoi il interpreteaza. Bot-ul nu este insa genial. Ne putem gandi la el ca la un copilas de 3-4 ani, de aceea este foarte important ca acest cod sa prezinte informatia pe intelesul bot-ului. Cum facem acest lucru? Respectam o serie de reguli de baza:
- HTML-ul sau xHTML-ul sunt sfinte atunci cand facem un site care vrem sa rankeze
- folosirea limbajelor ca JS, AJAX, etc nu e recomandata decat pentru portiuni mici din site si doar acolo unde nu pot fi inlocuite cu HTML
- Folosirea FLASH-ului nu este recomadnata deloc (cu toate ca acum bot-ul parseaza SWF-uri, un site HTML si unul FLASH nu vor fi niciodat ape picior de egalitate inf ata bot-ului unui motor de cautare)
marți, 23 decembrie 2008
Importanta Headings-urilor HTML dpdv SEO
Asa cum ziceam intr-un post anterior, bot-ul motorului de cautare este ca un copil micut, caruia trebuie sa ii prezinti totul mura in gura, ca sa priceapa. Un rol in aceasta prezentare il au si mark-up-urile H (headings-urile) din HTML.
Exista un numar de 6 tipuri de Headings-uri, de la H1 la H6. Rolul sau este de a imparti cumva informatia din cadrul unei pagini in titluri si capitole. Sa le luam pe rand:
[h1]Titlu[/h1]
Bla bla
[h2]Subtitlul[/h2]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h2]Subtitlul[/h2]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
*am inlocuit < > cu [ ] din motive de afisare
Desigur, folosirea headings-urile nu este obligatorie, fiind doar unul din factorii care influenteaza rankarea paginii. Insa se recomanda sa fie utilizate, dar cu cap :)
Exista un numar de 6 tipuri de Headings-uri, de la H1 la H6. Rolul sau este de a imparti cumva informatia din cadrul unei pagini in titluri si capitole. Sa le luam pe rand:
- H1 - in h1 trebuie pus tilul paginii sau o scurta expresie care sa sintetizeze continutul paginii. Este obligatoriu sa nu avem mai mult de un tag H1 per pagina.
- H2 - se foloseste pentru a delimita titluri de subcapitole, descrierea succinta a paginii, etc
- H3 - se foloseste acolo unde a cazul pentru a marka captele de tabele in pagina, sub-subtitluri in cadrul unor documente foarte lungi, etc
- H4-H6 - Deobicei nu se folosesc deoarece improtanta lor pentru SEO este mica, dar pot fi folosite.
[h1]Titlu[/h1]
Bla bla
[h2]Subtitlul[/h2]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h2]Subtitlul[/h2]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
[h3]Sub subtitlu[/h3]
Bla bla
*am inlocuit < > cu [ ] din motive de afisare
Desigur, folosirea headings-urile nu este obligatorie, fiind doar unul din factorii care influenteaza rankarea paginii. Insa se recomanda sa fie utilizate, dar cu cap :)
joi, 18 decembrie 2008
Patru. CS Patru.
A venit si era CS4. Adio epoca 2Dflat CS3, traiasca epoca 3Dshine CS4.
Cu ce noutati vine pachetul CS4? Ei bine, multe din ele erau asteptate de ceva timp. Unele lipsesc, dar promit sa apara si ele curand. Pana una alta avem cu ce ne juca:
* 3d transformations
* deco and spray brush
* XMP support (!!)
* bones tool
* motion editor
* HD video support
Toate de bun simt si promitatoare.
Pe cand demult promisul suport pentru placi video? Ei bine...?
Cu ce noutati vine pachetul CS4? Ei bine, multe din ele erau asteptate de ceva timp. Unele lipsesc, dar promit sa apara si ele curand. Pana una alta avem cu ce ne juca:
* 3d transformations
* deco and spray brush
* XMP support (!!)
* bones tool
* motion editor
* HD video support
Toate de bun simt si promitatoare.
Pe cand demult promisul suport pentru placi video? Ei bine...?
luni, 15 decembrie 2008
Cateva trucuri CSS
Voi prezenta aici cateva tehnici de design folosind CSS.
1. Crearea unui meniu pop-up
Pentru un meniu, se pot folosi 2 liste, una pentru bara de meniuri, si cealalta pentru meniurile derulante.
Se seteaza pentru ul.menubar : list-style-type: none;
si pentru ul.menubar li:float:left;
astfel, lista va fi afisata fara bulina de la inceputul fiecarei intrari, iar elementele vor fi asezate unul langa celalalt.
de asemenea lista interioara fiecarui item va fi setata initial cu: display:none;
apoi, la ul.menubar li:hover ul.dropdown se pune display: block;
2. Crearea de text cu o imagine in stanga
p {
background: url(..) left no-repeat;
padding-left: 50px;
}
pentru padding se pune dimensiunea necesara .
Cam atat pentru azi
1. Crearea unui meniu pop-up
Pentru un meniu, se pot folosi 2 liste, una pentru bara de meniuri, si cealalta pentru meniurile derulante.
Se seteaza pentru ul.menubar : list-style-type: none;
si pentru ul.menubar li:float:left;
astfel, lista va fi afisata fara bulina de la inceputul fiecarei intrari, iar elementele vor fi asezate unul langa celalalt.
de asemenea lista interioara fiecarui item va fi setata initial cu: display:none;
apoi, la ul.menubar li:hover ul.dropdown se pune display: block;
2. Crearea de text cu o imagine in stanga
p {
background: url(..) left no-repeat;
padding-left: 50px;
}
pentru padding se pune dimensiunea necesara .
Cam atat pentru azi
Abonați-vă la:
Postări (Atom)
Postări
