Tips sobre gifs

1. CÓMO UTILIZAR LOS GIFS ANIMADOS EN TU WEB:
  • Para poner una imagen en tu blog (ya sea un gif animado o una imagen estática) puedes utilizar este código HTML:
<img src="URL-de-la-imagen" / >

    Este es un ejemplo:



  • Si deseas que la imagen conduzca o redirija hacia algún link o enlace, utiliza este código HTML:
<a href="URL-del-enlace"><img src="URL-de-la-imagen" / ></a>

    Así quedaría la imagen, con su enlace:



  • Si además de lo anterior, quieres que el enlace se abra en una ventana aparte, entonces escribe este código HTML:
<a href="URL-del-enlace" target="_blank"><img src="URL-de-la-imagen" / ></a>

    Así, el enlace se abriría en una nueva ventana:



  • También puedes agregarle algún texto que aparecerá cuando se pase el mouse o ratón sobre la imagen. En ese caso, el código HTML sería el siguiente:
<a href="URL-del-enlace" target="_blank"><img src="URL-de-la-imagen" title="El-texto-a-mostrar" / ></a>

    Este es la muestra del enlace con "title" o mensaje a mostrar:



2. CÓMO CAMBIAR EL TAMAÑO DE LOS GIFS ANIMADOS:
  • Hay diferentes maneras de editar un gif animado. Para eso existen los softwares adecuados o simplemente, puedes hacerlo online, en muchos sitios que hay en la red (eso lo veremos en otros artículos).
         Pero en este caso, vamos a ver cómo cambiar fácilmente el tamaño de los gif animados, tan solo con alterar las medidas en el código de estilo de la imagen. Veamos un ejemplo:
         Las dimensiones originales de esta imagen animada son 343px de largo por 350px de alto (width: 343px; height: 350px):
         Si queremos reducir su tamaño, pero utilizando la misma imagen desde su URL original (sin tener que editarla ni volverla a subir a un hosting): lo que haríamos es simplemente asignarle las dimensiones que queremos, de la siguiente forma:

    <img style="width: NÚMEROpx; height: NÚMEROpx;" src="URL-DE-LA-IMAGEN">

         En donde "width" es el ancho, "height" es el alto y NÚMERO es el valor en pixeles de esas dimensiones.
       En este caso, redujimos el tamaño de esa misma imagen original (usando la misma URL), asignándole los valores de 200px y 150px. Así se ve entonces: 
         Al cambiarle las dimensiones a una imagen es importante que recuerdes mantener los valores proporcionales de la imagen original, para que no se deforme. Yo no lo hice a propósito aquí, para mostrarte lo que pasa.
         Si observas la imagen original, la esfera dentro de la cual está el paisaje es redonda; pero al reducir el gif animado ya no es circular, sino ovalada. Esto sucedió porque no mantuve las proporciones de la imagen al cambiarle el tamaño.
       También podemos agrandar el tamaño de una imagen animada, haciendo lo contrario de lo que hicimos aquí; es decir, asignándole valores mayores a los de su alto y ancho original Solo debes tener en cuenta que si agrandas demasiado la imagen, perderá resolución y por consiguiente, perderá calidad.



3. CÓMO VISUALIZAR LOS GIFS ANIMADOS QUE ESTÁN GUARDADOS EN TU PC:
  • Recuerda que para que puedas apreciar el movimiento de los gifs animados que tengas guardados y residentes en tu computadora, deberás abrirlos con algún navegador de Internet (Google Chrome, Mozilla Firefox, Internet Explorer, Safari, Opera, etc.).
         Para ello, te posas sobre la imagen y con el botón derecho del mouse o ratón le das a "Abrir con" y escoges el programa para abrirlo.
  • Si solo abres los gif animados con algún visor de imágenes, los verás como simples imágenes estáticas, sin movimiento.



DEJA TUS PREGUNTAS:
  • Si tienes alguna pregunta sobre estos temas, puedes dejarla con toda confianza en la sección de preguntas y respuestas de esta otra entrada: