Download Introducción a los lenguajes de marcas

Document related concepts

Hoja de estilos en cascada wikipedia , lookup

Página web wikipedia , lookup

W3C Markup Validation Service wikipedia , lookup

Diseño web wikipedia , lookup

Tableless wikipedia , lookup

Transcript
Introducción a los lenguajes de marcas
Introducción
Las personas utilizamos en nuestro lenguaje hablado ciertos gestos, diferente entonación, pausas, etc., que
acompañan al contenido que queremos transmitir.
De modo parecido en el lenguaje escrito utilizamos tamaños de letra, negrita, numeración, viñetas, tablas,
colores, etc. que también acompañan a la información para que sea más fácil de entender. En definitiva
estamos aplicando un determinado formato a la información que transmitimos.
En el caso de los documentos que intercambiamos a través de internet, como las páginas web, son los
lenguajes de marcas quienes nos permiten aplicar dicho formato.
Dicho formato se le aplica a través de un Lenguaje especifico, como es el HTML, que va etiquetando todo el
texto que queremos visualizar en la página web de acuerdo al diseño elegido.
Al texto resultante de aplicarle las marcas de formato del HTML para visualizar la información, se le llama
código fuente.
Dicho código, es interpretado por un programa al que se le llama agente de usuario y que son los populares
navegadores web. Ejemplos:
Firefox, Chrome, Safari, Opera, Explorer..
Una “marca” o etiqueta o tag, es una señal colocada dentro de un texto, con el fin de delimitar una parte
del mismo y en muchos casos, aplicarle un determinado formato (aunque existen marcas con otros
propósitos).
Las marcas más comunes están formadas por una palabra que describe su función encerrada entre los
símbolos menor que (<) y mayor que (>). Ejemplos:
<html>, <body>, <table>, etc.
Ejemplo:
Los lenguajes de marcas en sí mismos, como es el HTML, no es un lenguaje de programación, puesto que no
disponen de los elementos típicos como variables, arrays, sentencias de control, funciones, etc.
Sin embargo, los lenguajes de marcas se pueden combinar dentro del mismo documento, con otros
lenguajes como Javascript o PHP, que sí son lenguajes de programación, con el objetivo de aportar
funcionalidad y dinamismo a la página web.
HTML no especifica en sus etiquetas cómo serán representadas más tarde por el navegador. Esta es una de
las razones por la que podemos encontrar ciertas diferencias en la visualización de una misma página web,
por parte de diferentes navegadores. Los lenguajes de marca deben ser independientes del destinatario final.
Por otra parte, para independizar aún más la representación de la página web de su contenido, se creó
(Cascading Style Sheets o Hojas de estilo en Cascada) que no es un lenguaje de marcas sino de estilos.
CSS
Mediante CSS podemos especificar con mayor precisión y eficacia la representación de la información, para
cada intérprete y para diferentes soportes, como monitores, dispositivos móviles, papel, voz, etc.
Dado el auge de los dispositivos móviles, muchas páginas presentan diferentes versiones adaptadas al
dispositivo que utilice el usuario, en este caso, se trata de documentos html diferentes o bien del mismo
documento html, pero aplicándole una hoja de estilos distinta.
Ejemplo web del Museo del Prado:
Versión para móvil
versión para monitores/PC
EllWorld Wide Web Consortium, abreviado W3C, esun consorcio internacional que produce
recomendaciones para la World Wide Web (www).
Está dirigida por Tim Berners-Lee, el creador original de URL (Uniform Resource Locator, Localizador
Uniforme de Recursos), HTTP (HyperText Transfer Protocol, Protocolo de Transferencia de HiperTexto)
y HTML (Lenguaje de Marcado de HiperTexto) que son las principales tecnologías sobre las que se basa la
Web.
SGML. El origen
En los años 1960 las empresas de publicación y manejo de documentos electrónicos tenía el problema de
falta de compatibilidad entre aplicaciones. Cada aplicación utilizaba sus propias marcas para describir los
diferentes elementos, esto impedía el intercambio de documentos entre plataformas.
IBM, empresa pionera en investigación en informática y electrónica intento resolver estos problemas a
través de un lenguaje de marcas denominado SGL (Generalized Markup Language). SGL independiza el
documento del dispositivo que lo va a utilizar, usando marcas genéricas. Incorporando marcas descripticas
para la estructura del documento que permiten distinguir el texto, de las listas, las tablas, etc.
En 1986 GML pasó a manos de ISO International Oranization for Standardization (http://www.iso.org) y se
convirtió en SGML (Standard Generalized Markup Language), software libre y de código abierto.
SGML no es estrictamente un lenguaje sino un metalenguaje, es decir, un conjunto de normas que permiten
crear otros lenguajes de marcas. HTML por ejemplo, es uno de los lenguajes creados a partir de SGML.
Un documento SGML consta de 2 partes:
-
-
El prologo: contiene la estructura:
o
La declaración: indica que el documento es SGML y algunos parámetros
o
La Definición de Tipo de Documento (DTD): indica la sintaxis particular del lenguaje creado.
La instancia de documento: contiene los datos.
Ejemplo: Los módulos del Ciclo ASIR.
Vocabulario: asir, modulo,titulo,contenido,unidad
Reglas: asir contiene varios módulos, un modulo tiene un elemento simple titulo y un elemento contenido,
contenido tiene varias unidades y toda unidad debe estar en un contenido, las unidades son texto simple,
detrás de cada unidad solo puede ir otra unidad o fin de contenido, detrás de un módulo solo puede ir otro
módulo o fin de asir.
<asir>
<modulo> <titulo>Lenguajes de Marcas </titulo></modulo>
<contenido>
<unidad> Introducción </unidad>
<unidad> HTML </unidad>
<unidad> CSS </unidad>
<unidad> XML </unidad>
<unidad> XLST </unidad>
<unidad> Sindicación </unidad>
<unidad> ERP</unidad>
</contenido>
</modulo>
</asir>
Características de los lenguajes de marcas
-
Texto plano: Los archivos de texto plano son aquellos que están compuestos únicamente por
caracteres de texto a diferencia de los archivos binarios que pueden contener imágenes, sonido,
archivos comprimidos, programas compilados, etc.
-
Estos caracteres se pueden codificar con distintos códigos dependiendo del idioma o alfabeto que
se necesite, por ejemplo: ASCII, ISO-8859-15, UTF-8
-
El texto plano puede ser interpretado directamente por un simple editor de texto (ej., notepad,
nano, vi, emacs,etc) a diferencia de los binarios. Lo que les permite ser independientes del SO.
-
Compacidad. Las etiquetas de marcado se mezclan con el propio contenido, por ejemplo: <h3>
Texto con formato </h3>
-
Independencia del dispositivo final. El mismo contenido puede ser interpretado de diferentes
formas según el dispositivo final.
-
Especialización. Inicialmente los lenguajes de marcas se idearon para visualizar documentos de
texto, pero progresivamente se han empezado a utilizar en otras áreas, como interfaces de usuario,
síntesis de voz, sindicación de contenidos, etc.
-
Flexibilidad. Los lenguajes de marcas se pueden combinar en el mismo archivo con otros lenguajes
como Javascript, php, con etiquetas especiales para ellos como <script>
Clasificación de los lenguajes de marcas.
Atendiendo al tipo de marcas que utilizan:
 De presentación:
Indican el formato del texto o tipografía, sin especificar su estructura, por ejemplo aumentar el tamaño
de la fuente, centrar o cambiar a negrita.
El software que representa el documento debe interpretar el código en el mismo orden en que aparece.
Los procesadores de texto y en general las aplicaciones de edición profesional utilizan este tipo de
marcado.
Ejemplos: nroff, troff, RTF
TeX, Docbook (derivados de SGML)
 Descriptivo, estructural o semántico.
Indican las diferentes partes en las que se estructura el documento, pero sin especificar cómo
deben representarse ni en qué orden.
- XML es un metalenguaje expresamente diseñado para generar marcado descriptivo y los lenguajes
derivados de XML con este propósito son: EBML, RDF,XFML,OWL y XTM.
- Estos lenguajes crean documentos con estructura en árbol que almacenan información, por eso son
bases de datos (BD), sin embargo no usan tablas ni respetan las reglas de integridad propias de las BD
Relacionales, por ello se les llama bases de datos semiestructuradas.
Ejemplos:
•
•
ASN.1, YAML
EBML,RDF,XFML,OWL, STM (derivados de XML)
 Hibrido
Lenguajes que contienen marcas de los dos tipos anteriores indistintamente.
Ejemplos:
•
•
HTML (derivado de SGML)
XHTML,WML (derivados de XML)
Una clasificación de Lenguajes de Marcas atendiendo a su funcionalidad
−
−
−
Para crear documentación electrónica:
− RTF, TeX, troff, nroff
− ASN.1, EBML, YAML
− Wikitexto, DocBook, LinuxDoc
Tecnologías de Internet
− HTML, XHTML, WML (páginas web)
− GladeXML, XForms, XAML (formularios/interfaces de usuario)
− RSS, Atom (sindicación de contenidos)
− WSDL, SOAP, UDDI (servicios web)
− XMPP (mensajería instantánea)
De propósito especifico
− MathML, CML (fórmulas matemáticas)
− SSML, SRGS, VoiceXML (sintexis de voz)
− MusicXML (partituras de música)
− SVG, VML, X3D (gráficos vectoriales)
− SMIL (archivos multimedia)
− XLL (enlaces):
− XLINK (asociación de recursos)
− XML Base (URI básico)
− XPOINTER (localización de recursos)
− XSLT (transformación de documentos)
− XTM (mapas conceptuales)
− RDF, XFML, OWL, XMP (catalogación y clasificación de documentos, metadatos)
− GML (información geográfica)
− OFX (intercambio de información financiera
− ebXML (comercio electrónico)
− XML Dsig, XML Enc, SAML, SACML, SKMS, XrML (seguridad)
− XInclude (inclusión de archivos)
Organizaciones y estándares
Podemos definir la normalización o estandarización como el proceso de especificación de normas,
para garantizar el correcto funcionamiento de elementos construidos de forma independiente.
Aplicado al contexto de los lenguajes de marcas, sería por ejemplo el desarrollo de páginas web
atendiendo a las especificaciones oficiales del lenguaje utilizado.
Para la definición de estas normas existen organismos internacionales, nacionales incluso
organizaciones privadas. Las organizaciones más importantes son:
W3C, ISO, y Open Source
Según el propio W3C: “El World Wide Web Consortium (W3C) es una comunidad internacional que
desarrolla estándares que aseguran el crecimiento de la Web a largo plazo”.
Además de producir estándares, la Comunidad W3C ha creado Software de Código Abierto, siendo el más
conocido el validador W3C (http://validator.w3.org/), que nos será de utilidad con HTML, CSS, contenido
mobile OK y otras tecnologías.
W3C: http://www.w3c.es/
Consulta la especificación HTML 4.01: http://www.w3.org/TR/1999/REC-html401-19991224/
Introducción a los principales lenguajes de marcas
El origen de los lenguajes de marcas como ya sabemos es SGML, del cual se derivan directamente algunos
lenguajes como HTML. También se creó a partir de él por simplificación XML. Y a partir de XML se han
creado muchos lenguajes como SHTML, RSS, WML, etc.
HTML
HTML es un lenguaje destinado a la creación de páginas web, que nos permite crear en un mismo
documento, texto y contenido multimedia. Además dispone de una potente herramienta que son los
enlaces o hipervínculos, para conectar con otras páginas.
HTML fue creado por Tim Berners-Lee y su equipo alrededor de 1990 con objetivos divulgativos.
Nunca imaginaron que la web llegara a ser un área de ocio y un medio de comunicación tan potente, de
modo que inicialmente no podía dar soporte a todas las funciones que más tarde tendría que realizar.
Estas carencias, se han ido resolviendo mediante la incorporación sucesiva de
modificaciones y nuevos elementos, son las diferentes versiones de HTML. Actualmente está en
revisión la versión HTML 5.
Esta evolución poco planificada y a veces anárquica de HTML, ha supuesto una serie de
inconvenientes y deficiencias, que ha sido superados con la introducción de otras tecnologías capaces de
mejorar el funcionamiento y la organización de los sitios Web.
Ejemplos: CSS, JavaScript y los complementos de navegador tipo plugin como Flash
Otro de los problemas que tiene HTML, especialmente cuando se combina con CSS, ha sido la
diferente interpretación que hacen los navegadores de la misma página web, debido al diferente ritmo en
que los navegadores incorporan las nuevas propiedades CSS (especialmente Internet Explorer de
Microsoft). Esto ha provocado la aparición de los “hacks” que son pequeños trozos de código para
conseguir un comportamiento homogéneo en los navegadores.
Además del navegador necesario para ver los resultados de nuestro trabajo, necesitamos otra
herramienta capaz de crear la página. Un archivo HTML es texto plano, por lo que para escribir en HTML
necesitamos un simple Editor de textos (tipo notepad). Existen aplicaciones específicas para la creación de
páginas web, como Dreamweaver, que nos ofrecen muchas funcionalidades para aumentar nuestra
productividad.
No obstante, es aconsejable al principio utilizar una herramienta lo más sencilla posible, para poder
prestar atención a nuestro código en lugar de la aplicación. Uno de ellos recomendados es el notepad++
(http://notepad-plus-plus.org/), que es software libre.
Descarga la última versión e instálalo en tu equipo de trabajo.
XML
Es una simplificación y adaptación de SGML que permite definir lenguajes específicos.
Por lo tanto, XML no es un lenguaje en particular, sino una manera de definir lenguajes para diferentes
necesidades, es lo que hemos llamado un Metalenguaje.
Características:
-
Extensible: se pueden definir nuevas etiquetas
Versátil: separa contenido, estructura y presentación
Estructurado: se pueden modelar datos a cualquier nivel de complejidad
Validable: cada documento se puede validar frente a un DTD/Schema.
Abierto: independiente de empresas, SO, lenguajes de programación o entornos de desarrollo.
Sencillo: fácil de aprender y usar.
XML no se utiliza solo en Internet, sino que se está convirtiendo en un estándar para el intercambio de
información estructurada entre diferentes plataformas. Se puede usar en BDs ligeras, editores de texto,
hojas de cálculo, transacciones comerciales y en general donde se necesite almacenar información sin las
restricciones de un SGBD Relacional.
Ejemplo de un fichero XML escrito desde el Editor de texto plano Notepad++