Want to create interactive content? It’s easy in Genially!

Get started free

Lenguajes de Marcas y Lenguaje de Presentaciòn de Datos

viki6086

Created on September 10, 2023

Start designing with a free template

Discover more than 1500 professional designs like these:

Corporate Christmas Presentation

Business Results Presentation

Meeting Plan Presentation

Customer Service Manual

Business vision deck

Economic Presentation

Tech Presentation Mobile

Transcript

Lenguajes de Marcas y Lenguaje de Presentaciòn de Datos

INSTITUTO TECNOLÒGICO SUPERIOR DE LAS CHOAPAS

Victoria Del Alba De Dios Garcìa

Mti. Alejandrina Isabel Cruz Rodríguez

Programaciòn Web

Si puedes imaginarlo puedes programarlo-Alejandro Taboada Sanchèz-

ÌNDICE

Presentaciòn.........................................................................................................................1Frase Inspiradora...............................................................................................................2 Ìndice.........................................................................................................................................3 Introducciòn........................................................................................................................4 Lenguajes de Marcas.....................................................................................................5 Lenguaje de Presentaciòn de Datos...................................................................8 Relación entre lenguajes de marcas y lenguajes de presentación de datos.................................................................................................................................14 Conclusiòn...........................................................................................................................15 Fuentes De Consulta....................................................................................................16

Introducciòn

La relación entre lenguajes de marcas y lenguajes de presentación de datos es fundamental en el mundo de la informática y la comunicación digital. Los lenguajes de marcas y los lenguajes de presentación son dos tipos de lenguajes de programación que desempeñan roles complementarios en la representación y el procesamiento de información en la web y en otros entornos digitales.

Lenguajes de Marcas

Los lenguajes de marcas (Markup Language) es un modo de codificar un documento donde junto con el texto, se incorporan etiquetas (marcas o anotaciones) con información adicional relativa a la estructura del texto o su formato de presentación. Estos permiten hacer explícita la estructura de un documento, su contenido semántico o cualquier otra información lingüística o extralingüística que se quiera hacer patente.

Evolución

Click aquí

Los Lenguajes de Marcas se pueden clasificar: -Lenguajes de presentación: Define el formato (apariencia) del texto. Éstos suelen ocultar las etiquetas y mostrar al usuario solamente el texto con su formato. -Lenguajes de procedimientos: Orientado también a la presentación pero, además, el programa que representa el documento debe interpretar las etiquetas para realizar acciones en función de ellas. -Lenguajes descriptivos o semánticos: Describen las diferentes partes en las que se estructura el documento, es decir, definen su contenido, pero sin especificar cómo deben representarse.

Tipos de Lenguajes de Marcas

EjemplosClick Aquí

HTML (HyperText Markup Language)

Es el lenguaje de marca más conocido. Es utilizado para crear páginas web. Proporciona la estructura y el contenido de una página web, definiendo los elementos y su diseño. Utiliza etiquetas para marcar diferentes partes del contenido. Estas etiquetas permiten a los navegadores web interpretar y renderizar correctamente el contenido de la página. HTML es fundamental en el desarrollo web y es la base para la creación de sitios web interactivos y accesibles.

Datos Importantes

Click aquí

Lenguaje de Presentaciòn de Datos

Este lenguaje se encarga de definir un conjunto de etiquetas y características de atributos de cada uno de los elementos de los lenguajes, establece reglas para crear documentos, comúnmente en lenguaje HTML. Actualmente los lenguajes de presentación y su sintaxis son utilizados para desarrollar contenidos interactivos para la web, dependiendo del medio y del contenido que se desea desarrollar, la sintaxis puede cambiar en pequeñas instrucciones, pues los medios de renderizado y/o compilación cambian.

Informaciòn Importantes

Click aquí

Sintaxis

Se trata de un elemento que se le conoce como etiqueta, la cual alberga instrucciones específicas del lenguaje de programación, estas señalizaciones se determinan encapsulando las palabras reservadas entre un símbolo de mayor y uno de menor que se ubican al principio y al final de la palabra respectivamente. Las etiquetas funcionan para instrucciones como;

  • Letras cursivas, negritas, subrayadas
  • Alineación del texto
  • Salto de línea
  • Salto de párrafo
  • Inserción de nombre de página (titulo)
  • Inicio y final del cuerpo del documento

Nota Extra

Ejemplos

Selectores

Los selectores son los encargados de identificar los elementos dentro de un sitio web para poder identificar sus atributos y/o propiedades, los elementos pueden ser, texto, imagen, video, animación, etc. Los selectores en su variedad comprenden del nombre de las etiquetas utilizadas dentro de los documentos HTML, por ejemplo: • Body • P • Code • Table • Ul

Nota Extra

10

Tipos de Medios

HTML permite a los autores diseñar documentos que saquen partido de las características de los medios en los que el documento vaya a ser representado (ejemplo: pantallas gráficas, pantallas de televisión, dispositivos de mano, navegadores basados en voz, dispositivos táctiles Braille, etc.). Al especificar el atributo medio, los autores permiten a los agentes de usuario cargar y aplicar las hojas de estilo de manera selectiva. El control de medios es particularmente interesante cuando se aplica a hojas de estilo externas, ya que los agentes de usuario pueden ahorrar tiempo si obtienen de la red únicamente aquellas hojas de estilo que se apliquen el dispositivo actual. Por ejemplo, los navegadores basados en voz.

Ejemplo

Maneras de especificar las hojas de estilos

11

Modelo de Caja (Box Model)

Es la característica más importante del lenguaje de hojas de estilos CSS, ya que condiciona el diseño de todas las páginas

web. El modelo de cajas es el comportamiento

de CSS que hace que todos los elementos de las páginas se representen mediante cajas rectangulares.

Las cajas de una página se crean automáticamente. Cada vez que se inserta una etiqueta HTML, se crea una nueva caja rectangular que encierra los contenidos de ese elemento.

Informaciòn Extra

12

Click aquí

CSS (Cascading Style Sheets)

Son un lenguaje formal usado para definir la presentación de un documento estructurado escrito en HTML o XML y por extensión en XHTML. El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirá de estándar para los agentes de usuario o navegadores. Las hojas de estilo representan un avance importante para los diseñadores de páginas web, al darles un mayor rango de posibilidades para mejorar la apariencia de sus páginas. La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación. bles.

Datos Importantes

13

Click aquí

Relación entre lenguajes de marcas y lenguajes de presentación de datos

Los lenguajes de marcas se utilizan para definir la estructura del contenido, mientras que los lenguajes de presentación de datos se utilizan para definir cómo se debe mostrar ese contenido. Por ejemplo, un documento HTML puede utilizar etiquetas para definir la estructura del contenido, como encabezados, párrafos y listas. Luego, un documento CSS puede utilizar reglas para definir cómo se debe mostrar ese contenido, como el tamaño de la fuente, el color del texto y la alineación del contenido.

Màs Informaciòn

14

Conclusiòn

La combinación de lenguajes de marcas y lenguajes de presentación de datos es esencial para la creación de contenido web y digital de alta calidad. Esta relación permite a los desarrolladores y diseñadores trabajar juntos para ofrecer una experiencia de usuario atractiva y funcional en la web y otros medios digitales. Al combinarse, estos lenguajes permiten crear contenido que sea tanto legible como atractivo.

15

Fuentes De Consulta

-Reconocimiento de las características de lenguajes de marcas. Daw. Recuperado el 10 de septiembre de 2023 de https://blogsaverroes.juntadeandalucia.es/plataformaeiv/files/2016/10/LMSGI_3.pdf -Biblioteconomía. Tema 1.10. Los lenguajes de marcado aplicados a los registros bibliográficos. XML Marc dtd; XML Marc schema. Recuperado el 10 de septiembre de 2023 de http://www.bibliopos.es/Biblion-A2-Biblioteconomia/10Lenguajes-de-marcado.pdf -Unidad 1. Definición y clasificación de lenguajes de marcas. Recuperado el 10 de septiembre de 2023 de http://roble.pntic.mec.es/jcortijo/base/presenciales/unidad_1/unidad_1.pdf

16

Fuentes De Consulta

-Hubspot. Introducción al CSS. Recuperado el 12 de septiembre de 2023 de https://blog.hubspot.es/website/que-es-css#para-que -Unidad III: Lenguaje de presentación. Recuperado el 12 de septiembre de 2023 de http://itpn.mx/recursosisc/8semestre/programacionweb/Unidad%20III -Lenguaje HTML. Diseño de páginas web. Lenguaje de Presentaciòn de Datos. Recuperado el 12 de septiembre de 2023 de https://www3.gobiernodecanarias.org/medusa/ecoblog/ilopmon/files/2016/12/html_2016.pdf

17

¡MUCHAS GRACIAS!

18

¿Cómo funciona?

Para dar formato o estructura a una página, el lenguaje de marcas utiliza una serie de etiquetas (a menudo entre paréntesis angulares) cuyo símbolo es <> y que funcionan como instrucciones que, al estar contenidas entre <>, se diferencian sintácticamente del texto sin formato. Las etiquetas son leídas e interpretadas por parsers o analizadores que luego generan una salida, generalmente como una página o un documento que tiene el formato y el estilo correspondiente y manteniendo la marca real oculta a simple vista. Por ejemplo, en lenguaje HTML, la etiqueta h1 indica el elemento de encabezado principal de una página web.