PROMOCION XIV

Pagina Web

Las anclas son marcadores que nos permiten enlazar a una parte concreta de un documento HTML. Cuando hacemos un enlace normal y corriente el navegador visualiza la página enlazada pero lo hace mostrando el principio de esa página. Si queremos enlazar por ejemplo al punto 5 de la página "documento.html" necesitaremos usar las anclas.

Vamos a ver cómo utilizar las anclas en DreamWeaver. Primero tendremos que abrir en DreamWeaver el archivo que vayamos a enlazar, en este caso, "documento.html".

Vamos al punto del documento que queramos enlazar, situamos el cursor y hacemos Insertar > Anclaje con Nombre, aparecerá una ventana para darle un nombre, lo llamamos "punto5". Allí donde hayamos insertado el ancla aparecerá este icono: icono ancla

Ahora vamos al documento donde queremos poner el enlace, por ejemplo en "indice.html". Allí donde queramos poner el enlace seleccionamos las palabras y en la barra de propiedades escribimos "documento.html#punto5" (suponiendo que indice.html y documento.html estén en el mismo directorio):

En cuanto a los tipos de anclajes, se puede atender a varios aspectos para establecer una tipología:

 Según su misión:

·          anclas de inicio: punto de partida de un enlace. Se ponen de manifiesto mediante señales gráficas o iconos

·          anclas de destino: punto de llegada de un enlace. Puede ser una parte o un nodo completo

 Según el destino al que apunten:

·          anclas direccionadas: activan una sección, párrafo o marco concreto del nodo de destino. Precisan de marcadores dentro del documento.

·          anclas sin direccionar: activan un documento completo sin direccionar una parte o sección concreta del documento.

 La misma clasificación anterior, pero con distinta terminología:

·          anclas de referencia: contienen la referencia del destino del hipertexto. <A HRFE="nombre del archivo destino">

·          anclas nominales: especifican puntos concretos o específicos de un documento que pueden ser referenciados usando anclas de referencia. <A HREF="#nombre"> texto del enlace </A>
En la mayoría de los casos, los enlaces apuntan a otros documentos considerados como un todo, por lo que no es necesario usar anclas nominales.

 Según el modo gráfico o morfología de activación:

·          anclas textuales: pueden adoptar distintos formatos como una letra, un número, un símbolo, una palabra, una frase u otra porción de texto, una tabla de contenido, etc. La existencia de un ancla se indica dotando de algún efecto especial al texto como:

o        subrayado

o        cambio de color

o        cambio de tipo de letra

o        otros efectos dinámicos, etc.

·          anclas no textuales

o        gráfico completo

o        porción de gráfico

o        iconos

o        metáforas gráficas, etc.

 Según el tipo de contenido o morfología de la información que activen:

·          anclas textuales: activan una sección, párrafo o documento de texto

·          anclas de gráficos estáticos: activan una imagen estática

·          anclas de gráficos animados: activan una imagen animada

·          anclas de audio: activan un recurso sonoro

·          anclas audiovisuales: activan un recurso de vídeo

·          anclas de hipertexto/hipermedia: hay que tener en cuenta que el extremo de un ancla puede ser cualquier tipo de documento o parte de él, incluso un documento HTML completo, y, por lo tanto, el contenido puede ser hipermedia.

listas y tipos

Las listas representan uno de los instrumentos más difundidos para organizar la información dentro de los sitios web. Una de sus características principales es la de proporcionar un cuadro claro y sintético del tema tratado.
HTML pone a disposición distintos tipos de listas. A continuación, analizaremos cada uno de ellos.

Listas ordenadas

 

 


Las listas ordenadas constan de una sola marca de apertura y cierre <OL></OL> y tantas marcas de lista como voces hay en el menú <LI>. La sintaxis correcta para elaborar listas ordenadas es:

<OL>
<LI> Primera voz del menú
<LI> Segunda voz del menú
<LI> Tercera voz del menú
</OL>




Listas desordenadas

 


Las listas desordenadas funcionan de manera similar a las ordenadas. La diferencia básica es que en el caso de las listas desordenadas no existen relaciones jerárquicas entre los elementos del elenco, por lo cual no se prevén ordenaciones progresivas como las obtenidas mediante números o letras.

Las listas desordenadas constan de una sola marca de apertura y cierre<UL></UL> y tantas marcas de lista como voces hay que ordenar <LI>. La sintaxis correcta para definir una lista desordenada es:

<UL>
<LI> Primera voz del menú
<LI> Segunda voz del menú
<LI> Tercera voz del menú
</UL>

Inserción de texto

Dreamweaver permite añadir texto a páginas Web escribiendo el texto directamente en una página, copiando y pegando texto de otro documento o arrastrando texto de otra aplicación.

Entre los tipos de documentos que los profesionales de la Web reciben con contenido de texto que debe incorporarse en las páginas Web, se incluyen los archivos de texto ASCII, los archivos en formato de texto enriquecido y los documentos de Microsoft Office. Dreamweaver permite extraer texto de cualquiera de estos tipos de documentos e incorporarlo a una páginaWeb.

Aplicación de formato al texto

. Todo eso se hace de forma similar desde el menú texto o desde el inspector de propiedades.

 

1. Introducción

Las imágenes son un aspecto muy importante de la web. Ya sea como complementos a la información o parte del diseño, la hacen mucho más atractiva a ojos del visitante. No obstante, no conviene abusar, ya que aumentarán mucho el tamaño final de la web.

Existen una serie de formatos de imagen más recomendables que otros para ser introducidos en una página web. Esta información puedes consultarla aquí Avanzado.

6.2. Insertar una imagen

Ver el videotutorial

 

 

Para insertar una imagen hay que dirigirse al menú Insertar, a la opción Imagen. Después de esto, ya es posible seleccionar una imagen a través de la nueva ventana. Cuando te acostumbres, te será más cómodo acceder con la combinación de teclas Ctrl + Alt + I.

 

 

 

En Relativa a es posible especificar si la imagen será relativa al documento o a la carpeta raíz del sitio. Es preferible que sea relativa alDocumento, ya que si cambiamos la página de carpeta, lo habitual es cambiar también sus imágenes.

 

Formatos de imagen

Las imágenes pueden ser de muchos formatos diferentes: bmp, gif, jpg, png, tiff, etc. Pero no todos estos formatos son adecuados para una web, debido a que pueden ocupar mucha memoria o a que no son compatibles con algunos navegadores.

Los formatos más utilizados para web son el GIF, el PNG y el JPG, que a pesar de ser imágenes de menor calidad que las imágenes BMP, son más recomendables debido a que ocupan menos memoria.

 

Si introduces una imagen no soportada en Dreamweaver, te aparecerá un cuadrado gris  en su lugar.

Puedes cambiar el formato de las imágenes mediante la utilización de algún programa de tratamiento de imágenes, como pueden ser Fireworks, Photoshop, Corel Draw, o incluso desde el propio Dreamweaver, .Dependiendo del programa utilizado existirá una mayor o menor cantidad de opciones a la hora de modificar las imágenes. Para realizar modificaciones sencillas, como la de recortar las imágenes y cambiar los colores, puedes utilizar incluso el programa Paint de Windows.

Los formularios se utilizan para recoger datos de los usuarios, nos pueden servir para realizar un pedido en una tienda virtual, crear una encuesta, conocer las opiniones de los usuarios, recibir preguntas, etc.

Una vez el usuario rellena los datos y pulsa el botón para enviar el formulario se arrancará un programa que recibirá los datos y hará el tratamiento correspondiente.

 Elementos de formulario

Los elementos de formulario pueden insertarse en una página a través del menú Insertar, opción Formulario, o lo que es más cómodo si vamos a insertar varios elementos, desde el panel Insertar en la sección Formularios.

A través de esta opción se puede acceder a la lista de todos los objetos de formulario que pueden ser insertados en la página.

Vamos a ver uno por uno algunos de los distintos elementos que pueden formar parte de un formulario, así como algunas de sus propiedades.

• Campo de texto y Área de texto

Permiten introducir texto. El Campo de texto solo permite al usuario escribir una línea, mientras que el Área de texto permite escribir varias.

Se puede pasar de Campo de texto a Área de texto a través del inspector de propiedades, marcando la opción Una línea o Multi línea respectivamente.

También es posible definirlo como Contraseña es como el campo de texto pero las letras que va tecleando el usuario se sustituyen por un carácter como podrás ver en la imagen siguiente.

A continuación tienes un ejemplo de cada uno de estos tres tipos. 

 

Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis