{"section":"tutorials","requestedLocale":"es","requestedSlug":"responsivo-x-version-mobile","locale":"es","slug":"responsivo-x-version-mobile","path":"docs/es/tutorials/storefront/layout/responsivo-x-version-mobile.md","branch":"main","content":"### Responsivo\n\nSea del computador, smartphone, tablet o notebook, el design es el mismo. Lo que cambia es cómo el design se presenta. El layout entero se ajusta automáticamente de acuerdo a la resolución del dispositivo.\n\n### Versión Mobile\n\nEl design de la versión mobile y toda su programación se hace pensando solamente en el mobile, siendo una segunda aplicación, o sea, una para navegadores comunes y otra para navegadores mobile. Al acceder a la tienda, se identifica el dispositivo y se dirige a programación específica.\n\n![Principales pantallas mobile utilizadas](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/storefront/layout/responsivo-x-version-mobile_1.jpg)\n\nPrincipales pantallas mobile utilizadas (puede haber variaciones según el dispositivo utilizado):\n\n - 320 x 480\n - 480 x 320\n - 768 x 1024\n - 1024 x 768\n - 1680 x 1050\n\n#### Algunos puntos fuertes del RESPONSIVO deben ser considerados:\n\n - Mejor indexación de SEO (a pesar de que el _sitio_ dedicado no se quede atrás).\n - Fácil actualización y mantenimiento operacional.\n - Favorece la carga y mejora la conversión de códigos de redireccionamiento externos e internos.\n - Mismo look & feel favorece la identidad visual y _branding_.\n - URLs únicas permiten trabajar fácilmente en campañas.\n\n#### Características tanto en RESPONSIVO como en la VERSIÓN MOBILE:\n\n - No existe mouse over.\n - Scripts pesan.  Disminuir la cantidad ayuda el desempeño del sitio.\n - Imágenes grandes pesan al cargarlas, y no se abren (zoom) con frecuencia.\n - Posts resumidos y llamadas directas tienen mejor adherencia.\n - Visión 100% vertical.\n - Elementos visuales (imágenes excepto la foto del producto) deben ser sencillos.\n - Diferenciación de tamaño y color es mucho más acentuada que en la tienda tradicional.\n - Tiempo medio de navegación es mucho más bajo, o sea, debe ser objetivo, principalmente en la búsqueda de los productos.\n - Visibilidad de la vitrina es mucho menor, luego, buena categorización hace toda la diferencia.\n\n#### Principales elementos visuales reconocidos en los dispositivos móviles\n\n![menu_mobile_version es](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/storefront/layout/responsivo-x-version-mobile_2.png)\n\n#### ¡La calidad es indiferente al tamaño!\n\nComo toda creación de diseño, no existen puntos totalmente correctos, tampoco totalmente equivocados - La fórmula secreta es incorporar la mayor muestra de clientes finales y comprender los principales trueques comerciales que tenemos, aliadas a buenas prácticas de usabilidad."}