Mostrando entradas con la etiqueta blog. Mostrar todas las entradas
Mostrando entradas con la etiqueta blog. Mostrar todas las entradas

miércoles, 29 de abril de 2015

10# Cómo hacer una cabecera para el blog.

Hoy seguimos decorando el blog: si en el post pasado estuvimos eligiendo plantilla, como si del papel de paredes se tratase, ahora... vamos a hacerle una cabecera bien bonita para el blog.





Por defecto, Blogger pone como plantilla el nombre del blog sin más, con letras, sin ningún dibujo. Pero podemos sustituirlo por algo más artístico: una foto que nos guste, una imagen que diseñemos nosotros mismos, el nombre del blog escrito con la tipografía molona,...

¿Recuerdas mi primer post? En él te decía que los tutoriales de este blog se hacen a la vez que voy mejorándolo. Por eso ayer el blog lucía así:





... y hoy ¡por fin! tiene cabecera. Posiblemente no sea la definitiva, pero pocos blogs aciertan a la primera con su imagen. Así que así se queda por ahora.

La importancia de una buena cabecera

Lo primero que ve alguien que entra en el blog es la cabecera: es su carta de presentación. Tiene que comunicar qué contiene el blog, que va a encontrar el lector en él.

¿Te ha pasado alguna vez haber ido a una librería y que un libro te atrape sólo por su portada? Esto pasa muchísimo con la literatura romántica. Un título de película de sobremesa, una foto de un ella y él (sobre todo un él) de buen ver y te lo llevas casi sin ver de qué va. La cabecera puede ser determinante para que un lector se quede a leer... o huya despavorido.

La cabecera se identifica con el blog, colabora en lo que técnicamente se llama "imagen de marca". Ayuda a que se le grabe al lector en la mente que nuestro blog existe y de qué trata. Ayuda a que nos recuerde y nos vuelva a visitar.

Dimensiones de la cabecera del blog

Lo primero de todo es averiguar qué tamaño máximo tiene que tener nuestra imagen o texto de fondo. Haz click en el desplegable de tu muro de Blogger, donde pone Plantillas, después en "Personalizar" (botón naranja) y finalmente en "Ajustar ancho".





Ojo: el ancho total no son 1060 píxeles: ese sólo es el ancho que decidiste darle a los posts. Para ver cuál es el ancho total, desplazamos la barrita a la derecha y memorizamos esa cantidad, en mi caso 1500 píxeles. No pulsamos a "Aplicar al blog" ya que no queremos modificar el ancho: sólo consultar cuál es.





No hay una medida predefinida para el alto, pero lo suyo es que no sea excesivo. Entre 200 y 360 píxeles estaría bien. Si midiera mucho más, cuando alguien entre en tu blog vería que todo es cabecera y tendría que desplazarse a propósito hacia abajo para empezar a ver el texto. Creo que es mejor enseñar un poco, que ya en el primer vistazo se vea el título de un post, un poco de texto,... Invita más a quedarse leyendo.



El diseño de la cabecera

Para diseñar una cabecera puedes recurrir a Photoshop o a Gimp, su versión gratuita. Hay quien hace auténticas maravillas con Power Point (sí: también se puede usar para diseñar logos, cabeceras,... lo que se te ocurra). Pickmonkey es una herramienta muy chula. Su versión gratuita es algo más limitada que la de pago, pero se puede trabajar con él online, no hace falta descargarse nada. Comentaros que la versión de pago es muy barata y que es muy conocido entre las Youtubers americanas para hacer los thumbnails de los vídeos de sus canales.

Ahí lo dejo. Otro tema que ya veremos, el de Youtube.

Mi herramienta de edición favorita es PhotoScape. Os haré algún tutorial de Photoscape más adelante. Es gratuito y bastante intuitivo.

Como veis, existen herramientas de diseño de pago pero también muchas que son gratuitas. ¡No tenéis excusa!

Qué debe contener una cabecera

♥ Como representante del blog, la cabecera tiene que tener un diseño acorde con el resto. Puedes usar los colores que vayas a usar después, la tipografía, contener el logo,...

♥ Si hay texto, debe ser fácil de leer. Para ello, procura utilizar colores de texto que resalten bien sobre el fondo. Por ejemplo, el amarillo apenas resalta sobre el blanco, pero sí sobre el marrón. Un clásico: blanco sobre negro... o negro sobre blanco.

♥ Usa como mucho dos tipografías diferentes.

♥ Si una de las tipografías es muy rebuscada, que la otra sea sencilla.

♥ En la duda, opta por lo sencillo, por lo limpio.

♥ Las proporciones son importantes. Los espacios que hay del texto a los bordes de la cabecera deberían ser iguales, a un lado y al otro, arriba y abajo. De todos modos, también queda muy elegante un texto o una imagen en un lateral... En todo caso, las imágenes o textos centrados permitirán que nuestra cabecera se vea bien no sólo en ordenador sino también en móvil y tablet.

♥ Si usas una imagen, que sea tuya o provenga de un repositorio de imágenes free, es decir, que hayan sido donadas y no tengan derechos de autor.

Yo he optado por el nombre del blog y un logo:





Lo suyo no es modificar la cabecera cada dos por tres, aunque puede ser divertido jugar con ella y añadir un detalle simpático en fechas especiales: vacaciones de verano, Navidad,... Para ello son útiles los repositorios de imágenes en formato .png como las que tiene Deviantart. Son imágenes transparentes, sin fondo, y que por tanto se pueden superponer unas a otras.

De todos modos, lo normal no es que el blog nazca con su cabecera definitiva. Con el tiempo vas teniendo algo más claro el diseño que quieres tener, el que se va identificando más con lo que vas escribiendo y acabas por cambiarlo todo.

Cómo poner tu cabecera

En el desplegable de tu muro de Blogger, pulsa en Diseño:





Y después en "Editar" cabecera.





Seleccionamos las opciones "En lugar del título y la descripción" y "Reducir hasta ajustar". Finalmente, elegimos en el equipo la imagen que queremos como cabecera. Y así de esto...:




Pasamos a esto:



Puede que no sea la definitiva, pero así el blog ya tiene su carta de presentación. Nada que ver con hace una semana, ¿verdad?

¡Diseña tu cabecera!

lunes, 27 de abril de 2015

9# Cómo poner una plantilla a un blog de Blogger

Las plantillas son el papel de fondo del blog. Blogger proporciona muchas plantillas ya hechas y que además se pueden personalizar fácilmente. Si además tienes unas pocas nociones de HTML ¡las posibilidades son infinitas! Además, por internet hay muchos repositorios de plantillas de Blogger gratuitas, que puedes instalar. Y si no, siempre se puede contactar con un diseñador.


Las plantillas Blogger que vienen por defecto

Hoy toca ponerle una plantilla al blog. Blogger por defecto pone el diseño que le has estado viendo al blog estos días:


Blogger va cambiando cada cierto tiempo la plantilla por defecto. Actualmente es la Dynamic Views, que le permite al lector cómo quiere visualizar el blog eligiendo las opciones que le aparecen arriba a la izquierda: Classic, Flipcard, Magazine, Mosaic, Snapshot, Timeslide. Esta plantilla también integra un buscador y un desplegable que aparece y desaparece al pasar el ratón sobre él (la tirita negra arriba a la derecha). Al pasar el ratón:



Por defecto ese desplegable sólo tiene el botón central (Datos personales, con el nombre del blog) y el tercero (Archivo, con el listado de posts publicados hasta el momento). El primer botón lo he añadido yo haciéndole trampas a este experimento que estoy haciendo con este blog. La idea era empezar el blog de cero y contaros todos los pasos a pasos que voy haciendo. Ese botón es la única concesión que me he permitido: es el botón de Seguidores. ¡Sin él no había forma de "apuntarse" y seguir este blog!

Pues bien: mi idea es cambiar la plantilla y poner un diseño limpio, sencillo, que pueda toquetear fácilmente más adelante. Y lo segundo es poner el gadget de seguidores. Hoy vamos con la plantilla.


Cómo cambiarle la plantilla al blog

En el muro de Blogger, voy al desplegable y elijo "Plantilla".


Blogger nos muestra sus modelos de plantillas predefinidas. 


No sólo se tiene una vista previa de cómo luce el blog ahora mismo, sino que también vemos cómo se ve el blog cuando se accede a él por el móvil. Que se vea bien en el móvil es muy importante, ya que cada vez más personas leen blogs a través del móvil o la tablet. 

Yo voy a elegir por el modelo Sencillo, pon el que te guste más. Va a gustos. Pero ya te digo que escojo esa porque es de las que admiten pasar por chapa y pintura sin quejarse demasiado ;)

A muchos blogueros y blogueras les da yuyu el botón de "Editar HTML". Se trata de un lenguaje informático, el que usa Blogger y la mayoría de las webs que sueles visitar. Aunque "tiene su aquel" poco a poco te contaré de forma sencilla cómo se pueden ir toqueteando cosillas en HTML y personalizar el blog a tu gusto. De todos modos, Blogger nos deja personalizar algunas variables sin tener que ir tocando el HTML. Puedes hacerlo desde el botón de "Personalizar" (el de color naranja).


Ahí puedes modificar el fondo, ajustar el ancho del blog, cambiar el diseño y adentrarte en las opciones avanzadas, que veremos más adelante.

Voy a modificar el ancho: hago click en "Ajustar ancho". Una vez decidido el ancho total del texto y del menú lateral, hago click en "Aplicar al blog" (botón naranja arriba a la derecha) para que se apliquen y guarden los cambios:




Por defecto, la plantilla elegida ofrece un menú lateral con dos columnas. Para que sólo aparezca una, he pulsado la opción "Diseño". Una vez ahí, he elegido la disposición de elementos que más me gustaba:




Por ahora lo dejo así, siempre se puede ir cambiando :D

¡Redecora tu blog!