Xhtml

Introducción a XHTML César F. Acebal Universidad de Oviedo www.cesaracebal.com Curso de CSS avanzado

Separación entre presentación y contenido ,[object Object],[object Object],[object Object],[object Object],[object Object]

Salvando las limitaciones del HTML ,[object Object],[object Object],[object Object],[object Object]

Salvando las limitaciones del HTML ,[object Object],[object Object],[object Object],[object Object],[object Object]

Extensiones de HTML propietarias ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Convertir texto en imágenes ,[object Object],[object Object],[object Object],[object Object],[object Object]

Accesibilidad ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Tiempo de espera ,[object Object],[object Object]

Colocar texto en tablas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Escribir un programa en vez de usar HTML ,[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos ,[object Object],[object Object],[object Object],[object Object],Nombre atributo <a href=“aficiones.html”>Aficiones</a> Nombre elemento Valor atributo CONTENIDO ATRIBUTO ETIQUETA DE INICIO ETIQUETA DE FIN ELEMENTO

Sintaxis de los elementos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Sintaxis de HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Permisividad de los navegadores ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

XML Puesto que afirmamos que XHTML es XML, comentaremos rápidamente algunos conceptos muy básicos de éste, como son la diferencia que hace entre buena formación y validez de los documentos.

Buena formación ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Validez ,[object Object],[object Object],[object Object],[object Object]

Estructura de un documento HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Declaración de XML ,[object Object],[object Object],[object Object],<?xml version=“1.0” encoding=“ISO-8859-1” ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/ xhtml1/DTD/xhtml1-strict.dtd "> <html> ... </html>

Versiones de HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Tipos de elementos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos de XHTML A continuación, iremos viendo qué elementos define la especificación XHTML y cómo éstos pueden combinarse (son las reglas a las que deberemos ajustarnos para crear el contenido de nuestras páginas Web).

Elemento <title> ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elemento <title>. Consejos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos de bloque ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elemento <body> ,[object Object],[object Object],[object Object]

Elementos de título: <h1>, <h2>… <h6> ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

A propósito de los elementos de título ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Ejemplo del uso de títulos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Párrafos: elemento <p> ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Ejercicio ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Texto preformateado: <pre> ,[object Object],[object Object],[object Object],[object Object],[object Object]

Citas de bloque: <blockquote> ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Tipos de listas en HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Listas ordenadas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Listas desordenadas ,[object Object],[object Object],[object Object],[object Object],[object Object]

Listas de definición ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Listas de definición ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Ejercicio ,[object Object],The ingredients: • 100 g. flour • 10 g. sugar • 1 cup water • 2 eggs • salt, pepper The procedure: 1. Mix dry ingredients thoroughly. 2. Pour in wet ingredients. 3. Mix for 10 minutes. 4. Bake for one hour at 300 degrees. Notes: The recipe may be improved by adding raisins.

Elementos de línea ,[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos lógicos y físicos ,[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos físicos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elementos lógicos ,[object Object],[object Object],[object Object],[object Object]

Elementos lógicos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Entidades de carácter ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Algunas entidades de carácter ¡ ¡ ¿ ¿ Ñ Ñ ñ ñ ... Á Á ... é é á á — — - &rdash; € € © ©   > > < < & & “ "

URL ,[object Object],[object Object],[object Object],[object Object],[object Object],protocolo://dirección del sitio[:puerto]/directorio/fichero

Protocolo ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Protocolos más utilizados Permite enviar un correo electrónico mailto Páginas Web http File Transfer Protocol ftp Permite acceder a un fichero en el sistema de ficheros local file

Dirección del sitio ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Directorio ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Nombre del fichero ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Nombre del fichero ,[object Object],[object Object],[object Object]

Puerto ,[object Object],[object Object],[object Object],[object Object],[object Object]

Enlaces en HTML ,[object Object],<a href=“URL del documento destino” title=“Descripción del enlace”>Texto del enlace</a>

URL relativos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

El enlace “mailto” ,[object Object],[object Object],[object Object],[object Object],[object Object]

Ejercicio ,[object Object],[object Object],[object Object],[object Object],[object Object]

Ejercicio (cont.) ,[object Object],informática imágenes artículos apuntes

Ejercicio (cont.) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Introducción ,[object Object],[object Object],[object Object],[object Object],[object Object],2 24 = 16 M. de colores 24 bits por píxel Color verdadero 2 16 = 65535 colores 16 bits por píxel Alta resolución 2 8 = 256 colores 8 bits por píxel SVGA 2 4 = 16 colores 4 bits por píxel VGA

Tipos de imágenes ,[object Object],[object Object],[object Object],= CIRCLE(50, red)

Mapas de bits ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

GIF ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],.gif

JPEG ,[object Object],[object Object],[object Object],[object Object],.jpg, .jpeg

Tiempos de respuesta ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Imágenes en HTML ,[object Object],<img src=“URL” alt=“Texto alternativo” width=“ancho” height=“alto”/>

Atributo alt ,[object Object],[object Object],[object Object]

Atributos height y width ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Ejercicio ,[object Object],[object Object],[object Object]

Xhtml

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Destaque

Destaque (8)

Semelhante a Xhtml

Semelhante a Xhtml (20)

Último

Último (20)

Xhtml