PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un...
Transcript of PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un...
![Page 1: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/1.jpg)
HTML, CSS, XML. Lo que debes saber
Quique Franco
PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITALCofinanciado por el Programa Operativo Plurirregional de España (POPE) (C-027/17-ED)
![Page 2: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/2.jpg)
Índice1 HTML.
1.1. Qué es
1.2. Ejemplo de HTML
1.3. ¿Dónde está?
2 CSS.
1.1. Qué es
1.2. Ejemplo de CSS
1.3. ¿Dónde está?
3 XML.
1.1. Qué es
1.2. Ejemplo de XML
1.3. ¿Dónde está?
![Page 3: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/3.jpg)
HTML. Qué es
“HTML es un lenguaje de programación que se
utiliza para el desarrollo de páginas de Internet.
Se trata de la siglas que corresponden a
HyperText Markup Language, es decir, Lenguaje
de Marcas de Hipertexto”.
![Page 4: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/4.jpg)
HTML. Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
EN VIVO
![Page 5: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/5.jpg)
HTML.
¿Dónde está?Lado del servidor
![Page 6: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/6.jpg)
HTML.
¿Dónde está?Lado del navegador
![Page 7: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/7.jpg)
CSS. Qué es
“CSS (siglas en inglés de Cascading Style Sheets),
en español "Hojas de estilo en cascada", es un
lenguaje de diseño gráfico para definir y crear la
presentación de un documento estructurado escrito
en un lenguaje de marcado.”
![Page 8: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/8.jpg)
CSS. Qué es
CSS está diseñado principalmente para marcar la
separación del contenido del documento y la forma
de presentación de este
![Page 9: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/9.jpg)
CSS. Ejemplo
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
EN VIVO
![Page 10: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/10.jpg)
CSS. ¿Dónde está?
![Page 11: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/11.jpg)
CSS. ¿Dónde
está?Lado del servidor
![Page 12: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/12.jpg)
CSS. ¿Dónde
está?Lado del navegador
![Page 13: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/13.jpg)
XML. Qué es
“XML, siglas en inglés de eXtensible Markup Language,
traducido como "Lenguaje de Marcado Extensible" o
"Lenguaje de Marcas Extensible", es un meta-lenguaje
que permite definir lenguajes de marcas desarrollado por
el World Wide Web Consortium (W3C) utilizado para
almacenar datos en forma legible. ”
![Page 14: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/14.jpg)
XML. Qué es
Fue diseñado para almacenar y transportar datos
Fue diseñado para ser leído por máquinas y humanos
![Page 15: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/15.jpg)
XML. Ejemplo
<?xml version="1.0" encoding="UTF-8"?>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>
![Page 16: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/16.jpg)
Diferencias XML - HTML
XML y HTML fueron diseñados con diferentes objetivos:
XML fue diseñado para transportar datos, con énfasis en qué
datos son
HTML fue diseñado para mostrar datos, con un enfoque en cómo
se ven los datos
Las etiquetas XML no están predefinidas como las etiquetas HTML
![Page 17: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/17.jpg)
Diferencias XML - HTML
XML separa los datos de la presentación
XML no contiene ninguna información sobre cómo mostrarse.
Los mismos datos XML se pueden utilizar en muchos
escenarios de presentación diferentes.
XML es a menudo un complemento a HTML
![Page 18: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/18.jpg)
Diferencias XML - HTML
En muchas aplicaciones HTML, XML se usa para almacenar o
transportar datos, mientras que HTML se usa para formatear y
mostrar los mismos datos.
XML separa los datos de HTML
Al mostrar datos en HTML, no debería tener que editar el
archivo HTML cuando los datos cambian.
Con XML, los datos se pueden almacenar en archivos XML
separados.
![Page 19: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/19.jpg)
XML. ¿Dónde está?
![Page 20: PROGRAMA OFICINAS DE TRANSFORMACIÓN DIGITAL · 2019. 11. 12. · HTML. Quées “HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se](https://reader036.fdocumento.com/reader036/viewer/2022071008/5fc5dd8362afcc53bc17e784/html5/thumbnails/20.jpg)
wwwwww.transformaciondigital.gob.es