Quiero crear una página de preguntas y respuestas.Marca HTML semántico para preguntas frecuentes
No es una lista, no son datos tabulares y no estoy seguro de si o cómo debo usar <dl><dt><dd>.
¿Cuál es la mejor forma semántica para construirlo y formatearlo con css?
Siempre uso <dl> para preguntas frecuentes. Por lo general, el <dt> es un ancla para el índice de preguntas a vincular.
... editar
Debo mencionar, esta es mi interpretación del enfoque más semántica. Como lo veo, este es exactamente el tipo de cosa <dl> está destinado a marcar.
En cuanto a CSS, es realmente subjetivo. Hago estilos típicos de encabezado para el <dt>, con un alto peso de fuente, tal vez un tamaño de letra ligeramente mayor, y tal vez un mayor espaciado entre letras y palabras.
Lo que se integra bien con el resto de sus visuales en el sitio y hace que la relación entre la pregunta y la respuesta inmediatamente obvio ....
Iría con el modelo más simple; cada pregunta es un encabezado, con respuestas en las etiquetas de párrafo. Claro, lógico y semánticamente sensato, creo.
La razón por la que no utilizaría las etiquetas de lista de definiciones mencionadas es que no creo, desde un punto de vista semántico puro, que las preguntas y respuestas se ajusten al molde de términos y definiciones puros.
Un artículo de 24ways de 2007 aborda el uso semántico de DL. Se las arregla para evitar esta situación específica, pero sigue siendo relevante. http://24ways.org/2007/my-other-christmas-present-is-a-definition-list –
Lectura interesante, y un sitio interesante; Gracias por el enlace. – Rob
¿Qué es lo peor que puede pasar (una pregunta seria) con el uso de listas de definiciones? ¿se confunde Google/los lectores de pantalla se confunden? Me doy cuenta de que no es una combinación perfecta, pero no veo una mejor alternativa. –
Una de las cosas frustrantes de la semántica es que a veces no es un derecho o respuesta incorrecta. '
' es apropiado (gracias a su [nuevo significado en HTML5] (http://html5doctor.com/the-dl-element/)), los encabezados y párrafos también funcionan bien, y también puede usar [''/'
'] (http://html5doctor.com/the-details-and-summary-elements/) para hacer preguntas frecuentes colapsables si tiene demasiadas preguntas y quiere mantenerlo ordenado. –