Dada la cantidad de dispositivos que existen hoy en día, y la facilidad que casi todos tienen para adquirirlos, se ha vuelto muy común que la navegación en internet ya no dependa únicamente de los PCs o laptops y es de vital importancia que, sin importar el dispositivo que usemos, el contenido se vea siempre de la mejor forma posible y se den todas las facilidades táctiles y de navegación en general para que los usuarios lean sus noticias, eventos, redes sociales y cualquier otro contenido.

cambiar resolucion del navegador para probar mi sitio web responsive

Por lo anterior es que ha tomado tanta importancia el término Responsive. Responsive significa la adaptabilidad que tiene un blog o sitio web para ajustar su diseño a cualquier resolución de pantalla y cualquier dispositivo, de modo que no importa desde donde se vea, siempre se note un aspecto agradable y de fácil lectura y comprensión para los usuarios. Se debe tener en cuenta que lo que ves en un monitor de 23″, no podrás verlo con la misma facilidad en un smartphone de 4″. Es por este motivo que se debe siempre asegurar que el diseño web se haga responsive, para que todo el contenido se adapte automáticamente sin necesidad de intervención de los usuarios.

Hoy queremos compartir dos herramientas que te facilitarán el trabajo para realizar todas las pruebas que quieras al sitio web que estás desarrollando o simplemente ver como se ve tu portal favorito en cualquier resolución, sin necesidad de tener Tablets o Smartphones a la mano para lograrlo.

Se trata de dos extensiones para el navegador Google Chrome, el cual recomendamos para hacer desarrollo web por todas las facilidades que presta y por lo completo que es su inspeccionador de elementos para trabajos de HTML y CSS entre otras funciones.

Mobile Browser Emulator

Esta extensión tiene incorporadas 9 resoluciones distribuidas entre Tablets, smartphones y PC en sus diferentes posiciones (vertical u horizontal). Además trae la posibilidad de colocar manualmente las pulgadas que tiene tu PC para pruebas más específicas en monitores más grandes. Después de añadir la extensión a tu navegador, se verá una pequeña letra “m” en la parte superior derecha, la cual debes clickear para realizar los cambios de resolución. Dependiendo de la que elijas, el tamaño de la ventana cambiará y ahí podrás visualizar como se ve el contenido del sitio web que tienes abierto en ese momento.

como probar si mi pagina web es responsive

Agrega Mobile Browser Emulator a Chrome aquí

Resolution Test 

Esta extensión es muy similar a la anterior, solo que aquí te ofrecen más resoluciones y más opciones de personalización. Sin embargo no te menciona si se trata de una tablet en posición vertical u horizontal, o un smartphone. Aquí se centran en resoluciones específicas. Al instalarla verás en la parte superior derecha una pequeña ventana blanca con un borde azul en la parte de arriba. Al dar clic ahí se listarán las resoluciones las cuales simplemente eliges para ver como se adapta tu sitio web a ellas.

como cambiar la resolucion de mi navegador para ver mi pagina web

Agrega Resolution Test a Chrome aquí

Cualquiera de las dos extensiones que decidas probar, tendrás a la mano una considerable cantidad de opciones para elegir y realizar todas las pruebas que sean necesarias y útiles a tu página web. No olvides dejarnos un comentario si requieres asesoría o tienes cualquier tipo de duda.

1 Comentario

COMENTARIOS