Imagenes y accesibilidad

1 02 2008

Foto sin text

cuando usas imágenes en un documento html, es necesario que coloques una descripción de ella, esto permite que cuando no cargue la imagen se pueda ver de que trata, ademas cuando visite una persona tu web con un navegador de texto, como lo hacen los invidentes… pueda este leer el contenido tranquilamente.

Ademas de esto, esta demostrado que Google te indexa mejor, son truquitos que se van aprendiendo a lo largo de la vida :P vamos a ver un ejemplo:

Pead

ahí vemos una serie de imágenes, ahora vamos a deshabilitarla con opera.

pead sin imagenes

Esta captura nos sirve para también mostrarles lo del anterior post, donde hablaba de la importancia del color de fondo cuando se usa imágenes de fondo, aquí vemos que el texto y la información es totalmente visible, también observamos que al quitar las imágenes, aparecen textos que representan esas imágenes que no están… eso es bueno ya que por ejemplo si tenemos un sitio personal y esta la foto de toda la familia y en el caso que no cargue, aparecerá el nombre de cada uno de los integrantes…. esto se logra de la siguiente manera:

En dreamweaver en modo gráfico seria algo así:

Dreamweaver propiedades

donde dice ALT ahí, se coloca el texto descriptivo, tiene que ser lo mas explicativo posible. tampoco FOTO CON ARBOLES MUY HERMOSOS naaa tampoco, pero si por ejemplo foto con PEDRITO, JUANITO, MARCELA, ANDREA, ANDRES EN EL DIA DE EL AMOR Y LA AMISTAD.

Esa es una forma, si tu trabajas con el código directamente pues ya te muestro como se hace :P

<img src=“img/ojos_bonitos.jpg” alt=“Foto de articulo” />

alt=“Foto de articulo” es el texto que se debe insertar, para colocar la descripción de la imagen. practiquen y me comentan.





Quieres saber como se ve tu web desde un movil?

6 01 2008

Cuando haces una web, muchas veces deseas saber como seria tu web desde un móvil, entonces desde hace algún tiempo, opera incorporo una opción para ello. la cual modifica el navegador y te permite ver tu web como desde un móvil.

Primero, abrimos www.opera.com :
Opera captura 1

Nos ubiucamos en le menu que dice DOWNLOAD y le damos en OPERA DESKTOP:
Seleccionar descarga
Descargamos el opera y lo instalamos.
Opera Home
Ahi tenemos la foto de opera instalado, ahora simplemente abrimos la pagina que deseamos ver en forma movil, en este caso vamos a utilizar http://buzzeando.com/ una pagina al azar que encontre en wordpress:

Opera buzz
ahora simplemente le damos SHIFT + F11 y listo!!!!
Teclado
Listo tenemos una pagina vista como desde un celular, gracias al unico OPERA :D

Movil

Si quieren volver a el estado anterior, ale estado full le dan SHIFT + F11.

Hay un dato para recordar, y es que DREAMWEAVER incorpora en su software una vista de movil, y este usa la ultima version del opera.