Glosario · 3 capítulos
Diseño web adaptable: explicación sencilla.
Definición breve
El diseño web adaptable es un método mediante el cual la estructura, las imágenes y la navegación se ajustan automáticamente al tamaño de pantalla de cada dispositivo. Un sitio adaptable funciona igual de bien en un móvil, una tableta o un ordenador. Técnicamente se consigue con cuadrículas flexibles, imágenes escalables y media queries de CSS.
Orientación
Tu recorrido de lectura
Ve directamente al capítulo que necesitas ahora.
Sección 01
Por qué mobile-first es hoy el estándar
Hoy, la mayoría de las visitas a sitios web se realizan desde un móvil. Quien diseña únicamente para escritorio optimiza para una minoría de sus visitantes. Por eso se ha impuesto el enfoque mobile-first: el sitio se concibe primero para pantallas pequeñas y después se adapta a las grandes, no al revés.
Google también funciona así. Desde que adoptó la indexación mobile-first, el buscador evalúa principalmente la versión móvil de tu sitio web. Si no se puede utilizar bien, todo tu posicionamiento se resiente. Por eso, el diseño web adaptable ya no es opcional, sino un requisito básico para el SEO. Te lo explicamos paso a paso en nuestra guía de SEO para principiantes.
Sección 02
Cómo reconocer que tu sitio web no es adaptable
No necesitas conocimientos de desarrollo. Abre tu sitio web en el móvil y presta atención a estas señales de alerta:
Con que se cumpla uno de estos puntos, pierdes visitas cada día. Las personas que navegan desde el móvil tienen poca paciencia: si deben ampliar la pantalla, se marchan. Esto perjudica tanto tu posicionamiento como tus consultas. En el artículo sobre optimización de la tasa de conversión explicamos la estrecha relación entre la experiencia de usuario y las ventas.
- Tienes que ampliar la pantalla para poder leer los textos.
- La página se desplaza horizontalmente y parte del contenido sobresale del borde de la pantalla.
- Los botones y enlaces son tan pequeños que pulsas constantemente en el lugar equivocado.
- Las imágenes aparecen distorsionadas o el diseño se desplaza.
- Los formularios apenas se pueden completar desde el móvil.
Sección 03
Qué puedes hacer ahora
Para problemas menores suele bastar con un ajuste técnico. Sin embargo, si tu sitio web tiene varios años, un relanzamiento suele ser la solución más sensata. El diseño web moderno se plantea como adaptable desde el principio, en lugar de añadir esa capacidad después.
Si no tienes claro en qué estado se encuentra tu página, la revisamos contigo en una sesión de estrategia gratuita y te decimos con sinceridad si basta con mejorarla o si conviene empezar de nuevo.
Seguir leyendo