2. Características generales
„ Hipertexto e Hipermedia
„ HTML: HyperText Markup Language
„ El proceso de textos mediante marcas:
ƒ Script de IBM
ƒ TEX
„ Documentos HTML: fichero ASCII
„ Lenguajes interpretados y compilados
3. Edición de páginas HTML
„ Editores de propósito general
„ Editores asociados al navegador:
ƒ Netscape Composer
ƒ MS Front Page
„ Editores específicos
ƒ HoTMetaL
„ Procesadores de Texto
4. Manuales y Guías de
referencia
„ A beginners Guide to HTML (accesible en
formato PDF a través del WWW)
„ Buscar en www.uam.es en el apartado de
Internet (multitud de Manuales y Guías)
„ HTML avanzado. Bruce Morris, McGraw-
Hill, Microsoft Press.
„ Publicar con HTML en Internet. B. Heslop,
Ed. Paraninfo.
5. Las etiquetas
„ El formato general a seguir:
ƒ <etiqueta>contenido</etiqueta>
„ La inclusión de comentarios que no se ven:
ƒ <! Comentario>
„ Las etiquetas que nunca deben faltar:
ƒ <HTML></HTML>
ƒ <HEAD></HEAD>
ƒ <BODY></BODY>
6. Formateo elemental de textos
„ Encabezamientos
ƒ <H1></H1>...........<H6></H6>
„ Salto de párrafo
ƒ <P></P>
„ Centrado
ƒ <CENTER></CENTER>
„ Negrita y Cursiva
ƒ <B></B> <I></I>
7. Atributos de etiquetas
„ Alineación de párrafos
ƒ Izquierda: ALIGN=left (opción por defecto)
ƒ Derecha: ALIGN=right
ƒ Centrado: ALIGN=center
„ Utilización.
ƒ <p ALIGN=opción>
„ Ejemplo 1
8. Creación de listas
„ Listas no ordenadas
ƒ <UL>
ƒ <LI>
ƒ </UL>
„ Listas ordenadas
ƒ <OL>
ƒ <LI>
ƒ </OL>
„ Ejemplo 2
9. Añadir viñetas a las listas
„ Sintaxis general
ƒ <UL TYPE=atributo>
ƒ <OL TYPE=atributo>
„ Atributos listas no ordenadas
ƒ DISC, CIRCLE, SQUARE
„ Atributos listas ordenadas
ƒ 1, A, I
10. Otras propiedades de las listas
„ Listas de definición
ƒ <DL>
ƒ <DT>
ƒ <DD>
ƒ </DL>
„ Listas anidadas (Ejemplo 3)
ƒ <UL>
ƒ <LI>
‚ <UL>
‚ <LI>
11. Otras etiquetas
„ Línea horizontal <HR>
„ Atributos de <HR>
ƒ <HR NOSHADE SIZE=valor
WIDTH=“porcentaje” ALIGN=valor>
„ La etiqueta <BLINK> (Ejemplo 4)
ƒ <BLINK> ¡Hola Pepe! </BLINK>
„ La etiqueta <META>
ƒ <META HTTP-EQUIV= “refresh” CONTENT=
“5; url=http://www.uam.es” >
12. Inclusión de imágenes
„ Formatos principales GIF y JPEG (Ejemplo 5)
„ Sintaxis:
ƒ <IMG SRC= “imagen.gif” >
„ Atributos
ƒ <IMG SRC= “imagen.gif” HEIGHT= valor
WIDTH= valor >
„ Alineación
ƒ <IMG SRC= “imagen.gif” ALIGN= top >
13. Fondos
„ Pueden ser: Texturas, Imágenes y Colores
„ Sintaxis:
ƒ <BODY BACKGROUND= “fondo.gif” >
ƒ <BODY BGCOLOR= “color” >
„ Ejemplos 6, 7 y 8
14. Creación de hiperenlaces
„ Permiten enlazar dos páginas cualesquiera
independientemente de la ubicación de
cada una: local o en red. (ejemplo hiperenlace 1)
„ Ejemplos:
ƒ <A HREF= “http://www.elpais.es” > Diario El
País </A>
ƒ <A HREF= “pagina.html” > Página1 </A>
ƒ <A HREF= “http://www.uam.es” ><IMG
SRC= “imagen.gif” ></A>
15. Hiperenlaces entre
secciones de diferentes
páginas HTML
„ Enlace desde una página (indice de
autores.html) a una sección específica en
otro documento (autores.html). (hiperenlace 2)
ƒ Primero creamos la referencia en el primer
documento:
‚ <A HREF= “autores.html#A1” > Autor1 </A>
ƒ A continuación creamos el anclaje en el segundo
documento:
‚ <A NAME= “A1” > Autor1 </A>
16. Hiperenlaces entre
secciones de la misma
página HTML
„ Enlace desde una página (indice de
autores.html) a una sección del mismo
documento. (hiperenlace 3)
„ Primero creamos la referencia:
ƒ <A HREF= “#A1” > Autor1 </A>
„ A continuación creamos el anclaje en el
mismo documento:
ƒ <A NAME= “A1” > Autor1 </A>
