Diseño sitio web adaptativo

Agiliza y reutiliza el contenido entre dispositivos. Elementos como el diseño, el tamaño del texto, el contenido, la navegación y las imágenes se ajustan automáticamente para adaptar al dispositivo que tu cliente prefiera.


Varios dispositivos. Una única experiencia sitio web.

¿Cuántas veces tuviste un sitio web que funcionaba bien en tu dispositivo de escritorio pero que se colapsaba en el celular? Si tu sitio web no está optimizado para todas las plataformas ni todos los dispositivos, móviles u otros, estás exponiéndote a ofrecer una experiencia online incoherente y a perder un cliente por frustración. Luego de todo, tu competencia está a tan solo un clic.

El diseño de sitio web adaptativo te aporta la capacidad de diseñar sitios web que se adapten fácilmente a todos los dispositivos. Esto significa que tu sitio web permitirá una interacción exitosa con tus clientes que será coherente a través de todas las plataformas. El diseño sitio web adaptativo reconfigura el diseño, el tamaño de texto, el contenido y las herramientas de navegación para adaptar a varios tamaños y funcionalidades de pantalla. Antes de publicar, también podrás previsualizar y optimizar el rendimiento en una variedad de dispositivos. Además, puedes automatizar el cambio de tamaño automático en los dispositivos para aumentar la velocidad del contenido y ahorrar tiempo.

imagen

Descubre cómo funciona.

Desarrolla cuadrículas fluidas

Puedes crear una cuadrícula fluida que funcione como andamiaje para que tu contenido se ajuste adecuadamente. Las cuadrículas fluidas agilizan el cambio de tamaño en función del tamaño de la pantalla del dispositivo.

Escala todo el contenido

Con un diseño sitio web adaptativo, no tendrás que preocuparte de que tu contenido escrito se comporte igual en todos los dispositivos en los que se muestre. Esta función escala las imágenes para garantizar que se ajustan al contenido que se presenta, de modo que podrás despedirte de esas molestas partes salientes de las imágenes.

Vista previa para dispositivos específicos

Puedes elegir el dispositivo en el que te gustaría obtener la vista previa y te mostraremos cómo aparecerá tu página en cada dispositivo, incluidos smartphones y tabletas.

Optimización de la imagen

En virtud del ancho de banda, el tamaño de la pantalla y los PPP, puedes optimizar la entrega del mejor tamaño de la imagen para cualquier experiencia que estés creando.

Más información sobre el diseño sitio web adaptativo de Adobe Experience Manager Sites.

imagen

Descubre el diseño sitio web para dispositivos móviles.

Aprende a emplear consultas de medios, imágenes adaptables y cuadrículas fluidas para crear una experiencia sitio web coherente en nuestra documentación.

Aprende a enfrentarte a los tamaños de pantallas que cambian continuamente.

Descubre cómo estar un paso por delante a pesar del panorama cambiante de los tamaños de pantalla en nuestro blog de Adobe.

imagen

Ver funciones relacionadas

Diseño sitio web adaptativo

Optimiza y reutiliza contenido en varios dispositivos con elementos como el diseño, el tamaño del texto, el contenido, la navegación y las imágenes que se ajustan automáticamente al dispositivo que prefiera tu cliente.

Sistema de estilos

Estandariza el estilo y el diseño de todos los componentes o páginas sin desarrollo de servicios de fondo. Simplemente elige entre diferentes variaciones de una lista de estilos predefinidos para adaptar inmediatamente fuentes, colores y formatos.

Componentes inmediatos

Puedes crear páginas con componentes inmediatos compatibles y flexibles con versiones anteriores como rutas de navegación, formularios, navegación de páginas, teasers de búsquedas y búsquedas, lo cual ahorrará tiempo tanto a los autores como a los desarrolladores.

Descubre lo que Adobe puede hacer por tu compañía.

Retratos