Els 25 punts clau de la usabilitat digital

La usabilitat digital o experiència d’usuari dins d’una web és un factor molt important que cal considerar quan ens plantegem un projecte de disseny i desenvolupament o volem llançar un negoci en línia.

# Secció 1: Accessibilitat

Aquesta secció no només conté els problemes d’accessibilitat tradicionals, sinó tot el que pugui impedir que un visitant pugui accedir a la informació en un lloc web. Si ningú no pot carregar el contingut del nostre lloc, o si la tipografia és massa petita per llegir-la, tota la facilitat dús del món no importarà.

1- El temps de càrrega de la web és raonable

Si un lloc triga molt a carregar-se, la majoria de la gent simplement se n’anirà. Sí, molts de nosaltres tenim ara fibra òptica, però això també fa que la nostra paciència sigui menor. La velocitat de càrrega no només millora el posicionament orgànic, sinó que ajuda a millorar lexperiència de lusuari. Avui dia estem acostumats a les pàgines ràpides, i cada cop tenim menys paciència. El nostre suggeriment i el de Google pagespeed és que una pàgina web s’hauria de carregar en menys de 2 segons.

2 – Contrast del text amb el fons

El disseny és un aspecte molt important quan parlem de la usabilitat digital. El color gris fosc sobre gris clar pot semblar elegant però no és còmode de llegir. La majoria d’usuaris no es deixaran la vista per llegir el nostre bloc si no els resulta agradable. Els ulls dels nostres usuaris i els seus monitors varien enormement dels uns als altres, així que hem d’intentar mantenir contrastos alts per facilitar-los la lectura. L’antic negre sobre blanc continua sent la millor opció.

3 – Grandària de la font i espaiat entre caràcters

Les opinions varien sobre la mida ideal per al text, però és fàcil caure en lerror dutilitzar un text massa petit. La mala lectura augmenta la frustració i la frustració condueix a l’abandonament del lloc, cosa que ens pot augmentar la nostra taxa de rebot o Bounce Rate.

A més, ens hem d’assegurar que l’espai entre línies sigui adequat: l’espai en blanc és el millor amic de qualsevol dissenyador, i com em deien a la universitat de disseny, hem de deixar que els elements respirin per crear bones composicions.

4 – Ús de Flash

No importa com de bé que quedi la teva web a nivell estètic, la gent no esperarà 5 minuts perquè es carregui un complement ( Tip: No feu servir sliders! ). Com hem esmentat abans, tota pàgina que carregueu en més de dos segons és dolenta i per tant, només hem d’utilitzar insercions amb animacions o funcionalitats específiques en alguns punts de la web i quan realment millorin els nostres objectius. Adherir-se a l’estàndard HTML/CSS és un punt a favor per als motors de cerca i fa que les webs carreguin ràpidament.

5 – Etiquetes ALT per a imatges

Avui dia, no només els visitants amb discapacitat visual usen etiquetes ALT, sinó que els motors de cerca els necessiten per entendre el contingut de les nostres imatges. Això és especialment important quan utilitzem imatges per a contingut clau, com els elements de menú ja que els motors de cerca encara no poden reconèixer el contingut de les imatges.

– Pàgina 404 personalitzada

Si no existeix una pàgina al vostre lloc, o tenim algun enllaç trencat, una pàgina en blanc amb «404 No trobat» és una bona manera de perdre un client. Si creem una pàgina 404 personalitzada, preferiblement una que informi que la pàgina que estava buscant l’usuari no existeix però a més guiï als seus visitants a altres parts de contingut que poden ser rellevants, això incitarà la persona a seguir navegant per la nostra web i així no ho perdrem. També ens podríem plantejar afegir un copy amb un to d’humor cert ja que aquest és un moment d’alta fricció per a l’usuari i així treballaríem el nivell de frustració.

# Secció 2: La identitat

Una pregunta clau quan algú arriba per primera vegada al teu lloc web és «Qui ets?» És important respondre aquesta pregunta ràpidament i fer que els camins a les següents preguntes òbvies «Què fas?», «Per què he de confiar en tu?», Etc. siguin clars i fàcilment reconeixibles, ja que sinó correm el risc que l’usuari es pugui generar una impressió dolenta de la nostra empresa, especialment si la seva intenció és de compra.

7 – Logo

Hem de col·locar el nostre logotip o marca on sigui fàcil de trobar, i això generalment significa col·locar-lo a la part superior esquerra de la pantalla. La gent espera trobar-lo allà, i els agrada quan els facilites la vida afegint un enllaç que porti a l’homepage de la nostra web, ja que així els nostres usuaris estaran contents i per tant millorarà la seva experiència dins la web.

8 – El Tagline, deixa clar el propòsit de la companyia

Respon «Què fas?» amb un eslògan descriptiu. Hem d’intentar evitar l’argot o ús de vocabulari tècnic, intentant reduir la nostra proposta de valor a unes poques paraules. Això també és un avantatge per a SEO ja que ajudem a entendre a què ens dediquem i quina és la nostra oferta. És molt important no obviar res, ja que l’usuari no ens coneix tan bé com ens coneixem nosaltres mateixos.

9 – Entendre la Homepage en 5 segons

En usabilitat digital, sovint parlem de la regla dels 5 segons. Hi ha una mica de desacord sobre la quantitat de segons que es necessiten per poder interioritzar una homepage, però els usuaris del nostre lloc web necessiten obtenir lʻessència bàsica de la pàgina dʻinici en uns pocs segons.

10 – L’About o Qui som

La bona i antiga pàgina «Sobre» pot semblar avorrida, però generar confiança és fonamental en qualsevol web. Els usuaris necessiten una manera fàcil d’aprendre més sobre les persones que hi ha darrere del nostre projecte, ja que al final les persones volen poder tractar amb altres persones i aquest punt s’ha perdut una mica a conseqüència de l’ecosistema digital on ens trobem.

En definitiva, si algú vol comprar productes, pagar per una subscripció o establir una relació comercial, vol saber quines persones estan darrere del projecte i quines referències tenen.

11 – Contactar

De la mateixa manera que al punt anterior, els visitants volen saber que poden posar-se en contacte amb nosaltres ràpidament. És molt difícil per no dir impossible crear una relació comercial si ningú no ens pot contactar de manera fàcil i intuïtiva.

Preferiblement, hem d’incloure el nostre enllaç de contacte a una part de la nostra web que es mostri en tot moment, com podria ser un menú sticky. També és una pràctica habitual donar el màxim de possibilitats i afegir-les a totes les pàgines de la web. Telèfon, formulari, correu o adreça física.

# Secció 3: Navegació

Quan els usuaris ja saben qui som i el que fem, necessiten camins clars cap als diferents continguts de la nostra web que els poden interessar. L’arquitectura de la informació és un tema enorme però aquests punts cobreixen alguns dels conceptes més bàsics.

12 – Navegació principal

Gairebé totes les webs han tingut un menú principal des que els primers navegadors van sortir al mercat. Hem de fer que la navegació principal sigui fàcil de trobar, llegir i fer servir. Si tenim dues o més àrees de navegació, hem de deixar clar per què són diferents, no només per guiar els usuaris, sinó per deixar-los clar quina és l’estructura de la nostra web.

13 – Les etiquetes de navegació han de ser clares i concises

No cal posar «Comuniqui’s amb el nostre equip» quan «Contacti’ns» funciona perfectament. La navegació principal ha de ser breu i fàcil d’entendre pels simples mortals.

14 – Número raonable d’elements com botons i enllaços

Als psicòlegs els agrada discutir sobre la quantitat d’informació que podem processar, però si passem dels 7 o més elements del menú, hem de reflexionar detingudament si realment els necessitem. Si tens 3 capes de menús a Javascript, fes-te un favor i comença de nou amb una aproximació més simple.

15 – Link del logotip a l’homepage

Ho avançàvem al punt 7. El logotip de lempresa que normalment ha danar col·locat dalt a lesquerra ha de contenir un enllaç la pàgina dinici. La gent ho espera, no els generem frustració innecessària.

16 – Els enllaços han de ser coherents i fàcils didentificar

L’enllaç ha d’anar subratllat ia poder ser de color blau ja que és un element bàsic de qualsevol web.

Una petita llicència artística està bé, però hem de considerar almenys fer que els enllaços siguin d’un color que contrasti suficientment amb la nostra web o que estiguin subratllats. Els enllaços han de sobresortir i hem d’usar-los amb prou moderació perquè no interrompin el flow del nostre contingut.

17 – La cerca del lloc ha de ser fàcilment identificable

Si volem posar un cercador a la nostra web, primer ens hem d’assegurar que sigui visible. Les pautes d’usabilitat digital apunten que la majoria d’usuaris prefereixen trobar el cercador a la part superior dreta de la pàgina. Hem d’intentar mantenir el botó simple i clar: El clàssic «Cerca» encara funciona molt bé per a la majoria dels llocs.

Un estudio de Deloitte (2025) revela que las empresas con estrategias digitales integradas obtienen un 23% más de rentabilidad que las que operan con canales aislados. — Fuente: Deloitte Digital, 2025

# Secció 4: Contingut

Segur que ho has sentit abans, “el contingut és el rei”. No obstant això, si no vols que el regne s’enfonsi, el contingut ha de ser coherent, organitzat i fàcil d’entendre. Es pot aplicar el mateix per a la usabilitat. No sols hem de tenir contingut de valor, sinó que aquest ha de ser fresc i rellevant.

18 – Les capçaleres principals han de ser clares i descriptives

La majoria de les persones no llegeixen una web completa sinó que es dediquen a fer una ullada. Per tant, hem d’usar correctament les capçaleres per diferenciar el contingut i mantenir-lo organitzat. Les capçaleres han de ser clares i, perquè beneficiïn el SEO del nostre site, és imperatiu fer servir etiquetes de capçalera (< H1> ,< H2> , etc.).

19 – El contingut crític és abans de l’scroll

El «fold» és aquesta línia imaginària on la part inferior de la pantalla talla la pàgina. El contingut pot estar per sota del «fold» i l’usuari haurà de fer un scroll down per veure’l, però qualsevol aspecte crític per entendre qui som o el que fem (especialment a la pàgina d’inici) ha d’estar localitzat en aquesta primera pantalla. La resolució mitjana de pantalla actualment sol ser daproximadament 1024×768 en navegador, depenent de la nostra audiència.

20 – Coherència en els estils

Hem d’assegurar-nos que les persones sàpiguen que encara són a la nostra web sent constants amb l’estil; si els confonem els perdrem. El disseny, les capçaleres i els estils han de ser consistents a tota la web, i els colors generalment han de tenir el mateix significat. No hem de fer servir capçaleres vermells en una pàgina, enllaços vermells en una altra i text vermell en una altra part ja que això pot portar a la confusió.

21 – Negreta

És un fet de la cognició humana: Si intentem cridar massa l’atenció, podem caure en l’error de portar l’atenció al no-res. Tots hem vist aquesta web, que té molts elements acompanyats per un vermell, parpellejant, subratllat on posa «NOU!» això al final crea una sensació de confusió i no ajuda més que a distreure’ns de l’objectiu principal que és la conversió .

22 – Anuncis i pop-ups que no molestin

Els anuncis són una realitat en el nostre dia a dia, però els que realment funcionen molt bé són aquells que estan perfectament integrats a l’experiència de la nostra web. No hem de cometre lerror de de forçar anuncis i finestres emergents o pop-ups per força.

A més, si ens preocupa la nostra audiència, hem de deixar clar que són anuncis i que és contingut. Si desenfoquem massa la línia entre els anuncis i el contingut, els nostres usuaris poden confondre’l i afectar la usabilitat de la nostra web.

23 – Hem de ser concisos i explicatius

Aquesta no és una lliçó sobre redacció de textos publicitaris, però si analitzem la nostra pàgina inicial.

Podem dir el mateix amb la meitat de paraules? Si tractem de ser concrets i descriptius i evitem l’argot això beneficiarà molt la usabilitat de la nostra web: a ningú no li interessa si podem «aprofitar les seves sinergies».

24 – URLs User friendly i significatives

Aquest és un punt de debat, però les URL significatives basades en paraules clau són generalment bones tant per als visitants com per als motors de cerca. No hem de tornar a dissenyar un lloc del tot només per obtenir noves URL, sinó fer tot el possible perquè siguin descriptives i amigables.

25 – Títols autoexplicatius

Més important encara, són els títols de la seva pàgina (a l’etiqueta< TITLE> ) hem de ser descriptius, únics i no estar plens de paraules clau. Els títols de les pàgines són el primer que els visitants i els motors de cerca veuen, i si aquests títols no tenen sentit o semblen spam, passaran de llarg posicionant-nos per sota dels nostres competidors.