Tecnologías, Internet y Contenidos v. 2.0

Joomla, Wordpress, Blogger, Twitter...

Pruebalo en todos los exploradores!

votar
15 comentarios

Pruébalo en todos los exploradores!! Cuantas veces uno de nuestros jefes nos ha dicho eso. Para los que nos dedicamos al desarrollo de aplicaciones web es, la mayoría de las veces, una verdadera tortura que una aplicación o página web funcione en todos los exploradores o que se vea exactamente igual en cada uno de ellos.


Y cada vez es peor.. empezamos con Explorer 5 y el Explorer 5.5.. después el 6.0, 7.0. A ellos se unió Opera y Firefox con sus distintas versiones. Además de Safari y el mucho más reciente Google Chrome. Aunque también es verdad que no todos los exploradores suelen dar problemas. Si cuando desarrollamos una aplicación seguimos los estándares marcados por el W3c y otros organismos oficiales, los problemas que encontraremos serán muchísimos menos.

Aún así, los exploradores web tampoco siguen los estándares al pie de la letra. Existen numerosos test que nos permiten comprobar si un explorador sigue o no los estándares web. Uno de ellos es el test Acid3 que podéis probar en el siguiente link, Acid Test. Veréis como con cada explorador se ve una cosa distinta.


Acid Test con Internet Explorer 7

Acid Test con Firefox 3.0

Acid Test con Google Chrome



Dadas las diferencias existentes entre uno y otro explorador es común que un cliente nos pida que la página que les diseñamos se vea exactamente igual en uno y en otro. Lo más común, por lo menos en España, es que se pida que se vea en todas las versiones de Internet Explorer y Firefox, lo cual, para muchos, entre los que me incluyo, es más que un quebradero de cabeza.

A continuación os comento algunas de las herramientas que más me han servido en esta lucha por conseguir que una página web se vea correctamente en todos los exploradores.

  • MultipleIEs : Herramienta que permite tener instalados varias versiones del Explorer en el mismo ordenador. Por lo que se no existe versión todavía para Internet Explorer 8. Su fiabilidad es máxima y el consumo de recursos es moderado.
  • IeTester: Es una herramienta que te permite visualizar casi todas las versiones de Internet Explorer. Es muy versátil y fácil de usar. Su interfaz en pestañas hace mucho más fácil el arduo trabajo de realizar múltiples pruebas. He encontrado algún error de visualización en los botones (el texto no aparece), pero salvo este pequeño error funciona muy bien.
  • Opera Mini: Sirve para probar la apariencia de una web en un dispositivo móvil, siempre a través del explorador OperaMini, la versión para móviles del conocido y recomendable navegador Opera.
  • Spoon.net: Permite ejecutar una instancia portable de los exploradores más utilizados. Es necesario instalar un pequeño programa y a partir de ahí podremos ejecutar sin instalarlos varios navegadores. Muy útil para pruebas de visualización puntuales. Existe la posibilidad de ejecutar los siguientes navegadores: Internet Explorer 6, Internet Explorer 7, Internet Explorer 8, Firefox 3.5, Firefox 3.0, Firefox 2.0, Google Chrome, Opera 10, Opera 9 y Safari en sus versiones 4 y 3.

Además de estas herramientas que tendréis que instalar en vuestro ordenador, existen páginas web que generan imágenes de como se vería dicha web en distintos entornos y navegadores. Estas páginas son muy útiles sobre todo para adaptar el diseño de una página a todos los navegadores. A continuación os enumero algunos ejemplos que he encontrado por ahí.

  1. http://browsershots.org Podéis ver una explicación de su uso aquí.
  2. http://www.browsercam.com
  3. http://viewlike.us/ Permite visualizar una página en distintas resoluciones de pantalla rápidamente, incluyendo la resolución de un Iphone.
  4. NetRenderer: Nos permite visualizar con una velocidad increíble una web en varias versiones del explorer, desde la 5.5 hasta la 8. Muestra una captura de pantalla del resultado. Además ofrece una versión para ver las diferencias entre el 6 y el 7. (Actualización 22/03/2010)
Espero que os ayuden y que si conocéis alguna más dejéis un comentario en el blog, para incluirla en la lista. Suerte en vuestra lucha con algunos exploradores y recordad, es siempre más fácil, si seguís los estándares web.

Creative Commons License
Esta obra está bajo una licencia de Creative Commons.