Diseño de un portal electrónico

Última actualización el Martes 30 de Marzo de 2010 23:14 Escrito por Carlos Martes 30 de Marzo de 2010 22:16

Rikishi, portal ficticio de comercio electrónico diseñado como ejercicio de maquetación CSS y XHTML

Como primer trabajo del Curso de desarrollo de aplicaciones web dinámicas que estoy haciendo, teníamos que maquetar la página de inicio de un portal de comercio electrónico con XHTML y CSS. Estas son unas capturas de cómo quedó la página finalmente. Los siguientes trabajos del curso se harán a partir de esta base, así que cuando acabe el proyecto final, lo pondré en la parte de portafolio.

Para diseñar la portada, me he basado en las medidas de mi querido 960 grid system, más que nada para ahorrarme el tener que estar haciendo cálculos con las medidas (que si sumar 2px de margen aquí y tener que restárselos allá) aunque el CSS lo he creado todo por mi cuenta (como requisito del ejercicio). Así que me creé yo mis clases y mi posicionamiento a mi manera (por supuesto, sin tablas), lo cual ha servido para refrescar clears y floats .

Aunque esta parte del curso era de la que más sabía de partida, he aprendido bastantes cosas útiles: formateo accesible de tablas y selectores avanzados (tipo E + F, E > F ...).

El diseño es bastante sencillo, últimamente me gusta hacer diseños bastante minimalistas. En este caso, al ser una tienda de electrónica, viene doblemente bien un diseño limpio, dado lo habitual que es en algunas tiendas tener un diseño con nada de espacio en blanco (whitespace) al tener tanta información.

Logotipo creado para la empresa ficticia

Ya que tenía que inventarme una empresa ficticia, he aprovechado para diseñar un logotipo, haciendo un juego de palabras un poco idiota con la palabra consumo.

Tags: