Interfete WEB - blogul interfetelor WEB 3.0

Cadouri si ofertele de sarbatori - exista si la noi?

2009-11-16T02:37:00.000-08:00

Ma uitam zilele astea as vad daca exista in Romania site-uri care sa stranga la un loc ofertele si discounturile oferite de magazinele din Romania, astfel incat unui utilizator care vrea sa cumpere ceva, sa ii fie mult mai simple. Asa numitele site-uri de deals ce se gasesc in afara si care sunt foarte cautate in preajma sarbatorilor si cand icnepe sezonul vanzarilor de iarna: Asa numitele Black Friday si Cyber Monday .

De fapt problema la noi nu cred ca tine de lipsa acestor site-uri care sa adune ofertele intr-un loc, ci de doua mari lipsuri.

Unul la mana, ofertele la noi cam lipsesc. Putinele care sunt le vezi doar in magazinele offline, gen Mediagalaxy, Carefour, Diverta, Altex . Cel putin al electronice, aceasta se datoreaza poate si marjei mici de profit, din cauza necesitatii de a tine pretul cat mai mic. Pentru ca la noi nu se cumpara de la un magazin neaparat, ci din locul unde produsul este cel mai ieftin, chit ca e o firma fantoma de cartier.

Si doi, pentru a face un astfel de site e nevoie de mucna si investitii. Investitii care trebuie apoi amortizate, iar atat timp cat la noi nu se cumpara online si exista putien sisteme de marketing afiliat, banii se scot foarte greu. Pentru ca acesta este modelul ce funtioneaza in afara: eu strang ofertele, userul vine si le vede, merge pe site prin linkul meu si le cumpara si apoi eu iau comision (care e undeva intre 1 si 8% pentru electronice).

Noi mai avem insa multe de invatat.

De la ce a pornit tot acest post? De la faptul ca vreau sa imi cumpar un mic netbook computer in luna viitoare si eram curios cam ce preturi au aceste jucarii pe la noi si unde as putea gasi cele mai bune oferte pentru cateva modele din care vreau sa il aleg pe "the one".

2009-01-14T02:41:00.001-08:00

Interface Media Presentation

View SlideShare presentation or Upload your own.

Ce este robots.txt si la ce foloseste acesta

2009-01-13T06:58:00.000-08:00

Atunci cand construim un site, vor exista tot timpul pagini sau categorii din site care nu vrem sa fie gasite de motoarele de cautare din diverse motive. De cele mai multe ori, aceste motive implica un management mai bun al link juice-ului in cadrul site-ului si limitarea numarului de pagini indexate prineliminarea celor care nu aduc un beneficiu sau care au continut duplicat.

Controlul paginilor de indexat se face foarte usor cu ajutorul unui fisier robots.txt ce se urca in root-ul site-ului. Exemple de sintaxa:

User-agent: *
Disallow:

Aceasta regula arata ca toate paginile sunt indexabile de toti botii.

User-agent: Googlebot
Disallow:/*

Aceasta regula arata ca nici o pagina din site nu este indexabila de Googlebot.

User-agent: *
Disallow: */feed/
Disallow: */trackback/
Disallow: /disclaimer/
Disallow: /*?*

Aceasta regula arata ca nicio pagina care se termina in /feed/ nu este indexabila . In plus, directorul /disclaimer/ este si el neindexabil si la fel orice link care contine parametri.

Sintaxa robots-ului este foarte simpla si usor de folosit. Ea nu permite expresii regulate insa cu ceva efort, se poate elimina cam orice tip de pagina de la indexare.

google analytics e cu noi!

2009-01-12T10:42:00.000-08:00

Povestea Adobe+Google=love continua. Episodul de astazi: Google Analytics. E oficial.

Ei bine da, Google Analytics suporta de cateva luni si tracking in flash.

Nu numai ca se poate, dar mai sunt puse la dispozitie mai multe moduri de lucru - bridge sau AS3 mode.
Prima varianta, bridge, se adreseaza webmasterilor care au control complet atat asupra paginilor HTML cat si aplicatiilor Flash din pagini. Ca exemplu se pot da majoritatea siteurilor care au continut mixt.
Cea de-a doua, AS3 mode este destinata celor care au acces numai la aplicatiile Flash. Un bun exemplu aici ar fi pentru dezvoltatorii de jocuri flash care sunt apoi lansate pe siteuri multiple.

Mai multe detalii despre implementare si utilizare aici.

Frumusetea e ca poti apela cand vrei codul de tracking, ceea ce inseamna ca practic posibilitatile sunt nelimitate. Hint: GUI hot-spots mapping. Feng-gui anyone?

Si uite asa intram intr-o noua era a usability-ului.

SEO - etic sau nu?

2009-01-11T06:37:00.000-08:00

SEO si SEM-ul sunt ocupatia mea de zi cu zi. De multe ori insa am fost intrebat daca ceea ce fac eu este etic. De ce? Pentru ca optimizarea pentru motoarele de cautare inseamna intelegerea unui algoritm si exploatarea sa. De aceea si cei mai buni oameni in acest domeniu sunt la origine ingineri sau programatori.

Insa, ca sa raspund la intrebare, consider ca SEO-ul este un domeniu pe cat de etic vrei tu sa fie, pentru ca depinde de multi factori. Cu cat algoritmul din spatele motorului de cautare este mai inteligent, cu atat si optimizarea este mai etica.

De ce? Pai sa vedem ce intelegem prin etic: tot ce nu inseamna spamming, stuffing, farming, scraping etc. Asadar, tot ceea ce ajuta site-urile tale sa creasca dar nu intr-un mod abuziv. Insa, daca vom lua ca exemplu google.ro vom observa ca metodele conventionale sunt usor combatute de unele ce tind e aria Gray-SEO. De ce? Pentru ca algoritmul este prost, spam-ul merge inca la greu si nu e penalizat, la fel si content scrapping-ul si mutle altele. Asadar, daca vrei sa ai rezultate pe google.ro trebuie ca de multe ori sa lupti cu aceleasi arme. Cu riscul de a fi penalizat candva... Sau sa astepti sa fie penalizati ceilalti si atunci sa iesi si tu deasupra. Insa asteptarea nu tine de foame :P

Interfete Web - Creativitate la limita imposibilului

2009-01-07T14:21:00.000-08:00

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?

flashu' si seou'

2009-01-06T15:06:00.000-08:00

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.

Cresterea Internetului in 2008

2009-01-03T06:20:00.000-08:00

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.

Importanta codului in rankarea unui site

2008-12-28T06:43:00.000-08:00

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:

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)

Importanta Headings-urilor HTML dpdv SEO

2008-12-23T01:02:00.000-08:00

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 - 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.

Dpdv sintactic, structura codului HTML a continutului unei pagini ar trebui sa arate astfel:

[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 :)

Patru. CS Patru.

2008-12-18T16:56:00.000-08:00

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...?

Cateva trucuri CSS

2008-12-15T01:22:00.000-08:00

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

Ne indreptam spre era WEB 3.0?

2008-11-05T01:19:00.002-08:00

Ne indreptam cu pasi inceti dar siguri catre WEB 3.0 . Ce inseamna acest termen si ce va schimba el fata de WEB 2.0 , puteti afla din cadrul acestui post.

Intr-o lume WEB dominata de Blog-uri, retele sociale si site-uri de multimedia sharing, WEB-ul 3.0 se va distinge in cativa ani cu o serie de aplicatii ce vor putea fi caracterizate de urmataorele cuvinte: "interactivitate" si "customizare".

Asa cum declara si Eric Schimdt (CEO-ul Google), site-urile WEB 3.0 vor fi ca un fel de puzzle. Un puzzle in care userul va putea sa isi customizeze cu atentie fiecare particica si sa o faca sa arate asa cum doreste el si sa ii afiseze datele pe care le doreste.

Ca tipuri de aplicatii, cred ca se vor distinge si dezvolta tot mai mult:
- servicii conexe pentru site-uri mari dezvoltate pe baza unor API-uri
- site-uri interactive care sa implice actiuni cat mai complexe din partea userilor
- site-uri mai "destepte", care vor invata din comportamentul userilor, vor fi sprijinite de argoritmi genetici sau cautari semantice, etc
- site-uri mai usor de folosit si mai bine indreptate pe nevoile userilor: exemple: agregatoare si aplicatii menite sa satisfaca doar niste nise

Cand vor aparea aceste tipuri de aplicatii inca nu stim, dar cronologic, perioada WEb-ului 3.0 se spune ca ar fi undeva intre anii 2009-2013. Asadar, ne indreptam cu pasi mari spre Web-ul 3.0

Ce este WEB 2.0?

2008-11-05T01:19:00.001-08:00

Ce este WEB 2.0 ? E greu de gasit o definitie, insa daca ar fi sa il caracterizam printr-un singur cuvant, WEB-ul 2.0 este "simplu". Atat de simplu incat oricine il poate folosi, de la copilul de 5 ani la bunelul de 70.

Site-urile asa zis web 2.0 ne intampina cu o grafica foarte aerisita, cu fonturi bine spatiate, butoane mari si elemente artistice destul de discrete dar bine conturate. Coloristica este bine studiata si sprijina scopul site-ului.

Site-urile WEB 2.0 prezinta informatii diverse, cu suport foto si video si multimedia. Ele ajuta userii sa gaseasca ceea ce au nevoie cu usuritna si sa navigheze si mai usor.
In plus, site-urile WEB 2.0 sunt interactive. Ele permit userilor sa faca diverse actiuni: de la banalele comentarii pana la customizarea interfetei grafice in functie de preferinte.

Tipurile de site-uri exponentiale pentru modelul WEB 2.0 ar fi:
- site-urile de video sharing: youtube, metacafe, trilulilu
- site-urile de photo sharing: flickr, picasa
- blog-urile
- comunitatile sociale (myspace, facebook, hi5)

In prezent, ne indreptam cu pasi destul de mari catre o era urmatoare: Web 3.0 .sau poate 2.5 . Despre ce ne rezerva el, intr-un post viitor.

Tehnologii WEB moderne

2008-11-05T00:45:00.000-08:00

A trecut vremea cand interfetele WEB erau concepute in HTML simplu. In prezent, o interfata WEB moderna este un amalgam ordonat de tehnologii diverse, printre cele mai importante fiind urmatoarele:

XML - date structurate

Formatul XML este o colectie de reguli si tag-uri care iti permit strcturarea datelor in diverse forme web-friendly.

XHTML - extensible HTML

eXtensible HyperText Markup Language, este urmasul limbajului de mark-up HTML, avand in mare aceleasi caracteristici dar o sintaxa mult mai stricta. Rolul sau este standardizarea documentului final si afisarea sa corecta pe majoritatea browserelor.

CSS

Cascading Style Sheets - CSS : este standard-ul clasic folosit la formatarea continutului unui document HTML . Continutul CSS poate fi introdus in cadrul documentului HTML, sau, mai bine, in documente separate cu extensia .css care vor fi atasate in head-ul documentului.

JavaScript

JavaScript este limbajul de programare orientat pe obiecte folosit in cadrul web-ului. el este utilizat atat in constructia de diverse elemente in cadrul unui site web (autocompletere, autosugestion-uri, selecturi, etc) dar mai ales pentru capabilitatea sa de a incastra diverse elemente non-web in cadrul site-urilor sau a aplicatiilor WEB în cadrul aplicaţii non-web.

AJAX

AJAX (Asynchronous JavaScript) este intr-un fel simbolul Web-ului 2.0 . Cunoscut ca o colectie de tehnologii folosite la crearea paginilor web, este este utilizat pentru a face interfetele web mai prietenoase si mai animate. Ajax-ul schimba datele cu serverele din spate si la afiseaza in pagina real-time, fara a fi nevoie de un nou refresh al paginilor. Astfel, usabilitatea, usurinte de folosite si viteza de access la o pagina web cresc si experienta userului este mai placuta.

XML Path Language

2008-11-03T07:32:00.000-08:00

Voi discuta in acest articol despre limbajul XPath.

Ce este XPath?

Pe scurt, este un limbaj prin care se pot selecta noduri dintr-un document xml dupa mai multe criterii, sau pentru a calcula valori.

De ce este util?

In primul rand, informatia se poate extrage foarte usor, folosind un model de adresare a elementelor din documentul xml foarte simplu.
Ofera un mare grad de abstractizare.

Cu ce difera de alte tehnologii de parsare a documentelor xml?

Diferenta cea mai mare o reprezinta faptul ca XPath foloseste un mod de adresare a elementelor bazat pe un traseu de la radacina pana la elementul cautat, la fel cum ai indica unei persoane cum sa ajunga intr-un anumit loc.

Ce este XPath injection?

Este un atac care exploateaza site-uri ce construiesc cereri XPath din input-ul utilizatorilor. Astfel, in lipsa unei verificari a datelor introduse de acestia, un utilizator malicios, poate insera cod XPath in datele introduse, cod ce va ajunge sa fie executat si poate compromite sistemul.

Unde pot afla mai multe despre aceast limbaj?

Exista foarte multe resurse pe Internet. Cateva dintre ele sunt:
http://www.w3.org/TR/xpath
http://www.w3schools.com/XPath/default.asp
http://www.mulberrytech.com/papers/XPath-2-0-User-Grp-HTML/contents.html