Blog
12/05/2017

Per què són tan kitsch els dissenys web dels organismes oficials? #1

En algun moment de la nostra existència, tots hem patit el calvari de fer qualsevol tràmit online a través de la web d’un organisme oficial.

La sorpresa arriba quan entrem a la seva pàgina i ens trobem amb un disseny que, sens dubte, està a l’última. Sí, a l’última de la cua.

I la pregunta que ens ve al cap és: què he fet per merèixer aquest càstig? No n’hi ha prou amb pagar la multa, que a sobre he de fer treballs forçats?

En aquesta primera entrega de dissenys kitsch, analitzarem la web de la DGT. Hem posat el GPS a punt per no perdre’ns entre els racons i carrerons del seu portal.

Per als més valents, aquí teniu l’enllaç: DGT

 

Per què el disseny web de la DGT és tan kitsch?

Només cal fer-hi una ullada per veure que ens trobem davant un disseny pensat per marejar. Potser forma part de la seva identitat de marca. Una manera subtil de transmetre al visitant l’essència de la “mala conducció”.

Segons he pogut veure a web.archive.org, la web es va redissenyar fa quatre anys. Tot i així, sembla treta de l’època dels descobriments.

La primera impressió

L’objectiu d’una primera impressió en qualsevol web hauria de ser facilitar a l’usuari la lectura de la informació. Triar què volem que vegi primer i mostrar-ho de manera que, gairebé sense adonar-se’n, la ment de l’usuari navegui àgilment pel contingut. Jerarquitzant, per mantenir l’ordre.

Si ho comparem amb el trànsit, el millor seria una carretera d’un sol sentit, amb les mínimes sortides possibles i, sobretot, bones indicacions.

Sense entrar encara en l’aspecte visual, el primer error que trobem a la web de la DGT, resumint-ho, és un maldecap per al cervell. Tenim a la vista més de 40 enllaços!!!

És com entrar conduint a una ciutat i trobar-te una cruïlla amb unes 40 sortides.

direccions

La segona ullada

Un cop superat el primer ensurt, ens refem de la “bufetada visual”, recuperem el control del ratolí i recordem per què havíem entrat a la web.

De dalt a baix, el primer que trobem és un enllaç de Contacte. No dic que no sigui important, però, no podria estar al menú principal i així ens estalviem aquest link solitari? A més, la tipografia escollida és Arial Regular (sí, força antiquada, però això és el de menys).

La resta d’enllaços utilitzen Arial Narrow, la versió condensada de la mateixa tipografia. Per què el link de contacte ha de desentonar visualment respecte als altres?

 

Tipografies

Tal com hem comentat, s’està fent servir una Arial Regular juntament amb una Arial Narrow. Malament. Això genera un xoc visual entre tipografies.

Si utilitzem tipografies diferents, el millor és crear-hi contrast. Si només en fem servir una, que és totalment vàlid, el millor és jugar amb negretes o cursives, però canviar la condensació dins la mateixa família, normalment, no resulta agradable visualment.

A més, hi ha moltes disonàncies entre mides de tipografia a tota la web. Cada imatge té una mida diferent i, a sobre, moltes estan pixelades. Tot molt romàntic.

 

Marges, paddings i altres elements

Com en el punt anterior, no hi ha cap uniformitat entre els elements pel que fa a marges i paddings. Cada element va per lliure. Ideal per afavorir l’experiència d’usuari que estem tenint.

Els ombrejats fa temps que han passat de moda. Fer-los servir és una bona manera de donar-li un aire antic a la web.

Si ens fixem en les imatges laterals, no queda clar quina imatge volen transmetre. Hi apareixen tres senyors desconcertats fent el gest de Ronaldinho. Potser volen que ens transportem a temps passats.

 

Els bàners superiors

Tenim el logotip del nostre estimat Govern amb un error entre les dues caixetes: hi ha una línia de fons blanc que no arriba fins a dalt; o la traiem o la fem arribar fins a dalt, però aquest error visual és molt lleig. El logotip del Govern fa 60px d’alçada, just al costat el de la DGT fa 51px. Si poséssim tots dos a la mateixa alçada, aniríem millor. I si a més hi deixem espai entre els dos logotips, encara millor.

Just sota el logotip de la DGT, saltant-se la línia horitzontal, hi ha un text de consol a la ciutadania: “a tu lado vamos todos”. Gràcies, DGT.

A la dreta, hi ha dos bàners més. Tots dos, per arrodonir, fan 76,39px d’alçada. Ja posats, podrien haver-hi posat el número π (pi). Tots dos es veuen pixelats i amb mides de tipografia diferents.

 

Els botons de menú

Preciosos. Amb un efecte hover dels més bonics que hem vist fins ara.

Hauria estat bé incorporar un submenú desplegable en passar el cursor per sobre de cada botó, per reduir el nombre d’enllaços visibles a la pantalla.

 

El carrusel d’imatges, twitter i xarxes socials

El carrusel d’imatges no aporta gaire, té un disseny que sembla dels anys 50. De quan encara no hi havia internet. La tipografia està enganxada a la imatge directament. Això és dolent per a la indexació del contingut i feixuc de mantenir des del backend.

El widget amb el feed de twitter, si ha de ser tan petit, millor no posar-lo.

Sobre els enllaços a xarxes socials: cada icona té la seva mida i van sobre un fons gris fosc, suposo que per seguir la “línia gràfica” del menú superior. Vaja, sembla que la línia gràfica només la seguim quan sabem que quedarà malament.

 

Els tres blocs d’enllaços

A la que hauria de ser la part més potent de la web, ens posen un llistat interminable d’enllaços. Alguns amb imatge al costat, d’altres no; alguns amb descripció a sota, d’altres tampoc.

Hauria estat millor reduir el nombre d’enllaços i unificar l’estil pel que fa a ús d’imatges i descripcions.

 

Si seguim cap avall

La cosa no millora. Tot segueix igual. Usabilitat nul·la i visualment estressant. No exagero si dic que he acabat amb el cap embotit a mesura que anava veient la desfilada de despropòsits gràfics.

 

Altres aspectes

  • No és responsive. Podem veure-ho com una manera d’allunyar l’usuari de la temptació d’entrar a la web de la DGT des del mòbil mentre condueix.
  • A peu de pàgina hi trobem un titular que diu “Para personas”. Per si algú es pensava que era per a porcs.
  • Si naveguem pels diferents apartats, veurem que el laberint s’expandeix exponencialment.
  • El codi font de la pàgina és força sorprenent
  • L’etiqueta <!DOCTYPE> no comença a la primera línia, cosa que no és una bona pràctica

 

Conclusions

Si entres a la web de la DGT, et recomanem no haver pres cap copa de més i assegurar-te de portar el cinturó ben cordat. També esperem que, si hi has accedit, hagi estat per error i no per pagar una multa.

 

 

T'ha agradat?
Articles relacionats
Comencem a treballar
en el teu projecte?

Analitzem la teva situació actual i definim el proper pas.

Contacta ara
El nostre lloc utilitza galetes per recopilar informació sobre el dispositiu i la seva activitat de navegació. fent clic aquí.
Acceptar cookies Configurar Rebutjar cookies
Informació bàsica de les cookies
Aquest lloc web utilitza galetes i/o tecnologies similars que emmagatzemen i recuperen informació quan navega. Política de cookies".
Acceptar cookies Configurar
Galetes tècniques necessàries Sempre actives
Les cookies tècniques són estrictament necessàries perquè el nostre lloc web funcioni i puguis navegar-hi.
Cookies de análisis
Las cookies de análisis son las utilizadas para llevar a cabo el análisis anónimo del comportamiento de los usuarios de la web y que permiten medir la actividad del usuario y elaborar perfiles de navegación con el fin objetivo de mejorar los sitios web.
Confirmar preferències
contacta amb nosaltres
Formulari

Explica'ns
el teu projecte

Indiqueu el context general de la vostra organització i l'abast previst del projecte.
Code Barcelona, ​​com a responsable del tractament de les vostres dades, tractarà les mateixes amb la finalitat de donar resposta a la consulta i/o petició que ens realitza a través d'aquest formulari de contacte. política de privadesa.
Title
Popupcontent
Anàlisi de la teva situació digital

Revisarem la teva situació digital actual. Ens posarem en contacte amb tu per entendre el teu context i valorar conjuntament quines àrees analitzar, i posteriorment elaborarem una auditoria amb els punts clau i recomanacions.

Code Barcelona, ​​com a responsable del tractament de les vostres dades, tractarà les mateixes amb la finalitat de donar resposta a la consulta i/o petició que ens realitza a través d'aquest formulari de contacte. política de privadesa.
Aceptar