el lenguaje html: principios básicos

16
El lenguaje HTML: Principios básicos Juan Alberto Sigüenza ETS de Informática Universidad Autónoma de Madrid

Upload: minowa

Post on 05-Jan-2016

39 views

Category:

Documents


6 download

DESCRIPTION

El lenguaje HTML: Principios básicos. Juan Alberto Sigüenza ETS de Informática Universidad Autónoma de Madrid. Características generales. Hipertexto e Hipermedia HTML: HyperText Markup Language El proceso de textos mediante marcas: Script de IBM TEX Documentos HTML: fichero ASCII - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: El lenguaje HTML: Principios básicos

El lenguaje HTML:Principios básicos

Juan Alberto SigüenzaETS de InformáticaUniversidad Autónoma de Madrid

Page 2: El lenguaje HTML: Principios básicos

Características generales

Hipertexto e HipermediaHTML: HyperText Markup LanguageEl proceso de textos mediante marcas:

Script de IBM TEX

Documentos HTML: fichero ASCIILenguajes interpretados y compilados

Page 3: El lenguaje HTML: Principios básicos

Edición de páginas HTML

Editores de propósito generalEditores asociados al navegador:

Netscape Composer MS Front Page

Editores específicos HoTMetaL

Procesadores de Texto

Page 4: El lenguaje HTML: Principios básicos

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.

Page 5: El lenguaje HTML: Principios básicos

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>

Page 6: El lenguaje HTML: Principios básicos

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>

Page 7: El lenguaje HTML: Principios básicos

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

Page 8: El lenguaje HTML: Principios básicos

Creación de listasListas no ordenadas

<UL> <LI> </UL>

Listas ordenadas <OL> <LI> </OL>

Ejemplo 2

Page 9: El lenguaje HTML: Principios básicos

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

Page 10: El lenguaje HTML: Principios básicos

Otras propiedades de las listasListas de definición

<DL> <DT> <DD> </DL>

Listas anidadas (Ejemplo 3) <UL> <LI>

<UL><LI>

Page 11: El lenguaje HTML: Principios básicos

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” >

Page 12: El lenguaje HTML: Principios básicos

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 >

Page 13: El lenguaje HTML: Principios básicos

Fondos

Pueden ser: Texturas, Imágenes y Colores

Sintaxis: <BODY BACKGROUND= “fondo.gif” > <BODY BGCOLOR= “color” >

Ejemplos 6, 7 y 8

Page 14: El lenguaje HTML: Principios básicos

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>

Page 15: El lenguaje HTML: Principios básicos

Hiperenlaces entre secciones de diferentes páginas HTMLEnlace 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>

Page 16: El lenguaje HTML: Principios básicos

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>