{"id":5850,"date":"2013-03-19T07:00:30","date_gmt":"2013-03-19T07:00:30","guid":{"rendered":"https:\/\/www.sage.com\/es-es\/blog\/como-disenar-tu-tienda-online-diseno-usabilidad-y-accesibilidad\/"},"modified":"2026-02-04T20:37:43","modified_gmt":"2026-02-04T19:37:43","slug":"como-disenar-tu-tienda-online-diseno-usabilidad-y-accesibilidad","status":"publish","type":"post","link":"https:\/\/www.sage.com\/es-es\/blog\/como-disenar-tu-tienda-online-diseno-usabilidad-y-accesibilidad\/","title":{"rendered":"C\u00f3mo dise\u00f1ar tu tienda online: dise\u00f1o, usabilidad y accesibilidad"},"content":{"rendered":"
\n\t
\n\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\tTecnolog\u00eda e Innovaci\u00f3n<\/a>\t\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\t

\n\t\t\t\t\t\tC\u00f3mo dise\u00f1ar tu tienda online: dise\u00f1o, usabilidad y accesibilidad\t\t\t\t\t<\/h1>\n\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t<\/div>\n\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t<\/div>\n\t

\n\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\n\t\t
\n\t\t\t\n\t\t\t\t\"Carlos\t\t\t\tCarlos Roberto Cabello<\/span>\n\t\t\t<\/a>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t<\/div>\n\t\t<\/div>\n
\n\n

A la hora de dise\u00f1ar una tienda online son muchos los aspectos que debemos tener en cuenta para tener \u00e9xito. No s\u00f3lo se trata de que la tienda funcione bien y cumpla con su prop\u00f3sito. Tambi\u00e9n es necesario que el cliente que llegue a la tienda se sienta realmente c\u00f3modo navegando entre los distintos productos que tenemos a la venta. Hoy vamos a ver c\u00f3mo dise\u00f1ar tu tienda online<\/a>, centrados en los aspectos de dise\u00f1o, usabilidad y accesibilidad.<\/p>\n

Muchas veces nos obsesionamos mucho en el posicionamiento, en el SEO, aparecer los primeros en Google. Esto es muy importante, pero no sirve de nada si no tenemos una buena tasa de conversi\u00f3n<\/strong>. Si la persona que llega a nuestra p\u00e1gina no se siente c\u00f3moda, le cuesta encontrar las cosas que busca, abandonar\u00e1 la misma inmediatamente y no habremos logrado el objetivo final, que es la venta.<\/span><\/p>\n

Un dise\u00f1o acorde con nuestra marca<\/h2>\n

Cuando dise\u00f1amos nuestra tienda online nos centramos en que tenga una uniformidad con los colores de nuestra marca. Si los clientes ya nos conocen y est\u00e1n acostumbrados a ver nuestro logo en azul, lo m\u00e1s l\u00f3gico es buscar una paleta de colores para el dise\u00f1o<\/strong> de la p\u00e1gina que incluya esos tonos, aunque puedan variar ligeramente.<\/p>\n

El dise\u00f1o no s\u00f3lo incluye a tienda online, sino que tambi\u00e9n tendremos que aplicarlo a los anuncios con los que vamos a realizar las campa\u00f1as de marketing online<\/a> o a la pasarela de pagos<\/strong>. En el primer caso, el anuncio con el que pretendemos captar clientes tiene que tener un dise\u00f1o similar a lo que el cliente encontrar\u00e1 en nuestra p\u00e1gina de aterrizaje, la que dise\u00f1amos para el producto que estamos promocionando. Esta p\u00e1gina tambi\u00e9n debe ser similar a nuestra tienda online, incluyendo elementos comunes. De esta forma se refuerza la confianza del cliente en la tienda y facilita la venta.<\/p>\n

En el caso de las pasarelas de pago no siempre es posible que su dise\u00f1o quede integrado a la perfecci\u00f3n dentro de nuestra tienda. Depende mucho del producto elegido y es algo muy importante, puesto que es un punto del embudo de conversi\u00f3n de ventas<\/strong> donde el cliente tiene m\u00e1s dudas. Si ve que le llevamos a una p\u00e1gina de un banco ajena a todo lo que mostramos, puede abandonar el proceso de venta, justo cuando estaba a punto de finalizar.<\/p>\n

La usabilidad, \u00bfd\u00f3nde situamos los elementos en la p\u00e1gina?<\/h2>\n

Otra de las cuestiones importantes es la usabilidad. \u00bfD\u00f3nde situar los elementos m\u00e1s importantes de nuestra p\u00e1gina? Como norma general, en una p\u00e1gina web podemos hablar de la regla de la F<\/strong>, donde los elementos que m\u00e1s se ven ocupar\u00e1n la franja superior, el lateral izquierdo y la parte central. En estas zonas debemos ubicar los men\u00fas de navegaci\u00f3n, as\u00ed como los productos que debemos destacar, dejando el resto para otras cuestiones menos importantes.<\/p>\n

De todas formas existen aplicaciones que nos crean mapas de calor, que nos indican por donde est\u00e1n navegando m\u00e1s nuestros clientes<\/strong>. De esta forma podemos corregir alg\u00fan error en la colocaci\u00f3n de distintos elementos, que no est\u00e1n teniendo los resultados adecuados simplemente porque los usuarios no los ven.<\/p>\n

Al respecto de la usabilidad hay una serie de cuestiones que debemos tener en cuenta. Las p\u00e1ginas deben cargar lo m\u00e1s r\u00e1pido posible<\/strong>, lo que implica optimizar las im\u00e1genes y eliminar elementos que retardan la carga, como pueden ser los carruseles de im\u00e1genes, por ejemplo, muchos de ellos adem\u00e1s dise\u00f1ados en Flash, que no se ver\u00e1n en la mayor\u00eda de los dispositivos m\u00f3viles. Puede que a nivel comercial resulte atractivo, pero yo no los situar\u00eda en la p\u00e1gina de inicio.<\/p>\n

Una \u00faltima cuesti\u00f3n a tener en cuenta es la navegaci\u00f3n t\u00e1ctil<\/strong>. Hace tiempo en la web se navegaba por botones, sobre todo en los elementos de men\u00fa. Despu\u00e9s se pas\u00f3 al enlace de texto y hoy se vuelven a utilizar de nuevo m\u00e1s los botones. Simplemente porque es m\u00e1s c\u00f3modo si estamos navegando desde un dispositivo t\u00e1ctil, donde con el dedo no tenemos tanta precisi\u00f3n como con el puntero del rat\u00f3n.<\/p>\n

Accesibilidad, una cuesti\u00f3n cada d\u00eda m\u00e1s importante<\/h2>\n

La navegaci\u00f3n t\u00e1ctil va ganando m\u00e1s cuota de mercado<\/strong> cada d\u00eda. Utilizamos todo tipo de pantallas para acceder a la web<\/a>, desde una de 4\u2033 de un m\u00f3vil, hasta una pantalla de 24\u2033 de un ordenador de sobremesa. Y el dise\u00f1o de la tienda online tiene que estar adaptado y ser accesible desde todas ellas. Lo ideal es tener una versi\u00f3n m\u00f3vil, de manera, que en funci\u00f3n del dispositivo de entrada muestre una u otra versi\u00f3n.<\/p>\n

En caso de no tener esta versi\u00f3n podemos usar un dise\u00f1o web adaptativo<\/strong>, del ingl\u00e9s \u00abResponsive Web Design\u00bb, donde la visualizaci\u00f3n de nuestra p\u00e1gina se adaptar\u00e1 al tama\u00f1o de entrada de la pantalla en la cual se est\u00e1 visualizando. Esto tiene algunas ventajas, como que se ver\u00e1 bien en casi todo tipo de dispositivos, s\u00f3lo tendremos una URL que indexar\u00e1 bien en los motores de b\u00fasqueda, pero ser\u00e1 menos c\u00f3moda la navegaci\u00f3n y la p\u00e1gina tendr\u00e1 peor accesibilidad que si tenemos nuestra propia versi\u00f3n m\u00f3vil o nuestra aplicaci\u00f3n m\u00f3vil dise\u00f1adas s\u00f3lo para esta cuesti\u00f3n.<\/p>\n

Son muchos los aspectos que debemos considerar a la hora de montar una tienda online. No es algo sencillo de realizar y aqu\u00ed s\u00f3lo hemos ofrecido unos peque\u00f1os apuntes. Lo mejor es dejarse asesorar bien <\/strong>antes de lanzarse a la aventura. La parte positiva es que si tenemos algo que falla en nuestra tienda siempre estamos a tiempo de corregirlo.<\/p>\n<\/div>\n

\n\t
\n\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t\t

Subscr\u00edbete a la newsletter de Sage Advice<\/h2>\n\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t

Recibe nuestros consejos m\u00e1s recientes directamente en la bandeja de entrada de tu correo electr\u00f3nico.<\/p>\n\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tSuscr\u00edbete<\/a>\n\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\"Sage\"\t\t\t<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

A la hora de dise\u00f1ar una tienda online son muchos los aspectos que debemos tener en cuenta para tener \u00e9xito. No s\u00f3lo se trata de que la tienda funcione bien y cumpla con su prop\u00f3sito. Tambi\u00e9n es necesario que el cliente que llegue a la tienda se sienta realmente c\u00f3modo navegando entre los distintos productos […]<\/p>\n","protected":false},"author":244,"featured_media":9060,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_sage_video":false,"post_featured_image_hide":false,"footnotes":""},"categories":[5],"tags":[161,165,174],"business_type":[10,11],"lilypad":[],"context":[],"industry":[],"persona":[],"imagine_tag":[296,263,273],"coauthors":[413],"class_list":["post-5850","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tecnologia-innovacion","tag-comercio-electronico","tag-ecommerce","tag-tienda-online","business_type-pequena-empresa","business_type-mediana-empresa"],"sage_meta":{"region":"es-es","author_name":"Carlos Roberto Cabello","featured_image":"https:\/\/www.sage.com\/es-es\/blog\/wp-content\/uploads\/sites\/8\/2018\/01\/1675w-x-1275h_0000_Layer-9.jpg","imagine_tags":{"296":"Comercio electr\u00f3nico","263":"Tecnolog\u00eda","273":"Ventas"}},"distributor_meta":false,"distributor_terms":false,"distributor_media":false,"distributor_original_site_name":"Sage Advice Espa\u00f1a","distributor_original_site_url":"https:\/\/www.sage.com\/es-es\/blog","push-errors":false,"_links":{"self":[{"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/posts\/5850","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/users\/244"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/comments?post=5850"}],"version-history":[{"count":0,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/posts\/5850\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/media\/9060"}],"wp:attachment":[{"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/media?parent=5850"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/categories?post=5850"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/tags?post=5850"},{"taxonomy":"business_type","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/business_type?post=5850"},{"taxonomy":"lilypad","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/lilypad?post=5850"},{"taxonomy":"context","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/context?post=5850"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/industry?post=5850"},{"taxonomy":"persona","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/persona?post=5850"},{"taxonomy":"imagine_tag","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/imagine_tag?post=5850"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.sage.com\/es-es\/blog\/api\/wp\/v2\/coauthors?post=5850"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}