Cap de afiș în această nouă abordare au fost și norișorii de taguri, așa-numiții “tag cloud”. În comparație cu navigarea convențională, norișorii de taguri nu sunt neapărat o soluție convenabilă sau intuitivă pentru vizitatori. Totuși, dacă sunt folosiți cu cap, pot da acestora din urmă instantaneu o imagine de ansamblu a sitului. Studiile arată că, în medie, nu ai mai mult de trei secunde la dispoziție ca să atragi atenția la un vizitator, ca atare acest aspect devine foarte important.

În esență, norișorii de taguri reprezintă o listă de taguri, clasificate după înțeles, importanță și frecvența cu care apar în articole. Această clasificare se face cu ajutorul dimensiunilor fontului și a culorilor (cu cât mai important este un tag, cu atât apare mai impunător). Dar nu oricum. Există de fapt câteva reguli nescrise, de care ar trebui să țină cont orice maistru Web când decide să insereze un norișor în designul lui.

Tagurile trebuie să aibă relevanță pentru conținutul websitului

Vorbim aici în special de tagurile primare, acelea care vor ieși cel mai tare în evidență. În principiu, pentru a obține efectul scontat (acela de a oferi instant o imagine clară vizitatorului), etichetele din norișori trebuie să fie adevărate cuvinte-cheie ale websitului . Fie că asta se face manual, sau că tagurile sunt generate pe bază de algoritmi, nu este permis să divagăm prea tare de la temă: tagul “comedie” nu are de ce să aibă 25 de pixeli dimensiune pe un sit despre tehnologie. De asemenea, sunt de evitat tagurile similare (publicitate/advertiseri; internet/punctro), atunci când acestea etichetează, în mare, exact aceleași articole.

Culorile sunt tabu

Două trei-culori maxim, aceasta este regula. Un număr prea mare de culori poate face “tag cloud”-ul prea strident, în sensul rău al cuvântului: un kitsch. Poți folosi în schimb tonuri din aceeași culoare așa încât să obții un efect de dispariție în fundal.

Folosește cu încredere gradientele!

Dacă te decizi totuși să folosești culori diferite, o idee ar fi să folosești un gradient. Cu alte cuvinte, alegi două culori și în funcție de relevanța tagului (frecvența cu care este folosit în articole de exemplu), treci lin de la o culoare la alta. Există câteva inserturi (pluginuri) pentru WordPress care pot face asta automat, de exemplu Configurable Tag Cloud.

Numărul de taguri

Deși la început, când norișorii au devenit brusc un curent de design, principiul era cât mai multe etichete, situația s-a mai schimbat între timp. Din lipsă de spațiu, nu are rost să inserezi prea multe taguri (numărul se va determina în concret, în funcție de design), pentru că, de fapt, norișorii nu sunt atât de utili în navigare, cât sunt în identificarea conținutului sitului. Așadar un termen irelevant, scris pe deasupra cu font mic, probabil că nici măcar nu va fi zărit de vizitator. Și atunci, ce ar cerca acolo? În schimb, nu e o ideea proastă să creezi o pagină separată care să conțină lista completă de taguri.

Liste vs. norișori

“Norișorul” din denumire și-a cam pierdut din sens, pentru că “tag cloud”-urile moderne nu mai au neapărat aspectul acela diform de la început. Mulți designeri folosesc acum, în schimb, liste verticale sau șiruri de taguri, în care dimensiunea fontului sau culoarea (sau amândouă) se schimbă treptat de la un capăt la altul, dispărând aspectul neregulat al norișorului.

Altfel spus, nu mai avem acea diferență bruscă mare-mic, deschis-închis, ci o tranziție suavă de la cea mai populară etichetă până la cea mai puțin populară.

A:hover

Pentru cei neinițiați în CSS, acest cod poate că nu înseamnă neapărat mare lucru, dar acușica vă explic. În spatele oricărui sit se află codul propriu-zis și foaia de stil. Dacă conținutul este apanajul editorilor, atunci foaia de stil intră în sarcina designerilor. Cu ajutorul CSS-ului (Cascading Style Sheets, în română, foi de stil în cascadă) se pot face minuni vizuale, și un link, de exemplu, poate fi configurat să iasă în evidență în anumite situații.

Exact la asta se referă pseudo-clasa “:hover“, care dă indicații cum să arate linkul când ne aflăm cu mausul peste el. Ei bine, felul în care arată linkul atunci trebuie să fie total altfel de felul cum arată în mod normal. Asta deoarece oricum tagurile arată foarte diferit între ele, iar ochiului îi trebuie puțin mai mult ajutor ca de obicei să realizeze unde se află mausul pe ecran. O idee bună este schimbarea culorii fontului, de exemplu de la albastru la roșu, sau eventual sublinierea tagului când mausul se află deasupra lui; poate chiar inserarea unui fundal de altă culoare în spatele respectivului tag. Niciodată nu umbla însă la dimensiunile fontului, pentru că aceasta poate strica tot aspectul norișorului la trecerea cu mausul peste el.

Vrei mai mult?

• Pe Flickr, există un set de poze cu norișori de taguri de toate genurile. Poate găsești acolo unul care să se potrivească designului tău.
• Galerie de norișori de taguri: exemple de bune practici, un articol scrise de Vitaly Friedman, editor-șef la Smashing Magazine (revistă online dedicată designerilor și dezvoltatorilor)
• O colecție de instrumente/situri pentru crearea norișorilor de taguri
• Moartea norișorilor de taguri (așa cum îi știam la început), un articol scris de Antonio Lupetti (creatorul comunității de web design Woorkup.com)