La gama de color del blog: ¿Qué es? ¿Cuántos colores tiene que tener?

Una vez tengas el fondo y la cabecera, ya sólo te hace falta la gama de color para tener los pilares fundamentales sobre los que asentar el diseño de tu blog. Llevo hablando de la gama de colores desde el principio del curso pero a lo mejor no sabes lo que quiero decir exactamente con gama de colores (¡Normal!).

La cabecera del blog I: qué tamaño óptimo debe tener la cabecera de tu blog

Esta entrada pertenece al cursillo de diseño para blog, no te olvides de ver todas las demás entradas pinchando en el enlace o en la imagen de la columna lateral! 

Siguiendo con los puntos básicos para cambiar el diseño de tu blog, toca hablar impepinablemente de la cabecera. 

Hay varios tipos y diseños de cabecera entre los que puedes elegir, desde más sencillos a más rebuscados (véase mi cabecera en la que no entra ni un alfiler), pero antes de analizar los diferentes tipos de cabeceras, vamos a ver unas consideraciones generales que afectan a TODAS las cabeceras: 

Diseño de blogs: Cómo hacer carteles para el blog con Picmonkey

Esta entrada pertenece al cursillo de diseño para blog, no te olvides de ver todas las demás entradas pinchando en el enlace o en la imagen de la columna lateral! 

No quería que pasase mucho tiempo antes de publicar esta entrada explicando cómo hacer cartelitos para las páginas del blog, así, los que no sepáis hacerlos, podéis aplicar lo que os enseñé en el post anterior sobre cómo poner páginas debajo de la cabecera lo antes posible. Y por eso, aquí está! 

Antes de nada, esta no es la única manera ni mucho menos de hacer carteles, pero voy a explicarlo así porque no requiere tener ningún programa instalado ni estar registrado en nada y se puede hacer con cualquier sistema operativo. Pero si sabes hacer tus propios cartelitos o tienes algunos ya bajados de internet, adelante y usa los tuyos sin problemas! 

¿Qué es un ex libris? 12 ex libris exclusivos imprimibles + otros 6

El otro día publiqué en Instagram una foto con unos ex libris que me había hecho mi padre. @nayri81 me preguntó un par de cosas acerca de ellos y me dijo que menudo trabajazo diseñarlos, imprimirlos y todo. Y por eso se me ha ocurrido primero explicar lo que es un ex libris (porque no es algo demasiado común en colecciones de libros pequeñas, como las que podemos tener en nuestras casas) y luego enseñaros algunos que he encontrado por Internet de libre licencia y otros que he diseñado yo en exclusiva para vosotros para que los pongáis en vuestros libros si os apetece. Espero que os parezca interesante! 

Diseña tu blog: Qué estructura debe tener mi blog? Qué plantilla elijo?

Me alegro un montón de que os interesase la idea de publicar de vez en cuando tutoriales bloggeros! Esta es la primera entrada que voy a hacer. Es un poco más prosaica y rollete, pero creo que es importante, espero que os guste! Si quieres ver el resto de entradas de Diseño de Blogs no olvides pinchar en la imagen de la columna lateral! :) El primer paso para empezar a rediseñar nuestro blog es un poco complicado y aburrido, porque es menos creativo que el resto. Se trata de elegir el diseño de nuestra plantilla. Pero creo que es importante hablar del diseño y estructura del blog lo primero, ya que el diseño de la plantilla es como el esqueleto de nuestro blog. Si nuestro blog fuera un edificio (voy a volver a este ejemplo en otras entradas) la estructura serían los cimientos. No podemos pintar las paredes de nuestra casa antes de construirla. Por eso tenemos que empezar creando la estructura de nuestro blog. 

Tutoriales de diseño blogguero ¿sí o no?

Quizá alguno se acuerde de que hace tiempo tenía intención de sacar un curso de diseño para blogs, totalmente gratis, para mis seguidores. La idea era explicar cómo uno puede hacerse un blog con aspecto profesional de forma totalmente gratuita. También quería incluir información sobre qué aspecto se recomienda que tenga un blog y porqué y cómo optimizarlo para que sea más cómodo y dinámico para nuestros lectores. 

Goodreads: La mejor app (y web) para los lectores empedernidos

Hace bien poco publiqué un reto de lectura con varios libros que tengo intención de leer de aquí al verano (no olvides echarle un vistazo, puedes sumarte si te gusta la idea!) y he decidido enseñar esta app en el blog para todos aquellos interesados en la lectura. Se trata de Goodreads.  Goodreads es la web/aplicación/red social más completa para lectores (al menos de las que yo he visto). Tiene todo lo que un apasionado de la lectura puede soñar. Además me encantaría socializar con vosotros, saber qué estáis leyendo, qué habéis leído y que queréis leer y que nos recomendemos libros mutuamente a través de esta plataforma. Por eso se me ha ocurrido explicaros un poco de qué va y explicaros algunas de sus funciones. 

Freebies de estilo vintage para el blog: Shaby Blogs

Te apetece darle un nuevo look a tu blog de cara al verano? O hacer que tus entradas sean un poco más vistosas? Hoy me gustaría enseñaros una página de la que saco un montón de cositas para el blog: separadores, etiquetas, marcos... todo de estilo vintage y shabby y todo absolutamente GRATIS. Se trata de Shabby Blogs. 

Tienen todos sus freebies y cosas guays aquí divididos por categorías. Están en inglés pero si no entendéis los títulos podéis trastear aquí y allí y seguro que encontráis algo que os guste! Descargar cualquier cosa es facilísimo, en la mayoría de las categorías, las imágenes tienen un botón al lado en el que pone Download, al pincharlo se descarga directamente en nuestro ordenador.

DIY fotográfico: Cómo crear un fondo para sacar fotos de productos

Vale, no soy la mejor haciendo fotos. Para empezar mi cámara es bies normalita. Además mi pulso es malísimo y siempre me salen las fotos movidas, haga lo que haga. Pero últimamente estoy intentando hacer unas fotos un poco mejores, sobre todo con los consejos Saralu de El Nido de Mamá Gallina y voy siguiendo su curso de fotografía para bloggers.  De momento no tengo intención de comprarme una cámara especialmente buena (que las Nikon luego pesan mucho para ir de viaje!) pero aún así quiero intentar que mis fotos sean mejores, que ya está bien de tanto DIY por la noche y hacer fotos encima del parqué... si me sigues en Pinterest a lo mejor ya intuías esto... ;) Ya que con las fotos propiamente dichas no os puedo ayudar mucho, se me ha ocurrido compartir con vosotras mi último invento casero en cuanto a atrezzo se refiere: un "setup" sobre el que fotografiar productos. Creo que puede ser útil a todas las que tengáis blogs de belleza y enseñéis productos o vendáis bisutería o hagáis DIY pequeñitos o algo así...

¿Lo mejor de todo? Sólo necesitas una carpeta y cartulina blanca! Te animas?

Cómo personalizar el botón pin it individual de Pinterest y poner el botón que tú quieras + botones gratis!

Hace algún tiempo en el blog Personalización de Blogs leí una entrada muy interesante donde Blanca nos explicaba dos maneras diferentes de poner el botón pin-it individual y nos daba los pros y los contras de cada una. Cuando leí su post me quedé, igual que ella, con el sistema tradicional que te ofrece Pinterest. Según Blanca sus contras eran:

1) Que hay que colocarlo individualmente en cada post (ella explica cómo en el enlace que he puesto antes a su entrada)

2) Y que hay que lidiar con la imagen que nos proporciona Pinterest, que no es demasiado estética que digamos...

Con mis básicos conocimientos de HTML me he puesto a investigar y se me ha ocurrido la manera de poner este botón de Pinterest individual pero con la imagen que nosotros queramos. Eso sí, tendremos que poner el botón en cada post de manera individual como ya nos advertía Blanca. Pero con una pequeña modificación del código HTML que nos proporciona Pinterest, podremos colocar nuestro propio botón Pin it personalizado.

Y por si el diseño de botones no es tu fuerte... he diseñado unos cuantos botones Pin-it para que elijas el que más te gusta y lo pongas en tu blog siguiendo las instrucciones de este tutorial! :) Espero que no sea muy lioso, que ya sabéis que mi blog no se dedica especialmente a este tipo de recursos para blogs!

Iconos de redes sociales para tu blog: Glitter icons

Hola a todos!

Como tengo poco tiempo para actualizar, hoy os traigo otra entrada cortita pero que espero que os sirva  para vuestros blogs. Esta vez os traigo otro set de iconos de redes sociales para que los coloquéis en vuestro blog. Se trata de unos iconos de purpurina de diferentes colores, para que los pongáis todos iguales o que combinéis varios! Hace poco los tuve en mi blog pero decidí y cambiarlos y se me ha ocurrido compartirlos con vosotros. Mis favoritos son los dorados:

Si no sabes cómo ponerlos en tu blog, echa un vistazo a mi entrada sobre cómo colocar iconos de redes sociales. En esa misma entrada tengo otro set de iconos galácticos, por si quieres echarles un vistazo también.
Por orden, aquí tenemos los iconos de Facebook, RSS para Feeds, Tumblr, Twitter, Pinterest, correo electrónico, Instagram y Bloglovin'. Si te gustan estos iconos pero te gustaría tener alguna red social que no aparezca aquí (por ejemplo Youtube) sólo tienes que pedirmelo y te haré el icono en exclusiva para tí!

¿Sabíais cómo poner este tipo de iconos? ¿Qué color os gusta más?

Cómo colocar iconos de redes sociales personalizados en el blog vía HTML + iconos gratis

Hola a todos!

Hoy vengo con una entrada como nunca he hecho en este año y medio que llevo con el blog. Se trata de un post de recursos para el blog. Siempre me han parecido muy útiles las entradas de recursos de Maite de Made in my Home y he pensado que iba a poner mi granito de arena para ayudaros a "customizar" vuestro blog según vuestro gusto. Últimamente parece que un montón de bloggers se están incorporando a la tendencia de decorar sus blogs con iconos de las redes sociales personalizados. Sin ir más lejos, en este blog puedes encontrar cuatro iconos de purpurina para las redes sociales hechos por mí misma que, al pulsarlos, te llevan a mis diferentes redes.

Pues en el post de hoy voy a hacer dos cosas:
1) Proporcionaros unos iconos de redes sociales que he creado yo misma exclusivamente para vosotros, por si os interesa ponerlos en vuestros blogs.
2) Enseñaros cómo colocarlos correctamente en el blog para que queden más o menos como los de mi barra lateral.

Los iconos: 

Puedes descargar la imágen desde aquí.

Los he hecho en un tamaño bastante grande porque cada uno tiene su blog decorado de una manera diferente y a cada uno le pega una cosa. Si los quieres más pequeños o más grandes, no dudes en redimensionar la imágen con tu programa de retoque favorito (recomiendo photoshop, gimp o photoscape de los que yo conozco).
Como véis son tipo galáctico (estilo tumblr, como diría eLedeLaura). Por si no los reconocéis a simple vista, por orden son: Email, Facebook, Twitter, RSS para feeds, Instagram, Tumblr, Pinterest y Bloglovin. Me parece una selección bastante básica de redes sociales, un poco las que todo el mundo suele tener. No obstante, si necesitas algún icono que no esté aquí, sólo tienes que pedirlo y lo haré en exclusiva para ti.

Cómo colocarlos en el blog: 

Si eres novato en blogger o no eres nada amigo de los códigos HTML puede que te estés preguntando: "Vale, tengo los iconos guardados en el ordenador ¿Y ahora qué?". A lo mejor este tutorial es muy básico para algunos de vosotros, pero pienso que puede ser útil a otros. Ya me diréis en los comentarios si os interesan este tipo de cosas o las tenéis más que dominadas!

Lo primero que tienes que hacer es elegir los iconos que te gusten: no tienen porqué ser los míos, hay muchos gratis para descargar en internet pero a menudo falta el icono de instagram y/o el de pinterest, antes de decantarte por unos u otros, recuerda revisar que tengan un icono para cada red social que quieras anunciar en tu blog.

Ahora que tienes elegidos los iconos, vamos con el tutorial: 

1) Recortamos el icono que vayamos a utilizar con nuestro programa de retoque de imágenes preferido, yo he utilizado Photoscape porque me parece más cómodo que Photoshop para recortar. Si queremos cambiar el tamaño de la imagen también es el momento de hacerlo. Debes quedarte con el icono aislado tal y como quieres que aparezca en tu blog. Manten el formato png, es decir, no guardes la imagen en otro formato (jpg, mapa de bits...).

2) Es muy importante abrirte una cuenta en algún tipo de servidor que te permita subir imágenes y que cree una url para cada una de ellas. El mismo facebook puede hacer esto, pero es un engorro llenar tu página de facebook de iconos. Yo utilizo la página Imageshack y me funciona bien, de hecho es la que usaré para el tutorial. Antes de nada tienes que registrarte, lo cual es un poco coñazo, pero te va a ser muy útil para blogger en un futuro, estoy segura, y sólo tardarás un par de minutos, no seas vag@!

3) Una vez tienes tu cuenta, es hora de estrenarla! Al abrir la página verás esto (no olvides hacer login!):

4) La imagen tardará pocos segundos en subirse, una vez lo haga te aparecerá esto:

5) Cuando pulsemos en "Ver en tamaño completo" nos llevará aquí:

Guarda esta URL a buen recaudo, si es la primera vez que utilizas HTML incluso puedes pegarla en un documento de word, identificándola con lo que es para no perderla por ahí. En cualquier caso, no cierres esta pestaña por si tienes que volver a por la URL en algún otro momento.

6) Dejando esto aparte, entramos en Blogger, en la pestana "DISEÑO":

Pulsamos en Añadir un gadget donde queramos que aparezca, en este caso voy a añadirlo en la columna lateral.

7) En la ventana que nos aparecerá, elegimos crear un gadget de HTML:

8) Nos aparecerá un cuadro en blanco para escribir nuestro código. El modelo del código que tenemos que poner es este:

<a href="xxxxxxxxxxxxxxxxxxxxx"><img src="zzzzzzzzzzzzzzzz"></a>

Donde x será la página a la que queremos vincular nuestra imagen y z será la URL de la imagen (recordad que la URL es la dirección que previamente habíamos copiado de Imageshack). En mi caso el código sería así: 

Lo que va en la x es, en este caso, el enlace directo a mi cuenta de Pinterest y en la z la URL de la imagen que he sacado de Imageshack en el punto 5. 

De esta manera, al pinchar en este icono, el lector se verá dirigido a mi página de Pinterest. 

En la ventana del gadget, si pinchamos en "Formato RTF" podemos previsualizar cómo ha quedado nuestro icono. Cuando estés conforme, dale a "Guardar". 

9) Hecho esto, ya tenemos el icono colocadito en nuestro blog: 

Ahí lo veis. Él solito está un poco soso pero todos juntos quedarán mucho mejor. Si queremos vincular más de un icono con su respectiva página web, en la misma pestaña HTML repetimos el código base que hemos puesto antes, pero sustituyendo la X por la nueva web a la que queramos linkear y la Z por el nuevo icono (no se si me he explicado bien).

NOTA:

Para hacer el link del correo electrónico, donde pondríamos la web a la que queremos crear el hipervínculo (x), ponemos lo siguiente:

mailto:yyyyyyyyy

En este caso, y será vuestro correo electrónico. Haciendo esto, al pinchar sobre el icono se abrirá directamente una página de Outlook en la que aparecerá vuestro mail como remitente (es lo que aparece en el mío de la columna lateral si le dais).

Y así quedarían los iconos definitivamente, los he redimensionado con Photoscape (vale perfectamente Photoshop o Gimp) y luego los he subido con la técnica que os he enseñado antes.

Un par de consideraciones que te pueden interesar:

-En la ventana donde has escrito los códigos HTML (paso 8) puedes pulsar en Formato RTF para ver cómo quedarán los iconos. En esta pantalla, puedes pulsar espacios entre ellos si no quieres que queden tan juntos los unos de los otros como en la imagen de arriba.
-En esa misma ventana, si quieres que tus iconos queden centrados y no desplazados a la izquierda como en la captura de arriba, sólo tienes que escribir antes de los códigos HTML <center> y después de ellos </center>.

Eso es todo el tutorial, espero que se haya entendido bien porque la verdad es que mientras lo he redactado estaba un poco dispersa, así que ya me diréis. Si queréis una explicación más detallada de algo, en los comentarios me podéis preguntar todo lo que se os ocurra. 

Este tutorial lo podeís usar para cualquier otra imagen que queráis colocar en el blog, no sólo para iconos de este tipo!

¿Os han gustado los iconos? ¿Conocíais ya esta técnica para hacer imágenes con hipervínculo?