Esta charla es un recopilatorio de trucos y prácticas que he aprendido a lo largo de los años maquetando webs con CSS.
Todo el código será CSS nativo, sin usar pre-procesadores como SASS, LESS, etc.
Habrá de todo un poco:
- Selectores avanzados (*, >, +, :not, :nth-child, [data-attribute]…)
- Propiedades poco conocidas (flexbox gap, texto multicolumna, filters, scroll-snap, shape outside, gradientes cónicos)
- Accesibilidad en imágenes, animaciones y formularios tarjetas clicables en toda la superfície sin que todo sea <a> ni usar JS
- Como evitar que un texto que se convierta en negrita mueva el contenido adyacente
- Custom properties y dark mode
Todos los ejemplos se podrán consultar libremente Codepen, de modo los asistentes puedan ver el código y trastear tranquilamente a su aire sin tener que ir tomando nota de todo, aunque la charla quede grabada. Y, como no, todo compatible con WordPress. Aunque los ejemplos estén en Codepen, todos están basado en casos reales que me he ido encontrando maquetando themes.
Finalmente haré mención de algunas novedades que están por venir o que todavía tienen poco soporte a nivel de navegadores, pero que me parecen muy interesantes. Aunque esta parte no será la temática principal, sólo un «caramelito». Este tipo de charlas de «mira lo que viene» me parecen realmente muy interesantes pero a la vez un poco frustrantes, porque la mayoría de cosas aún no se pueden aplicar y te dejan con la miel en los labios.