Hace un tiempo coloqué en la sidebar de mi blog un código que detecta si el visitante está usando Internet Explorer, y si es así, muestra un mensaje que le recomienda cambiarse a Mozilla Firefox para visualizar correctamente el sitio, con un botón desde el que puede descargarlo:
Desarrollé este truco con la finalidad de evitarme el trabajo de construir un sitio que se vea bien tanto con exploradores avanzados y respetuosos de los estándares como Firefox, Opera, Google Chrome y Safari, como con el totalmente obsoleto e inseguro Internet Explorer; una piedra en el zapato para cualquiera que pretenda crear un sitio web decente.
Ahora te mostraré cómo puedes añadirlo a tu blog o sitio web. El mensaje es muy fácil de personalizar y puedes recomendar el navegador que más te agrade; no necesariamente tiene que ser Firefox:
Método general
Existen unas etiquetas especiales del HTML llamadas comentarios condicionales, que sirven para mostrar contenido únicamente en Internet Explorer. La forma en que se usan es la siguiente:
<!--[if IE]>
Contenido a mostrar
<![endif]-->
Entonces, para el caso de los mensajes que se ven sólo con IE, bastará con colocar el mensaje dentro de esos comentarios condicionales:
<!--[if IE]>
<p style="width:120px;margin:0 auto;"><a href="http://download.mozilla.org/?product=firefox-3.5.2&os=win&lang=es-ES" rel="nofollow"><img alt="Mozilla Firefox" src="http://www.duplika.com/img/ffx/otros-ff3.gif" title="Descargar la versión más reciente de Mozilla Firefox"/></a></p>
<p>Estás utilizando Internet Explorer y es posible que veas errores. Este sitio funciona mejor con <b>Mozilla Firefox</b>, que además es más rápido, seguro y 100% libre de virus. Haz clic en el botón para descargarlo (es GRATIS).</p>
<![endif]-->
Ese es el código que puedes pegar en donde quieras que se muestre el mensaje. El número en azul indica la versión de Firefox que se descargará al hacer clic en el botón; así que cada vez que salga una nueva deberás actualizarlo.
Método para Blogger
Si tu blog se encuentra alojado en Blogger puedes seguir perfectamente el procedimiento anterior; el problema surgirá si colocas el mensaje en tu sidebar y le pones un título: el mensaje se mantendrá invisible para los navegadores pero no así el nombre que le hayas puesto, lo que dará por resultado algo como esto:
Para que el título también desaparezca sólo hay que cambiar un poco las instrucciones.
Comenzaremos por añadir un nuevo elemento HTML en la sidebar, ponerle el título que consideremos adecuado (el del mío es “Advertencia”) y pegarle el código siguiente:
<style>
#HTML3 {
display:none;
}
</style>
<!--[if IE]>
<style>
#HTML3 {
display:block;
}
</style>
<p style="width:120px;margin:0 auto;"><a href="http://download.mozilla.org/?product=firefox-3.5.2&os=win&lang=es-ES" rel="nofollow"><img alt="Mozilla Firefox" src="http://www.duplika.com/img/ffx/otros-ff3.gif" title="Descargar la versión más reciente de Mozilla Firefox"/></a></p> <p>Estás utilizando Internet Explorer y es posible que veas errores. Este sitio funciona mejor con <b>Mozilla Firefox</b>, que además es más rápido, seguro y 100% libre de virus. Haz clic en el botón para descargarlo (es GRATIS).</p>
<![endif]-->
Lo guardamos, colocamos el puntero sobre el enlace que dice "Editar", y nos fijamos en la dirección que aparecerá en la barra de estado:
Si en la parte señalada no dice #HTML3 la sustituiremos por la que se muestre en su lugar. Nótese que en el código aparece dos veces.
Ahora ya podemos entrar al blog con cualquier versión de Internet Explorer para ver cómo quedó.
29 comentarios:
Interesantísima información ¡Y muy bien explicada! Hasta una tonta como yo puede entenderlo a la perfección.
Cada día te curras más tu blog.
Un abrazo.
Perséfone: Muchas gracias, me gusta publicar cosas útiles (cuando se me ocurre alguna :D).
Son ganas de discriminar, y todo para promocionar un navegador que tampoco es nada del otro mundo y tiene su buena ristra de fallos ...
Si al menos recomendaras Opera
asr: Si hice este mensaje no fue por el deseo de discriminar, sino porque estoy harto de ese programa tan malo que es Internet Explorer, que muestra errores por prácticamente cualquier cosa y falla hasta en lo que los demás hacen perfecto. En la entrada anterior mencioné la vez en que se negaba a mostrar el formulario de comentarios y la sidebar derecha (en aquel entonces mi blog tenía dos sidebars), a pesar de que todos los demás navegadores sí lo hacían.
Yo no soy diseñador web y no tengo ni los conocimientos, ni el tiempo, ni la disposición para estar arreglando cada error que surge con Explorer, menos aún cuando sé que no son por mi culpa, y me es mucho más fácil hacérselo saber a mis visitantes por medio de este mensaje que seguir quebrándome la cabeza sin llegar a ningún lado; además, mi blog no es el único que tiene problemas con IE, son millones y esa es la causa de su impopularidad.
Por otra parte, si escogí a Firefox como primer alternativa fue, además de por el hecho de que muestra las páginas muy bien; porque su interfaz es muy similar a la de Internet Explorer, e imagino (aunque puede que esté equivocado) que su aceptación entre los usuarios asiduos a IE será mayor.
Mencioné en la entrada anterior, en esta, y repito ahora por segunda vez, que el mensaje es totalmente personalizable y cada quien puede recomendar el navegador que guste. Si tu favorito es Opera por mí no hay ningún problema, es una excelente alternativa y yo mismo lo uso con frecuencia.
@asr: Más que ganas de discriminar, son ganas de promover un navegador que, si bien tiene fallos (como todos), al menos respeta los estándares web.
Recomendar Opera? No gracias, nunca lo probé pero hasta donde sé es un gran navegador, quizás uno de los mejores. Pero no deja de ser software privativo. ;)
Lagg3r: Es una opinión aceptable, aunque creo que no recomendar Opera sólo por ser software privativo es lo que podría considerarse como discriminación, ¿no crees?
Para nada. Yo no estoy descalificando a Opera ni mucho menos, todo lo contrario. Lo que digo es que no recomendaría software privativo, por más freeware que sea, teniendo alternativas libres iguales o incluso mejores. Es un criterio personal, cada uno defiende lo que mejor le parece.
Saludos
Es curioso como hasta el ema de los exploradores va por modas (al menos esa es mi impresión).
Es tan simple como que cada uno utilice el que mejor le venga y con el que mejor se apañe en base a sus necesidades ¿no? Nunca vienen mal unos consejos. Para los que nos movemos bien con este navegador unos consejillos vienen de lujo.
Un saludo.
Lagg3r: Entiendo, y como dije, es una opinión aceptable. :)
Perséfone: Sí, lo que importa es que nuestros sitios se vean bien para que puedan leernos, lo demás no es de nuestra incumbencia.
HOLA...MIRA YO TENGO CON IE EL MISMO PROBLEMA Q TU TENIAS...AL PRINCIPIO SE VEIA BIEN ALLI Y EN FIREFOX LA SIDEBAR QUEDABA MONTADA SOBRE LOS POST..AHORA ES AL REVES...FIREFOX SE VE PERFECTAMENTE MIENTRAS EN IE NO SE VE LA SIDEBAR Y LA ADVERTENCIA SE VE EN FIREFOX Y EN IE SOLO SE VE LA ETIQUETA DE ADVERTENCIA DEBAJO DEL TITULO..EL TEXTO NO SE VE...PLEASE AYUDAME,,,
Ironú Mora: En estos momentos te estoy escribiendo un e-mail para poder atenderte mejor.
¡Muy bueno! Yo en vez de hacer una pelea de Opera contra Firefox o software privativo contra software libre, preferí ofrecer los dos navegadores para la descarga. ¿Por qué elegir uno solo, si ambos son buenos y pueden estar incluidos en el código de este mensaje que se ve sólo en IE?
Me parece una excelente manera de recomendar otro navegador.
Yo dejé de usar Internet Explorer gracias a un mensaje así que me apareció en una página...
Saludos.
Hola Manuel, te agradezco mucho este valiosísimo aporte,
He sido Webmaster de un sitio comercial y he construído mi sitio
propio y la gente de esta empresa ya me tenía cansado cuando empecé,
toda la vida luchando contra ellos, porque ellos luchan contra nosotros,
no nos dan servicio, nos ofrecen sacrificios, basta recordar lo que les
pasó a los que pagaron la fortuna que salía Windows 98, para encontrarse
al poco tiempo con que cuando llevaban un trabajo a otra máquina con
un desarrollo más moderno, le salian carteles de que era un archivo
realizado con un software desconocido !!
Aproveché tu obra maestra y me desahogué, no me gusta que la gente que
vea mi cartel, si navega mi sitio con IE, se quede pensando que quiero
promocionar otro browser, para mí, le tiene que quedar bien clarito
que el browser que usa es una basura, por eso mi cartel dice lo siguiente:
Está utilizando Internet Explorer.
Es por eso que no podrá ver este sitio correctamente.
El menú para navegar el sitio, tendrá que ir a buscarlo al fondo de la página. Le recomiendo que use otro navegador.
CUALQUIERA es mejor.
Con ellos no tendrá este problema.
y agrego una firma mía en una imagen, para que no queden dudas
de que me hago responsable de lo que les digo.
Si quieren copiar el código, es el que sigue, le saqué la parte
de la firma personal
Si navegan con IE, lo pueden ver en
http://www.oscarperone.com.ar/
No es propaganda Manuel, es solo testimonio de lo que me ayudaste,
y cuanto te lo agradezco.
MIL GRACIAS
Oscar Perone
Buenos Aires
Argentina
Buena entrada Manuel de la Fuente, y bien explicado. Saludos!
LeonardoN: Te quedó muy bien. :)
Yo en lo personal decidí recomendar sólo uno para evitar confusiones, y hacer la descripción lo más corta posible para aumentar la probabilidad de que hagan clic en el botón. No sé qué tan bien haya funcionado, hace mucho que quité el sistema de estadísticas que le había puesto. :$
Oscar Perone: Je je, mi "obra maestra". Bueno, a lo mejor sí lo es. :D
Hablando de descripciones cortas y al grano, la tuya es un muy buen ejemplo, y totalmente adecuado en vista de cómo muestra Explorer tu sitio. Se parece mucho al error que tuve yo alguna vez.
No te preocupes por compartir el código; al contrario, te agradezco que lo hayas hecho, pero para escribir códigos en los comentarios hay que convertirlos previamente a texto plano, de otro modo no salen. ;)
Carlos Soler: Muchas gracias. :)
Gracias Manuel, siempre eres muy didáctico, y gracias por brindarme la dirección a la página que hace ese trabajo on line, muy útil, como todo lo que nos brindas.
Pongo el código entonces, para que si hay alguno que lo quiera hacer del modo que hago, la tenga más fácil:
<!--[if lte IE 8]>
<p id="nunca-mas-ie"><strong>Está utilizando Internet Explorer.</strong> Es por eso que no podrá ver este sitio correctamente. El menú para navegar el sitio, tendrá que ir a buscarlo al fondo de la página. Le recomiendo que use otro navegador. <strong>CUALQUIERA</strong> es mejor. Con ellos no tendrá este problema.
<![endif]-->
Muchas gracias por todo
Oscar Perone
Si te dedicas a diseñar profesionalmente webs, no te queda más remedio que adaptarte a todos los navegadores posibles, incluido IE.
Pero para los que tenemos el blog por hobbie, sin apenas tiempo para actualizar el contenido, sólo nos faltaba, además, atender a las exigencias del navegador propietario del mayor monopolista del mundo en ordenadores de sobremesa.
En mi caso, tengo el problema añadido de que no puedo visualizar inmediatamente lo que hago con IE, simplemente porque no puedo instalar y utilizar ese programa, al utilizar como sistema operativo habitual Ubuntu (una distribución de GNU/Linux).
Así que por los dos motivos anteriormente expuestos, adopto, con tu permiso, este código tuyo (versión Blogger), le haré, quizá, alguna modificación en el texto y/o la imagen, y formará parte de mi nuevo diseño, que tengo bastante avanzado, pero al que le faltan detalles como, por ejemplo, este.
Un saludo y gracias :)
Para José GDF, Por supuesto que tienes permiso, si para eso lo puse.
Los que tenemos sitio propio, o un blog, y por lo tanto no tenemos la obligación de lidiar con Mierdosoft
para que nuestros clientes no nos digan que no sabemos nada de programación de un sitio, pues el que nos recomendó, no se ve de manera correcta con IE, deberíamos
hacerle una campaña de esclarecimiento, hay muchos que navegan con esa bosta, pero como los programadores sudan la gota gorda para que no se den cuenta que es una mierda en pasta, están lejos de la realidad, realidad a la que los traeríamos de los fundillos, si en cada sitio propio o blog, hay un cartel, no ofreciendo que se pasen a ningún otro browser (porque si no piensan que tenemos algún arreglo económico para hacerlo) sino poniéndolos enfrente de la verdad:
Van atrasados y navegando con un tronco, y no con una nave, como corresponde a estos tiempos modernos :-)
Dejo tirada la idea de hacer una campaña, que Manuel si está de acuerdo, con su sapiencia, y si quiere, puede encabezar, con un texto ya preparado, para pasarlo a los blogguer, que tienen mucho más poder del que se piensa, y reventarlo con un cartelito esclarecedor a Mierdosoft y su Imperio.
No crean, si lo hacemos, nos podemos hacer famosos, creo que no es mala idea, y si se hiciera a escala mundial (porque todos los odian) podemos hacer un ruido de la hostia
Oscar Perone
José GDF: Te comprendo perfectamente, de hecho es casi lo mismo que dije en el cuarto comentario; pero lo cierto es que aunque fuera diseñador web aún así no me importaría IE, porque es un navegador que va de salida.
Oscar Perone: Mmm, si quieres refina un poco tu idea y veremos qué se puede hacer. :)
Pues no creo que haya que refinar mucho.
Creo que deberíamos crear un texto que denuncie la inutilidad de IE
un texto como el que uso en mi sitio,
algo claro, directo, sin proponer ningún otro browser, para que no piensen que trabajamos para el que recomendemos,
poniendo en claro que es una basura,
que, como digo en mi sitio, CUALQUIERA
es mejor, que con cuaalquiera tendrá más velocidad, prestaciones, en fin, ustedes la conocen más que yo,
propongo refinar el texto que uso,
pero si creen que ese no sirve, caulquiera que diga más o menos lo que propongo, sirve.
Abajo Mierdosoft !! :-)
Oscar Perone
Oscar Perone: No es tarea nada fácil, ya lo he intentado algunas veces; hice un blog específicamente para ello e inicié una cadena que nadie reenvió. La gente puede ser muy terca.
En caso de que lo intentemos de nuevo, forzosamente tendríamos que recomendar algún navegador, pues si incluso proporcionando el enlace directo de descarga las personas no hacen clic en él, mucho menos van a invertir tiempo buscando por su cuenta.
Yo insisto en recomendar Firefox por las razones que mencioné más arriba.
Si quieres hacerlo así, y solo es cuestíón de link,
pongamos a firefox, a chrome, a safari, a opera, y entonces
advertirán, y no podrán pensar, que tenemos algún otro interés
que no sea advertirles de la basura que usan.
Un abrazo, cuenta conmigo
Oscar Perone
Oscar Perone: Nada pierdes con intentar. Yo realmente me quedé decepcionado por los fracasos anteriores y quiero pensar que este truco que expuse fue mi granito de arena para la causa, pero si estás interesado en iniciar otro movimiento, puedo darte algunos consejos útiles; tú decides si los tomas o no:
* Recomendar un navegador - El que sea, pero sería bueno escoger uno y nada más. Si no recomiendas ninguno, ten por seguro que nadie se pondrá a buscar por su cuenta, y si recomiendas dos o más, lo más probable es que la persona prefiera no meterse en líos y se quede con lo que ya usa.
* Poco texto - Pero al grano y en lenguaje coloquial. Nada de palabras como "estándares", "desarrolladores", "HTML" y eso. Estamos hablando con personas que no saben ni tienen interés alguno en cuestiones de tecnología. Serían mucho mejores algunos ejemplos, como los recientes ataques a Google por la falla de seguridad de Explorer y capturas de pantalla de un sitio que se ve mal con ese navegador y bien con los otros (el tuyo, podría ser).
* Muchas imágenes - Mientras más, mejor. Simpáticas para referirse al navegador que recomendarás (me sigo quedando con Firefox) y lo opuesto para Explorer.
Mmm, creí que se me ocurrirían más cosas. :$
Me avisas lo que pensaste. Yo por ahora estoy indispuesto a acometer la iniciativa por mi cuenta, pero no descarto hacerlo más adelante.
Manuel, yo ya soy lo suficientemente
viejo como para haber aprendido que no debo
tropezar en la piedra donde ya han tropezado
otros, tu experiencia me alcanza para comprender
que no es racional meterse a hacer algo que has
hecho, (con la capacidad que demuestras que tienes) y que te ha dejado decepcionado como estás, dejemos que cada uno se de cuenta solo de lo que le pasa, me limitaré, como hago, a dejarles bien en claro, con tu ayuda que te agradezco, que navegan con un pedazo de basura en vez de con un browser, y allá ellos, Gracias por todo, en especial por tu paciencia, y querer compartir tu conocimiento con nosotros,
Un abrazo.
Oscar Perone
oscarperone@gmail.com
http://www.oscarperone.com.ar/
No te desanimes, Oscar; el que a mi no me haya funcionado no significa que a ti tampoco. Puedes iniciarlo como un meme y que cada bloguero le vaya aportando algo. No sé, hay muchas opciones.
Se supone que no se debe escribir el e-mail en los comentarios, pero por esta vez lo dejo pasar. :)
No se que es un meme, explícamelo por favor, para aprender, desde ya gracias
Oscar Perone
Oscar Perone:Qué es un meme
Realmente excepcional el código y muy bien explicado. Llevaba mucho tiempo buscándolo, muchas gracias (y gracias a Rosa de elescaparatederosa.blogspot.com).
InternetON
Senosiain: Sí, hay que agradecerle mucho a Rosa, primero porque fue un artículo suyo el que me inspiró a hacer esto (dejo la dirección abajo), y segundo porque gracias a ella lo han conocido muchas personas. :)
Detectar el navegador de tus visitas con CSS
Deja tu comentario:
En este blog se valora la libertad de expresión, así que puedes escribir lo que quieras, únicamente tendré que borrar tu comentario si: