HTML

HTML

Corría el año 1989 y un joven Tim Berners (34) se disponía a crear la web tal y como la conocemos hoy día.

La primera red interconectada había sido creada hacía 20 años uniendo las universidades de Stanford y UCLA bajo el nombre de Arpanet, y desde entonces no había hecho más que aumentar sus interconexiones. 

En 1989, el CERN era el nodo de internet más grande de Europa, pero internet era, en esencia, un sistema para enviar y recibir emails. No había páginas webs, no había buscadores, no había, en definitiva, hipertexto (hipervínculos).

Así pues un equipo de físicos liderados por Tim Berners se propuso unir ambas tecnologías (el hipertexto y Arpanet), y para ello, nada mejor que usar la gran red del CERN.

Basándose en un lenguaje de hipertexto llamado SGML, consiguieron crear un sistema a partir del cual podía accederse a los ficheros almacenados en los ordenadores que estuviesen en red. Esa mejora del sistema SGML, fue conocida como HTML y, tan sólo un año más tarde, ese mismo equipo creaba el WWW (Word Wide Web), el primer servidor y el primer navegador web.

Había nacido la web, y Tim Berners sería considerado como el padre de la misma.

 

¿Como funciona?

¿Y cómo veo el código? Muy sencillo, basta con pulsar la combinación de teclas Control+U. Lo que se te mostrará es lo que conocemos como código fuente es decir, todo el código del lado del cliente, que hace posible que esa web funcione tal y como lo hace. O dicho de otra forma, el código HTML y las capas superiores de código que tenga embebidas (CSS, JavaScript…).

Otra forma de mostrar el código fuente es:

En Internet Explorer:

Ver –> Fuente

• En Chrome:

Menú (3 líneas horizontales en la parte superior izquierda) –> Más herramientas –> Ver código

• En Firefox:

Herramientas –> Desarrollo web –> Código de página

• En Safari:

Ver –> Ver fuente

Ya pero… ¿Y si quiero ver el funcionamiento de algo muy concreto? ¿Tengo que buscar en todo el código fuente de la página?

Chrome, Firefox y la última versión de Internet Explorer (Microsoft Edge), tienen una herramienta llamada “Inspeccionar elemento“, que permite ver el código tras un elemento en particular, en el contexto de toda la web.

Para utilizar dicha herramienta, basta con hacer clic con el botón derecho en la parte concreta cuyo código queramos conocer, y pulsar en Inspeccionar.

¿Que es?

Está relacionado el término HTML con lo que ves en tu navegador web (Ej. Google Chrome, Mozilla Firefox, Safari, etc).

HTML no es un lenguaje de programación, esto debes tenerlo muy en claro desde el principio, HTML es un lenguaje de marcado de hipertexto o “HyperText Markup Language” por el desarrollo de sus iniciales en inglés, básicamente este lenguaje se escribe en su totalidad con elementos, estos elementos están constituidos por etiquetas, contenido y atributos, que explicaremos de una manera más detallada en algunas líneas más abajo.

HTML es un lenguaje que interpreta el navegador web para mostrar los sitios o aplicaciones web tal y como estamos acostumbrados.

Versiones de HTML

El primero en salir fue el HTML 1, sin embargo no fue considerado un estándar, por lo que muchas veces se considera al HTML 2 como la primera versión del HTML.

HTML 2: Presentado en el año de 1995, el HTML 2 es considerado la primera versión del HTML, el cual no soportaba tablas y donde la declaración explícita de los elementos body, html y head es opcional.

HTML 3.2: Esta versión se lanzó en el año de 1997 gracias al organismo de estandarización llamado W3C (World Wide Web Consortium). El cual incorporó los últimos avances de las páginas web como applets de Java y texto que fluye alrededor de las imágenes.

HTML 4.0: Lanzada en 1998. Entre sus novedades más destacadas se encuentran las hojas de estilos CSS, la posibilidad de incluir pequeños programas o scripts en las páginas web, mejora de la accesibilidad de las páginas diseñadas, tablas complejas y mejoras en los formularios.

HTML 4.01: salió a la luz en 1999 como una revisión y actualización de la versión HTML 4.0, por lo que no incluye novedades significativas.

HTML 5: quinta revisión importante del lenguaje básico de la World Wide Web,  el cual especifica dos variantes de sintaxis para HTML: el clásico HTML (text/html), y la variante conocida como HTML5 y una variante XHTML conocida como sintaxis XHTML5. Este nuevo estándar aun no es tan utilizado pero su potencial es mucho mayor a las versiones anteriores, el cual incluye interesantes mejoras como nuevos elementos y etiquetas.

Mejoras que trajo HTML5.

Las mejoras más destacadas que trajo HTML5 son las siguientes:

• Manejo nativo de elementos multimedia y gráficos, con las etiquetas <video>, <audio>, <svg> y <canvas>.

• Nuevas etiquetas que permiten mejorar el marcado semántico de un documento: <nav>, <section>, <article>, <header>, <footer>, <aside>.

• Nuevos tipos de campos de entrada en formularios: email, time, number, range, color, etc.

• La mejora más potente es el de las nuevas APIs, que permiten, vía JavaScript, realizar tareas antes impensables, muchas de ellas enfocadas a la web móvil: transformar en tiempo real imágenes y vídeos (pe, rotar, recortar…), acceder a la cámara y/o micrófono, geo localización, websockets (los culpables de esas ventanitas “fulanito quiere enviarle notificaciones” tan de moda ahora), almacenamiento local para trabajar sin conexión, bases de datos en el navegador, respuesta a eventos táctiles.

Por otro lado hay que decir que HTML 5 especifica dos variantes de sintaxis para HTML. Un clásico HTML (text/html), la variante conocida como HTML5 y una variante XHTML conocida como sintaxis XHTML5 que deberá ser servida como XML (XHTML). Esta es la primera vez que HTML y XHTML se han desarrollado en paralelo.

FUENTES:

• https://webadictos.com/breve-historia-del-html/
• https://www.loopeando.com/que-es-html-que-significa-cual-es-su-origen-y-como-funciona/#:~:text=El%20nombre%20HTML%20proviene%20de,queremos%20mostrar%20en%20una%20web.
• https://luisforgiariniblog.com/cual-diferencia-entre-html-html5/#:~:text=La%20diferencia%20es%20sumamente%20sencilla,HTL4%20(la%20versi%C3%B3n%20anterior).&text=%E2%80%9CLa%20diferencia%20es%20sumamente%20sencilla,una%20versi%C3%B3n%20del%20lenguaje%20HTML.%E2%80%9D