EDITAR PÁGINAS WEB

INICIO
IMAGENES
ENLACES
TABLAS
FRAMES
MULTIMEDIA
MAPAS
FORMULARIOS

ENLACES
Es el principal uso del hipertexto. Permite marcar palabras, frases, imágenes que al ser seleccionados nos traslada a otros documentos o a otras zonas del mismo documento. Podemos enlazar con páginas locales o con paǵinas de la www, basta con poner la ruta en el primer caso y la dirección en el segundo.

ACTIVIDAD 1 : HACER UN ENLACE A LA PÁGINA INICIAL DE GOOGLE

Si pulsamos el enlace (aparece una mano al pasar sobre él y está en azul y subrayado) nos iremos a la página deseada.
A partir de ahora el enlace será de color violeta (porque ya ha sido usado).

Estas opciones pueden cambiarse en formato>Color y fondo de página para todos los enlaces del documento.

Observamos el código:
La etiqueta resaltada es la
que hace referencia a un hiperenlace

< a href = "dirección">
texto del enlace
</a>

Esto va a ser muy útil cuando hagamos
marcos (frames).
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title></title>
</head>
<body>
Hola amigos<br>
<a href="http://www.google.com">Enlace con Google</a><br>
</body>
</html>

ACTIVIDAD 2 : HACER UN ENLACE ENTRE DOS PÁGINAS LOCALES

Para ello solamente necesito hacer dos páginas cualesquiera (con texto, imágenes, lo que quiera...) con nombres pagina1 y pagina2 (o los que yo le haya puesto).

Vamos a hacer un enlace desde el archivo pagina1 hacia el archivo pagina2.


ACTIVIDAD 3 : HACER UN ENLACE DESDE UNA IMAGEN. ÁLBUM DE FOTOS

Basta con insertar previamente una imagen y seguir el mismo procedimiento. Se puede o no usar texto alternativo or si la imagen no se puede mostrar en el navegador. Se puede jugar con el tamaño, alineación de texto, etc desde el menú imagen.
Observar el código: no hay diferencia <a href > >/a>

Hagamos una actividad consistente en jugar con las dimensiones de las imágenes. En una página vamos a abrir con varias imágenes pequeñitas sacads de un tema de google y les vamos a hacer enlaces a archivos de imagenes para que al pulsarlas se vean más grandes.

NOTA: Se puede hacer enlaces distintos con trozos distintos de una misma imagen (MAPAS).






Al hacer enlaces podemos dirigir el resultado a la ventana que deseemos escribiendo en el código fuente del hiperenlace antes de cerrar la etiqueta target= " opción que corresponda":

etiqueta
Resultado
target="nombre de ventana"
Muestra el enlace en la ventana que se nombra
target="_blank"
Muestra el hiperenlace en una nueva ventana en blanco sin cerrar la existente
target="_self"
Lo muestra en la ventana activa. Mismo resultado si no se pone nada.
target="_parent"
En la ventana  previa a la actual (cuando veamos frames). Si no hay como top
target="_top"
A pantalla completa, suprimiendo todas las subventanas"

Aunque estas opciones se entenderán mejor cuando veamos frames, de momento la diferencia entre
<a href="../../fotos/cupula.jpg" target="_blank"> y <a href="../../fotos/nocheenparis.jpg"> puede apreciarse en  las imágenes anteriores: las tres primeras tienen target="_blank" y la última no tiene nada.