Pagina 4

Link-urile sunt cea mai importanta parte a internetului, fara discutie. Sunt adrese, destinatii pentru orice colt al internetului. Link-urile reprezinta tehnologia cea mai usor de utilizat si de inteles.

Cu toate acestea, multi design-eri si developer-i se chinuie sa faca link-uri funtionale. Imbunatatirea link-urilor este modul cel mai usor de a creste usabilitatea site-ului, asigurandu-te de o navigare rapida si precisa. 37signals a scris un post despre link-uri marite si cum ele se comporta natural mai bine decat cele mici. Chiar daca pare evident, multa lume nu ia in considerare ce inseamna asta pentru linkurile lor.

Asa ca am adunat la un loc 10 moduri prin care iti poti transforma link-urile in click-uri.

1. Mareste suprafata activa a link-ului, in special la navigare

37signals' analysis of Threadless.com's links

Adaugand padding la link-uri, poti mari usabilitatea lor, marind suprafata click-abila, pentru a include click-urile de tipul near-miss. In navigare, recuperand aceste click-uri care au ratat cu putin suprafata activa a link-ului scuteste cititorul de timp pierdut si de frustrari.

2. Subliniaza link-urile, dar nimic altceva

Prin definitie, browser-ele afiseaza link-urile subliniate, underlined. Oamenii sunt obisnuiti sa vada link-uri subliniate si asociaza tot ce e subliniat cu un link. Adauga underline la link-uri, dar nu sublinia nimic altceva pentru a evita confuzia.

3. Foloseste hover si visited

In timp ce sublinierea semnalizeaza vizitatorului prezenta unui link, schimbarea culorii sau sublinierea la mouseover confirma ca se poate accesa acel link. Starea visited permite vizitatorul sa stie pe unde a fost, scutindu-i timp si click-uri in plus. Mai ales ca-i permite sa-si focuseze atentia si click-urile pe link-urile care nu le-a vizitat inca.

4. Foloseste atributul title

Ai trecut vreodata cu mouse-ul peste un link care are un mic tooltip care-ti spune ceva in plus despre acel link? Acel tooltip este controlat de atributul title care se aplica link-urilor. Aduga valoare SEO link-urilor si poate furniza continut aditional pentru vizitator care ar vrea sa stie mai mult despre acel link.

5. Foloseste o singura culoare, si anume albastru

Din nou, toate browser-ele (IE6, IE7, Firefox, Safari, Opera, etc) afisaza link-urile in albastru si subliniate, prin definitie. Precedentul a fost creat acum multi ani de brewser-e si se confirma si azi: text albastru in continutul textului semnalizeaza un link. Linkurile trebuie sa iasa in evidenta, deoarece vizitatorii nu citesc totul.

Utilizatorii doresc sa-ti gaseasca link-urile, asa ca ajuta-i. Deasemenea, Andy Rutledge ofera cateva sfaturi pentu alegerea culorii, alta decat albastru, pentu link-uri si cum diferite moduri de text decoration (underline, background, etc) afecteaza link-urile.

6. Adauga idici vizuali pentru a atrge atentia

links with icons

Un link simplu care zice “Download PDF” nu este la fel de puternic ca si acelasi link dar cu o iconita de PDF in stanga lui. Este un element care atrage atentia si in acelasi timp informeaza vizitatorul, ca este vorba de un document PDF, fara sa citeasca textul link-ului.

7. Spune vizitatorilor unde se afla

In aceasi ordine de idei, ca si folosirea hover si visited, adauga o stare “active” in navigarea principla pentru pagina curenta. Aceasta ii arata vizitatorului unde se afla, in interiorul site-ului, si furnizeaza contextul pentru continul paginii.

8. Link-uri, interne si externe

Link-urile catre alte pagini din interiorul site-ului si linkuri catre alte site-uri sunt foarte benefice din punctul de vedere al optimizarii pentru motoarele de cautare si ajuta la ghidarea trficului catre site-ul tau. Cel mai important, ele ajuta la crearea link-urilor de tip inbound dinspre site-urile link-uite. Cu ajutorul trackbacks si pingbacks poti urmari site-urile care au link-uri catre tine, mai ales blog-uri. Motoarele de cautare se folosesc de legaturile respective si iti pot creste page rank-ul.

9. Foloseste url-uri human-friendly

Daca e bun pentru oameni, e bun si pentru Google. Folosind o structura a url-urilor usor de retinut si usor de pronuntat ajuta la folosirea lor si in afara internetului. Flickr este unul din cele mai bune exemple ca si structura a url-ul: www.flickr.com/photos/dorobantu/ e usor de tastat, citit si mai ales de trimis la altii.

10. Foloseste contunut in interiorul link-urilor

Incurajeaza vizitatorii sa dea click pe link-urile tale folosind text care deabia asteapta sa fie accesat. “Oamenii asociaza branding-ul cu logo-ul” este un link mult mai bun decat doar “branding” deaorece adauga controversa, mareste dimensiunea link-ului si creaza o declaratie in acealsi timp.

Link-urile sunt fantastice, dar pentru a iesi cu adevarat in evidenta si pentru a functiona bine, trebuie tratate cu putina atentie si considerare. Vizitatorii doresc sa navigheze prin site-ul tau, dar daca le ingrunezi navigarea, sansele sunt mari sa-ti scada traficul.

Asadar, transforma link-urile in click-uri oferindu-le putin mai multa dragoste. Fa acest pas in plus si adauga atributul title, ademeneste vizitatorii cu textul din link si adauga padding.

autor: Mark pe 03 Iunie, 2008
sursa: http://www.zurb.com/article/34/top-10-ways-to-turn-hyperlinks-into-hyper

BraunPrize 2009 International Design Award invita toti designer-ii de produs, care sunt inca studenti sau care si-au incheiat studiile dupa Martie 2006. Conceptele trebuie dezvoltate cu gandul la nevoile utilizatorilor prezentand solutii care-i ajuta in viata de zi cu zi – in casa, la lucru sau la scoala, in timpul activitatiilor sportive sau de relaxare.

BraunPrize 2009

12.000 € in bani, pentru castigator, plus o stagiatura de 6 luni in departmentul de design de la Braun, si cate 5.000 € pentru fiecare finalist.

Deadline: 31 Ianuarie 2009

http://www.braunprize.com/international/braunprize_2.html

colr.org

16May08

Colr.org, un extractor de palete cromatice avand ca baza o imagine. Poate extrage combinatii diferite dintr-o singura imagine, si deasemenea poti adauga culori alese manual, din imagine, la schema gata generata.

colr.org

Exista si posibilitetea salvarii schemei de culoare in formatul .aco ceea ce poate fi de folos mai ales daca “extragi” paleta cromatica de pe alt site (da, are si functia asta si chiar functioneaza bine).

sursa: http://www.colr.org/

Suntem intr-o stare perpetuua de razboi – cu noi insine si cu ecosistemul in care traim. Razboiul perpetuu da nastere la teama perpetua. In contextul actual, aceasta teama izvoraste din dorinta noastra extrema de a fi autentici si se manifesta prin lacoma noastra cultura colectiva de consum.

Designer Gas Masks

In adancul nostru, ne temem ca s-ar putea sa nu fim niciodata multumiti. Aceasta teama este hranita de o arhiva in crestere a miturilor brand-uite. Designer Gas Masks este o incercare de a vizualiza aceasta stare. Pentru ca doar prin a accepta, mai intai si apoi prin a provoca tema vom reusi sa rasuflam usurati.

sursa: http://designergasmasks.com/

Which font is this one here?

Un lamentabil scor 24 la prima incercare; concluzia “back to the books” (a unui prieten care a facut 21… hi hi hi) e categoric valabila si la mine.

the rather difficult font game

sursa: http://ajax.sayitaintslow.com/fontgame/

Adobe Design Achievement Awards 2008 ofera studentiilor din invatamantul superior din intreaga lume, sansa creativa de a-si propulsa cariera in viitor. 12 categorii din 3 tipuri de media aprobate de industrie cu premii in valoare de peste 60$K US ce se vor acorda la NY.

Adobe Design Achievement Awards 2008

Pentru a participa la ADDA 2008 e nevoie sa pregatiti fisierele in format digital, create in principal (peste 50%) cu unelete Adobe, pentru a le upload-a pe site-ul competitiei odata cu dovada statusului de student. Juriul va evalua lucrarile online si va determina daca va fi nevoie si de varianta printata sau de o versiune high-resolution a fisierului digital pentru semifinala. Daca lucrarea este selectata pentru semifinala, veti fi rugati sa trimiteti lucrarea la sediul central al competitiei.

Propunerile se primesc pana pe data de 2 Mai 2008.

http://www.adaaentry.com/submit/

l.e. partea proasta e ca Romania nu e inclusa in lista tarilor acceptate in competitie.

Cine nu are o cana pantone sa-si cumpere. Noutatea e doar pentru mine care dupa o excursie in Copenhaga, la muzeul de design, m-am ales cu o cana pantone. Uraaa!

Pentru cei interesati http://www.w2products.com/products.builder/pantone.html

Get the flash player here: http://www.adobe.com/flashplayer

Trebuie sa recunosc ca prima alegere era Orange 012 C, dar din pacate nu a fost ziua mea norocoasa (exceptand faza ca nu am platit intrarea la muzeu :P), asa ca am ales second best, LimeGreen 388 C.

emmanuel rouzic

Inca un site full screen, dar de data asta a unui fotograf – Emmanuel Rouzic. Doua tipuri de navigare, zoom masiv la fotografii, totul foarte intuitiv si straightforward. Aaaaa, sa nu uitam de sunet.

p.s. observ ca making off-urile au devenit foarte populare, fiecare set de imagini are cate un clip.

sursa: http://www.emmanuelrouzic.com/

Faimosul scaun sub forma de ou, iconicul “Egg chair”, proiectat de arhitectul danez Arne Jacobsen in 1958 si produs de Fritz Hansen isi va lansa a 50-a aniversare in 2008 cu un numar de 999 de exemplare, editie limitata.

Get the flash player here: http://www.adobe.com/flashplayer

Colectia in editie limitata va include in premiera piele intoarsa de culoare maro pe spate si piele maro intunecat in partea frontala. Combinatia sofisticata intre piele intoarsa si piele normala e perfect complementata cu o baza din bronz masiv; lustruita manual pentru a crea un finisaj unic. Baza din bronz se va inchide la culoare, devenind din ce in ce mai frumoasa in timp.

Fiecare din cele 999 de scaune “Eggs” va fi individual gravat, sub perna din sezut, cu un numar unic si cu un text scurt despre istoria si originea design-ului scaunului “Egg”. O carte aniversara, speciala pentru 50 de ani, va acompania fiecare scaun.

sursa: http://www.fritzhansen.com/
via: http://www.notcot.com/

sitepoint logoCea mai detaliata si la zi referinta online despre CSS, dupa spusele celor de la SitePoint, merita cel putin un bookmark.

sursa: http://reference.sitepoint.com/css


Categorii