Mostrar animaciones hechas en formato flash en
las páginas, usar códigos que validen correctamente, como extraer los archivos
SWF de las páginas para usarlos sin conexión y crear ejecutables.
Los objetos flash, son archivos que poseen la
extensión .swf, son hechos para contenido y aplicaciones interactivas de uso
principalmente en la web, donde son reproducidos por los navegadores, pero es
posible perfectamente utilizarlos en cualquier otro ambiente mediante el reproductor
Flash player.
¿Cómo insertar los objetos Flash en las
páginas web?
La opción ideal es insertar en nuestras
páginas objetos flash existentes en nuestro sitio, por ejemplo un reloj,
candelario, juego, animación o simples adornos.
En este caso la primera preocupación será
insertarlos de forma tal que sean compatibles con los principales navegadores
web, de manera que se muestren de forma adecuada y que valide el código
correctamente.
Aquí se muestra unos pocos ejemplos de cómo
vincular de ese modo los objetos.
Este tutorial introductorio abarca los sitios
webs de tipo relativo y su gestión orientado a los archivos y no a la carpeta
raíz del sitio, esto es con una carpeta raíz relativa (que no es fija).
Cuando creamos un sitio web con un programa
como Dreamweaver, no podemos hacerlo como se nos ocurra, hay un proceso que
permite no equivocarnos y facilita el trabajo.
Crear un nuevo sitio en cuanto a Dreamweaver
permite que gestionemos diversos sitios web al mismo tiempo y además permite
actualizar en tiempo real el contenido de nuestra web en línea mediante FTP o
de manera pasiva.
Para crear un sitio Web basta conque elijamos
o creemos una carpeta en el sitio que crea conveniente
Ahora en la ventana que se abre (Definición de
sitio) nos vamos a la ficha Avanzada, seleccionamos Datos locales:
En la Categoría de
Datos locales agregamos:
Nombre del sitio por el que será mostrado en
la lista de Administrar Sitios.
Si pulsan en el ícono de la carpetita, al lado
de Carpeta raíz local podrán ubicar la carpeta donde almacenaran su nuevo
sitio. o escribiendo directamente la dirección en la entrada de texto.
Ahora definan la
Carpeta predeterminada de imágenes, esta carpeta, dentro de la carpeta raíz,
les permite enlazar a una imagen externa a la carpeta raíz local, que se
copiará automáticamente a la misma, sin tener que mover ningún archivo.
En el apartado inferior están "Vínculos
relativos a:" que deben estar en modo Documento
Regrasamos a
Categorias y pulsamos en Datos remotos:
Mediante la opción
Acceso podremos usar las capacidades de gestión en tiempo real de la versión
web que trabajamos en nuestra PC y la que está publicada en línea (si tienen un
sitio en línea). Dreamweaver tiene opciones de Gestoría FTP o superior, por lo
que podremos subir o bajar archivos o actualizar sólo los archivos que tiene
alguna modificación.
Los datos de FTP, Local\Red, WebDAV, sin
aquellos que le da su proveedor de hosting, de momento sólo tendremos presente
esta opción, por lo que la dejaremos en Ninguno:
Por último, de Categorías elegimos, Servidor
de prueba; este es muy importante, pues permite que usemos aplicaciones del
lado del servidor como Apache directamente en el PC.
Necesario
para probar webs programadas bajo lenguajes dinámicos de manera local, evitando
subir archivos que pueden ser inseguros a nuestro servidor en línea. Si instalamos
un servidor en nuestra PC con Apache
Si elegimos en Modelo de servidor: PHP MySQL
debido a que disponemos de un servidor instalado en nuetra PC, en Acceso
seleccionen Local/Red
Deberemos dar la dirección del servidor
(Carpeta del Servidor) dentro del disco donde se guardan los sitios creados
dinámicamente, si usáramos Appserv, la carpeta del servidor
Recordemos que salvo que se indique lo contrario el
prefijo que simula un servidor como apache se realiza en la dirección interna
Cómo crear un sitio WEB centrado con etiquetas
DIV en Dreamweaver
El Dreamweaver es una poderosa herramienta
para los diseñadores web con y sin experiencia. Uno de los problemas comunes de
diseño, que Dreamweaver no se ocupa con sus herramientas incorporadas, es la
capacidad de centrar un contenedor DIV en una página. Utilizando una serie de
elementos de estilo en línea, puedes controlar el ancho de un contenedor DIV y
la posición en una página. El siguiente es un proceso paso a paso para agregar
el CSS correspondiente a un contenedor DIV con el fin de centrar un sitio web
utilizando Dreamweaver.
¿Qué es una Div PA?
Lo primero que debes saber acerca de una Div
PA es que el término se aplica específicamente a Adobe Dreamweaver. El
concepto, sin embargo, se refiere a un componente universal de codificación
HTML y es una parte integral de la estructura de la mayoría de los diseños web.
PA, o el posicionamiento absoluto, se refiere a un método de diseño de HTML que
permite el mayor control sobre los elementos que aparecen en una página,
independientemente del navegador utilizado para abrir el sitio.
Spry Framework (estructura ágil) trabaja dentro
del programa Dreamweaver. Los usuarios pueden acceder a Spry desde el menú
principal de Dreamweaver, para crear menús de navegación para páginas web.
Lenguajes
Spry puede funcionar con una
variedad de lenguajes deprogramación web,
incluyendo HTML, CSS y JavaScript. La funcionalidad de Internet depende mucho
de la tecnología del lenguaje JavaScript para producir funciones como efectos
de reinversión, funcionalidad de forma y menús complejos y dinámicos.
Usar Spry
Los usuarios puedenseleccionarde una variedad de características
dentro de la biblioteca Spry JavaScript para crear funcionalidad que
ordinariamente requerería escribir el código de cero. Spry inserta automáticamente
el código en la página web donde puede ser leído por el software en los
servidores web que entregan el contenido de Interne
Menús dinámicos
Los usuarios pueden crear menús
complejos usando Spry Framework. Los menús pueden contener sub y sub sub menús,
que se desplegan cuando el cursor hace clic o se mueve sobre el título del menú
principal.
En adobe dreamweaver podemos saber como crear
menus, spry en dreamweaver que
tiene la opción de hasta 3 niveles para poder realizar un menú con sus
diferentes submenús, además de cambiar sus propiedades tanto de texto, tamaño,
color, entre muchas más, y así saber como crear menús, spry en dreamweaver
Los
frames son un elemento HTML que permite "incrustar" una página dentro
de otra. De este modo hay dos páginas separadas, independientes, en la misma
ventana de explorador.
PARA QUE SIRVE
Los frames es la herramienta que el HTML pone a
nuestra disposición para ... SCROLLING=valor Sirve para indicar si aparecerá una
barra de scroll en el frame
CONFIGURACION DE FRAME RELAY CON SUBINTERFACES
MULTIPUNTO
Cuando configuramos
una Frame Relay con subinterface se debe de asociar el DLCI o DLCI's en cada
interface usando el siguiente comando.
Si tiene un interface
punto a punto asignará un solo circuito virtual y un DLCI solo DLCI a cada
lado.
Si tiene un interface
multipunto puede asignarles varios DLCI's.
Generalmente se
asigna el mismo número de circuito virtual que al DLCI, aunque comos sabemos
pueden ser diferentes.
Asegúrese de que
configura el direccionamiento al su interface, no al interface físico.
Las tablas sirven para organizar datos e
imágenes en un archivo HTML. Consisten de tres elementos básicos: filas,
columnas y celdas (que surgen de la intersección de una fila con columna). Para
crear una tabla debemos hacer clic sobre el botón Insertar tabla (Insert Table)
de la paleta de Objetos.
QUE SON LAS TABLAS
Las tablas son una herramienta potente para presentar
datos e imágenes en páginas HTML. Las tablas proporcionan a los diseñadores Web
formas de añadir estructura vertical y horizontal a una página. Utilice las
tablas para presentar datos tabulares, diseñar columnas o disponer texto o
gráficos en una página Web
A.- CREAR UNA TABLA
1.- Para insertar una tabla en un documento de
Dreamweaver, llevar a término una de estas operaciones:
a) Situar el punto de inserción en el lugar de
la ventana de documento donde se desea que aparezca la tabla - Insertar - Tabla
b) En la barra Insertar hacer clic en el botón
Insertar Tabla de la ficha Común
c) Con el puntero del ratón arrastrar el botón
Insertar Tabla desde la ficha Común en la barra Insertar hasta la posición
deseada en la ventana de documento
2.- En estas tres operaciones aparecerá
siempre el cuadro de diálogo Insertar tabla :
a) En el campo Filas, especificar el número de
filas de la tabla
b) En el campo Columnas, especificar el número
de columnas de la tabla
c) En el campo Relleno de celda, especificar
el número de píxeles que habrá entre el contenido de la celta y el límite de
ésta. El número predeterminado de relleno es 1 píxel. Introducir 0 para
especificar que no se desea relleno
d) En el campo Espacio entre celdas,
especificar el número de píxeles que debe haber entre las celdas de la tabla.
El valor predeterminado es 2 píxeles. Introducir 0 para especificar que no se
desea espaciado
e) En el campo Ancho, especificar el ancho de
la tabla como porcentaje de la ventana del navegador o como un número de
píxeles
f) En el campo Borde, especificar el ancho en
píxeles del borde de la tabla. Poner 0 si no se desea que la tabla tenga borde
MODIFICAR UNA TABLA
1.- Añadir filas y columnas
a) Hacer clic en el lugar en el que se quiere
insertar una fila o una columna
b) Modificar - Tabla - Insertar filas o
columnas
c) Aparece el cuadro de diálogo Insertar filas
o columnas
d) Añadir un número de filas o columnas
2.- Eliminar filas y columnas
a) Hacer clic en una celda de la fila o
columna que se desea eliminar
b) Elegir una de estas opciones:
Para eliminar una fila: Modificar - Tabla -
Eliminar fila o Hacer clic con el botón de la derecha del ratón - Aparece el
menú contextual - Tabla - Eliminar fila
Para eliminar una columna: Modificar - Tabla -
Eliminar columna o Hacer clic con el botón de la derecha del ratón - Aparece el
menú contextual - Tabla - Eliminar columna
3.- Combinar y dividir celdas
a) Para combinar dos celdas:
Se seleccionan con el puntero del ratón las
dos celdas que se quieren combinar
Modificar - Tabla - Combinar celdas
b) Para dividir una celda o columna sencilla
Hacer clic en la celda que se quiere dividir
En el inspector de Propiedades hacer clic en
el botón Dividir celda
Aparece el cuadro de diálogo Dividir celda
En el campo Dividir especificar si la celda
se divide en filas o columnas
En los campos Número de filas o Número de
columnas especificar en cuántas filas o columnas se dividirá la celda
Aceptar
4.- Para combinar el alto de fila y el alto de
tabla: Se mueve el puntero del ratón a lo largo del borde inferior de la tabla
hasta que adopte la forma de selector de borde. Puede utilizarse este método
para cambiar el alto de otras filas de la tabla
5.- Para cambiar el ancho de columna y el
ancho de tabla.- Se mueve el puntero del ratón a lo largo de un borde de
columna hasta que adopte la forma de selector de borde y se arrastra hacia la
izquierda o hacia la derecha para cambiar el ancho de una columna. De forma
similar se puede cambiar el ancho de toda la tabla
Aspectos básicos de Dreamweaver
Macromedia Dreamweaver 8 es un editor HTML profesional para
diseñar, codificar y desarrollar sitios, páginas y aplicaciones Web. Tanto si
desea controlar manualmente el código HTML como si prefiere trabajar en un
entorno de edición visual, Dreamweaver le proporciona útiles herramientas que
mejorarán su experiencia de creación Web
Como
en la mayoría de los sistemas de creación y publicación de páginas, un sitio en
Dreamweaver consta de dos partes: un conjunto de archivos situados en un equipo
local (el sitio local) y una ubicación en un servidor Web remoto donde
publicará los archivos (el sitio remoto, espacio web o alojamiento web).
Definir una carpeta local
Configurar un sitio web en Dreamweaver es muy
sencillo, tan sólo es necesario especificar las propiedades del sitio local y
los parámetros de conexión al sitio remoto (en este caso utilizando un acceso
FTP) para empezar a publicar archivos en el servidor. Inicie Dreamweaver y en
el menú superior seleccione Sitio / Administrar sitios.... Aparecerá una nueva
ventana, se trata del Administrador de Sitios, haga clic en Nuevo... / Sitio
para abrir la ventana de configuración del nuevo sitio.
En la ventana de configuración seleccione la pestaña
Avanzadas y la categoría Datos locales para introducir todos los datos de la
configuración local de su sitio web. En Nombre del sitio introduzca cualquier
nombre que le permita identificar este sitio. Para indicar la Carpeta raíz
local deberá hacer clic sobre el botón de la derecha para examinar su disco
duro hasta seleccionar el directorio donde se encuentran todos los archivos de
su sitio web
Utilizar FTP seguro (SFTP)
Si su plan de alojamiento admite SFTP (FTP
seguro) marque la opción Utilizar FTP seguro (SFTP). Al utilizar el sistema
SFTP o FTP seguro Dreamweaver utilizará el acceso SSH para transferir los
archivos. Al contrario que el FTP tradicional, este protocolo encripta la
información que se transmite evitando que las contraseñas y la información
sensible se transmitan en claro por internet. Si activa el FTP seguro deberá
cambiar la ruta del Directorio del Servidor e indicar el path absoluto hasta el
directorio remoto de publicación, por ejemplo /home/usuario/public_html/ donde
usuario es el nombre de usuario de su acceso FTP.
Publicar los archivos locales
Después
de configurar las carpetas local y remota ya puede publicar su sitio web. Si no
puede ver el administrador de archivos a su derecha (en la ventana principal de
Dreamweaver) seleccione en el menú superior Ventana / Archivos (o pulse F8) y
haga clic sobre el icono Conectar al sitio remoto para conectar. Puede alternar
a Vista remota y Vista local para acceder a los archivos del sitio local y del
sitio remoto. Panel de archivos Aunque puede empezar a transferir sus archivos
directamente desde este panel, puede trabajar más comodamente haciendo clic
sobre el icono de la derecha Expandir / contraer para expandir el administrador
de archivos a modo ventana. Como puede comprobar, la apariencia es similar a un
cliente de FTP, a la izquierda los archivos del sitio remoto y a la derecha los
archivos del sitio local. Puede arrastrar elementos entre ambos sitios (remoto
y local) para publicar o descargar archivos
Configurar las propiedades de una Página
Los
títulos de página, las imágenes, los colores de fondo, los colores del texto y
de los vínculos son propiedades básicas de todos los documentos HTML. El título
de página identifica y da nombre al documento. Una imagen o un color de fondo
define la apariencia global del documento
Propiedades de la página
Utilice el cuadro de diálogo Propiedades de la
página para especificar diversas opciones de la página.
Para abrir el cuadro de diálogo Propiedades de
la página, elija Modificar > Propiedades de la página.
Título: especifica el título de la página que
aparece en la barra de título de la ventana de documento y la ventana de la
mayoría de los navegadores.
Margen izquierdo y Margen superior:
especifican los tamaños de los márgenes de la página en la etiqueta
"body" solamente para Microsoft Internet Explorer. Netscape Navigator
prescinde de estos valores y utiliza los de "Ancho de margen" y
"Alto de margen". Para obtener un resultado óptimo en los dos
navegadores, proporcione valores de márgenes para ambos navegadores en lugar de
para uno solo; complete los cuatro valores de márgenes en lugar de sólo dos.
Para asegurarse de que no aparecen márgenes en ningún navegador, configure los
cuatro valores con el valor 0. Dreamweaver no muestra márgenes de página en la
ventana de documento. Utilice Vista previa en el navegador para ver los
márgenes.
Ancho de margen y Alto de margen: especifican
los tamaños de los márgenes de la página en la etiqueta body solamente para
Netscape Navigator. Internet Explorer omite estos valores y utiliza los de
Margen izquierdo y Margen superior. Para obtener un resultado óptimo en los dos
navegadores, proporcione valores de márgenes para ambos navegadores en lugar de
para uno solo; complete los cuatro valores de márgenes en lugar de sólo dos.
Para asegurarse de que no aparecen márgenes en ninguno de los dos navegadores,
configure los cuatro valores con el valor 0. Dreamweaver no muestra márgenes de
página en la ventana de documento. Utilice Vista previa en el navegador para
ver los márgenes.
Codificación del documento: especifica la
codificación empleada para los caracteres del documento. Para español y otros
idiomas de Europa Occidental, elija Occidental. Otras opciones posibles son:
centroeuropeo, cirílico, griego, islandés, japonés, chino tradicional, chino
simplificado y coreano. Si no aparece ninguna opción para la codificación que
desea utilizar, elija "Otro" para crear un documento con la
codificación que use su sistema operativo. Todos los idiomas asiáticos utilizan
codificación de doble byte.
Imagen de rastreo: especifica una imagen que
se va a emplear como guía para copiar un diseño.
