En esta sexta clase del curso de técnicas de maquetación web, aprenderemos a hacer un efecto acordeón, que nos puede venir genial para secciones de preguntas frecuentes.
Una de las técnicas más utilizadas para mostrar elementos en el desarrollo web moderno es la del efecto acordeón. Esta forma de visualizar el contenido de un sitio web, se basa en el hecho de que parte de dicho contenido está inicialmente oculto al usuario.
Para poderlo ver, es necesario que hagamos click sobre el elemento principal y, en ese momento, se despliega la parte oculta, que muestra la totalidad del contenido. ¡Vamos a verlo paso a paso!
¡Ya lo tenemos! En muy poco tiempo, hemos creado los elementos de una lista de preguntas frecuentes desplegables en formato acordeón.
Cuándo el usuario accede al sitio, las preguntas aparecen plegadas, es decir, no se muestran las respuestas. Sin embargo, en el momento en el que el usuario hace click, éstas se despliegan y muestran la totalidad de las respuestas que contienen.
Este tipo de efectos suele utilizarse muchísimo en las secciones de preguntas frecuentes de una web, para aligerar la cantidad de texto, y que estéticamente no quede todo el texto apelmazado.
Como siempre, si tenéis cualquier duda o pregunta, podéis mandarla a través del formulario de soporte de la intranet de suscriptor. ¡Nos vemos en la siguiente lección, en la que navegaremos entre pestañas! :)
Todos los capítulos de este curso:
- Curso de técnicas de maquetación web #1. Hero Image
- Curso de técnicas de maquetación web #2. Sombras
- Curso de técnicas de maquetación web #3. Sticky menu
- Curso de técnicas de maquetación web #4. Menú hamburguesa
- Curso de técnicas de maquetación web #5. Transiciones
- Curso de técnicas de maquetación web #6. Acordeón
- Curso de técnicas de maquetación web #7. Pestañas o tabs
- Curso de técnicas de maquetación web #8. Animacioness
- Curso de técnicas de maquetación web #9. Formularios
- Curso de técnicas de maquetación web #10. Líneas con CSS