Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Dreamweaver 8 Tutorial
Dreamweaver 8 Tutorial
Marcas comerciales
1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central,
ColdFusion, Contribute, Database Explorer, Director, Dreamweaver, Fireworks, Flash, FlashCast, FlashHelp, Flash Lite,
FlashPaper, Flex, Flex Builder, Fontographer, FreeHand, Generator, HomeSite, JRun, MacRecorder, Macromedia, MXML,
RoboEngine, RoboHelp, RoboInfo, RoboPDF, Roundtrip, Roundtrip HTML, Shockwave, SoundEdit, Studio MX, UltraDev y
WebHelp son marcas registradas o marcas comerciales de Macromedia, Inc. y pueden estar registradas en los Estados Unidos o en
otras jurisdicciones internacionales. Otros nombres de productos, logotipos, diseos, ttulos, palabras o frases mencionados en
esta publicacin pueden ser marcas comerciales, marcas de servicio o nombres comerciales de Macromedia, Inc. u otras entidades
y pueden estar registrados en determinadas jurisdicciones.
Informacin de otros proveedores
Este manual contiene vnculos con sitios Web de terceros que no estn bajo el control de Macromedia, por lo que Macromedia
no es responsable del contenido de ninguno de los sitios vinculados. Si obtiene acceso a un sitio Web de terceros mencionado en
este manual, lo har por su cuenta y riesgo. Macromedia proporciona estos vnculos exclusivamente para su comodidad, por lo
que la inclusin del vnculo no implica la aceptacin de responsabilidad alguna por parte de Macromedia por el contenido de
dichos sitios de terceros.
Navegador Opera Copyright 1995-2002 Opera Software ASA y sus proveedores. Todos los derechos reservados.
Copyright 1997-2005 Macromedia, Inc. Todos los derechos reservados. Este manual no se puede copiar, fotocopiar,
reproducir, traducir ni convertir a ningn formato electrnico o legible por mquina, en parte o en su totalidad, sin el
permiso previo y por escrito de Macromedia, Inc. No obstante, el propietario o usuario autorizado de una copia vlida del
software que acompaa a este manual podr imprimir una copia de este manual a partir de la versin electrnica con el
nico objetivo de que dicho propietario o usuario autorizado pueda aprender a utilizar el software, y siempre que no se
impriman, reproduzcan, distribuyan, revendan o transmitan copias de este manual para ningn otro fin, incluyendo pero
no limitado a fines comerciales, como la venta de copias de esta documentacin o la oferta de servicios de soporte
remunerados. Nmero de componente ZDW80M100L
Agradecimientos
Administracin: Charles Nadeau
Redaccin: Jon Michael Varese
Edicin: Rosana Francescato, Lisa Stanziano, Evelyn Eldridge, Mark Nigara
Administracin de la produccin y la edicin: Patrice ONeill y Rosana Francescato
Produccin y diseo multimedia: Adam Barnett, Aaron Begley, Paul Benkman, John Francis, Geeta Karmarkar, Paul Rangel,
Arena Reed, Mario Reynoso
Administracin de la localizacin: Melissa Baerwald
Garanta de calidad de la localizacin: Sandra Kane
Agradecimientos especiales a Sheila McGinn, Jennifer Rowe, Jay Armstrong, Sally Sadosky, Jennifer Taylor, Paul
Gubbay,Melissa Baerwald, Masayo Noda, Kristin Conradi, Yuko Yagi, Sami Kaied, Jung Choi y a los equipos de ingeniera y
control de calidad de Dreamweaver.
Primera edicin: septiembre de 2005
Macromedia, Inc.
601 Townsend St.
San Francisco, CA 94103
Contenido
PARTE 2: TUTORIALES
Captulo 3: Tutorial: Configuracin del sitio y de los
archivos del proyecto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
Conozca los sitios de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
Configuracin de los archivos del proyecto . . . . . . . . . . . . . . . . . . . . . . 53
Defina una carpeta local . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Captulo 4: Tutorial: Crear un diseo de pgina basado
en tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
Examen de la maqueta de diseo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
Creacin y almacenamiento de una pgina nueva . . . . . . . . . . . . . . . . . 61
Insercin de tablas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
Establecimiento de las propiedades de una tabla . . . . . . . . . . . . . . . . . 66
Insercin de un marcador de posicin de imagen . . . . . . . . . . . . . . . . . 72
Adicin de color a la pgina . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
Captulo 5: Tutorial: Adicin de contenido a las pginas . . . . . . . 79
Localizacin de los archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
Repaso de la tarea. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
Insercin de imgenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82
Insercin y reproduccin de un archivo Flash . . . . . . . . . . . . . . . . . . . . . 90
Insercin de Flash Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93
Insercin de texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96
Creacin de vnculos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102
Vista previa de la pgina en un navegador. . . . . . . . . . . . . . . . . . . . . . . 103
Captulo 6: Tutorial: Formatear la pgina con CSS . . . . . . . . . . 107
Localizacin de los archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 108
Repaso de la tarea. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109
Conocer las CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .110
Crear una nueva hoja de estilos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .112
Adjuntar una hoja de estilos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .114
Explorar el panel Estilos CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .116
Crear una nueva regla CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118
Aplicar un estilo de clase al texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .121
Formatear el texto de la barra de navegacin . . . . . . . . . . . . . . . . . . . . 122
(Opcional) Centrar el contenido de la pgina . . . . . . . . . . . . . . . . . . . . .131
Captulo 7: Tutorial: Publicacin del sitio. . . . . . . . . . . . . . . . . . . 135
Los sitios remotos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135
Definir una carpeta remota . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
Cargar los archivos locales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139
Solucin de problemas de configuracin de carpetas remotas
(opcional). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 140
Contenido
Contenido
PARTE 4: APNDICES
Apndice A: Aspectos bsicos de las aplicaciones Web . . . . . . 231
Aplicaciones Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 231
Funcionamiento de una aplicacin Web . . . . . . . . . . . . . . . . . . . . . . . .234
Creacin de pginas dinmicas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .239
Eleccin de una tecnologa de servidor . . . . . . . . . . . . . . . . . . . . . . . . . 241
Terminologa de aplicaciones Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . .242
Apndice B: Instalacin de un servidor Web. . . . . . . . . . . . . . . 247
Introduccin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .248
Instalacin de Internet Information Server . . . . . . . . . . . . . . . . . . . . . . .248
Comprobacin de IIS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249
Comprobacin del servidor Web de Macintosh
(desarrolladores PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Aspectos bsicos de los servidores Web. . . . . . . . . . . . . . . . . . . . . . . . 251
Apndice C: Configuracin del sitio ColdFusion de
muestra . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253
Listas de comprobacin de la configuracin para
desarrolladores de ColdFusion. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .253
Configuracin del sistema (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . 254
Definicin de un sitio de Dreamweaver (ColdFusion) . . . . . . . . . . . . 260
Conexin con la base de datos de muestra (ColdFusion) . . . . . . . . .266
Apndice D: Configuracin del sitio ASP.NET de muestra . . . . 271
Listas de comprobacin de la configuracin para
desarrolladores de ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271
Configuracin del sistema (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . 272
Definicin de un sitio de Dreamweaver (ASP.NET) . . . . . . . . . . . . . . 276
Conexin con la base de datos de muestra (ASP.NET) . . . . . . . . . . .282
Apndice E: Configuracin del sitio ASP de muestra . . . . . . . 285
Listas de comprobacin de la configuracin para
desarrolladores de ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .286
Configuracin del sistema (ASP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 287
Definicin de un sitio de Dreamweaver (ASP) . . . . . . . . . . . . . . . . . . .292
Conexin con la base de datos de muestra (ASP). . . . . . . . . . . . . . . .298
Contenido
Contenido
Contenido
PARTE 1
Introduccin a Dreamweaver
La Parte Uno de este libro ofrece una introduccin a Macromedia
Dreamweaver 8 e incluye informacin de instalacin y una breve
descripcin del espacio de trabajo. En ella tambin se ofrece una lista de
recursos disponibles para aprender a utilizar Dreamweaver.
Esta parte contiene las siguientes secciones:
Introduccin. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Conocer Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Aspectos bsicos de Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . .29
Introduccin
Macromedia Dreamweaver 8 es un editor HTML profesional para disear,
codificar y desarrollar sitios, pginas y aplicaciones Web. Tanto si desea
controlar manualmente el cdigo HTML como si prefiere trabajar en un
entorno de edicin visual, Dreamweaver le proporciona tiles herramientas
que mejorarn su experiencia de creacin Web.
Esta gua es una introduccin para utilizar Macromedia Dreamweaver 8
dirigida a los usuarios que no estn familiarizados con algn aspecto
fundamental de esta aplicacin. Los tutoriales de que consta le guan a
travs del proceso de creacin de un sitio Web sencillo pero funcional.
Este captulo trata los siguientes temas:
Lo que puede hacer con Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . 11
Novedades en Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
Instalacin de Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Registro de Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Convenciones tipogrficas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
11
Novedades en Dreamweaver 8
Dreamweaver 8 incorpora muchas funciones nuevas que le ayudarn a
disear pginas Web y aplicaciones con un mnimo de tiempo y esfuerzo.
Dreamweaver simplifica las tecnologas ms complejas y las hace accesibles,
ayudndole a conseguir ms en menos tiempo.
stas son algunas de las nuevas funciones de Dreamweaver 8:
12
Introduccin
Contraccin de cdigo
Instalacin de Dreamweaver 8
En esta seccin se explica cmo instalar Dreamweaver.
Asegrese de que ha ledo las notas de la versin en el sitio web de
Macromedia en www.macromedia.com/go/dw_documentation_es, donde
encontrar la informacin o instrucciones ms recientes.
Para instalar Dreamweaver:
1.
2.
3.
4.
Instalacin de Dreamweaver 8
13
Registro de Dreamweaver 8
Para obtener soporte adicional de Macromedia, es conveniente que registre
su copia de Macromedia Dreamweaver 8 electrnicamente o por correo.
Al registrarse, podr suscribirse para recibir informacin de ltima hora
sobre actualizaciones y nuevos productos de Macromedia. Tambin puede
suscribirse a los boletines de correo electrnico regulares sobre
actualizaciones de productos y nuevos contenidos publicados en los sitios
Web www.macromedia.com y www-euro.macromedia.com.
Para registrar Macromedia Dreamweaver 8, siga uno de estos
procedimientos:
Convenciones tipogrficas
En esta gua se utilizan las convenciones tipogrficas siguientes:
14
Introduccin
CAPTULO 1
Conocer Dreamweaver
Dnde comenzar
La documentacin de Dreamweaver contiene informacin para usuarios de
distintos niveles. Esta seccin le ayudar a aprender a utilizar la
documentacin, dependiendo de sus conocimientos anteriores y de lo que
quiera conseguir con Dreamweaver.
Esta seccin trata sobre los siguientes temas:
15
16
Conocer Dreamweaver
1.
2.
3.
4.
5.
Eso es todo lo que necesita para comenzar a crear sitios Web de gran
calidad. Cuando est preparado para aprender a utilizar herramientas
ms avanzadas, podr continuar con el resto de los captulos sobre
pginas estticas en el apartado Utilizacin de Dreamweaver. Es
aconsejable que lea los captulos de pginas dinmicas slo cuando se
haya familiarizado con la creacin de pginas Web.
2.
3.
4.
5.
6.
Dnde comenzar
17
2.
3.
4.
5.
Conecte con una base de datos. (Vase Conexin con una base de
datos en Captulo 23, Configuracin de una aplicacin Web.)
6.
18
Conocer Dreamweaver
1.
2.
3.
4.
5.
Comience con una lectura rpida de esta gua de Primeros pasos con
Dreamweaver para familiarizarse con los aspectos bsicos del uso de
Dreamweaver.
2.
3.
Dnde comenzar
19
4.
5.
Conecte con una base de datos. (Vase Conexin con una base de
datos en Captulo 23, Configuracin de una aplicacin Web.)
6.
2.
Acceso a la documentacin de
Dreamweaver
En la siguiente tabla se resume la documentacin que contiene el sistema
de Ayuda de Dreamweaver.
20
Conocer Dreamweaver
Descripcin/
Audiencia
Dnde encontrarlo
Ver en Dreamweaver:
Primeros
Le ofrece una
Seleccione Ayuda > Primeros
pasos con
introduccin bsica a
pasos con Dreamweaver
Dreamweaver los conceptos de
21
Ttulo
Descripcin/
Audiencia
Dnde encontrarlo
22
Conocer Dreamweaver
Utilizacin de
ColdFusion
Descargar el PDF:
disponible en
www.macromedia.com/go/
LiveDocs.) Dirigido a
cf_documentation
todo aquel que est
interesado en
ColdFusion, desde
principiantes hasta
desarrolladores
avanzados.
Referencia
Descripcin/
Audiencia
Dnde encontrarlo
www.macromedia.com/go/
developer_dw_es
Centro de
recursos de
documentacin de
Dreamweaver
www.macromedia.com/go/
dw_documentation_es
Foros en
lnea de
Macromedia
www.macromedia.com/go/
dreamweaver_training_es
23
24
Conocer Dreamweaver
Bsqueda de ayuda
Puede realizar una bsqueda de texto completa en la Ayuda de
Dreamweaver.
Para buscar ayuda sobre el producto (Windows):
1.
2.
3.
2.
SUGERENCIA
1.
S U G ER E N C I A
Puede empezar a
escribir una palabra
clave en el cuadro de
texto para
desplazarse
rpidamente a una
entrada del ndice.
2.
Desplcese hasta una entrada del ndice dentro de la lista por orden
alfabtico y haga doble clic sobre ella para que aparezca la informacin
correspondiente.
1.
2.
Haga clic en una letra y desplcese a una entrada del ndice dentro de la
lista.
3.
25
2.
2.
26
Conocer Dreamweaver
Impresin de la documentacin de
Dreamweaver
Los libros siguientes estn disponibles en formato PDF en el sitio Web de
Macromedia en www.macromedia.com/go/dw_documentation_es:
Utilizacin de Dreamweaver
Ampliacin de Dreamweaver
Introduccin de comentarios en la
documentacin de Dreamweaver con
LiveDocs
La documentacin de Dreamweaver tambin est disponible en lnea en
formato LiveDocs. La versin de LiveDocs de la ayuda de Dreamweaver se
parece mucho a la ayuda incorporada en el producto, pero adems le
permite comentar el contenido de pginas de ayuda especficas. Puede
agregar informacin til sobre un tema de Dreamweaver especfico segn
su experiencia particular, o pedir consejo a otros diseadores y
desarrolladores de Dreamweaver.
Los LiveDocs de Dreamweaver estn disponibles en
http://livedocs.macromedia.com/go/livedocs_dreamweaver_es/
27
28
Conocer Dreamweaver
CAPTULO 2
Aspectos bsicos de
Dreamweaver
29
Selector de etiquetas
30
Ventana de documento
Inspector de propiedades
Grupos de paneles
Panel Archivos
N O TA
Barra Insertar
Selector de
etiquetas
Inspector de propiedades
Grupos de paneles
Panel Archivos
31
Ventana de documento
La ventana de documento muestra el documento actual. Puede elegir entre
una de las vistas siguientes:
La vista Diseo es un entorno de diseo para el diseo visual de la pgina,
la edicin visual y el desarrollo rpido de aplicaciones. En esta vista,
Dreamweaver muestra una representacin visual del documento
completamente editable, similar a la que aparecera en un navegador.
La vista Cdigo es un entorno de codificacin manual para escribir y
editar cdigo HTML, JavaScript, cdigo de lenguaje de servidor, como por
ejemplo PHP o ColdFusion Markup Language (CFML), y otros tipos de
cdigo. Para ms informacin, consulte Captulo 20, Codificacin en
Dreamweaver en Utilizacin de Dreamweaver.
Es posible ver el mismo documento en las dos vistas, Cdigo y Diseo, en
una sola ventana de documento.
Cuando la ventana de documento tiene una barra de ttulo, sta muestra el
ttulo de la pgina y, entre parntesis, el nombre y la ruta del archivo. Si se
han realizado cambios que an no se han guardado, despus del nombre
del archivo Dreamweaver incluye un asterisco.
Cuando se maximiza la ventana de documento en el diseo integrado de
espacio de trabajo (slo Windows), no aparece la barra de ttulo; en este
caso, el ttulo de la pgina y el nombre y la ruta del archivo aparecen en la
barra de ttulo de la ventana principal del espacio de trabajo.
Adems, cuando una ventana de documento est maximizada, aparecen
fichas en la parte superior de la misma con los nombres de archivo de todos
los documentos abiertos. Para cambiar a un documento, haga clic en su
ficha.
Para ms informacin sobre cmo utilizar la ventana de documento,
consulte Captulo 1, Exploracin del espacio de trabajo en Utilizacin de
Dreamweaver.
32
Ayudas visuales
Ver opciones
Actualizar vista de diseo
Vista previa/Depurar en explorador
documento.
Mostrar vistas de cdigo y diseo muestra la vista Cdigo en una parte
de la ventana de documento y la vista Diseo en la otra parte. Cuando
seleccione esta vista combinada, se encontrar disponible la opcin Vista de
diseo encima del men Ver. Utilice esta opcin para especificar qu vista
debe aparecer en la parte superior de la ventana de documento.
Mostrar vista de diseo
documento.
muestra un informe que le ayudar a depurar la
pgina de ColdFusion actual. El informe contiene los errores de la pgina,
si los hay.
permite comprobar la
33
Validar formato
seleccionada.
Administracin de archivos
de archivos.
permite ver una vista previa del
documento o depurarlo en un navegador. Seleccione un navegador en el
men emergente.
Vista previa/Depurar en explorador
Ver opciones permite definir las opciones de las vistas Cdigo y Diseo, y
establecer qu vista va a aparecer en la parte superior de la ventana. Las
opciones del men corresponden a la vista actual: la vista Diseo, la vista
Cdigo o ambas.
Ayudas visuales permite utilizar distintas ayudas visuales para el diseo de
las pginas.
Para ms informacin sobre cmo utilizar la barra de herramientas de
Documento, consulte Captulo 1, Exploracin del espacio de trabajo en
Utilizacin de Dreamweaver.
Barra de estado
La barra de estado, situada en la parte inferior de la ventana de documento,
proporciona informacin adicional sobre el documento que est creando.
Tamao del documento y
tiempo de descarga estimado
Selector de etiquetas
34
35
Barra Insertar
La barra Insertar contiene botones para la creacin e insercin de diversos
tipos de objetos, como tablas, capas e imgenes. Al pasar el puntero sobre
un botn, aparece una descripcin de la herramienta con el nombre del
botn.
Los botones estn organizados en categoras, a las que puede cambiar en la
parte izquierda de la barra Insertar. Si el documento actual contiene cdigo
de servidor, como los documentos ASP o CFML, aparecen tambin otras
categoras. Cuando se inicia Dreamweaver, se abre la ltima categora con
la que ha trabajado.
36
Flash.
La categora Favoritos le permite agrupar y organizar los botones de la
barra Insertar que utiliza con ms frecuencia en un lugar comn.
Para ms informacin sobre cmo utilizar la barra Insertar, consulte
Captulo 1, Exploracin del espacio de trabajo en Utilizacin de
Dreamweaver.
37
38
El Inspector de propiedades
El inspector de propiedades permite examinar y editar las propiedades ms
comunes del elemento de pgina seleccionado actualmente, como texto o
un objeto insertado. El contenido del inspector de propiedades es distinto
en funcin del elemento seleccionado. Por ejemplo, si selecciona una
imagen en la pgina, el inspector de propiedades cambiar para mostrar las
propiedades de la imagen (como la ruta del archivo de imagen, el ancho y
alto de la imagen, el borde que la rodea, etc.).
39
El panel Archivos
El panel Archivos se utiliza para ver y administrar los archivos del sitio de
Dreamweaver.
40
41
42
NO T A
43
Haga clic en la ficha con el botn derecho del ratn o haga clic
mientras presiona la tecla Control y seleccione Mover a nueva ventana
en el men contextual.
N OT A
44
1.
2.
2.
45
Archivos de Dreamweaver
En Dreamweaver, puede trabajar con distintos tipos de archivo. El
principal tipo de archivo de trabajo es el archivo HTML. Los archivos
HTML o archivos en Lenguaje de formato de hipertexto incluyen
un lenguaje basado en etiquetas que es el responsable de mostrar la pgina
Web a travs del navegador. Puede guardar archivos HTML con las
extensiones .html o .htm. Dreamweaver guarda los archivos utilizando por
defecto la extensin .html.
En Dreamweaver tambin se trabaja con los siguientes tipos de archivo:
CSS, o archivos de hojas de estilos en cascada, que tienen la extensin .css.
Se utilizan para dar formato al contenido HTML y para definir la situacin
de diversos elementos de la pgina. Para ms informacin sobre cmo
trabajar con estos tipos de archivos, consulte Aspectos bsicos de las hojas
de estilos en cascada en Utilizacin de Dreamweaver.
GIF,
JPEG,
46
2.
3.
47
4.
S U G E R E N CI A
Es recomendable
guardar el archivo en
un sitio de
Dreamweaver. Para
ms informacin,
consulte Captulo 3,
Tutorial:
Configuracin del
sitio y de los archivos
del proyecto, en
la pgina 51.
1.
2.
3.
4.
48
1.
2.
PARTE 2
Tutoriales
La Parte Dos de este libro contiene cinco tutoriales bsicos que le ayudan a
realizar los distintos pasos de que consta la creacin de una pgina Web. La
pgina Web que crear es la pgina principal de Cafe Townsend, un
restaurante ficticio.
Esta parte contiene las siguientes secciones:
Tutorial: Configuracin del sitio y de los archivos del proyecto . . 51
Tutorial: Crear un diseo de pgina basado en tablas . . . . . . . . . .59
Tutorial: Adicin de contenido a las pginas . . . . . . . . . . . . . . . . . . 79
Tutorial: Formatear la pgina con CSS . . . . . . . . . . . . . . . . . . . . . . 107
Tutorial: Publicacin del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135
49
CAPTULO 3
51
52
53
1.
N OT A
A c er c a d e. ..
Carpetas locales y carpetas remotas "raz" La carpeta "raz" local del sitio Dreamweaver suele ser la
carpeta principal o la carpeta de nivel superior de su sitio Web. Suele corresponderse con una carpeta
idntica situada en el sitio remoto (servidor Web). La carpeta raz tambin suele definir la primera parte
de la URL del sitio Web, despus del nombre de dominio. Por ejemplo, si su carpeta raz local se llama
misitioweb, y tiene una carpeta raz idntica en el sitio remoto, la URL de su sitio Web ser algo como
http://www.yahoo.com/misitioweb.
En algunos casos, la carpeta raz local podra no tener un nombre exacto equivalente en el sitio remoto.
Por ejemplo, si usted es propietario del dominio www.misitioweb.com, con un directorio raz remoto
llamado public_html, su carpeta raz local podra seguir llamndose misitioweb. Los archivos en los
directorios local y remoto raz seran idnticos; lo nico diferente sera los nombres de las carpetas
(public_html en el sitio remoto y misitioweb en el equipo local).
3.
54
2.
3.
4.
5.
6.
55
7.
8.
56
57
58
CAPTULO 4
Este tutorial explica cmo crear un diseo de pgina basado en tablas con
Macromedia Dreamweaver 8. Un diseo de pgina determina cmo va a
aparecer la pgina en el navegador, mostrando, por ejemplo, la situacin de
los mens, las imgenes, y el contenido de Macromedia Flash.
Las tablas constituyen una herramienta muy eficaz para presentar datos de
tabla y establecer el diseo de texto y grficos en una pgina HTML. Puede
utilizar las tablas para crear su propio diseo de un modo rpido y sencillo.
En este tutorial, va a crear varias tablas en un nuevo documento de
Dreamweaver. Las filas y celas de las tablas sirven de cuadros contenedores
para el contenido que aadir posteriormente.
En este tutorial va a realizar las tareas siguientes:
Examen de la maqueta de diseo. . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
Creacin y almacenamiento de una pgina nueva . . . . . . . . . . . . . 61
Insercin de tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
Establecimiento de las propiedades de una tabla. . . . . . . . . . . . . . 66
Insercin de un marcador de posicin de imagen. . . . . . . . . . . . . . 72
Adicin de color a la pgina . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
59
60
Creacin y almacenamiento de
una pgina nueva
Despus de crear un sitio nuevo y examinar los comps, ya puede empezar a
crear pginas Web. Comience creando una pgina nueva y guardndola en
la carpeta raz local cafe_townsend de su sitio Web. Ms adelante esta
pgina ser la pgina de inicio de Cafe Townsend, un restaurante ficticio.
Si no ha creado una carpeta raz local llamada cafe_townsend, deber
hacerlo antes de continuar. Para instrucciones, consulte Captulo 3,
Tutorial: Configuracin del sitio y de los archivos del proyecto.
1.
2.
3.
4.
5.
61
6.
Insercin de tablas
A continuacin, vamos a introducir una tabla que incluir texto, grficos y
activos de Macromedia Flash.
62
1.
2.
3.
4.
Insercin de tablas
63
A c er c a d e. . .
Ms informacin sobre las tablas Las tablas constituyen una herramienta muy eficaz para presentar
datos de tabla y establecer el diseo de texto y grficos en una pgina HTML. Una tabla consta de una o
varias filas, cada una de las cuales consta, a su vez, de una o ms celdas. Al crear filas mltiples con
celdas mltiples, las celdas formal columnas. Tcnicamente, una celda es una divisin dentro de una fila
horizontal, y una columna es una acumulacin vertical de estas divisiones de celdas.
Dreamweaver muestra el ancho de la tabla y de cada columna en el Selector de tablas (marcado con
lneas verdes) cuando se selecciona una tabla o cuando el punto de insercin est en ella.
Junto a los anchos se encuentran flechas para el men de encabezado de la tabla y los mens de
encabezado de las columnas. Puede utilizar los mens para acceder rpidamente a determinados
comandos relacionados con tablas. Tambin puede activar o desactivar la vista de los anchos y los
mens seleccionando Ver > Ayudas visuales > Anchos de tabla.
Las tablas pueden tener bordes, y las celdas de una tabla pueden tener relleno, espaciado o ambos. El
relleno de celda determina el nmero de pxeles entre el contenido de una celda y los lmites de la misma.
El espacio entre celdas determina el nmero de pxeles entre celdas contiguas de una tabla.
Si no se especifican de forma explcita los valores de relleno y espaciado de celda, la mayora de los
navegadores mostrar la tabla como si el valor de relleno de celda fuera 1 y el de espaciado de celda fuera
2. Si quiere asegurarse de que los navegadores muestran la tabla sin relleno ni espaciado, establezca 0
como valor de ambos atributos.
Para ms informacin sobre tablas, consulte el Captulo 8, Presentacin de contenido en tablas en
Utilizacin de Dreamweaver.
5.
6.
7.
8.
64
Aparece una segunda tabla con una fila y tres columnas debajo de la
primera tabla.
9.
10. Inserte una tercera tabla seleccionando Insertar > tabla e introduciendo
11.
Insercin de tablas
65
N O TA
Establecimiento de las
propiedades de una tabla
Ahora va a definir propiedades especficas de la tabla utilizando el modo de
tablas expandidas, una funcin que aade temporalmente relleno y
espaciado de celdas a las tablas y aumenta los bordes, para as simplificar la
edicin. Especficamente, permite colocar el punto de insercin de manera
precisa, sin seleccionar accidentalmente la tabla equivocada o el contenido
de otra tabla.
N OT A
NO TA
66
2.
3.
N OT A
5.
67
6.
7.
68
8.
9.
10. Haga
69
11.
12. Defina
Si el Selector de tablas est activado (Ver > Ayudas visuales > Anchos de
tabla), podr ver sobre las columnas de la tabla respectivas los tres
valores en pxeles que acaba de introducir.
No va a introducir valores para la altura de las celdas de esta tabla
porque la altura de dichas celdas variar dependiendo del contenido
que agregue ms adelante.
13.
70
Por ltimo, haga clic dentro de la ltima tabla (la que tiene una fila y
una columna).
15.
16.
Guarde la pgina.
71
Insercin de un marcador de
posicin de imagen
Un marcador de posicin de imagen es un grfico que se utiliza hasta que el
grfico definitivo est listo para su incorporacin a la pgina Web. Un
marcador de posicin de imagen puede resultar til al crear el diseo de
pgina, pues permite colocar una imagen en una pgina antes de crear la
imagen.
1.
2.
3.
A c er c a d e. ..
Nota sobre el texto alternativo El texto alternativo es una descripcin textual de una imagen en una
pgina Web. Forma parte del cdigo HTML y no se muestra en la pgina. Es importante proporcionar
texto alternativo para la mayora de sus imgenes, con el fin de ofrecer la informacin proporcionada por
la imagen a los visitantes del sitio que utilicen lectores de pantalla o navegadores que slo admiten texto.
En los grficos de rtulo, que slo suelen mostrar el logotipo en la pgina Web, no es esencial
proporcionar texto alternativo. Si deja el cuadro de texto Texto alternativo en blanco en el cuadro de
dilogo Marcador de posicin de imagen, Dreamweaver aade un atributo alt="" a la etiqueta img. Si
posteriormente decide que quiere aadir texto alternativo a una imagen, puede seleccionar la imagen e
introducir el texto alternativo en el inspector de propiedades. Por ejemplo, si ms adelante cambia el
logotipo aadiendo un nmero de telfono direccin, podra incluir esta informacin en el texto
alternativo.
72
A ce r ca d e . ..
4.
NO T A
Guarde la pgina.
73
Haga clic una vez dentro de la primera celda de la tabla de tres columnas.
2.
3.
NO T A
74
4.
6.
7.
8.
9.
Una vez definidos los colores de las tres celdas, haga clic una vez fuera
de la tabla para anular la seleccin.
75
1.
2.
A ce r ca d e .. .
Elegir colores En HTML, los colores se expresan en forma de valores hexadecimales (por ejemplo,
#FF0000) o con nombres (red). Un color seguro para la Web es aqul que se muestra de la misma forma
en Netscape Navigator y en Microsoft Internet Explorer, tanto en Windows como en Macintosh, con un
modo de 256 colores. Existen 216 colores comunes y cualquier valor hexadecimal que combine los pares
00, 33, 66, 99, CC o FF (valores RGB 0, 51, 102, 153, 204 y 255, respectivamente) representa a un
color seguro para la Web.
En Dreamweaver puede seleccionar colores introduciendo valores hexadecimales en los cuadros de
texto correspondientes o seleccionando un color en el selector de color. El selector de color utiliza la
paleta de 216 colores seguros para la Web; al seleccionar un color de esta paleta, se muestra el valor
hexadecimal del color. Para utilizar el selector de color, haga clic en el cuadro del color para seleccionar
un color.
Tambin puede utilizar el selector de color para igualar colores. Por ejemplo, si una imagen de su pgina
incluye un todo de azul especfico y quiere aplicar el mismo color al color de fondo de una celda de la
tabla, seleccione la celda en cuestin, haga clic en el cuadro de color para abrir el selector de color,
mueva el cuentagotas sobre el azul de la imagen y haga clic con el botn del ratn. El selector de color
rellenar la zona seleccionada con el color ms parecido al que marc con el cuentagotas. No obstante,
al seleccionar colores con este mtodo, el color seleccionado por el selector de color podra no ser un
color seguro para la Web.
76
3.
4.
Guarde su trabajo.
77
78
CAPTULO 5
Tutorial: Adicin de
contenido a las pginas
79
80
Repaso de la tarea
En este tutorial incorporar activos a la pgina de inicio de Cafe Townsend,
un restaurante ficticio. Aprender a aadir imgenes, archivos de
Macromedia Flash, archivos de Macromedia Flash Video y texto. Cuando
haya terminado, la pgina se parecer a sta:
Repaso de la tarea
81
Insercin de imgenes
Una vez creado su diseo de pgina, ya puede aadir activos a la pgina.
Vamos a comenzar aadiendo imgenes. Hay varias formas de aadir
imgenes a una pgina Web en Dreamweaver. En este apartado va a aadir
cuatro imgenes distintas a la pgina index de Cafe Townsend siguiendo
varios mtodos.
NO T A
82
2.
3.
4.
Insercin de imgenes
83
5.
Haga clic una vez fuera de la tabla para anular la seleccin de la imagen.
6.
NO T A
84
1.
Haga clic una vez dentro de la tercera fila de la primera tabla (dos filas
por debajo del grfico de rtulo que acaba de insertar, justo encima de
las celdas coloreadas de la tabla).
2.
3.
Haga clic una vez dentro de la ltima fila de la ltima tabla de la pgina
(justo debajo de las celdas coloreadas de la tabla).
Insercin de imgenes
85
2.
NO TA
3.
Haga clic una vez fuera de la tabla y guarde la pgina (Archivo >
Guardar).
86
2.
N OT A
Insercin de imgenes
87
A c e r ca d e .. .
El panel Activos El panel Activos le permite administrar los activos del sitio actual. En el panel Activos
se muestran los activos del sitio asociados al documento activo en la ventana de documento.
deber definir un sitio local antes de ver los activos en el panel Activos. Para ms informacin, consulte
Captulo 3, Tutorial: Configuracin del sitio y de los archivos del proyecto o Utilizacin de Dreamweaver.
El panel Activos proporciona dos vistas:
La lista Sitio enumera todos los activos del sitio, incluidos los colores y los URL que se utilizan en los
documentos del sitio.
La lista Favoritos enumera nicamente los activos que haya elegido de forma explcita. Para aadir un
activo a la lista Favoritos, seleccione el activo en la lista Sitio y, a continuacin, seleccione Aadir a
Favoritos en el men Opciones, situado en la esquina superior derecha del panel Archivos.
Al hacer clic en un activo del panel Activos, aparece el activo seleccionado en el rea de vista previa. Para
cambiar el tamao del rea de vista previa, arrastre la lnea que separa el rea de vista previa de los
encabezados de columna de activos.
Para ms informacin, consulte Utilizacin de activos en Utilizacin de Dreamweaver.
4.
Haga clic en la ficha Activos del panel Archivos o seleccione Ventana >
Activos.
Aparecen los activos de su sitio.
Botn Imgenes
88
5.
6.
7.
NO T A
8.
Haga clic una vez fuera de la tabla para anular la seleccin de la imagen.
9.
Guarde la pgina.
Insercin de imgenes
89
Insercin y reproduccin de un
archivo Flash
A continuacin va a insertar un archivo Flash que reproduce una serie de
fotografas de alimentos ofrecidos por Cafe Townsend. El archivo Flash que
va a insertar es un archivo FMA, o rea de mensajera flexible. Un FMA es
un tipo de aplicacin Flash comn que muestra un mensaje informativo. El
mensaje puede cambiar segn las necesidades especficas. Por ejemplo, si
Cafe Townsend va a celebrar un acontecimiento especial, el FMA se podra
cambiar fcilmente (sin afectar al resto de la pgina) para mostrar
informacin sobre el evento en lugar de mostrar los alimentos ofrecidos.
Para insertar el archivo FMA de Flash necesita insertar cdigo HTML para
incrustar el archivo en la pgina de Dreamweaver. Para hacer esto, lo ms
sencillo es insertar el archivo SWF (el archivo de pelcula Flash exportado)
en la pgina. Cuando se inserta un archivo SWF en Dreamweaver,
Dreamweaver escribe por usted todo el cdigo Flash HTML necesario.
1.
2.
NO T A
90
A ce r ca d e . ..
Archivos flash Al crear activos en Macromedia Flash, se trabaja con archivos FLA, el tipo de archivo
predeterminado de la aplicacin Flash. Los archivos FLA tienen la extensin .fla. Por ejemplo, si est
trabajando con un logotipo animado para un sitio Web, el nombre del archivo Flash podra ser
animated_logo.fla.
Cuando termine de trabajar con el archivo FLA en Flash, debe exportar el archivo a un formato que pueda
verse en la Web con Flash Player. Al exportar archivos FLA en Flash, se convierten en archivos SWF con
la extensin .swf. Los archivos SWF (no FLA) reproducen contenido Flash en un navegador; es el tipo de
archivo que se debe introducir en una pgina Web que se est diseando con Dreamweaver.
3.
91
4.
5.
NO TA
92
6.
7.
Guarde la pgina.
2.
93
3.
A ce r c a d e . ..
Flash Video El comando Insertar Flash Video de Dreamweaver le permite insertar contenido de Flash
Video en las pginas Web sin tener que utilizar la herramienta de autora de Flash. El comando inserta un
componente de Flash, que muestra el contenido de Flash Video seleccionado, adems de un conjunto de
mandos de reproduccin cuando se muestra en un navegador.
El comando Insertar Flash Video le permite ofrecer contenido de vdeo a los visitantes de su sitio a travs
de una de estas opciones:
El vdeo de descarga progresiva descarga el archivo de Flash Video (FLV) al disco duro del usuario y lo
reproduce. Sin embargo, a diferencia de los mtodos tradicionales de entrega de vdeo de tipo "descarga
y reproduccin", la descarga progresiva permite iniciar la reproduccin del archivo de vdeo antes de que
haya finalizado la descarga.
El vdeo de flujo transfiere el contenido de Flash Video y lo reproduce en la pgina Web de inmediato
cuando se solicite. No obstante, para poder utilizar el vdeo de flujo en pginas Web, es necesario tener
acceso a Macromedia Servidor de comunicaciones de Flash, el nico servidor que puede transferir
contenido de Flash Video.
Para ms informacin sobre cmo utilizar Flash Video, consulte Insercin de contenido de Flash Video
en Utilizacin de Dreamweaver.
4.
5.
94
6.
N OT A
"Total con aspecto" es el valor del ancho y alto del archivo FLV ms el
ancho y alto del aspecto seleccionado.
7.
Restringir
si el archivo se va a reproducir al
abrir la pgina Web. Esta opcin est desactivada de forma
predeterminada.
S U G E R E N CI A
si el control de reproduccin
vuelve al punto de inicio cuando finalice la reproduccin. Esta opcin
est desactivada de forma predeterminada.
95
8.
9.
Guarde la pgina.
Insercin de texto
A continuacin, va a aadir texto a la pgina. Puede escribir texto
directamente en la ventana de documento de Dreamweaver o copiarlo y
pegarlo de otro origen (como un archivo de Microsoft Word o de texto).
Mas adelante, le dar formato al texto utilizando hojas de estilos en cascada
(CSS).
96
2.
3.
4.
5.
Insercin de texto
97
98
7.
8.
Guarde la pgina.
Insercin de texto
99
2.
3.
4.
Repita el paso anterior hasta haber incluido las siguientes palabras con
un espacio entre ellas: Articles, Special Events, Location, Menu,
Contact Us.
No presione la tecla Intro (Windows) o Retorno (Macintosh) mientras
escribe. Utilice solamente la barra de espacio para separar las palabras y
deje que stas se distribuyan de forma natural. El ancho fijo de la celda
de la tabla determina las palabras que van a caber por lnea.
5.
6.
N O TA
Guarde la pgina.
Insercin de texto
101
Creacin de vnculos
Un vnculo es una referencia insertada en una pgina Web que seala a otro
documento. Puede convertir prcticamente cualquier tipo de activo en un
vnculo, pero el tipo de vnculo ms comn es el de texto.
Puede crear vnculos en cualquier etapa del proceso de creacin del sitio.
En este apartado va a crear vnculos para la barra de navegacin, aunque
todava no lo haya formateado para que aparezca como barra de
navegacin.
La carpeta raz de cafe_townsend incluye una pgina HTML completada a
la que puede enlazar con el vnculo (una pgina con un men de Cafe
Townsend). Esta pgina se utilizar para todos los vnculos de navegacin,
aunque si estuviera creando un sitio real tendra pginas diferentes para
estos vnculos.
1.
2.
3.
4.
5.
N OT A
Guarde la pgina.
1.
2.
NO T A
CAPTULO 6
Tutorial: Formatear la
pgina con CSS
107
Repaso de la tarea
En este tutorial utilizar hojas de estilos en cascada (CSS) para formatear el
texto de la pgina de inicio de Cafe Townsend, un restaurante ficticio. Va a
crear distintos tipos de reglas CSS para formatear el texto del cuerpo.
Tambin va a formatear el texto del vnculo a la izquierda de la pgina,
creando una barra de navegacin. Cuando haya terminado, la pgina se
parecer al siguiente ejemplo:
110
111
2.
112
A ce r ca d e . ..
4.
113
S UG E R E N CI A
114
5.
Para ms
informacin sobre
cualquier propiedad
de CSS, consulte la
gua de referencia de
OReilly que
acompaa a
Dreamweaver. Para
mostrar la gua,
seleccione Ayuda >
Referencia y
seleccione OReilly
CSS Reference en el
men emergente del
panel Referencia.
2.
3.
4.
5.
6.
7.
115
2.
3.
4.
N O TA
116
Es posible que necesite contraer otro panel, como el panel Archivos, para
ver el panel Estilos CSS al completo. Tambin puede modificar la longitud
del panel Estilos CSS arrastrando las separaciones entre paneles.
6.
7.
8.
En el panel Estilos CSS, haga clic en Actual en la parte superior del panel
y examine sus estilos CSS. En modo Actual, el panel CSS le muestra un
resumen de las propiedades de la seleccin actual. Las propiedades que
se muestran corresponden a las propiedades de la regla p en la hoja de
estilos externa.
A lo largo de la seccin siguiente, va a utilizar los Estilos CSS para crear una
nueva regla. Es mucho ms sencillo utilizar el panel Estilos CSS para crear
una nueva regla que escribir la regla a mano, como hizo cuando cre la hoja
de estilos externa en un principio.
117
2.
3.
118
4.
5.
6.
119
S U G E R E N CI A
Para ms
informacin sobre
cualquier propiedad
de CSS, consulte la
gua de referencia de
OReilly que
acompaa a
Dreamweaver. Para
mostrar la gua,
seleccione Ayuda >
Referencia y
seleccione OReilly
CSS Reference en el
men emergente del
panel Referencia.
7.
8.
9.
2.
Repita el paso 2 para aplicar el estilo de clase negrita a las cuatro primeras
palabras del segundo prrafo.
4.
Guarde la pgina.
121
2.
3.
4.
5.
6.
S UG E R E N CI A
7.
Para ms
informacin sobre
cualquier propiedad
de CSS, consulte la
gua de referencia de
OReilly que
acompaa a
Dreamweaver. Para
mostrar la gua,
seleccione Ayuda >
Referencia y
seleccione OReilly
CSS Reference en el
men emergente del
panel Referencia.
8.
10. Escriba
12. Localice
13.
SUGERENCIA
11.
14. Haga
15.
16.
Aplique la regla
1.
2.
3.
4.
2.
3.
4.
5.
6.
7.
8.
9.
131
1.
2.
Guarde la pgina.
CAPTULO 7
Tutorial: Publicacin
del sitio
135
A c e r ca d e .. .
Crear una carpeta remota con Dreamweaver Si Dreamweaver es su nico mtodo de acceso al
servidor remoto, no podr crear una carpeta vaca en el servidor remoto hasta que haya completado la
configuracin remota en Dreamweaver y se haya establecido una conexin. Si se fuera el caso, puede
definir su directorio de servidor como carpeta remota o crear una carpeta remota despus de haber
establecido una conexin con el servidor. En cualquier caso, siga las instrucciones de este tutorial hasta
que est conectado a un servidor remoto. Una vez establecida la conexin, puede usar el panel Archivos
de Dreamweaver para crear una nueva carpeta remota.
Al establecer una conexin con un servidor remoto, el panel Archivos muestra todos los archivos del
servidor remoto en la Vista remota (igual que muestra todos los archivos locales en la Vista local). Para
mostrar la Vista remota, seleccione Vista remota en el men emergente situado en la parte superior del
panel Archivos o haga clic en Expandir/contraer en la barra de herramientas del panel Archivos. Al hacer
clic en Expandir/contraer, el panel Archivo muestra simultneamente la Vista local y la Vista remota.
Para aadir una carpeta vaca en Vista remota, muestre primero la Vista remota siguiendo uno de los
mtodos descritos anteriormente. (Si al principio no puede ver su conexin, haga clic en Actualizar en la
barra de herramientas del panel Archivos.) Cuando vea que est conectado al servidor Web, haga clic
con el botn derecho (Windows) o haga clic manteniendo presionada la tecla de Control (Macintosh) en
Vista remota y seleccione Nueva carpeta.
Botn Actualizar
Botn Expandir/contraer
2.
3.
4.
5.
6.
7.
8.
10. Haga
clic en Aceptar.
2.
3.
4.
Solucin de problemas de
configuracin de carpetas
remotas (opcional)
Un servidor Web se puede configurar de muchas formas. En la siguiente
lista se ofrece informacin sobre algunos problemas habituales que pueden
surgir al configurar una carpeta remota y sobre cmo solucionarlos:
NO TA
141
PARTE 3
Tutoriales avanzados
La Parte Tres de este libro incluye tutoriales que presentan funciones
avanzadas de Dreamweaver. No se necesita ningn conocimiento previo de
HTML ni de ningn otro lenguaje para realizar estos tutoriales, pero
deber tener presente que los tutoriales de esta parte son ms complejos
que los de la parte anterior.
Esta parte contiene las siguientes secciones:
Tutorial: Utilizacin de cdigo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145
Tutorial: Crear un diseo de pgina basado en CSS . . . . . . . . . . 159
Tutorial: Visualizacin de datos XML. . . . . . . . . . . . . . . . . . . . . . . . 183
Tutorial: Desarrollo de una aplicacin Web . . . . . . . . . . . . . . . . . 207
143
CAPTULO 8
Tutorial: Utilizacin de
cdigo
A medida que aade texto, imgenes y otro contenido a una pgina Web,
Dreamweaver 8 genera cdigo HTML. En este tutorial se explica cmo
utilizar la vista Cdigo para mostrar el cdigo subyacente de un
documento, as como para aadir y editar el cdigo manualmente.
Si ya ha configurado el sitio y ha finalizado el tutorial anterior, puede
continuar trabajando en la misma carpeta index.html.
No es necesario haber finalizado los tutoriales anteriores para seguir el
presente tutorial. En primer lugar, configure el sitio siguiendo las
instrucciones de Tutorial: Configuracin del sitio y de los archivos del
proyecto en la pgina 51. A continuacin, utilice el archivo
index_code.html en la carpeta cafe_townsend/completed_files/
dreamweaver para seguir este tutorial. index_code.html es una copia del
archivo terminado index.html del apartado Captulo 6, Tutorial:
Formatear la pgina con CSS, en la pgina 107.
N OT A
145
NO T A
NO TA
146 Tutorial: Utilizacin de cdigo
(Opcional) Para mostrar slo la vista Diseo, haga clic en vista Diseo.
4.
(Opcional) Para mostrar slo la vista Cdigo, haga clic en vista Cdigo.
Cuando trabaje con sus propias pginas, podr utilizar la vista que le resulte
ms cmoda. En la mayora de los tutoriales de esta gua se presupone que
el usuario emplea la vista Diseo.
Cambio al espacio de
trabajo de edicin de cdigo
(slo Windows)
Si no lo hizo durante la instalacin, ahora puede configurar, si lo desea,
el espacio de trabajo de Windows para que tenga la apariencia y el
funcionamiento de los populares entornos de codificacin de HomeSite
y ColdFusion Studio de Macromedia.
N OT A
2.
3.
4.
Seleccione Ver > Opciones de vista de Cdigo > Ajustar texto para
activar el ajuste del texto en el caso de que no est activado.
5.
Haga clic con el botn derecho del ratn (Windows) o, con la tecla
Control presionada (Macintosh), haga clic en el texto seleccionado y, a
continuacin, seleccione Insertar etiqueta en el men emergente.
Aparecer el Selector de etiquetas.
6.
NO TA
8.
9.
10. Haga
11.
Guarde la pgina.
2.
3.
4.
151
5.
6.
Guarde la pgina.
2.
3.
Haga clic con el botn derecho del ratn (Windows) o, con la tecla
Control presionada (Macintosh), haga clic en el texto seleccionado y a
continuacin elija Referencia en el men emergente.
4.
2.
3.
5.
NO TA
SUGERENCIA
Para desplazarse
rpidamente a una
etiqueta, escriba las
primeras letras del
nombre de la misma.
7.
8.
10. En
La URL del archivo de imagen se insertar como valor del atributo src
y el punto de insercin aparecer despus de las comillas de cierre.
11.
12. Deje
13.
14. Guarde
la pgina.
S U G E R E N C IA
Para aadir un
atributo a una
etiqueta ya creada,
coloque el punto de
insercin justo
despus del valor del
atributo final de la
etiqueta y presione la
barra espaciadora.
Cuando aparezca
una lista de atributos,
aada un atributo y
especifique su valor
si lo tiene.
Imprimir el cdigo
Puede imprimir el cdigo para editarlo fuera de lnea, archivarlo o
distribuirlo.
Para imprimir cdigo:
1.
2.
3.
CAPTULO 9
159
161
Tambin puede abrir el archivo comp original para verlo en la pantalla del
equipo. El archivo comp, homepage-mockup.jpg, puede encontrarlo en la
carpeta fireworks_assets dentro de la carpeta cafe_townsend que copi a su
disco duro en el apartado Captulo 3, Tutorial: Configuracin del sitio y
de los archivos del proyecto. Si lo prefiere, tambin puede imprimir el
comp consultarlo mientras crea la pgina.
Creacin y almacenamiento de
una pgina nueva
Despus de crear un sitio nuevo y examinar los comps, ya puede empezar a
crear pginas Web. Comience creando una pgina nueva y guardndola en
la carpeta raz local cafe_townsend de su sitio Web. Ms adelante esta
pgina ser la pgina de inicio de Cafe Townsend, un restaurante ficticio.
Si no ha creado una carpeta raz local llamada cafe_townsend, deber
hacerlo antes de continuar. Para instrucciones, consulte Captulo 3,
Tutorial: Configuracin del sitio y de los archivos del proyecto.
1.
2.
3.
4.
5.
6.
Insertar capas
A continuacin, va a insertar capas en la pgina. Una capa es un elemento
con posicin absoluta que puede utilizar para albergar imgenes, texto
archivos Flash y otro tipo de contenido. Para ms informacin sobre capas,
consulte Diseo de pgina basado en CSS en la pgina 160.
2.
4.
5.
S U G E R E N C IA
6.
Abra el panel Capas (Ventana > Capas). Como puede ver, Dreamweaver
ha aadido la nueva capa (banner_graphic) a la lista de capas.
7.
Haga clic una vez fuera de la nueva capa para anular su seleccin.
8.
Guarde la pgina.
Aadir ms capas
A continuacin, va a aadir ms capas a la pgina. Va a utilizar la primera
capa (banner_graphic) como punto de referencia para colocar el resto de
capas. Tambin va utilizar la funcin de fondos de capas de CSS para
ayudarle a colocar las capas y a distinguirlas.
1.
2.
3.
La capa flash_fma tiene 700 pxeles de ancho por 166 pxeles de alto.
Adems, est situada a 20 pxeles del margen izquierdo de la pgina y a
111 del margen superior de la pgina. Ha colocado esta capa a 111
pxeles del margen superior de la pgina para que no se solape con la
capa banner_graphic.
Si las capas se solapan, notar como el borde de una de las capas (la que
est debajo) se marca con una lnea de puntos.
4.
Haga clic una vez fuera de la nueva capa para anular su seleccin.
5.
6.
7.
NO TA
S U G E R E N CI A
8.
Insertar capas
171
S U G E R E N C IA
S UG E R E N CI A
9.
Tambin puede
mover una distancia
de un pxel las capas
seleccionadas
pulsando las teclas
de flecha del
teclado. Pruebe a
utilizar el inspector
de propiedades para
alinear la capa
header a una
distancia de 20
pxeles del margen
izquierdo de la
pgina. A
continuacin, utilice
la tecla Flecha arriba
para mover la capa
hacia arriba hasta
que toque el borde
inferior de la capa
flash_fma.
Tambin puede
utilizar el botn
Ayudas visuales en
la barra de
herramientas
Documento para
activar o desactivar
los Fondos de
diseo CSS.
10. Una vez colocadas las capas en posicin, desactive los Fondos de diseo
Haga clic una vez a la derecha de sus capas para asegurarse de que no hay
nada seleccionado.
2.
3.
4.
5.
Utilice la tecla Flecha arriba del teclado para mover la capa navigation
hasta que encaje perfectamente dentro de la capa center_content, tal y
como muestra el ejemplo siguiente:
6.
7.
8.
9.
Arrastre la capa flash_video o utilice las teclas de flecha del teclado para
situar la capa, tal y como muestra el ejemplo siguiente:
10. Cree
11.
12. Una
13.
Arrastre la capa text o utilice las teclas de flecha del teclado para situar la
capa, tal y como muestra el ejemplo siguiente:
N O TA
la pgina.
2.
S U G E R E N CI A
Puede cambiar el
ancho de la columna
Nombre en el panel
Capas arrastrando el
borde derecho del
ttulo de la columna
hacia la izquierda o
la derecha.
El cuadro de texto est situado justo al lado del cuadro de color del
Color de fondo (Col. Fondo).
3.
5.
6.
Repita los pasos anteriores para cambiar tambin el color de la capa text
a un marrn claro.
7.
Una vez definidos los colores de fondo de las tres capas, haga clic una
vez a la derecha de todas sus capas para asegurarse de que no haya nada
seleccionado.
A continuacin cambiar el color de fondo de toda la pgina
modificando las propiedades de la pgina. El cuadro de dilogo
Propiedades de la pgina le permite configurar varias propiedades de la
pgina, incluyendo, entre otros, el tamao y el color de las fuentes de la
pgina, el color de los vnculos visitados, los mrgenes de la pgina.
8.
9.
10. Haga
clic en Aceptar.
Guarde la pgina.
181
CAPTULO 10
Tutorial: Visualizacin de
datos XML
10
Este tutorial le muestra cmo crear una pgina Web que muestre datos
XML. La visualizacin de datos XML implica recuperar informacin
almacenada en un archivo XML local o remoto para, posteriormente,
mostrar dicha informacin en la pgina. La ventaja importante que supone
el uso de datos XML en pginas Web es la posibilidad de separar el
contenido de la presentacin: el contenido de la pgina (los datos) son
totalmente independientes de la presentacin de la pgina (el diseo, el
estilo del texto, etc.). De este modo, cualquiera puede trabajar con el
archivo XML sin necesidad de alterar la presentacin de la pgina, y
viceversa.
Aunque no es imprescindible, se recomienda estar relativamente
familiarizado con las hojas de estilos en cascada (CSS) para poder seguir
este tutorial. De lo contrario, tal vez debera realizar Captulo 6, Tutorial:
Formatear la pgina con CSS, en la pgina 107.
En este tutorial, llevar a cabo las tareas siguientes:
Localizacin de los archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Repaso de la tarea . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
Ms informacin sobre el uso de XML y XSL en pginas
Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
Ms informacin sobre las pginas XSLT . . . . . . . . . . . . . . . . . . . 188
Conversin de una pgina HTML en una pgina XSLT . . . . . . . 190
Adjuntar una fuente de datos XML a la pgina XSLT . . . . . . . . . .191
Modificacin del diseo de la pgina XSLT. . . . . . . . . . . . . . . . . . 193
Vinculacin de datos XML a la pgina XSLT. . . . . . . . . . . . . . . . . 195
Aplicacin de estilos a los datos XML . . . . . . . . . . . . . . . . . . . . . . . 196
Creacin de un vnculo dinmico . . . . . . . . . . . . . . . . . . . . . . . . . . . 198
Aadir un objeto XSLT Repetir regin . . . . . . . . . . . . . . . . . . . . . 200
183
Repaso de la tarea
El Caf Townsend, un restaurante ficticio, publica en la actualidad una lista
de platos diarios en su sitio Web. Para ello, utilizan una tabla HTML con
distintas filas para mostrar la informacin. La columna situada a la
izquierda de cada fila muestra el nombre del artculo y su descripcin. La
columna situada a la derecha de cada fila muestra el precio de cada artculo.
Toda la informacin de la pgina proviene de cdigo manual (es decir, no
procede de una fuente de datos dinmicos) y se ha dado formato al texto
con una hoja de estilos externa.
En este ejemplo, cada etiqueta padre <book> contiene tres etiquetas hijo:
<pubdate>, <title> y <author>. Pero cada etiqueta <book> tambin es
una etiqueta hijo de la etiqueta <mybooks>, que ocupa un nivel superior en
el esquema. No hay restricciones para nombrar y estructurar las etiquetas
XML, siempre y cuando se aniden correctamente unas dentro de otras y
cada etiqueta de apertura tenga su correspondiente etiqueta de cierre.
Los documentos XML no tienen formato alguno: son simples
contenedores de informacin estructurada. (Observar que el cdigo de
muestra no contiene etiquetas de fuentes, tablas o encabezados.) Una vez
conseguido el esquema XML, se puede utilizar el lenguaje XSL (Lenguaje
de hojas de estilo ampliable) para mostrar la informacin. Del mismo
modo que las hojas de estilos en cascada (CSS) permiten dar formato al
HTML, el lenguaje XSL permite dar formato a los datos XML. Puede
definir estilos, elementos de pgina, el diseo, etc., en un archivo XSL y
adjuntarlo a un archivo XML de tal modo que, cuando un usuario visualice
los datos XML en un navegador, stos estn formateados segn lo que haya
definido en el archivo XSL. El contenido (los datos XML) y la presentacin
(definida por el archivo XSL) son totalmente independientes, y
proporcionan un mayor control sobre el modo en que aparece la
informacin en una pgina Web. Esencialmente, XSL es una tecnologa de
presentacin para XML, en la que el resultado principal es una pgina
HTML.
XSLT (Transformaciones de lenguaje de hojas de estilo ampliable) es un
subconjunto del lenguaje XSL que permite mostrar los datos XML en una
pgina Web y transformarlos (junto con los estilos XSL) en informacin
legible y con estilos en formato HTML. Se puede utilizar Dreamweaver
para crear pginas XSLT que permitan realizar transformaciones XSL
mediante un servidor de aplicaciones o un navegador. Al llevar a cabo una
transformacin XSL en el lado del servidor, ste realiza el trabajo de
transformacin de XML y XSL, y muestra los datos en la pgina. Cuando
esta transformacin se produce en el lado del cliente, todo el trabajo corre a
cargo del navegador (por ejemplo, Internet Explorer).
2.
NO TA
191
3.
Haga clic una vez en la ltima fila de la tabla (la fila New York
Cheesecake) y haga clic en la etiqueta <tr> situada ms a la derecha en
el selector de etiquetas para elegir la fila.
2.
Pulse Eliminar.
3.
Repita los pasos anteriores para eliminar la fila Grilled Pacific Salmon y
la fila Thai Noodle Salad. Cuando haya terminado, debera quedar
nicamente una fila en la pgina: la fila Summer Salad.
4.
5.
7.
3.
4.
5.
6.
NO TA
1.
3.
4.
5.
6.
2.
3.
4.
5.
NO TA
2.
3.
4.
5.
6.
2.
3.
4.
5.
6.
7.
Recuerde que los visitantes del sitio accedern a la pgina XML (no la
pgina XSLT) una vez que ambas pginas estn implementadas en el
servidor. Para ms informacin, consulte Acerca de las
transformaciones XSL en el lado del cliente en Utilizacin de
Dreamweaver (Ayuda > Utilizacin de Dreamweaver).
CAPTULO 11
Tutorial: Desarrollo de
una aplicacin Web
11
Antes de comenzar
Debe configurar el entorno de trabajo de Dreamweaver para el desarrollo
de aplicaciones antes de completar este tutorial. Para obtener informacin
de configuracin, consulte el captulo de configuracin correspondiente a
su servidor de aplicacin de la siguiente lista. Si no est seguro del servidor
de aplicaciones que utiliza, consulte al administrador del sistema.
207
Configurar el sistema.
No habr completado este tutorial hasta haber llevado a cabo esas tareas.
Las pantallas de ejemplo de este captulo muestran cuadros de dilogo de
Macromedia ColdFusion. Sin embargo, puede seguir las lecciones de este
tutorial utilizando cualquiera de los modelos de servidor compatibles con
Dreamweaver.
Repaso de la tarea
La tarea consiste en crear las siguientes pginas dinmicas para el sitio Web
de Cafe Townsend:
2.
3.
4.
Definicin de un juego de
registros
A continuacin crear un juego de registros para seleccionar los datos que
desea mostrar. Un juego de registros es un conjunto de informacin
extrada de una base de datos mediante una consulta de base de datos. (En
ASP.NET se denomina conjunto de datos o DataSet.) Una consulta de base
de datos es una manera de solicitar datos de una base de datos utilizando
criterios de bsqueda especificados, normalmente en un lenguaje
denominado SQL. A continuacin, utilice la informacin extrada como
origen del contenido de las pginas dinmicas.
Dreamweaver ofrece una interfaz fcil de usar para la creacin de consultas
SQL sencillas (no es necesario tener conocimientos de SQL para crear un
juego de registros en Dreamweaver).
Crear un juego de registros que seleccione todos los valores de la tabla
COMMENTS de la base de datos del tutorial.
N OT A
2.
211
N OT A
4.
5.
6.
7.
8.
9.
de datos.
12. Haga
Si no ve todos los
campos de juegos de
registros en el panel
Vinculaciones, haga
clic en el signo ms
(+) (Windows) o en la
flecha de ampliacin
(Macintosh) situada
junto a Juego de
registros
(rs_Comment) para
expandir la estructura
del juego de
registros.
A continuacin crear una pgina que incluya los registros que contiene la
tabla COMMENTS. Generar dinmicamente la pgina en lugar de
introducir manualmente la informacin.
Comenzar creando una tabla para estructurar la lista de datos.
1.
2.
En Filas, introduzca 2.
En Columnas, introduzca 4.
4.
5.
6.
Guarde la pgina.
2.
3.
4.
Guarde la pgina.
2.
3.
4.
Guarde la pgina.
Visualizacin de la pgina
A continuacin, ver la pgina. Para ver una pgina en Dreamweaver con la
apariencia que tendra al ser procesada por el servidor. puede utilizar la vista
Live Data.
Con el documento Cafe Townsend an activo, siga uno de estos
procedimientos para ver los datos en sus pginas:
Creacin de un formulario de
insercin de registro
La pgina siguiente que cree para el sitio Web de Cafe Townsend permitir
a los clientes aadir comentarios a la base de datos.
Dreamweaver incluye diversos objetos de aplicacin para ayudarle a crear
pginas de aplicacin Web de forma rpida y sencilla. En este ejercicio,
usted utilizar un objeto de aplicacin para crear la pgina de insercin. El
objeto de aplicacin Insertar registro crea un formulario HTML, campos
de datos que se corresponden con campos en la base de datos y los scripts
de servidor necesarios para crear una pgina dinmica.
2.
3.
4.
5.
6.
7.
8.
9.
2.
3.
4.
5.
6.
7.
8.
Repita los pasos del 3 al 6 para el campo de formulario EMAIL, con una
etiqueta Email, mostrndolo como campo de texto y envindolo como
texto.
9.
10. En
11.
12. Haga
13.
Guarde la pgina.
2.
NO TA
Con el archivo send como documento activo, seleccione Archivo > Vista
previa en el navegador o pulse F12 para ver su pgina en un navegador.
4.
Lecturas adicionales
En este tutorial se ha facilitado informacin sobre un pequeo conjunto de
herramientas que se pueden utilizar para crear pginas dinmicas
gestionadas por datos. En esta leccin ha aprendido a crear juegos de
registros para definir los datos que desea emplear en el sitio Web. Tambin
ha utilizado un objeto de aplicacin de Dreamweaver para crear una
aplicacin Web efectiva que permite interactuar con los datos almacenados
en la base de datos.
PARTE 4
Apndices
La Parte Cuatro de este libro contiene apndices que ofrecen informacin
adicional sobre los conceptos que se utilizan en las secciones precedentes.
Esta parte contiene las siguientes secciones:
Aspectos bsicos de las aplicaciones Web . . . . . . . . . . . . . . . . . . 231
Instalacin de un servidor Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . 247
Configuracin del sitio ColdFusion de muestra . . . . . . . . . . . . . . 253
Configuracin del sitio ASP.NET de muestra . . . . . . . . . . . . . . . . 271
Configuracin del sitio ASP de muestra . . . . . . . . . . . . . . . . . . . . 285
Configuracin del sitio JSP de muestra . . . . . . . . . . . . . . . . . . . . 303
Configuracin del sitio PHP de muestra . . . . . . . . . . . . . . . . . . . . . 321
229
APNDICE A
Aplicaciones Web
Una aplicacin Web es un sitio Web que contiene pginas con contenido
sin determinar, parcialmente o en su totalidad. El contenido final de una
pgina se determina slo cuando el usuario solicita una pgina del servidor
Web. Dado que el contenido final de la pgina vara de una peticin a otra
en funcin de las acciones del visitante, este tipo de pgina se denomina
pgina dinmica.
Las aplicaciones Web se crean en respuesta a diversas necesidades o
problemas. En esta seccin se describen los usos ms habituales de las
aplicaciones Web y se proporciona un ejemplo sencillo.
231
Funcionamiento de una
aplicacin Web
Una aplicacin Web es un conjunto de pginas Web estticas y dinmicas.
Una pgina Web esttica es aqulla que no cambia cuando un usuario la
solicita: el servidor Web enva la pgina al navegador Web solicitante sin
modificarla. Por el contrario, el servidor modifica las pginas Web dinmicas
antes de enviarlas al navegador solicitante. La naturaleza cambiante de este
tipo de pgina es la que le da el nombre de dinmica.
Por ejemplo, podra disear una pgina para que mostrara los resultados del
programa de salud y dejara cierta informacin fuera (como el nombre del
empleado y sus resultados) para calcularla cuando la pgina la solicite un
empleado en particular.
Paso 1: el
navegador Web
solicita la pgina
esttica.
Servidor Web
Peticin
Respuesta
SERVIDOR WEB
Paso 2: el
servidor
localiza la
pgina.
Paso 3: el servidor
Web enva la pgina
al navegador
solicitante.
<HTML>
<p>Hi
</HTML>
Pgina esttica
Navegador Web
Paso 1 - el
navegador Web
solicita la pgina
dinmica.
Peticin
Respuesta
Paso 5- el servidor
Web enva la pgina
finalizada al
navegador
solicitante.
SERVIDOR WEB
Paso 2 - el
servidor Web
localiza la pgina
y la enva al
servidor de
aplicaciones.
Paso 3 - el
servidor de
aplicaciones busca
instrucciones en la
pgina y la termina.
<HTML>
<code>
</HTML>
<HTML>
<p>Hi
</HTML>
Servidor de aplicaciones
Paso 4- el servidor
de aplicaciones
pasa la pgina
terminada al
servidor Web.
Paso 1 - el navegador
Web solicita la pgina
dinmica.
Navegador Web
Peticin
Respuesta
Paso 9- el servidor
Web enva la pgina
finalizada al
navegador
solicitante.
SERVIDOR WEB
Paso 2 - el servidor
Web localiza la
pgina y la enva al
servidor de
aplicaciones.
<HTML>
<code>
</HTML>
Paso 3- el servidor
de aplicaciones
busca instrucciones
en la pgina.
<HTML>
<p>Hi
</HTML>
Paso 8- el servidor
de aplicaciones
inserta los datos en
una pgina y luego
pasa la pgina al
servidor Web.
Servidor de aplicaciones
Paso 4- el servidor
de aplicaciones enva
la consulta al
controlador de la
base de datos.
Paso 5- el
controlador ejecuta la
consulta en la base
de datos.
Consulta
Juego de registros
Paso 7- el
controlador pasa el
juego de registros al
servidor de
aplicaciones.
Paso 6 - el juego de
registros se devuelve al
controlador.
Base de datos
2.
Lenguaje
ColdFusion
ASP.NET
Visual Basic
C#
VBScript
JavaScript
Java
PHP
PHP
Terminologa de aplicaciones
Web
En esta seccin se definen trminos utilizados con frecuencia relacionados
con las aplicaciones Web.
es un software que ayuda al servidor Web a
procesar las pginas que contienen scripts o etiquetas del lado del servidor.
Cuando se solicita al servidor una pgina de este tipo, el servidor Web pasa
la pgina al servidor de aplicaciones para su procesamiento antes de
enviarla al navegador. Para ms informacin, consulte Funcionamiento de
una aplicacin Web en la pgina 234.
Un servidor de aplicaciones
Campos (columnas)
Nmero
Apellido
Nombre
Cargo
Objetivo
Registros
(filas)
(DBMS o sistema de
base de datos) es un software que se utiliza para crear y manipular bases de
datos. Entre los sistemas de bases de datos ms habituales figuran Microsoft
Access, Oracle 9i y MySQL.
Un juego de registros
Nmero
Apellido
Nombre
Cargo
Objetivos
Apellido
Nombre
Cargo
Una base de datos relacional es una base de datos que contiene mltiples
Macromedia ColdFusion
Microsoft ASP.NET
APNDICE B
Instalacin de un
servidor Web
247
Introduccin
Si es usted usuario de Windows, puede instalar y ejecutar Internet
Information Server (IIS) en su equipo. Tambin puede instalar el servidor
Web en un equipo Windows conectado en red para que otros
desarrolladores de su equipo puedan utilizarlo.
Los usuarios de Windows que deseen desarrollar aplicaciones ColdFusion
pueden utilizar, en lugar de ello, el servidor Web instalado con la edicin
para desarrolladores de ColdFusion MX 7. Para ms informacin, consulte
Apndice C, Configuracin del sitio ColdFusion de muestra, en
la pgina 253.
Puede que IIS ya est instalado en su equipo. Compruebe la estructura de
carpetas para averiguar si contiene una carpeta denominada C:\Inetpub o
D:\Inetpub. IIS crea esta carpeta durante la instalacin.
Si la carpeta no existe, instale IIS. Para ms informacin, consulte
Instalacin de Internet Information Server en la pgina 248.
Si es usted usuario de Macintosh y est interesado en desarrollar
aplicaciones PHP, puede utilizar el servidor Web Apache ya instalado en su
equipo Macintosh. Para ms informacin, consulte Comprobacin del
servidor Web de Macintosh (desarrolladores PHP) en la pgina 250.
Instalacin de Internet
Information Server
Los usuarios de Windows 2000 y Windows XP Professional deben instalar
Internet Information Server (IIS).
Si es usted usuario de Windows 2000 o Windows XP Professional,
compruebe si IIS est instalado y en ejecucin en su sistema. Para ello,
busque la carpeta C:\Inetpub. Si no existe, es probable que IIS no est
instalado en el sistema.
Para instalar IIS en Windows 2000 y XP Professional:
1.
Seleccione Inicio > Configuracin > Panel de control > Agregar o quitar
programas o Inicio > Panel de control > Agregar o quitar programas.
2.
3.
4.
Comprobacin de IIS
Para comprobar el servidor Web, cree una pgina HTML sencilla llamada
myTestFile.htm y gurdela en la carpeta Inetpub\wwwroot del equipo en el
que se ejecuta el servidor Web. La pgina HTML puede constar de una sola
lnea, como, por ejemplo:
<p>My web server is working.</p>
Otra expresin que puede utilizar en lugar del nombre del servidor o
localhost es 127.0.0.1 (por ejemplo, http://127.0.0.1/gamelan/soleil.htm).
APNDICE C
Listas de comprobacin de la
configuracin para
desarrolladores de ColdFusion
Para configurar una aplicacin Web, debe configurar el sistema, definir un
sitio de Dreamweaver y conectar con una base de datos. En esta seccin se
ofrecen las listas de comprobacin para cada una de estas tareas. Las tareas
se describen detalladamente en el resto del captulo.
253
Configure el sistema:
1.
2.
2.
3.
4.
5.
2.
PC de WINDOWS
Dreamweaver
MAC o PC de WINDOWS
Dreamweaver
Servidor ColdFusion
SERVIDOR DE WINDOWS
Servidor ColdFusion
2.
N O TA
Instalacin de ColdFusion MX 7
Para procesar pginas Web dinmicas, necesitar un servidor Web y un
servidor de aplicaciones. ColdFusion MX 7 le proporciona los dos. Un
servidor Web es un software que suministra pginas Web en respuesta a las
peticiones de los navegadores Web. Un servidor de aplicaciones es un
software que ayuda al servidor Web a procesar las pginas que contienen
scripts o etiquetas del lado del servidor. Cuando un navegador solicita una
pgina de este tipo, el servidor Web remite la pgina al servidor de
aplicaciones para su procesamiento antes de enviarla al navegador. Para ms
informacin, consulte Aspectos bsicos de las aplicaciones Web en
la pgina 231.
Puede descargar e instalar una versin de ColdFusion MX 7 para
desarrolladores con todas las funciones desde el sitio Web de Macromedia
www.macromedia.com/go/coldfusion/. Asegrese de que selecciona la
versin de Windows de ColdFusion MX 7 Developer Edition. Tambin
dispone de una copia de ColdFusion MX 7 Developer Edition en el CD de
Dreamweaver (slo para Windows).
N OT A
2.
3.
4.
N OT A
Definicin de un sitio de
Dreamweaver (ColdFusion)
Una vez que haya configurado el sistema, copie los archivos de muestra en
una carpeta local y defina un sitio de Dreamweaver para administrar los
archivos.
Para definir un sitio de Dreamweaver:
1.
Copie los archivos de muestra en una carpeta del disco duro (vase
Copia de los archivos de muestra en la pgina 261).
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites (Macintosh).
NO TA
3.
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites/
cafe_townsend/contact/coldfusion (Macintosh)
Deje abierto el cuadro de dilogo Definicin del sitio. Defina una carpeta
del servidor Web como carpeta remota de Dreamweaver.
2.
NO T A
2.
3.
4.
N OT A
Una vez especificada una carpeta en la que procesar las pginas dinmicas,
cargue los archivos de muestra al servidor Web.
SUGERENCIA
5.
El prefijo de URL
debe especificar
siempre una carpeta
en lugar de una
pgina concreta del
sitio. Asimismo,
asegrese de utilizar
la misma
combinacin de
maysculas y
minsculas que la
empleada al crear la
carpeta.
2.
2.
C:\Archivos de
programa\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_townsend
\data\tutorial.mdb (Windows)
Cuando la base de datos est en el equipo remoto, cree una fuente de datos
de ColdFusion.
2.
3.
N OT A
5.
C:\Archivos de programa\Macromedia\Dreamweaver
8\Tutorial_assets\cafe_townsend\data\tutorial.mdb
7.
APNDICE D
Listas de comprobacin de la
configuracin para
desarrolladores de ASP.NET
Para configurar una aplicacin Web, debe configurar el sistema, definir un
sitio de Dreamweaver y conectar con una base de datos. En esta seccin se
ofrecen las listas de comprobacin para cada una de estas tareas. Las tareas
se describen detalladamente en el resto del captulo.
271
Configure el sistema:
1.
2.
3.
2.
3.
4.
5.
2.
WINDOWS 2000 o XP
MAC o PC de WINDOWS
Dreamweaver
Dreamweaver
IIS 5 o superior
.NET Framework
SERVIDOR DE WINDOWS
IIS 5 o superior
.NET Framework
2.
3.
NO T A
2.
3.
N OT A
2.
Definicin de un sitio de
Dreamweaver (ASP.NET)
Una vez que haya configurado el sistema, copie los archivos de muestra en
una carpeta local y defina un sitio de Dreamweaver para administrar los
archivos.
Para definir un sitio de Dreamweaver:
1.
Copie los archivos de muestra en una carpeta del disco duro (vase
Copia de los archivos de muestra en la pgina 277).
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites (Macintosh).
N OT A
3.
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites/
cafe_townsend/contact/aspnet (Macintosh)
Deje abierto el cuadro de dilogo Definicin del sitio. Defina una carpeta
del servidor Web como carpeta remota de Dreamweaver.
2.
NO TA
2.
3.
4.
Una vez especificada una carpeta en la que procesar las pginas dinmicas,
cargue los archivos de muestra al servidor Web.
S U G E R E N C IA
5.
El prefijo de URL
debe especificar
siempre un directorio
en lugar de una
pgina concreta del
sitio. Asimismo,
asegrese de utilizar
la misma
combinacin de
maysculas y
minsculas que la
empleada al crear la
carpeta.
2.
2.
C:\Archivos de
programa\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_townsend
\data\tutorial.mdb (Windows)
2.
Haga clic en el botn del signo ms (+) del panel Bases de datos y
seleccione Conexin de base de datos OLE en el-men emergente.
Aparecer el cuadro de dilogo Conexin de base de datos OLE.
3.
4.
5.
6.
NO T A
Por ejemplo, puede escribir esta ruta como el valor de Fuente de datos
para una base de datos en su disco duro local:
Fuente de datos=C:\Archivos
de programa\Macromedia\Dreamweaver 8\Tutorial_assets\data\tutoria
l.mdb;
Tambin puede introducir esta ruta para una base de datos en un
servidor remoto:
Fuente de datos=C:\users\Denman\Sites\data\tutorial.mdb;
7.
8.
9.
APNDICE E
285
Listas de comprobacin de la
configuracin para
desarrolladores de ASP
Para configurar una aplicacin Web, debe configurar el sistema, definir un
sitio de Dreamweaver y conectar con una base de datos. En esta seccin se
ofrecen las listas de comprobacin para cada una de estas tareas. Las tareas
se describen detalladamente en el resto del captulo.
Configure el sistema:
1.
2.
3.
Compruebe la instalacin.
4.
2.
3.
4.
5.
2.
PC de WINDOWS
Dreamweaver
MAC o PC de WINDOWS
Dreamweaver
IIS
SERVIDOR DE WINDOWS
IIS
2.
3.
4.
NO TA
Comprobacin de la instalacin
Puede comprobar el motor ASP de IIS ejecutando una pgina de prueba.
Para comprobar el motor ASP de IIS:
1.
2.
4.
NO TA
b.
c.
d.
e.
Definicin de un sitio de
Dreamweaver (ASP)
Una vez que haya configurado el sistema, copie los archivos de muestra en
una carpeta local y defina un sitio de Dreamweaver para administrar los
archivos.
Para definir un sitio de Dreamweaver:
1.
Copie los archivos de muestra en una carpeta del disco duro (vase
Copia de los archivos de muestra en la pgina 293).
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites (Macintosh).
NO TA
3.
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites/
cafe_townsend/contact/asp (Macintosh)
Deje abierto el cuadro de dilogo Definicin del sitio. Defina una carpeta
del servidor Web como carpeta remota de Dreamweaver.
2.
NO TA
2.
3.
4.
Una vez especificada una carpeta en la que procesar las pginas dinmicas,
cargue los archivos de muestra al servidor Web.
SUGERENCIA
5.
El prefijo de URL
debe especificar
siempre un directorio
en lugar de una
pgina concreta del
sitio. Asimismo,
asegrese de utilizar
la misma
combinacin de
maysculas y
minsculas que la
empleada al crear la
carpeta.
2.
2.
C:\Archivos de
programa\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_towns
end\data\tutorial.mdb (Windows)
2.
NO TA
3.
2.
3.
4.
Los usuarios de Macintosh pueden pasar por alto este paso porque
todas las conexiones de base de datos utilizan DSN en el servidor
de prueba.
5.
6.
7.
Compruebe el DSN.
APNDICE F
303
Listas de comprobacin de la
configuracin para
desarrolladores de JSP
Para configurar una aplicacin Web, debe configurar el sistema, definir un
sitio de Dreamweaver y conectar con una base de datos. En esta seccin se
ofrecen las listas de comprobacin para cada una de estas tareas. Las tareas
se describen detalladamente en el resto del captulo.
Configure el sistema:
1.
2.
3.
2.
3.
4.
5.
2.
3.
PC de WINDOWS
MAC o PC de WINDOWS
Dreamweaver
Dreamweaver
IIS
SERVIDOR DE WINDOWS
IIS
2.
3.
NO T A
2.
3.
4.
5.
6.
7.
Despus de instalar e iniciar JRun, cree una carpeta raz para la aplicacin
Web.
NO T A
b.
c.
d.
e.
Definicin de un sitio de
Dreamweaver (JSP)
Una vez que haya configurado el sistema, copie los archivos de muestra en
una carpeta local y defina un sitio de Dreamweaver para administrar los
archivos.
Para definir un sitio de Dreamweaver:
1.
Copie los archivos de muestra en una carpeta del disco duro (vase
Copia de los archivos de muestra en la pgina 309).
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites (Macintosh).
N OT A
2.
3.
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites/
cafe_townsend/contact/jsp (Macintosh)
Deje abierto el cuadro de dilogo Definicin del sitio. Defina una carpeta
del servidor Web como carpeta remota de Dreamweaver.
2.
NO TA
311
2.
3.
4.
Una vez especificada una carpeta en la que procesar las pginas dinmicas,
cargue los archivos de muestra al servidor Web.
SUGERENCIA
5.
El prefijo de URL
debe especificar
siempre un directorio
en lugar de una
pgina concreta del
sitio. Asimismo,
asegrese de utilizar
la misma
combinacin de
maysculas y
minsculas que la
empleada al crear la
carpeta.
2.
2.
3.
C:\Archivos de
programa\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_towns
end\data\tutorial.mdb (Windows)
3.
4.
2.
Haga clic en el botn de signo ms (+) del panel y elija Base de datos
ODBC (controlador JDBC-ODBC Sun) en el men emergente.
Aparecer el cuadro de dilogo Base de datos ODBC (controlador
JDBC-ODBC Sun).
3.
4.
Los usuarios de Macintosh pueden pasar por alto este paso porque
todas las conexiones de base de datos utilizan controladores en el
servidor de prueba.
5.
6.
7.
APNDICE G
http://developer.apple.com/internet/opensource/php.html
www.entropy.ch/software/macosx/php/
321
Listas de comprobacin de la
configuracin para
desarrolladores de PHP
Para configurar una aplicacin Web, debe configurar el sistema, definir un
sitio de Dreamweaver y conectar con una base de datos. En esta seccin se
ofrecen las listas de comprobacin para cada una de estas tareas. Las tareas
se describen detalladamente en el resto del captulo.
Configure el sistema:
1.
2.
3.
Compruebe la instalacin.
4.
2.
3.
4.
5.
2.
PC de WINDOWS
Dreamweaver
MAC o PC de WINDOWS
Dreamweaver
IIS
SERVIDOR DE WINDOWS
IIS
2.
3.
4.
Cree una carpeta raz (vase Creacin de una carpeta raz (Windows)
en la pgina 329).
NO TA
2.
3.
4.
5.
6.
7.
8.
S U G E R E N CI A
No olvide incluir la
barra final.
9.
10. Elimine
11.
Reinicie IIS.
2.
4.
NO T A
b.
c.
d.
e.
http://developer.apple.com/internet/opensource/php.html
www.entropy.ch/software/macosx/php/
2.
3.
4.
5.
Si examina el cdigo fuente (View > View Source en Safari) observar que
la pgina no utiliza ningn JavaScript del lado del cliente para conseguir
este efecto.
Definicin de un sitio de
Dreamweaver (PHP)
Una vez que haya configurado el sistema, copie los archivos de muestra en
una carpeta local y defina un sitio de Dreamweaver para administrar los
archivos.
Para definir un sitio de Dreamweaver:
1.
Copie los archivos de muestra en una carpeta del disco duro (vase
Copia de los archivos de muestra en la pgina 333).
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites (Macintosh).
NO TA
3.
2.
3.
4.
5.
/Users/su_nombre_de_usuario/Documents/local_sites/
cafe_townsend/contact/php (Macintosh)
Deje abierto el cuadro de dilogo Definicin del sitio. Defina una carpeta
del servidor Web como carpeta remota de Dreamweaver.
2.
NO T A
2.
3.
4.
Una vez especificada una carpeta en la que procesar las pginas dinmicas,
cargue los archivos de muestra al servidor Web.
S U G E R E N CI A
5.
El prefijo de URL
debe especificar
siempre un directorio
en lugar de una
pgina concreta del
sitio. Asimismo,
asegrese de utilizar
la misma
combinacin de
maysculas y
minsculas que la
empleada al crear la
carpeta.
2.
2.
C:\Archivos de
programa\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_towns
end\data\insert.sql (Windows)
3.
4.
7.
8.
2.
3.
4.
5.
6.
7.
8.
ndice alfabtico
Smbolos
.NET Framework
instalar 274
A
Access. Vase Microsoft Access
Active Server Pages. Vase ASP
activos, aadir a un sitio 53
Activos, panel 88
Actualizar, botn 147
Apache Tomcat, servidor de aplicaciones 242
Aplicacin, categora de la barra Insertar 218, 221
aplicaciones Web
acerca de
ASP, configurar 285
ASP.NET, configurar 271
ColdFusion, configurar 253
definicin 244
desarrollar 207
JSP, configurar 303
PHP, configurar 321
usos comunes 232
aplicaciones Web. Vase Aplicaciones Web
Apple. Vase Mac OS X
archivos
cargar al servidor 226
cargar desde la carpeta local 139
cargar muestra 265, 281, 297, 313
archivos de texto en vista Cdigo 97
ASP
aplicaciones Web, configurar 285
hora, mostrar 289
servidores de aplicaciones, instalar 289
solucionar problemas 290
ASP.NET
aplicaciones Web, configurar 271
B
barra de estado
acerca de 34
men emergente Tamao de ventana 35
Barra de herramientas de codificacin 38
barras de herramientas
Codificacin 38
Documento 33, 219
base de datos de muestra, conectarse a
ASP 298, 300
ASP.NET 282
ColdFusion 266
JSP 318
PHP 341
base de datos MySQL 239
descargar 338
base de datos Oracle 9i 239
bases de datos
acerca de 242
basadas en archivos
basadas en servidor
conectarse a (ASP) 300, 318, 341
conectarse a (ASP.NET) 282
conectarse a (ColdFusion) 266
consultas 237, 243
controladores 237, 243
elegir
juegos de registros para
343
C
C# (lenguaje) 240
capas 160
anidar 172
insertar 164
cargar archivos
muestra 338
carpetas locales
carpetas raz 262
definir 5557, 278, 294, 310, 334
carpetas raz
crear (ASP) 291
crear (ASP.NET) 275
crear (ColdFusion) 259
crear (JSP) 308
crear (PHP) 329
definir 278, 294, 310, 334
Vase tambin Carpetas locales
carpetas remotas 136
crear con Dreamweaver 137
definir (ASP) 294
definir (ASP.NET) 278
definir (ColdFusion) 263
definir (JSP) 311
definir (PHP) 335
solucionar problemas de configuracin 140
CFML (ColdFusion Markup Language) 239
cdigo
crear con el Selector de etiquetas 148
imprimir 158
cdigo, sugerencias 154
Cdigo, vista
Diseo, vista y especificar una u otra 33
mostrar archivos de texto 97
mostrar con vista Diseo 146, 147
ColdFusion
aplicaciones Web, configurar 253
instalar 256
ColdFusion Administrator 267
ColdFusion Markup Language (CFML) 239
ColdFusion MX Server Developer Edition 256
ColdFusion Studio 148
ColdFusion, lenguajes utilizados 240
344
ndice alfabtico
D
datos
dinmico, insertar 217
extraer de bases de datos 237
DBMS (sistemas de administracin de bases de datos).
Vase sistemas de administracin de bases de
datos
definicin de carpetas remotas 263, 278, 294, 311,
335
definiciones de trminos de aplicaciones Web 242
descargar, ajustar el tiempo 35
dinmicos, campos 217
direcciones de red numricas 252
direcciones IP y nmero (127.0.0.1) 252
diseo
basado en CSS 159
basado en tablas 5977
diseo del espacio de trabajo, codificacin 148
Diseo, vista
Documento, barra de herramientas
acerca de 33
vista Live Data 219
documentos
guardar 61, 163
mostrar en fichas (Macintosh) 44
E
edicin, etiquetas 151
ejemplos de aplicaciones Web 232
espacio de trabajo
acerca de 29
diseo 43
diseo flotante 30
espacio de trabajo de edicin de cdigo 148
especificar servidores de prueba 264, 279, 296, 312,
336
Estilos CSS, panel 41, 116
etiquetas
buscar informacin de referencia 153
editar 151
elegir 148
lado del servidor 237
Selector de etiquetas 148
sugerencias 154
extraer datos de las bases de datos 237
F
Flash
insertar archivos SWF 90
reproducir contenido en Dreamweaver 92
Flash Video, insertar 93
Formulario de insercin de registro, cuadro de dilogo
222
formularios de insercin de registros, crear 220
fuentes de datos
ColdFusion 267
fuentes, cambiar el tamao en ayuda 26
G
generales, preferencias 148
glosario de trminos comunes de aplicaciones Web 242
H
Herramienta Mano 35
Hojas de estilos en cascada (CSS)
acerca de 110
adjuntar 114
crear 112
Estilos CSS, panel 41
formatear con 107133
y diseo 159
HomeSite 148
hora, mostrar en ASP 289
HTML
lenguajes de programacin incrustados 239
Vase tambin Cdigo
I
IBM WebSphere, servidor de aplicaciones 242
IIS (Internet Information Services) 241
acerca de 248
herramienta administrativa, iniciar 276
instalar 248
soporte de ASP.NET 274
imgenes, insertar 8289
Insertar registro, objeto 220
Insertar, barra
Aplicacin, categora 218, 221
categoras 36
inspector de etiquetas 151
instalar
.NET Framework 274
ColdFusion MX 256
Dreamweaver 13
IIS (Internet Information Services) 248
servidores de aplicaciones, ASP 289
servidores de aplicaciones, JSP 306
servidores de aplicaciones, PHP 325
J
Java 240
Java Server Pages (JSP) 240
JavaScript 240
JRun
JSP (Java Server Pages)
aplicaciones Web, configurar 303
servidores de aplicaciones, instalar 306
juegos de registros
comprobar 214
crear 211
definicin 243
Vase tambin Bases de datos
ndice alfabtico
345
L
Lenguaje de consulta estructurado (SQL) 237
lenguajes de scripts del lado del servidor 240
lenguajes, lado del servidor 239, 240
listas de comprobacin
ASP.NET, configurar 272
configuracin de ColdFusion 254
configurar ASP 286
configurar JSP 304
configurar PHP 322
localhost 251
M
Macintosh
Mac OS X con Apache y PHP
servidores 250
Macintosh, documentos en fichas 44
Macromedia JRun
instalar 307
marcadores de posicin de imagen
acerca de 73
crear imgenes desde 83
insertar 72
men de encabezado de columna 64
men emergente Tamao de ventana 35
Microsoft Access 239
Microsoft Internet Information Server (IIS). Vase IIS
Microsoft Personal Web Server (PWS) 245, 248
Microsoft SQL Server 239
modelos de servidor. Vase Tecnologas de servidor
modificar, etiquetas 151
modo de tablas expandidas 66
N
Netscape Enterprise Server 245
nmero de IP 127.0.0.1 252
O
objeto XSLT Repetir regin 200
opcin de prefijo de URL 264, 280, 297, 313, 337
P
pginas
dinmicas, crear 239
346
ndice alfabtico
dinmicas, definidas
dinmicas, procesar 236
estticas 235
insercin de registros 220
mostrar datos de bases de datos 237
pginas dinmicas
acerca de 243
procesar en ASP 296
procesar en ASP.NET 279
procesar en ColdFusion 264
procesar en JSP 312
procesar en PHP 336
utilizar 236, 239
pginas estticas 235
Vase tambin Pginas
pginas Web. Vase Pginas
paneles
Activos 88
Comportamientos de servidor, panel 218
vinculaciones, panel 211
PHP
aplicaciones Web, configurar 321
Mac OS X, configurar
servidores de aplicaciones (Windows), instalar 325
solucionar problemas (Macintosh) 331
solucionar problemas (Windows) 328
PHP, tecnologa de servidor 240
preferencias, cuadro de dilogo, categora General 148
publicar 135141
PWS (Microsoft Personal Web Server) 245
acerca de 248
soporte de ASP.NET 274
R
Referencia, panel 153
regiones repetidas, crear 218
registrar Dreamweaver 14
registros
insertar 220
mostrar 215
S
scripts, lado del servidor 237
selector de color 76
Selector de etiquetas 148
selector de etiquetas 101
Sequel (SQL) 237
T
tabla, men de encabezado 64
tablas
acerca de 64
base de datos 237
configurar propiedades 6671
crear un diseo con 5977
insertar 6266, 215
modo de tablas expandidas 66
tecnologas de servidor
compatibles 240
definicin 244
elegir 241
terminologa para aplicaciones Web 242
trminos comunes de aplicaciones Web, definiciones
242
texto
dinmico 217
insertar 97
insertar, dinmico 217
seleccionar 97
texto alternativo 72
texto dinmico, insertar 217
tipogrficas, convenciones 14
Tomcat, servidor de aplicaciones 242
V
variables de CFML 239
VBScript 240
Ventana de documento
aspectos bsicos 32
barra de estado 34
barra de ttulo 32
men emergente Tamao de ventana 35
selector de etiquetas 35
tamao del documento y tiempo de descarga 35
vinculaciones, panel 211
vnculos, crear 102
vista Live Data 219
solucionar problemas 265, 281, 297, 313, 338
ndice alfabtico
347
W
WebSphere 242
X
XML (Lenguaje de formato ampliable)
acerca de 186
aplicar estilos 196
crear vnculos con 198
visualizar en pginas Web 183
XSL (Lenguaje de hojas de estilo ampliable) 187
transformaciones del lado del cliente 189
Vase tambin XSLT
XSLT (Transformaciones de lenguaje de hoja de estilos
extensible)
acerca de 187
fragmentos 189
objeto XSLT Repetir regin 200
pginas 189
pginas, adjuntar datos XML a 191
pginas, convertir a 190
pginas, mostrar datos XML en 195
pginas, vincular a archivos XML 203
y transformaciones en el lado del cliente 189
348
ndice alfabtico