Diseño de página

En diseño web no es como en diseño gráfico, donde las aplicaciones nos permiten colocar los textos y las imágenes en cualquier lugar e incluso girarlas y modificarlas. El diseño en HTML y CSS nos limita al crear la estructura y colocación de los textos e imágenes que queramos colocar, pero no por ello tenemos que desanimarnos ya que una misma página, tan solo modificando el CSS podemos variar completamente la imagen de la misma. Os invito a ver la web www.csszengarden.com donde encontraréis varios ejemplos de esto.

Con CSS tenemos 2 métodos por los que podemos posicionar, absoluta y flotante. Con la posición absoluta podemos colocar un elemento en cualquier parte de la página con mucha precisión, pero no siempre queda como realmente queremos, ya que influyen muchos parámetros, no solo la posición. Por ello la más usada por los diseñadores web, en las plantillas prediseñadas en Dreamweaver CS5 podemos encontrar diversos ejemplos y posibilidades de posición flotante.

Antes de empezar el diseño de la página, hay varias preguntas a las que tenemos que contestar:

  1. ¿Qué tipo de explorador va a ser el más usado por los usuarios?, esta pregunta puede ser un poco absurda, pero al visualizar un sitio web nos damos cuenta que no todos los exploradores interpretan de la misma forma el código HTML y CSS. Recientemente lo podemos ver con el código HTML5 que para que los exploradores lo interpreten correctamente sin tener que engañarlo, han tenido que crear una nueva versión que si lea HTML5 y CSS3.
  2. ¿Vamos a usar flash?, esta pregunta es por una cuestión similar a la anterior solo que un poco más compleja, ya que no solo vemos las posibilidades de los navegadores si no de los dispositivos desde los que podemos visualizarlo. Hay dispositivos móviles que no visualizan flash.
  3. ¿Qué ancho tendrá la página?, adentrándonos ya en la estructura de la web, si tenemos en cuenta los monitores y dispositivos, podemos dar un ancho que no perjudique demasiado a los que posean un monitor de menos pulgadas. Yo por lo general doy 1000px de ancho para visualizar en un ordenador y para otros dispositivos, personalizo la página para que dependiendo del dispositivo se vea un diseño y estructura personalizado a su tamaño de pantalla.
  4. ¿Queremos que la página se vea centrada o a un lado de la pantalla?, la visualización centrada, izquierda o derecha dependerá del diseño que tengamos pensado.
  5. ¿Queremos que el año sea fijo o elástico?, volviendo al ancho de la página, podemos hacer que nuestra web posea un ancho mínimo y que se adapte a la pantalla, es decir que si la pantalla es superior al ancho se ajusta moviendo los diferentes apartados adaptando el diseño al ancho de monitor.

 

Este tema es largo y muy interesante, así como importante, por eso voy a dedicar varios capítulos para que quede lo más claro posible.

Os aconsejo leáis y veáis los ejemplos de CSS Zen Garden para que os sirva de ayuda, además de comprender un poco mejor las posibilidades de CSS.

Deja un comentario

*
WordPress SEO fine-tune by Meta SEO Pack from Poradnik Webmastera