Me pregunto cuál es la diferencia entre 'span' y las nuevas etiquetas HTML5 'figura' y 'área'.<span> vs <figure> vs <area>
¿Cuál es el propósito de cada uno y cuáles son los usos apropiados? Por ejemplo, frecuentemente uso un 'lapso' con una imagen de fondo en lugar de una etiqueta 'img' para evitar que la imagen sea seleccionable; ¿Cuál es el mejor elemento para lograr esto?
<span> es un elemento en línea, utilizado esencialmente como un div en línea. Es un "contenedor genérico para redactar contenido que por sí solo no representa nada". (W3C spec)
<figure> se usa junto con el elemento <figcaption> para marcar algo que "se puede alejar del flujo principal del documento sin afectar el significado del documento". (W3C spec)
<area> es para hacer mapas de imágenes, y se utiliza dentro de un elemento <map>.
En su caso, recomendaría usar un div en su lugar, o incluso una etiqueta img con un png transparente como el contenido con una imagen de fondo. Puede usar una etiqueta img con selección de usuario: ninguna; con los prefijos habituales para detener la selección de una imagen.
La etiqueta <span> se utiliza para texto u otros elementos en línea. Se usa principalmente para formatear con CSS.
La etiqueta especifica <figure> contenido dinámico como imágenes, diagramas, fotos, código, etc.
La etiqueta <area> define un área dentro de una imagen-mapa.