SlideShare una empresa de Scribd logo
1 de 17
SALIDA CIENCIA & TECNOLOGÍA
PROYECTO
DESARROLLO WEB Y APLICACIONES MÓVILES
6TO. GRADO
CENTRO EDUCATIVO DEL NIVEL SECUNDARIO
MADRE TERESA DE CALCUTA
AÑO ESCOLAR 2019-2020
PROFESOR: ADÁN EDISON UREÑA ALMONTE M.A.
HTML
HYPERTEXT MARKUP LANGUAGE
LENGUAJE DE MARCAS HIPERTEXTO
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.
HISTORIA DE HTML
Este lenguaje fue desarrollado por la Organización Europea de
Investigación Nuclear (CERN) en el año 1945 con la finalidad de desarrollar
un sistema de almacenamiento donde las cosas no se perdieran, que
pudieran ser conectadas a través de hipervínculos. Primeramente crearon
un dispositivo llamado «memex», el cual era considerado como un
suplemento para la memoria.
Posteriormente, Douglas Engelbart, diseñó un entorno de trabajo por
computadora que recibiría el nombre de oNLine System que poseía un
catálogo para facilitar la tarea de búsqueda dentro de un mismo organismo.
HISTORIA DE HTML
Recién en 1965, Ted Nelson acuñó el término hipervínculo, ideando una
estructura que se encontraba conectada de forma electrónica y que más
tarde permitiría la creación de la World Wide Web (1989), un sistema de
hipertexto a través del cual era posible compartir una variada información
sirviéndose de Internet (servía para la comunicación entre investigadores
nucleares que formaran parte del CERN).
El norteamericano Tim Berners-Lee fue el primero en proponer una
descripción de HTML en un documento que publicó en 1991. Allí describía
veintidós componentes que suponen el diseño más básico y simple del
HTML.
HISTORIA DE HTML
El tipo de codificación que se utilizó para el desarrollo de este sistema de
hipervínculos debía ser comprendido, tanto por ordenadores tontos como
por mega-estaciones, por eso fue necesario crear uno absolutamente
simples, tanto en lo que respectaba al lenguaje de intercambio (HTML),
como el que hacía referencia al protocolo de red (HTTP).
HTML
HYPERTEXT MARKUP LANGUAGE
LENGUAJE DE MARCAS HIPERTEXTO
Es el lenguaje de marcas hipertexto, con el que se realiza la creación básica
de páginas web.
HTML es un lenguaje de marcación que sirve para definir el contenido de las
páginas web. Se compone en base a etiquetas, también llamadas marcas o
tags, con las cuales conseguimos expresar las partes de un documento,
cabecera, cuerpo, encabezados, párrafos, etc. En definitiva, el contenido de
una página web.
HTML
HTML es el primer lenguaje que debe aprender cualquier persona interesada
en construir un sitio web. A partir del HTML podemos pasar a muchos otros
lenguajes interesantes que sirven para hacer cosas diversas y más
avanzadas. Es decir, sea cual sea la tecnología, herramienta o gestor de
contenido que nos hayamos propuesto aprender, o que tengamos que usar
en nuestro día a día, HTML siempre será el lenguaje en el que toda web se
construye y, por tanto, es de obligado conocimiento para todos.
Aprender HTML es sencillo. En pocos días o semanas serás capaz de
entender y usar las etiquetas más comunes y componer documentos HTML
(páginas web) correctas.
CON HTML SE EXPRESA EL CONTENIDO
A la hora de aprender HTML es importante observar que sirve para expresar
el contenido (el qué) y nunca la presentación (el cómo). Es decir, con HTML
podemos colocar párrafos, listas, secciones, enlaces, imágenes, todo aquello
que forma parte del contenido que va a tener una página web.
Para definir la presentación se usa un lenguaje complementario,
llamado CSS. Además, para definir la funcionalidad en el ámbito de la web se
usa el lenguaje Javascript.
HTML EN EL MOMENTO DE CREARSE
Sin embargo, esto no siempre ha sido así. En el momento de crearse el
lenguaje HTML sí que existían etiquetas que permitían cambiar el estilo o
presentación de la página, tales como <font> que sirve para cambiar el color
del texto o su tamaño. Todas estas etiquetas se han ido retirando del
lenguaje a medida que se presentaban nuevas versiones, aunque por
motivos de compatibilidad hacia atrás los navegadores siguen
soportándolas.
También existen atributos pensados para cambiar la forma como la que esa
etiqueta se representa, como el atributo "align", que permite cosas como
centrar el texto del contenido de un párrafo, por ejemplo. Sin embargo,
aunque existan etiquetas o atributos que sirvan para cambiar el formato o
estilo de los elementos, no es una buena idea utilizarlos.
HTML
SEPARACIÓN ENTRE
CONTENIDOY PRESENTACIÓN
Gracias a la separación entre contenido y presentación, que conseguimos
usando lenguajes separados para cada cosa, se obtienen múltiples
beneficios.
El más importante es que, para un mismo HTML podemos aplicar diversos
tipos de presentación, solo cambiando el código CSS. De este modo, si en
algún momento se decide cambiar el estilo de una página, se puede hacer
simplemente alterando su código CSS y sin necesidad de cambiar el HTML.
Se deduce también de aquí que, para desarrollar una página web, no solo se
trata de aprender HTML, sino que será necesario también aprender CSS, un
lenguaje imprescindible para poder aplicar el formato deseado a nuestro
contenido.
ETIQUETAS EN HTML
La etiqueta es el elemento básico del código HTML. Es un bloque de
contenido que puede tener naturaleza diversa, desde un párrafo a una
imagen o un vídeo, por ejemplo.
Las etiquetas se engloban entre signos menor y mayor que y tienen un inicio
y un cierre. Dentro de estos signos mayor y menor que se coloca el nombre
de la etiqueta. Por ejemplo:
<p>Esto es un párrafo.</p>
La anterior etiqueta <p> sirve para indicar el inicio de un párrafo. Dentro
figura su contenido y finalmente tenemos la etiqueta de cierre del párrafo
</p>.
ESTRUCTURA DE UN DOCUMENTO
EN HTML
Un documento HTML, una página web, contiene un árbol de etiquetas, que
tiene una organización básica. La etiqueta raíz de un documento HTML es
<html> y dentro tiene dos etiquetas principales:
<head>: con la información de cabecera de la página. Es información que en
principio no aparecerá en el cuerpo de la página, pero que sirve para saber de
qué trata la página, cómo deben interpretarla los distintos clientes web, etc.
<body>: que es la información del cuerpo, es decir, lo que se verá en el
navegador cuando el usuario entre.
ETIQUETAS BÁSICAS DE CONTROL
EN HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Título del documento HTML</title>
</head>
<body>
</body>
</html>
ETIQUETAS BÁSICAS DE CONTROL
EN HTML
La primera etiqueta (DOCTYPE) indica el tipo de documento. Esta etiqueta
debe estar siempre al principio. Fue definido y simplificado así desde HTML
5, ya que antes el doctype se expresaba con una etiqueta mucho mayor.
Posteriormente tenemos la etiqueta <html>, con el atributo "lang" opcional.
En este caso hemos indicado que el idioma es español.
ETIQUETAS BÁSICAS DE CONTROL
EN HTML
Luego encontramos el <head>, que tiene varias etiquetas. Las importantes
son:
charset, siendo UTF-8 el recomendado. Lógicamente es importante que ese
juego de caracteres se esté usando realmente al guardar el archivo con el
código .html. Si usamos algún editor orientado a programadores
seguramente se guarde con UTF-8 o al menos tengas la opción de escoger
este juego de carácteres.
Title, que es lo que mostrará el navegador en la pestaña donde se muestre
esta página. También es muy importante para que Google y otros motores
identifiquen bien el contenido.
ETIQUETAS BÁSICAS DE CONTROL
EN HTML
Hay otras etiquetas en el <head> que son realmente aconsejables. El caso
más claro es el del viewport. También es el lugar correcto para importar
estilos CSS, por ejemplo.
Para acabar, el <body> contendrá la mayor parte de las etiquetas, con todo
el marcado necesario para definir el contenido completo que se verá en la
página.
FUENTE BIBLIOGRÁFICA:
https://desarrolloweb.com/home/html
Autores: Julián Pérez Porto y Ana Gardey. Publicado: 2008. Actualizado:
2012.
Definición de: Definición de html (https://definicion.de/html/)

Más contenido relacionado

La actualidad más candente (18)

Html
HtmlHtml
Html
 
Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
 
Html y xml carlos lita
Html y xml   carlos litaHtml y xml   carlos lita
Html y xml carlos lita
 
Html4
Html4Html4
Html4
 
Deber d programacion 1
Deber d programacion 1Deber d programacion 1
Deber d programacion 1
 
DIAPOSITIVAS HTLM Y HTML 5
DIAPOSITIVAS HTLM Y HTML 5DIAPOSITIVAS HTLM Y HTML 5
DIAPOSITIVAS HTLM Y HTML 5
 
Clase 1
Clase 1Clase 1
Clase 1
 
Guia 01 html
Guia 01 htmlGuia 01 html
Guia 01 html
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
 
Apuntes de HTML 1
Apuntes de HTML 1Apuntes de HTML 1
Apuntes de HTML 1
 
Qué es el html
Qué es el htmlQué es el html
Qué es el html
 
Html
HtmlHtml
Html
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
HTML
HTMLHTML
HTML
 
breve historia de html
breve historia de htmlbreve historia de html
breve historia de html
 
Guia#1 info
Guia#1 infoGuia#1 info
Guia#1 info
 
Html
HtmlHtml
Html
 
Htlm
HtlmHtlm
Htlm
 

Similar a Lenguaje HTML (20)

Desarrolla aplicaciones-web
Desarrolla aplicaciones-webDesarrolla aplicaciones-web
Desarrolla aplicaciones-web
 
Html tarea
Html tareaHtml tarea
Html tarea
 
Códigos HTML.pptx Sede magdalena ortega de nariño
Códigos HTML.pptx Sede magdalena ortega de nariñoCódigos HTML.pptx Sede magdalena ortega de nariño
Códigos HTML.pptx Sede magdalena ortega de nariño
 
Html
HtmlHtml
Html
 
Estructurabasica
EstructurabasicaEstructurabasica
Estructurabasica
 
programamcion html
programamcion htmlprogramamcion html
programamcion html
 
sesion 01- HTML5
sesion 01- HTML5sesion 01- HTML5
sesion 01- HTML5
 
Tarea
TareaTarea
Tarea
 
Consulta de html
Consulta de html Consulta de html
Consulta de html
 
marlon cordon Html
marlon cordon Htmlmarlon cordon Html
marlon cordon Html
 
Lenguajes de programacion
Lenguajes de programacionLenguajes de programacion
Lenguajes de programacion
 
Presentacion de html
Presentacion de htmlPresentacion de html
Presentacion de html
 
Curso de html
Curso de htmlCurso de html
Curso de html
 
Presentacion de html
Presentacion de htmlPresentacion de html
Presentacion de html
 
Aspectos Importantes del lenguaje html
Aspectos Importantes del lenguaje htmlAspectos Importantes del lenguaje html
Aspectos Importantes del lenguaje html
 
Tarea
TareaTarea
Tarea
 
Evelyn deber
Evelyn deberEvelyn deber
Evelyn deber
 
Taller 1 raul guaranda
Taller 1 raul guarandaTaller 1 raul guaranda
Taller 1 raul guaranda
 
Definición de html
Definición de htmlDefinición de html
Definición de html
 
Definición de html
Definición de htmlDefinición de html
Definición de html
 

Más de Adan Edison Ureña Almonte

Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...
Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...
Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...Adan Edison Ureña Almonte
 
Bloque iii actividad 1 distingue concepto de plataforma y evea
Bloque iii actividad 1 distingue concepto de plataforma y eveaBloque iii actividad 1 distingue concepto de plataforma y evea
Bloque iii actividad 1 distingue concepto de plataforma y eveaAdan Edison Ureña Almonte
 
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...Adan Edison Ureña Almonte
 
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidades
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidadesBloque ii actividad 1 describe el concepto de e-learning y sus posibilidades
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidadesAdan Edison Ureña Almonte
 
E-mail o Correo Electronico (Practica Docente)
E-mail o Correo Electronico (Practica Docente)E-mail o Correo Electronico (Practica Docente)
E-mail o Correo Electronico (Practica Docente)Adan Edison Ureña Almonte
 

Más de Adan Edison Ureña Almonte (8)

Internet Sano Y Seguro 2020 Padres
Internet Sano Y Seguro 2020 PadresInternet Sano Y Seguro 2020 Padres
Internet Sano Y Seguro 2020 Padres
 
Internet Sano Y Seguro 2020
Internet Sano Y Seguro 2020Internet Sano Y Seguro 2020
Internet Sano Y Seguro 2020
 
Proyecto Ingenieria de Robótica
Proyecto Ingenieria de RobóticaProyecto Ingenieria de Robótica
Proyecto Ingenieria de Robótica
 
Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...
Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...
Bloque iii actividad 2 construye lista de indicadores que permitan medir una ...
 
Bloque iii actividad 1 distingue concepto de plataforma y evea
Bloque iii actividad 1 distingue concepto de plataforma y eveaBloque iii actividad 1 distingue concepto de plataforma y evea
Bloque iii actividad 1 distingue concepto de plataforma y evea
 
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...
Bloque ii actividad 2 explica lo que les sucede a las formaciones educativas ...
 
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidades
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidadesBloque ii actividad 1 describe el concepto de e-learning y sus posibilidades
Bloque ii actividad 1 describe el concepto de e-learning y sus posibilidades
 
E-mail o Correo Electronico (Practica Docente)
E-mail o Correo Electronico (Practica Docente)E-mail o Correo Electronico (Practica Docente)
E-mail o Correo Electronico (Practica Docente)
 

Último

MAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grandeMAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grandeMarjorie Burga
 
30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdfgimenanahuel
 
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Carlos Muñoz
 
codigos HTML para blogs y paginas web Karina
codigos HTML para blogs y paginas web Karinacodigos HTML para blogs y paginas web Karina
codigos HTML para blogs y paginas web Karinavergarakarina022
 
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdf
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdfResolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdf
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdfDemetrio Ccesa Rayme
 
Informatica Generalidades - Conceptos Básicos
Informatica Generalidades - Conceptos BásicosInformatica Generalidades - Conceptos Básicos
Informatica Generalidades - Conceptos BásicosCesarFernandez937857
 
GLOSAS Y PALABRAS ACTO 2 DE ABRIL 2024.docx
GLOSAS  Y PALABRAS ACTO 2 DE ABRIL 2024.docxGLOSAS  Y PALABRAS ACTO 2 DE ABRIL 2024.docx
GLOSAS Y PALABRAS ACTO 2 DE ABRIL 2024.docxAleParedes11
 
Herramientas de Inteligencia Artificial.pdf
Herramientas de Inteligencia Artificial.pdfHerramientas de Inteligencia Artificial.pdf
Herramientas de Inteligencia Artificial.pdfMARIAPAULAMAHECHAMOR
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.amayarogel
 
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSTEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSjlorentemartos
 
Planificacion Anual 2do Grado Educacion Primaria 2024 Ccesa007.pdf
Planificacion Anual 2do Grado Educacion Primaria   2024   Ccesa007.pdfPlanificacion Anual 2do Grado Educacion Primaria   2024   Ccesa007.pdf
Planificacion Anual 2do Grado Educacion Primaria 2024 Ccesa007.pdfDemetrio Ccesa Rayme
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdfBaker Publishing Company
 
programa dia de las madres 10 de mayo para evento
programa dia de las madres 10 de mayo  para eventoprograma dia de las madres 10 de mayo  para evento
programa dia de las madres 10 de mayo para eventoDiegoMtsS
 
Planificacion Anual 4to Grado Educacion Primaria 2024 Ccesa007.pdf
Planificacion Anual 4to Grado Educacion Primaria   2024   Ccesa007.pdfPlanificacion Anual 4to Grado Educacion Primaria   2024   Ccesa007.pdf
Planificacion Anual 4to Grado Educacion Primaria 2024 Ccesa007.pdfDemetrio Ccesa Rayme
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxlclcarmen
 
EXPECTATIVAS vs PERSPECTIVA en la vida.
EXPECTATIVAS vs PERSPECTIVA  en la vida.EXPECTATIVAS vs PERSPECTIVA  en la vida.
EXPECTATIVAS vs PERSPECTIVA en la vida.DaluiMonasterio
 
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIA
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIARAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIA
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIACarlos Campaña Montenegro
 
Neurociencias para Educadores NE24 Ccesa007.pdf
Neurociencias para Educadores  NE24  Ccesa007.pdfNeurociencias para Educadores  NE24  Ccesa007.pdf
Neurociencias para Educadores NE24 Ccesa007.pdfDemetrio Ccesa Rayme
 

Último (20)

MAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grandeMAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grande
 
Sesión de clase: Defendamos la verdad.pdf
Sesión de clase: Defendamos la verdad.pdfSesión de clase: Defendamos la verdad.pdf
Sesión de clase: Defendamos la verdad.pdf
 
30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf
 
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
 
codigos HTML para blogs y paginas web Karina
codigos HTML para blogs y paginas web Karinacodigos HTML para blogs y paginas web Karina
codigos HTML para blogs y paginas web Karina
 
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdf
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdfResolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdf
Resolucion de Problemas en Educacion Inicial 5 años ED-2024 Ccesa007.pdf
 
Informatica Generalidades - Conceptos Básicos
Informatica Generalidades - Conceptos BásicosInformatica Generalidades - Conceptos Básicos
Informatica Generalidades - Conceptos Básicos
 
GLOSAS Y PALABRAS ACTO 2 DE ABRIL 2024.docx
GLOSAS  Y PALABRAS ACTO 2 DE ABRIL 2024.docxGLOSAS  Y PALABRAS ACTO 2 DE ABRIL 2024.docx
GLOSAS Y PALABRAS ACTO 2 DE ABRIL 2024.docx
 
Herramientas de Inteligencia Artificial.pdf
Herramientas de Inteligencia Artificial.pdfHerramientas de Inteligencia Artificial.pdf
Herramientas de Inteligencia Artificial.pdf
 
Defendamos la verdad. La defensa es importante.
Defendamos la verdad. La defensa es importante.Defendamos la verdad. La defensa es importante.
Defendamos la verdad. La defensa es importante.
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.
 
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSTEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
 
Planificacion Anual 2do Grado Educacion Primaria 2024 Ccesa007.pdf
Planificacion Anual 2do Grado Educacion Primaria   2024   Ccesa007.pdfPlanificacion Anual 2do Grado Educacion Primaria   2024   Ccesa007.pdf
Planificacion Anual 2do Grado Educacion Primaria 2024 Ccesa007.pdf
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf
 
programa dia de las madres 10 de mayo para evento
programa dia de las madres 10 de mayo  para eventoprograma dia de las madres 10 de mayo  para evento
programa dia de las madres 10 de mayo para evento
 
Planificacion Anual 4to Grado Educacion Primaria 2024 Ccesa007.pdf
Planificacion Anual 4to Grado Educacion Primaria   2024   Ccesa007.pdfPlanificacion Anual 4to Grado Educacion Primaria   2024   Ccesa007.pdf
Planificacion Anual 4to Grado Educacion Primaria 2024 Ccesa007.pdf
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
 
EXPECTATIVAS vs PERSPECTIVA en la vida.
EXPECTATIVAS vs PERSPECTIVA  en la vida.EXPECTATIVAS vs PERSPECTIVA  en la vida.
EXPECTATIVAS vs PERSPECTIVA en la vida.
 
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIA
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIARAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIA
RAIZ CUADRADA Y CUBICA PARA NIÑOS DE PRIMARIA
 
Neurociencias para Educadores NE24 Ccesa007.pdf
Neurociencias para Educadores  NE24  Ccesa007.pdfNeurociencias para Educadores  NE24  Ccesa007.pdf
Neurociencias para Educadores NE24 Ccesa007.pdf
 

Lenguaje HTML

  • 1. SALIDA CIENCIA & TECNOLOGÍA PROYECTO DESARROLLO WEB Y APLICACIONES MÓVILES 6TO. GRADO CENTRO EDUCATIVO DEL NIVEL SECUNDARIO MADRE TERESA DE CALCUTA AÑO ESCOLAR 2019-2020 PROFESOR: ADÁN EDISON UREÑA ALMONTE M.A.
  • 2. HTML HYPERTEXT MARKUP LANGUAGE LENGUAJE DE MARCAS HIPERTEXTO 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.
  • 3. HISTORIA DE HTML Este lenguaje fue desarrollado por la Organización Europea de Investigación Nuclear (CERN) en el año 1945 con la finalidad de desarrollar un sistema de almacenamiento donde las cosas no se perdieran, que pudieran ser conectadas a través de hipervínculos. Primeramente crearon un dispositivo llamado «memex», el cual era considerado como un suplemento para la memoria. Posteriormente, Douglas Engelbart, diseñó un entorno de trabajo por computadora que recibiría el nombre de oNLine System que poseía un catálogo para facilitar la tarea de búsqueda dentro de un mismo organismo.
  • 4. HISTORIA DE HTML Recién en 1965, Ted Nelson acuñó el término hipervínculo, ideando una estructura que se encontraba conectada de forma electrónica y que más tarde permitiría la creación de la World Wide Web (1989), un sistema de hipertexto a través del cual era posible compartir una variada información sirviéndose de Internet (servía para la comunicación entre investigadores nucleares que formaran parte del CERN). El norteamericano Tim Berners-Lee fue el primero en proponer una descripción de HTML en un documento que publicó en 1991. Allí describía veintidós componentes que suponen el diseño más básico y simple del HTML.
  • 5. HISTORIA DE HTML El tipo de codificación que se utilizó para el desarrollo de este sistema de hipervínculos debía ser comprendido, tanto por ordenadores tontos como por mega-estaciones, por eso fue necesario crear uno absolutamente simples, tanto en lo que respectaba al lenguaje de intercambio (HTML), como el que hacía referencia al protocolo de red (HTTP).
  • 6. HTML HYPERTEXT MARKUP LANGUAGE LENGUAJE DE MARCAS HIPERTEXTO Es el lenguaje de marcas hipertexto, con el que se realiza la creación básica de páginas web. HTML es un lenguaje de marcación que sirve para definir el contenido de las páginas web. Se compone en base a etiquetas, también llamadas marcas o tags, con las cuales conseguimos expresar las partes de un documento, cabecera, cuerpo, encabezados, párrafos, etc. En definitiva, el contenido de una página web.
  • 7. HTML HTML es el primer lenguaje que debe aprender cualquier persona interesada en construir un sitio web. A partir del HTML podemos pasar a muchos otros lenguajes interesantes que sirven para hacer cosas diversas y más avanzadas. Es decir, sea cual sea la tecnología, herramienta o gestor de contenido que nos hayamos propuesto aprender, o que tengamos que usar en nuestro día a día, HTML siempre será el lenguaje en el que toda web se construye y, por tanto, es de obligado conocimiento para todos. Aprender HTML es sencillo. En pocos días o semanas serás capaz de entender y usar las etiquetas más comunes y componer documentos HTML (páginas web) correctas.
  • 8. CON HTML SE EXPRESA EL CONTENIDO A la hora de aprender HTML es importante observar que sirve para expresar el contenido (el qué) y nunca la presentación (el cómo). Es decir, con HTML podemos colocar párrafos, listas, secciones, enlaces, imágenes, todo aquello que forma parte del contenido que va a tener una página web. Para definir la presentación se usa un lenguaje complementario, llamado CSS. Además, para definir la funcionalidad en el ámbito de la web se usa el lenguaje Javascript.
  • 9. HTML EN EL MOMENTO DE CREARSE Sin embargo, esto no siempre ha sido así. En el momento de crearse el lenguaje HTML sí que existían etiquetas que permitían cambiar el estilo o presentación de la página, tales como <font> que sirve para cambiar el color del texto o su tamaño. Todas estas etiquetas se han ido retirando del lenguaje a medida que se presentaban nuevas versiones, aunque por motivos de compatibilidad hacia atrás los navegadores siguen soportándolas. También existen atributos pensados para cambiar la forma como la que esa etiqueta se representa, como el atributo "align", que permite cosas como centrar el texto del contenido de un párrafo, por ejemplo. Sin embargo, aunque existan etiquetas o atributos que sirvan para cambiar el formato o estilo de los elementos, no es una buena idea utilizarlos.
  • 10. HTML SEPARACIÓN ENTRE CONTENIDOY PRESENTACIÓN Gracias a la separación entre contenido y presentación, que conseguimos usando lenguajes separados para cada cosa, se obtienen múltiples beneficios. El más importante es que, para un mismo HTML podemos aplicar diversos tipos de presentación, solo cambiando el código CSS. De este modo, si en algún momento se decide cambiar el estilo de una página, se puede hacer simplemente alterando su código CSS y sin necesidad de cambiar el HTML. Se deduce también de aquí que, para desarrollar una página web, no solo se trata de aprender HTML, sino que será necesario también aprender CSS, un lenguaje imprescindible para poder aplicar el formato deseado a nuestro contenido.
  • 11. ETIQUETAS EN HTML La etiqueta es el elemento básico del código HTML. Es un bloque de contenido que puede tener naturaleza diversa, desde un párrafo a una imagen o un vídeo, por ejemplo. Las etiquetas se engloban entre signos menor y mayor que y tienen un inicio y un cierre. Dentro de estos signos mayor y menor que se coloca el nombre de la etiqueta. Por ejemplo: <p>Esto es un párrafo.</p> La anterior etiqueta <p> sirve para indicar el inicio de un párrafo. Dentro figura su contenido y finalmente tenemos la etiqueta de cierre del párrafo </p>.
  • 12. ESTRUCTURA DE UN DOCUMENTO EN HTML Un documento HTML, una página web, contiene un árbol de etiquetas, que tiene una organización básica. La etiqueta raíz de un documento HTML es <html> y dentro tiene dos etiquetas principales: <head>: con la información de cabecera de la página. Es información que en principio no aparecerá en el cuerpo de la página, pero que sirve para saber de qué trata la página, cómo deben interpretarla los distintos clientes web, etc. <body>: que es la información del cuerpo, es decir, lo que se verá en el navegador cuando el usuario entre.
  • 13. ETIQUETAS BÁSICAS DE CONTROL EN HTML <!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Título del documento HTML</title> </head> <body> </body> </html>
  • 14. ETIQUETAS BÁSICAS DE CONTROL EN HTML La primera etiqueta (DOCTYPE) indica el tipo de documento. Esta etiqueta debe estar siempre al principio. Fue definido y simplificado así desde HTML 5, ya que antes el doctype se expresaba con una etiqueta mucho mayor. Posteriormente tenemos la etiqueta <html>, con el atributo "lang" opcional. En este caso hemos indicado que el idioma es español.
  • 15. ETIQUETAS BÁSICAS DE CONTROL EN HTML Luego encontramos el <head>, que tiene varias etiquetas. Las importantes son: charset, siendo UTF-8 el recomendado. Lógicamente es importante que ese juego de caracteres se esté usando realmente al guardar el archivo con el código .html. Si usamos algún editor orientado a programadores seguramente se guarde con UTF-8 o al menos tengas la opción de escoger este juego de carácteres. Title, que es lo que mostrará el navegador en la pestaña donde se muestre esta página. También es muy importante para que Google y otros motores identifiquen bien el contenido.
  • 16. ETIQUETAS BÁSICAS DE CONTROL EN HTML Hay otras etiquetas en el <head> que son realmente aconsejables. El caso más claro es el del viewport. También es el lugar correcto para importar estilos CSS, por ejemplo. Para acabar, el <body> contendrá la mayor parte de las etiquetas, con todo el marcado necesario para definir el contenido completo que se verá en la página.
  • 17. FUENTE BIBLIOGRÁFICA: https://desarrolloweb.com/home/html Autores: Julián Pérez Porto y Ana Gardey. Publicado: 2008. Actualizado: 2012. Definición de: Definición de html (https://definicion.de/html/)