TAREA: DE HERRAMIENTA WEB PARA LA CIENCIA
Y LATECNOLOGIA
TEMA: El lenguaje HTML y sus usos.
ESTUDIANTES Jacinto Troya Herrera
Tutora: Lisbeth Campins
Marzo 23 DEL 2020
1. INTRODUCCION:
1.1 HTML es el lenguaje que se emplea para el desarrollo de páginas de
internet. Está compuesto por una serie de etiquetas que el navegador
interpreta y da forma en la pantalla. HTML dispone de etiquetas para
imágenes, hipervínculos que nos permiten dirigirnos a otras páginas,
saltos de línea, listas, tablas, etc.
1.2 ALGO DE HISTORIA DE HTML.
Nació públicamente en un documento llamado HTML Tags (Etiquetas
HTML), publicado por primera vez en Internet por Tim Berners-Lee en
1991. En esta publicación se describen 22 etiquetas que mostraban
un diseño inicial y relativamente simple de HTML. Varios de estos
elementos se conservan en la actualidad. Otros se han dejado de
usar, y muchos otros se han ido añadiendo con el paso de los años.
De esta manera, podemos hablar de que han existido distintas
versiones de HTML a lo largo de la historia de internet. Nosotros
vamos a trabajar con el HTML estándar actual, que es el utilizado por
los navegadores y páginas web de hoy en día. Sin embargo, no
vamos a prestarle atención a las versiones y especificidades de cada
versión, ya que el objetivo de este curso es aprender los fundamentos
de HTML y entender cómo funciona, no conocer la sintaxis o
especificidades de una versión concreta. ¿Por qué no le damos
importancia a la versión? Porque una persona que cuenta con los
fundamentos y comprensión básica sobre el lenguaje es capaz de
adaptarse a las características particulares de una versión sin
problema. En cambio, centrarse en los detalles de una versión sin
conocer los fundamentos hará que no tengamos capacidad para
comprender lo que hacemos ni para adaptarnos a los continuos
cambios que tienen lugar en el ámbito de los desarrollos web.
2. Definición: Un documento HTML es un archivo de texto que tienen la
extensión .html o .htm, este tipo de archivo se puede abrir con un editor
de textos para editar el código o con un navegador de Internet para
visualizar la página resultado del código HTML escrito.
3. Características.
 Puede ser creado y editado con cualquier editor básico de
textos.
 Es multiplataforma, o sea, puede ser visualizado por cualquier
navegador de cualquier sistema operativo.
 No diferencia entre mayúsculas y minúsculas.
 Utiliza etiquetas o marcas, que consisten en breves
instrucciones de comienzo y final, mediante las cuales se
determina la forma en la que debe aparecer en su navegador el
texto así como también las imágenes y demás elementos en la
pantalla del ordenador.
 Cada elemento de un documento HTML consta de una etiqueta
de comienzo, un bloque de texto y una etiqueta de fin.
 Lenguaje estático.
 Es utilizado para la creación de páginas web.
 Los documentos HTML son documentos de hipertexto que
aparecen enlazando a otros documentos.
 Es un estándar reconocido por todo el mundo y cuyas normas
define un organismo sin ánimo de lucro llamado World Wide
Web Consortium, más conocido como W3C.
4. HTML es un lenguaje de marcado que se utiliza para el desarrollo de
páginas de Internet. Se trata de la sigla que corresponde a HyperText
Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que
podría ser traducido como Lenguaje de Formato de Documentos para
Hipertexto. El Lenguaje de Marcado de Hipertexto (HTML) es el código
que se utiliza para estructurar y desplegar una página web y sus
contenidos. Por ejemplo, sus contenidos podrían ser párrafos, una lista
con viñetas, o imágenes y tablas de datos
HTML Se trata de un formato abierto que surgió a partir de las etiquetas SGML
(Standard Generalized Markup Language). Concepto traducido generalmente
como «Estándar de Lenguaje de Marcado Generalizado» y que se entiende
como un sistema que permite ordenar y etiquetar diversos documentos dentro de
una lista. Este lenguaje es el que se utiliza para especificar los nombres de las
etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización,
por eso se dice que es un sistema de formato abierto. EL HTML se encarga de
desarrollar una descripción sobre los contenidos que aparecen como textos y
sobre su estructura, complementando dicho texto con diversos objetos (como
fotografías, animaciones, etc).
4.1 ¿QUÉ ES Y PARA QUÉ SIRVE HTML?
HTML es el lenguaje que se emplea para el desarrollo de páginas de
internet. Está compuesto por una seríe de etiquetas que el navegador
interpreta y da forma en la pantalla. HTML dispone de etiquetas para
imágenes, hipervínculos que nos permiten dirigirnos a otras páginas,
saltos de línea, listas, tablas, etc.
Podríamos decir que HTML sirve para crear páginas web, darles
estructura y contenido. Un ejemplo sencillo de código HTML podría
ser:
<html>
<body>
<p>Esto es un párrafo. Bienvenidos a esta página web.</p>
</body>
</html>
Este ejemplo está formado por 3 etiquetas HTML. Como podemos observar cada
una de las etiquetas debe acabar con su homóloga de cierre. En este caso la
etiqueta <html> debe cerrarse con </html>, la etiqueta <body> con </body> y la
etiqueta <p> con </p>.
Hay muchas más etiquetas que veremos más adelante pero nos debe quedar
claro que por cada etiqueta que abramos, deberemos incluir la correspondiente
etiqueta de cierre. Así conseguiremos un código HTML bien formado y que los
navegadores puedan interpretar sin ambigüedad.
Este sencillo ejemplo mostraría por pantalla lo siguiente.
¿Qué ocurriría si una etiqueta que abramos no tiene su correspondiente cierre?
Digamos que se trataría de un código HTML mal construido, y los navegadores
esto lo pueden interpretar de distintas maneras. Quizás nos muestren la página
tal y como esperábamos sin aparente error. Quizás nos muestren una página de
error o se quede en blanco el navegador. Nuestro objetivo ha de ser siempre
construir páginas HTML bien estructuradas y sin ambiguedades, es decir, hacer
un correcto uso del lenguaje para que los navegadores puedan saber
exactamente qué es lo que pretendemos mostrar.
4.2 Cinco razones para aprender HTML y CSS
I. Puedes crear webs sencillas. Ya sea una página web personal
o para tu negocio, tener una web propia te da una presencia
online y cierto grado de profesionalidad.
II. Puedes jugar con el código de otras páginas.
III. Sirve para escribir en Internet. .
IV. Incrustar contenido de otras web.
V. Es una puerta a cosas más avanzadas.
5. LISTA DE ELEMENTOS ACTUALES
Elemento Descripción breve
EL ELEMENTO RAÍZ
<html> Contenedor principal
METADATOS DEL DOCUMENTO
<head> Sección de encabezado del documento
<title> Título del documento
<base> URI base para resolver URIs relativos
<link> Información relacional para el documento
<meta> Variable para el documento
<style> Atributos presentacionales
SECCIONES
<body> El cuerpo del documento
<article> Contenido redistribuible
<section> Define una sección
<nav> Sección de navegación
<aside> Contenido sólo ligeramente relacionado
<h1> Encabezado de nivel 1
<h2> Encabezado de nivel 2
<h3> Encabezado de nivel 3
<h4> Encabezado de nivel 4
<h5> Encabezado de nivel 5
<h6> Encabezado de nivel 6
<hgroup> Agrupa encabezados consecutivos
<header> El encabezado de una sección
<footer> El pie de una sección
<address> Información de contacto del autor
AGRUPACIÓN DE CONTENIDO
<p> Párrafo
<hr> Separador de contenido
<pre> Bloque de texto preformateado
<blockquote> Cita en forma de bloque
<ol> Lista ordenada
<ul> Lista no ordenada
<menu> Inserta una barra de menú
<li> Ítem de una lista
<dl> Lista de descripciones
<dt> Término en una lista de descripciones
<dd> Descripción en una lista de descripciones
<figure> Información autocontenida
<figcaption> Título para una figura
<main> Contenido principal de una sección
<div>
Contenedor genérico para bloques de
texto
SEMÁNTICA DE TEXTO
<a> Hypervínculo
<em> Texto con énfasis
<strong> Texto con énfasis fuerte
<small> Comentario secundario
<s>
Contenido que ya no es preciso o
relevante
<cite> Cita o referencia
<q> Cita en forma de línea
<dfn> Término definifo en el texto circundante
<abbr> Término abreviado
<ruby> Texto con anotaciones Ruby
<rt> Anotación Ruby
<rp>
Texto a ser ignorado por anotaciones
Ruby
<data> Información apta para programas
<time> Fecha y/u hora
<code> Código de computadora
<var> Instancia de una variable
<samp> Ejemplo de la salida de un programa
<kbd> Texto ingresado por el usuario
<sub> Texto en subíndice
<sup> Texto en superíndice
<i> Texto desplazado de la prosa normal
<b>
Texto desplazado del contenido
circundante
<u> Anotaciones no textuales
<mark> Marca texto en otro documento
<bdi> Aisla texto para el formateo bidireccional
<bdo> Anula el algoritmo bidireccional
<span> Contenedor genérico para líneas de texto
<br> Quiebre de línea
<wbr> Oportunidad de quiebre de línea
EDICIÓN
<ins> Texto agregado
<del> Texto eliminado
CONTENIDO INCRUSTADO
<picture> Imagen con mútiples orígenes
<source> Recurso de medios alternativo
<img> Imagen
<iframe> Contexto de navegación anidado
<embed> Inserta aplicaciones externas
<object> Inserta aplicaciones externas
<param> Parámetro para una aplicación externa
<video> Video
<audio> Audio
<track> Pista de texto para videos
<map> Mapa de imagen del lado cliente
<area> Sector en un mapa de imagen
INFORMACIÓN TABULADA
<table> Tabla
<caption> El título de una tabla
<colgroup> Groupo de columnas
<col> Establece atributos para columnas
<tbody> Cuerpo de la tabla
<thead> Encabezado de la tabla
<tfoot> Pie de la tabla
<tr> Fila
<td> Celda común
<th> Celda de encabezado
FORMULARIOS
<form> Formulario
<label> Etiqueta de un control
<input> Control de entrada
<button> Botón
<select> Lista de opciones
<datalist> Sugerencias para los controles
<optgroup> Grupo de opciones en una lista
<option> Una opción en una lista
<textarea> Campo de texto multilínea
<output> La salida de un proceso
<progress> El progreso de una tarea
<meter> Una medida
<fieldset> Grupo de controles
<legend> El título de un grupo de controles
ELEMENTOS INTERACTIVOS
<details> Contenido desplegable
<summary> Un resumen del contenido desplegable
<dialog> Cuadro de diálogo
PROGRAMAS
<script> Incrusta programas
<noscript> Contenido alternativo para programas
<template> Plantilla para contenido a ser agregado
<slot>
Espacio en componentes para insertar
contenido
<canvas> Contenedor para gráficos dinámicos
6. Fuente bibliográfica.
https://www.google.com/search?q=caracteristica+de+html&oq=caracteristica+de+html&aqs=ch
rome..69i57.14132j0j7&sourceid=chrome&ie=UTF-8
https://www.htmlquick.com/es/reference/tags.html
http://historiademihtml.blogspot.com/p/caracteristicas.html

Tarea

  • 1.
    TAREA: DE HERRAMIENTAWEB PARA LA CIENCIA Y LATECNOLOGIA TEMA: El lenguaje HTML y sus usos. ESTUDIANTES Jacinto Troya Herrera Tutora: Lisbeth Campins Marzo 23 DEL 2020
  • 2.
    1. INTRODUCCION: 1.1 HTMLes el lenguaje que se emplea para el desarrollo de páginas de internet. Está compuesto por una serie de etiquetas que el navegador interpreta y da forma en la pantalla. HTML dispone de etiquetas para imágenes, hipervínculos que nos permiten dirigirnos a otras páginas, saltos de línea, listas, tablas, etc. 1.2 ALGO DE HISTORIA DE HTML. Nació públicamente en un documento llamado HTML Tags (Etiquetas HTML), publicado por primera vez en Internet por Tim Berners-Lee en 1991. En esta publicación se describen 22 etiquetas que mostraban un diseño inicial y relativamente simple de HTML. Varios de estos elementos se conservan en la actualidad. Otros se han dejado de usar, y muchos otros se han ido añadiendo con el paso de los años. De esta manera, podemos hablar de que han existido distintas versiones de HTML a lo largo de la historia de internet. Nosotros vamos a trabajar con el HTML estándar actual, que es el utilizado por los navegadores y páginas web de hoy en día. Sin embargo, no vamos a prestarle atención a las versiones y especificidades de cada versión, ya que el objetivo de este curso es aprender los fundamentos de HTML y entender cómo funciona, no conocer la sintaxis o especificidades de una versión concreta. ¿Por qué no le damos importancia a la versión? Porque una persona que cuenta con los fundamentos y comprensión básica sobre el lenguaje es capaz de adaptarse a las características particulares de una versión sin problema. En cambio, centrarse en los detalles de una versión sin conocer los fundamentos hará que no tengamos capacidad para comprender lo que hacemos ni para adaptarnos a los continuos cambios que tienen lugar en el ámbito de los desarrollos web. 2. Definición: Un documento HTML es un archivo de texto que tienen la extensión .html o .htm, este tipo de archivo se puede abrir con un editor de textos para editar el código o con un navegador de Internet para visualizar la página resultado del código HTML escrito. 3. Características.  Puede ser creado y editado con cualquier editor básico de textos.  Es multiplataforma, o sea, puede ser visualizado por cualquier navegador de cualquier sistema operativo.  No diferencia entre mayúsculas y minúsculas.  Utiliza etiquetas o marcas, que consisten en breves instrucciones de comienzo y final, mediante las cuales se determina la forma en la que debe aparecer en su navegador el texto así como también las imágenes y demás elementos en la pantalla del ordenador.
  • 3.
     Cada elementode un documento HTML consta de una etiqueta de comienzo, un bloque de texto y una etiqueta de fin.  Lenguaje estático.  Es utilizado para la creación de páginas web.  Los documentos HTML son documentos de hipertexto que aparecen enlazando a otros documentos.  Es un estándar reconocido por todo el mundo y cuyas normas define un organismo sin ánimo de lucro llamado World Wide Web Consortium, más conocido como W3C. 4. HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto. El Lenguaje de Marcado de Hipertexto (HTML) es el código que se utiliza para estructurar y desplegar una página web y sus contenidos. Por ejemplo, sus contenidos podrían ser párrafos, una lista con viñetas, o imágenes y tablas de datos HTML Se trata de un formato abierto que surgió a partir de las etiquetas SGML (Standard Generalized Markup Language). Concepto traducido generalmente como «Estándar de Lenguaje de Marcado Generalizado» y que se entiende como un sistema que permite ordenar y etiquetar diversos documentos dentro de una lista. Este lenguaje es el que se utiliza para especificar los nombres de las etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización, por eso se dice que es un sistema de formato abierto. EL HTML se encarga de desarrollar una descripción sobre los contenidos que aparecen como textos y sobre su estructura, complementando dicho texto con diversos objetos (como fotografías, animaciones, etc). 4.1 ¿QUÉ ES Y PARA QUÉ SIRVE HTML? HTML es el lenguaje que se emplea para el desarrollo de páginas de internet. Está compuesto por una seríe de etiquetas que el navegador interpreta y da forma en la pantalla. HTML dispone de etiquetas para imágenes, hipervínculos que nos permiten dirigirnos a otras páginas, saltos de línea, listas, tablas, etc. Podríamos decir que HTML sirve para crear páginas web, darles estructura y contenido. Un ejemplo sencillo de código HTML podría ser: <html> <body> <p>Esto es un párrafo. Bienvenidos a esta página web.</p> </body> </html>
  • 4.
    Este ejemplo estáformado por 3 etiquetas HTML. Como podemos observar cada una de las etiquetas debe acabar con su homóloga de cierre. En este caso la etiqueta <html> debe cerrarse con </html>, la etiqueta <body> con </body> y la etiqueta <p> con </p>. Hay muchas más etiquetas que veremos más adelante pero nos debe quedar claro que por cada etiqueta que abramos, deberemos incluir la correspondiente etiqueta de cierre. Así conseguiremos un código HTML bien formado y que los navegadores puedan interpretar sin ambigüedad. Este sencillo ejemplo mostraría por pantalla lo siguiente. ¿Qué ocurriría si una etiqueta que abramos no tiene su correspondiente cierre? Digamos que se trataría de un código HTML mal construido, y los navegadores esto lo pueden interpretar de distintas maneras. Quizás nos muestren la página tal y como esperábamos sin aparente error. Quizás nos muestren una página de error o se quede en blanco el navegador. Nuestro objetivo ha de ser siempre construir páginas HTML bien estructuradas y sin ambiguedades, es decir, hacer un correcto uso del lenguaje para que los navegadores puedan saber exactamente qué es lo que pretendemos mostrar. 4.2 Cinco razones para aprender HTML y CSS I. Puedes crear webs sencillas. Ya sea una página web personal o para tu negocio, tener una web propia te da una presencia online y cierto grado de profesionalidad. II. Puedes jugar con el código de otras páginas. III. Sirve para escribir en Internet. . IV. Incrustar contenido de otras web. V. Es una puerta a cosas más avanzadas.
  • 5.
    5. LISTA DEELEMENTOS ACTUALES Elemento Descripción breve EL ELEMENTO RAÍZ <html> Contenedor principal METADATOS DEL DOCUMENTO <head> Sección de encabezado del documento <title> Título del documento <base> URI base para resolver URIs relativos <link> Información relacional para el documento <meta> Variable para el documento <style> Atributos presentacionales SECCIONES <body> El cuerpo del documento <article> Contenido redistribuible <section> Define una sección <nav> Sección de navegación <aside> Contenido sólo ligeramente relacionado <h1> Encabezado de nivel 1 <h2> Encabezado de nivel 2 <h3> Encabezado de nivel 3 <h4> Encabezado de nivel 4 <h5> Encabezado de nivel 5 <h6> Encabezado de nivel 6 <hgroup> Agrupa encabezados consecutivos <header> El encabezado de una sección <footer> El pie de una sección <address> Información de contacto del autor
  • 6.
    AGRUPACIÓN DE CONTENIDO <p>Párrafo <hr> Separador de contenido <pre> Bloque de texto preformateado <blockquote> Cita en forma de bloque <ol> Lista ordenada <ul> Lista no ordenada <menu> Inserta una barra de menú <li> Ítem de una lista <dl> Lista de descripciones <dt> Término en una lista de descripciones <dd> Descripción en una lista de descripciones <figure> Información autocontenida <figcaption> Título para una figura <main> Contenido principal de una sección <div> Contenedor genérico para bloques de texto SEMÁNTICA DE TEXTO <a> Hypervínculo <em> Texto con énfasis <strong> Texto con énfasis fuerte <small> Comentario secundario <s> Contenido que ya no es preciso o relevante <cite> Cita o referencia <q> Cita en forma de línea <dfn> Término definifo en el texto circundante <abbr> Término abreviado <ruby> Texto con anotaciones Ruby <rt> Anotación Ruby
  • 7.
    <rp> Texto a serignorado por anotaciones Ruby <data> Información apta para programas <time> Fecha y/u hora <code> Código de computadora <var> Instancia de una variable <samp> Ejemplo de la salida de un programa <kbd> Texto ingresado por el usuario <sub> Texto en subíndice <sup> Texto en superíndice <i> Texto desplazado de la prosa normal <b> Texto desplazado del contenido circundante <u> Anotaciones no textuales <mark> Marca texto en otro documento <bdi> Aisla texto para el formateo bidireccional <bdo> Anula el algoritmo bidireccional <span> Contenedor genérico para líneas de texto <br> Quiebre de línea <wbr> Oportunidad de quiebre de línea EDICIÓN <ins> Texto agregado <del> Texto eliminado CONTENIDO INCRUSTADO <picture> Imagen con mútiples orígenes <source> Recurso de medios alternativo <img> Imagen <iframe> Contexto de navegación anidado <embed> Inserta aplicaciones externas <object> Inserta aplicaciones externas
  • 8.
    <param> Parámetro parauna aplicación externa <video> Video <audio> Audio <track> Pista de texto para videos <map> Mapa de imagen del lado cliente <area> Sector en un mapa de imagen INFORMACIÓN TABULADA <table> Tabla <caption> El título de una tabla <colgroup> Groupo de columnas <col> Establece atributos para columnas <tbody> Cuerpo de la tabla <thead> Encabezado de la tabla <tfoot> Pie de la tabla <tr> Fila <td> Celda común <th> Celda de encabezado FORMULARIOS <form> Formulario <label> Etiqueta de un control <input> Control de entrada <button> Botón <select> Lista de opciones <datalist> Sugerencias para los controles <optgroup> Grupo de opciones en una lista <option> Una opción en una lista <textarea> Campo de texto multilínea <output> La salida de un proceso <progress> El progreso de una tarea
  • 9.
    <meter> Una medida <fieldset>Grupo de controles <legend> El título de un grupo de controles ELEMENTOS INTERACTIVOS <details> Contenido desplegable <summary> Un resumen del contenido desplegable <dialog> Cuadro de diálogo PROGRAMAS <script> Incrusta programas <noscript> Contenido alternativo para programas <template> Plantilla para contenido a ser agregado <slot> Espacio en componentes para insertar contenido <canvas> Contenedor para gráficos dinámicos 6. Fuente bibliográfica. https://www.google.com/search?q=caracteristica+de+html&oq=caracteristica+de+html&aqs=ch rome..69i57.14132j0j7&sourceid=chrome&ie=UTF-8 https://www.htmlquick.com/es/reference/tags.html http://historiademihtml.blogspot.com/p/caracteristicas.html