Diseño de páginas web en Bilbao y Bizkaia

Archivo de Categorías: Diseño Web

  • 0
Dónde descargar gifs animados

Dónde descargar gifs animados gratis de series y películas

Categoría : Diseño Web

En el marketing de contenidos la llamada a la acción es fundamental, por lo que estamos obligados a presentar nuestros artículos de manera tal que consigan atraer la atención del usuario con un simple golpe de vista. Esto es lo que técnicamente se conoce como lead magnet. Para hacer nuestros post más atractivos solemos recurrir a las imágenes y a los vídeos, pero hoy en día lo más efectivo es incluir infografías y gifs animados. Sobre la importancia de las infografías para el link baiting (consecución de enlaces naturales) ya os he hablado en más de una ocasión, por lo que ahora me gustaría centrarme en los gifs, esas pequeñas imágenes animadas que suelen tener un cariz cómico o entrañable.

La historia de los gifs es cuando menos singular. Poblaron la Red en sus inicios, saturando de colores y animación miles y millones de páginas web. Por aquel entonces eran casi como una invasión alienígena. Cuando el diseño web se hizo más profesional, por decirlo así, y tendió al minimalismo y al flat design, los gifs prácticamente desaparecieron. Y quién nos iba a decir que tiempo después, al socaire del marketing digital y los Social Media, volverían a la carga con aires renovados, en parte, también, por el auge de las series. Ahora están viviendo una segunda Edad de Oro.

Y lo mejor es que los gifs no sólo se utilizan para contar chistes o hacer la gracia, que también, sino que ahora sirven al propósito de hacer branding, y así veréis que muchos bloggers y Community Managers los utilizan a menudo en sus tweets.

Está demostrado que los gifs, al igual que las infografías, aumentan el engagement y pueden hacer que tus post se conviertan en virales, pues ¿a quién no le gusta reírse con un fragmento de una serie querida y emblemática?

Gifs animados

Además, tienen algo que hipnotiza. ¿A vosotros no os pasa que os quedáis mirando fijamente este gif del genial Steve Carell (Michael Scott en ‘The Office’) y al leer los labios casi podéis oír lo que está diciendo, aunque no tenga audio?

Yo recomiendo usar gifs sacados de series y películas porque son los que mejor quedan y aportan un valor añadido. Tu mensaje quizá no cause sensación por sí solo, pero si el gif es gracioso y muchos de tus seguidores captan la referencia seriéfila o cinematográfica, es muy probable que lo retuiteen y termine haciéndose viral.

De entre todos los sitios web donde puedes descargar gifs, yo recomiendo estos 5:

1-Giphy

Giphy

Sin ninguna duda, es la mejor web para descargar gifs, la que casi todos los Community Managers utilizan, y además es ideal para buscar planos de series y películas. Tiene un buscador y un menú con una serie de categorías (reacciones, entretenimiento, deportes, vacaciones, artistas) y una lista con un trending topic de lo más buscado. Sin necesidad de registrarte puedes descargar el gif que elijas o compartirlo en redes sociales. También puedes importarlo a tu web como vídeo HTML 5 o en un iframe embebido. Aquí puedes encontrar prácticamente de todo. Su base de datos es inmensa.

2-Gifmania

Gifmania

Este sitio web es más, digámoslo así, infantil que Giphy, pero no deja de ser una buena opción. Puedes descargar gifs sin registro o insertar el código en tu blog, así como compartirlo en redes sociales. Tiene un poco de todo, desde las típicas animaciones de dibujos animados, como Los Simpson o Disney, hasta videojuegos, Anime y Manga, pasando por los clásicos emoticonos. También puedes encontrar gifs de series, como ‘The Big Bang Theory’.

3-PicGifs

PicGifs

En esta página también tienes una gran variedad de gifs para descargar gratis. Están ordenados por categorías. Una de las que más juego dan es “reaction gifs”. Las ventajas de PicGifs con respecto a los dos anteriores es que tiene una herramienta para crear tus propios gifs y unos gráficos compatibles con Facebook. Puedes guardar las imágenes o enviarlas como e-card. También tiene un foro y un libro de visitas, pero sólo están en inglés.

4-Gifs.com

Gifs.com

Éste es un editor de gifs animados. Puedes pegar la URL de un vídeo de YouTube, Vine o Instagram y te lo convierte en formato gif. Es ideal para crear memes.

5-Make a Gif

Make a Gif

Es similar al anterior. Sirve para crear gifs animados a partir de imágenes, vídeos, YouTube y webcam. Además, hay una colección de gifs descargables, y lo mejor es que puedes personalizarlos añadiéndoles texto. Dentro de las categorías tienen la de Tv Gifs.

Y si hablamos de crear gifs, hay una última y mejor alternativa, sólo apta para mentes inquietas:

6-Crea tu gif animado con Photoshop

Gif animado, Photoshop

Si eres creativo y sabes manejar Photoshop, quizá la mejor opción para ti sea crear tu propio gif animado. Con Photoshop es muy sencillo. En su ventana inferior tienes todo lo que necesitas. Por cada capa tendrás una pista con su correspondiente línea de tiempo, y lo único que tienes que hacer es crear transiciones de movimiento desplazándote a través de la línea de tiempo con la cabeza lectora y generando fotogramas clave, o jugar con la opacidad, haciendo aparecer y desaparecer capas y consiguiendo así fundidos sutiles, o probar con efectos más arriesgados como giros o rotaciones.

Con Photoshop también es posible editar cuadros a la manera de fotogramas y realizar montajes con una transición de corte plano por plano o con una interpolación de movimiento, añadiendo cuadros intermedios. Dicho así, sé que suena complicado, pero crear un gif animado con Photoshop es de lo más fácil, y no hace falta tener grandes conocimientos en materia de diseño web.

El mayor inconveniente de estos gifs generados con Photoshop es que, a poco que insertes keyframes, su peso aumentará una barbaridad, además de que su resolución no será, por lo general, la más óptima. De ahí que la herramienta más profesional y extendida para crear animaciones (una vez desterrado Flash por sus muchos defectos, tanto a nivel de indexación y SEO como de vulnerabilidad en los navegadores) sea Adobe Egde o Animate, que lo que hacen es convertir esas animaciones en código HTML 5 y CSS 3. Aparte, también están los canvas creados a partir de Javascript, pero para eso hay que saber mucho de programación.

7-Comprime tus gifs

Comprimir gifs animados

Si nos preocupa cómo afecta el peso de las imágenes a la velocidad de carga –y debería preocuparnos, pues repercute directamente sobre el SEO–, existen compresores de gifs animados. El mejor, el que yo suelo usar, es ILoveIMG, que también funciona con otros formatos de imagen como JPG y PNG, pero para estos casos yo prefiero TinyPNG, que es insuperable. No obstante, ILoveIMG es capaz de reducir el peso de los gifs hasta un 25% (para muestra, el que se puede ver aquí) sin pixelado ni aparente merma de calidad. Esta herramienta online también sirve para recortar y redimensionar imágenes y convertir a JPG o GIF, y además funciona con drag-and-drop, arrastrando y soltando.

En otro post os hablaré con mayor detenimiento de compresores de imágenes.


  • 0
Reformas Integrales Bilbao

Reformas Bilbao

Etiquetas :

Categoría : Diseño Web

DISEÑO WEB

Reformas Bilbao

Web de empresa de reformas e interiorismo que presta servicio en el País Vasco.

Realizada en WordPress. Obras realizadas, galerías de imágenes… Posicionamiento Web.

http://www.reformas-bilbao.com


  • 0
descargar iconos y vectores gratis

Los 5 mejores sitios web para descargar iconos y vectores gratis

Muchas veces un diseñador gráfico o web necesita disponer, no ya sólo de un abundante número de tipografías donde elegir la más adecuada para su proyecto (ya se trate de un logotipo, una tarjeta de empresa, un tríptico o cualquier otro trabajo de papelería e imprenta), sino también de una buena variedad de iconos y vectores. Uno de los usos más recurrentes que se les suele dar a los iconos y vectores es el diseño de infografías, elemento que está más de moda que nunca en el mundillo web, que aumenta el engagement y que puede convertir tus post en virales gracias a su difusión en redes sociales (en este blog encontrarás varios ejemplos).

Es cierto que muchas fuentes tipográficas incluyen los llamados zap dingbats, que son símbolos creados a partir de trazos sencillos (como teléfonos, casas, flechas, animales, etc.) que en un momento dado te pueden sacar de un apuro, y que están pensados básicamente para funciones de señalética. Otro tanto se puede decir de las formas predefinidas y las puntas de pincel de Photoshop.

Sin embargo, a veces estos dingbats no son lo bastante buenos o complejos, y entonces necesitamos buscar iconos más sofisticados, o que combinen colores. Para facilitaros la tarea, os presento aquí 5 sitios web donde podéis descargar iconos y vectores totalmente gratis:

1-FreePSDFiles

FreePSDFiles

Sin duda, mi favorito, y probablemente al que más veces he recurrido. Es como un cajón de sastre donde puedes encontrar de todo, desde iconos hasta mock-ups, pasando por ilustraciones, siluetas, infografías, botones, fondos y plantillas para logos, currículos y páginas web. Basta con echar un vistazo a sus categorías para darse cuenta de la enorme variedad de materiales con los que cuenta. Especial mención merecen los vectores de personajes animados, al más puro estilo cartoon, para los que tiene una web específica. El diseño suele ser excelente en todos los casos, y los archivos (muchos de ellos manipulables) están en formato PSD (Photoshop) dentro de un zip que te descargas.

FreePSDFiles es un must have, uno de esos sitios que tienes que guardar en tus favoritos sí o sí. Sólo está en inglés, pero con un conocimiento básico es más que suficiente (y es que en el mundo del diseño web, ¿quién no se maneja con el inglés?).

2-Flaticon

Flaticon

Este sitio también es muy recomendable. Cuenta con más de 200.000 iconos y vectores para uso personal y comercial divididos por categorías: animales, flechas, arte, edificios, trabajo, cine, etc. También tiene, como es lógico, un buscador. Los vectores están disponibles en varios formatos de imagen: EPS, PNG, PSD e incluso en código HTML y CSS. Cuando quieres descargar un icono te ofrece la posibilidad de hacer una donación al autor y contratar la cuenta Premium (son 9,99$) o realizar una descarga gratuita copiando una línea de código en tu web para citar al autor, lo cual sería un buen gesto, porque estos diseños no se hacen solos. No obstante, si no te sientes altruista, también puedes bajártelo sin pagos ni atribuciones. Los PSD tienen una resolución de 150 px, y en cuanto a los PNG (este detalle me parece muy significativo), puedes elegir el tamaño al que quieres descargártelo, hasta un máximo de 512 píxeles. Asimismo, puedes crear colecciones de iconos y guardar ahí tus favoritos, incluso sin previo registro. Como veis, es un sitio muy completo, donde, si además eres diseñador, puedes unirte a su equipo de profesionales y ganar dinero con tus diseños.

Flaticon está sólo en inglés, y es un proyecto de Freepik.

Ahora Flaticon también cuenta entre sus APPs con un generador de patrones y otro de @font-face que funciona mediante drag&drop, aún más cómodo, si cabe, que el de Fontsquirrel.

3-Iconfinder

Iconfinder

Otro sitio que no puede faltar en ninguna lista. Tiene más de un millón de iconos en su catálogo, aunque conviene aclarar que no todos son gratuitos, pues muchos requieren de una cuenta Premium (cobran 9$ al mes por 25 descargas en su plan básico y unipersonal). Al buscar puedes seleccionar la pestaña Free para que te muestre únicamente los iconos gratuitos. Dependiendo del vector en cuestión, puedes bajártelo en SVG (Adobe Illustrator) o PNG, en cuyo caso, y al igual que en Flaticon, también te permite seleccionar su tamaño en píxeles, con las mismas limitaciones. Asimismo, acepta el formato ICO, el que se usa para los Favicon.

Iconfinder sólo está en inglés.

4-Freepik

Freepik

Es una de las webs de recursos gráficos más populares de la Red. Dispone de casi 100.000 iconos gratis para uso personal y profesional, ordenados por categorías, y muchos más que requieren de licencia o previo pago. Tal como anuncian en su portada, ofrecen fotos, ilustraciones, iconos, PSD y vectores gratis para páginas web, banners, presentaciones, revistas y publicidad en general. Los vectores, los archivos PSD y los iconos tienen sus propias categorías dentro del menú principal. El sistema de descarga es idéntico al de Flaticon: licencia gratis con atribución al autor mediante link en tu página web; de hecho, algunos enlaces te llevan directamente a Flaticon. En el botón de descarga te especifica el peso de la imagen.

Me parece especialmente interesante su Stock de Fotos con casi 200.000 fotos gratis con licencia de Creative Commons, muchas de ellas muy creativas y enfocadas al diseño web.

Admite registro (también mediante redes sociales) y formulario para trabajar con ellos, ya sea como diseñador o como escritor, y está en español.

5-Vector Open Stock

Vector Open Stock

En su página de inicio te muestra una serie de vectores destacados, pero luego puedes buscar por categorías. Tiene una base de datos con más de 37.000 iconos gratis. Los archivos de descarga son comprimidos, zip, y están pensados para Adobe Illustrator  (extensión AI). La licencia gratuita también funciona por atribución, y cada imagen viene acompañada de una sucinta descripción. Algunos iconos son de pago, y sus enlaces te llevan a ShutterStock (los habrás visto en más de una ocasión al buscar imágenes en Google y los reconocerás por sus marcas de agua).

En mi opinión, Vector Open Stock es menos completo que cualquiera de los anteriores sitios, pero tiene la ventaja de que está disponible en español.

Por supuesto, el citado Shutterstock es, con diferencia, el mejor banco de imágenes, el más profesional, pues cuenta con unos vectores en flat design y unas ilustraciones realmente formidables que tú mismo puedes editar, pero, desgraciadamente, está sujeto a unos planes de pago que no son aptos para cualquier bolsillo, y hasta por descargar un JPG (a gran escala, eso sí) tienes que pagar. Para una agencia de marketing quizá sea la opción más indicada, pero un freelance o autónomo tal vez no se lo pueda costear. El registro es gratuito, pero no te da acceso a prácticamente nada. Eso sí, en favor de Shutterstock hay que decir que no sólo almacena imágenes, sino también vídeos y música. Tiene una base de datos colosal, y es difícil que no encuentres lo que estás buscando, sea lo que sea.

Y ya para acabar, por si no habéis tenido suficiente, tres extras:

6-Vecteezy

Vecteezy

Vecteezy es un portal bastante nuevo que ofrece vectores y gráficos gratis. Lo mejor es que no necesitas registrarte para descargártelos. Según el caso, dentro del archivo comprimido puedes encontrar la imagen en varios formatos: JPG, PDF, EPS y AI. Tiene un buscador por categorías. Algunos vectores son muy básicos, pero puede serte útil para bajarte iconos de redes sociales, texturas o patrones. Si eres un miembro Premium la búsqueda se te amplía a Pinceles, Texturas, PSD, Fondos, Plantillas, etc. Lo bueno es que está en español.

Ahora también, gracias a Piktab, una extensión de Google Chrome creada por Freepik, podemos disponer de un amplio surtido de recursos gráficos (iconos, vectores, texturas, fotos, mockups) con tan sólo clicar en nuestra barra de herramientas. Nunca ha sido tan fácil y gratis.

7-Icons8

Icons8

Esta web es relativamente nueva, pero en poco tiempo se ha posicionado muy bien. A diferencia de los otros sitios, permite descargar iconos y vectores al tamaño que tú elijas, y soporta los formatos PNG, SVG (muy usado para crear sofisticadas animaciones mediante vectores y código que además pesan poco), EPS, PDF y por último, también puedes insertarlo como código HTML (te recomiendan añadir un enlace a su página como cortesía).

Otro rasgo distintivo de Icons8 es que los vectores son editables. Los puedes personalizar cambiándoles el relleno, el color de fondo, añadiéndoles una capa de texto o superponiendo cualquier otro elemento.

Tanto o más destacable es la manera en que puedes guardar estos iconos en tu ordenador. Como es habitual, está la opción de descarga directa, pero también funciona con drag and drop, arrastrando y soltando el vector en tu Photoshop o Illustrator, con la posibilidad de modificarlo allí. La verdad es que esta utilidad es muy práctica y funcional.

Aunque Icons8 es un portal gratuito, algunos iconos o formatos son de pago. Está en español.

8-Iconos Redes Sociales

Iconos Redes Sociales

Un tipo de iconos especialmente demandados en blogs y páginas personales son los de redes sociales. En esta web podéis descargaros hasta 30 packs de iconos vectorizados para Social Media en diferentes estilos y formatos, desde diseño plano hasta hechos a mano, minimalistas, con trazo fino y coloreados, redondos, cuadrados y hexagonales, y todo gratis.


BUSCAR

Suscríbete al Blog

Introduce tu email para estar al tanto de las novedades.

ABRELINK EN TWITTER