Google Resizer Cares for Responsive Design

Google Resizer se preocupa por el diseño receptivo

Gracias a la gran cantidad de tipos de dispositivos móviles, los sitios web contemporáneos deben diseñarse para diferentes resoluciones y orientaciones. Sin embargo, para ver cómo se ve un sitio en una tableta, un teléfono inteligente o un monitor estándar, no es necesario tener todos los dispositivos listos en todo momento. Google Resizer es una herramienta web útil que le mostrará fácilmente un sitio web para diferentes tipos de dispositivos y resoluciones.

Ingrese la dirección y comience

Utilizando Cambiar el tamaño de Google es tan fácil como parece. Simplemente ingrese la dirección del sitio web en el que desea probar la capacidad de respuesta y recibirá instantáneamente una visualización de su sitio en las tres clases de dispositivos estándar: computadora de escritorio, tableta y teléfono inteligente. A través de Iframe, el sitio web aparece en la resolución adecuada para el dispositivo respectivo. Esto significa que puede navegar por su sitio como de costumbre y probar adecuadamente cada página.

Google Resizer se preocupa por el diseño receptivo
Visualización en computadoras de escritorio, tabletas y teléfonos inteligentes de un vistazo

Google ha desarrollado esta herramienta específicamente para su Material Design. Se supone que ayuda a los diseñadores y desarrolladores web a probar los puntos de interrupción, así como las listas receptivas en las diferentes resoluciones. Pero cualquier otro sitio web, que no esté basado en Material Design de Google, puede probarse en varios dispositivos a través de Google Resizer.

Teniendo en cuenta diferentes resoluciones de escritorio

Además de la visualización conjunta de los tres dispositivos, hay diferentes páginas para escritorio y dispositivo móvil, respectivamente. Se muestra una regla con resoluciones comunes para la página del escritorio. Hay siete anchos diferentes para elegir, que van desde 1600 píxeles a 480 píxeles. Un clic en la regla cambia la resolución y ajusta su sitio web en consecuencia.
Google Resizer se preocupa por el diseño receptivo

Mostrar en el escritorio con diferentes puntos de interrupción

De esta manera, puede ver rápidamente cómo reacciona su sitio web cuando aparece en monitores o navegadores más grandes o más pequeños. Los tamaños se obtienen de las pautas de Material Design de Google. Allí, se definen siete puntos de interrupción, que se nombran en consecuencia. Por lo tanto, hay diferentes puntos de interrupción entre «Ventana xpequeña» y «Ventana xgrande».

Pruebas para dispositivos móviles

Puede verificar cómo se ve su sitio web en teléfonos inteligentes y tabletas en una página propia. Allí encontrarás otra regla con resoluciones típicas, en este caso sin embargo; se utilizan específicamente para teléfonos inteligentes y tabletas.
Esto le permite probar su sitio web en un teléfono inteligente estándar con una resolución de 360 ​​​​píxeles de ancho.

Google Resizer se preocupa por el diseño receptivo
Mostrar en un teléfono inteligente

Aparte de la pantalla en modo retrato, Google Resizer también ofrece el respectivo modo paisaje. La mayor resolución disponible es de 1024 píxeles de ancho, que es la resolución de una tableta convencional.

Uso de herramientas para desarrolladores o Google Resizer

La mayoría de los desarrolladores web deberían estar acostumbrados a las herramientas de desarrollo disponibles en Chrome y Firefox, por ejemplo. Estas también son opciones para probar su sitio web para diferentes resoluciones. Además, las herramientas para desarrolladores le permiten simular pantallas táctiles y probar un control de gestos programado directamente en el escritorio.

(Desafortunadamente,) Google Resizer solo puede probar diseños receptivos, lo que generalmente no es suficiente para una prueba extensa de sitios web. No obstante, Google Resizer es una excelente herramienta para presentar el diseño receptivo de un sitio web a los clientes. La herramienta también facilita la cooperación con diseñadores que no tienen el conocimiento necesario de las herramientas de desarrollo, ya que Google Resizer es claro y fácil de operar.

Cuando se trata de «solo» verificar un diseño web receptivo en su pantalla correcta, o presentarlo, Cambiar el tamaño de Google Es una buena y rápida opción.

(dpe)

#Google #Resizer #preocupa #por #diseño #receptivo

Publicaciones Similares

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *