2.

1 Introduccion a paginas web

La "Web", apcope de "World Wide Web" (que se abrevia con las siglas www), es
uno de los mtodos que Internet ofrece para explorar documentos conectados a
travs de hipervnculos.
El concepto de la Web se perfeccion en el CERN (Centre Europen de
Recherche Nuclaire) en 1991 por un grupo de investigadores, entre ellos el
creador del sistema de hipervnculos, Tim Berners-Lee, a quien actualmente se
considera como el padre de la Web.

El principio de la Web se basa en el uso de hipervnculos para navegar entre

documentos (que se llaman "pginas Web") mediante un programa
llamadonavegador. Una pgina Web es un archivo de texto simple escrito en un
lenguaje de marcado llamado HTML que permite, a travs de etiquetas, describir
el diseo del documento, sus elementos grficos o los vnculos a otros
documentos.
Aparte de los vnculos que conectan documentos formateados, la Web usa el
protocolo HTTP para establecer vnculos con documentos alojados en equipos
distantes
(que
se
denominan servidores
web,
en
contraposicin
al clienterepresentado por el navegador). Los documentos en Internet se
identifican con una direccin nica llamada URL que permite que un recurso se
localice independientemente del servidor de Internet donde se aloje.

Un sitio Web (tambin conocido como sitio de Internet o pgina de inicio si es un

sitio personal) es un grupo de archivos HTML almacenados en un equipo que est
siempre conectado a Internet (un servidor Web).
Por lo general, un sitio Web se construye alrededor de una pgina central, la
"pgina de bienvenida", que ofrece vnculos a un conjunto de pginas alojadas en
el mismo servidor y, a veces, a vnculos "externos" que llevan a pginas alojadas
en otro servidor.

2.2 Elementos de una pagina web

. ELEMENTOS BSICOS DE UNA PGINA WEB

Independientemente del programa que se use para la creacin de pginas
Web, stas pueden
contener los mismos elementos, por ejemplo:
Texto: esttico o en movimiento.
Imgenes: fijas o animadas.
Sonidos.
Secuencias de vdeo.

TEXTO
El texto, componente fundamental de las pginas Web, lo generamos
teclendolo (aunque tambin
se puede copiar desde cualquier otro programa y pegarlo).
Hay una serie de reglas que debemos tener en cuenta con respecto al texto:
Su objetivo es la legibilidad (parece una obviedad, pero no es inusual
encontrar pginas en Internet que prcticamente no se pueden leer).
En las pginas Web hay que reservar el subrayado exclusivamente para los
enlaces. En general, la cursiva es el formato apropiado para titulares y funciona
bien para enfatizar. Cuando quiera destacar una palabra, emplee negrita o
cursiva. El uso abusivo de demasiados estilos produce un efecto estrambtico.
Reserve los tipos de negrita y letra grande para los titulares, los cuales deben
destacar sobre el resto de la pgina. En resumen, podemos darle al texto
distintas apariencias, pero debemos tener la precaucin de utilizar tipos de
letra que resulten claramente legibles para que no resulte pesada la lectura de
sus pginas. Un aspecto a tener en cuenta es que el texto debe contrastar
claramente con el fondo que elija para sus pginas y que los tipos de letra
(fuentes) que se utilicen garanticen la legibilidad del mismo. Existen fuentes de
gran valor artstico, pero su funcin, en ocasiones, es meramente esttica, en
detrimento de su misin primordial: la de ser legibles. Por otra parte, si
empleamos una fuente que el navegante de nuestra pgina no tiene en su
equipo no la ver exactamente como la hemos diseado. Cada carcter, en
cualquier fuente, consta de una letra, un nmero o un smbolo junto con una
cierta cantidad de espacio blanco alrededor. Las fuentes proporcionales y de
ancho fijo difieren en la cantidad de espacio que ocupa cada carcter.

Las proporcionales se denominan as porque cada carcter tiene un ancho

diferente (como ocurre con el texto de este escrito) y, por lo tanto, emplea una
cantidad de espacio proporcional a su tamao. La cantidad de espacio que una
palabra ocupa en una lnea depende de qu letras contiene, no de cuntas
letras contiene. Ejemplo: Times New Roman es una fuente proporcional, por lo
que la letra i ocupa menos espacio que la w iiiiiiiiii wwwwwwwwww (no
ocupan el mismo espacio diez letras i que diez w). Las fuentes de ancho fijo
emplean letras que ocupan una cantidad igual de espacio. Por ejemplo: Courier
es una fuente de ancho fijo, por lo que diez i ocupan igual que diez w
iiiiiiiiii wwwwwwwwww. Esta fuente tiene la apariencia del texto de una mquina
de escribir o de un telegrama
INSERTAR IMGENES
Para insertar una imagen en el documento seleccionar la opcin de men
Insertar >> Imagen, se
mostrar la siguiente caja de dilogo, con diversas solapas:

Fig 2.2 muestra como insertar una imagen en tun sitio web

Ubicacin: se indica de dnde tomar la imagen, pulsando en el botn Elegir

archivo, se explora el sistema de archivos para seleccionar la imagen. Tambin se
indica el texto alternativo que se mostrar de la imagen y un texto de ayuda
cuando se pase el ratn por encima.

 Dimensiones: se puede cambiar el tamao de la imagen.

Apariencia: se establecen las distancias entre la imagen y el texto, as como la
alineacin del texto alrededor de la imagen.
Enlace: se puede establecer un hipervnculo para la imagen.
Botn Edicin avanzada: para establecer opciones avanzadas como atributos
HTML, eventos de JavaScript, estilos, etc.
Una vez insertada la imagen, se pueden establecer sus propiedades haciendo
doble pulsacin sobre ella, seleccionando la opcin de men Formato >>
Propiedades de la imagen o a travs del men contextual.
En este ejercicio que os proponemos vamos a aprender a insertar imgenes de
varios tipos. Una imagen fija, un gif animado y una imagen de fondo ser nuestra
prxima propuesta.Antes de cada ejercicio os daremos una breve introduccin de
cada apartado por lo que os aconsejamos leis con atencin todo el documento.
Seguimos trabajando sobre la pgina creada con la Web para la webcurso
(index.htm).
Las imgenes en las pginas Web las colocamos:
Dentro de la pgina y
Como fondo de la misma.
Primero vamos a ver la insercin de imgenes en la pgina y, posteriormente, la
eleccin de imgenes de fondo.
Las imgenes funcionan ms o menos como en un procesador de textos. En las
pginas Web se suelen utilizar los formatos siguientes:
GIF. Para dibujos e imgenes con pocos colores. Este formato nos permite elegir
un color transparente y hacer animaciones.
JPEG o PNG. Para fotos e imgenes que requieren ms calidad. No obstante, no
permite transparencias ni animaciones.Para incluir imgenes en una pgina de
NVU podemos copiarlas en el portapapeles con otro programa (por ejemplo
alguno de dibujo, un procesador de textos,...) y luego pegarla en la pgina Web
que estamos diseando. Cada uno emplear el mtodo que vea ms cmodo y
que le sea ms usual (recordamos que una misma cosa se puede hacer de varias
formas). Nosotros vamos a seguir con nuestra costumbre: primero copiamos en la
carpeta que nos interesa el/los archivos elegidos y, posteriormente, los incluimos
en nuestra pgina. Antes de nada vamos a crear una carpeta para incluir en ella
todas las imgenes de nuestra Web en la carpeta webcurso, de modo que la ruta
quede de la manera siguiente C:\Documents and Settings\Nombre_de_usuario\Mis
Documentos\webcurso\imagenes, los archivos de imgenes podremos
descargarlos desde Internet o bien copiarlos en dicha carpeta desde la ubicacin
que tengan en nuestro ordenador.
Una vez hecho esto, para insertar una imagen en una pgina, procederemos tal y
como se ha comentado al comienzo de este apartado, mostrndose a
continuacin una pantalla como la siguiente, teniendo dos opciones:

La primera ser insertar una imagen desde la carpeta imgenes que hemos
comentado previamente, para lo cual haremos clic en Elegir archivo

Fig 2.2 Muestra como seleccionar un archivo para subir una imagen
La segunda ser indicar una direccin url en donde se encuentre la imagen a
insertar. Por ejemplo, buscamos una imagen de la Catedral de Mlaga en el banco
de imagenes del CNICE, cuya utilizacin para usos educativos esta permitida,
evitndonos de camino problemas con los derechos de autor.

3.2