èmfasi

Marketing online i nous mitjans

Telefon d'Èmfasi 937278606

Estic interessat

L'enviament d'aquest formulari implica l'acceptació de la nostra política de protecció de dades.

Disseny web Responsive (per a dispositius mòbils)

Està la teva web adaptada als actuals dispositius mòbils? Ofereix teu lloc web, una bona experiència als teus clients des d'un Smartphone o una tauleta?

Està la teva web adaptada als actuals dispositius mòbils? Ofereix teu lloc web, una bona experiència als teus clients des d'un Smartphone o una tauleta?

Què és el disseny web responsive?

El disseny web adaptable o responsive design és l'aplicació de diferents tècniques avançades de disseny que ens permet estructurar els continguts de formada adaptada a multitud de dispositius: smartphones, tablets, netbooks, portàtils, pantalles panoràmiques amb diferents resolucions, pc de sobretaula, TV, etc ... Sense necessitat de crear llocs web específics per a cada dispositiu. D'aquesta manera és possible maximitzar l'experiència de l'usuari, i garantir un ús satisfactori del nostre lloc web en diferents situacions i contextos d'ús.

El concepte responsive design ha crescut en popularitat de manera exponencial durant els últims 2 anys un reflex de la necessitat d'adaptar els nostres llocs web a un accés més global.

Avantatges del disseny web responsive

El desenvolupament d'un lloc web responsive inclou unes importants avantatges a considerar:

Des del punt de vista del posicionament en cercadors

  • Disposen d'una única URL d'accés als continguts en els resultats de cerca, independentment del dispositiu, de manera que l'estratègia de posicionament és la mateixa i s'estalvien redireccions i els errors que es deriven d'aquestes.
  • També s'eliminen les dificultats en accedir al lloc web des d'enllaços que els usuaris comparteixen en xarxes socials (Facebook, Twitter, etc) i que poden acabar en error depenent de quin enllaç es va copiar (des de quin dispositiu es va copiar) i des de quin dispositiu es accedeix.
  • Web semàntica. Disseny Responsive és HTML5. Això ens permet millorar l'estructura i definició de les dades (abans, només teníem llistes, paràgrafs, capes, taules ... ara però, gràcies a HTML5 tenim productes, notícies, esdeveniments, etc) Això facilita la interpretació dels cercadors del contingut de nostre lloc web.

Des del punt de vista dels costos

  • Plantejar el disseny responsive des de l'inici del projecte, permet un estalvi molt important respecte del cost d'adaptació posterior. En alguns casos, depenent de la complexitat del lloc web, podria arribar a ser gairebé impossible una posterior adaptació a aquest tipus de disseny en el futur.
  • Amb una única versió en HTML i CSS es cobreixen totes les resolucions de pantalla (PC, tauletes, telèfons mòbils, etc). D'aquesta manera es redueixen els costos de creació i manteniment quan el disseny de les pantalles és similar entre dispositius de diferents mides.
  • També suposa evitar el desenvolupament d'Apps, aplicacions ad-hoc i natives per a mòbils (iPhone, Android, etc). Moltíssim més costoses en el seu desenvolupament i, especialment, posterior manteniment.

Funcionament del Disseny Web Responsive

El principals conceptes en què es basa el Disseny Web Responsive són:

  • L'ús de proporcions en lloc de mesures fixes
  • I les "media querys" que permeten condicionar la presentació dels continguts dels documents HTML per, per exemple, adaptar-se a la resolució de pantalla.

Abandonar les mesures fixes en el disseny d'un lloc web passant aquests a ser fluids. En lloc de dissenyar la nostra web basant-nos en valors fixos (per exemple width: 960px), el disseny fluid està pensat en termes de proporcions, tots els elements de la web es faran més petits guardant la proporció entre ells. Fins arribar a un determinat punt ...

Com cap disseny escala de manera adequada quan canvia el context pel qual va ser pensat, les mitja queries són una sèrie d'ordres que s'inclouen en el full d'estils que indica al document HTML com s'ha de comportar davant diferents resolucions de pantalla.

Analitzen les característiques físiques del dispositiu que va a mostrar el nostre disseny. Si aquestes estan dins d'un condicional establert amb els Media Queries, s'aplicaran una sèrie d'instruccions CSS contingudes dins d'aquest, d'aquesta manera quan el nostre disseny fluid canvia de mida podrem aplicar una sèrie d'instruccions CSS pensades en exclusiva per a aquest nou mida ( CSS és un llenguatge d'estil que defineix la presentació dels documents HTML).

Per entendre-ho millor ...

El disseny d'una pàgina web, igual que els llibres, periòdics i revistes, estan basats en columnes, segons el disseny responsive, una mateixa pàgina web mostrada en un PC (a resolució panoràmica de 1280x800 px) tendia 5 columnes, en una tauleta , un iPad, per exemple, (1024 x 768 px) necessitaria només 4, i en el cas d'un smartphone (amb resolucions molt dispars però amb mesures de pantalla d'entre 3 i 5 polzades) les columnes utilitzades serien 2 o fins i tot només 1.

Per què has de tenir en compte el disseny responsive del teu lloc web o negoci en línia?

Hi ha una sèrie de factors dels quals hem de ser conscients

L'ús de dispositius mòbils està creixent a un ritme increïble

Dispositius com tablets i smartphones han incrementat les seves vendes en els últims anys i la navegació a Internet mitjançant aquests dispositius és cada vegada més comú. Un exemple és l'altíssima penetració a Espanya dels Smartphones.

Comportament dels usuaris

Comportament dels usuaris amb els seus dispositius mòbils és determinant en els processos de decisió de compra

  • Cinc conclusions clau de la ruta de compra des d'un Smartphone. (Informació obtinguda d'un estudi d'investigació de Nielsen per encàrrec de Google Gener de 2014):
    • els consumidors dediquen temps a investigar en els seus smartphones: més de 15 hores per setmana
    • la investigació comença en un motor de cerca (a diferència de llocs o aplicacions per a mòbils),
    • la proximitat és important (el 69% espera que les empreses es trobin en un radi de relativament proper des de la ubicació de l'usuari),
    • la immediatesa és clau: més del 50% desitja realitzar una compra en el transcurs d'una hora.
    • els mòbils influeixen en les decisions de compra: el 93% continua amb la compra)
  • Algunes dades del comportament segons un estudi de Google encarregat a Ipsos OTX Mitjans CT, Mobile Marketing Association i The Interactive Advertising Bureau:
    • Els telèfons intel ligents són eines crítiques en el procés de recerca previ a la decisió de compra en un 82% dels casos
    • 24% dels usuaris de telèfons intel • ligents ha fet una compra en el seu telèfon.
    • Els telèfons intel ligents són també un component crític de la publicitat tradicional un 68% ha realitzat una recerca en els seus telèfons intel • ligents després de veure un anunci en línia.
    • 79% Usuaris de telèfons fa altres coses mentre consulta internet des del seu smartphone com veure la televisió (37%).
    • 88% dels usuaris de smartphones busquen informació local en el seu telèfon i un 86% prenen decisions en conseqüència.
    • Els pronòstics, ja el 2012, advertien que el 2013 hi hauria més persones amb accés al web a través de mòbil que des d'un ordinador