el descubrimiento

Ni siquiera estaba buscando imágenes para utilizar en un diseño cuando, por casualidad, me tropecé con un wallpaper de un videojuego del que no tenía ninguna noticia anterior: ZerA: Imperan Intrigue. Me gustó la ilustración y buscando un poquito más de información sobre el juego llegué a su página oficial (ver créditos).

Mi primera reacción fue algo así como... O_O wow! El artwork desarrollado para el videojuego realmente me encantó. No solamente por la caracterización de los personajes, sino también por los paisajes. Así que no pude evitar guardar algunas imágenes de la galería para hacer algo con ellas. Finalmente, ese algo se convirtió en una layout, que es lo que me resulta más entretenido.

Si estáis en mi misma situación y no habéis oído hablar de este juego os recomiendo visitar su web oficial, en la que además de imágenes podréis encontrar un par de videos para descargar, incluída la espectacular promo del juego.

sobre esta layout

Aunque tiene el aspecto de estar codificada en tablas, lo cierto es que la única tabla que utiliza esta layout es la que permite fragmentar la imágen principal para optimizar la carga de la página. Todos los demás posicionamientos están hechos mediante div-layers, de modo que el código resulta más sencillo de manejar.
He preferido no incrustar ningún título en la propia imágen para que este aspecto pueda ser totalmente personalizable.

También con respecto al título, fijaos que en la hoja de estilo he definido para él una serie de tipos de fuente alternativos; la primera de la lista (que fue la elegida durante el proceso de diseño en photoshop) puede que no sea demasiado común, y con la segunda, que sí lo es, el título se alarga horizontalmente y ocupa más espacio, de forma que para títulos un poco más largos tal vez sea mejor utilizar un tamaño de fuente más pequeño u otro tipo de letra.
Si os decidís por la primera opción deberéis asignar un atributo padding-top en la hoja de estilo para que el texto resulte centrado verticalmente.

El aspecto es bastante clásico (y personalmente pienso que es el estilo que, a fin de cuentas, mejor funciona. Si algo no está roto, no lo arregles, ¿verdad?), formas rectas con distribución de cuerpo principal y menú lateral. Para la imágen he utilizado principalmente efectos de capa y únicamente un par de pinceles de mi propia cosecha.
Al prinicipio no tenía pensado incluir como extra más que uno o dos avatares, pero como las layouts siempre lucen mejor con algo de contenido y con algún que otro adorno, me decidí a poner también las imágenes alargadas para acompañar el texto.

En la barra de navegación superior hay un espacio limitado para añadir los enlaces principales del sitio; no pongas demasiados o el resultado puede ser bastante desagradable. Dependiendo del tipo o tamaño de letra utilizado podrán caber más, sin embargo es mejor no atestar demasiado esta zona, y poner solamente los enlaces imprescindibles, dejando los demás para la columna lateral.

Como siempre, este diseño está pensado para una resolución de pantalla de 800 x 600 pixels o superior.

condiciones de uso

1. Puedes utilizar esta layout siempre que tu sitio sea de carácter no comercial.
2. Solamente pido a cambio que mantengas los créditos en algún lugar visible.
3. Añade todos los contenidos que quieras, pero no modifiques el diseño ni la estructura de esta layout.
4. Puedes editar la hoja de estilos para cambiar aspectos como el tipo, tamaño o color de letra, sin embargo ve con cuidado o el aspecto final podría resentirse.
5. No enlaces directamente ninguno de estos gráficos. Descarga el archivo zip que los contiene y súbelos a tu servidor desde tu propio ordenador.

créditos

1. Imágenes: En la web oficial de ZerA: Imperan Intrigue y en Game Wallpapers
2. Brushes & Layout: GBB.

Extras

Como añadido, estos cuatro avatares, además de las imágenes alargadas de más arriba.