DISEÑO DE PÁGINAS WEB HTML Y CSS Tema 1: Introducción Jose Miguel Vidagany Igual.

Presentación del tema: "DISEÑO DE PÁGINAS WEB HTML Y CSS Tema 1: Introducción Jose Miguel Vidagany Igual."— Transcripción de la presentación:

1 DISEÑO DE PÁGINAS WEB HTML Y CSS Tema 1: Introducción Jose Miguel Vidagany Igual

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 Las etiquetas  El formato general a seguir:  contenido  La inclusión de comentarios que no se ven:   Las etiquetas que nunca deben faltar: 

5 Formateo elemental de textos  Encabezamientos ...........  Salto de párrafo   Centrado  *  Negrita y Cursiva 

6 Atributos de etiquetas  Alineación de párrafos  Izquierda: ALIGN=left (opción por defecto)  Derecha: ALIGN=right  Centrado: ALIGN=center  Utilización.   Ejemplo 1

7 Creación de listas  Listas no ordenadas   Listas ordenadas   Ejemplo 2

8 Añadir viñetas a las listas  Sintaxis general   Atributos listas no ordenadas  DISC, CIRCLE, SQUARE  Atributos listas ordenadas  1, A, I

9 Otras propiedades de las listas  Listas de definición   Listas anidadas (Ejemplo 3) 

10 Otras etiquetas  Línea horizontal  Atributos de   La etiqueta (Ejemplo 4)  ¡Hola Pepe!  La etiqueta 

11 Inclusión de imágenes  Formatos principales GIF y JPEG ( Ejemplo 5 )  Sintaxis:   Atributos   Alineación 

12 Fondos  Pueden ser: Texturas, Imágenes y Colores  Sintaxis:   Ejemplos 6, 7 y 8

13 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:  Diario El País  Página1 

14 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: Autor1  A continuación creamos el anclaje en el segundo documento: Autor1

15 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:  Autor1  A continuación creamos el anclaje en el mismo documento:  Autor1