Algunos trucos útiles en HTML para blogueros (II)

Descubre algunos consejos para la edición y formato de las imágenes incorporadas a tu blog.

Las imágenes en los blogs tienen dos objetivos claros:

El primero es ilustrar el contenido de vuestros mensajes, apoyando visualmente vuestras ideas y argumentos con imágenes alusivas al texto que acompañan.
El segundo, y no menos importante, es dotar a vuestro blog de un aire atractivo para los lectores, especialmente si el texto es muy denso. Permitiendo así que el lector descanse la vista y asocie y aprehenda lo leído con ayuda de es imagen ilustrativa.

Por la importancia  demostrada de la imagen y para cumplir con los requisitos de accesibilidad web del W3C Consortium no debéis olvidar incorporar en HTML el atributo ALT a la etiqueta IMG  que incluye en el código cada una de las imágenes de un mensaje. El efecto práctico de esta etiqueta es que al pasar el cursor sobre la imagen, aparece el texto introducido (dependiendo del navegador). De este modo  la imagen queda plenamente identificada y descrita, tanto de cara al lector como para los buscadores y motores indexadores de vuestros blogs. Por tanto, ayudáis también a mejorar la visibilidad y el posicionamiento de vuestros post en la blogosfera.

IV Concurso de Fotografía madri+d

La sintaxis de esta etiqueta es la siguiente:

[<img src="/blogs/ayuda/wp-content/blogs.dir/95/files/546/o_iv_foto.gif"  alt='Texto de descipción de la imagen">]

Si además queréis darle una organización más atractiva al mensaje al que habéis incorporado una imagen, Weblogs de Ciencia y Tecnologíaos sugerimos utilizar el siguiente código para que el texto aparezca rodeándola. De esta forma conseguiréis captar más rápidamente la atención del lector, invitándole a que continúe la lectura y no abandone, y permitiendo una asociación más intensa entre el texto y la imagen. Para la alineación del texto con la imagen a la derecha, el código a incluir dentro de la etiqueta IMG  es

style=”margin: 0 0 2px 5px; float: right;”

Mientras que para  lograr que la imagen aparezca a la izquierda del texto, debéis introducir este otro:

style=”margin: 0 5px 2px 0; float: left;”

Desde madri+d os animamos a incoporar estos consejor a la redacción de vuestros blogs.

Etiquetas:

Si te gustó esta entrada anímate a escribir un comentario o suscribirte al feed y obtener los artículos futuros en tu lector de feeds.

Comentarios

sabes, me funciona sólo para IE y me gustaría que tambien funcionase para Firefox

(requerido)

(requerido)


*

Responsable del tratamiento: FUNDACIÓN PARA EL CONOCIMIENTO MADRIMASD con domicilio en C/ Maestro Ángel Llorca 6, 3ª planta 28003 Madrid. Puede contactar con el delegado de protección de datos en dpd@madrimasd.org. Finalidad: Contestar a su solicitud. Por qué puede hacerlo: Por el interés legítimo de la Fundación por contestarle al haberse dirigido a nosotros. Comunicación de datos: Sus datos no se facilitan a terceros. Derechos: Acceso, rectificación, supresión, oposición y limitación del tratamiento. Puede presentar una reclamación ante la Agencia Española de Protección de datos (AEPD). Más información: En el enlace Política de Privacidad..