×
Escribir código semántico debería ser el objetivo de todo desarrollador web. Con la adición de docenas de nuevas etiquetas HTML5, puede ser repentinamente confuso en cuanto a qué etiquetas deberías usar, especialmente porque originalmente podrías haber aprendido de una manera diferente. La diferencia entre las etiquetas de imágenes y figuras en HTML5 es bastante simple. Lo primero que hay que entender es que no son intercambiables. Los tags de imagen son aún absolutamente necesarios en HTML, el tag de figura es en realidad una forma diferente de organizar tu contenido. Antes de HTML5 no había una forma de agregar un pie de foto a una imagen semánticamente a través de HTML. Si querías agregar un pie de foto tenías que agregar un párrafo con una clase o algo similar. En HTML5 se agregaba un elemento. De acuerdo con la especificación del W3C, el elemento de la figura tiene un caption opcional y es una sola unidad fuera del flujo principal del documento y puede ser eliminado sin cambiar el significado del documento.Figure caption, , es un caption o leyenda para una figura. El no es necesario, y puede ser antes, después o dentro del . Sin embargo, sólo puede haber uno anidado dentro de un .An is something that goes inside of a . You can also use with blocks of code, audio, video, tables, etc.There are some exceptions. Graphics that are just graphics should still be listed as
. La razón por la que los gráficos regulares merecen un tratamiento diferente es porque no son necesarios para el contenido de la página. Si alguien no puede ver el gráfico, aún así obtendrá un mensaje claro de su sitio. Si esto parece un poco confuso, puede pensar en una forma semántica de agrupar todas las cosas que necesitará para una imagen. En lugar de anidar una imagen y un pie de foto que has puesto en un
dentro de una con una clase de «imagen» o algo similar, se pueden agrupar todas las imágenes como cosas dentro de una. Por ejemplo:
<figura,¿No parece el código anterior más semántico que esto:
<div <img src="tea.jpg "alt="Taza de té con vapor y bolígrafo en la cama"< Te preguntarás si deberías usar en vez de... Hay una forma súper sencilla de comprobar cuál deberías usar. Usa si el contenido sólo está relacionado con tu contenido principal, pero no es esencial. Use si el contenido es esencial, pero su posición exacta en la página es importante. Usar las nuevas etiquetas HTML5 para especificar exactamente cuál es tu contenido ayuda a los lectores de pantalla, y por lo tanto es mucho mejor para la accesibilidad. La forma antigua y anticuada es tener "sopa de div" en su marcado. Da un paso atrás e investiga un poco sobre las etiquetas HTML5 y la compatibilidad de los navegadores, y mira si puedes reemplazar tus divs con algo más semántico.COMPARTIR:
¿Listo para capacitar a todo tu equipo?
10Licencias¿Necesitas más licencias? Contacte con ventas. Continúe con la compraContinúe con la compraCancelar
Con tu plan, puedes:
Con tu piloto de 14 días, puedes:
- Acceder a miles de videos para desarrollar habilidades críticas
- Darle acceso a hasta 10 usuarios a miles de cursos de video
- Practicar y aplicar habilidades con cursos y proyectos interactivos
- Ver datos de habilidades, uso y tendencias de sus equipos
- Prepararse para las certificaciones con los exámenes de prácticas líderes en la industria
- Medir la competencia entre las habilidades y los roles
- Alinear el aprendizaje a sus objetivos con los caminos y canales
╲╱Solutions Skills FlowGift of View PricingContactar Sales╲╱PlatformBrowse libraryRole IQSkill IQIrisAuthorsProfessional ServicesTechnology Index╲╱CompanyAbout usCustomer storiesInvestorsCareersBlogNewsroomResource centerGuides╲╱ResourcesDownload EventsTeachPartnersAffiliate programOne.orgSubscribe╲╱SupportContactHelp centerIP whitelistSitemapCopyright © 2004 - LLC. Todos los derechos reservadosTérminos de usoPolítica de privacidad
Utilizamos cookies para que las interacciones con nuestros sitios web y servicios sean fáciles y significativas. Para obtener más información sobre las cookies que utilizamos o para saber cómo puede desactivarlas, haga clic aquí.
Acepta las cookies y cierra este mensaje Deshabilitar cookies
Ha desactivado las cookies no críticas y está navegando en modo privado. Para tener la mejor experiencia posible en nuestro sitio web, por favor, acepte las cookies. Para obtener más información, lea nuestra política de privacidad.
Acepta las cookies y cierra este mensaje