Un espacio para mostrar mis fotografías, y en el que poder hablar sobre este tema tan apasionante desde todos los ángulos posibles.

Disfruta de tu paseo por esta página.

Secciones

• Fotografías (27)
• Fundamentos básicos (1)
• General (3)
• Mundo digital (2)
• Retoque fotográfico (1)
• Sala de máquinas (1)

Búsquedas

Archivos

• Agosto 2008 (0)
• Marzo 2008 (1)
• Mayo 2006 (5)
• Abril 2006 (7)
• Febrero 2006 (1)
• Enero 2006 (2)
• Diciembre 2005 (1)
• Noviembre 2005 (3)
• Octubre 2005 (1)
• Septiembre 2005 (2)
• Agosto 2005 (4)
• Julio 2005 (8)

Fotografía

• Foros de Ojo Digital
• Canon Digital Photography Forums
• Digital Photography Review
• The Digital Picture
• The Luminous Landscape
• Photo.net
• Fred Miranda

Otros enlaces

• Japonismo.com
• Espacio Japón
• What Mobile Forums
• Minid.net
• Diseñorama
• Conecta2 Jimaku
• Mobileburn
• ケータイ Watch
• ITmedia モバイル
• El Mundo

Otros blogs

• Puente aéreo
• Laura no monogatari
• Omnis Scientia
• Katsu House
• Poogaboo Land

Diseñando un nuevo blog

Viernes, 29 de julio de 2005 a las 12:06 - Sala de máquinas

Aunque este blog es bastante nuevo, ya desde el primer día he estado modificando varios aspectos en su diseño, y retocando la hoja de estilos una y otra vez, y por eso he decidido inaugurar una nueva sección que seguramente no tendrá muchos mensajes, ya que no tiene que ver con el tema principal, la fotografía, pero en la que me podré explayar sobre aspectos técnicos y de diseño del blog.

Apariencia global

Lo primero que me encontré fue que la página no se veía bien con Internet Explorer, ya que los menús aparecían centrados, y el contenido principal justo debajo. El motivo era que el bloque de datos que utilizo para mostrar los enlaces para la sindicación, encima del menú, contienen un tag para centrar el texto que Internet Explorer interpreta mal y acaba centrando todo lo que tenga por debajo. Por más que lo intenté, no conseguía resolver el problema, puesto que lo que funcionaba para un navegador no iba bien para el otro. Podéis ver en la imagen una muestra de cómo se veía el blog en el Internet Explorer antes de que lo arreglara.

La solución, finalmente, consistió en modificar el diseño de fondo del blog, y colocar el bloque de menús utilizando posicionamiento absoluto, tomando como base la parte más alta de la página. Asimismo, para evitar la mala interpretación de Internet Explorer de los enlaces de sindicación, estos los puse al final del todo en cada página, de forma que aunque el navegador quiera interpretarlo mal, no tiene ningún otro bloque al que aplicarle de forma errónea la condición de centrado de texto.

Ahora, utilizando el servicio que ofrece la página web Browsershots.org, he visto cómo se vería el blog en todas las diferentes plataformas que pueden encontrarse en los ordenadores de todo el mundo: Safari, para Mac; Internet Explorer; Mozilla; Firefox; Epiphany; Galeon, Konqueror y Opera. Os muestro dos capturas de pantalla, para que veáis que es cierto. A la izquierda, el Opera 7.54 y a la derecha, el Safari 2.0 sobre una plataforma Mac OS X.

La cabecera

Antes de escoger la cabecera, ya tenía la idea básica de cómo sería el diseño del blog y de su código de colores, así que estaba claro que la cabecera tendría que ser una imagen que se fusionase bien con el color albero del fondo. Por suerte, las Navidades pasadas estuvimos de vacaciones en Oslo, y el día de Nochevieja fuimos testigos de una de las puestas de sol más espectaculares que hemos visto en nuestra vida, y por supuesto, había fotos, muchas fotos.

El proceso fue relativamente sencillo. Una vez escogida la anchura del blog, recortar la fotografía con esas dimensiones, y en la parte baja, como los colores no eran exactamente iguales al color de fondo del blog, aplicarle un gradiente utilizando el color rojo del mar como inicio y el color albero del fondo del blog como final. Luego se le añadía una capa de texto, a la que apliqué un efecto de reflejo (que lamentablemente se ha ido perdiendo con las sucesivas modificaciones que he hecho a la imagen de cabecera), y luego añadir una zona cuadrada de color azul a la derecha para que encaje bien con el bloque del menú.

Sin embargo, la anchura inicial del blog era de 750 pixels, pero cuando rediseñé la estructura interna del blog, decidí hacerlo un poco más ancho, para poder tener al menos 500 pixels en la zona central para mostrar mis fotografías con un tamaño algo decente. Para no complicarme la vida, simplemente redimensioné la fotografía en Photoshop, y durante unos días la cabecera se quedó así.

El problema estaba en que se notaba cierta pixelación, y algo de ruido en la fotografía, así que primero pasé la foto por Noise Ninja, con unos parámetros bastante agresivos, que le dieron a la foto un tono mucho más suave y soñador, y posteriormente, con el tampón de clonar de Photoshop, fui retocando píxel a píxel aquellos puntos de la imagen que no tenían el color apropiado. Para que veáis el antes y el después, os pongo una muestra de la cabecera antes y después:

Comentarios

A la hora de mostrar los comentarios, al principio no quería complicar mucho las cosas, así que utilicé el mismo contenedor que para las referencias, pero ya entonces tenía en mente modificar la forma de mostrar los comentarios, utilizando un formato un poquito más gráfico. En realidad no es demasiado complicado, pues basta con añadir un par de imágenes a un contenedor rectangular, todos de la misma anchura para que quede bien, y con el mismo color. Luego basta con jugar un poco con la distancia interna del texto a los bordes del contenedor, y con los márgenes, para centrar más o menos el comentario.

Podéis ver en las imágenes siguientes una muestra de cómo eran los comentarios antes y cómo son ahora:

La verdad es que no creo que haya muchos más cambios en breve en el blog en lo que a apariencia se refiere, pero desde luego, lo que sí puedo decir es que me he divertido de lo lindo montándolo.

Comentarios (6)

Deja tu comentario

Referencias (0)

URL para referencias o trackbacks