 
Doblándole la mano a Dreamweaver
No pretendo descubrir América con este artículo, solo es una reunión de información que anda dando vueltas por el mmug y por la web en general.
En la búsqueda de una web apegada a los estándares de la W3C y que cumpla con algunos criterios básicos de accesibilidad, expongo más abajo 2 "correcciones" que debiesemos aplicar sobre códigos que (de mala manera)
inserta Dreamweaver.
EL FAMOSO POPUP
Todos sufren la tentación más de alguna vez de en vez de usar un simple target="_blank", usar un popup por un motivo, seguramente, estético. Y lo normal es usar ese comportamiento que ya trae incorporado Dreamweaver (programa que si bien le facilita la vida a algunos, le entorpece el código a muchos otros... esto sin mencionar todo el código basura, y errores de compatibilidad).
Pues bien, ese código parte ya con un error de "compatibilidad" podríamos decir, ya que al momento de insertarlo, se debe definir el "HREF" del vínculo que utilizará el "onClick javascript"... al 90% de gente que conozco, le enseñaron que eso se hacía poniendo un "#". Ahí ya tenemos el primer error, pues con ese símbolo el popup no funciona bien en firefox. La supuesta solución sería en vez del "#" poner "javascript:;", lo que soluciona el problema de compatinilidad entre distintosnavegadores, pero ahora aparece un problema de accesibilidad y usabilidad. ¿Qué pasa con quienes no soportan javascript, con los robots que indexan sitios, con los
softwares dedicados a discapacitados?
La solución la leí acá en el mmug, y lamentablemente no recuerdo quién la escribió, pero que deje un comentario acá abajo para que se lleve la gloria,je je.
Es tan simple como usar el código "correcto"... y si bien es necesario insertarlo a mano, es un pequeño sacrificio que debemos hacer en pos de realizar buenas webs.
Esto va en el HEAD:
<script type="text/javascript">
function popUp(target, name, features){
window.open(target, name, features);
}
</script>
Esto lo usamos donde queramos en nuestra web:
<a href="archivo.html" onclick="popUp(this.href,'Popup1', 'width=100,height=200'); return false;">Abrir popup</a>
Con este código logramos que en el vínculo (<A>) exista una dirección válida a la que acceder(HREF) y en el código Javascript se agrega el "return false;" para que si se ejecuta el popup, la ventana principal no se vaya al link especificado en el HREF.
¿Perfecto, no? Pues ahora tenemos popup para los que quieran y tenemos navegación convencional para los que no quieran. Ahí tenemos a todo el mundo arriba de la micro.
Nota: Los Features posibles de usar son:
toolbar=yes
location=yes
status=yes
menubar=yes
scrollbars=yes
resizable=yes
width=ancho_en_pixeles
height?alto_en_pixeles
Si el atributo no se nombra se considera como "no"
INSERCIÓN DE FLASH
Acá se viene el otro dolor de cabeza de la validación: la inserción de un swf en nuestra web.
El código que inserta Dreamweaver no pasa la validación. Así de simple.
El código correcto lo saqué de varias web mencionadas acá y googleando un poco. De seguro existen modificaciones, pero algo básico podría ser:
<object type="application/x-shockwave-flash" data="tuflash.swf" width="100"
height="100" />
<param name="movie" value="tuflash.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<img src="flash.gif" width="100" height="100" alt="Flash" />
</object>
Se puede ver que antes de cerrar la etiqueta OBJECT se inserta una imagen. Esta imagen se muestra en caso de que la película flash no se cargue. Con esto es posible mantener una consistencia en el diseño en máquinas que no
tengan el plugin de flash instalado.
Y bien, ese es mi aporte por hoy. Espero que los que hayan leído pongan en práctica estos códigos para que podamos contruir webs válidas a futuro (presente en realidad). los que ya sabían, sigan contestando esto en los
foros, pues la educación (o en este caso "corrección de la educación" diría yo) es el camino pra lograr una mejor experiencia en la web.
lesterfibla( )
18/05/2006

|