Definición de Responsive Design y Media Queries
Un sitio receptivo es un sitio que se adapta automáticamente al terminal que lo muestra. Dependiendo del tipo de pantalla o de su tamaño, el texto, las columnas y las imágenes se ajustarán, redimensionarán y moverán automáticamente según la resolución de la pantalla. El objetivo es proporcionar comodidad de navegación y una ergonomía óptima para todos y en todos los dispositivos.
Las consultas de medios son elementos del CSS de un sitio. CSS gestiona el diseño de un sitio web. Una consulta de medios es una regla que establece las propiedades de CSS en función de determinadas resoluciones de pantalla específicas. Las consultas de medios le permiten ofrecer diferentes propiedades para determinadas resoluciones. Por lo tanto, podemos definir fácilmente que un título se mostrará en 32 píxeles en pantallas grandes, pero en 20 píxeles en todas las pantallas de menos de 720 píxeles de ancho. Generalmente es necesario diseñar 3 variaciones de diseño que se seleccionarán automáticamente según el ancho de la pantalla o el terminal utilizado: teléfono inteligente, tableta con pantalla táctil y PC fijo.
Las diferencias entre el diseño receptivo y el sitio móvil dedicado
La diferencia entre un sitio de diseño receptivo y un sitio móvil es que el sitio receptivo está diseñado para adaptarse a cualquier tipo de pantalla, lo cual es práctico, pero puede causar problemas en ciertos puntos, como el tiempo de carga: las imágenes son las mismas en el escritorio y en el móvil. , aunque se muestran a menor escala. Por lo tanto, un sitio receptivo debe estar bien diseñado.
Lo que nos lleva a una desventaja de los sitios móviles. Se crean exclusivamente para teléfonos inteligentes y tabletas y, por lo tanto, debe crear una copia del sitio ya existente para hacer este sitio móvil. Esto tiene muchos problemas de SEO para evitar que Google considere un sitio móvil como una copia del sitio original.
La importancia de la web móvil
Hoy es más que importante tener un sitio receptivo. Según las estadísticas, desde 2012 el tráfico móvil ha aumentado en un 70%, solo representaba 12 veces el tráfico total de Internet en 2000, el uso de teléfonos inteligentes ha aumentado en un 81%. La venta de teléfonos inteligentes y tabletas sigue aumentando. En 2010 fueron alrededor de 270 millones de teléfonos inteligentes vendidos, en 2013 fueron 561 millones de teléfonos inteligentes y 170 millones de tabletas vendidas y en 2015 ahora son 775 millones de teléfonos inteligentes y 318 millones de tabletas vendidas por año.
También es importante para el SEO, Google destaca las páginas que se están adaptando al móvil para satisfacer a sus usuarios. nada más frustrante que navegar por su teléfono inteligente y encontrarse en un sitio que no es adecuado. Si está navegando en su teléfono inteligente y ve «sitio móvil» escrito debajo de la etiqueta del título, entonces el sitio es adecuado para la navegación móvil.
¿Cómo saber si un sitio responde?
Para saber si un sitio responde, vaya a cualquier página y reduzca el ancho de la ventana de su navegador web, si el diseño del sitio no se mueve y aparece una barra de desplazamiento horizontal, significa que el sitio no responde (o responde mal) . Si observa que el sitio se reorganiza a medida que disminuye el ancho, es porque el sitio responde.
También puede verificar en su teléfono inteligente, simplemente abra su navegador y vaya a un sitio, si el sitio está adaptado al ancho de la pantalla y puede leer el texto sin tener que hacer zoom, es porque el sitio es receptivo. Si, por otro lado, el sitio se muestra como en una computadora y tiene que hacer zoom para poder leer el texto, es porque el sitio no responde. Obtenga más información sobre la creación de sitios web.
¡Todos los sitios diseñados por nuestra agencia son receptivos!