En aquest webinar t'ensenyem conceptes i fonaments de disseny web i usabilitat, mostrant diferents processos en la creació web. En aquest webinar, impartit per Juanmi Barea, especialista UX de Nominalia, ens posarem fil a l'agulla per ensenyar algunes tècniques i procediments que t'ajudaran a crear una pàgina web de qualitat, seguint els estàndards. Resoldrem en directe diversos problemes habituals, ensenyarem eines útils i mostrarem exemples de bones pràctiques.
Enregistrament del webinar
PROFESSOR
Joan M Barea
Dissenyador UX
a Nominalia
DATA
10 maig 2013
TEMPS
16: 00h
DURADA
60min
Responem totes les teves preguntes!
Hola, aquí estem… Juanmi, què vol dir especialista UX?
Hola, UX són les sigles de “user experience” és a dir, experiència de lusuari. L'UX depèn no només dels factors relatius al disseny com ara usabilitat, disseny d'interacció, accessibilitat, disseny visual, qualitat dels continguts, cercabilitat i utilitat; sinó a més d'aspectes relatius a les emocions, sentiments, valor de marca i confiança transmesa, entre d'altres. L'especialista UX estudia, valora, aconsella i, si cal, realitza el disseny web tenint en compte tots els factors enumerats per contribuir a optimitzar una pàgina web apropant-la a l'excel·lència.
Puc aplicar aquests conceptes al meu bloc?
Quan és convenient utilitzar un bloc o una web? Una web millor per a una empresa de serveis? Ho dic pel tema famós de web 2.0.
Aquesta pregunta engloba moltíssims punts a comentar pel que jo em centraria en el tipus de contingut: una web per a un contingut que es prolonga estàtic en el temps (s'actualitza poc i compleix un objectiu informatiu corporatiu i de producte) un bloc per a un contingut actualitzat amb freqüència (un objectiu més centrat en la novetat informativa i la interacció). Pel que fa al 2.0, entenc que les eines per a bloggers actuals estan totalment al dia en aquest sentit i ho preguntes per això, però pots tenir una web pròpia amb tots els ajustaments necessaris per facilitar la interacció. Si es tracta d'una web per a una Pime, jo t'animo que creïs la web corporativa i vinculis un bloc que et generarà trànsit cap a la web principal.
Per llançar un magazine digital, què creieu que és millor, un lloc web clàssic o un bloc?
La meva web té el fons negre. Això pot ser contraproduent?
Tot i que el tema del color comporta un factor psicològic evident i el negre s'associa a allò negatiu, en realitat, en aquest cas, no és així. Entenc que moltes pàgines amb fons negre tracten temàtiques “undergrounds”, com el món esotèric o el del hacking, però la veritat és que una web amb fons negre/fosc ben combinada dóna una imatge d'elegància i en general contribueix positivament.
Veus recomanable un disseny minimalista i amb fons blanc? Aclareixo, serà una web de tecnologia.
Excepte en pocs casos, una web amb un disseny net i minimalista sol ser sinònim dèxit. La simplicitat ajuda a molts camps de l'UX i això és bo. Si l'empresa és de tecnologia, transmetràs una imatge de qualitat. Si el que vols és disposar d'un catàleg de productes, vés amb compte, pots córrer el risc de donar una imatge de producte costós.
Hola. Com ajuden les xarxes socials al posicionament de la pàgina?
Fonamentalment l'aparició en diferents mitjans (xarxes socials vinculades a la teva web principal) contribueix a guanyar llocs a l'índex de google, sempre que aquestes xarxes estiguin actualitzades i aglutinin un nombre de paraules clau suficient (la història de sempre). Amb la irrupció de Google+ es posa de manifest la importància actual de tenir un perfil a Google, ja que ajuda de manera indirecta a aquest posicionament.
Tindrem un webinar de SEO on s'explicarà molt millor tot això, jo humilment, no m'atreveixo a anar més detalladament en no tractar-se de la meva especialitat. Espero, almenys haver-te orientat una mica 🙂
Bona tarda. Quins estàndards són els que faciliten quin tant de vídeo, àudio, fotos es puguin veure a tots els navegadors, fins i tot per als smartphones?
Si parlem de multimèdia i adaptabilitat, he d'esmentar SMIL (Synchronized Multimedia Integration Language) basat en XML. És una mica avançat per als temes que hem tractat avui. T'invito a visitar la pàgina de w3c on tracta detalladament això i trobaràs tota la documentació necessària.
http://www.w3.org/standards/webdesign/audiovideo
Últimament em demanen web amb una gran sobrecàrrega d'imatges, deixant de banda text. Això és mala pràctica?
Sense text no podràs posicionar bé la pàgina, és una pràctica dolenta. Si la web no té com a objectiu ser trobada, és a dir, podria tractar-se d'una web pensada per ser un mostrari o catàleg que ensenyar a uns determinats clients no hi hauria cap problema, però sincerament desaconsello l'absència de blocs de text.
Hi ha regles específiques per fer els esbossos?
Sí, cada element ha de complir uns requisits per ser comprensible, per exemple, el títol en gran, subtítol més petit (H1, H2 i la seva jerarquia) imatges representades per quadre amb dues diagonals creuades… Si et fixes a la presentació hi ha una imatge d'un wireframe que respon bé la teva pregunta.
Quina altura he de deixar a la part de la capçalera?
Per a una pàgina web dun petit hotel és bo posar imatge de persones com comento al principi? Quin seria el disseny ideal?
Generalment una imatge de persona ajuda, com hem dit a la presentació. No hi ha un disseny ideal per a una web d'un hotel, però segurament hi ha un disseny ideal per a la web del teu hotel, això depèn dels teus objectius, planteja't què vols aconseguir, com vols captar la gent i què busquen. Després centra't en quins canvis abordar per arribar a aquests objectius. Si vols donar una imatge amable i de proximitat posa una imatge de persona, però no oblidis que probablement el que entra a la teva pàgina vulgui trobar ràpidament les tarifes i les imatges de les habitacions i instal·lacions, per aquest ordre. No oblidis tenir sempre a mà i molt visible un espai per a les reserves (a les webs relacionades amb turisme normalment són quadres situats a l'esquerra de la pantalla). Però insisteixo el disseny ideal pel teu hotel ho tens tu i només tu al teu cap. Ànim!
Hola, és millor estructurar una pàgina web en format 16:9 o 4:3?
Hola, bé, resulta que aquests formats responen a formats de vídeo. El web respon a formats de resolucions de pantalla, és a dir, independentment del format de vídeo del teu monitor. Per entendre'ns i donar-te una resposta directa: t'aconsello que facis servir un màxim de 960px d'amplada a la teva web, és el format més compatible actualment, encara que ja hem començat a treballar amb el del 1200 aprox. Aquestes dades són extretes de les estadístiques globals de navegació.
Hola, bones, no sé si arribo a temps per preguntar… Quina és la mida estàndard d'una web? Ample, alt…?
No podeu fer una pàgina d'exemple? i… 16. Fareu un taller de Cloud Site?
Fa uns dies vam fer un webinar sobre el Cloud Site i vam crear una pàgina en directe. Et convidem a veure el vídeo: https://www.escueladeinternet.com/cloud-site-el-editor-web-de-ultima-generacion
De totes maneres i si esteu interessats no hi ha problemes a fer un dia un webinar creant una pàgina des de zero.
No és millor utilitzar imatges animades per cridar l'atenció dels usuaris?
Hola, em recomanes utilitzar flaix a la web?
La meva web està feta en flash i és molt més vistosa, per què no s'ha parlat del Flash?
No he entès que és exactament acció-CTA.
Com a fanàtic que és Juanmi a UX, quin web ens recomanaries com un exemple a seguir?
Jo sóc molt fan de “a list apart” un grup de gurus en què tots els UX ens fixem. http://alistapart.com/topics i per estar al dia d'una manera més mundana http://uxdesign.smashingmagazine.com
Ets partidari de fer servir molts elements Ajax en el disseny de pàgines, o més aviat pocs?
Com sempre dic “tot en la seva justa mesura” uns efectes a través de javascript sigui quina sigui la llibreria utilitzada et poden donar un toc elegant i distintiu. Ara bé, si combines i abuses repercutirà, no només a la imatge de la teva web que semblarà més amateur per una possible combinació de scripts redundants, sinó al temps de càrrega i això ja són paraules grans. Scripts com a ajax sí, però amb cap.
El que comenten està relacionat amb el disseny de la web, però com anar actualitzant o ficant contingut a la nostra web una vegada creada?
Recomanes separar la pàgina principal del teu domini del que seria el bloc? És a dir si recomanes una pàgina de presentació abans d'entrar al bloc.
No sé si entenc bé la pregunta. Tu tens un bloc i em preguntes si és bo posar una pàgina d'aterratge al teu domini i d'aquesta saltar al bloc posteriorment. Si és això, no veuria una justificació clara, la presentació la pots incloure a la portada del bloc, pots aconseguir diferenciar la pàgina principal de la resta de pàgines secundàries sense necessitat de fer aquest tipus d'intervencions. No ho recomano tret que hi hagi una motivació de pes que ho justifiqués.
M'agradaria saber més per què no és bona anada justificar textos, és qüestió de màrqueting?
En general i sempre parlant de l'ÀMBIT WEB, els textos justificats dificulten la llegibilitat i l'accessibilitat. No és qüestió de màrqueting sinó d'usabilitat pura. El text justificat compleix unes funcions molt concretes en el seu ús editorial que no estan justificades al món web. És una bonica discussió (i antiga) ja que és una de les vegades que de manera més clara es contraposen els principis de disseny visual amb el de disseny d'usabilitat. Hi ha molts articles al respecte a internet que així ho proposen i també, per descomptat, els detractors d'aquest principi. El debat és obert 🙂
Com està demostrat que els textos justificats en dificulten la llegibilitat?
Especific de nou: Dificulten la llegibilitat al ÀMBIT WEB.
Com he comentat abans, és una discussió bonica. S'han fet multitud d'estudis des de fa anys sobre la llegibilitat, i el text justificat és un dels punts forts d'aquests estudis. Aquí un d'ells dut a terme a la universitat de Wichita (USA) http://psychology.wichita.edu/surl/usabilitynews/72/columns.asp
Com que gairebé tot és discutible i això és part de la riquesa d'aquest ofici, les coses no són quadrades ni exactes al 100% i cada cas requereix un petit estudi, heus aquí la justificació (no de text sinó…) del meu ofici, però hi ha certs principis que com a especialista en UX he d'acceptar com a vàlids en molts dels casos.