Introducción HTML

Lo primero que tenemos que saber sobre HTML es que no es un leguaje de programación, es un lenguaje de marcado. La sigla corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto.
Un lenguaje de marcado se compone de etiquetas jerárquicas que permiten mostrar contenido en una página web, como textos, imágenes, videos, etc.
Podemos decir que el HTML describe la estructura de nuestro documento o página utilizando etiquetas (tags).
Para conocer más sobre los distintos tipos de etiquetas podemos utilizar el sitio de Mozilla Developer Network o MDN.


Muchas páginas web son la versión electrónica de documentos reales. Por ejemplo en lanacion.com.ar podemos encontrar la versión digital del contenido que sale publicado en el diario de manera física.

En la publicación CAMBIO DE CARRERA: VENTAJAS Y DESAFÍOS DE INGRESAR AL MERCADO DE LA TECNOLOGÍA podemos ver un claro ejemplo de como estructurar una noticia.

Tenemos un título principal:

CAMBIO DE CARRERA: VENTAJAS Y DESAFÍOS DE INGRESAR AL MERCADO DE LA TECNOLOGÍA

Una bajada:

EL SECTOR TECNOLÓGICO ES, HOY, UNO DE LOS POCOS QUE EN LA ARGENTINA TIENE PLENO EMPLEO Y HASTA POSICIONES SIN CUBRIR. POR ESO YA SON MUCHOS LOS QUE DECIDIERON CAMBIAR EL RUMBO DE SUS VIDAS Y EMBARCARSE EN UNA NUEVA PROFESIÓN. CÓMO LO HICIERON Y QUÉ TRABAJOS CONSIGUIERON.

La nota:

La tecnología está en todos lados. Empezó a expandirse...

Material audiovisual (imagenes, videos)

Autor:

AXEL MARAZZI

Fecha:

18 de Marzo 2019

Etiquetas realacionadas:

cambio de carrera

Y una lista de comentarios.

En un artículo más largo podemos encontrar más secciones con otros títulos, textos e imagenes. Estas estructuras ayudan al leector a entender la noticia y de alguna forma estamos acostumbrados a este formato. También podemos hacer un análisis similar en un blog post como puede ser medium.com.

De alguna forma estamos acostumbrados a este tipo de estructuras gracias a los diarios u otro tipo de publicación física similar. Ahora bien, qué pasa cuando tenemos que estructurar otro tipo de documentos como puede ser un Twit?

Ejemplo tw

En este ejemplo podemos ver:

Contenido:

just setting up my twttr

Fecha:

8:50 PM - 21 Mar. 2006

Imagen

Imágenes de perfil de los usuarios

Datos del autor:

Nombre y nombre de usuario

Campo de texto para ingresar una respuesta:

Tweet your reply

Botones para interactuar:

  • Siguiendo o seguir al usuario
  • Respuestas
  • Retwittear
  • Poner que me gusta
  • Mandar un mensaje directo a otro usuario

En síntesis a la hora de crear páginas web nos vamos a encontrar que cada uno de nuestros proyectos va a tener secciones que tiene una estructura particular. HTML nos brinda las etiquetas para describir las distintas partes de nuestro documento.

La Nación en HTML: La Nacion en HTML