en Diseño

Guía para crear cabeceras para tu blog

La imagen es fundamental para que tu blog proyecte el empeño que pones en hacerlo. Por eso, crear cabeceras para tu blog es una forma ideal para ofrecer una mejor imagen y además ahorrar tiempo.

cabeceras2big2

Llevaba tiempo pensando en renovar la imagen del blog en lo que respecta a las cabeceras de los posts. Al mismo tiempo, quería hablar de este tema, pues me parece un aspecto importante que a menudo no se tiene en cuenta, quizá por desconocimiento de unas pautas básicas de diseño gráfico, pero sobre todo por no planteárselo o una vagancia mal entendida.

¿Por qué digo mal entendida? Porque aunque crear unas cabeceras unificadas y con elementos corporativos parezca un trabajo extra, a la larga va a agilizar un montón tu proceso de creación de posts. Una vez hechas unas plantillas, vas a poder crear cabeceras para tu blog con una estupenda calidad gráfica en cosa de minutos. Ya me dirás al final de este post si merece la pena o no.

A lo que iba, como necesitaba hacer nuevas cabeceras y quería hablar del tema, qué mejor que aprovechar para ilustrar con mi ejemplo real cómo puedes crear tus propias cabeceras para tu blog.

Con las cabeceras buscaremos básicamente 3 cosas:

  • Unificar nuestro diseño: O sea, definir unas pautas que hagan nuestro blog coherente y reconocible.
  • Conseguir un aspecto más corporativo: Incluyendo elementos que identifiquen claramente el blog.
  • Ahorrar tiempo: Automatizando la creación de nuevas cabeceras.

Siempre te diré lo mismo, desde aquí te animo al DIY, pero si tienes presupuesto contacta con un diseñador gráfico o un profesional del marketing online.

¿Empezamos?

 

Definiendo las necesidades

Como cualquier diseño importante que quieras hacer, te recomiendo que cojas papel y lápiz y hagas un esquema para empezar a construir las cabeceras para tu blog ideales. Cosas que puedes definir desde ya:

  • Orientación: Dependiendo del uso que quieras darle a una imagen de cabecera y del diseño de tu blog, podrás hacerla horizontal o vertical. Horizontal es lo más común para un diseño normal de blog y para compartir en redes como Facebook o Twitter. Pero si tu blog cuenta con un diseño estrecho o quieres darle relevancia a tu imagen en Pinterest, quizá el tamaño vertical te parezca más adecuado. También puede ser cuadrada.
  • Tamaño: La velocidad de carga es fundamental en nuestro blog. Por tanto nunca conviene subir imágenes más grandes de lo necesario. Si tu blog tiene 800px de ancho, utiliza ese tamaño. Tu imagen siempre se va a ajustar a esa anchura, pero si tiene 2000px de ancho reales, va a pesar mucho más.
  • Elementos corporativos: Lo que buscamos con una cabecera es que se sepa que es nuestra. Para ello, vamos a incluir el logo del blog. Si no lo tenemos, puede ser el momento de plantearse crear uno o podemos prescindir de él y usar nuestra URL en su lugar. Eso sí, elige al menos una tipografía que te guste y que creas que te identifica.
  • Título: Lo fundamental de una cabecera es el título del post. No tiene por qué ser 100% el mismo titular que has escrito en el texto. Puede que quieras que uno sea más formal y otro más coloquial o apelativo, pero en todo caso debe quedar claro el tema del post. Y que esté en una tipografía constante. En caso de introducir título y subtítulo o que la cabecera incluya otro texto deberás usar o la misma fuente o dos en una combinación tipográfica que funcione.
  • Fondo: Éste es un aspecto muy importante porque va a determinar mucho la impresión que den nuestros posts y además será 100% vital para la legibilidad de la cabecera. Para esto ya sabes, contraste de claro sobre oscuro o viceversa. A grandes rasgos, podemos optar por un fondo de color plano, por una fotografía o por un patrón repetitivo.
    • Color: Lo bueno de un fondo de color plano es que fácil de contrastar. Otra ventaja es que la imagen tendrá poco peso al comprimirla porque podremos elegir formatos como el png. Lo malo es que si elegimos un color o dos o tres y actualizamos mucho, podemos dar la sensación de que siempre estamos publicando lo mismo y aburrir. Entonces podemos o elegir una gama bastante amplia de colores entre los que ir eligiendo o probar con otras opciones.
    • Patrón: Un patrón de fondo puede ser una trama de imagen que utilicemos siempre, o un fondo lleno de puntos, líneas, polígonos, una textura determinada, etc. Algo que nos aporte mayor personalidad que un color sólido.
    • Imagen: Usar imágenes nos va a ofrecer mucha mayor variedad y entidad propia a cada post. Además, nos va a permitir ilustrar el tema del que hablamos en cada momento. También hay que tener en cuenta que vamos a perder un tiempo buscando y adaptando esa imagen a nuestro diseño.
tipos de cabeceras para tu blog

Me pareció ver una linda marca comercial

Reydefiniendo mis plantillas

En mi caso concreto, elegí un tamaño horizontal con un ancho de 900px, que es el que llena la plantilla y un alto de aproximadamente la mitad, para asegurarme de que se vea bien en las redes sociales típicas.

En cuanto a la tipografía, continúo usando Dosis, una fuente de rasgos redondeados que es la que hace tiempo elegí como corporativa del blog. Con ella escribo el titular y como tiene varios estilos, decido que no quiero combinarla con otra. Me es suficiente usar un grosor fuerte junto a otro más delgado para conseguir contraste.

Anteriormente detallaba en mis cabeceras las diferentes secciones del blog (comunicación, social media, tecnología…). Pensaba que era una buena idea para darle variedad, pero a la larga pensé que el texto distraía y ponerlo demasiado pequeño tampoco tenía sentido. Así que para esta ocasión he creado diferentes diseños según la sección, pero sin que se explicite la sección. O sea que no voy a hacer un croquis en papel sino 4 bocetos diferentes, aunque con una base común en el diseño.

Finalmente para el fondo opté por usar un fondo de imagen diferente en cada ocasión, combinado con una capa de color que contendrá el título del post. Me parece una solución adecuada en mi caso, porque consigo personalidad para cada post sin renunciar a un carácter unitario del blog. Sí, el resultado final es un poco más trabajo del que cabría esperar, pero creo que la calidad gráfica lo merece.

En cuanto al contraste tipografía/fondo, usaré colores que contrasten tanto con letras blancas, que serán las del titular, como negras, evitando problemas de legibilidad.

 

Del papel al ordenador

Una vez tengas definidos estos elementos (no hace falta que tan al detalle como yo), toca ir a un programa de diseño gráfico. Si dispones de Photoshop, adelante. Si no, tienes Gimp, una alternativa gratuita que te sirve de sobra.

No necesitas grandes conocimientos para realizar cabeceras para tu blog. Tan solo crear nueva imagen, pintar de un color o arrastrar una imagen y escribir texto encima al tamaño deseado. Una vez tengas un ejemplo hecho, guardas ese archivo que será tu plantilla. Lo irás reutilizando para cada nuevo post, cambiando el titular, el color, etc. Pero guarda siempre un original y ese no lo toques nunca, duplícalo cada vez.

Si te parece muy complicado, puedes utilizar editores online muy de moda como Canva. El peligro que le veo es que puedes conseguir diseños muy elegantes con pocos clicks, pero aquí estamos buscando algo más que una imagen «cuqui». Así que ten cuidado y no te dejes llevar demasiado por los prediseñados.

Ahora paso a contarte brevemente mi propio proceso para generar la plantilla:

  1. Abro Photoshop y creo un archivo nuevo de 900 x 450px
  2. Hago una capa de un color con la herramienta rectángulo.
  3. Con la herramienta fuente escribo encima de dicha capa, el título de mi post a un tamaño óptimo.
  4. Voy a un banco de imágenes, por ejemplo Unsplash.com y busco una fotografía apropiada. La arrastro al lienzo, la pongo debajo del resto de contenido y la encuadro a mi gusto.

Finalmente, me preocupo por darle los toques finales. Por ejemplo, yo le he bajado un poquito la opacidad a la capa de color para que se vea algo de la foto que hay debajo.

Como he dicho que tengo 4 modelos distintos, una vez hecho el primero, hago 3 copias de ese archivo e introduzco los cambios para obtener diseños ligeramente distintos, dentro de una uniformidad. En este caso se trata simplemente de cambiar la posición de la capa de color y su contenido. También he introducido el logo del blog en 4 variaciones que van cada una con una sección.

¡Y ya está! Crear mis plantillas no ha sido tarea fácil, pero ahora cada vez que quiera escribir un post, abriré el archivo, cambiaré el título, elegiré un color y una imagen y voilá, tendré una nueva cabecera con un diseño profesional en un minuto.

 

Cabeceras para tu blog, lo que sí y lo que no

Para finalizar el post, unas últimas pero muy importantes consideraciones de concepto:

  • Una cabecera tiene que ser elegante, pero no apabullante. Atractiva pero que no eclipse tu texto. No es una obra de arte, sino algo funcional.
  • No debe tener demasiados elementos que confundan o dispersen la atención. Llámalo limpieza o minimalismo, pero contente.
  • Tiene que ser legible. Para esto nada mejor que probarla en móvil primero.

modelos de cabeceras para tu blog

Pues ya tengo mis plantillas hechas. Espero que te acompañen durante una buena temporada ilustrando mis posts. Y sobre todo, que este tutorial te haya servido para crear cabeceras para tu blog.

Deja tu comentario

Comentario