.

19 de enero de 2009

Imagenes en la cabecera del blog

Escrito por
imagenes en la cabecera de blogger
Las imágenes en la cabecera del blog resaltan el diseño y aportan información rápida al nuevo visitante. Para conseguir imágenes en la cabecera del blog de blogger puedes hacerlo desde el menu Diseño. Veamos el modo.

Menu diseño. Pantalla de elementos del blog. Aquí pordrás ver una barra horizontal que corresponde a Configurar Cabecera. Haz click y se abrirá una pantalla con los siguientes parametros: Título del blog, descripción del blog e imagen.

En Imagen tenemos la opción de importarlo desde el ordenador o desde la web, lo ideal es subirlo desde el disco duro, ya que posiblemente tenemos que hacer varios intentos hasta conseguir el diseño que queremos.

Al insertar la imágen tendremos las siguientes opciones.
- Imagen detrás del título y la descripción. Si elegimos esta opción tendremos que conseguir que las imágenes de la cabecera no impidan la lectura del texto, ni al contrario que el título tape algun detalle importante de la cabecera. El texto tiende a expandirse y ocupar toda la amplitud de la cabecera, con lo que es frecuente la interferencia. Para evitar esto lo mejor es entrar en la plantilla CCC y cambiar los detalles del diseño de la cabecera para alinear las letras (#header y #header.description). Esto lo aprenderemos en un proximo post.

- Imagen delante del título y la descripción. La imagen tapará el título por ello imágen tiene que llevar incorporado el texto que nos interese. ¿Entonces para que sirve el texto que queda detrás de la imágen? Sirve para las arañas y los buscadores. El texto que pueda leerse en la imagen no puede ser leido por las arañas de google, ni por los buscadores, así que lo normal es dejar el título y subtítulos. Esto es lo que podrá leer un internauta que haga una busqueda en google y encuentre la página principal de nuestro blog.

Cuando el tamaño de la cabecera y la imágen no son el mismo, uno de ellos tendrá que adaptarse. Podemos optar por que la imágen mantenga su propio tamaño, (recomendado) y que los textos se adapten a la imagen. O mantener el ancho original de la cabecera de la plantilla y que la imagen se adapte a este tamaño, con lo que la imagen cambiará desfigurandose.

Para que tengas una referencia las cabeceras suelen ser panorámicas, apaisadas, de un ancho alrededor de 700-1000 pixeles, y una altura de unos 100-300 pixeles. Si finalmente no acaba de gustarte la imagen en la cabecera, se elimina en un instante, así que no dudes en experimentar incluso con varias imágenes. Es normal que la primera vez no todo encaje, así que ten a punto un buen editor de imágenes como el Photoshop para realizar los cambios y ajustes necesarios, hasta que consigas la imágen de la cabecera tal y como querias.

Las imágenes de texturas para las cabeceras son de Chrisdesing blog, que creo es el autor. Llevan licencia Creartive Commons, asi que podeis usarlo para fines no comerciales citando a el autor.

1 comentario:

  1. hola!

    Estoy elaborando un blog, la plantilla es la minima de blogger pero le he dado retoquitos a los códigos html para que el blog sea mas ancho (1200px) y para que sea flexible o de diseño líquido, es decir para que se adapte al ancho de pantalla del ordenador de la persona que lo visite indistintamente de su configuracion. He probado en pantallas 800x600px y el blog se visualiza correctamente. Sin embargo, y ahí tengo una cuestion que quisiera preguntaros, al añadirle la imagen a la cabecera, cuyo ancho es, al igual que todo el cuerpo del blog, 1200 px, ya todo el blog pierde la flexibilidad cuando se ve en pantallas de 800x600 descuadrándose la imagen de cabecera y apareciendo la barra de desplazamiento. ¿es posible elegir determinadas imágenes de cabecera que sean "líquidas"?, ¿hay alguna solucion similar para que el blog siga teniendo una cabecera de 1200px y se "encoja" en pantallas más chicas? Gracias.

    ResponderEliminar

Bienvenido, en este blog encontrarás información para crear y personalizar tu blog de Blogger o Wordpress, además de artículos sobre Internet, las nuevas tecnologías, programación con HTML y CSS, educación y otros temas. Espero que los tutoriales, artículos y recursos del blog te resulten útiles. Si quieres mantener el contacto puedes hacerlo a través de mis cuentas de Twitter o Google Plus.