Etiquetas HTML
28/04/2021

Qué son las etiquetas HTML: Tipos y listado

Programación y TIC

¿Qué es una etiqueta HTML?

Las etiquetas HTML son pequeños bloques de código que indican al navegador como debe interpretar el contenido recogido entre las etiquetas.

Las etiquetas HTML comienzan con el símbolo “<” y se finaliza con “>” y entre medias de estos símbolos va el nombre de la etiqueta que queremos que el navegador interprete. Casi todas las etiquetas de HTML tienen dos partes, la obertura y la etiqueta de cierre, hay excepciones como la etiqueta de la imagen, pero por norma general casi todas tienen la misma estructura.

Las etiquetas de cierre se construyen con “/” justo antes de “>”.

Ejemplo:

    Si queremos iniciar un párrafo en html se utiliza la etiqueta “p” y sería así:

    <p> Hola mundo </p>

    ¿Cuáles son las etiquetas básicas que debes conocer?

    HTML tiene varias etiquetas, y aunque sí que es cierto que todas se suelen utilizar, hay algunas que son básicas que serán comunes en todos los documentos HTML:

    <!DOCTYPE HTML> o <HTML>

    Inicia el navegador, es el inicio de todo documento HTML para indicar que el explorador tiene que interpretar el documento que viene a continuación. Doctype indica que vas a usar HTML 5

    <head>

    Entre esta etiqueta se introducen todos los metadatos del documento. Incluyendo enlaces, scripts, hojas de estilos, etc. todas ellas irán en sus correspondientes etiquetas que mostramos a continuación entre el head

    <Tittle>

    Va dentro del <head>. Le pone un título a tu página web

    <link>

    Va dentro del <head>. Es la etiqueta para poder importar recursos externos a tu página como JavaScript o CSS

    <body>

    Al contrario que la etiqueta <head> todo lo que se quiere mostrar en la web a nivel visual para el usuario tiene que estar dentro de esta etiqueta.

    Tipos de etiquetas HTML más utilizadas

    HTML tiene muchos tipos de etiqueta, hemos visto las básicas a continuación mostraremos los diferentes tipos de etiquetas que son utilizadas

    • Etiquetas de secciones o para estructurar

    Éstas etiquetas tienen como función dar forma al documento, crear una estructura visual para que el usuario se sienta cómodo. Dentro de este tipo encontramos:

    <Nav>: Para crear navegación

    <Section>: para crear secciones

    <Articule>: define contenido independiente dentro de la web

    <H1..6>: Para crear títulos y encabezados

    <Heade>r y <footer>: Crean la parte de encabezado y pie de página

    • Etiquetas que agrupan contenido:

    Estas etiquetas se suelen utilizar para mostrar contenido del mismo grupo en un espacio de la web. Por ejemplo.

    <p>: crea un párrafo

    <ol>: crear lista ordenada

    <ul>: Crear lista de desordenada

    <div>: Crea un espacio para introducir contenido genérico

    • Etiquetas semánticas para el texto:

    Las etiquetas semánticas son las que dan formato al texto, en ellas encontramos.

    <a>: para crear hipervínculos

    <strong>: Para definir una parte como importante (es fundamental para el SEO)

    <cite>: Para indicar título de una obra

    <br>: Salto de línea

     

    Existen muchos otros tipos, como para incrustar contenido externo como pueden ser vídeos o para la creación de tablas, algo en desuso a causa de la etiqueta <div> mencionada anteriormente.

    Con lo mencionado anteriormente ya tienes una buena base para adentrarte en el lenguaje HTML y como crear documentos sencillos. ¿Te animas a probarlo?

    Comparte en:

    mejorar la usabilidad de tu web
    13/10/2021

    ¿Aún sigue siendo relevante la usabilidad web?

    La usabilidad se ha convertido en sí misma en una herramienta de análisis que puede ayudar a que tus productos digitales sean realmente efectivos. Pero... ¿Sigue si...

    diferencia entre UX y UI
    30/07/2021

    ¿Cuál es la diferencia entre UX y UI?

    Cualquier diseñador que se inicia en el mundo laboral tiene la misma pregunta ¿qué diferencia hay entre diseño UX y UI? Hoy te damos las claves para su distinción...

    Profesional en Data Science
    07/07/2021

    Fórmate como profesional en Data Science

    En este post hablaremos sobre la formación y habilidades necesarias para convertirse en un científico de datos (Data Scientist), que son los profesionales que se ded...