ETIQUETAS DE HTML
- López Castrejón Yeimi Natali
- Posadas Perez Angie Cristal
INDICE
<Ol>.........11
<Map>.......3
<Optgroup>.......12
<Mark>......4
<Menu>......5
<Option>........13
<Meta>.......6
<Output>.........14
<Meter>.......7
<P>.........15
<Nav>..........8
<Param>........16
<Noscript>....9
<Video>..........17
<Objet>........10
Los atributos más importantes de la etiqueta <map> en HTML son:
name: especifica un nombre para el mapa, que se utilizará para vincularlo con una o varias etiquetas <img>
class: permite aplicar estilos css al mapa.
son definir un área clicable utilizando el atributo name en la etiqueta <map>, que se vincula al atributo usemap de la etiqueta <img>.
Dentro de la etiqueta <map>, se usan etiquetas <area> para definir las formas, coordenadas y enlaces de cada zona interactiva.
<MAP>
es utilizada para crear un mapa de imágenes, que permite definir zonas de una imagen que pueden ser enlazadas a otras páginas web o a otras partes de la misma página.
USO
ARTRIBUTOS
CARACTERISTICAS
<AREA >
Dentro de la etiqueta <map>, se utilizan las etiquetas <area> para especificar las características de cada zona.
indice
USO DE <AREA>
<MARK>
representa texto que debe ser resaltado o marcado, generalmente porque es relevante o importante en un contexto dado, similar a usar un rotulador en un documento físico.
TERMINOS CLAVE
CSS
Es útil para destacar palabras o frases importantes que coinciden con una búsqueda del usuario o que son relevantes para el tema.
es un lenguaje de diseño web que se usa para definir la apariencia de documentos escritos en lenguajes de marcado como HTML, controlando aspectos visuales como colores, tipografías, márgenes y la posición de los elementos.
FLEXIVILIDAD CON CSS
Puedes usar CSS para cambiar el estilo del resaltado. Por ejemplo, podrías cambiar el color de fondo o de la fuente para que el texto resaltado encaje mejor con el diseño general de tu sitio web.
índice
La etiqueta <ul> (lista desordenada) es la base para crear la estructura de un menú en HTML, ya que organiza los elementos de navegación en una lista de elementos (<li>) que no requieren un orden específico y que normalmente se presentan con viñetas o marcadores visuales.
En HTML, <ul> y <li> son etiquetas para crear listas desordenadas, donde <ul> define la lista y <li> define cada elemento individual de esa lista. La etiqueta <ul> (lista no ordenada) se usa cuando el orden de los elementos no importa, como en las listas con viñetas, y cada elemento de esa lista se define con <li>.
<MENU>
RELACION ENTRE ETIQUETAS
<ul> - <li>
El elemento HTML <menu> se describe en la especificación HTML como una alternativa semántica a <ul> , pero los navegadores lo tratan (y lo exponen a través del árbol de accesibilidad) como no diferente de <ul> .
índice
<META>
proporciona metadatos sobre la página web, como el título, la descripción, el autor, palabras clave y el conjunto de caracteres, que son utilizados por los navegadores, motores de búsqueda y otras herramientas para entender y presentar el contenido web correctamente.
USO
<meta>Las etiquetas siempre van dentro del elemento <head> y normalmente se utilizan para especificar el conjunto de caracteres, la descripción de la página, palabras clave, el autor del documento y la configuración de la ventana gráfica.
PROPOSITOS
CONPATIBILIDAD CON NAVEGADORES
Describe el contenido, Mejora la visibilidad, Controla la presentación
SAFARI OPERA CHROME EDGE
índice
Muestra un valor numérico dentro de un rango definido, que puede ser un valor fraccionario o un porcentaje.
<METER>
FUNCION
se usa para representar un valor dentro de un rango conocido o un valor fraccionario, como la capacidad utilizada, la memoria libre, o un porcentaje.
Espacio de almacenamiento utilizado en un disco.
Nivel de memoria libre.
Porcentaje de una tarea completada.
Puntuaciones o niveles de "calidad".
indice
USOS COMUNES
<NAV>
sirve para agrupar y definir secciones de una página que contienen enlaces de navegación principales, como un menú del sitio o una tabla de contenido.
Cuándo NO usar
Flexibilidad
No se debe utilizar para agrupar todos los enlaces de un documento, solo los que sirven como herramientas de navegación principales
Puede haber varios elementos <nav> en una página, pero deben reservarse para las secciones de navegación principales
Accesi bilidad
Ayuda a los lectores de pantalla y otras tecnologías de asistencia a identificar y presentar la información de navegación a los uarios con discapacidades visuales.
compativilidad con navegadores
índice
CHROMEEDGE FIREFOX OPERA SAFARI
Garantiza que la información principal sea accesible para usuarios que no pueden ejecutar scripts por diversas razones.
<NOSCRIPT>
es para proporcionar contenido alternativo que se mostrará solo cuando el navegador de un usuario no pueda ejecutar o no tenga activado el script (como JavaScript).
ACCECIVILIDAD
indice
<OBJECT>
sirve para incrustar contenido externo diverso en una página web, como imágenes, videos, audio, documentos PDF, y otros tipos de archivos o aplicaciones.
Atributos importantes
Usos comunes
data: Especifica la URL del recurso externo que se va a insertar.
width y height: Definen el ancho y el alto del contenedor para el objeto incrustado.
type: Indica el tipo MIME del recurso, ayudando al navegador a identificar el contenido.
Contenido multimedia Documentos Aplicaciones
índice
type: Este atributo especifica el tipo de numeración que se usará para los elementos de la lista. Los valores posibles son:
“1” para números (este es el valor predeterminado),
“a” para letras minúsculas,
“A” para letras mayúsculas,
“i” para números romanos minúsculos
“I” para números romanos mayúsculos.
start: Este atributo especifica el número en el que comienza la numeración de los elementos de la lista. El valor predeterminado es 1.
type start reversed class id
<OL>
es para crear una lista ordenada, es decir, una lista donde el orden de los elementos es importante y el navegador los numera automáticamente (o los marca alfabéticamente).
Vergüenza
ATRIBUTOS
Type
Este atributo define si la numeración de los elementos de la lista debe ser inversa. Si se establece en “reversed”, el último elemento de la lista se numerará como 1 y el primer elemento se numerará como el número total de elementos en la lista.
Este atributo se utiliza para especificar una o varias clases CSS que se aplicarán al elemento <ol>. Esto se usa para aplicar estilos personalizados a la lista.
este atributo se utiliza para especificar un identificador único para el elemento <ol>. Esto se utiliza principalmente para vincular la lista a otros elementos en la página mediante enlaces internos.
reversed
class
id
índice
Permite dividir una lista larga de opciones en secciones más pequeñas y manejables, mejorando la experiencia del usuario al navegar por el menú desplegable
Es un atributo obligatorio el cual es usado para especificar el título o títulos del grupo. Dentro de la etiqueta <optgroup> se colocan las opciones relacionadas mediante la etiqueta <option>.
Es especialmente útil cuando se tienen muchas opciones que se pueden categorizar, como marcas, clases o tipos de productos.
<OPTGROUP>
LABEL
ORGANIZACION
LISTAS EXTENSAS
es utilizada para agrupar opciones relacionadas dentro de una lista desplegable (elemento <select>).
indice
<OPTION>
Se usa dentro de un elemento <select> o <datalist> para definir una opción individual dentro de una lista desplegable o de sugerencias, respectivamente.
<datalist>
Se utiliza para proporcionar sugerencias de entrada a medida que el usuario escribe en un campo de texto.
<select>
Permite al usuario elegir entre una serie de opciones predefinidas.
índice
<OUTPUT>
El atributo for incluye los elementos que están implicados en este output, separados con espacios. Esto es algo más informativo que necesario.
También admite un atributo form, para indicar cuál es su formulario asociado.
se actualiza dinámicamente con JavaScript.
se usa dentro de un formulario para mostrar el resultado de una operación o cálculo realizado por el usuario o un script, como un subtotal, un total o un mensaje de validación
FOR
ACTUALIZACION
FORM
indice
El atributo name sirve para identificar el output dentro del formulario y así poder modificar su valor en el callback oninput.
Especifica el valor inicial del elemento de salida.
NAME
VALUE
Los párrafos definidos con ` <p> ` suelen presentar un pequeño espacio en blanco antes y después del texto, que los navegadores interpretan como un bloque de texto con márgenes.
<P>
ESTILO POR DEFECTO
es una etiqueta básica y esencial para la creación de contenido en una página web. Representa un párrafo de texto y se utiliza para separar bloques de texto en una página.
índice
<PARAM>
se utiliza dentro del elemento <object> en HTML para definir un parámetro que controla el comportamiento de un objeto insertado en la página web, como una película que se reproduce automáticamente.
PROPOSITO
Define un parámetro para un elemento <object>
ATRIBUTOS
La etiqueta <param> y sus atributos name, value, type y valuetype están marcados como obsoletos en las versiones modernas de HTML.
índice
Ofrece controles integrados para reproducción, pausa, volumen y modo de pantalla completa.
SRC: Archivo o URL del video a reproducir. Obligatoria si no tiene etiquetas dentro.
WIDHT: Indica el tamaño de ancho del video.
HEIGT: Indica el tamaño de alto del video.
autoplay loop muted controls playsinline
<VIDEO>
OTROS
OFRECE
ATRIBUTOS
permite incrustar y reproducir vídeos directamente en una página web.
índice
ETIQUETAS DE HTML
Yeimi López
Created on September 3, 2025
Start designing with a free template
Discover more than 1500 professional designs like these:
View
Hand-Drawn Infographic
View
Mathematical Operations
View
Frayer Model
View
Create Your Story in Spanish
View
Microcourse: Key Skills for University
View
Microcourse: Learn Spanish
View
History Timeline
Explore all templates
Transcript
ETIQUETAS DE HTML
INDICE
<Ol>.........11
<Map>.......3
<Optgroup>.......12
<Mark>......4
<Menu>......5
<Option>........13
<Meta>.......6
<Output>.........14
<Meter>.......7
<P>.........15
<Nav>..........8
<Param>........16
<Noscript>....9
<Video>..........17
<Objet>........10
Los atributos más importantes de la etiqueta <map> en HTML son: name: especifica un nombre para el mapa, que se utilizará para vincularlo con una o varias etiquetas <img> class: permite aplicar estilos css al mapa.
son definir un área clicable utilizando el atributo name en la etiqueta <map>, que se vincula al atributo usemap de la etiqueta <img>.
Dentro de la etiqueta <map>, se usan etiquetas <area> para definir las formas, coordenadas y enlaces de cada zona interactiva.
<MAP>
es utilizada para crear un mapa de imágenes, que permite definir zonas de una imagen que pueden ser enlazadas a otras páginas web o a otras partes de la misma página.
USO
ARTRIBUTOS
CARACTERISTICAS
<AREA >
Dentro de la etiqueta <map>, se utilizan las etiquetas <area> para especificar las características de cada zona.
indice
USO DE <AREA>
<MARK>
representa texto que debe ser resaltado o marcado, generalmente porque es relevante o importante en un contexto dado, similar a usar un rotulador en un documento físico.
TERMINOS CLAVE
CSS
Es útil para destacar palabras o frases importantes que coinciden con una búsqueda del usuario o que son relevantes para el tema.
es un lenguaje de diseño web que se usa para definir la apariencia de documentos escritos en lenguajes de marcado como HTML, controlando aspectos visuales como colores, tipografías, márgenes y la posición de los elementos.
FLEXIVILIDAD CON CSS
Puedes usar CSS para cambiar el estilo del resaltado. Por ejemplo, podrías cambiar el color de fondo o de la fuente para que el texto resaltado encaje mejor con el diseño general de tu sitio web.
índice
La etiqueta <ul> (lista desordenada) es la base para crear la estructura de un menú en HTML, ya que organiza los elementos de navegación en una lista de elementos (<li>) que no requieren un orden específico y que normalmente se presentan con viñetas o marcadores visuales.
En HTML, <ul> y <li> son etiquetas para crear listas desordenadas, donde <ul> define la lista y <li> define cada elemento individual de esa lista. La etiqueta <ul> (lista no ordenada) se usa cuando el orden de los elementos no importa, como en las listas con viñetas, y cada elemento de esa lista se define con <li>.
<MENU>
RELACION ENTRE ETIQUETAS
<ul> - <li>
El elemento HTML <menu> se describe en la especificación HTML como una alternativa semántica a <ul> , pero los navegadores lo tratan (y lo exponen a través del árbol de accesibilidad) como no diferente de <ul> .
índice
<META>
proporciona metadatos sobre la página web, como el título, la descripción, el autor, palabras clave y el conjunto de caracteres, que son utilizados por los navegadores, motores de búsqueda y otras herramientas para entender y presentar el contenido web correctamente.
USO
<meta>Las etiquetas siempre van dentro del elemento <head> y normalmente se utilizan para especificar el conjunto de caracteres, la descripción de la página, palabras clave, el autor del documento y la configuración de la ventana gráfica.
PROPOSITOS
CONPATIBILIDAD CON NAVEGADORES
Describe el contenido, Mejora la visibilidad, Controla la presentación
SAFARI OPERA CHROME EDGE
índice
Muestra un valor numérico dentro de un rango definido, que puede ser un valor fraccionario o un porcentaje.
<METER>
FUNCION
se usa para representar un valor dentro de un rango conocido o un valor fraccionario, como la capacidad utilizada, la memoria libre, o un porcentaje.
Espacio de almacenamiento utilizado en un disco. Nivel de memoria libre. Porcentaje de una tarea completada. Puntuaciones o niveles de "calidad".
indice
USOS COMUNES
<NAV>
sirve para agrupar y definir secciones de una página que contienen enlaces de navegación principales, como un menú del sitio o una tabla de contenido.
Cuándo NO usar
Flexibilidad
No se debe utilizar para agrupar todos los enlaces de un documento, solo los que sirven como herramientas de navegación principales
Puede haber varios elementos <nav> en una página, pero deben reservarse para las secciones de navegación principales
Accesi bilidad
Ayuda a los lectores de pantalla y otras tecnologías de asistencia a identificar y presentar la información de navegación a los uarios con discapacidades visuales.
compativilidad con navegadores
índice
CHROMEEDGE FIREFOX OPERA SAFARI
Garantiza que la información principal sea accesible para usuarios que no pueden ejecutar scripts por diversas razones.
<NOSCRIPT>
es para proporcionar contenido alternativo que se mostrará solo cuando el navegador de un usuario no pueda ejecutar o no tenga activado el script (como JavaScript).
ACCECIVILIDAD
indice
<OBJECT>
sirve para incrustar contenido externo diverso en una página web, como imágenes, videos, audio, documentos PDF, y otros tipos de archivos o aplicaciones.
Atributos importantes
Usos comunes
data: Especifica la URL del recurso externo que se va a insertar. width y height: Definen el ancho y el alto del contenedor para el objeto incrustado. type: Indica el tipo MIME del recurso, ayudando al navegador a identificar el contenido.
Contenido multimedia Documentos Aplicaciones
índice
type: Este atributo especifica el tipo de numeración que se usará para los elementos de la lista. Los valores posibles son: “1” para números (este es el valor predeterminado), “a” para letras minúsculas, “A” para letras mayúsculas, “i” para números romanos minúsculos “I” para números romanos mayúsculos.
start: Este atributo especifica el número en el que comienza la numeración de los elementos de la lista. El valor predeterminado es 1.
type start reversed class id
<OL>
es para crear una lista ordenada, es decir, una lista donde el orden de los elementos es importante y el navegador los numera automáticamente (o los marca alfabéticamente).
Vergüenza
ATRIBUTOS
Type
Este atributo define si la numeración de los elementos de la lista debe ser inversa. Si se establece en “reversed”, el último elemento de la lista se numerará como 1 y el primer elemento se numerará como el número total de elementos en la lista.
Este atributo se utiliza para especificar una o varias clases CSS que se aplicarán al elemento <ol>. Esto se usa para aplicar estilos personalizados a la lista.
este atributo se utiliza para especificar un identificador único para el elemento <ol>. Esto se utiliza principalmente para vincular la lista a otros elementos en la página mediante enlaces internos.
reversed
class
id
índice
Permite dividir una lista larga de opciones en secciones más pequeñas y manejables, mejorando la experiencia del usuario al navegar por el menú desplegable
Es un atributo obligatorio el cual es usado para especificar el título o títulos del grupo. Dentro de la etiqueta <optgroup> se colocan las opciones relacionadas mediante la etiqueta <option>.
Es especialmente útil cuando se tienen muchas opciones que se pueden categorizar, como marcas, clases o tipos de productos.
<OPTGROUP>
LABEL
ORGANIZACION
LISTAS EXTENSAS
es utilizada para agrupar opciones relacionadas dentro de una lista desplegable (elemento <select>).
indice
<OPTION>
Se usa dentro de un elemento <select> o <datalist> para definir una opción individual dentro de una lista desplegable o de sugerencias, respectivamente.
<datalist>
Se utiliza para proporcionar sugerencias de entrada a medida que el usuario escribe en un campo de texto.
<select>
Permite al usuario elegir entre una serie de opciones predefinidas.
índice
<OUTPUT>
El atributo for incluye los elementos que están implicados en este output, separados con espacios. Esto es algo más informativo que necesario.
También admite un atributo form, para indicar cuál es su formulario asociado.
se actualiza dinámicamente con JavaScript.
se usa dentro de un formulario para mostrar el resultado de una operación o cálculo realizado por el usuario o un script, como un subtotal, un total o un mensaje de validación
FOR
ACTUALIZACION
FORM
indice
El atributo name sirve para identificar el output dentro del formulario y así poder modificar su valor en el callback oninput.
Especifica el valor inicial del elemento de salida.
NAME
VALUE
Los párrafos definidos con ` <p> ` suelen presentar un pequeño espacio en blanco antes y después del texto, que los navegadores interpretan como un bloque de texto con márgenes.
<P>
ESTILO POR DEFECTO
es una etiqueta básica y esencial para la creación de contenido en una página web. Representa un párrafo de texto y se utiliza para separar bloques de texto en una página.
índice
<PARAM>
se utiliza dentro del elemento <object> en HTML para definir un parámetro que controla el comportamiento de un objeto insertado en la página web, como una película que se reproduce automáticamente.
PROPOSITO
Define un parámetro para un elemento <object>
ATRIBUTOS
La etiqueta <param> y sus atributos name, value, type y valuetype están marcados como obsoletos en las versiones modernas de HTML.
índice
Ofrece controles integrados para reproducción, pausa, volumen y modo de pantalla completa.
SRC: Archivo o URL del video a reproducir. Obligatoria si no tiene etiquetas dentro. WIDHT: Indica el tamaño de ancho del video. HEIGT: Indica el tamaño de alto del video.
autoplay loop muted controls playsinline
<VIDEO>
OTROS
OFRECE
ATRIBUTOS
permite incrustar y reproducir vídeos directamente en una página web.
índice