El primer Layout
La noción de layout suele utilizarse para nombrar al esquema de distribución de los elementos dentro un diseño. Es habitual que un diseñador que se dedica a la creación de páginas web desarrolle un layout y se lo presente a su cliente para que éste lo apruebe y decida sobre la distribución de los contenidos.
El layout, en este sentido, puede ser una especie de plantilla que presenta tablas o espacios en blanco. La idea es que, a partir del layout, la página web comience a desarrollarse con sus contenidos específicos.
En los últimos años ha evolucionado enormemente la manera de crear un diseño (layout) de un Sitio Web. Básicamente se pueden crear layout de 3 formas o métodos, y todos utilizando propiedades CSS.
Utilizando Float:
- Inconvenientes:
- Método bastante antiguo
- Los elementos deben ordenarse en el código HTML, no es posible con CSS
- Es lento y tedioso de modificar un Sitio Web creado con Float
- Son necesarias muchas lineas de código para que todo funcione bien
- Ventajas:
- Es un método fácil y rápido de aprender
- Todos los navegadores web lo soportan, hasta los más antiguos
- Las páginas se ven igual de bien en todos los navegadores y en todos los dispositivos
Utilizando Flex-Box:
- Inconvenientes:
- Es un método de hace unos años pero que todavía hoy se utiliza mucho
- No todos los navegadores lo soportan de forma correcta, solo los relativamente modernos
- Es necesario emplear cierto tiempo y esfuerzo para aprender a utilizarlo bien
- Se necesita práctica y bastante terminilogía comprender su correcto funcionamiento
- Ventajas:
- Es fácil implementar Sitios Web responsive utilizando este módulo CSS que la W3C llama Flex-Box.
- Es sencillo modificar el comportamiento de todo un sitio Web creado con Flex-Box
- No se necesitan muchas lineas de código para crear un Sitio Web completamente funcional con Flex-Box
- Se puede cambiar el orden y la disposición de los elementos HTML desde CSS sin esfuerzo.
Utilizando Grid:
- Inconvenientes:
- Se necesita bastante tiempo y esfuerzo para aprender a utilizarlo correctamente
- Sólo los navegadores más modernos lo soportan, es necesario tenerlos actualizados
- Ventajas:
- Es el método más moderno y el que se utiliza hoy día para diseñar
- Son necesarias muy pocas líneas de código para obtener grandes resultados
- Se pueden crear Sitios Web adaptables rápidamente
- Es un método que permite modificaciones rápidas y profundas de todo el layout
