Clase de XHTML
-
Upload
duglas-oswaldo-moreno-mendoza -
Category
Documents
-
view
3 -
download
1
description
Transcript of Clase de XHTML
![Page 1: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/1.jpg)
Facilitador: DUGLAS MORENO
![Page 2: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/2.jpg)
Introducción al HTMLEl HTML ( HiperText Markup Language ) es el lenguaje utilizado para representar
documentos en la WWW (World Wide Web). Además de texto normal incluye
también, elementos multimedia (gráficos, vídeo, audio) y existen enlaces (links)
que permiten saltar a otras partes del documento o a otro sitio cualquiera de
Internet.
Otra característica muy importante de este lenguaje es que es portable, es decir,
se pueden visualizar las páginas con cualquier sistema operativo y, por supuesto
también crearlas.
Las etiquetas constituyen la filosofía de este lenguaje. Por medio de ellas se pueden
controlar los elementos tipográficos del texto, así como también la inclusión de
tablas, listas, formularios, la inserción de fotos, sonidos, fondos, los enlaces
entre otros.
![Page 3: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/3.jpg)
La sintaxis en HTML 4 y XHTML 1.0
La primera línea de todo documento HTML corresponde a la declaración del tipo
de documento, el doctype. Esta DTD (Document Type Declaration) sirve para
indicar qué versión del lenguaje HTML se ha utilizado en el documento.
Esta sería la DTD de un documento HTML 4.01 transicional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Y esta sería la DTD de un documento XHTML 1.0 estricto:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
![Page 4: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/4.jpg)
La sintaxis en XHTML 1.0El elemento <html> indica, en una página web, el inicio del contenido de la página
HTML. Esta sería la sintaxis completa en XHTML 1.0 estricto:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es" >
La codificación de los caracteresLa codificación de caracteres que se ha usado en una página web, es en un
elemento meta, en la cabecera http, y en el contenido, con el atributo charset.
En HTML 4.01 transicional:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
En XHTML 1.0 estricto:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
![Page 5: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/5.jpg)
El concepto de etiqueta (tag)
El HTML describe el aspecto visual que debe tener una página mediante la utilización
de etiquetas (tags). Las etiquetas le indicarán al navegador la posición relativa de los
elementos de la página, su tamaño, las tipografías y colores a utilizar, entre otros. Las
etiquetas son como instrucciones que le indican al navegador como mostrar la
información. Existen dos clases de etiquetas:
1-. Etiquetas vacías o Etiquetas abiertas Tiene el siguiente formato: <etiqueta>,
Se utilizan para introducir saltos de línea, líneas horizontales, y otros elementos no
asociados al formato de textos o imágenes.
2-. Etiquetas contenedora o Etiquetas cerrada Tiene el siguiente formato:
<etiqueta>….</etiqueta>,Estas etiquetas dan un formato al texto o porción del
documento que engloban.
![Page 6: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/6.jpg)
El concepto del argumento
Las etiquetas pueden especificar, por ejemplo, que cierta palabra aparezca en negrita.
Pero si queremos que cierta palabra aparezca de color rojo, necesitamos suministrar
un parámetro: el color. La mayoría de las etiquetas tienen parámetros o atributos para
indicar múltiples aspectos del formato, como el color, el tamaño, la posición, entre
otros.
El formato de una etiqueta con parámetros es el siguiente:
<etiqueta parametro1="valor1" parametro2="valor2" ... > ... </etiqueta>
Es recomendable encerrar los valores de los atributos entre comillas dobles.
En la etiqueta inicial de un elemento puede aparecer cualquier número de parejas
(legales) atributo/valor, separadas por espacios. Pueden aparecer en cualquier orden.
![Page 7: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/7.jpg)
Estructura de un documento en HMLToda página HTML debe comenzar por la etiqueta <html> y terminar con </html>.
Todo lo que figure entre estas etiquetas será interpretado por el navegador como un
documento HTML. Lo que quede fuera de ellas será, en la mayoría de los casos,
ignorado.
El documento HTML se divide siempre en dos partes: cabecera y cuerpo.
La cabecera figura entre las etiquetas <head> y </head>. En ella se especifica el
título, el autor, y otras características del documento que no se muestran físicamente
en la página y que sirven para facilitar su indexación (son lo que se conoce como
meta tags). En la cabecera también deben incluirse los scripts que necesite el
documento (JavaScript, JScript, etc.) y las definiciones de estilos (si se utilizan hojas
de estilos).
![Page 8: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/8.jpg)
Estructura de un documento en HMLEl cuerpo es la parte del documento que se circunscribe entre las etiquetas <body>
y </body>. En esta parte se incluye la página propiamente dicha. Ejemplo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Mi primera pagina HTML</title>
</head>
<body>
Mi primera página HTML
</body>
</html>
![Page 9: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/9.jpg)
Uso de las Etiquetas dentro del Head
Dentro de la etiqueta de cabecera <head>, se pueden utilizar algunas etiquetas que
permiten, colocar las especificaciones de la pagina, la codificación o el juego de
caracteres, el titulo de la pagina entre otras opciones.
Uso de la etiqueta <meta>
La etiqueta <meta> proporciona metadatos sobre el documento HTML. Los
metadatos no se muestra en la página, pero será apta para su procesamiento
máquina. Meta elementos se utilizan normalmente para especificar descripción de
páginas, palabras clave, autor del documento, la última modificación, y otros
metadatos. Los metadatos pueden ser utilizados por los navegadores (como mostrar
el contenido de la página), los motores de búsqueda (palabras clave), u otros
servicios web.
![Page 10: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/10.jpg)
Uso de la Etiqueta <meta>
<meta name="keywords" content="HTML, CSS, XML, XHTML">
Se realiza la definición de palabras para los motores de búsqueda.
<meta name="description" content="Curso de Html">
Se define la descripción de la pagina.
<meta name="author" content="Duglas Moreno">
Se define el autor de la pagina
<meta http-equiv="refresh" content="30">
Actualiza la pagina cada cierto tiempo
<meta charset="UTF-8">
Codificación o juego de caracteres.
![Page 11: Clase de XHTML](https://reader036.fdocuments.ec/reader036/viewer/2022082817/55cf928f550346f57b976c08/html5/thumbnails/11.jpg)
Uso de la Etiqueta <body> </body>
El <body> define el cuerpo del documento.
El elemento <body> contiene todo el contenido de un documento HTML, como texto,
hipervínculos, imágenes, tablas, listas, entre otros.
Entres los atributos del body que se encuentra son:
Alink, bgcolor, link, text, vlink donde el valor de cada uno de estos atributos es el
color.
Background en donde el valor de este atributo es una dirección o url.