Si eres diseñador o pro­gra­ma­dor web, se­gu­ra­me­n­te deseas que tu página web sea vi­sua­li­za­da de la mejor manera en todos los na­ve­ga­do­res y di­s­po­si­ti­vos. Para ga­ra­n­ti­zar­lo, es fu­n­da­me­n­tal que el contenido im­ple­me­n­ta­do funcione bajo el llamado Cross Browser, es­pe­cia­l­me­n­te hojas de estilo en cascada como CSS o códigos de script como Ja­va­S­cri­pt. En otras palabras: todos los elementos deben ser pro­gra­ma­dos para verse siempre igual, in­de­pe­n­die­n­te­me­n­te del navegador utilizado por el visitante.

¿Para qué sirve el Cross Browser Testing?

Cuando el ad­mi­ni­s­tra­dor de una página web se abstiene de hacer pruebas de co­m­pa­ti­bi­li­dad con di­fe­re­n­tes na­ve­ga­do­res es muy probable que su web no esté op­ti­mi­za­da para todos los na­ve­ga­do­res, lo que puede llevar a an­tie­s­té­ti­cos errores de vi­sua­li­za­ción. Los problemas de co­m­pa­ti­bi­li­dad surgen pri­n­ci­pa­l­me­n­te por el hecho de que los na­ve­ga­do­res in­te­r­pre­tan de formas di­fe­re­n­tes el código es­ta­n­da­ri­za­do. Si como diseñador web te co­n­ce­n­tras demasiado en un único navegador, perderás de vista ca­ra­c­te­rí­s­ti­cas que se­gu­ra­me­n­te serán im­po­r­ta­n­tes para otros. Aquí es im­po­r­ta­n­te poner las pre­fe­re­n­cias pe­r­so­na­les en un segundo plano, pues las que cuentan de verdad son las de los vi­si­ta­n­tes. Recuerda que los esfuerzos in­ve­r­ti­dos en el diseño de una página web no valen la pena si el contenido no se muestra co­rre­c­ta­me­n­te en los na­ve­ga­do­res uti­li­za­dos por los usuarios.

La op­ti­mi­za­ción de una página web para los di­fe­re­n­tes na­ve­ga­do­res también juega un papel im­po­r­ta­n­te dentro del diseño web re­s­po­n­si­vo. Aquí es necesario co­n­si­de­rar también los na­ve­ga­do­res más populares en sistemas ope­ra­ti­vos móviles como Android. La op­ti­mi­za­ción Cross Browser puede ser una tarea tediosa, pues el correcto fu­n­cio­na­mie­n­to de los elementos con fre­cue­n­cia solo se puede comprobar de forma manual con una vista previa en los di­fe­re­n­tes na­ve­ga­do­res. En la práctica, los problemas más comunes suelen ser:

  • la difícil (a través de una máquina virtual) o, en muchos casos imposible, in­s­ta­la­ción de Internet Explorer en el ordenador;
  • la ve­ri­fi­ca­ción en Safari no válida para usuarios de Windows o Linux;
  • el gran número de na­ve­ga­do­res móviles obsoletos, que suelen tener la misma base técnica, pero que difieren en muchos detalles.

Como co­n­se­cue­n­cia, y debido a que no es obvio que un ad­mi­ni­s­tra­dor web tenga in­s­ta­la­das las di­fe­re­n­tes versiones de los pri­n­ci­pa­les na­ve­ga­do­res, existen numerosas he­rra­mie­n­tas, conocidas también como Cross Browser Testing Tools, que ofrecen packs de na­ve­ga­ción. Estos incluyen los recursos de hardware ne­ce­sa­rios para realizar pruebas de fu­n­cio­na­mie­n­to durante un tiempo de­te­r­mi­na­do.

¿Cómo funcionan las Cross Browser Testing Tools?

Los di­fe­re­n­tes servicios online de Cross Browser Testing no solo ponen a prueba la co­m­pa­ti­bi­li­dad de los elementos de una página web en las últimas versiones de los na­ve­ga­do­res, sino también en sus versiones más antiguas. Es frecuente encontrar versiones obsoletas en or­de­r­na­do­res co­me­r­cia­les que también deben tenerse en cuenta. Por lo tanto, el enfoque, las ca­pa­ci­da­des y el precio de las he­rra­mie­n­tas variará si­g­ni­fi­ca­ti­va­me­n­te.

Por ejemplo: si quieres optimizar una apli­ca­ción de Intranet para una empresa pequeña, se puede asumir que habrá muy pocas di­fe­re­n­cias entre una versión de un navegador y otra. La mayoría de he­rra­mie­n­tas ayudan a instalar algunas versiones del navegador deseado en el sistema. Po­s­te­rio­r­me­n­te, se rea­li­za­rán capturas de pantalla au­to­má­ti­cas para registrar la re­pre­se­n­ta­ción de la web en los di­fe­re­n­tes na­ve­ga­do­res.

Si, en cambio, se busca optimizar una página web que recibirá visitas de una gran variedad de usuarios, la revisión implicará un número demasiado grande para un sistema de prueba propio, además de que será necesario contar con di­fe­re­n­tes sistemas ope­ra­ti­vos. En este punto, se podría recurrir a he­rra­mie­n­tas online de captura de pantalla que ofrezcan una vi­sua­li­za­ción en na­ve­ga­do­res estándar o se­le­c­cio­na­dos según las ne­ce­si­da­des. En la mayoría de los casos, este método solo mostrará errores de HTML y CSS, ignorando la revisión del correcto fu­n­cio­na­mie­n­to de las apli­ca­cio­nes web in­te­gra­das. Para evitar que la revisión pase por alto elementos im­po­r­ta­n­tes, existen las llamadas Cross Browser Testing Tools, que permiten el acceso remoto al navegador elegido. Estas permiten vi­sua­li­zar una página web en un navegador sin tener que in­s­ta­lar­lo, lo que re­pre­se­n­ta una total in­de­pe­n­de­n­cia de algunos recursos de hardware, que de otro modo serían im­pre­s­ci­n­di­bles.

Las mejores Cross Browser Testing Tools

Comprobar si los elementos de un proyecto web funcionan y se vi­sua­li­zan de forma correcta en di­fe­re­n­tes di­s­po­si­ti­vos y con diversos na­ve­ga­do­res es más im­po­r­ta­n­te que nunca. La co­m­pa­ti­bi­li­dad entre na­ve­ga­do­res de una página web no solo garantiza la sa­ti­s­fa­c­ción de tus vi­si­ta­n­tes, re­du­cie­n­do la tasa de rebote, sino que también tendrá un impacto positivo en el po­si­cio­na­mie­n­to de tu web en los pri­n­ci­pa­les motores de búsqueda. A co­n­ti­nua­ción, te pre­se­n­ta­mos algunas de las mejores Cross Browser Testing Tools del mercado:

Cro­s­s­Bro­w­se­r­Te­s­ti­ng

El servicio online Cro­s­s­Bro­w­se­r­Te­s­ti­ng se encarga de comprobar el correcto fu­n­cio­na­mie­n­to de una página web en más de 900 di­fe­re­n­tes versiones de na­ve­ga­do­res y más de 40 sistemas ope­ra­ti­vos, in­de­pe­n­die­n­te­me­n­te de si la web está online o se encuentra aún en fase de de­sa­rro­llo. Además, las pruebas se ejecutan en di­s­po­si­ti­vos físicos reales, no en emu­la­do­res. El Live Test Modus permite elegir las co­m­bi­na­cio­nes deseadas entre sistemas ope­ra­ti­vos y na­ve­ga­do­res, re­po­r­ta­n­do errores en elementos AJAX, Flash, HTML o Ja­va­S­cri­pt. Esta he­rra­mie­n­ta también realiza capturas de pantalla au­to­má­ti­cas que muestran si el diseño es pre­se­n­ta­do de forma atractiva para los vi­si­ta­n­tes en los di­fe­re­n­tes na­ve­ga­do­res. Cro­s­s­Bro­w­se­r­Te­s­ti­ng ofrece una semana de prueba sin ningún coste. Una vez fi­na­li­za­do el periodo de prueba puedes elegir el pack que mejor se adapte a tus ne­ce­si­da­des y, de­pe­n­die­n­do de este, recibirás un número limitado de minutos para la rea­li­za­ción de Live Tests, de controles si­mu­l­tá­neos y de posibles usuarios.

Bro­w­se­r­S­ta­ck

La he­rra­mie­n­ta Bro­w­se­r­S­ta­ck (https://www.bro­w­se­r­s­ta­ck.com/) permite comprobar la fu­n­cio­na­li­dad de una página web en más de 700 na­ve­ga­do­res. El servidor ofrece di­s­po­si­ti­vos físicos para la mayoría de pruebas, para la ve­ri­fi­ca­ción en Android también pro­po­r­cio­na emu­la­do­res de manera similar a la co­m­pro­ba­ción realizada por el framework Selenium. El proceso de ve­ri­fi­ca­ción incluye acceso in­s­ta­n­tá­neo a todos los na­ve­ga­do­res y tiempo ilimitado para comprobar tus co­n­fi­gu­ra­cio­nes pe­r­so­na­les. Bro­w­se­r­S­ta­ck se vale de poderosos scripts que buscan y corrigen errores en tiempo real, incluso para páginas web que aún se en­cue­n­tren en fase de de­sa­rro­llo. Las capturas de pantalla para el análisis del diseño se deben generar ma­nua­l­me­n­te y el rango de su re­so­lu­ción oscilará entre 800 x 600 hasta 2048 x 1536 píxeles. Una vez fi­na­li­za­do el periodo de prueba, es posible elegir entre tres packs mensuales, el pack más básico no incluye la rea­li­za­ción de pruebas au­to­ma­ti­za­das.

Spoon Browser Sandbox

Spoon Browser Sandbox es otro servicio que ofrece un navegador virtual. Sin embargo, la he­rra­mie­n­ta solo se ejecuta a través de un PC propio. En la medida en que los recursos lo permitan, el navegador Sandbox realiza pruebas en di­fe­re­n­tes versiones de los na­ve­ga­do­res más populares (Chrome, Firefox, Internet Explorer o Safari) sin tener que in­s­ta­lar­los en tu ordenador. Gracias a los emu­la­do­res del navegador, la im­po­r­ta­n­cia del sistema operativo utilizado pasa a un segundo plano, lo que permite probar na­ve­ga­do­res que podrían no ser co­m­pa­ti­bles. La versión gratuita de la he­rra­mie­n­ta solo po­si­bi­li­ta el uso de un único navegador, mientras que las versiones mensuales de pago permiten probar un número ilimitado de na­ve­ga­do­res de manera si­mu­l­tá­nea. Además, tendrás acceso online a las Sandbox Tools, que te ayudan a optimizar tu página web por medio de capturas de imagen o registros de prueba al­ma­ce­na­bles.

Ir al menú principal