Es posible que queramos delimitar una sección de la página destinada a la búsqueda de información. Para ello, tenemos a nuestra disposición la etiqueta <search>
.
<search>
La etiqueta <search>
representa una agrupación de elementos orientados a realizar búsquedas u operaciones de filtrado. Ejemplos podrían ser formularios de búsqueda, operaciones para filtrar contenido o incluso búsquedas globales en Internet.
Observa el siguiente fragmento de código:
<search>
<form action="https://www.google.com/search">
<label>
<input type="search" name="q" autocomplete="off">
<img src="magnifier-glass.png" alt="magnifier glass icon">
</label>
<input type="submit" value="Buscar">
</form>
</search>
En este ejemplo podemos observar varios detalles:
<search>
contiene toda la parte relacionada con la búsqueda<label>
para indicar que tienen relación semánticaComo se puede ver, simplemente cubre la responsabilidad de un contenedor destinado a tareas de búsqueda o filtrado. También, en el caso de tener varias zonas de búsqueda, se podrían utilizar múltiples etiquetas <search>
.
En el caso de necesitar mostrar unos resultados de búsqueda en la propia página, estos deberían ser incluidos dentro de la etiqueta
<search>
, ya que tienen relación con la búsqueda.
Soy Manz, vivo en Tenerife (España) y soy streamer partner en Twitch y profesor. Me apasiona el universo de la programación web, el diseño y desarrollo web y la tecnología en general. Aunque soy full-stack, mi pasión es el front-end, la terminal y crear cosas divertidas y locas.
Puedes encontrar más sobre mi en Manz.dev