TUTORIA DE HTML

INTRODUCCION

HTML, HyperText Markup Language, es el pilar de la web. Desarrollado por Tim Berners-Lee en los años 90, permite la creación de páginas web al definir su estructura y contenido mediante etiquetas. Estas etiquetas rodean el texto y otros elementos para darles formato y significado. HTML se centra en la estructura y el contenido del documento, separando la presentación visual. Esto facilita la accesibilidad y mantenibilidad de los sitios web. HTML ha evolucionado con el tiempo, con HTML5 como su versión más reciente, introduciendo mejoras en áreas como la semántica, multimedia y accesibilidad. Es esencial para el desarrollo web moderno.

HISTORIA DE HTML

HTML, concebido por Tim Berners-Lee en la década de 1980, es el lenguaje fundamental de la web. Surgió como una forma de estructurar documentos para compartir en línea. La primera versión, HTML 1.0, se publicó en 1993. Desde entonces, ha experimentado múltiples actualizaciones y revisiones. HTML5, la versión más reciente, lanzada en 2014, introdujo numerosas características nuevas para la web moderna, como multimedia integrada, gráficos vectoriales y API avanzadas. A lo largo de los años, HTML ha sido crucial en la evolución y expansión de la web, permitiendo la creación de contenido interactivo y enriquecido que define la experiencia en línea.

copia el link: https://youtu.be/rcD69ezrjzM?si=FXkyccXmZIeA71Qm

QUE SIGNIFICA HTTP:

HTTP (Hypertext Transfer Protocol) es un protocolo de comunicación utilizado para la transferencia de datos en la World Wide Web. Define cómo los mensajes son formatados y transmitidos entre el cliente y el servidor web. Funciona en un modelo de solicitud-respuesta, donde un cliente, generalmente un navegador web, envía una solicitud a un servidor para acceder a un recurso (como una página web), y el servidor responde con el recurso solicitado. HTTP opera sobre TCP/IP y utiliza el puerto 80 por defecto. Su versión segura, HTTPS, cifra la comunicación mediante el uso de SSL/TLS, proporcionando seguridad adicional para la transferencia de datos en línea.

ETIQUETAS MAS BASICAS:

EJEMPLO DE COMO UTILIZAR LAS ETIQUETAS BASICAS

<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Título de la página</title> </head> <body> <h1>Encabezado Principal</h1> <p>Este es un párrafo de texto dentro del cuerpo de la página.</p> <a href="https://www.ejemplo.com">Enlace a Ejemplo</a> <img src="imagen.jpg" alt="Descripción de la imagen"> <ul> <li>Elemento de lista 1</li> <li>Elemento de lista 2</li> <li>Elemento de lista 3</li> </ul> </body> </html>

<html>: Define el inicio y fin del documento HTML.
<head>: Contiene metadatos del documento como título, enlaces a hojas de estilo, metadatos, entre otros.
<title>: Define el título del documento que se muestra en la barra de título del navegador.
<body>: Contiene todo el contenido visible de la página web, como texto, imágenes, enlaces, etc.
<h1> a <h6>: Define encabezados de diferentes niveles, siendo <h1> el más importante y <h6> el menos.
<p>: Define un párrafo de texto.
<a>: Define un hipervínculo, enlace o ancla.
<img>: Inserta una imagen en la página web.
<ul>: Define una lista desordenada.
<ol>: Define una lista ordenada.
<li>: Define un ítem de lista, tanto para listas ordenadas como desordenadas.
<br>: Crea un salto de línea.
<hr>: Crea una línea horizontal.
<div>: Define una sección genérica o contenedor de contenido.
<span>: Define una sección en línea genérica o contenedor de texto.
<table>: Define una tabla.
<tr>: Define una fila dentro de una tabla.
<td>: Define una celda dentro de una fila de una tabla.
<th>: Define una celda de encabezado dentro de una fila de una tabla.
<form>: Define un formulario para recopilar datos del usuario.
<input>: Define un campo de entrada en un formulario, como texto, contraseña, botón de opción, etc.
<textarea>: Define un área de texto multilinea en un formulario.
<button>: Define un botón en un formulario.
<label>: Define una etiqueta para un elemento de formulario.
<select>: Define una lista desplegable en un formulario.
<option>: Define una opción en una lista desplegable.
<iframe>: Inserta un marco en la página para mostrar contenido de otra fuente.
<audio>: Inserta contenido de audio en la página.
<video>: Inserta contenido de video en la página.
<footer>: Define el pie de página de la página web.

Estas son algunas de las etiquetas HTML más comunes y útiles, pero hay muchas más disponibles para diferentes propósitos y usos específicos en la creación de páginas web.

<header>: Define el encabezado de una sección o de todo el documento.
<nav>: Define una sección de navegación.
<article>: Define un contenido independiente y autónomo, como un artículo o una publicación de blog.
<aside>: Define un contenido relacionado pero independiente del contenido principal, como una barra lateral.
<section>: Define una sección de contenido dentro de un documento.
<main>: Define el contenido principal de un documento.
<figure>: Define contenido multimedia, como imágenes, videos o gráficos, junto con una leyenda.
<figcaption>: Define la leyenda de una figura.
<cite>: Define el título de una obra citada.
<blockquote>: Define una sección de texto citado de otra fuente.
<abbr>: Define una abreviatura o acrónimo.
<address>: Define la información de contacto del autor de la página o del propietario del sitio.
<time>: Define una fecha o una hora.
<meta>: Define metadatos que proporcionan información sobre el documento.
<map>: Define un mapa de imágenes para vincular áreas específicas de una imagen a diferentes destinos.
<area>: Define un área dentro de un mapa de imágenes.
<embed>: Inserta contenido multimedia externo, como audio o video, en un documento.
<source>: Define múltiples recursos multimedia para su uso con elementos <audio> y <video>.
<track>: Define pistas de texto para su uso con elementos <audio> y <video>.
<datalist>: Define una lista de opciones predefinidas para elementos <input> de tipo texto.
<details>: Define un widget de detalles que se puede mostrar u ocultar para mostrar información adicional.
<summary>: Define el título o resumen de un elemento <details>.
<dialog>: Define un cuadro de diálogo o ventana emergente.
<mark>: Define texto resaltado o marcado.
<meter>: Define una medida escalar dentro de un rango conocido.
<progress>: Define una barra de progreso para mostrar el avance de una tarea.
<rp>: Define texto para navegadores que no admiten la etiqueta <ruby>.
<rt>: Define la pronunciación de caracteres, palabras o frases en una anotación de ruby.
<ruby>: Define una anotación de ruby que muestra la pronunciación de caracteres en idiomas asiáticos.
<samp>: Define un texto de muestra que representa la salida de un programa de computadora.
<small>: Define texto más pequeño y de menor importancia.
<strong>: Define texto con mayor importancia semántica que el texto circundante.
<sub>: Define texto subíndice.
<sup>: Define texto superíndice.
<time>: Define una fecha o hora específica.
<var>: Define una variable en un contexto matemático o de programación.
<b>: Define texto en negrita (deprecated, se recomienda usar <strong>).
<i>: Define texto en cursiva (deprecated, se recomienda usar <em>).
<u>: Define texto subrayado (deprecated, se recomienda usar CSS).
<em>: Define texto enfatizado, generalmente mostrado en cursiva.
<cite>: Define el título de una obra citada.
<code>: Define una pieza de código.
<kbd>: Define entrada de teclado.
<dfn>: Define una definición.
<pre>: Define texto preformateado.
<q>: Define una cita corta.
<abbr>: Define una abreviatura o acrónimo.
<del>: Define texto eliminado.
<ins>: Define texto insertado.
<s>: Define texto que no es relevante o incorrecto.
<sup>: Define texto superíndice.
<sub>: Define texto subíndice.
<strong>: Define texto importante o enfático.
<small>: Define texto de menor importancia.
<mark>: Define texto resaltado.
<bdo>: Define la dirección de texto.

Buscar este blog

MI HISTORIA EN EL COLEGIO EN LA CARRERA DE SISTEMAS INFORMATICOS

TUTORIA DE HTML

Comentarios

Publicar un comentario