Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Cómo usar .gifs animados

Un .gif (formato de intercambio de gráficos) es un tipo de imagen que admite animaciones cortas. Los .gifs animados se reproducen automáticamente, no incluyen sonido y, por lo general, se repiten.

En Google Imágenes y sitios como giphy.com puedes encontrar imágenes .gif, o crear las propias con software de terceros. Cuando tengas un archivo .gif, puedes cargarlo en cualquier lugar de tu sitio que admita imágenes.

Este es un ejemplo de un .gif animado:

gif-example.gif

Cómo agregar un archivo .gif

Puedes subir un .gif en cualquier lugar de tu sitio donde puedas agregar imágenes, tales como:

El .gif tendrá las mismas opciones que una imagen estática. Por ejemplo, si las imágenes de banner de tu sitio admiten texto superpuesto, este puede mostrarse sobre un banner .gif.

Nota: Si editas un .gif con el editor de imágenes integrado, convertirá el .gif en un archivo .jpg estático.

Buenas prácticas

El tamaño debe ser pequeño

Los .gifs grandes pueden ralentizar tu sitio. Recomendamos dar formato a .gifs animados para que tengan el tamaño que deseas que se muestre en tu sitio. Sigue nuestras prácticas recomendadas de imágenes para asegurarte de que tus .gifs cumplan con nuestras pautas de tamaño de archivos.

Incluso si tu .gif está por debajo de nuestro límite de tamaño, el número de cuadros individuales puede impedir que se cargue. Puedes intentar comprimir el archivo usando herramientas de imagen de terceros. Esto está fuera del alcance del soporte de Squarespace. Si la calidad es deficiente después de comprimir el .gif, convierte el archivo en un video y agrega este video a tu sitio.

Evita imágenes que distraen

Si bien los .gif pueden ser una excelente manera de llamar la atención o agregar movimiento dinámico, esto también puede distraer. Evita usarlos:

  • En secciones donde quieres que los visitantes se centren realmente en el texto u otro contenido.
  • Varias veces en una sola sección, ya que tanto movimiento podría ser desagradable.

Cómo crear botones animados

Las URL clickthrough convierten las imágenes en enlaces a otras páginas del sitio, páginas externas o archivos. Estos enlaces están disponibles en bloques de imagen, bloques de galería y algunas páginas de galería.

Consejo: Los logotipos tienen una URL clickthrough integrada que te lleva a tu página de inicio.

A continuación, te presentamos un método para crear un botón animado:

  1. Agrega un bloque de imagen de póster a un área que admita bloques, como una página de diseño.
  2. Carga el .gif en la pestaña Contenido.
  3. En la pestaña Diseño, agrega el vínculo en el campo URL clickthrough. Si estás enlazando a una página de tu sitio web, crea un vínculo de contenido.
  4. Utiliza el título o subtítulo del bloque de imagen de póster para añadir texto.
  5. Modifica el estilo del bloque de imagen y agrega otros bloques para cambiar su tamaño.

gif-example4.gif

Cómo usar una URL de video en lugar de un .gif

Puedes crear un efecto similar a un .gif animado agregando un fondo de video a un encabezado o página de portada.

  • Al igual que los .gif, los fondos de video se reproducen automáticamente, se repiten y no incluyen sonido.
  • En lugar de utilizar un archivo .gif, debes enlazar a una URL de video, como un video de YouTube.
  • Los fondos de video para páginas de portada están disponibles en todas las plantillas. Los banners de video solo son compatibles con algunas plantillas.

Para obtener más información, visita Añadir un video de fondo.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 50 de 136