Etiquetas y atributos de HTML

Lo primero que tenemos que saber, es que existen diferentes versiones de Html, en las cuales se han ido incorporando y eliminado algunas etiquetas y aplicado diferentes normas en su estructura.

En la siguiente tabla podemos ver las versiones mas destacadas de HTML:

Lo primero que tenemos que saber, es que existen diferentes versiones de Html, en las cuales se han ido incorporando y eliminado algunas etiquetas y aplicado diferentes normas en su estructura.

En la siguiente tabla podemos ver las versiones mas destacadas de HTML:

Versiones de HTML y XHTML

AÑO Versión Descripción
1995 HTML 2.0 Es la primera versión estándar de Html. No soportaba tablas y se simplificaba al máximo la estructura del documento para que dada la poca velicidad de transmisión que existía resultara agil. Básicamente eran páginas de texto y fotos, aunque al al poder realizar enlaces con otras páginas con mas información, resulto un sistema muy revolucionario para almacenar documentación, lo que marco el éxito de la WWW.
1997 HTML 3.2 En esta se incorporaron avances como la disponibilidad de que el texto fluyera entre las imágenes, tablas y otros elementos.
1999 HTML 4.01 Esta versión se prescindió de muchas etiquetas y/o atributos que daban formato al texto gracias a la incorporación de estilos CSS.

Gracias a CSS y elementos de bloque como la etiqueta DIV, se pueden hacer páginas con estructuras más complejas que sus predecesoras.

2014 HTML 5 Con esta última versión se aportan etiquetas que dan contenido semántico.

La gran diferencia en esta actualización, es que HTML5 incluye como propios de la especificación a CSS3 y JavaScript.

Más información:

Si quieres saber las diferencias entre HTML 4 y HTML 5 puede visitar este enlace: https://www.w3.org/TR/html5-diff/

 

Etiquetas

Las etiquetas en Html tienen el mismo formato que en XML, pero con nombre y función definida. Existen etiquetas que tienen una de apertura <p> y otra de cierre </p>, encerrando entre ellas el contenido que queremos que contengan.

Tambien existen etiquetas, que al tener su contenido en atributos o por no encerrar contenido no disponen de so homolga de cierre.

Por ejemplo algunas de ellas son:

<br> Para salto de línea

<img src=’archivo.jpg’> para insertar una foto.

<hr> Linea horizontal

En Html 4 estas etiquetas se representan con una “/”  al final <br />, pero en html 5 se ha eliminado, representando solo la etiqueta.

<br>, <img src=’archivo.jpg’>, <hr>

Atributos

En html disponemos de varias etiquetas para diferentes elementos, pero a veces tenemos que proporcionar más información para que tome un formato especial o indicarle la fuente (el origen ) de un recurso . Para eso tenemos los atributos. Con un formato de nombre-valor separados por «=» y escritos en la etiqueta de apertura de un elemento.

El valor del atributo puede estar entre «comillas dobles» o ‘simples’. Aunque en HTML5 es valido también no poner comillas siempre que se trate de un texto sin espacios.

Los atributos comunes se dividen en cuatro grupos según su funcionalidad:

Atributos básicos: Son utilizadas por casi todas las etiquetas de html. Su uso es necesario para la aplicación de estilos con CSS y para dar sentido a algunos elementos por temas de posicionamiento SEO o para hacer la pagina más adaptable, como es el caso de los atributos; alt o title.

Los principales son:

  • id = «texto»      Establece un identificador único a cada elemento HTML.
  • class = «texto» Establece la clase CSS que se aplica a los estilos de elemento.
  • style = «texto» Aplica directamente estilos CSS a un elemento.
  • title = «texto»   Establece el título a un elemento (mejora la accesibilidad y los navegadores lo muestran cuando el usuario pasa el ratón por encime del elemento).

Atributos para internacionalización: Estos atributos se utilizan en aquellas páginas que muestran sus contenidos en varios idiomas y las que quieran indicar de forma explícita el idioma de sus contenidos:

lang = «código de idioma» Indica el idioma del elemento mediante un código predefinido.

xml:lang = «código de idioma»   Indica el idioma del elemento mediante un código predefinido.

dir  Indica la dirección del texto (útil para los idiomas que escriben de derecha a izquierda).

Atributos de eventos: sólo se utilizan en las páginas web dinámicas creadas con JavaScript.