Semántica a nivel de texto
En este apartado, se introducen algunos elementos HTML de utilidad a nivel semántico.
Elemento <a>
Este elemento hace que el texto encerrado entre las etiquetas se convierta en un hipervínculo.
<a href="https://es.wikipedia.org/">Wikipedia</a>
El atributo más importante es href
, que indica la URL del vínculo. A veces se usa href="#"
para refererirse a la propia página en la que aparece el vínculo.
El atributo target
permite elegir donde se abrirá el vínculo. Los valores más usados son:
Valor | Descripción |
---|---|
target="_blank" | El enlace se abre en una ventana/pestaña nueva. |
target="_self" | El enlace se abre en la misma. Es el valor por defecto. |
Por ejemplo:
<a href="https://es.wikipedia.org/" target="_blank">Wikipedia</a>
<a href="https://es.wikipedia.org/" target="_self">Wikipedia</a>
Elemento <strong>
El elemento <strong>
permite representar que el texto marcado es importante.
El texto es <strong>importante</strong>
Elemento <em>
El elemento <em>
permite indicar énfasis (texto en cursiva).
Un elemento HTML puede ser <em>inline</em>
Elemento <br>
El elemento <br>
introduce un salto de línea.
Línea 1<br>
Línea 2<br>
Línea 3
Elemento <small>
El elemento <small>
permite insertar comentarios accesorios, como lo que suelen aparecer en letra pequeña.
Texto marcado <small>con el elemento small</small>
Elemento <abbr>
El elemento <abbr>
permite indicar el significado de una abreviatura o sigla.
<abbr title="Hypertext Markup Language">HTML</abbr>
Ejemplo completo
A continuación, un ejemplo que incluya todos los elementos introducidos en este apartado:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Semántica a nivel de texto</title>
</head>
<body>
Texto marcado como <strong>importante</strong>.
<br>
Texto con <em>énfasis</em>
<br>
Texto marcado <small> con el elemento small </small>
<br>
Pulsa <a href="https://www.w3.org/">aquí</a> para ir a la página del <abbr title="World Wide Web Consortium">W3C</abbr>.
</body>
</html>
El resultado sería:
En la web Mozilla Developer Network (MDN) puede consultar más información sobre los elementos HTML.