Introducción a los Lenguajes de marcas - Jorge...

LMSGI-Unidad 1-Lenguajes de marcasJorge Sánchez, www.jorgesanchez.net

@jorgesancheznet

Introducción a losLenguajes de marcas

LMSGI, módulo del ciclo de FP de Grado Superior, Administración de Sistemas Informáticos en Red

@jorgesancheznet

[1] ordenador e información

@jorgesancheznet

Formas de representar información en el ordenador

• El ordenador es una máquina binaria• TODA la información que almacena debe ser almacenada de forma

binaria• Nº 9701100001• Letra A01000001

• Color Malva211 174 25211010011 10101110 111111000• Una imagen Pasar todos los píxeles a binario• Vídeo, sonido Muestras de cada sonido e imagen• Codificación=Transformación de información a una forma binaria

@jorgesancheznet

Datos binarios y datos de texto

• En realidad todo es binario• Datos binarios = (Comúnmente) Todo lo que no es texto• Los humanos alfabetizados estamos muy textualizados• Ejemplo. Intentar ver lo siguiente sin entender lo que pone,

como si fuera una mancha de color blanco:

@jorgesancheznet

Datos binarios y datos de texto

• Los humanos no podemos abstraernos así• Para el ordenador la imagen inferior sólo es una secuencia

binaria más• Para el ser humano, alfabetizado en caracteres latinos, es

claramente un texto

@jorgesancheznet

el problema de codificar texto

•Un ordenador solo maneja datos binarios

•Consecuencia: El texto debe de convertirse en binario

@jorgesancheznet

el problema de codificar texto

•Problema:•ñ (en sistema Windows clásico) = 241 = 11101101•ñ (en la consola clásica de Windows) = 164= 10100100

•Cada sistema codificaba de una manera

@jorgesancheznet

[2] codificación de texto a binario

@jorgesancheznet

el problema de codificar texto.código ASCII

•ANSI creó una tabla llamada ASCII que estandarizó la forma de codificar texto•La tabla consta de 128 caracteres•Usa 7 bits para codificar•Problema: Sólo incluyó caracteres del inglés

@jorgesancheznet

el problema de codificar texto.código ASCII•Para los símbolos no ingleses, se añadió un bit más al ASCII = 256 caracteres•ASCII extendido=8 bits•Problema: Hay muchos ASCII extendidos

@jorgesancheznet

el problema de codificar texto.código Unicode• Intenta arreglar el lío de los sistemas ASCII extendidos•Cada símbolo de cada lengua tiene un valor•Usa hasta 32 bits (caben billones de caracteres)•Problema: El tamaño de los archivos de texto se multiplica

@jorgesancheznet

el problema de codificar texto.código Unicode. implementaciones• UTF-8:• Tamaño variable para cada carácter (8,16,24 o 32 bits)• 8 bits Caracteres del código ASCII original• 16 bits Lenguas latinas, cirílicas, griegas, árabes, hebreas

y otras de Europa, Asia Menor y Egipto• 24 bits Resto de símbolos alfabéticos (lenguas de Asia)• 32 bits Símbolos, lenguas muertas,…

@jorgesancheznet

el problema de codificar texto.código Unicode. implementaciones•UTF-16• Ocupan 16 (si son del tipo 1 y 2 anterior) y 32 bits

•UTF-32• Cada carácter ocupa 32 bits

@jorgesancheznet

Códigos. Unicode. Implementaciones

• Ejemplo, texto 取得cigüeña𐐝• En UTF-8 ocupa: 3+3+1+1+1+2+1+2+1+4 = 19 bytes• En UTF-16 ocupa: 4+4+2+2+2+2+2+2+2+4 = 26 bytes• En UTF-32 ocupa: 4+4+4+4+4+4+4+4+4+4 = 40 bytes

• UTF-8 ocupa menos, pero el proceso de los archivos es más lento• UTF-32 es el que más ocupa pero el proceso es simple• UTF-8 es la forma más usada, es el estándar actual para

codificar texto

@jorgesancheznet

Ventajas de los archivos binarios

•Ocupan menos espacio

•Son más rápidos de procesar por la máquina

•Permiten el acceso directo a los datos

•Los datos que almacenan no están expuestos

@jorgesancheznet

Ventajas de los archivos de texto

• Ideales para exportar e importar•Compatibles con cualquier dispositivo•Directamente modificables•Manipulación sencilla•Directamente transportables y entendibles por todo tipo de redes

@jorgesancheznet

[3] exportar/importar datos

@jorgesancheznet

El problema de compartir datos

• Datos que he creado en una aplicación, los quiero en otra

• En binario Conversores de formato

• Ejemplo foto:• JPG• TIFF• PSD• GIF• PNG

@jorgesancheznet

•Primera solución: estándares

•Música MP3

• Imagen JPG

•Documentos PDF

•Todos tienen matices y todos están expuestos a que aparezca un formato mejor

•En muchas ocasiones son propiedad de empresas

@jorgesancheznet

¡El texto siempre es estándar!

@jorgesancheznet

Problema:¿Cómo meter datos no textuales (vídeo, imagen,sonido,…) en archivos de texto?

@jorgesancheznet

[4] lenguajes de marcas

@jorgesancheznet

Historia de los lenguajes de marcas

•Necesidad: Codificar en archivos de texto cosas que no son texto•Primeras aproximaciones, procesadores de texto•Marcado. Markup Language = Lenguaje etiquetado•Siempre se basa en distinguir texto, de lo que no es texto:• Hola soy [[rojo]]Jorge[[finRojo]], ¿qué tal?

@jorgesancheznet

•Charles Goldfarb

• Ideó GML• Padre de SGML• Soy <rojo>Jorge</rojo>

@jorgesancheznet

•Donald Knuth

•Ideó TeX•Tipos METAFONT

@jorgesancheznet

•Leslie Lamport

• Ideó LaTeX• Simplifica TeX

@jorgesancheznet

•Ejemplo LaTeX

• Resultado http://latex.informatik.uni-halle.de/latex-online/latex.php:

\documentclass[12pt]{article}\usepackage{amsmath}\title{\Ejemplo}\begin{document}Este es el texto ejemplo de \LaTeX{}Con datos en \emph{cursiva} o \textbf{negrita}.Ejemplo de f\'ormula\begin{align}E &= mc^2 \end{align}\end{document}

@jorgesancheznet

•RTF

• Formato de proceso de texto desarrollado por Microsoft• Prácticamente estándar• Hoy muy poco usado

{\rtf1\ansi\ansicpg1252\deff0\deflang3082{\fonttbl{\f0\fnil\fcharset0 Calibri;}}\viewkind4\uc1\pard\sa200\sl276\slmult1\lang10\f0\fs22 soy \i cursiva\i0\par}

@jorgesancheznet

•PostScript

• Pruebas: http://online2pdf.com/convert/ps-to-pdf

%!PS/Courier % Elige el tipo de letra20 selectfont % Establece el tamaño de la letra y

% la toma como el tipo de letra en uso72 500 moveto % Coloca el cursor en las coordenadas

% 72, 500 (contando los píxeles desde% la esquina izquierda de la página)

(Hola mundo!) show % Escribe el texto entre paréntesis, showpage % Imprime el resultado

@jorgesancheznet

•HTML• Lenguaje de las páginas web

<!DOCTYPE html><html><head>

<title>Ejemplo de página web</title></head><body><h1>Título principal</h1><h2>Título de segundo nivel</h2><p>Texto de párrafo con <strong>negrita</strong> y

<em>cursiva</em></p></body>

@jorgesancheznet

•XML• Sucesor de SGML• Más estricto y regular• Muy exitoso• Fundamental en importación/exportación• Principal uso: Bases de datos

@jorgesancheznet

•XML <?xml version="1.0" ?><persona>

<nombre>Jorge</nombre><apellido1>Sánchez</apellido1><dirección>

<calle>C/ Falsa nº 0</calle><localidad>Palencia</localidad><código_Postal>34001</código_Postal><pais>España</pais>

</direccion><teléfonos>

<teléfono tipo=”fijo”>999 999 999</teléfono><teléfono tipo=”móvil”>666 666 666</teléfono>

</telefono></persona>

@jorgesancheznet

• JSON• Nacido para JavaScript• Se ha vuelto muy popular• Casi mismas ventajas que XML, pero además está

integrado en JavaScript• Fundamental en importación/exportación• Principal uso: Bases de datos

@jorgesancheznet

• JSON {"nombre": "Jorge","apellido1": "Sánchez","dirección": {"calle": "C/ Falsa nº 0","localidad": "Palencia","código Postal": "34001","país": "España"

},"teléfonos": [{"tipo": "fijo","número": "999 999 999"

},{"tipo": "móvil",“numero": "666 666 666"

@jorgesancheznet

•Markdown• Formato aparecido para facilitar crear documentos web• Creado por John Gruber con la ayuda de Aaron Schwartz• El objetivo es la máxima sencillez

# Título principal## Título de segundo nivelTexto de párrafo con *negrita* y **cursiva**

@jorgesancheznet

Tipos de lenguajes de marcas

•Orientados a la presentación. HTML, RTF

•Orientados a la descripción. XML, JSON, HTML 5

•Orientados a procedimientos. LaTeX, PostScript

Introducción a los Lenguajes de marcas - Jorge...

Documents

Transcript of Introducción a los Lenguajes de marcas - Jorge...

LM-UT1: Lenguajes de marcas

LENGUAJES DE MARCAS Y SISTEMAS DE …maralboran.eu/archivos/noticias1718/guiones2017/informat.pdf · 2º Ciclo Formativo de Desarrollo de Aplicaciones Web Profesor.Miguel Ángel Santos

Familia Profesional Informática y Comunicacionesiescalderon.es/wp-content/uploads/2020/10/HojaInformativ... · 2020. 10. 28. · UT2. LENGUAJES DE MARCAS PARA VISUALIZACIÓN DE LA

I.E.S. “Santiago Hernández” Ciclo: Sistemas ... · Módulo Profesional: Lenguajes de marcas y sistemas de gestión de información PRG-00127 Página 6 2 UD 4. Lenguajes de marcas

HyperText Markup Language (Lenguaje de Marcas de … · Un lenguaje de marcas es una forma de ... u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un archivo

LENGUAJES DE MARCAS Y SISTEMAS DE GESTIÓN DE LA INFORMACIÓNroble.pntic.mec.es/jcortijo/base/presenciales/prog_mod.pdf · multiplataforma/web administraciÓn de sistemas informÁticos

Creación de enlaces en HTML - Jorge Sanchezjorgesanchez.net/presentaciones/lenguajes-de-marcas/pdf/html-enlaces… · LMSGI-Unidad 3-1-Enlaces Jorge Sánchez, @jorgesancheznet Enlaces

Programación del Módulo Profesional Lenguajes de …portal.iesjovellanos.org/adjuntos/ismael/pga_web_11_12a/DEPARTAM... · “Lenguajes de Marcas y Sistemas de Gestión de Información

Certificado de Profesionalidad PROGRAMACIÓN CON LENGUAJES ORIENTADOS A OBJETOS … · 2014. 3. 27. · – Lenguajes estructurados. – Lenguajes orientados a objetos. – Lenguajes

Unidad 1) Lenguajes de marcas - Jorge Sanchezjorgesanchez.net/presentaciones/lenguajes-de-marcas/...LMSGI-Unidad 1-Lenguajes de marcas Jorge Sánchez, @jorgesancheznet el problema

LENGUAJES DE MARCAS - CONSEJERÍA DE EDUCACIÓN

Pérdida de Evaluación Continua 2 Ausencia Justificada …ies-julioverne.centros.castillalamancha.es/sites/ies-julioverne... · Lenguajes de marcas y sistemas de gestión de información

fundamentos de programación - jorgesanchez.net · fundamentos de programación (unidad 9) colecciones de datos (6) (9.1) introducción a las colecciones de datos En los lenguajes

LENGUAJES DE MARCAS - bibing.us.esbibing.us.es/proyectos/abreproy/11420/fichero/VOLUMEN+1%2F4...PostScript, archivos .pdf, etc.) ni son lenguajes de programación ... En XML se separa

Oviedo - fleming.informatica-fleming.comfleming.informatica-fleming.com/documentos/LenguajesDeMarcas.pdf · Reconocimiento de las características de lenguajes de marcas: • Definir

BOLETÍN OFICIAL DEL ESTADO - Sede Electrónica del SEPE · Lenguajes de marcas. Lenguajes de guión. Lenguajes estructurados. Lenguajes orientados a objetos. Protocolos de comunicación.

Elaboración de documentos web mediante lenguajes de marcas

LENGUAJES DE MARCAS · Los lenguajes de marcas surgieron, inicialmente, como lenguajes formados por el conjunto de códigos de formato que los procesadores de texto introducen en

Libro de Lenguajes de Marcas y Sistemas de Gestión de Información en PDF

Unidad 1 - roble.pntic.mec.esroble.pntic.mec.es/jcortijo/base/lmsgi_pearson/Tema_1.pdf · Evolucion de los lenguajes de marcas 2. Evolucion de los lenguajes de marcas 5 e e Índice