Hola amigos, he vuelto después de un tiempo, he estado muy ocupada aprendiendo cosas nuevas, una de ellas es programar en HTML. En esta página os voy a decir qué es HTML y alguna de sus funciones principales.
HTML es el lenguaje con el que se define el contenido de las páginas web. Corresponde a las siglas en inglés de Lenguaje de Marcado de Hipertexto, básicamente son un conjunto de etiquetas que el navegador interpreta y se emplean para definir el texto y otros elementos que compondrán una página web, como imágenes, listas, tablas, vídeos, etc.
El lenguaje HTML sirve para describir la estructura básica de una página y organizar la forma en que se mostrará su contenido, además de que HTML permite incluir enlaces hacia otras páginas o documentos.
Hay que mencionar que el HTML no es un lenguaje de programación, ya que no cuenta con funciones aritméticas, variables o estructuras de control propias de estos lenguajes, por lo que el HTML únicamente sirve para crear páginas web estáticas. Sin embargo, este lenguaje es muy útil ya que combinado con otros lenguajes de programación obtenemos páginas web dinámicas como las que conocemos hoy en día.
En esta página tenéis la información necesaria para crear páginas como la siguiente:
Como hemos dicho antes, HTML se sirve de etiquetas para elaborar las páginas web. ¿Qué son las etiquetas? Las etiquetas HTML son pequeños bloques de código, que indican al navegador como debe interpretar el contenido recogido entre dichas etiquetas. Estas etiquetas cuentan además con atributos que podemos añadir y que en sí, pueden determinar como será el comportamiento específico que tendrá la etiqueta.
Las etiquetas HTML comienzan siempre con el símbolo «<» y finalizan con el símbolo «>». Entre medias de estos dos símbolos irá el nombre de la etiqueta que queremos que el navegador interprete.
Todas las etiquetas HTML están compuestas por una etiqueta de apertura, y una etiqueta de cierre.
LISTADO ETIQUETAS HTML
A continuación voy a indicarte cuales son las etiquetas HTML que más hemos utilizado en clase y también te indicaré su finalidad.
ETIQUETAS INICIALES O DE RAÍZ
- <!DOCTYPE html> Indica al navegador que el documento está basado en el estándar HTML5
- <html> </html> Representa la raíz de un documento HTML. Todos los demás elementos de la estructura HTML deben ser recogidos dentro de estas etiquetas.
METADATOS DEL DOCUMENTO
- <head> </head> Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo. El resto de etiquetas de metadatos, irán recogidas dentro de las etiquetas de apertura y cierre del head. Importante explicar que estos metadatos del documento, es información para el navegador y no contenido que será visible en la página web. A excepción de la etiqueta <title> que veremos a continuación.
- <title> </title> Etiqueta usada para definir el título de la página web.
ETIQUETAS DE SECCIONES O PARA ESTRUCTURAR EL HTML
- <body> </body> Al contrario que la etiqueta de metadatos <head>, todo lo que quieras mostrar en la página web debe ir recogido dentro de las etiquetas de apertura y cierre de <body>. Este contenido será el que se muestre en la web.
- <h1>,<h2>,<h3>,<h4>,<h5>,<h6> Son etiquetas HTML muy importantes, ya que son usadas para jerarquizar el contenido de la web. Las etiquetas se usan para explicar brevemente el contenido que irá a continuación.
- <header> </header> Se usan para definir la cabecera la página web. Suele contener el logotipo, menú de navegación, etc.
- <footer> </footer> Usadas para definir el pie de página.
ETIQUETAS PARA LA AGRUPACIÓN DE CONTENIDO
- <p> </p> Etiqueta usada para escribir párrafos de texto.
- <hr> Etiqueta utilizada para «romper» entre dos secciones de una web. Usada comúnmente como separador.
- <ol> </ol> Etiquetas para crear una lista ordenada
- <ul> </ul> Etiquetas para crear una lista des-ordenada
- <li> </li> Etiquetas que recogen el contenido de un elemento de una lista, sea ordenada o no.
- <div> </div> Etiqueta común utilizada para crear un contenedor genérico.
ETIQUETAS SEMÁNTICAS PARA TEXTO
- <a> </a> Etiqueta utilizada para crear hiperenlaces en el documento HTML
- <br> Etiqueta utilizada para crear un salto de línea
ETIQUETAS PARA INCRUSTAR CONTENIDO
- <img> Etiqueta para «pintar» una imagen en la página web.
- <video> </video> Se usa para reproducir video en la página web junto a sus archivos de audio y capciones asociadas.
- <audio> </audio> Usada para cargar en una web un archivo de audio o stream de audio.
ETIQUETAS PARA LA CREACIÓN DE TABLAS
- <table> </table> Etiquetas de apertura y cierre de una tabla. El resto de etiquetas de la tabla han de ir siempre recogidas entre estas dos etiquetas.
- <caption> </caption> Usada para indicar el título de la tabla.
- <colspam> </rowspam> Etiqueta utilizada para agrupar dos o más columnas de una tabla.
- <tbody> </tbody> Usada para describir los datos concretos de una tabla.
- <thead> </thead> Indica el bloque de filas que describen las etiquetas de las columnas de la tabla.
- <tr> </tr> Se usa para indicar una fila de celdas de una tabla.
- <td> </td> Usada para definir una celda de una tabla.
- <th> </th> Etiqueta que se usa para definir el encabezado de una celda
ETIQUETAS PARA LA CREACIÓN DE FORMULARIOS
- <form> </form> Etiqueta de apertura y cierre de un formulario de una página web. El resto de etiquetas de formulario deben ir siempre recogidas entre estas etiquetas de apertura y cierre de formulario.
- <label> </label> Se usa para definir el nombre o título de un control del formulario.
- <input> Pinta un campo de introducción de datos para el usuario. Es de las principales etiquetas de un formulario.
- <button> </button> Etiqueta utilizada para representar un botón en el formulario.
Os dejo aquí un vídeo introductorio sobre el HTML con conceptos básicos para aquellos que estén interesados en aprender.
No hay comentarios:
Publicar un comentario