  

ANALÍTICA Y USABILIDAD

¿Qué es una etiqueta HTML y cuáles son

las más importantes?

XAVIER IDEVIK
el
14 JULIO, 2021

Tiempo de lectura: 8 min

  IEBS  Marketing  📈 Analítica y Usabilidad  Blog  ¿Qué es una etiqueta HTML y cuáles son
las más importantes?

I


 niciarse en el mundo de la programación web es una decisión que cada vez más personas toman,
conscientes de las oportunidades profesionales que supone contar con este tipo de conocimientos
 tan valorados por las empresas de hoy en día. Comprender el significado y la composición de las
etiquetas HTML es uno de los primeros pasos que cualquier profesional que aspire a convertirse en
21586
desarrollador o ingeniero web debe dar.

Con el objetivo de que entiendas qué es una etiqueta HTML, uno de los conceptos básicos con los que
trabajarás en programas tan solicitados como nuestro Executive Master en Marketing Digital,
Analítica y UX, queremos enseñarte cómo funciona la capa más básica de una web y que puedas
lanzarte a diseñar las tuyas sin miedo. ¿Nos acompañas en esta guía introductoria?

Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientes dichas cookies. Puedes obtener más información aquí o hacer clic en configuración para gestionar, rechazar y personalizar sus cookies.

AC E PTO

ÍNDICE DE CONTENIDOS 

¿Qué es una etiqueta HTML?   
HTML es un markup language, lo que significa que está escrito con códigos que puede leer una
persona sin que sea necesario compilarlo primero. En otras palabras, el texto en una página web está
«marcado» con estos códigos para dar instrucciones al navegador web sobre cómo mostrar el texto.
Estas etiquetas de marcado son las propias etiquetas HTML.

Cuando escribes código en HTML, estás escribiendo etiquetas HTML. Todas las etiquetas HTML están
hechas con un número de partes específicas, incluyendo:

El carácter “menor que” <

Una palabra o carácter que determina qué etiqueta se está escribiendo

Cualquier número de atributos HTML que se quiera usar, escritos de la forma nombre =”valor”
El carácter “mayor que” >

El hipertexto (HTML) es un lenguaje informático que forma la mayoría de las páginas web y
plataformas online. HTML no se considera un lenguaje de programación, ya que no puede crear una
funcionalidad dinámica. Sin embargo, los usuarios web pueden crear y estructurar secciones, párrafos y
enlaces usando elementos, etiquetas y atributos.

En la actualidad existen 142 etiquetas HTML disponibles que permiten la creación de varios
elementos. A pesar de que algunos ordenadores nuevos ya no admiten algunas de estas, es
importante tener constancia de la existencia de ellas.

Sin embargo, el HTML ha ido evolucionando los últimos años. Para que nos hagamos una idea, la
primera versión contaba solamente con 18 etiquetas. Desde entonces, cada nueva versión ha traído
nuevas etiquetas y atributos. La actualización más importante fue la introducción en 2014 del HTML5.
La principal diferencia entre ambas es que la nueva admitía nuevos tipos de controles de formularios.
También incluía diversas etiquetas semánticas que describían mejor el contenido, como <article>,
<headers> y <footer>.

VIDEO

Google Web Designer: edición HTML5 Descargar 

Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientes dichas cookies. Puedes obtener más información aquí o hacer clic en configuración para gestionar, rechazar y personalizar sus cookies.

¿Cómo funcionan las etiquetas HTML?

AC E PTO
La mayoría de páginas web tienen varias páginas HTML diferentes. Por ejemplo, una página de inicio,
otra de producto, otra de contacto, etc. Cada una de estas tiene HTML separados. Los documentos
HTML son archivos que acaban con .html o .htm. Un navegador lee el archivo y muestra su contenido
para los internautas puedan verlo.

Como hemos comentado anteriormente, todas las páginas HTML contienen una serie de elementos
HTML que a la vez disponen de diferentes etiquetas y atributos. Es decir, los elementos HTML son los
componentes básicos de una página web. Una etiqueta contiene mucha información. Le indica al
navegador dónde empieza y dónde termina cada elemento, mientras que un atributo describe las
características.

Los elementos HTML suelen dividirse en tres partes. Esta combinación de las tres crea un elemento
HTML.

Etiqueta de apertura: Se utiliza para indicar dónde empieza un elemento. Está envuelta en
corchete de apertura y cierre. Por ejemplo puedes usar la etiqueta de inicio <p> para crear un
párrafo.

Contenido: El contenido es el resultado que ve la audiencia.

 Etiqueta de cierre: Es lo mismo que la etiqueta de apertura pero con una barra inclinada delante

  
del nombre del elemento. Es decir, </p> para finalizar un párrafo.

Otra parte fundamental de un elemento HTML son los atributos. Estos tienen dos secciones:

Nombre: El nombre identifica la información adicional que un usuario quiere agregar.

Valor del atributo: Da más detalles que el anterior.

¿Cuáles son las etiquetas HTML básicas?

Hay una serie de etiquetas que son las más usadas para crear cualquier documento HTML, a
continuación las explicamos:

<body> para el contenido

<head> para información sobre el documento
<div> división dentro del contenido

<a> para enlaces

<strong> para poner el texto en negrita

<br> para saltos de línea

<H1>…<H6> para títulos dentro del contenido
<img> para añadir imágenes al documento

<ol> para listas ordenadas, <ul> para listas desordenadas, <li> para elementos dentro de la lista
<p> para parágrafos
<span> para estilos de una parte del texto

<body> </body>
Indica la parte del cuerpo del contenido de un documento HTML. Es una etiqueta esencial para
Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientescualquier documento
dichas cookies. Puedes obtenerya que
más indicaaquí
información donde
o hacerempieza el contenido
clic en configuración visible
para gestionar, delydocumento.
rechazar personalizar sus cookies.

<head></head> AC E PTO

La parte superior del documento HTML, es donde podremos indicar los metadatos: título del
documento, hojas de estilos, javaScript, CSS…

<div> </div>
Un elemento que es usado mayoritariamente para agrupar otros elementos y actuar como plantilla de
otros controles. La etiqueta <div> nos ayuda a estructurar el documento en secciones.

<a> </a>
Es una etiqueta que nos ayuda a poder crear un enlace a una página web. El atributo principal de la
etiqueta HTML es href, donde pondremos el enlace al que queremos conectar. Otro atributo muy
usado es target, el cual nos sirve para indicar si el enlace se abrirá en una nueva ventana o en la misma.

Ejemplo HTML:

Pulsa <a href=”https://www.nombredelaweb.com/” target=”_blank”>aquí</a> para visitar DonDominio.



<strong> </strong>   
Si tienes mucho texto, es importante poder dar énfasis a una parte en concreto, con la etiqueta strong
lo podemos hacer.

EXECUTIVE MASTER EN MARKETING DIGITAL, ANALÍTICA Y UX

¡Fórmate con los mejores!

¡Quiero apuntarme!

Ejemplo HTML:

Quiero destacar solo <strong>esta palabra</strong>.

<br>
Con esta etiqueta HTML le podemos decir al navegador que viene un salto de línea. Nos sirve para
hacer el texto más leíble.

<H1> </H1> …. <H6> </H6>

Hay diferentes niveles de títulos, del 1 al 6. Las etiquetas <H + número> nos permiten indicar la
importancia del título y para estructurar el contenido, de esta forma ayudamos a los bots a entender la
importancia del contenido.

<IMG> </IMG>
Usamos la etiqueta IMG para mostrar imágenes dentro del contenido. Necesita el atributo src para
funcionar, ya que será donde indicaremos desde donde tiene que mostrar la imagen.

<OL> <li></li> <OL> | <UL> <li></li> <UL>

UtilizamosLas etiquetas
cookies de tercerosOL
paraymejorar
LI nos sirven para
la navegación crear
del sitio, listas,
ofrecerte OL para
un mejor serviciolistas ordenadas
y personalizar y UL
la publicidad para
que listas sin
te ofrecemos. orden.
Al pulsar "Acepto"
consientesDentro
dichas cookies.
de las Puedes obtener
listas, los más informaciónse
elementos aquí o hacer clic en con
identifican configuración para gestionar,
la etiqueta LI. rechazar y personalizar sus cookies.

Ejemplo HTML:
AC E PTO
<ul>

<li>Primer elemento</li>

<li>Segundo elemento</li>

<ul>

<P> </P>
Etiqueta que nos sirve para agrupar texto dentro de un parágrafo. El propósito es poder hacer el
contenido más fácil de leer y organizado.

<SPAN> </SPAN>
Con la etiqueta podemos personalizar el estilo de solamente una parte del texto.

Ejemplo HTML:
 Solo <span style=”color: red;”>esta palabra</span> en rojo.

  

Ventajas y desventajas del HTML

Como todo lenguaje informático, el HTML tiene sus ventajas y sus desventajas. Entre las ventajas,
podríamos destacar que es apto para principiantes, que tiene una curva de aprendizaje poco profunda
y que es accesible. Además, es de código abierto y completamente gratuito y se ejecuta de forma
nativa en todos los navegadores web.

Por otro lado, entre las desventajas, se encuentra que para una funcionalidad dinámica es posible que
haya que utilizar JavaScript o un lenguaje back-end como PHP. Además, los usuarios deben crear
páginas web individuales para HTML, incluso si los elementos son los mismos y es posible que los
navegadores más antiguos no muestren las etiquetas más nuevas.

¿Qué te ha parecido este artículo sobre etiquetas HTML? Deja tus comentarios y ¡comparte!

Los atributos HTML te permitirán trabajar más rápido y de forma más eficiente. Si quieres incorporar
estas habilidades en tu perfil profesional no dudes en consultar nuestro Executive Master en
Marketing Digital, Analítica y UX Contarás con el apoyo y seguimiento de expertos en activo en cada
una de estas áreas.

EXECUTIVE MASTER EN MARKETING DIGITAL, ANALÍTICA Y UX

¡Fórmate con los mejores!

¡Quiero apuntarme!

   
21586  11 comentarios

Xavier Idevik 

Director de Marketing en DonDominio, especialista en analítica web, SEM, publicidad online y diseño e
interpretación de paneles de datos. Leer más
Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientes dichas cookies. Puedes obtener más información aquí o hacer clic en configuración para gestionar, rechazar y personalizar sus cookies.

AC E PTO

ANALÍTICA Y USABILIDAD FINANZAS

Qué es Google Tag Manager y Qué son las unit economics y

cómo usarlo cuáles son las más importantes
Cuando ponemos en marcha campañas Cuando hablamos de unit economics o
publicitarias de pago (SEM), es imprescindible economía unitaria lo hacemos de uno de los
trabajar de forma ordenada con herramientas pilares fundamentales de los que deben…
que nos permitan…

  

LO MÁS LEÍDO DE SIEMPRE

Qué es un Community Manager y cuáles son sus principales funciones en la empresa
Las profesiones mejor pagadas y más solicitadas del 2022
Las metodologías ágiles más utilizadas y sus ventajas dentro de la empresa
[Infografía] CFO, CIO, COO y otras siglas de altos cargos
¿Qué es el Marketing Digital?

Ver más 

11 comentarios en ¿Qué es una etiqueta HTML y cuáles son las

más importantes?
Arry
15 febrero, 2022 a las 9:17 pm

Diossssssssssss bendiga a las personas que con tanto estudiamos no trajeron este
manjar.

No hay duda tienen 🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟estrella me ayudó y es genial los amo

♥️♥️😍

Lourdes
28 julio, 2021 a las 1:47 am

¡Excelente! Me ayudo muchísimo.

Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientes dichas cookies. Puedes obtener más información aquí o hacer clic en configuración para gestionar, rechazar y personalizar sus cookies.

jeanfranco AC E PTO
7 julio, 2021 a las 5:30 am

ME ayudo a recordar algunas cosas thank you

Alex Mondragón
6 julio, 2021 a las 12:08 am

Pasa id region ee.uu.

Sebastian
20 junio, 2021 a las 6:34 pm
 Me sirvió a entender la etiqueta .

Muchas gracias.
  

Efrén
16 abril, 2021 a las 4:58 pm

Un pvp mancos los dejo 7-0

:)
29 abril, 2021 a las 3:43 am

Pasa ID

Ahiban Jofiel Delgado Fernandez

14 junio, 2021 a las 12:28 am

Como.?

a
18 junio, 2021 a las 9:25 pm

No duras después

Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
El invicto
consientes dichas cookies. Puedes obtener más información
14 octubre, 2021 a lasaquí o hacer
10:02 pm clic en configuración para gestionar, rechazar y personalizar sus cookies.

YA QUISIERAS AC E PTO

Mateo
5 enero, 2021 a las 6:25 pm

Me sirvio muchisimo gracias

Comments are closed.


  
SÍGUENOS EN LAS REDES

    

SOBRE NOSOTROS OFERTA FORMATIVA ¿HABLAMOS?

IEBS Business School Masters Blog
 info@iebschool.com Claustro de profesores Postgrados Contacta con nosotros
Metodología Learning by Expertos Solicita tu admisión
(+34) 919 058 055 - Madrid
(+34) 931 833 199 - Barcelona doing Cursos Becas disponibles
(+59) 8 2711 6748 - Montevideo Sala de Prensa Seminarios Quiero ser partner
(+52) 55 1163 8927 - Ciudad de Preguntas frecuentes Webinars
México
Opiniones de IEBS Directorio de Cursos     
Acceso Campus Virtual
Trabaja con nosotros
Quiero ser profesor
Blog
Suscríbete a la newsletter 
Aviso Legal |
Política de cookies |
Política de privacidad

©2022 IEBS Business School. Todos los derechos reservados.

Utilizamos cookies de terceros para mejorar la navegación del sitio, ofrecerte un mejor servicio y personalizar la publicidad que te ofrecemos. Al pulsar "Acepto"
consientes dichas cookies. Puedes obtener más información aquí o hacer clic en configuración para gestionar, rechazar y personalizar sus cookies.

AC E PTO