SlideShare una empresa de Scribd logo
1 de 15
Lissette Laínez
      2c-3
HTML
 HTML, siglas de HyperText Markup Language
 («lenguaje de marcado de hipertexto»), hace referencia al
 lenguaje de marcado predominante para la elaboración de
 páginas web que se utiliza para describir y traducir la
 estructura y la información en forma de texto, así como
 para complementar el texto con objetos tales como
 imágenes. El HTML se escribe en forma de
 «etiquetas», rodeadas por corchetes angulares (<,>). HTML
 también puede describir, hasta un cierto punto, la
 apariencia de un documento, y puede incluir un script (por
 ejemplo JavaScript), el cual puede afectar el
 comportamiento de navegadores web y otros procesadores
 de HTML.
HISTORIA
 La primera descripción de HTML disponible públicamente fue un documento
  llamado: HTML Tags (Etiquetas HTML), publicado por primera vez en Internet
  por Tim Berners-Lee en 1991. Describe 22 elementos que incluyen el diseño
  inicial y relativamente simple de HTML. Trece de estos elementos todavía
  existen en HTML 4.
 Berners-Lee consideraba a HTML una ampliación de SGML, pero no fue
  formalmente reconocida como tal hasta la publicación de mediados de 1993,
  por la IETF, de una primera proposición para una especificación de HTML: el
  boceto Hypertext Markup Language de Berners-Lee y Dan Connolly, el cual
  incluía una Definición de Tipo de Documento SGML para definir la gramática.
  El boceto expiró luego de seis meses, pero fue notable por su reconocimiento
  de la etiqueta propia del navegador Mosaic usada para insertar imágenes sin
  cambio de línea, que reflejaba la filosofía del IETF de basar estándares en
  prototipos con éxito. De la misma manera, el boceto competidor de Dave
  Raggett HTML+ (Hypertext Markup Format) (Formato de Marcaje de
  Hipertexto), de finales de 1993, sugería estandarizar características ya
  implementadas, como las tablas.
ELEMENTOS
 Los elementos son la estructura básica de HTML. Los elementos
  tienen dos propiedades básicas: atributos y contenido. Cada
  atributo y contenido tiene ciertas restricciones para que se
  considere válido al documento HTML. Un elemento
  generalmente tiene una etiqueta de inicio (por ejemplo,
  <nombre-de-elemento>) y una etiqueta de cierre (por ejemplo,
  </nombre-de-elemento>). Los atributos del elemento están
  contenidos en la etiqueta de inicio y el contenido está ubicado
  entre las dos etiquetas (por ejemplo, <nombre-de-
  elemento atributo="valor">Contenido</nombre-de-elemento>).
  Algunos elementos, tales como <br>, no tienen contenido ni
  llevan una etiqueta de cierre. Debajo se listan varios tipos de
  elementos de marcado usados en HTML.
 Estructura general de una línea de código en el lenguaje de
  etiquetas HTML.
 El marcado presentacional describe la apariencia del texto, sin importar su
  función. Por ejemplo, <b>negrita</b> indica que los navegadores web visuales
  deben mostrar el texto en negrita, pero no indica qué deben hacer los
  navegadores web que muestran el contenido de otra manera (por ejemplo, los
  que leen el texto en voz alta). En el caso de <b>negrita</b> e
  <i>itálica</i>, existen elementos que se ven de la misma manera pero tienen
  una naturaleza más semántica: <strong>enfásis fuerte</strong> y
  <em>énfasis</em>. Es fácil ver cómo un lector de pantalla debería interpretar
  estos dos elementos. Sin embargo, son equivalentes a sus correspondientes
  elementos presentacionales: un lector de pantalla no debería decir más fuerte
  el nombre de un libro, aunque éste esté en itálicas en una pantalla. La mayoría
  del marcado presentacional ha sido desechada con HTML 4.0, en favor de hojas
  de estilo en cascada.
 El marcado hipertextual se utiliza para enlazar partes del documento con otros
  documentos o con otras partes del mismo documento. Para crear un enlace es
  necesario utilizar la etiqueta de ancla <a> junto con el atributo href, que
  establecerá la dirección URL a la que apunta el enlace. Por ejemplo, un enlace a
  la Wikipedia sería de la forma <a href=”es.wikipedia.org”>Wikipedia</a>.
  También se pueden crear enlaces sobre otros objetos, tales como imágenes <a
  href=”enlace”><img src=”imagen” /></a>.
 Estructura general de una línea de código en el lenguaje de
  etiquetas HTML.
 El marcado estructural describe el propósito del texto. Por
  ejemplo, <h2>Golf</h2> establece «Golf» como un
  encabezamiento de segundo nivel, el cual se mostraría en
  un navegador de una manera similar al título «Marcado
  HTML» al principio de esta sección. El marcado estructural
  no define cómo se verá el elemento, pero la mayoría de los
  navegadores web han estandarizado el formato de los
  elementos. Puede aplicarse un formato específico al texto
  por medio de hojas de estilo en cascada.
CODIGOS BÁSICOS
 <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a
  continuación debe ser interpretado como código HTML. Esto es así de facto, ya que en
  teoría lo que define el tipo de documento es el DOCTYPE, que significa la palabra justo
  tras DOCTYPE el tag de raíz.
 <script>: incrusta un script en una web, o llama a uno mediante src="url del script". Se
  recomienda incluir el tipo MIME en el atributo type, en el caso de JavaScript
  text/javascript.
 <head>: define la cabecera del documento HTML; esta cabecera suele contener
  información sobre el documento que no se muestra directamente al usuario como, por
  ejemplo, el título de la ventana del navegador. Dentro de la cabecera <head> es posible
  encontrar:
 Un ejemplo de código HTML con coloreado de sintaxis.
 <title>: define el título de la página. Por lo general, el título aparece en la barra de título
  encima de la ventana.
 <link>: para vincular el sitio a hojas de estilo o iconos. Por ejemplo:<link rel="stylesheet"
  href="/style.css" type="text/css">.
 <style>: para colocar el estilo interno de la página; ya sea usando CSS u otros lenguajes
  similares. No es necesario colocarlo si se va a vincular a un archivo externo usando la
  etiqueta <link>.
 <meta>: para metadatos como la autoría o la licencia, incluso para
    indicar parámetros http (mediante http-equiv="") cuando no se pueden
    modificar por no estar disponible la configuración o por dificultades
    con server-side scripting.
   <body>: define el contenido principal o cuerpo del documento. Esta es
    la parte del documento html que se muestra en el navegador; dentro de
    esta etiqueta pueden definirse propiedades comunes a toda la
    página, como color de fondo y márgenes. Dentro del cuerpo <body> es
    posible encontrar numerosas etiquetas. A continuación se indican
    algunas a modo de ejemplo:
   <h1> a <h6>: encabezados o títulos del documento con diferente
    relevancia.
   <table>: define una tabla.
   <tr>: fila de una tabla.
   <td>: celda de una tabla (debe estar dentro de una fila).
   <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por
    medio del atributo href. Por ejemplo: <a href="http://www.wikipedia.org" title="Wikipedia"
    target="_blank" tabindex="1">Wikipedia</a> se representa como Wikipedia).
   <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear
    contenido.
   <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por
    ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo
    alt="texto alternativo".
   <li><ol><ul>: etiquetas para listas.
   <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>).
   <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>).
   <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>).
   <u>: Antes texto subrayado. A partir de HTML 5 define porciones de texto diferenciadas o destacadas
    del resto, para indicar correcciones por ejemplo. (etiqueta desaprobada en HTML 4.01 y redefinida en
    HTML 5)13 14
   La mayoría de etiquetas deben cerrarse como se abren, pero con una barra («/») tal como se muestra
    en los siguientes ejemplos:
   <table><tr><td>Contenido de una celda</td></tr></table>.
   <script>Código de un [[script]] integrado en la página</script>.
XML
 XML, siglas en inglés de eXtensible Markup Language ('lenguaje de marcas
  extensible'), es un lenguaje de marcas desarrollado por el World Wide Web
  Consortium (W3C). Deriva del lenguaje SGML y permite definir la gramática
  de lenguajes específicos (de la misma manera que HTML es a su vez un
  lenguaje definido por SGML) para estructurar documentos grandes. A
  diferencia de otros lenguajes, XML da soporte a bases de datos, siendo útil
  cuando varias aplicaciones se deben comunicar entre sí o integrar información.
  (Bases de datos Silberschatz).
 XML no ha nacido sólo para su aplicación en Internet, sino que se propone
  como un estándar para el intercambio de información estructurada entre
  diferentes plataformas. Se puede usar en bases de datos, editores de texto, hojas
  de cálculo y casi cualquier cosa imaginable.
 XML es una tecnología sencilla que tiene a su alrededor otras que la
  complementan y la hacen mucho más grande y con unas posibilidades mucho
  mayores. Tiene un papel muy importante en la actualidad ya que permite la
  compatibilidad entre sistemas para compartir la información de una manera
  segura, fiable y fácil.
VENTAJAS
 Es extensible: Después de diseñado y puesto en producción, es posible extender
  XML con la adición de nuevas etiquetas, de modo que se pueda continuar
  utilizando sin complicación alguna.
 El analizador es un componente estándar, no es necesario crear un analizador
  específico para cada versión de lenguaje XML. Esto posibilita el empleo de
  cualquiera de los analizadores disponibles. De esta manera se evitan bugs y se
  acelera el desarrollo de aplicaciones.
 Si un tercero decide usar un documento creado en XML, es sencillo entender su
  estructura y procesarla. Mejora la compatibilidad entre aplicaciones. Podemos
  comunicar aplicaciones de distintas plataformas, sin que importe el origen de
  los datos, es decir, podríamos tener una aplicación en Linux con una base de
  datos Postgres y comunicarla con otra aplicación en Windows y Base de Datos
  MS-SQL Server.
 Transformamos datos en información, pues se le añade un significado concreto
  y los asociamos a un contexto, con lo cual tenemos flexibilidad para estructurar
  documentos.
ESTRUCTURA
 La tecnología XML busca dar solución al problema de expresar
  información estructurada de la manera más abstracta y reutilizable
  posible. Que la información sea estructurada quiere decir que se
  compone de partes bien definidas, y que esas partes se componen a su
  vez de otras partes. Entonces se tiene un árbol de trozos de
  información. Ejemplos son un tema musical, que se compone de
  compases, que están formados a su vez por notas. Estas partes se
  llaman elementos, y se las señala mediante etiquetas.
 Una etiqueta consiste en una marca hecha en el documento, que señala
  una porción de éste como un elemento. Un pedazo de información con
  un sentido claro y definido. Las etiquetas tienen la forma
  <nombre>, donde nombre es el nombre del elemento que se está
  señalando.
 A continuación se muestra un ejemplo para entender la estructura de
  un documento XML:
 <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE Edit_Mensaje SYSTEM
  "Edit_Mensaje.dtd"> <Edit_Mensaje> <Mensaje> <Remitente> <Nombre>Nombre del
  remitente</Nombre> <Mail> Correo del remitente </Mail> </Remitente>
  <Destinatario> <Nombre>Nombre del destinatario</Nombre> <Mail>Correo del
  destinatario</Mail> </Destinatario> <Texto> <Asunto> Este es mi documento con una
  estructura muy sencilla no contiene atributos ni entidades... </Asunto> <Parrafo> Este es
  mi documento con una estructura muy sencilla no contiene atributos ni entidades...
  </Parrafo> </Texto> </Mensaje> </Edit_Mensaje>

 Aquí está el ejemplo de código del DTD del documento «Edit_Mensaje.dtd»:

 <?xml version="1.0" encoding="ISO-8859-1" ?> <!-- Este es el DTD de Edit_Mensaje -->
  <!ELEMENT Mensaje (Remitente, Destinatario, Texto)*> <!ELEMENT Remitente
  (Nombre, Mail)> <!ELEMENT Nombre (#PCDATA)> <!ELEMENT Mail (#PCDATA)>
  <!ELEMENT Destinatario (Nombre, Mail)> <!ELEMENT Nombre (#PCDATA)>
  <!ELEMENT Mail (#PCDATA)> <!ELEMENT Texto (Asunto, Parrafo)> <!ELEMENT
  Asunto (#PCDATA)> <!ELEMENT Parrafo (#PCDATA)>
ATRIBUTOS
 Los elementos pueden tener atributos, que son una
  manera de incorporar características o propiedades a
  los elementos de un documento. Deben ir entre
  comillas.
 Por ejemplo, un elemento «estudiante» puede tener un
  atributo «Mario» y un atributo «tipo», con valores
  «come croquetas» y «taleno» respectivamente.
 <Estudiante Mario="come croquetas"
  tipo="taleno">Esto es un día que Mario va
  paseando…</Estudiante>
PARTES DE UN DOCUMENTO XML
 Un documento XML está formado por el prólogo y por
 el cuerpo del documento así como texto de etiquetas
 que contiene una gran variedad de efectos positivos o
 negativos en la referencia opcional a la que se refiere el
 documento, hay que tener mucho cuidado de esa parte
 de la gramática léxica para que se componga de
 manera uniforme.

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

Slideshare
SlideshareSlideshare
Slideshare
 
Html
HtmlHtml
Html
 
Acerca de html
Acerca de htmlAcerca de html
Acerca de html
 
Diferencia entre html y xml
Diferencia  entre html y xmlDiferencia  entre html y xml
Diferencia entre html y xml
 
Html presentacion
Html presentacionHtml presentacion
Html presentacion
 
Deber d programacion 1
Deber d programacion 1Deber d programacion 1
Deber d programacion 1
 
Html
HtmlHtml
Html
 
Html tarea
Html tareaHtml tarea
Html tarea
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Toala Miguel 2C3
Toala Miguel 2C3Toala Miguel 2C3
Toala Miguel 2C3
 
HTML HyperText Markup Language
HTML HyperText Markup LanguageHTML HyperText Markup Language
HTML HyperText Markup Language
 
Html y HTML5
Html y HTML5Html y HTML5
Html y HTML5
 
HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?
 
Presentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTMLPresentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTML
 
Introducción al HTML
Introducción al HTMLIntroducción al HTML
Introducción al HTML
 
Taller 1 raul guaranda
Taller 1 raul guarandaTaller 1 raul guaranda
Taller 1 raul guaranda
 
Apuntes de HTML 1
Apuntes de HTML 1Apuntes de HTML 1
Apuntes de HTML 1
 
Actividad 2
Actividad 2Actividad 2
Actividad 2
 

Destacado

Constituintes Da MatéRia Viva 2
Constituintes Da MatéRia Viva 2Constituintes Da MatéRia Viva 2
Constituintes Da MatéRia Viva 2Nuno Correia
 
Unity 2D Course 2016 Demo Create A Mobile Platformer Menu
Unity 2D Course 2016 Demo Create A Mobile Platformer MenuUnity 2D Course 2016 Demo Create A Mobile Platformer Menu
Unity 2D Course 2016 Demo Create A Mobile Platformer Menuayman diab
 
Preparação para a prova intermédia 1
Preparação para a prova intermédia 1Preparação para a prova intermédia 1
Preparação para a prova intermédia 1Nuno Correia
 
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)Ganar Dinero por Internet con Threefast. (Pruebas de Pago)
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)Pedro Mamani Chiara
 
05 salida 09_03_2013
05 salida 09_03_201305 salida 09_03_2013
05 salida 09_03_2013chouffe
 
Renacimiento (quattrocento)
Renacimiento    (quattrocento)Renacimiento    (quattrocento)
Renacimiento (quattrocento)iepipirrana
 
Recomendaciones de verano para colgar en blog de aula
Recomendaciones de verano para colgar en blog de aulaRecomendaciones de verano para colgar en blog de aula
Recomendaciones de verano para colgar en blog de aulaclilteacher
 
Case Solution for Laidlaw: The Resignation of James R. Bullock
Case Solution for Laidlaw: The Resignation of James R. BullockCase Solution for Laidlaw: The Resignation of James R. Bullock
Case Solution for Laidlaw: The Resignation of James R. Bullockcasesolutions12
 
Análisis: Enseñanza y TIC hoy.
Análisis: Enseñanza y TIC hoy.Análisis: Enseñanza y TIC hoy.
Análisis: Enseñanza y TIC hoy.andyfernu
 
Plan Unico de Cuentas en Colombia
Plan Unico de Cuentas en ColombiaPlan Unico de Cuentas en Colombia
Plan Unico de Cuentas en ColombiaJuan Jose Durango
 

Destacado (20)

Plan de emergencia por sismo en venadillo
Plan de emergencia por sismo en venadilloPlan de emergencia por sismo en venadillo
Plan de emergencia por sismo en venadillo
 
Constituintes Da MatéRia Viva 2
Constituintes Da MatéRia Viva 2Constituintes Da MatéRia Viva 2
Constituintes Da MatéRia Viva 2
 
CV, oppdatert 17.09.16
CV, oppdatert 17.09.16CV, oppdatert 17.09.16
CV, oppdatert 17.09.16
 
Unity 2D Course 2016 Demo Create A Mobile Platformer Menu
Unity 2D Course 2016 Demo Create A Mobile Platformer MenuUnity 2D Course 2016 Demo Create A Mobile Platformer Menu
Unity 2D Course 2016 Demo Create A Mobile Platformer Menu
 
Preparação para a prova intermédia 1
Preparação para a prova intermédia 1Preparação para a prova intermédia 1
Preparação para a prova intermédia 1
 
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)Ganar Dinero por Internet con Threefast. (Pruebas de Pago)
Ganar Dinero por Internet con Threefast. (Pruebas de Pago)
 
05 salida 09_03_2013
05 salida 09_03_201305 salida 09_03_2013
05 salida 09_03_2013
 
Renacimiento (quattrocento)
Renacimiento    (quattrocento)Renacimiento    (quattrocento)
Renacimiento (quattrocento)
 
Plan de emergencias y contingencias volcanica venadillo. pdf
Plan de emergencias y contingencias volcanica venadillo. pdfPlan de emergencias y contingencias volcanica venadillo. pdf
Plan de emergencias y contingencias volcanica venadillo. pdf
 
2016_DAST_Gernez_Emmanuelle
2016_DAST_Gernez_Emmanuelle2016_DAST_Gernez_Emmanuelle
2016_DAST_Gernez_Emmanuelle
 
Linux shell
Linux shellLinux shell
Linux shell
 
Recomendaciones de verano para colgar en blog de aula
Recomendaciones de verano para colgar en blog de aulaRecomendaciones de verano para colgar en blog de aula
Recomendaciones de verano para colgar en blog de aula
 
Case Solution for Laidlaw: The Resignation of James R. Bullock
Case Solution for Laidlaw: The Resignation of James R. BullockCase Solution for Laidlaw: The Resignation of James R. Bullock
Case Solution for Laidlaw: The Resignation of James R. Bullock
 
Sociedades en Colombia
Sociedades en ColombiaSociedades en Colombia
Sociedades en Colombia
 
Argentum Letter
Argentum LetterArgentum Letter
Argentum Letter
 
Reference
ReferenceReference
Reference
 
Análisis: Enseñanza y TIC hoy.
Análisis: Enseñanza y TIC hoy.Análisis: Enseñanza y TIC hoy.
Análisis: Enseñanza y TIC hoy.
 
Plan Unico de Cuentas en Colombia
Plan Unico de Cuentas en ColombiaPlan Unico de Cuentas en Colombia
Plan Unico de Cuentas en Colombia
 
SchneiderCert
SchneiderCertSchneiderCert
SchneiderCert
 
Transcripts
TranscriptsTranscripts
Transcripts
 

Similar a Lissette lainez (18)

Html y xml
Html y xmlHtml y xml
Html y xml
 
Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
 
Html y xml
Html y xmlHtml y xml
Html y xml
 
Emily
EmilyEmily
Emily
 
danny
dannydanny
danny
 
Helen Valverde 2C3
Helen Valverde 2C3Helen Valverde 2C3
Helen Valverde 2C3
 
Html
HtmlHtml
Html
 
Produccion de material educ. diapositivas html
Produccion de material educ. diapositivas htmlProduccion de material educ. diapositivas html
Produccion de material educ. diapositivas html
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Israel
IsraelIsrael
Israel
 
Israel
IsraelIsrael
Israel
 
etiquetas basicas de html
etiquetas basicas de htmletiquetas basicas de html
etiquetas basicas de html
 
Clase HTML.pptx
Clase HTML.pptxClase HTML.pptx
Clase HTML.pptx
 
Steven Toala 2c3
Steven Toala 2c3Steven Toala 2c3
Steven Toala 2c3
 
Expo html
Expo htmlExpo html
Expo html
 

Último

5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdfOswaldoGonzalezCruz
 
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...JAVIER SOLIS NOYOLA
 
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxPresentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxYeseniaRivera50
 
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024gharce
 
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIA
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIATRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIA
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIAAbelardoVelaAlbrecht1
 
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfBIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfCESARMALAGA4
 
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfEstrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfAlfredoRamirez953210
 
periodico mural y sus partes y caracteristicas
periodico mural y sus partes y caracteristicasperiodico mural y sus partes y caracteristicas
periodico mural y sus partes y caracteristicas123yudy
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docxAgustinaNuez21
 
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)veganet
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDUgustavorojas179704
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024IES Vicent Andres Estelles
 
c3.hu3.p1.p3.El ser humano como ser histórico.pptx
c3.hu3.p1.p3.El ser humano como ser histórico.pptxc3.hu3.p1.p3.El ser humano como ser histórico.pptx
c3.hu3.p1.p3.El ser humano como ser histórico.pptxMartín Ramírez
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfvictorbeltuce
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressionsConsueloSantana3
 
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
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxOscarEduardoSanchezC
 

Último (20)

5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
 
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
 
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxPresentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
 
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
 
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIA
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIATRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIA
TRIPTICO-SISTEMA-MUSCULAR. PARA NIÑOS DE PRIMARIA
 
VISITA À PROTEÇÃO CIVIL _
VISITA À PROTEÇÃO CIVIL                  _VISITA À PROTEÇÃO CIVIL                  _
VISITA À PROTEÇÃO CIVIL _
 
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfBIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
 
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfEstrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
 
periodico mural y sus partes y caracteristicas
periodico mural y sus partes y caracteristicasperiodico mural y sus partes y caracteristicas
periodico mural y sus partes y caracteristicas
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docx
 
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
 
Earth Day Everyday 2024 54th anniversary
Earth Day Everyday 2024 54th anniversaryEarth Day Everyday 2024 54th anniversary
Earth Day Everyday 2024 54th anniversary
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024
 
c3.hu3.p1.p3.El ser humano como ser histórico.pptx
c3.hu3.p1.p3.El ser humano como ser histórico.pptxc3.hu3.p1.p3.El ser humano como ser histórico.pptx
c3.hu3.p1.p3.El ser humano como ser histórico.pptx
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressions
 
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
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
 
Sesión La luz brilla en la oscuridad.pdf
Sesión  La luz brilla en la oscuridad.pdfSesión  La luz brilla en la oscuridad.pdf
Sesión La luz brilla en la oscuridad.pdf
 

Lissette lainez

  • 2. HTML  HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), hace referencia al lenguaje de marcado predominante para la elaboración de páginas web que se utiliza para describir y traducir la estructura y la información en forma de texto, así como para complementar el texto con objetos tales como imágenes. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.
  • 3. HISTORIA  La primera descripción de HTML disponible públicamente fue un documento llamado: HTML Tags (Etiquetas HTML), publicado por primera vez en Internet por Tim Berners-Lee en 1991. Describe 22 elementos que incluyen el diseño inicial y relativamente simple de HTML. Trece de estos elementos todavía existen en HTML 4.  Berners-Lee consideraba a HTML una ampliación de SGML, pero no fue formalmente reconocida como tal hasta la publicación de mediados de 1993, por la IETF, de una primera proposición para una especificación de HTML: el boceto Hypertext Markup Language de Berners-Lee y Dan Connolly, el cual incluía una Definición de Tipo de Documento SGML para definir la gramática. El boceto expiró luego de seis meses, pero fue notable por su reconocimiento de la etiqueta propia del navegador Mosaic usada para insertar imágenes sin cambio de línea, que reflejaba la filosofía del IETF de basar estándares en prototipos con éxito. De la misma manera, el boceto competidor de Dave Raggett HTML+ (Hypertext Markup Format) (Formato de Marcaje de Hipertexto), de finales de 1993, sugería estandarizar características ya implementadas, como las tablas.
  • 4. ELEMENTOS  Los elementos son la estructura básica de HTML. Los elementos tienen dos propiedades básicas: atributos y contenido. Cada atributo y contenido tiene ciertas restricciones para que se considere válido al documento HTML. Un elemento generalmente tiene una etiqueta de inicio (por ejemplo, <nombre-de-elemento>) y una etiqueta de cierre (por ejemplo, </nombre-de-elemento>). Los atributos del elemento están contenidos en la etiqueta de inicio y el contenido está ubicado entre las dos etiquetas (por ejemplo, <nombre-de- elemento atributo="valor">Contenido</nombre-de-elemento>). Algunos elementos, tales como <br>, no tienen contenido ni llevan una etiqueta de cierre. Debajo se listan varios tipos de elementos de marcado usados en HTML.  Estructura general de una línea de código en el lenguaje de etiquetas HTML.
  • 5.  El marcado presentacional describe la apariencia del texto, sin importar su función. Por ejemplo, <b>negrita</b> indica que los navegadores web visuales deben mostrar el texto en negrita, pero no indica qué deben hacer los navegadores web que muestran el contenido de otra manera (por ejemplo, los que leen el texto en voz alta). En el caso de <b>negrita</b> e <i>itálica</i>, existen elementos que se ven de la misma manera pero tienen una naturaleza más semántica: <strong>enfásis fuerte</strong> y <em>énfasis</em>. Es fácil ver cómo un lector de pantalla debería interpretar estos dos elementos. Sin embargo, son equivalentes a sus correspondientes elementos presentacionales: un lector de pantalla no debería decir más fuerte el nombre de un libro, aunque éste esté en itálicas en una pantalla. La mayoría del marcado presentacional ha sido desechada con HTML 4.0, en favor de hojas de estilo en cascada.  El marcado hipertextual se utiliza para enlazar partes del documento con otros documentos o con otras partes del mismo documento. Para crear un enlace es necesario utilizar la etiqueta de ancla <a> junto con el atributo href, que establecerá la dirección URL a la que apunta el enlace. Por ejemplo, un enlace a la Wikipedia sería de la forma <a href=”es.wikipedia.org”>Wikipedia</a>. También se pueden crear enlaces sobre otros objetos, tales como imágenes <a href=”enlace”><img src=”imagen” /></a>.
  • 6.  Estructura general de una línea de código en el lenguaje de etiquetas HTML.  El marcado estructural describe el propósito del texto. Por ejemplo, <h2>Golf</h2> establece «Golf» como un encabezamiento de segundo nivel, el cual se mostraría en un navegador de una manera similar al título «Marcado HTML» al principio de esta sección. El marcado estructural no define cómo se verá el elemento, pero la mayoría de los navegadores web han estandarizado el formato de los elementos. Puede aplicarse un formato específico al texto por medio de hojas de estilo en cascada.
  • 7. CODIGOS BÁSICOS  <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML. Esto es así de facto, ya que en teoría lo que define el tipo de documento es el DOCTYPE, que significa la palabra justo tras DOCTYPE el tag de raíz.  <script>: incrusta un script en una web, o llama a uno mediante src="url del script". Se recomienda incluir el tipo MIME en el atributo type, en el caso de JavaScript text/javascript.  <head>: define la cabecera del documento HTML; esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario como, por ejemplo, el título de la ventana del navegador. Dentro de la cabecera <head> es posible encontrar:  Un ejemplo de código HTML con coloreado de sintaxis.  <title>: define el título de la página. Por lo general, el título aparece en la barra de título encima de la ventana.  <link>: para vincular el sitio a hojas de estilo o iconos. Por ejemplo:<link rel="stylesheet" href="/style.css" type="text/css">.  <style>: para colocar el estilo interno de la página; ya sea usando CSS u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un archivo externo usando la etiqueta <link>.
  • 8.  <meta>: para metadatos como la autoría o la licencia, incluso para indicar parámetros http (mediante http-equiv="") cuando no se pueden modificar por no estar disponible la configuración o por dificultades con server-side scripting.  <body>: define el contenido principal o cuerpo del documento. Esta es la parte del documento html que se muestra en el navegador; dentro de esta etiqueta pueden definirse propiedades comunes a toda la página, como color de fondo y márgenes. Dentro del cuerpo <body> es posible encontrar numerosas etiquetas. A continuación se indican algunas a modo de ejemplo:  <h1> a <h6>: encabezados o títulos del documento con diferente relevancia.  <table>: define una tabla.  <tr>: fila de una tabla.  <td>: celda de una tabla (debe estar dentro de una fila).
  • 9. <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo href. Por ejemplo: <a href="http://www.wikipedia.org" title="Wikipedia" target="_blank" tabindex="1">Wikipedia</a> se representa como Wikipedia).  <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido.  <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo".  <li><ol><ul>: etiquetas para listas.  <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>).  <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>).  <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>).  <u>: Antes texto subrayado. A partir de HTML 5 define porciones de texto diferenciadas o destacadas del resto, para indicar correcciones por ejemplo. (etiqueta desaprobada en HTML 4.01 y redefinida en HTML 5)13 14  La mayoría de etiquetas deben cerrarse como se abren, pero con una barra («/») tal como se muestra en los siguientes ejemplos:  <table><tr><td>Contenido de una celda</td></tr></table>.  <script>Código de un [[script]] integrado en la página</script>.
  • 10. XML  XML, siglas en inglés de eXtensible Markup Language ('lenguaje de marcas extensible'), es un lenguaje de marcas desarrollado por el World Wide Web Consortium (W3C). Deriva del lenguaje SGML y permite definir la gramática de lenguajes específicos (de la misma manera que HTML es a su vez un lenguaje definido por SGML) para estructurar documentos grandes. A diferencia de otros lenguajes, XML da soporte a bases de datos, siendo útil cuando varias aplicaciones se deben comunicar entre sí o integrar información. (Bases de datos Silberschatz).  XML no ha nacido sólo para su aplicación en Internet, sino que se propone como un estándar para el intercambio de información estructurada entre diferentes plataformas. Se puede usar en bases de datos, editores de texto, hojas de cálculo y casi cualquier cosa imaginable.  XML es una tecnología sencilla que tiene a su alrededor otras que la complementan y la hacen mucho más grande y con unas posibilidades mucho mayores. Tiene un papel muy importante en la actualidad ya que permite la compatibilidad entre sistemas para compartir la información de una manera segura, fiable y fácil.
  • 11. VENTAJAS  Es extensible: Después de diseñado y puesto en producción, es posible extender XML con la adición de nuevas etiquetas, de modo que se pueda continuar utilizando sin complicación alguna.  El analizador es un componente estándar, no es necesario crear un analizador específico para cada versión de lenguaje XML. Esto posibilita el empleo de cualquiera de los analizadores disponibles. De esta manera se evitan bugs y se acelera el desarrollo de aplicaciones.  Si un tercero decide usar un documento creado en XML, es sencillo entender su estructura y procesarla. Mejora la compatibilidad entre aplicaciones. Podemos comunicar aplicaciones de distintas plataformas, sin que importe el origen de los datos, es decir, podríamos tener una aplicación en Linux con una base de datos Postgres y comunicarla con otra aplicación en Windows y Base de Datos MS-SQL Server.  Transformamos datos en información, pues se le añade un significado concreto y los asociamos a un contexto, con lo cual tenemos flexibilidad para estructurar documentos.
  • 12. ESTRUCTURA  La tecnología XML busca dar solución al problema de expresar información estructurada de la manera más abstracta y reutilizable posible. Que la información sea estructurada quiere decir que se compone de partes bien definidas, y que esas partes se componen a su vez de otras partes. Entonces se tiene un árbol de trozos de información. Ejemplos son un tema musical, que se compone de compases, que están formados a su vez por notas. Estas partes se llaman elementos, y se las señala mediante etiquetas.  Una etiqueta consiste en una marca hecha en el documento, que señala una porción de éste como un elemento. Un pedazo de información con un sentido claro y definido. Las etiquetas tienen la forma <nombre>, donde nombre es el nombre del elemento que se está señalando.  A continuación se muestra un ejemplo para entender la estructura de un documento XML:
  • 13.  <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE Edit_Mensaje SYSTEM "Edit_Mensaje.dtd"> <Edit_Mensaje> <Mensaje> <Remitente> <Nombre>Nombre del remitente</Nombre> <Mail> Correo del remitente </Mail> </Remitente> <Destinatario> <Nombre>Nombre del destinatario</Nombre> <Mail>Correo del destinatario</Mail> </Destinatario> <Texto> <Asunto> Este es mi documento con una estructura muy sencilla no contiene atributos ni entidades... </Asunto> <Parrafo> Este es mi documento con una estructura muy sencilla no contiene atributos ni entidades... </Parrafo> </Texto> </Mensaje> </Edit_Mensaje>  Aquí está el ejemplo de código del DTD del documento «Edit_Mensaje.dtd»:  <?xml version="1.0" encoding="ISO-8859-1" ?> <!-- Este es el DTD de Edit_Mensaje --> <!ELEMENT Mensaje (Remitente, Destinatario, Texto)*> <!ELEMENT Remitente (Nombre, Mail)> <!ELEMENT Nombre (#PCDATA)> <!ELEMENT Mail (#PCDATA)> <!ELEMENT Destinatario (Nombre, Mail)> <!ELEMENT Nombre (#PCDATA)> <!ELEMENT Mail (#PCDATA)> <!ELEMENT Texto (Asunto, Parrafo)> <!ELEMENT Asunto (#PCDATA)> <!ELEMENT Parrafo (#PCDATA)>
  • 14. ATRIBUTOS  Los elementos pueden tener atributos, que son una manera de incorporar características o propiedades a los elementos de un documento. Deben ir entre comillas.  Por ejemplo, un elemento «estudiante» puede tener un atributo «Mario» y un atributo «tipo», con valores «come croquetas» y «taleno» respectivamente.  <Estudiante Mario="come croquetas" tipo="taleno">Esto es un día que Mario va paseando…</Estudiante>
  • 15. PARTES DE UN DOCUMENTO XML  Un documento XML está formado por el prólogo y por el cuerpo del documento así como texto de etiquetas que contiene una gran variedad de efectos positivos o negativos en la referencia opcional a la que se refiere el documento, hay que tener mucho cuidado de esa parte de la gramática léxica para que se componga de manera uniforme.