Responsive

Plan & Place

Plan & Place es una plataforma donde puedes encontrar y contratar eventos, alquilar espacios exclusivos, comerciales o particulares. La plataforma te permite encontrar el sitio para ese plan especial, y ofrecer un espacio para que otros lo puedan disfrutar. Para...

40Formación

40Formación es un centro de estudios legislativos que imparte formación a empresas privadas y públicas. Necesitaban poner al día su sitio web para poner en marcha diferentes estrategias de marketing digital. El objetivo es convertir el sitio web en una herramienta...

Serman Construcciones

Serman Construcciones es la web para una empresa de construcción del noroeste de Madrid. Theme Esta es una web de complejidad media, he utilizado Divi porque es un buen contenedor para mostrar las imágenes de los proyectos realizados y los contenidos del blog. La...

Montar un Negocio

Montar un Negocio es la web donde tienes que ir si estás pensando en montar un negocio relacionado con la hostelería. Esta web ya no está activa,  pero puedes encontrar ideas y opciones interesantes para personalizar tu proyecto. Theme He utilizado una personalización...
Menuda Dieta

Menuda Dieta

Menuda Dieta, una web que te ayudará a mantener una dieta saludable. Theme Para esta web hemos utilizado una plantilla premium construida sobre la base de Genesis. A la que hemos hecho algunas modificaciones, como añadir un sidebar adicional en la página principal y...

leer más
Rafaela Alameda

Rafaela Alameda

Rafaela Alameda es un catálogo online utilizando WooCommerce para mostrar saquitos térmicos de semillas elaborados artesanalmente. Rafaela necesitaba una web para mostrar un catálogo de sus productos y explicar a sus clientes los beneficios de su utilización. Aunque...

leer más

Desde marzo de 2021, Google utiliza el sistema de indexación mobile-first.

 

Esto quiere decir que Google utiliza la versión móvil de tu sitio web como punto de partida para indexar y clasificar las páginas en sus resultados de búsqueda.

 

Por eso es tan importante que tu sitio web se adapte bien a los dispositivos móviles, que es lo conseguimos cuando nuestro sitio web es responsive.

 

¿Y cómo se crea un sitio web responsive con WordPress?

 

Asegurando que el tema y el contenido se adaptan automáticamente a diferentes tamaños de pantalla.

 

Elige un tema responsive

 

Busca un tema que sea responsive desde el principio.

 

Puedes encontrar temas gratuitos y premium en el repositorio oficial de WordPress y en tiendas de temas de terceros.

 

Algunos temas populares que son responsive son por ejemplo Astra, OceanWP, GeneratePress y Divi.

 

Utiliza el personalizador de WordPress

 

La mayoría de los temas modernos te permiten personalizar la apariencia de tu sitio usando el personalizador de WordPress.

 

Puedes ajustar elementos como el logotipo, los colores, la tipografía y otros.

 

Además es una buena herramienta para verificar cómo se ve y se comporta tu sitio en diferentes dispositivos.

 

Diseña para dispositivos móviles primero (Mobile-First)

 

En lugar de diseñar primero para pantallas de escritorio, considera el diseño para dispositivos móviles primero.

 

Esto garantiza que el sitio se optimice para la experiencia del usuario en dispositivos más pequeños y luego se adapte a pantallas más grandes.

 

Evita el uso excesivo de elementos que no sean responsive

 

Si tienes elementos fijos o no responsive en tu sitio, como imágenes o tablas con anchos definidos en píxeles, es probable que provoquen problemas de visualización en dispositivos más pequeños.

 

Utiliza unidades de medida flexibles, como porcentajes o «em» en lugar de píxeles.

 

Prueba tu sitio en dispositivos reales y simuladores

 

Comprueba cómo se ve tu sitio en diferentes dispositivos reales, como teléfonos móviles, tablets y portátiles.

 

También puedes usar herramientas online, como el Modo responsive en las herramientas de desarrollador de Google Chrome, para simular diferentes tamaños de pantalla y detectar problemas de diseño y navegación.

 

Optimiza las imágenes

 

Asegúrate de que las imágenes de tu sitio estén optimizadas para la web.

 

Usa herramientas de compresión de imágenes para reducir el tamaño del archivo sin sacrificar demasiada calidad.

 

Los plugins como Smush o Imagify pueden ayudarte con esta tarea.

 

Utiliza plugins y widgets responsive

 

Si estás utilizando plugins y widgets en tu sitio, asegúrate de que también sean responsive.

 

Muchos plugins modernos se ajustan automáticamente a diferentes tamaños de pantalla, pero es mejor comprobar.

 

Mantén el contenido relevante

 

En pantallas más pequeñas, es posible que desees ocultar o reorganizar ciertos elementos para mejorar la legibilidad y la experiencia del usuario.

 

No dudes en eliminar contenido innecesario o agrupar de manera diferente en dispositivos móviles.

 

 

Aplicar estas recomendaciones te puede ayudar a crear un sitio web responsive en WordPress que mejore la experiencia de usuario en cualquier dispositivo.