One of the things that I have liked the most is to find the way to learn how to do something new, and is that on the internet are the tools, we just have to know how to use them, take advantage of them, but above all be constant in order to achieve the knowledge we want to acquire.
When working on our blogs, we are always looking for ways to give our original touch, to be striking, that people who read us feel attracted and identified with what we publish and share.
A very creative way to draw attention is through our banner, which is a very important element where we can generate more attraction and thus reach our audience in the blog in different ways.
Banners also work as search engines, which allow us to understand what kind of content we will find on the site we visit, so it must be something eye-catching and interesting, able to attract attention.
It can be designed with different colors, different images, and of course other fonts, as long as they match the information you want to show, but above all easy to read.
It is not superfluous that it contains personal information such as the name of your site, your blog, a logo that identifies you.
On the other hand, as I mentioned, the idea is to make something eye-catching, attractive, give it that touch that makes it stand out, that is why an animated banner is widely used in our blogs.
When I talk about animated, is that the images shown in the banner have a motion effect, as well as the text, which can be made to move in the banner, thus creating this effect that ends up becoming a video with images.
It can be said that this is a great way to draw attention and thus produce an impact on your blog; there are many ways to design this type of banner, through programs, applications, among others, however, I bring you a simple and quick way to generate it using the famous Photoshop program.
If you are interested in learning, sit down, read and watch the step by step.
The first thing we must do is to design our banner, we will take some images, from some pages without copyright, for this design I used as source Pixabay.
Once we have our design, with our images, simple, and some text, short, but simple too, easy to read, we proceed then to give movement to our images and text.
The first thing we will do is to remove from the banner both the text and the images, making them aside with the keyboard, we will do this with each one, then we remove their visibility, once done, we go to the window option and select timeline.
 |  |
|---|
Here we will proceed to give the movement, we will get a first frame, here we select and change by 1 sec.
We will duplicate this frame, in this second frame we select the images that we want that it leaves us, and we will put 0.2 sec.
Once visualized the images, we will click on the option of intercalate, where here other frames will be added automatically, for our design, where we will place by quantity 10.
10 more frames will appear, in the last frame, we will duplicate again, and we will make visible the other rest that we lack between text and images, we make the same procedure above, clicking to add the 10 remaining frames.
 |  |
|---|
Remember that you must again put the images in the banner, once done, it only remains to play to see the effect of how our animated banner looks like.
Maybe for some this is a process, and prefer to opt for applications that do it faster, but I confess that nothing is more satisfying than doing it yourself.
I hope you liked my little design, I will share more as I learn and improve.
Thanks for reading this far, if you like it let me know in the comments.
Una de las cosas que más me ha gustado es buscar la manera de aprender hacer algo nuevo, y es que en internet están las herramientas, solo debemos saber usarlas, aprovecharlas, pero sobre todo ser constante para así alcanzar el conocimiento que deseamos adquirir.
Al momento de trabajar en nuestros blogs, siempre estamos buscando la forma de darle nuestro toque original, que sea llamativo, que las personas que nos lean se sientan atraídas e identificadas con lo que publicamos y compartimos.
Una manera muy creativa de llamar la atención es a través de nuestro banner, el cual es un elemento muy importante donde nos puede generar mayor atracción y así llegar a nuestro público en el blog de distintos modos.
Los banners también funcionan como motores de búsqueda, los cuales permiten entender qué tipo de contenido encontraremos en el sitio que visitemos, por lo que debe ser algo llamativo e interesante, capaz de atraer la atención.
Se puede diseñar con diferentes colores, distintas imágenes, y por supuesto otros tipos de letras, siempre y cuando coincidan con la información que quieres mostrar, pero sobre todo fácil de leer.
No está demás que el mismo contenga información personal como el nombre de tu sitio, de tu blog, algún logotipo que te identifique.
Por otra parte, como bien lo mencione, la idea es hacer algo llamativo, atractivo, darle ese toque que lo haga resaltar, es por esto que un banner animado es muy utilizado en nuestros blogs.
Cuando hablo de animado, es que las imágenes que se muestran en el banner tenga un efecto de movimiento, así como el texto, los cuales podemos hacer que se desplacen en el banner, creando así este efecto que se termina convirtiendo en un video con imágenes.
Se puede decir que esta es una gran forma de llamar la atención y producir así un impacto en tu blog; existen muchas maneras de diseñar este tipo de banner, a través de programas, aplicaciones, entre otros, sin embargo, yo les traigo una forma sencilla y rápida de generarlo mediante el famoso programa Photoshop.
Si estás interesado en aprender, siéntate, lee y mira el paso a paso
Lo primero que debemos hacer es diseñar nuestro banner, tomaremos algunas imágenes, de algunas páginas sin derecho de autor, para este diseño use como fuente Pixabay.
Una vez que tengamos nuestro diseño, con nuestras imágenes, sencillas, y algo de texto, corto, pero sencillo también, fácil de leer, procedemos entonces a darle movimiento a nuestras imágenes y texto.
Pues lo primero que haremos es sacar del banner tanto el texto como las imágenes, haciéndolas a un lado con el teclado, esto lo haremos con cada uno, luego quitamos su visibilidad, una vez hecho, nos vamos a la opción de ventana y seleccionamos línea de tiempo.
| |
|---|
Aquí procederemos a darle el movimiento, nos saldrá un primer cuadro, aquí seleccionamos y cambiamos por 1 seg.
Duplicaremos este cuadro, en este segundo cuadro seleccionamos las imágenes que queremos que nos salga, y le pondremos 0.2 seg.
Una vez visualizadas las imágenes, le daremos click en la opción de intercalar, donde aquí se añadirán otros cuadros automáticamente, para nuestro diseño, donde colocaremos por cantidad 10.
Aparecerán 10 cuadros más, en el último cuadro, le daremos nuevamente duplicar, y haremos visible el otro resto que nos falta entre texto e imágenes, realizamos el mismo procedimiento anterior, dando click para añadir los 10 cuadros restantes.
| |
|---|
Recuerden que deben nuevamente poner las imágenes en el banner, una vez hecho, solo queda darle reproducir para ver el efecto, de como queda nuestro banner animado.
Quizás para algunos esto sea un proceso, y prefiere optar por aplicaciones que lo hacen más rápido, pero les confieso que nada más satisfactorio que hacerlo tu mismo.
Espero les haya gustado mi pequeño diseño, les compartiré más a medida que vaya aprendiendo y mejorando.
Gracias por leerme hasta aquí, si te gusto házmelo saber en los comentarios.
Banner and Cover edited with Photoshop
Sources used: source1 source2 source3 source4 source5
Other programs used giphy, clipchamp (video editor), Inshot
Capture from my Property, from my Pc