xhtml. xhtml, acrónimo inglés de extensible hypertext markup language (lenguaje extensible de...

22
XHTML

Upload: primo-salcedo

Post on 23-Jan-2016

233 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

XHTML

Page 2: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

XHTML

XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado para sustituir a HTML como estándar para las paginas web.

Un lenguaje de marcado nos permite dejar indicaciones (marcas) en un documento que sirven para diferenciar distintos tipos de contenidos, estructuras o secciones.

Está ideado para mantener una saludable separación entre el contenido y el diseño.

El XHTML está diseñado para que sea funcional no sólo a los navegadores sino a varios dispositivos WEB (teléfonos móviles, portátiles, etc).

Page 3: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Cinco restricciones básicas que introduce XHTML respecto a HTML en la sintaxis de sus etiquetas:

-Las etiquetas se tienen que cerrar de acuerdo a como se abren.

-Los nombres de las etiquetas y atributos siempre se escriben en minúsculas.

-El valor de los atributos siempre se encierra con comillas.

-Los atributos no se pueden comprimir.-Todas las etiquetas deben cerrarse

siempre.

Page 4: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Algunos ejemplos de los aspectos más importantes a tener en cuenta a la hora de utilizar XHTML.

-Los documentos deben estar bien formados:

-Código de elementos anidados:<p>Ejemplo de elementos bien

<em>anidados</em>.</p><p>Ejemplo de elementos mal

<em>anidados</p>.</em>

Page 5: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Los nombres de atributos y elementos deben ir en minúsculas:

<body>Ejemplo correcto</body><BODY>Ejemplo incorrecto</BODY>

Los elementos que no estén vacios necesitan etiquetas de cierre:

<p>Ejemplo correcto.</p><p>Ejemplo correcto.</p><p>Ejemplo incorrecto.<p>Ejemplo

incorrecto.</p>

Page 6: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Los valores de las etiquetas deben ir siempre entre comillas:

<table rows="3"><table rows=3> ejemplo incorrecto

Page 7: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Por ejemplo, un documento en XHTML 1.1 podría especificarse de la siguiente forma:

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE

html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es"> <head><title>Título</title></head><body> . . . </body></html>

Page 8: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

CSSCascading Style Sheets

hojas de estilo en cascada.

Page 9: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Tiene la finalidad de separar el contenido y la estructura de los documentos web, de su presentación, este lenguaje permite que la estructura de datos quede completamente separada de la presentación, ya que su función es darle formato visual a cada parte del documento web.

Es 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án de estándar para los agentes de usuario o navegadores.

Page 10: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

LOS TRES TIPOS DE ESTILOS

CSS proporciona tres caminos diferentes para aplicar las reglas de estilo a una página Web:

1.-Una hoja de estilo externa, que es una hoja de estilo que está almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web.

2.-Una hoja de estilo interna, que es una hoja de estilo que está incrustada dentro de un documento HTML. (Va a la derecha dentro del elemento <head>). De esta manera se obtiene el beneficio de separar la información del estilo, del código HTML propiamente dicho.

Page 11: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

3.-Un estilo en línea, que es un método para insertar el lenguaje de estilo de página, directamente, dentro de una etiqueta HTML. Esta manera de proceder no es excesivamente adecuada. El incrustar la descripción del formateo dentro del documento de la página Web, a nivel de código se convierte en una tarea larga, tediosa.

Page 12: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

RECOMENDACIONES DEL W3C

Cascading Style Sheets, nivel 1 (CSS1), Diciembre de 1996

Propiedades de fuentes Propiedades de color y fondo Propiedades de texto

espaciado de palabras alineación

Propiedades de caja Margen Borde Relleno

Propiedades de clasificación visualización listas

Page 13: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

En el siguiente ejemplo se puede ver el código de una página HTML titulada Ejemplo vinculada a una CSS externa llamada estilo.css :

Guía de referencia rápida CSShttp://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

Page 14: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

JAVASCRIPT

Page 15: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

JavaScript es un lenguaje de programación interpretado, es decir, que no requiere compilación, utilizado principalmente en páginas web, con una sintaxis semejante a la del lenguaje Java y el lenguaje C.

Al igual que Java, JavaScript es un lenguaje orientado a objetos propiamente dicho, ya que dispone de Herencia, si bien esta se realiza siguiendo el paradigma de programación basada en prototipos, ya que las nuevas clases se generan clonando las clases base (prototipos) y extendiendo su funcionalidad.

Page 16: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Todos los navegadores modernos interpretan el código JavaScript integrado dentro de las páginas web. Para interactuar con una página web se provee al lenguaje JavaScript de una implementación del DOM.

El lenguaje fue inventado por Brendan Eich en la empresa Netscape Communications, que es la que desarrolló los primeros navegadores web comerciales. Apareció por primera vez en el producto de Netscape llamado Netscape Navigator 2.0.

Page 17: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Tradicionalmente, se venía utilizando en páginas web HTML, para realizar tareas y operaciones en el marco de la aplicación únicamente cliente, sin acceso a funciones del servidor. JavaScript se ejecuta en el agente de usuario al mismo tiempo que las sentencias van descargándose junto con el código HTML.

Los autores inicialmente lo llamaron Mocha y más tarde LiveScript pero fue rebautizado como JavaScript en un anuncio conjunto entre Sun Microsystems y Netscape, el 4 de diciembre de 1995.

Page 18: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

En 1997 los autores propusieron JavaScript para que fuera adoptado como estándar de la European Computer Manufacturers' Association ECMA, que a pesar de su nombre no es europeo sino internacional, con sede en Ginebra. En junio de 1997 fue adoptado como un estándar ECMA, con el nombre de ECMAScript. Poco después también lo fue como un estándar ISO.

JScript es la implementación de ECMAScript de Microsoft, muy similar al JavaScript de Netscape, pero con ciertas diferencias en el modelo de objetos del navegador que hacen a ambas versiones con frecuencia incompatibles.

Page 19: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Para evitar estas incompatibilidades, el World Wide Web Consortium diseñó el estándar Document Object Model (DOM, ó Modelo de Objetos del Documento en castellano), que incorporan Konqueror, las versiones 6 de Internet Explorer y Netscape Navigator, Opera versión 7, y Mozilla desde su primera versión.

 

Page 20: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

Javascript se puede incluir en cualquier documento HTML, o todo aquel que termine traduciéndose en HTML en el navegador del cliente; ya sea PHP, ASP,JSP,SVG... Incluir código directamente en una estructura HTML es una práctica invasiva, y no recomendada. El método correcto que define la W3C es incluir javascript como un archivo externo, tanto por cuestiones de accesibilidad, como practicidad y velocidad en la navegación. Bastará con escribir en el documento HTML:

<script type="text/javascript" src="[URL]"></script>

Siendo [URI] la URI relativa o absoluta del recurso con código JavaScript, el cual tendrá extensión js.

Page 21: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado

También es posible incluir código directamente en el documento entre los elementos <script> y </script>, aunque no se recomienda:

<script type="text/javascript"><!-- // código JavaScript --></script>

Para validar el código en un validador HTML es necesario incluir los comentarios HTML ‹!-- y --> para que no se interpreten los símbolos < y > como inicio y fin de etiqueta.

Page 22: XHTML. XHTML, acrónimo inglés de eXtensible Hypertext Markup Language (lenguaje extensible de marcado de hipertexto), es el lenguaje de mercado pensado