Diseño web html

Daniel Felipe Lozano1101

Informática 2011

Páginas Web El lenguaje HTML Estructura de un documento HTML Enlaces Imágenes Colores

Fichero de (hiper)texto Indica al navegador qué y cómo presentar la

información◦ Texto

◦ Colores, imágenes, ...

◦ Enlaces

Codificado en lenguaje HTML

Editor de texto (Notepad, Wordpad)

Editor de HTML (HTMLed)

Aplicación compatible con HTML (Word, PowerPoint)

Editor de páginas Web (Composer)

Gestor de Webs (FrontPage, DreamWeaver)

Etiquetas<center> Inicio de etiqueta................ Elementos a los que afecta</center> Cierre de etiqueta

Atributos<table border="0" width="80%" ...> .............</table>

<HTML><HEAD>

<TITLE>Título</TITLE></HEAD><BODY>

Texto del documento, Gráficos, Enlaces, ...</BODY>

</HTML>

Direcciones URL◦ Ficheros de otros servidores Web

Enlaces locales◦ Ficheros en el mismo sevidor

Enlaces internos◦ Destinos en el propio fichero

Envío de mensajes de correo

<A HREF = “http://www.upv.es”>Universidad Politécnica de Valencia</A>

1. Fichero en una subcarpeta

2. Fichero en la misma carpeta

3. Fichero en una supercarpeta

1 3

2

En index.htm:Aficiones:<A HREF = “aficiones/astronomia.htm”>Astronomía</A>

En index.htm:<A HREF = “splash.htm”>Ver animación</A>

En astronomía.htm:<A HREF = “../index.htm”>Volver al principio</A>

Destino del enlace◦ <A NAME = “nombre” > texto </A>

Enlace desde el propio fichero◦ <A HREF = “#nombre”> texto </A>

Enlace desde fuera◦ <A HREF = “http://www.upv.es/fichero#nombre”>

texto </A>

Enlace a la imagen<IMG SRC = “imagen.gif” ALT = “Texto”> </IMG>

La imagen como enlace<A HREF = “dirección de destino”>

<IMG SRC = “imagen.gif”> </IMG> </A>

Borde◦ <IMG SRC = “imagen.gif” BORDER = “0”> </IMG>

Tamaño◦ <IMG SRC = “imagen.gif” BORDER = “0”> </IMG>

Alineación del texto

Sistema con 16 dígitos 1 2 3 4 5 6 7 8 9 A B C D E F #rrggbb #FFFFFF → Blanco #000000 → Negro #FFFF00 → Amarillo

Texto normal<BODY TEXT = “black”>

Texto del enlace<BODY LINK = “blue”>

Enlace visitado<BODY VLINK = “#rrggbb”>

Enlace activo (en descarga)<BODY ALINK = “#rrggbb”>

Color◦ <BODY BGCOLOR = “white”>

Imágen◦ <BODY BACKGROUND = “imagen.gif”>

Diseño web html

Education

Transcript of Diseño web html