Dreamweaver

Hiperenlaces (Para que sirven y como crearlos) Imgenes (Como insertar e imagen especiales)

Hiperenlaces (Para que sirven y como crearlos)

Vamos

a ver qu son los hiperenlaces, para qu sirven y cmo crearlos, ya que son un elemento esencial para cualquier pgina web. Un hiperenlace, hipervnculo, o vnculo, no es ms que un enlace, que al ser pulsado lleva de una pgina o archivo a otra pgina o archivo. Es posible asignar un vnculo a un texto, a una imagen, o a parte de una imagen.

Tipos de enlaces

Tipos de Enlaces: Existen diferentes clases de rutas de acceso a la hora de definir los vnculos. Referencia absoluta: Conduce a una ubicacin externa al sitio en el que se encuentra el documento. La ubicacin es en Internet, por ejemplo, "http://www.aulaclic.com". Referencia relativa al sitio: Conduce a un documento situado dentro del mismo sitio que el documento actual. Referencia relativa al documento: Conduce a un documento situado dentro del mismo sitio que el documento actual, pero partiendo del directorio en el que se encuentra el documento actual. Puntos de fijacin: Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Para ello el vnculo debe ser "nombre_de_documento#nombre_de_punto". El punto se define dentro de un documento a travs del men Insertar, opcin Anclaje con nombre.

Como crear enlaces

La forma ms sencilla de crear un enlace es a travs del inspector de propiedades. Para ello es necesario seleccionar el texto o el objeto que va a servir de enlace, y seguidamente establecer el Vnculo en el inspector. Por ejemplo, aqu hay un enlace a www.elpais.es, que es de referencia absoluta, por eso contiene HTTP://

Otra Forma

Otra forma de crear un enlace es a travs del men Insertar, opcin Hipervnculo. Es posible crear tambin vnculos vacos, que pueden ser tiles cuando se utilizan comportamientos, etc. Para ello es necesario escribir en Vnculo nicamente una almohadilla '#'. Otra forma de crear un enlace es a travs del men Insertar, opcin Hipervnculo.

Crear vnculos de esta forma es muy sencillo, slo debers rellenar los campos que explicaremos a continuacin y el enlace se colocar en el lugar en el que estaba situado el cursor.

Texto: es el texto que mostrar el enlace Vnculo: es la pgina a la que ir redirigida el enlace, si se trata de un enlace externo debers escribirla empezando siempre por HTTP://. Haz clic sobre el icono de carpeta para buscar los archivos que existan dentro del sitio. Por defecto dramweaver te crear un enlace relativo al documento. Si quieres que los enlaces sean relativos al sitio visita este avanzado. Destino: la pgina donde se abrir la pgina, este campo se explica en el siguiente apartado. Ttulo: se trata de la ayuda contextual del vnculo, es equivalente al atributo ALT de las imgenes. Tecla de acceso: atributo que facilita la accesibilidad a las pginas, habilita el acceso al enlace mediante la pulsacin de la tecla Alt ms la tecla de acceso indicada. ndice de tabulador: Como habrs podido observar puedes saltar a travs de los enlaces pulsando la tecla Tabulador. En este campo podrs establecer un ndice indicando la prioridad del enlace y as configurar el modo en el que actuar el Tabulador es sus diferentes saltos.

Imgenes (Como insertar e imagen especial )

En este tema vamos a ver cmo insertar imgenes en un documento. Tambin veremos cmo crear algunas imgenes especiales, como es el caso de los Rollovers y los botones flash, que ayudan a mejorar la apariencia de nuestras pginas. Todas las pginas web acostumbran a tener un cierto nmero de imgenes, que permiten mejorar su apariencia, o dotarla de una mayor informacin visual. Existen una serie de formatos de imagen ms recomendables que otros para ser introducidos en una pgina web

Insertar una imagen

Para insertar una imagen hay que dirigirse al men Insertar, a la opcin Imagen. Despus de esto, ya es posible seleccionar una imagen a travs de la nueva ventana.

Insertar una imagen

Si por algn motivo se desea insertar un BMP, este no aparecer a no ser que en Tipo se seleccione Todos los archivos. En Relativa a es posible especificar si la imagen ser relativa al documento o a la carpeta raz del sitio. Es preferible que sea relativa al Documento, ya que si se mueve todo el sitio a una ubicacin diferente, la imagen puede no verse al estar siendo buscada en la ubicacin anterior. Lo mismo ocurre cuando se selecciona un documento para crear un vnculo. La ruta en la que se encuentra la imagen aparecer representada de una u otra forma en el campo URL de la ventana y en el campo Origen del inspector de propiedades, dependiendo de si ha sido insertada como relativa a la carpeta raz del sitio o relativa al documento. Por ejemplo, imagina que dentro de la carpeta raz del sitio (la carpeta del sitio) se encuentran la carpeta imgenes y el documento en el que deseamos insertar la imagen. Dicha imagen, llamada aulaclic.jpg, se encuentra dentro de la carpeta imgenes. En el caso de insertar la imagen como relativa al Documento la ruta sera: imgenes/aulaclic.jpg Mientras que en el caso de ser insertada como relativa a la Raz del sitio la ruta sera: /imagenes/aulaclic.jpg Ocurre lo mismo que cuando se crea un hipervnculo a un documento relativo al documento o a la carpeta raz del sitio. Si se inserta un BMP en un documento, este no aparece correctamente en Dreamweaver, aunque s en el navegador. En Dreamweaver aparecer de la siguiente forma: Esa misma imagen es la que aparece en Dreamweaver cuando no se encuentra una imagen que haba sido insertada. Esto puede ocurrir si se ha modificado el nombre de la imagen, o si se ha movido de directorio, desde fuera de Dreamweaver. En ese caso, la imagen que aparecer en el navegador ser similar a esta: Aparece un recuadro blanco con una X roja, junto con el nombre de la imagen o el contenido del campo Alt del inspector de propiedades, que explicaremos a continuacin.

Propiedades de una Imagen

Cuando

seleccionamos una imagen el Inspector de propiedades muestra esta apariencia:

Desde aqu podrs acceder a distintas propiedades: Desde el campo Alt podrs asignarle una ayuda contextual a la imagen, esta se mostrar cuando coloques el ratn sobre ella, y es muy til de cara a hacer pginas accesibles ya que el texto que se escribe ser ledo por los programas lectores para invidentes. Tambin es muy til, como ya hemos visto, si la imagen por alguna razn no puede mostrarse. En Clase podrs asignarle un estilo que hayas creado anteriormente, as podrs darle alineacin, bordes e incluso tamao con slo un clic. Si le damos un valor al campo Vnculo convertiremos al imagen en un link a otra pgina. Para enlaces externos recuerda que debe empezar siempre por HTTP:// y si deseas crear un vnculo a un enlace electrnico deber empezar por mailto: En caso de que le hayas asignado un vnculo podrs decidir en qu ventana quieres que se abra seleccionando un valor en el campo Destino. Puedes asignarle un tamao de borde desde el campo Borde. Y puedes seleccionar su alineacin con respecto al texto desde el campo Alinear. Por ltimo las opciones Espacio V y Espacio H te sern muy tiles para separar la imagen del texto y as no queden demasiado pegadas a l. Estos campos indican el espacio vertical y horizontal respectivamente entre la imagen y el texto.