Diferencia entre revisiones de «Usuario:ManuelRomero/preferencias/flexlayout»
De WikiEducator
(Página creada con «===Conceptos en el diseño web === Adjetivos encontrados en el diseño web #Felxible #Líquido #Porcentual #Adaptable ... ===Resposive Web Design o RWD=== Para lograr estos...») |
|||
Línea 15: | Línea 15: | ||
#Trabajar con el concepto de "mejora progresiva" (Progressive Enhancement) siempre en mente. | #Trabajar con el concepto de "mejora progresiva" (Progressive Enhancement) siempre en mente. | ||
Iceberg web | Iceberg web | ||
+ | |||
+ | ===Felxbox=== | ||
+ | *https://escss.blogspot.com.es/2012/11/flexbox-nuevo.html<br /> | ||
+ | #Felxibilidad Adaptación de los '''''felx items''''' '''(hijos)''' a los '''''flex container''''' (Tamaño, contenido, espacio ...) | ||
+ | #'''''Flex container ''''' : Caja '''contenedora''' de los '''''flex items''''' (hijos) | ||
+ | #Flex items | ||
+ | #Axis o ejes | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
https://escss.blogspot.com.es/2014/01/responsive-adaptive-web-design.html | https://escss.blogspot.com.es/2014/01/responsive-adaptive-web-design.html |
Revisión de 22:30 23 dic 2017
Conceptos en el diseño web
Adjetivos encontrados en el diseño web
- Felxible
- Líquido
- Porcentual
- Adaptable
...
Resposive Web Design o RWD
Para lograr estos fines, el RWD propone y aboga por:
- El uso de las reglas Css @media queries para adaptar el layout a la ventana o viewport.
- La caja flexible o flexbox a la espera de que el CSS Grid Layout sea una opción real.
- Usar recursos gráficos (img, video, canvas...) sensibles al medio o responsive images [1] / responsive images [2]. No sólo en tamaños (px) sino en su resolución (2x...) y/o hasta seleccionar la imagen que se sirve (nuevos elementos como picture, atributos srcset... bases de selección, étc [ver 1])
- Usa "Javascript discreto" o no invasivo (Unobtrusive JavaScript).
- Trabajar con el concepto de "mejora progresiva" (Progressive Enhancement) siempre en mente.
Iceberg web
Felxbox
- Felxibilidad Adaptación de los felx items (hijos) a los flex container (Tamaño, contenido, espacio ...)
- Flex container : Caja contenedora de los flex items (hijos)
- Flex items
- Axis o ejes
https://escss.blogspot.com.es/2014/01/responsive-adaptive-web-design.html