Manual

La solucin ideal para sitios La solucin ideal para sitios La solucin ideal para sitios Web fantsticos Web
fantsticos Web fantsticos
Manual de Usuario
Copyright 1997-2000 Namo Interactive Inc. Todo el contenido de este manual, junto con el programa Namo WebEditor, est protegido por las leyes de derechos de propiedad de autor de la Repblica de Corea as como por los tratados de propiedad intelectual internacionales. Ninguna parte de este libro puede reproducirse o transmitirse en forma alguna ni por cualquier medio sin el consentimiento escrito expreso de Namo Interactive Inc. Namo Interactive Inc. P.O. Box 317 Kangnam Post Office Seoul, Korea, 135-610 Telfono: +82-2-5599-333 Fax : +82-2-5599-334 Web: http://www.namo.com Namo WebEditor es una marca registrada de Namo Interactive Inc. Todos los otros nombres de productos contenidos en este libro son las marcas registradas de sus dueos respectivos
ii
Contenido
Requisitos del Sistema .........................................................................1 Instalando Namo WebEditor 4 .............................................................2 Acerca de este manual .........................................................................3 Obteniendo soporte tcnico .................................................................4
Comenzando con su Pgina Inicial ...............5 Captulo 1

Sitios Web 7
1.1 Usando el Asistente de Sitios Web ............................................8
1.1.1 1.1.2 1.1.3 1.1.4 1.2.1 1.2.2 1.2.3 1.3.1 1.3.2 1.3.3 1.3.4 texto 1.3.5 1.4.1 1.4.2 1.4.3 1.4.4 Paso Paso Paso Paso 1: 2: 3: 4: Seleccionar una plantilla para el sitio Web Proporcionar informacin del sitio Web Seleccionar un tema Seleccionar una carpeta 8 9 9 10
Creando un Proyecto con el Asistente de
1.2
Agregando contenido personal ...............................................12

Agregando texto Agregando imgenes Guardando un documento 12 13 14
1.3
Editando los titulares y la barra de navegacin ......................15

Editando la etiqueta de un titular 15 Modificando la apariencia de un titular 15 Cambiando el conjunto de destinos de una barra de navegacin 17 Intercambiando entre barra de navegacin en modo grfico y en modo 18 Modificando la apariencia de los botones de la barra de navegacin 19 Cambiando el tema Agregando una barra de navegacin Agregando un titular y otros objetos de un tema Agregando un botn inteligente 21 22 22 23
1.4
Cambiando los temas y agregando componentes ...................21
Captulo 2
2.1 2.2
2.1.1 2.1.2 2.2.1 2.2.2 2.2.3
Publicando su Proyecto ............................. 27

28 30
Preparndose para publicar....................................................28 Publicando un proyecto a su sitio Web ...................................32

Seleccionando los archivos a publicar Conectando con el sitio Web Transmitiendo los archivos al sitio Web 32 33 33 Ajustando la informacin del sitio Web Verificando los vnculos
2.3
Descargando archivos de su sitio Web....................................35

iii
2.3.1 2.3.2
Descargando los archivos a un proyecto existente Volviendo a crear un proyecto borrado
35 35
Creando Documentos Web........................ 37 Captulo 3

3.1 3.2
3.1.1 3.1.2
El Entorno de Edicin................................. 39
40 41
Perspectiva general de la interfase de Namo WebEditor.........40 Personalizando el entorno de edicin .....................................43

Elementos de la Interfase Elementos de la ventana de Edicin
3.2.1 Usando las reglas, guas y rejillas 43 3.2.2 Seleccionando el tamao de la ventana 44 3.2.3 Personalizando la barra de herramientas 45 3.2.4 Ajustando las opciones predeterminadas del documento y las preferencias del usuario 45
Captulo 4
4.1
4.1.1 4.1.2 4.1.3 4.2.1 4.2.2 4.2.3 4.2.4 4.2.5 4.2.6 4.3.1 4.3.2 4.3.3
Edicin Bsica de un Documento ............... 47

48 48 48
Creando nuevos documentos ..................................................48

Creando un documento vaco Creando un documento usando una plantilla Agregando un documento a un proyecto Introduciendo y seleccionando texto Borrando texto Usando el portapapeles Usando arrastrar y soltar Copiando texto de otra aplicacin Buscando y reemplazando texto Formato de carcter Formato de prrafo Copiando y pegando formatos Agregando una imagen del disco duro Agregando una imagen de la librera de imgenes Agregando una imagen de la Web Copiando una imagen de otro documento Guardando un documento con imgenes Cambiando el tamao de una imagen Ajustando la disposicin de una imagen Fijando el color transparente de una imagen
4.2
Agregando y editando texto....................................................49

49 49 50 50 50 51
4.3
Formato bsico de texto .........................................................52

52 54 57 58 58 59 59 60 61 61 62
4.4
Agregando y dando formato a imgenes.................................58

4.4.1 4.4.2 4.4.3 4.4.4 4.4.5 4.4.6 4.4.7 4.4.8 4.5.1 4.5.2 4.5.3
4.5
Creando una galera de imgenes ...........................................64

Paso 1: Seleccionar las imgenes Paso 2: Especificar el tamao de la imagen Paso 3: Especificar la distribucin y opciones de vnculos 64 65 66
iv
4.6
4.5.4 4.5.5 4.6.1 4.6.2 4.6.3 4.6.4 4.6.5 4.6.6 4.6.7 4.7.1 4.7.2 4.7.3 4.7.4 4.7.5 4.7.6 4.8.1 4.8.2 4.8.3 4.8.4 4.8.5 4.8.6 4.8.7
Aplicando efectos a una imagen .............................................70

Ajustando el brillo y el contraste Girando o volteando una imagen Aplicando un filtro a la imagen Aplicando un gradiente de color Agregando una sombra Agregando texto a la imagen Guardando la imagen modificada 70 71 71 72 73 74 74
Paso 4: Especificar dnde guardar las imgenes Publicar un documento que contiene una galera de imgenes
67 69
4.7
Creando hipervnculos ............................................................76

Vnculos absolutos vs. relativos Ejemplos de vnculos Creando un vnculo Editando o quitando un vnculo Creando vnculos mltiples en una imagen Creando y usando marcadores 76 78 78 79 80 82
4.8
Creando botones y titulares....................................................84

Seleccionando una forma para el botn/titular Seleccionando un componente para editar Editando los atributos de relleno de color Editando las propiedades de las sombras Editando las propiedades del texto Editando las propiedades de los fondos Modificando un botn o titular en la ventana de Edicin Creando una tabla Seleccionando partes de una tabla Agregando y eliminando renglones y columnas Copiando y pegando partes de una tabla Cambiando el tamao de renglones y columnas Dividiendo y combinando celdas Editando las propiedades de una tabla Editando las propiedades de una celda Modificando los bordes de una tabla o celda Agregando un ttulo a una tabla Dividiendo y combinando tablas Ordenando una tabla Convirtiendo entre texto y tablas Usando una tabla para la distribucin de una pgina 84 85 86 87 87 88 88
4.9
Creando y editando tablas ......................................................90

90 91 92 93 94 95 96 98 101 102 103 103 105 106
4.10
4.9.1 4.9.2 4.9.3 4.9.4 4.9.5 4.9.6 4.9.7 4.9.8 4.9.9 4.9.10 4.9.11 4.9.12 4.9.13 4.9.14 4.10.1 4.10.2 4.10.3
Modificando las propiedades de un documento.....................108

Cambiando el fondo del documento y los colores de los vnculos 108 Asignando el ttulo de un documento, palabras clave y juego de caracteres 109 Cambiando los mrgenes de una pgina y aplicando efectos especiales110
Captulo 5
Edicin Avanzada de un Documento........ 111

v
5.1
Usando atributos de estilo ....................................................112

5.1.1 5.1.2 5.1.3 5.1.4 5.1.5 5.1.6 5.2.1 5.2.2 5.2.3 5.2.4 5.2.5 5.2.6 5.3.1 5.3.2 5.3.3 5.3.4 Atributos relacionados a la tipografa Colores y fondos Alineacin, sangras y espaciamiento Mrgenes y rellenos Bordes Aplicando atributos de estilo a un documento 112 114 115 116 116 117
5.2
Hojas de estilo ......................................................................119

Guardando un conjunto de atributos como un estilo Aplicando un estilo Definiendo un conjunto de atributos para una etiqueta Definiendo el conjunto de atributos para los vnculos Guardando los estilos en una hoja externa de estilos Enlazando o importando de una hoja externa de estilo 119 120 121 122 123 124
5.3
Trabajando con capas ...........................................................126

Creando y moviendo las capas Cambiando el tamao de una capa y agregando el contenido Ajustando el orden de las capas Otras propiedades de las capas 127 127 128 129
5.4
Marcos y conjuntos de marcos ..............................................131

Creando un conjunto de marcos 131 Guardando un conjunto de marcos 132 Vista previa de un conjunto de marcos 133 Determinando el documento predeterminado de un marco 133 Cambiando el tamao de los marcos 133 Agregando y eliminando marcos 135 Determinando el destino predeterminado de un marco 135 Modificando las propiedades de los marcos 137 Determinando un mensaje para navegadores que no incluyen marcos139 Modificando las propiedades de un documento de conjunto de marcos139 Un ejemplo de conjunto de marcos 140 Importando una hoja de clculo como una tabla esttica Importando una hoja de clculo vinculando o incrustando Convirtiendo una tabla existente Conceptos bsicos de grficos Ejecutando el Asistente de Grficos Paso 1: Seleccionar el tipo de grfico Paso 2: Especificar series y categoras Paso 3: Especificar el ttulo de un grfico Cambiando de tamao y modificando un grfico Modificando las opciones de las series Editando los valores en un grfico Agregando y eliminando series de datos o categoras Agregando lneas de tendencia Modificando las opciones de los ejes Modificando la apariencia de un grfico 145 146 148
5.5
5.4.1 5.4.2 5.4.3 5.4.4 5.4.5 5.4.6 5.4.7 5.4.8 5.4.9 5.4.10 5.4.11 5.5.1 5.5.2 5.5.3
Importando hojas de clculo ................................................145
5.6
Creando un grfico desde una tabla......................................149

149 151 151 152 154 154 155 156 157 158 159 160
5.6.1 5.6.2 5.6.3 5.6.4 5.6.5 5.6.6 5.6.7 5.6.8 5.6.9 5.6.10 5.6.11 5.6.12
vi
5.7
5.6.13 Cambiando la carpeta predeterminada de los archivos de imagen de un grfico 161 5.7.1 5.7.2 5.7.3 5.7.4 5.7.5 5.7.6 5.7.7 5.7.8 5.8.1 5.8.2 5.8.3 5.8.4 5.8.5 Creando un formulario e insertando elementos Creando un formulario en una tabla Agregando campos de entrada de texto Agregando controles de seleccin Agregando un campo oculto Agregando botones Agregando un campo de imagen Modificando las propiedades de un formulario
Creando formularios Web .....................................................162

163 164 165 166 168 168 169 170
5.8
Editando el cdigo fuente HTML............................................171

Intercambiando entre edicin visual y edicin de cdigo fuente Insercin automtica de etiquetas en la ventana HTML Opciones de despliegue de cdigo fuente Opciones de formato de cdigo fuente Editando el cdigo fuente HTML de un conjunto de marcos 171 171 172 173 174
Captulo 6
6.2.1 6.2.2 6.2.3 6.3.1 6.3.2 6.3.3 6.3.4 6.3.5 6.3.6 6.4.1 6.4.2 6.4.3 6.4.4
Agregando Elementos Dinmicos ............ 175
6.1 El Asistente de Secuencias de Comandos..............................176 6.2 Acciones, eventos y el Administrador de Secuencias de Comandos 178
Anexando una accin usando el dilogo de Acciones Usando el Administrador de Secuencias de Comandos Acciones y eventos incluidos 179 180 183
6.3
Creando lneas de tiempo .....................................................185

La ventana de Lneas de Tiempo Creando y editando un objeto grfico (sprite) Creando un objeto grfico al grabar el camino de una capa Anexando acciones a una lnea de tiempo Especificando cmo inician las lneas de tiempo Trabajando con lneas de tiempo mltiples Insertando Insertando Insertando Insertando una animacin Flash o Shockwave una pelcula QuickTime un sonido MIDI un sonido RealAudio 185 188 190 191 192 193
6.4
Agregando objetos multimedia .............................................194

196 197 197 197
Captulo 7
Datos
7.1
7.1.1 7.1.2 7.1.3 7.1.4
Creando Documentos basados en Bases de
199
Introduccin al Asistente de Bases de Datos ........................200
Acerca de las bases de datos Acerca de los documentos activados por bases de datos Tipos de documentos activados por bases de datos Pasos bsicos para usar el Asistente de Bases de Datos 200 201 201 202
vii
7.2
7.1.5 7.1.6 7.1.7 7.2.1 7.2.2 7.2.3
Seleccionando un documento de tipo dinmico.....................206

Seleccionando un tipo de secuencia de comandos (script) Especificando el tipo de conexin de la base de datos Especificando el Sistema Operativo del servidor 206 207 207
Requerimientos para usar el Asistente de Bases de Datos Creando una conexin ODBC a una base de datos Lista de pasos del Asistente de Bases de Datos
203 203 204
7.3 7.4 7.5
Seleccionando un origen de los datos ...................................208 Seleccionando campos de una base de datos........................209 Proporcionando una Sentencia de Seleccin .........................212
Clusula unin (join) Clusula donde (where) Clusula ordenado por (order) Tipos de elementos de bloque Editando la lista de elementos 212 213 214 Seleccionando campos de una tabla Seleccionando campos de tablas mltiples 210 210
7.4.1 7.4.2 7.5.1 7.5.2 7.5.3 7.6.1 7.6.2 7.7.1 7.8.1 7.8.2 7.8.3 7.9.1 7.9.2 7.9.3
7.6 7.7 7.8
Agregando y quitando elementos de bloque .........................215 Apariencia de los bloques en la ventana de Edicin ..............219 Creando un bloque de lista o tabla........................................221
Ejemplo de un bloque de tabla Ejemplo de un bloque de lista Pasos para crear un bloque de lista o de tabla Ejemplo de un bloque de detalle Pasos para crear un bloque de detalle Creando un vnculo a un bloque de detalle 221 222 223 Modificando la apariencia de un bloque 220 216 217
7.9
Creando un bloque de detalle ...............................................225

225 226 227
7.10
Creando un bloque de grfico ...............................................231

Ejemplo de bloque de grfico 231 Requerimientos de formato de una tabla de base de datos 232 Pasos para crear un bloque de grfico 233 Obteniendo etiquetas de series y categoras de una base de datos 235 Proporcionando las etiquetas de series y categoras de forma manual 236 Publicando un documento con un bloque grfico 237 Ejemplo de un bloque de entrada Pasos para crear un bloque de entrada
7.11 7.12 7.13
7.10.1 7.10.2 7.10.3 7.10.4 7.10.5 7.10.6 7.11.1 7.11.2 7.12.1 7.12.2 7.13.1 7.13.2 7.13.3 7.13.4 7.13.5
Creando un bloque de entrada ..............................................240 Creando un bloque de modificacin ......................................243 Agregando elementos de bloque en la ventana de Edicin....246
Agregando Agregando Agregando Agregando Agregando un un un un un campo de salida campo de salida con vnculo campo de entrada campo oculto men desplegable o un grupo de botones de opcin 246 247 248 249 249 Ejemplo de un bloque de modificacin Pasos para crear un bloque de modificacin 243 244 240 241
viii
7.14
Modificando las propiedades basadas en una base de datos.252

Cambiando Cambiando Cambiando Cambiando el la la el tipo de documento lista de los campos de una base de datos incluidos sentencia de seleccin mtodo de entrada o los parmetros de la lista 252 252 252 253
7.14.1 7.14.2 7.14.3 7.14.4
Proyectos y Administracin de Sitios Web 255 Captulo 8

8.1
8.1.1 8.1.2 8.1.3 8.1.4 8.1.5 8.2.1 8.2.2 8.2.3 8.2.4 8.2.5 8.2.6 8.3.1 8.3.2 8.3.3
Trabajando con Proyectos....................... 257

258 259 259 260 260
Creando un proyecto ............................................................258

Creando un nuevo proyecto Agregando nuevos documentos a un proyecto Agregando documentos existentes a un proyecto Creando carpetas en un proyecto Creando un subproyecto
8.2
Administrando los documentos de un proyecto ....................261

Cambiando de nombre o renombrando archivos y carpetas Moviendo o copiando documentos dentro de un proyecto Desplegando los vnculos de y hacia un documento Verificando los vnculos de un proyecto Realizando bsqueda y reemplazo global Cambiando el lenguaje de codificacin en un proyecto Creando el rbol de navegacin Quitando documentos de un rbol de navegacin Agregando barras de navegacin 261 261 262 263 264 265 267 270 270
8.3
Administrando la navegacin del sitio Web ..........................266
Captulo 9
9.1 9.2
9.2.1 9.2.2 9.2.3 9.2.4 9.2.5 9.2.6
Colaborando en un Proyecto ................... 273

275 276 277 278 279 279
Introduccin al control de cdigo .........................................274 Usando el control de cdigo..................................................275

Creando un nuevo proyecto SourceSafe Agregando o eliminado archivos del control de cdigo Dando salida a archivos del control de cdigo Deshaciendo una salida Dando entrada a archivos al control de cdigo Actualizando copias locales de archivos bajo el control de cdigo
Otros Temas ......................................... 281

Preferencias .....................................................................................283 Auto correccin ................................................................................292 Insercin rpida...............................................................................293 Macros ........................................................................................294 Editor de ecuaciones ........................................................................296 Importando documentos y sitios Web ..............................................297
ix
Importando documentos de Microsoft Word ....................................298 Enviando un documento como correo electrnico (e-mail)...............299 Agregando imgenes a la librera de imgenes ................................300 Lista de atajos de teclado.................................................................301
Requisitos del Sistema

stos son los requisitos mnimos del sistema para instalar y usar Namo WebEditor 4: Windows 95, 98, NT 4.02 2000 32 MB RAM Espacio en Disco Duro: 10 MB (instalacin mnima) 200 MB (instalacin estndar, incluyendo imgenes clip art) Lectora de CD-ROM (para la instalacin) Internet Explorer 4 o ms reciente (para vista previa interna) Adems, la vista previa de los documentos creados usando el Asistente de Bases de Datos requiere que Microsoft Personal Web Server o Microsoft Internet Information Server estn instalados en su ordenador.
Instalando Namo WebEditor 4

Si est instalando del CD-ROM:
1 Inserte el CD-ROM de Namo WebEditor en su lectora. El programa de instalacin debe
empezar automticamente.
2 Si el programa de instalacin no comienza de forma automtica, seleccione el comando
Ejecutar... del men Inicio de Windows y teclee D:\setup.exe donde D es la letra de su lectora de CD-ROM.
3 Siga las instrucciones de la pantalla para terminar la instalacin. 4 La primera vez que ejecute Namo WebEditor, se le preguntar su nmero de serie y llave
del CD. Proporcinelos exactamente como se encuentran en la parte posterior de la funda del CD-ROM de Namo WebEditor 4. Si descarg WebEditor de Internet:
1 Haga doble clic sobre el nombre del paquete de instalacin descargado. Una vez que los
archivos de instalacin sean descomprimidos, el programa de instalacin se ejecutar automticamente.

2 Siga las instrucciones de la pantalla para completar la instalacin. 3 La primera vez que ejecute Namo WebEditor despus de la instalacin, se le preguntar
su nmero de serie y llave de licencia. Proporcinelos tal y como los recibi de la empresa a la que compr Namo WebEditor 4. Por favor tenga en cuenta que la instalacin de la biblioteca de imgenes Clip Art requiere un espacio adicional en el disco duro de 120MB. Por consiguiente, asegrese de tener suficiente espacio en su disco antes de intentar instalar las imgenes. Si elige no instalarlas, puede usar la biblioteca de imgenes directamente de su CD-ROM de Namo WebEditor. Registrando su programa Le sugerimos que registre su copia de Namo WebEditor. Los usuarios registrados reciben acceso de prioridad al soporte tcnico, actualizaciones gratuitas y ofertas especiales de actualizacin. Para registrar Namo WebEditor, visite la pgina de registro en lnea http://www.namo.com/register / o rellene y enve por fax o por correo la tarjeta de registro que se encuentra dentro de su paquete de Namo WebEditor.
Acerca de este manual

Este manual se ha diseado especialmente para satisfacer las necesidades del usuario principiante y aquellos con experiencia limitada en la creacin de pginas Web. As, la Parte Uno del manual incluye una introduccin detallada de cmo crear un primer proyecto de Web y publicarlo. Si es un usuario ms experimentado, puede ir directamente a la Parte Dos que comienza con una vista general de la interfaz del usuario y contina con la informacin sobre todos los aspectos de crear y revisar los documentos de Web directamente en Namo WebEditor. La Parte Tres trata con los proyectos y la administracin del sitio. Aun cuando sea un diseador de Web profesional, debe examinar por lo menos esta parte para aprender sobre cmo Namo WebEditor enfoca estos temas. Convenciones tipogrficas Los smbolos y tipografas siguientes tienen significados especiales y pueden encontrarse a lo largo de este manual:
Comentario
Denota informacin de apoyo al contenido principal de una seccin o subdivisin.

Referencia cruzada
Denota una referencia cruzada a otra seccin pertinente o subdivisin del manual.
Recurso de Programa
Una tipografa negrita Sans serif se usa para los elementos del men y del texto encontrados en la interfaz del usuario de Namo WebEditor. Adems, el parntesis angular, >, se usa para separar men, submen y nombres de elementos de men. Por ejemplo, Insertar > Avanzado> Hoja de clculo significa el elemento de men Hoja de clculo en el submen Avanzado del men Insertar. <presionar> Las palabras en tipografa normal entre parntesis en ngulo indican que hay que presionar o pulsar una tecla, como la tecla <Intro>. Nombre de Archivo Una tipografa de monoespacio se usa para la mayora de los nombres de archivos, nombres de etiqueta, los nombres de campo en la base de datos y similares.
Obteniendo soporte tcnico

El soporte tcnico para Namo WebEditor generalmente lo proporciona el distribuidor de Namo Interactive en su pas o regin del mundo. Para una lista actualizada de distribuidores, visite nuestra pgina de contactos de soporte regional en la Web http://www.namo.com/support/wecontact.html. Si su pas o regin no se encuentra en la lista o si compr Namo WebEditor directamente de Namo Interactive usando las pginas de pedido en lnea de nuestro sitio Web, por favor enve un correo electrnico con su pregunta o problema a support@namo.com o envenos un fax al +82-2-55-99-334. Slo use estos contactos si compr Namo WebEditor directamente de Namo Interactive o si su pas no se lista en la pgina de contactos de soporte regional. Antes de contactar con el soporte tcnico, le sugerimos que verifique la seccin de solucin de problemas de la ayuda en lnea de Namo WebEditor. La seccin lista varias preguntas frecuentes (FAQs) considerando los problemas tcnicos. Se puede tener acceso a la ayuda en lnea presionando <F1> o seleccionando Ayuda de Namo WebEditor en el men Ayuda. Si se presiona <F1> en cualquier dilogo, el sistema de ayuda abrir el archivo pertinente. Adems, puede verificar fcilmente las actualizaciones de Namo WebEditor seleccionando la opcin Actualizaciones de Namo WebEditor en el men de Ayuda. Debe encontrase conectado a Internet para usar esta opcin.
Parte Uno
Comenzando con su Pgina Inicial
Captulo 1
Creando un Proyecto con el Asistente de Sitios Web
El Asistente de Sitios Web de Namo WebEditor es la manera ms fcil de crear su pgina de bienvenida en la Web. Aun cuando sea un principiante absoluto en el diseo Web, pronto se encontrar en marcha con su propio sitio de Web en menos tiempo del que podra pensar. El Administrador de Sitios Web usa plantillas y temas ya diseados para mantener una estructura y apariencia profesional en su nuevo sitio Web. Usando al asistente se ahorra el tener que disear y crear todo el sitio.
En este captulo
1.1 1.2 1.3 1.4
Usando el Asistente de Sitios Web Agregando contenido Editando los titulares y la barra de navegacin Cambiando los temas y agregando componentes
1.1 Usando el Asistente de Sitios Web

El Asistente de Sitios Web genera un proyecto completo despus de seguir unos simples pasos. Una vez que se usa el Asistente de Sitios Web, puede personalizar el proyecto con el contenido seleccionado y publicarlo a un sitio Web. Para utilizar el Asistente de Sitios Web, siga estos pasos:
1 Seleccione el comando Archivo > Proyecto > Asistente de Sitios Web. 2 Complete cada uno de los cuatro pasos del asistente como se describe a continuacin.
1.1.1 Paso 1: Seleccionar una plantilla para el sitio Web

Seleccione una plantilla para el sitio de la lista del lado izquierdo del dilogo. Elija una plantilla basada en el tipo de sitio que desea crear: personal, compaa, etc.
Una seleccin de los documentos (pginas) que estn en la plantilla escogida aparece en la lista de en medio. Si pulsa sobre el nombre de un documento, su vista preliminar aparece en el recuadro del lado derecho. Si decide que no quiere uno o ms de los documentos de la plantilla seleccionada, quite la marca de la casilla de verificacin a un lado de sus nombres. Despus de seleccionar una plantilla para el sitio y decidir qu documentos desea incluir, haga clic en el botn Siguiente.
Captulo 1
1.1.2 Paso 2: Proporcionar informacin del sitio Web

Proporcione su nombre o el de la organizacin, su direccin de correo electrnico y cualquier informacin de derechos de autor que desea que aparezca en la parte de abajo de cada documento del proyecto. Cuando termine, haga clic sobre el botn Siguiente. Lo que haya proporcionado como nombre se usar como la base del titular de la pgina ndice del proyecto. La direccin del correo electrnico se insertar como un hipervnculo en la parte baja de cada documento del proyecto.
1.1.3 Paso 3: Seleccionar un tema

Namo WebEditor 4 viene con 200 temas prediseados. Un tema es una coleccin de elementos de diseo - tal como las formas de un botn, imgenes de fondo y seleccin de tipografa - que han sido seleccionadas para dar una apariencia consistente a un documento o un sitio Web completo.
Los temas disponibles aparecen en la lista del lado izquierdo del dilogo. Los temas son divididos en categoras; para ver los temas en una categora haga doble clic sobre el nombre de la categora. Para conseguir una vista preliminar de cualquiera de los documentos del proyecto con un tema seleccionado, elija el documento en la lista de en medio. Una vista preliminar del documento usando el tema seleccionado aparecer en el recuadro derecho. Pulse sobre el botn Ver tema para una vista preliminar de cualquier tema. Esto abrir el dilogo Galera de temas, como se muestra a continuacin.
Usando el Asistente de Sitios Web
1.1.4 Paso 4: Seleccionar una carpeta

Seleccione una carpeta para guardar el nuevo proyecto. La carpeta predefinida se encuentra dentro de Mis Documentos, con el nombre Namo_Site seguida de un nmero. Si desea usar otro directorio, teclelo en la caja del texto o seleccione una carpeta despus de pulsar sobre el botn Examinar. Finalmente, pulse sobre el botn Finalizar. Si aparece un dilogo preguntando si se crea el directorio, presione sobre el botn S.
El Asistente de Sitios Web generar su proyecto y, en unos segundos, la pgina ndice del proyecto (el primer documento que se ve cuando visitan su sitio) aparecer en la ventana de Edicin de Namo WebEditor, como se muestra en la imagen inferior. Puede empezar ahora a personalizar los documentos de su nuevo proyecto.
10
Captulo 1
Abriendo otros documentos del proyecto Para abrir otro documento que no sea la pgina ndice, cambie al Administrador de Sitios Web usando la barra de tareas de Windows. Se muestra una lista de todos los documentos del proyecto en la solapa Proyecto, ordenados por nombre de archivo. Para abrir un documento, haga doble clic sobre su nombre. Alternativamente, puede abrir un documento en el proyecto haciendo doble clic sobre su icono en la solapa Estructura del Administrador de Sitios Web que despliega la estructura de navegacin del proyecto.
8.3: Administrando la navegacin del sitio Web
Usando el Asistente de Sitios Web
11
1.2 Agregando contenido personal

Una vez que el Asistente de Sitios Web ha generado su nuevo proyecto, puede empezar a agregar su propio texto, imgenes y el contenido de cada documento del proyecto.
1.2.1 Agregando texto

Los documentos creados por el Asistente de Sitios Web se disponen en tablas invisibles. (Puede ver los bordes punteados de la tabla en la ventana de Edicin, pero no se muestran en un navegador Web o en la ventana de Vista Previa.) Las tablas ayudan a dar una apariencia ordenada y organizada a cada documento. El texto e imgenes le indican dnde debe agregar su propio contenido. En general, el texto se encuentra entre parntesis angulares, como en <Asunto> y <Descripcin>. Para reemplazar el texto con el propio, simplemente seleccinelo y comience a escribir. En cuanto teclee su propio texto, el del ejemplo se elimina. Tambin puede copiar y pegar texto o arrastrar y soltar de otra aplicacin, como un procesador de texto o un navegador de Web. Si es posible, Namo WebEditor conservar el formato del texto copiado. Para empezar un nuevo prrafo presione la tecla <Intro>. Siguiendo la norma Web, un espacio en blanco igual a la altura de una lnea aparecer entre la parte superior del nuevo prrafo y la inferior del anterior. Si quiere empezar una nueva lnea sin empezar un nuevo prrafo presione las teclas <Mays + Intro>. No se preocupe si se queda sin espacio al teclear. Las celdas de la tabla del diseo se expanden para acomodar cantidades mayores de texto automticamente. Si quiere cambiar manualmente el tamao de una celda, slo haga clic en uno de sus bordes y arrstrelo.
4.9.5: Cambiando el tamao de renglones y columnas
Usando la barra de herramientas de Formato (la segunda barra de herramientas debajo de la barra de men) puede cambiar la tipografa, tamao y color de texto seleccionado.
4.3: Edicin bsica de texto
Por qu aparece un subrayado rojo al escribir cada palabra? De manera predeterminada, Namo WebEditor verifica la ortografa de cada palabra al escribirla. Se resaltan por medio de un subrayado en rojo las palabras mal deletreadas y aquellas que no estn en el diccionario ortogrfico. Puesto que la mayora de las palabras incompletas no estn en el diccionario, stas tendrn un subrayado rojo hasta terminar de escribirlas.
12
Captulo 1
Si desea quitar la comprobacin automtica de la ortografa, desactive la opcin Verificar ortografa al escribir de la solapa Preferencias de Edicin en el dilogo Preferencias. Vista previa de un documento La ventana de la Vista Previa muestra cmo se ver el documento activo en Internet Explorer 4.x o ms reciente. Para ver la ventana de Vista Previa, pulse sobre la solapa Vista Previa en la parte inferior de la ventana principal de Namo WebEditor. Tambin puede ver el documento activo en un navegador Web real. Presione la tecla <F11> para ver el documento en Internet Explorer (predeterminado). Presione la tecla <F12> para verlo en Netscape Navigator (predeterminado). Puede cambiar las asignaciones de los navegadores en la solapa Navegadores Web del dilogo Preferencias.
1.2.2 Agregando imgenes

El Asistente de Sitios Web inserta espacios para las imgenes en varios lugares a lo largo de un proyecto. As es como se ven:
Para reemplazar una imagen con la propia, haga lo siguiente:

1 Haga doble clic sobre la imagen. 2 En el dilogo Propiedades de la Imagen pulse sobre el botn Examinar a un lado de
Ruta de la Imagen.
3 En el dilogo Abrir localice y seleccione la imagen que desea insertar en el documento. 4 Presione sobre el botn Aceptar para cerrar el dilogo Propiedades de la Imagen.
Tambin puede seleccionar una imagen de las miles disponibles en la librera de imgenes. Para reemplazar una imagen con una de la librera haga lo siguiente:
1 Haga doble clic sobre la imagen. 2 En el dilogo Propiedades de la Imagen pulse sobre el botn Clip Art a un lado de Ruta
de la Imagen.
3 En el dilogo Clip Art seleccione una categora y subcategora y luego seleccione la
imagen que desea insertar en el documento. Haga clic en el botn Insertar.

Agregando contenido personal 13
4 Presione sobre el botn Aceptar para cerrar el dilogo Propiedades de la Imagen.
1.2.3 Guardando un documento

Cuando haya terminado con los cambios a un documento, slvelo seleccionando Guardar en el men Archivo o haciendo clic en el botn Guardar en la barra de herramientas Estndar. Si ha agregado imgenes al documento, el dilogo Copiar Archivos de Recursos aparecer, preguntndole si quiere copiar los archivos de imagen a la carpeta del proyecto (predeterminado) o a una subcarpeta de la carpeta del proyecto.
Haga clic sobre el botn Aceptar para copiar los archivos de imagen al directorio del proyecto o haga clic sobre el botn Seleccionar Carpeta para escoger una subcarpeta dentro de la del proyecto; luego haga clic sobre el botn Aceptar.
14
Captulo 1
1.3 Editando los titulares y la barra de navegacin

El Asistente de Sitios Web inserta un titular y dos o ms barras de navegacin en cada documento que crea. Un titular es una imagen con una etiqueta del texto que se pone en la parte superior de un documento para identificar su propsito o contenido. Una barra de navegacin es un juego de botones grficos o vnculos de texto que permiten a los visitantes del sitio navegar rpidamente a travs de los varios documentos en un sitio Web. En la imagen siguiente la parte superior es un titular. Mientras que los cuatro botones en forma de estrella debajo de l constituyen una barra de la navegacin.
Se pueden editar varias de las propiedades de los titulares y barras de navegacin, como se describe a continuacin.
1.3.1 Editando la etiqueta de un titular

Para editar la etiqueta de texto en un titular, haga lo siguiente:
1 Doble clic en el titular. 2 En el dilogo Propiedades del Titular edite o reemplace el texto en la caja de texto
Etiqueta.
3 Haga clic en el botn Aceptar.

Cuando cambia una etiqueta de un titular est cambiando el nombre de navegacin del documento que contiene el titular. Como resultado cualquier botn o enlace en las barras de navegacin que vincule al documento, cambiar para usar el nuevo nombre automticamente.
1.3.2 Modificando la apariencia de un titular

Si no est satisfecho con la apariencia del titular en su proyecto, puede cambiarlo de varias maneras. Para modificarlo, haga lo siguiente:
1 Doble clic sobre el titular.
Editando los titulares y la barra de navegacin
15
2 En el dilogo Propiedades del Titular, haga clic sobre Modificar Imagen. Esto abrir el
Asistente de Botones Inteligentes.

3 En la parte superior del dilogo del Asistente de Botones Inteligentes, pulse sobre el
botn Seleccionar Forma.
4 La imagen del titular en uso se despliega. Si desea modificar la imagen, haga clic sobre el
botn Siguiente y contine con el paso 5. Si desea seleccionar otra imagen, haga doble clic sobre el botn Tema en la lista del lado izquierdo del dilogo y seleccione una categora. Las imgenes disponibles en la categora seleccionada se despliegan en el lado derecho. Seleccione una imagen para el titular y presione sobre el botn Siguiente.
5 Para cambiar el tamao, use las manijas de las esquinas y lados en la vista previa del
titular.
6 Para cambiar las propiedades de la etiqueta de texto, tales como la tipografa, tamao y
color, pulse sobre el botn Texto en la lista a la izquierda bajo la vista previa del titular.
16
Captulo 1
7 Use la solapa Propiedades de Texto para cambiar la tipografa, tamao y estilo de la
etiqueta de texto. Use la solapa Atributos de Color de Relleno para cambiar el color de la etiqueta. Use la solapa Propiedades de la Sombra para agregar o modificar una sombra bajo la etiqueta. Para volver a colocar la etiqueta, haga clic sobre ella y arrstrela a la ventana de vista previa.
8 Cuando termine con las modificaciones del titular, pulse el botn Terminar.
Cuando modifica la apariencia de un titular, todos los titulares de todos los documentos del proyecto toman la nueva apariencia. No se puede modificar la apariencia de un slo titular.
1.3.3 Cambiando el conjunto de destinos de una barra de navegacin

Cada barra de navegacin en un proyecto contiene un juego de vnculos a varios documentos del proyecto. El juego de documentos a los que una barra de navegacin particular se vincula es llamado conjunto destino. Los documentos en un conjunto no se especifican individualmente; en cambio, se especifican desde el punto de vista de sus relaciones al documento que contiene la barra de la navegacin (estas relaciones se definen en la solapa Estructura del Administrador de Sitios Web.) Por ejemplo, el conjunto de destinos de una barra de navegacin podra consistir en todos los documentos hijos del documento que la contiene, mientras que el conjunto de destinos de otra barra de navegacin podra ser todos los documentos en el mismo nivel del padre del documento que la contiene. Se puede cambiar el conjunto destino de una barra de navegacin siguiendo estos pasos.
1 Haga doble clic sobre la barra de navegacin.
17
2 En el dilogo Propiedades de la barra de navegacin (mostrado abajo), el conjunto
destino se resalta en la lista Tipo de barra de navegacin a la derecha. En la vista previa del rbol de Navegacin, los documentos destino se resaltan con un contorno azul, mientras el documento actual se resalta con un contorno rojo.
3 Seleccione el conjunto destino en la lista Tipo de barra de navegacin. Los nuevos
documentos designados se resaltarn con un contorno azul en la vista previa del rbol de
navegacin.
4 Si desea incluir la pgina ndice del proyecto en el conjunto, seleccione Incluir la pgina
de inicio.
5 Haga clic sobre el botn Aceptar.
1.3.4 Intercambiando entre barra de navegacin en modo grfico y en modo texto

La barra de navegacin puede tener tanto botones grficos como de texto (pero no ambos.) Para cambiar una barra de navegacin de botones grficos a vnculos de texto o viceversa, haga lo siguiente:
1 Haga doble clic en la barra de navegacin. 2 En el dilogo Propiedades de la barra de navegacin, seleccione Usar texto o Usar
botones.
18
Captulo 1
1.3.5 Modificando la apariencia de los botones de la barra de navegacin

Como con los titulares, puede modificar la apariencia de los botones de la barra grfica de navegacin, ya sea editando las imgenes del botn existente o reemplazndolas con otras. Sin embargo, a diferencia de los titulares, los botones de las barras de navegacin vienen en tres estados diferentes: normal, giro e inactivo cada uno de los cuales usa una imagen distinta. Adems, los botones en una barra horizontal de navegacin son diferentes a los de las barras verticales, as que hay un total de seis imgenes diferentes. Cuando desee modificar la imagen de un botn, seleccione primero el tipo a modificar. Para modificar una imagen de botn, haga lo siguiente:
1 Haga doble clic en cualquier barra de navegacin del proyecto. 2 En el dilogo Propiedades de la barra de navegacin, haga clic en Modificar la Barra
de navegacin.
3 En el dilogo Parmetros de la barra de navegacin, haga clic en Modificar Forma de

la Imagen. Esto abre el Asistente de Botones Inteligentes.
4 En el primer paso del Asistente de Botones Inteligentes, Seleccionar Tipo, elija el tipo de
imagen de botn que desea modificar. Por ejemplo, para modificar la imagen del botn horizontal normal, seleccione Botones Horizontales; para modificar la imagen de giro vertical, seleccione Botones de giro Verticales. Despus de seleccionar un tipo, haga clic en el botn Siguiente.
5 En el segundo paso, Seleccionar Forma, decida si desea modificar la imagen del botn
existente o seleccionar una imagen diferente. Si desea modificar la imagen actual, haga clic en el botn Siguiente y contine con el paso 6. Si desea seleccionar una imagen diferente, haga doble clic sobre el botn Tema en la lista del lado izquierdo del dilogo y seleccione una categora. Las imgenes disponibles en la categora seleccionada son
19
desplegadas en el lado derecho. Seleccione una imagen y haga clic sobre el botn Siguiente.
6 En el tercer paso, Editar Botones, se pueden modificar varias propiedades de la imagen
seleccionada. Para cambiar el tamao del botn, use las manijas en las esquinas y lados dentro de la vista previa.
7 Para cambiar las propiedades del texto de la etiqueta del botn, tales como tipografa,
tamao y color, haga clic en el botn Texto en la pequea lista del lado izquierdo bajo la vista previa del botn.
8 Use la solapa Propiedades del Texto para cambiar la tipografa, tamao o estilo de la
etiqueta. Use la solapa Atributos del Color de Relleno para cambiar el color de la etiqueta. Use la solapa Propiedades de la Sombra para aadir o modificar una sombra bajo la etiqueta. Para cambiar de posicin la etiqueta, haga clic y arrstrela en la vista previa.
9 Cuando haya terminado de realizar las modificaciones a la imagen, haga clic en el botn
Finalizar.
Cuando se modifica la apariencia de la imagen de un botn de la barra de navegacin, todas las barras de navegacin en todos los documentos del proyecto usan ahora la nueva apariencia. No es posible modificar la apariencia de slo una barra de navegacin.
20
Captulo 1
1.4 Cambiando los temas y agregando componentes

Una de las ventajas de usar el Asistente de Sitios Web para crear un proyecto Web es la facilidad con que se puede alterar la apariencia del proyecto de golpe. Esto es posible porque un proyecto creado con el Asistente de Sitios Web usa un tema - una coleccin de elementos de diseo unificados - que puede cambiar cuando se quiera. Adems, el uso de un tema hace posible agregar varios componentes del tema ya diseados a los documentos de un proyecto, tales como titulares y barras de navegacin.
1.4.1 Cambiando el tema

Para cambiar el tema que usa un proyecto, haga lo siguiente:
1 Abra cualquier documento del proyecto. 2 Seleccione Cambiar Tema en el men de Formato. Esto abre la Galera de Temas.
3 En el dilogo Galera de Temas, seleccione una categora de la lista de la izquierda.
Aparecern una serie de Miniaturas de los temas de la categora seleccionada del lado derecho.
4 Para ver una vista preliminar de un tema en particular, haga doble clic en su miniatura. La
vista previa muestra los componentes del tema.

5 Para aplicar el tema seleccionado, haga clic en el botn Aplicar. 6 Un dilogo aparecer, permitindole seleccionar el rango de documentos a los que se
aplica el tema. Seleccione un rango, tal como Todos los archivos en el proyecto y presione el botn Aceptar.
Cambiando los temas y agregando componentes
21
1.4.2 Agregando una barra de navegacin

Aunque cada documento creado por el Asistente de Sitios Web contiene varios componentes del tema, como los titulares, la barra del navegacin y los divisores horizontales, puede agregar ms componentes si lo desea. Para agregar una barra de navegacin, haga lo siguiente:
1 Coloque el punto de insercin en la posicin del documento donde quiera agregar la barra
de navegacin.
2 Seleccione Insertar > Componentes de Tema > Barra de navegacin.
3 En el dilogo Propiedades de la barra de navegacin, seleccione un conjunto destino para
la misma en la lista Tipo de Barra de navegacin. Los documentos destino sern realzados en azul dentro de la vista previa del rbol de Navegacin.
4 Seleccione la orientacin de la barra de navegacin haciendo clic en el botn Horizontal
o Vertical.
5 Especifique si quiere usar botones grficos o vnculos de texto en Apariencia. Ciertos
conjuntos destino permiten especificar el uso de iconos.

6 Haga clic sobre el botn Aceptar para insertar la barra de navegacin.
1.4.3 Agregando un titular y otros objetos de un tema

Para agregar un titular, coloque el punto de insercin en la posicin del documento donde desea insertarlo y seleccione Insertar > Componentes de Tema > Titular. La etiqueta de texto en un titular agregado de esta manera siempre es el nombre de navegacin del documento. Si desea agregar un titular con una etiqueta propia, use un botn inteligente en su lugar (vea la seccin 1.4.4 ms adelante.) Hay varios tipos de componentes de tema adems de la barra de navegacin y los titulares. stos incluyen dos tipos de vietas; tres iconos pequeos con las palabras "Refrescante",
22 Captulo 1 Creando un Proyecto con el Asistente de Sitios Web
"Caliente" y "Nuevo" as como un divisor horizontal grfico. Para agregar cualquiera de stos componentes, haga lo siguiente:
1 Coloque el punto de insercin en el lugar del documento donde desea insertar el
componente del tema.

2 Seleccione Insertar > Componentes del Tema > Ms Objetos.
3 En el dilogo Insertar Objeto del Tema, seleccione el componente a insertar y haga clic
sobre el botn Aceptar.
1.4.4 Agregando un botn inteligente

Un botn inteligente es una imagen que puede cambiar de tamao, con una etiqueta de texto que generalmente se usa como botn de enlace o titular. A diferencia de otros tipos de botones que usan imgenes de mapas de bits que se deforman cuando cambian de tamao, los botones inteligentes usan imgenes de "vector" que no pierden resolucin. Adems, puede cambiar el color de un botn inteligente, e incluso agregar un gradiente, sin tener que usar un programa de edicin de imgenes. Tambin es posible editar el texto de la etiqueta Para insertar un botn inteligente, haga lo siguiente:
1 Coloque el punto de insercin en la posicin del documento donde desea insertar el botn
inteligente.
2 Seleccione Insertar > Componentes del Tema > Botones Inteligentes. Esto abre el
Asistente de Botones Inteligentes.
23
3 En el primer paso del asistente, Seleccionar Forma, elija una de las formas del botn en
la lista de la derecha y presione el botn Siguiente.

4 En el segundo paso, Editar Botn, puede revisar varias de las propiedades del botn. Para
cambiar el tamao del botn, use las manijas de las esquinas y lados en la vista previa
5 Cada botn inteligente tiene por lo menos un componente de imagen que se puede
cambiar de tamao y otro de texto. Seleccione el componente a modificar pulsndolo en la vista previa.
6 Para cambiar la posicin de un componente, haga clic y arrstrelo dentro de la ventana de
vista previa.
7 Use la solapa Propiedades de Texto para cambiar el texto, tipografa, tamao o estilo de
un componente de texto. Use la solapa Atributos de Color de Relleno para cambiar el
24
Captulo 1
color, agregar o cambiar un gradiente de color. Use la solapa Propiedades de Sombra para agregar o modificar una sombra bajo un componente de texto.
8 De forma similar, use la solapa Atributos de Color de Relleno para cambiar el color de
la imagen, agregar o cambiar un gradiente de color. Use la solapa Propiedades de Sombra para agregar o modificar una sombra bajo la imagen.
9 Cuando termine las modificaciones del botn inteligente, pulse el botn Finalizar para
insertar el botn en el documento. Puede modificar posteriormente el botn haciendo doble clic en l.
Estrictamente hablando, un botn inteligente no es un componente del tema, aunque se puede usar el submen Insertar > Componentes del Tema para agregar uno. Al contrario de los verdaderos componentes de tema que slo pueden agregarse a documentos que usan un tema, los botones inteligentes pueden aadirse a cualquier documento.
25
Captulo 2
Publicando su Proyecto
Una vez que se ha creado un proyecto Web y se ha editado a su satisfaccin, es necesario transmitirlo o publicarlo a un sitio Web. Una vez que el proyecto se ha publicado, las personas de todo el mundo pueden ver sus pginas Web.
En este captulo
2.1 2.2 2.3
Preparndose para publicar Publicando un proyecto a su sitio Web Descargando archivos de su sitio Web
27
2.1 Preparndose para publicar

Antes de publicar su proyecto Web, necesitar preparar la informacin para su sitio Web. Adems un paso optativo, pero altamente recomendable antes de publicar, es realizar la comprobacin de los vnculos del proyecto completo para encontrar los que estn rotos y otro tipo de problemas.
2.1.1 Ajustando la informacin del sitio Web

Para publicar su proyecto Web, necesitar el acceso a un servidor Web o a un servicio de anfitrin Web donde se publicar el proyecto. A menos que usted, la compaa u organizacin tengan su propio servidor Web, deber contratar una cuenta con un proveedor que har de anfitrin para sus pginas Web. Muchos Proveedores de Servicio de Internet (ISP) y portales de Web ofrecen estos servicios; contactar con uno es fcil; normalmente puede hacerlo en lnea usando un navegador. Ya sea que use un servicio de anfitrin o su propio servidor Web, necesitar cierta informacin con respecto al servidor que organizar su sitio. Si usa un servicio de anfitrin, puede obtener esta informacin de su pgina de bienvenida o preguntando por correo electrnico. Si usa el servidor Web de la compaa, el administrador de la red puede proporcionarle la informacin. La informacin requerida es: Nombre de anfitrin Esta es la direccin FTP del servidor Web a la cual se transmitirn los datos de su proyecto Web. El nombre del anfitrin puede ser una direccin URL, tal como ftp.namo.com o una direccin IP, como 210.101.143.7. Tenga presente que el nombre del anfitrin no es usualmente el mismo que el usado para acceder a sus servicios desde un navegador Web. Directorio Este es el nombre del directorio en el servidor Web al cual se publicarn y en el que se almacenarn los documentos. Si usa un servicio de anfitrin de Web, el directorio es usualmente public_html. Si usa un servidor propio o el de la compaa, el directorio puede ser cualquiera pregunte al administrador de la red.
Nombre de Usuario Esta es su identificacin de usuario para poder entrar al servidor Web. Si usa un servicio de anfitrin de Web, usualmente escoger el nombre al darse de alta. Contrasea Esta es su contrasea de usuario usada para entrar al servidor Web. Si usa un servicio de anfitrin de Web, usualmente escoger la contrasea al darse de alta. Adems, debe saber la direccin Web para acceder a su sitio desde un navegador. Por ejemplo, si usa un servicio de anfitrin, esto puede ser algo similar a
28
Captulo 2
http://www.namo.com/~jsmith, donde el nombre despus de la tilde es el nombre de
usuario. Aunque esta informacin no se usa al publicar el proyecto, se requiere para guardar los documentos directamente al sitio Web usando el comando Guardar. Para modificar la informacin de su sitio Web en Namo WebEditor, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 En el men Herramientas, seleccione Parmetros del Sitio Web. 3 El dilogo Lista de Sitios Web muestra inicialmente varios servicios de anfitrin Web
comunes. Si el suyo se encuentra en la lista, seleccinelo y haga clic sobre el botn Modificar. De otra forma, haga clic sobre el botn Agregar. Esto abrir el dilogo Parmetros del Sitio Web.
4 En el recuadro Nombre del Sitio, proporcione un nombre para el sitio. Este nombre slo
se usa para identificarlo en la lista; puede no ser el mismo que el nombre del anfitrin. (Si seleccion un servicio existente en la lista, puede dejar el nombre sin cambiar.)
5 Bajo Informacin FTP, proporcione el nombre del anfitrin, directorio, nombre de
usuario y contrasea. (Si seleccion un servicio existente en la lista, deje el nombre del anfitrin sin cambiar.) No cambie el nmero en la caja de texto Puerto a menos que se lo recomiende el administrador del sistema o el servicio contratado.
6 En Informacin HTTP, proporcione la direccin Web (URL) usada para acceder al sitio
Web en un navegador. Esta informacin es usada por Namo WebEditor cuando se guardan los documentos directamente a un sitio Web usando la ventana Publicar.
7 Haga clic sobre el botn Aceptar para guardar la informacin del sitio y cerrar el dilogo
Parmetros del Sitio Web. Su sitio debe aparecer en el dilogo Lista de sitios Web. Haga clic en el botn Cerrar para regresar al Administrador de Sitio Web.
Para confirmar que la informacin es correcta, haga lo siguiente:

1 Cambie a la solapa Publicar del Administrador de Sitio Web. 2 Conecte con Internet, si no lo ha hecho ya. 3 Seleccione su sitio en el men Sitio en la parte superior de la ventana del Administrador
de Sitio Web.
Preparndose para publicar
29
4 Haga clic en el botn Conectar. Un dilogo que le indica el progreso de la operacin
aparecer indicndole que Namo WebEditor est intentando conectar y entrar a su servidor Web. Si la informacin del sitio es correcta y vlida, el dilogo Conectando desaparece y una lista con los archivos y carpetas (si los hay) del sitio aparecer en la lista de archivos remotos del lado derecho de la ventana. Podr publicar sus documentos al sitio sin ningn problema. Haga clic en el botn Desconectar para cancelar la conexin al sitio hasta que est listo a publicar. Si hubo algn problema en la conexin al sitio, aparecer un dilogo indicndole No es posible conectar a [nombre del sitio]. Verifique la contrasea y nombre de usuario en los parmetros del sitio. Haga clic sobre el botn Aceptar y edite los parmetros del sitio en el dilogo Parmetros del sitio Web e intente de nuevo. Se encuentra listo para publicar su proyecto. Sin embargo, antes de hacerlo, debe realizar un paso ms: verificar los vnculos del proyecto.
2.1.2 Verificando los vnculos

Antes de publicar un proyecto Web, es Buena idea verificar los vnculos en todos los documentos para buscar problemas potenciales. Afortunadamente, Namo WebEditor provee de una forma sencilla de realizar esto en un slo paso, permitindole cambiar o quitar los vnculos rotos antes de publicar. Para verificar todos los vnculos de un proyecto, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 En el men Herramientas, seleccione Verificar Todos los Vnculos .
Un dilogo indicando el progreso aparecer mientras Namo WebEditor verifica todos los vnculos en los documentos del proyecto. Cuando la comprobacin est completa, la ventana principal aparece y despliega cualquier problema encontrado en la ventana Resultado ubicada en la parte inferior de la ventana principal
Hay tres tipos de problemas que pueden descubrirse durante la verificacin de los vnculos: Vnculo roto Indica que el documento al que se refiere el vnculo no pudo ser encontrado. El documento o recurso pudo haber sido movido o eliminado usando otro programa, tal como el Explorador de Windows. (Si se hace
30
Captulo 2
usando el Administrador de Sitio Web, Namo WebEditor cambia de manera automtica todos los vnculos afectados.) Vnculo externo Indica que el vnculo referido pertenece a un sitio Web externo. Esto no significa que el hipervnculo est roto o sea invlido, sino que Namo WebEditor no lo verific. Si desea que Namo WebEditor verifique los vnculos externos, habilite la opcin Verificar vnculos externos al verificar vnculos en la solapa Proyectos del dilogo Preferencias. (Nota: Namo WebEditor slo puede verificar vnculos HTTP externos. Cualquier otro, como FTP y mailto, no se verifica.) Hurfano Indica que no existe un vnculo al documento o recurso en ningn otro documento del proyecto. Los archivos hurfanos no pueden ser abiertos por los visitantes del sitio. Si no piensa usar un archivo hurfano, puede eliminarlo con seguridad.
Para examinar un vnculo roto, haga doble clic sobre el elemento en la ventana de Resultado. El documento que contiene el vnculo roto se abrir en la ventana de Edicin y el punto de insercin deber colocarse antes del vnculo roto, para que pueda quitarlo o arreglarlo. Haga doble clic en un elemento hurfano en la ventana Resultado para intentar abrir el archivo en la ventana de Edicin.
Preparndose para publicar
31
2.2 Publicando un proyecto a su sitio Web

Publicar su proyecto a un sitio Web involucra tres pasos: (1) seleccionar los archivos a ser publicados, (2) conectarse al sitio Web y (3) transmitir los archivos al sitio Web. Todos stos se realizan en la solapa Publicar del Administrador de Sitio Web
2.2.1 Seleccionando los archivos a publicar

Uno de los muchos beneficios de guardar sus documentos Web y archivos de recursos en un proyecto es poder seleccionar fcilmente los archivos a publicar. Para seleccionar los archivos individuales y carpetas a publicar, puede usar las casillas de verificacin que se encuentran junto al nombre del archivo e iconos de las carpetas en la lista de archivos locales (en el lado izquierdo de la ventana). Sin embargo, es mucho ms conveniente usar los botones sobre la lista de archivos locales para seleccionar rpidamente un grupo de archivos. stos se describen a continuacin Selecciona todos los archivos del proyecto (incluyendo aquellos dentro de las carpetas). Use esta opcin si publica el proyecto por primera vez. Selecciona los documentos que estn en la ventana de Edicin. Selecciona los archivos que han cambiado desde la ltima vez que se public el proyecto. (Compara las fechas de modificacin de los archivos locales y los archivos remotos.) Muy til para poner al da el sitio Web rpidamente con las ltimas versiones de sus documentos.
32
Captulo 2
Selecciona los mismos archivos que haba seleccionado la ltima vez que public el proyecto. Selecciona todos los archivos de imagen que se usan en los documentos seleccionados (si los hay). Quita la seleccin de todos los archivos. Una vez que ha seleccionado los archivos para publicar, est listo para seguir al prximo paso: conectar con su sitio Web.
Qu indica una marca gris? Una marca de verificacin gris al lado de una carpeta en la lista de archivos locales indica que algunos (pero no todos) de los archivos dentro de la carpeta han sido seleccionados.
2.2.2 Conectando con el sitio Web

Antes de conectar a su sitio Web, debe haber preparado la informacin del sitio y verificado que se puede conectar a l, como se describe en la seccin 2.1.1. Para conectar a su sitio Web, haga lo siguiente:
1 Conecte a Internet, si no lo ha hecho. 2 Seleccione su sitio en el men Sitio en la parte superior de la ventana Publicar. 3 Haga clic en el botn Conectar.
Un dilogo indicando el progreso aparecer hasta que Namo WebEditor haya conectado con xito al servidor. Los archivos y carpetas ya en el sitio, si los hay, aparecern en la lista de archivos remotos. Si recibe un mensaje de error que dice que Namo WebEditor no puede conectar con el sitio, verifique la informacin de cuenta en el dilogo Parmetros del Sitio Web (use el comando Herramientas > Parmetros del Sitio Web) y pruebe de nuevo.
2.2.3 Transmitiendo los archivos al sitio Web

Una vez seleccionados los archivos a ser publicados y que se haya conectado a su sitio, simplemente haga clic en el botn Publicar. Un dilogo aparecer indicando el progreso de la transferencia. Cuando la transferencia sea completada con xito, pulse sobre el botn Aceptar para cerrar el dilogo.
Publicando un proyecto a su sitio Web
33
Se resaltarn los archivos y carpetas publicados con xito con una casilla de verificacin verde en la lista de archivos locales. Si cualquier archivo no pudiera transferirse, se resalta con casilla de verificacin roja. (Verifique su conexin con Internet y pruebe de nuevo.)
34
Captulo 2
2.3 Descargando archivos de su sitio Web

Ocasionalmente puede necesitar recibir archivos de su sitio Web a su ordenador , por ejemplo, si ha eliminado alguna o todas las copias locales de sus documentos Web inadvertidamente. Para tales casos, Namo WebEditor proporciona la opcin de recibir archivos de su sitio Web usando la solapa Publicar del Administrador de Sitio Web. Despus de descargar los documentos, puede revisarlos como de costumbre y entonces volver a publicarlos al sitio.
2.3.1 Descargando los archivos a un proyecto existente

Para descargar archivos de su sitio Web a un proyecto existente, haga lo siguiente:
1 Abra el proyecto, si no se encuentra abierto. 2 Conecte con Internet, si no est conectado. 3 Cambie a la solapa Publicar del Administrador de Sitio Web, seleccionando su sitio en el
men Sitio en la parte superior de la ventana y haciendo clic en Conectar.

4 Asegrese de que la casilla de verificacin Publicar proyecto (arriba de la lista de
archivos locales) est marcada. Esto har que la lista de archivos locales apunte a su proyecto.
5 En la lista de archivos remotos, seleccione los archivos y/o carpetas que desea descargar.
Use la tecla < Mays > mientras hace clic para seleccionar elementos contiguos mltiples o la de < Ctrl > para seleccionar elementos no contiguos.
6 Haga clic en el botn Descargar.
Un dilogo aparece indicando el progreso de la descarga. Cuando la recepcin est completa, aparece el mensaje"La importacin termin con xito." Haga clic sobre el botn Aceptar para cerrar el dilogo. Los archivos recibidos aparecern en la lista de archivos locales.
Si ya existe un archivo en la carpeta del proyecto con el mismo nombre del que se intenta descargar del sitio, el archivo local es reemplazado sin ningn aviso.
2.3.2 Volviendo a crear un proyecto borrado

Cada proyecto creado en Namo WebEditor tiene varios archivos invisibles que guardan la informacin del estado del proyecto y la configuracin. Estos archivos no aparecen en ninguna de las vistas del Administrador de Sitio Web y no se publican a su sitio Web. Si anula una carpeta completa del proyecto inadvertidamente, los archivos de configuracin de su sitio Web no pueden recuperarse. Sin embargo, puede volver a crear los archivos de configuracin descargando todos los documentos y archivos de recursos de su sitio a una
Descargando archivos de su sitio Web
35
carpeta en su unidad de disco duro y creando un nuevo proyecto en esa carpeta. Tenga presente, sin embargo, que alguna informacin se perder (como la estructura de navegacin del proyecto; que tendr que ser recreada a mano.) Para volver a crear un proyecto borrado, haga lo siguiente:
1 Usando la ventana Publicar, conecte a su sitio Web y descargue todos los archivos y
carpetas del sitio en un directorio vaco en su unidad de disco duro.

2 Cambie a la ventana principal de Namo WebEditor y seleccione Archivo > Proyecto >
Nuevo Proyecto.
3 En el dilogo Crear Nuevo Proyecto, teclee un nombre para el proyecto y presione sobre
el botn Examinar.
4 En el dilogo Examinar localice y seleccione la carpeta en la que guard los archivos de
su sitio Web. Haga clic sobre el botn Aceptar.

5 Haga clic sobre el botn Aceptar para cerrar el dilogo Crear Nuevo Proyecto. El
proyecto se crear y aparecer el Administrador de Sitio Web. Los nuevos archivos y carpetas del proyecto aparecern en la solapa Proyecto.
6 Haga clic con el botn derecho del ratn sobre el icono del proyecto que se encuentra en
el panel superior de la ventana y seleccione Agregar Todos los Archivos al Proyecto.
Debe ahora volver a crear la estructura de navegacin del proyecto manualmente.

8.3.1: Creando una estructura de navegacin
36
Captulo 2
Parte Dos
Creando Documentos Web
Captulo 3
El Entorno de Edicin
Las caractersticas de WebEditor son intuitivas, pero poderosas, para la creacin y edicin visual de documentos Web. En este captulo, aprender a usar al mximo la interfase de Namo WebEditor.
En este captulo
3.1 Perspectiva general de la interfase de Namo WebEditor 3.2 Personalizando el entorno de edicin
39
3.1 Perspectiva general de la interfase de Namo WebEditor
3.1.1 Elementos de la Interfase

La imagen siguiente muestra los elementos bsicos de la ventana principal de Namo WebEditor.
Barra de Men Barra de herramientas estndar Solapas de Documento Ventana de Edicin Barra de herramientas de Formato
Barra de Estado Solapas de Modo
A continuacin describimos estos elementos de arriba hacia abajo: Barra de Men sta es una barra normal de men de Windows. La barra del men contiene la mayora de los comandos de Namo WebEditor. Como con otras aplicaciones de Windows, puede acceder a un men rpidamente tecleando la letra subrayada mientras presiona la tecla <Alt>
Barra de Herramientas Estndar La barra de herramientas estndar contiene los atajos a muchos de los comandos generales de uso frecuente. Barra de Herramientas de Formato La barra de herramientas de Formato contiene los atajos a muchos de los comandos generales de uso frecuente relativos al formato de texto. Solapas de Documentos Las solapas de documento le permiten cambiar entre los documentos abiertos. Tambin puede presionar las teclas <Ctrl + Tab> para intercambiar entre los documentos abiertos.
40
Captulo 3
Ventana de Edicin
La ventana de Edicin es su rea de trabajo con el documento. Es donde se revisa el texto, se insertan imgenes y todo lo dems relacionado a crear y revisar documentos de Web. Estas solapas se usan para cambiar entre los tres modos de la ventana principal: modo de Edicin, modo HTML y modo de Vista Previa. La barra de estado es un rea que despliega informacin til sobre el documento actual y el ambiente de trabajo, tales como la localizacin en el disco duro de una imagen o hipervnculo bajo el apuntador del ratn, el estado de modificacin del documento y las etiquetas HTML en el punto de insercin.
Solapa de Modos Barra de Estado
De manera predeterminada, la barra del men y las barras de herramientas Estndar y de Formato se encuentran en la parte suprior de la ventana principal. Puede mover la barra del men o cualquiera de las barras de herramientas arrastrando su manija (la lnea doble del lado izquierdo.) Pueden colocarse en cualquier borde de la ventana. Si mueve la barra del men o una de las barras de herramientas fuera de un borde de la ventana, se vuelve una ventana flotante. Para fijarla, arrstrela a uno de los bordes de la ventana. Adems de las barras de herramientas Estndar y de Formato, dos barras de herramientas adicionales "aparecen" como flotantes dependiendo de lo que se est haciendo en la ventana de Edicin. La barra de herramientas de Imagen aparece cuando se pulsa sobre una imagen y desaparece cuando se hace clic fuera de ella. La barra de herramientas de Tablas aparece cuando se usa el comando Dibujar Tabla del men Tabla. Como con las otras barras de herramientas, se puede estacionar (acoplar) cualquiera de ellas al borde de la ventana principal
3.2.3: Personalizando las barras de herramientas
3.1.2 Elementos de la ventana de Edicin

Adems del texto e imgenes que constituyen un documento Web, la ventana de Edicin puede contener varios otros elementos que slo aparecen cuando est revisando un documento; estos elementos no aparecen cuando el documento se ve en un navegador. Algunos de stos se ilustran en la imagen inferior.
Perspectiva general de la interfase de Namo WebEditor
41
Manija de capa
Punto de insercin
Marca de salto de lnea
Marca de etiqueta de capa Borde de capa Indicador de inicio Marcador Marca de prrafo Rejillas ocultas de tabla
Todos estos smbolos especiales y marcas se despliegan de manera predeterminada, pero si prefiere puede deshabilitarlas para tener un escritorio ms limpio (a excepcin del punto de insercin) usando los comandos del submen Ver > Marcas: Use Ver > Marcas > Rejillas de Tabla para intercambiar el despliegue de las rejillas ocultas de las tablas y el borde azul alrededor de la tabla que se est editando. Use Ver > Marcas > Marcas de Prrafo para intercambiar el despliegue de smbolos de prrafo y saltos de lnea. Use Ver > Marcas > Espacios para intercambiar el despliegue de los pequeos puntos que indican un espacio. Use Ver > Marcas > Marcas Especiales para intercambiar el despliegue de smbolos especiales que indican etiquetas de capas, marcadores, comentarios, etiquetas desconocidas, el inicio de vietas o listas numeradas, bordes punteados alrededor de formularios, applets, plug-ins, controles ActiveX y objetos multimedia. Para mostrar u ocultar todas las marcas, use Ver > Marcas > Todas.
42
Captulo 3
3.2 Personalizando el entorno de edicin

Es posible personalizar el entorno de edicin de Namo WebEditor de varias maneras. Reglas, guas y una rejilla de trazado estn disponibles para ayudarle al diseo preciso de sus pginas. Puede personalizar todas las barras de herramientas y fijar rpidamente el tamao de la ventana principal para aproximarse a las resoluciones grficas comunes de pantalla. Adems, puede predeterminar varios valores de los documentos y las preferencias del usuario en el dilogo Preferencias.
3.2.1 Usando las reglas, guas y rejillas

Las reglas, la gua de diseo y una rejilla pueden ser una gran ayuda en el bosquejo cuando la precisin es importante. La imagen siguiente muestra la ventana de Edicin con las reglas horizontales y verticales, varias guas y una rejilla de diseo habilitada.
Para mostrar la regla horizontal, vertical o ambas, use uno de los comandos en el submen Ver > Reglas. La unidad usada en las reglas es el pxel. Adems de usar las reglas para medir el tamao de los elementos en la pgina, se puede usar la regla horizontal para fijar la sangra de un prrafo.
Sangra de primera lnea Sangra izquierda Sangra derecha
Para fijar la sangra de un prrafo usando la regla horizontal, coloque el punto de insercin dentro del prrafo y arrastre uno de los controles de sangra (como se muestra en la figura superior) al punto deseado.
Personalizando el entorno de edicin 43
Una rejilla o gua de diseo puede ayudar a alinear los elementos en la pgina con respecto a los dems. Para mostrar las rejillas de diseo, use el comando Ver > Rejilla > Mostrar. Para crear una gua de diseo, haga clic dentro de una de las reglas, arrastre fuera de ella a la posicin deseada dentro de la ventana de Edicin y suelte el botn del ratn. Para mover una gua, coloque el apuntador del ratn directamente sobre la gua; cuando el apuntador del ratn tenga la forma de una barra doble con pequeas flechas en ambos lados, haga clic y arrstrela a la nueva posicin. Para eliminar una gua, arrstrela de Nuevo a la regla. Para ocultar todas las guas sin removerlas, use el comando Ver > Guas > Mostrar; selo de nuevo para mostrar las guas. Si habilita ajustar a para las rejillas o guas, los bordes de las capas encajan a ellas al moverlas o cambiarlas de tamao. De manera similar, los bordes de las tablas encajan en las rejillas o guas al moverlas. Adems, estos elementos encajan a subdivisiones invisibles de la rejilla de diseo. Para habilitar o deshabilitar el ajuste a rejillas use el comando Ver > Rejilla > Encajar. Para habilitar o deshabilitar el ajuste a guas use el comando Ver > Guas > Encajar.
5.3: Trabajando con capas
De manera predeterminada las rejillas se separan en 50 pxeles, con 10 pxeles entre subdivisiones. Se pueden cambiar estos parmetros usando el comando Ver > Rejilla > Parmetros. Tambin se pueden cambiar los colores de las rejillas y guas usando el mismo comando.
3.2.2 Seleccionando el tamao de la ventana

Al disear un documento Web, a veces es necesario asegurarse de que el documento entero est visible en una ventana del navegador aumentada al mximo en un cierto tamao de pantalla tal como 800 x 600 pxeles sin que se requiera desplazarla. Puede usar reglas y guas de diseo para hacer esto, pero una manera ms fcil es cambiar el tamao de la ventana de Namo WebEditor al mismo que el del navegador designado usando el comando Ver > Tamao de la ventana. Tres tamaos comunes de pantalla estn disponibles, pero es posible especificar un tamao personalizado. Cuando presione sobre el botn Aceptar, la ventana principal se redimensionar al instante al tamao seleccionado. Una vez realizado esto, sabr que si necesita desplazarse para ver el documento entero en la ventana de Edicin, los visitantes del sitio tambin tendrn que hacerlo si las ventanas de sus navegadores son del mismo tamao. Sin embargo, tenga presente que el comando Tamao de la ventana no toma en cuenta el tamao de cualquier barra de herramientas que pueda estar acoplada a cualquier borde de la ventana principal. Por consiguiente, es posible que un documento que requiera desplazamiento en la ventana de Edicin no lo requiera en un navegador.
44
Captulo 3
3.2.3 Personalizando la barra de herramientas

Puede crear una nueva barra de herramientas o personalizar las ya existentes usando el comando Ver > Barra de herramientas > Personalizar. Para personalizar una barra de herramientas existente, seleccinela en el dilogo Barra de herramientas y haga clic en el botn Personalizar. En la solapa Botones del dilogo Personalizar Barra de herramientas, se muestran todos los botones disponibles, agrupados por categoras. Para agregar un botn, seleccione una categora y luego arrastre el botn deseado a la barra de herramientas. Para quitar un botn de una barra de herramientas, arrstrelo fuera de ella. Para crear una nueva barra de herramientas, haga clic en el botn Nuevo en el dilogo Barra de herramientas. Dele un nombre y presione el botn Aceptar. La nueva barra de herramientas aparecer y el dilogo Personalizar Barra de herramientas se abrir. Cambie a la solapa Botones para agregar o remover botones tal y como se describe en los prrafos anteriores. Recuerde que puede mover una barra de herramientas a cualquier posicin en la pantalla o acoplarla a cualquiera de los bordes de la ventana principal. Para mostrar u ocultar rpidamente una barra de herramientas, haga clic con el botn derecho del ratn en cualquier barra de herramientas acoplada o en la barra de men y seleccione su nombre del men de atajos.
3.2.4 Ajustando las opciones predeterminadas del documento y las preferencias del usuario
Se pueden cambiar varios parmetros y preferencias del usuario en el dilogo Preferencias. Para abrirlo, use el comando Herramientas > Preferencias. El texto predeterminado, color de fondo y de vnculo para un documento nuevo se especifican en la solapa Propiedades del Documento. Se puede tambin especificar el lenguaje predeterminado de codificacin (juego de caracteres) para el nuevo documento. Los parmetros iniciales (definidos por el usuario) significan que los documentos nuevos no tendrn un lenguaje especfico de codificacin; cuando un documento de este tipo se vea en un navegador, usar la codificacin especificada en l. La solapa Propiedades del Documento tambin permite especificar el ancho del texto proporcional y fijo para todos los documentos. Estos parmetros solamente afectan a cmo se muestra el texto en la ventana de Edicin del cual no se ha especificado una tipografa. El mismo texto pueda aparecer de formas diferentes en distintos navegadores, dependiendo de los propios parmetros de tipografa. Las otras solapas del dilogo Preferencias permiten fijar otras preferencias del usuario tales como verificar la ortografa al escribir, realizar una copia de seguridad de forma automtica cuando se guarda un documento y otras ms. Para mayor informacin sobre preferencias del usuario vea la seccin Preferencias en la parte 6 de esta gua.
Personalizando el entorno de edicin
45
Por qu el texto aparece en una tipografa distinta en la ventana de Vista Previa? En la ventana de Edicin, el texto para el que no se ha especificado una tipografa, usa una de las predefinidas en la solapa Valores predeterminados de Documento del Dilogo Preferencias. La ventana de Vista Previa, por otro lado, usa la tipografa definida en el applet Opciones de Internet del Panel de control de Windows. A menudo estas no coinciden. Si quiere que la ventana de Edicin y la de Vista Previa usen la misma tipografa, cmbiela en las preferencias de Namo WebEditor para hacerla coincidir con aquella de Opciones de Internet o cambie la definida en las Opciones de Internet para que sea igual a la de Namo WebEditor.
46
Captulo 3
Captulo 4
Edicin Bsica de un Documento
Ya sea que est personalizando los documentos generados por el Asistente de Sitios Web o creando nuevos, Namo WebEditor hace que su creacin y revisin sea lo ms fcil posible. En este captulo, aprender todo lo necesario para crear documentos de Web bsicos.
En este captulo
4.1 4.2 4.3 4.4 4.5 4.6 4.7 4.8 4.9 4.10
Creando nuevos documentos Agregando y editando texto Formato bsico de texto Agregando y dando formato a imgenes Creando una galera de imgenes Aplicando efectos a una imagen Creando hipervnculos Creando botones y titulares Creando y editando tablas Modificando las propiedades de un documento
47
4.1 Creando nuevos documentos
4.1.1 Creando un documento vaco

Para crear un documento en blanco, use el comando Archivo > Nuevo y seleccione Documento en blanco dentro del dilogo Nuevo. Alternativamente, haga clic sobre el botn Nuevo de la barra de herramientas estndar, o presione las teclas <Ctrl + N>.
4.1.2 Creando un documento usando una plantilla

Para crear un documento usando una plantilla de documento nico, use el comando Archivo > Nuevo. En el dilogo Nuevo, seleccione uno de los tipos de documentos listados en la solapa Documentos.
Tal como los documentos generados por el Asistente de Sitios Web, la plantilla de documento nico se forma de tablas invisibles para propsitos de despliegue y tiene texto de muestra (y algunas veces imgenes.) Debe de reemplazar estos textos e imgenes con las propias.
4.1.3 Agregando un documento a un proyecto

Si est trabajando en un proyecto (tal como uno creado con el Asistente de Sitios Web), cambie a la solapa de Proyecto del Administrador de Sitio Web y use el comando Archivo > Nuevo > Nuevo Documento para crear un documento nuevo y vaco agregndolo de forma automtica al proyecto. El nuevo documento ser colocado en la carpeta en uso.
8.1: Creando un proyecto
48
Captulo 4
4.2 Agregando y editando texto

Usar la ventana de Edicin de Namo WebEditor es muy similar a usar un procesador de palabras. La tcnica bsica para introducir, editar y dar formato al texto son las mismas.
4.2.1 Introduciendo y seleccionando texto

Para introducir nuevo texto en la ventana de Edicin, simplemente teclelo. El texto aparecer en el punto de insercin (la barra vertical que parpadea). Hay varias formas de seleccionar un texto para su edicin. Puede seleccionar texto usando el ratn o el teclado as como una combinacin de ambos. Para seleccionar un bloque de texto usando nicamente el ratn, haga clic al principio del bloque, mantenga presionado el botn del ratn, arrstrelo al final del bloque y suelte el botn. Para seleccionar un bloque de texto utilizando solamente el ratn, coloque el punto de insercin frente al primer carcter del bloque y presione cualquiera de las teclas de direccin del teclado mientras mantiene presionada la tecla <Mays>. Detngase cuando haya llegado al ltimo carcter del bloque. Si presiona la tecla de flecha izquierda o derecha mientras mantiene presionada la combinacin de teclas <Mays + Ctrl> se extender la seleccin de una palabra a la vez. La forma ms rpida de seleccionar un bloque de texto es utilizando el ratn y el teclado juntos. Haga clic en el botn del ratn al principio del bloque (y suelte el botn), mueva el apuntador del ratn al final del bloque, presione la tecla <Mays> y vuelva a presionar el botn del ratn. La manera ms fcil de seleccionar una palabra es hacer doble clic sobre ella en rpida sucesin.
4.2.2 Borrando texto

Para borrar un slo carcter de texto, presione la tecla <Borrar atrs> o <Delete> en el teclado dependiendo si quiere borrar caracteres a la izquierda o derecha del punto de insercin. Para borrar un bloque de texto, seleccinelo y presione la tecla <Borrar atrs> o <Delete> (no importa cual). Si decide que no quiere borrar el texto, seleccione Deshacer del men Editar o haga clic sobre el botn Deshacer en la barra estndar de herramientas. Tambin puede presionar la combinacin de teclas <Ctrl + Z> antes de hacer cualquier otra cosa. Se puede deshacer cualquier operacin de la misma manera.
Agregando y editando texto
49
4.2.3 Usando el portapapeles

Si alguna vez ha utilizado un procesador de palabras, estar familiarizado con los conceptos tales como cortar, copiar y pegar texto usando el portapapeles. El portapapeles es un sitio temporal e invisible que puede contener texto y otros objetos. Se puede usar el portapapeles para mover texto de una posicin a otra del mismo documento o a uno distinto. (Esto es mucho ms sencillo que volver a escribir el texto en la nueva posicin.) La accin de cortar un texto, lo mueve de su posicin actual hasta el portapapeles.(La seleccin desaparece de su posicin original.) Si se copia una seleccin de texto, ste se mueve al portapapeles sin quitarlo de su posicin en el documento. Finalmente, al pegar el contenido del portapapeles, se copia en la posicin del punto de insercin. Una vez que se ha cortado o copiado una seleccin, se puede pegar tantas veces como se quiera, debido a que la accin de pegar no remueve el contenido del portapapeles. Se puede usar el comando Cortar, Copiar y Pegar del men de Edicin. Sin embargo, es ms fcil usar las combinaciones de teclas <Ctrl + X> para cortar, <Ctrl + C> para copiar y <Ctrl + V> para pegar.
Una vez que se corta o copia una seleccin al portapapeles, sta reemplaza el contenido, si es que lo haba. Si quiere agregar la seleccin al contenido del portapapeles en lugar de reemplazarlo, mantenga presionada la tecla <Mays> mientras corta o copia.
4.2.4 Usando arrastrar y soltar

Otra forma de mover o copiar una seleccin de texto (a veces ms fcil) a una nueva posicin es utilizando lo que se llama arrastrar y soltar. Para usar "arrastrar y soltar" para mover un bloque de texto, seleccione el texto, mueva el apuntador de ratn sobre el bloque de texto seleccionado, presione y mantenga presionado al botn del ratn y arrstrelo a la nueva posicin soltando en ese punto el botn del ratn. Conforme se arrastra, el punto de insercin seguir al apuntador del ratn permitiendo saber dnde se insertar el bloque de texto cuando se suelte el botn. Para utilizar arrastrar y soltar para copiar un bloque de texto -- esto es, moverlo mantenindolo tambin en su posicin original -- siga los mismos pasos anteriores, pero presione la tecla de control cuando suelte el botn del ratn. Si a la mitad de una operacin de "arrastrar y soltar" decide que no quiere realizarla, mueva el apuntador del ratn de nuevo hacia la parte superior de la seleccin y suelte el botn del ratn, el texto seleccionado se quedar en su posicin original.
4.2.5 Copiando texto de otra aplicacin

Se puede usar tanto el portapapeles como la operacin de arrastrar y soltar para copiar texto de una aplicacin a la ventana de edicin. Si la otra aplicacin utiliza HTML para dar formato
50
Captulo 4
a la informacin como lo hace un navegador entonces el formato del texto copiado ser conservado. Si se copia texto desde Microsoft Word el formato del texto se conservar tanto como sea posible.
Si desea arrastrar y soltar algn texto desde otra aplicacin hasta la ventana de Namo WebEditor, pero la ventana est oculta detrs de otras, arrastre el texto al icono dentro de la barra de tareas de Windows (la que se encuentra en la parte inferior) y mantenga el apuntador del ratn en esa posicin por un momento. Cuando aparezca la ventana de Namo WebEditor, suelte el texto en la posicin deseada.
4.2.6 Buscando y reemplazando texto

Use el comando Editar > Buscar para encontrar rpidamente cierta palabra o frase en el documento activo.
Escriba la palabra o frase a buscar en el recuadro Buscar y haga clic sobre el botn Buscar Siguiente. Si est buscando un vnculo o parte de l, seleccione la opcin Buscar en vnculo. Para reemplazar cierta palabra que aparezca dentro de otra o en una frase, use el comando
Editar > Reemplazar. Escriba el texto original en el recuadro Buscar y el de sustitucin en el cuadro Reemplazar con. Para reemplazar de una en una haga clic en el botn Buscar Siguiente y luego en el de Reemplazar para sustituirlo o en el de Buscar Siguiente de nuevo
para ir al siguiente. Para sustituir todos los textos encontrados a la vez haga clic sobre el botn Reemplazar Todos. Si selecciona la opcin Buscar en todos los documentos abiertos al buscar o reemplazar texto, se buscar en todos los documentos que estn abiertos en la ventana de Edicin y no slo en el activo.
Agregando y editando texto
51
4.3 Formato bsico de texto

As como con la edicin, el formato del texto puede realizarse en Namo WebEditor usando los conceptos familiares del procesamiento de palabras. En esta seccin, explicamos los conceptos bsicos del formato de texto. Para informacin avanzada consulte la Seccin 5.3: Estilos y hojas de estilo.
4.3.1 Formato de carcter

Los caracteres de formato incluyen atributos de texto tales como tipografa, tamao, color y estilo (negrilla, cursiva, subrayado, etc.), que se aplican a los caracteres individuales y a grupos de ellos, tales como palabras u oraciones. La mayora de los formatos de carcter pueden aplicarse usando el rea asignada dentro de la barra de herramientas de formato.
De izquierda a derecha estos comandos son:

Tipografa Tamao del tipo Negrilla Cursiva Subrayado Color del tipo
Seleccione una tipografa de la lista. Seleccione un tamao estndar de letra o teclelo en puntos dentro de la lista. Haga clic para aplicar el estilo negrilla. Haga clic para aplicar el estilo cursivo. Haga clic para aplicar el estilo subrayado. Seleccione un color para el texto de la lista o haga clic directamente para aplicar el color previamente seleccionado. directamente para aplicar el color previamente seleccionado.
Color de fondo del texto Seleccione un color de fondo para el texto de la lista o haga clic Eliminar Formato de carcter
Haga clic para eliminar todos los formatos de texto aplicados. Para aplicar un formato del carcter, primero seleccione el bloque de texto al que aplicar el formato y luego use los comandos de la barra de herramientas de Formato. Existen ms opciones de formato dentro del dilogo Estilo de Carcter, a las que se puede tener acceso usando el comando Formato > Tipografa.
52
Captulo 4
En la solapa Carcter del dilogo, se puede especificar, adems de lo ya disponible dentro de la barra de herramientas de Formato, lo siguiente: Una tipografa alternativa que se usar si la computadora usada para ver el documento no tiene la tipografa primaria instalada (la especificada en la barra de herramientas de Formato es la primaria) Varios estilos adicionales de texto: tachado, monoespacio, superndice y subndice En la solapa Estilos Extendidos, existen varios estilos extras de texto disponibles; sin embargo, estos se interpretan diferente dependiendo del navegador Web usado, por lo que es aconsejable no usarlos. Adems, se puede especificar la cantidad de espacio para poner entre caracteres o palabras, en varios tipos de unidades.
Una nota sobre los tamaos del texto El men de Tamao de Tipografa en la barra de herramientas de Formato y el men Tamao en el dilogo Estilo de Carcter le permiten especificar el tamao del texto de dos maneras: Como un texto Web estndar, tal como 1, 2, 3, etc. o en puntos. Probablemente estar familiarizado con las medidas en puntos que normalmente son usadas en la mayora de los procesadores de palabras. A diferencia del tamao especificado en puntos, el de un texto Web estndar es relativo, no absoluto. El tamao 2 es mayor que el 1, pero ningn tamao corresponde a uno absoluto en particular. Estos son interpretados de manera diferente segn el tipo de navegador. Por conveniencia, Namo WebEditor muestra el tamao en puntos que corresponde al equivalente Web usado en Internet Explorer, en sus mens. Desgraciadamente, ninguno de estos mtodos de especificar el tamao de un texto es texto consistente en todos los navegadores ni en todas las plataformas. Si es importante que su texto siempre aparezca del mismo tamao con respecto a otros elementos de la pgina, como las imgenes, debe especificar el tamao en pxeles. Esto puede hacerse usando los atributos CSS. Tenga en cuenta, sin embargo, que no todos los navegadores reconocen el tamao en pxeles.
5.2: Hojas de estilo
Formato bsico de texto
53
4.3.2 Formato de prrafo

Los formatos del prrafo incluyen atributos del texto que son aplicables a los prrafos, no a caracteres individuales o palabras. Estos atributos incluyen la alineacin el sangrado, el espacio entre lneas y prrafos y otros. Adems, los estilos estndar de HTML, como Encabezado 1, Direccin y Vietas, son formatos a nivel de prrafo. Pueden aplicarse muchos formatos de prrafo usando los botones de la barra de herramientas de Formato. El men de estilo de HTML tambin se encuentra en esta barra de herramientas.
De izquierda a derecha estos controles son:

Estilo HTML
Seleccione un estilo estndar HTML de la lista.
Alineacin Izquierda Haga clic para alinear el prrafo al margen izquierdo. Alineacin Centrada Haga clic para centrar el prrafo entre los mrgenes izquierdo y
derecho.
Alineacin Derecha Haga clic para alinear el prrafo del lado derecho. Lista Numerada Vietas
Haga clic para convertir el prrafo en una lista numerada. Haga clic para convertir el prrafo en una vieta. Haga clic para disminuir la sangra izquierda del prrafo en 40 pxeles.
Decrementar Sangra
Incrementar Sangra Haga clic para aumentar la sangra izquierda del prrafo en 40 pxeles.
Para aplicar un formato de prrafo, coloque el punto de insercin en cualquier parte dentro del prrafo a formatear no hay necesidad de seleccionar el prrafo y use uno de los controles de la barra de herramientas Formato. Si desea aplicar el mismo formato a ms de un prrafo, seleccinelos antes de usar la barra de herramientas. Puede encontrar opciones adicionales para el formato de un prrafo en el dilogo Prrafo, dentro del comando Formato > Prrafo.
54
Captulo 4
En la solapa Sangras y Espacios del dilogo puede modificar: Alineacin del prrafo (incluyendo la justificacin, donde se agregan espacios adicionales entre las palabras de un prrafo para hacer que cada lnea se vea de la misma longitud)
sangra (izquierda, derecha y de primera lnea) Espacio entre lneas
Espacio entre prrafos (antes y despus) La sangra se refiere al espacio en blanco en cualquier lado de un prrafo, entre el borde de la ventana y el borde (margen) del texto. Note que la sangra derecha es medida desde el borde derecho de la ventana, no del izquierdo. Como resultado, el ancho de un prrafo variar con el ancho de la ventana de Edicin o la del navegador. La sangra izquierda de la primera lnea de un prrafo puede fijarse de manera independiente usando la opcin Sangra de la primera lnea. sta se especifica con relacin a la sangra izquierda del prrafo, no al borde izquierdo de la ventana. Por ejemplo, si desea una sangra en la primera lnea de un prrafo de 50 pxeles menos que el resto del prrafo, introduzca -50 para la sangra de la primera lnea. La sangra puede especificarse en una variedad de unidades, usando la lista al lado de cada ajuste de sangra. Si no especifica una unidad, se usarn pxeles. Adems de usar el dilogo Prrafo, puede fijar tambin las sangras usando los controles de la regla horizontal.
Sangra de la primera lnea Sangra izquierda Sangra derecha
55
Para fijar la sangra de un prrafo usando la regla horizontal, coloque el punto de insercin dentro del prrafo y arrastre uno de los controles de sangra (como se muestra en la imagen superior) a la posicin deseada. El espacio entre lneas se refiere a la cantidad de espacio entre la parte inferior de una lnea y el de la prxima lnea en un prrafo. El espacio entre prrafos se refiere a la cantidad de espacio extra entre los prrafos. Puede escoger una combinacin comn dentro del men Predeterminado o fijarlos independientemente. Como con las sangras, se puede especificar el espacio entre lneas y prrafos usando una variedad de unidades. Si no se especifica la unidad para el espacio entre lneas, se interpretar como un mltiplo de alguna altura base que depende del tamao del texto. Si no especifica la unidad para el espacio entre prrafos, se usarn los pxeles.
En la solapa Opciones de Estilo y Lista del dilogo Prrafo, puede: Seleccionar un estilo HTML estndar en el men Estilo (mismo que el men Estilo de HTML en la barra de herramientas de Formato) Seleccionar una forma de vieta o un formato del nmero para una lista numerada Especificar el nmero inicial para una lista numerada La forma de la vieta o el formato del nmero que elija se aplicar a cada elemento en la misma lista.
Si desea modificar la forma de la vieta o el formato del nmero de manera independiente para un slo elemento de la lista, haga clic con el botn derecho del ratn dentro del elemento de la lista y seleccione Propiedades del elemento de la lista en el men de atajo. Luego seleccione la forma de la vieta, la bala o formato del nmero en el dilogo Propiedades de la Vieta o en el dilogo Propiedades de la Lista.
56
Captulo 4
4.3.3 Copiando y pegando formatos

Los atributos de formato, tanto a nivel carcter como prrafo, pueden llevarse de un bloque de texto a otro copindolos y pegndolos. Para copiar formatos de un bloque del texto a otro, haga lo siguiente:
1 Coloque el punto de insercin dentro del bloque de texto que contiene el formato a copiar
(no seleccione el bloque.)

2 Seleccione el comando Editar > Copiar Formato o presione las teclas <Mays + F2>.
3 En el dilogo Copiar Formato, seleccione los distintos atributos a copiar y presione sobre
el botn Aceptar. (Los Estilos de Prrafo se refieren a los atributos de los prrafos, no slo el estilo HTML.)
4 Seleccione el bloque de texto a donde se desea pegar el formato copiado (o, si est
pegando slo formatos de prrafo, coloque el punto de insercin dentro del bloque) y use el comando Editar > Pegar Formato o presione la tecla <F2>.
57
4.4 Agregando y dando formato a imgenes

Las imgenes son una parte importante de la mayora de los sitios Web. Afortunadamente, Namo WebEditor hace del usar y aadir imgenes en sus documentos una tarea muy fcil. Hay varias maneras de agregar una imagen a un documento Web.
4.4.1 Agregando una imagen del disco duro

Para agregar una imagen almacenada en su disco duro u otro disco de la red local, haga lo siguiente:
1 Coloque el punto de insercin donde quiere insertar la imagen. 2 Seleccione el comando Insertar > Imagen > Desde Archivo o haga clic en el botn
Insertar Imagen desde Archivo en la barra de herramientas estndar.
3 En el dilogo Propiedades de la Imagen, haga clic en el botn Examinar. 4 Localice y seleccione la imagen en el dilogo Abrir. Se pueden insertar imgenes del tipo
GIF, JPEG o PNG. Haga clic en el botn Abrir.

5 Haga clic sobre el botn Aceptar para cerrar el dilogo Propiedades de la Imagen.
La imagen se insertar en el punto de insercin usando la alineacin predeterminada (la parte baja de la imagen se alinear con la parte inferior del texto en la misma lnea.) Alternativamente, puede arrastrar un icono de archivo de imagen del escritorio de Windows o del Explorador de Windows a la ventana de Edicin. Cuando suelte el botn del ratn, aparece un men de atajo del que se selecciona Insertar Archivo o Imagen. La imagen se insertar en la posicin del apuntador del ratn en el momento en que solt el botn del mismo.
4.4.2 Agregando una imagen de la librera de imgenes

Namo WebEditor 4 viene con una biblioteca de imgenes extensa, que contiene ms de 9,000 imgenes en una gran variedad de categoras, tales como iconos, vietas, botones e imgenes de fondo. Para insertar una imagen Clip Art, haga lo siguiente:
1 Coloque el punto de insercin donde quiere insertar la imagen. 2 Seleccione el comando Insertar > Imagen > Clip Art o haga clic en el botn
Insertar Clip Art de la barra de herramientas estndar.
3 En el dilogo Clip Art, seleccione la categora y subcategora en la lista de la izquierda. 4 En la lista de la derecha, seleccione la imagen dentro de la subcategora. 5 Haga clic en el botn Insertar o doble clic en la imagen seleccionada.
58
Captulo 4
La imagen se agregar en el punto de insercin con la alineacin predefinida (la parte baja de la imagen se alinear con la parte inferior del texto en la misma lnea.)
4.4.3 Agregando una imagen de la Web

Si conoce la direccin URL (Internet address) de un archivo de imagen en la Web, se puede insertar en su documento proporcionando su URL en el dilogo Propiedades de la Imagen. Para hacer esto, siga los siguientes pasos: Asegrese de estar conectado a Internet. Coloque el punto de insercin donde quiere insertar la imagen. Seleccione el comando Insertar > Imagen > Desde archivo o haga clic en el botn Insertar Imagen desde Archivo en la barra de herramientas estndar. En el dilogo Propiedades de la Imagen, proporcione la URL del archivo de imagen en el recuadro Ruta de la Imagen. Asegrese de incluir http:// al principio de la direccin URL de otra forma, se interpretar como una ruta de acceso relativa. Haga clic sobre el botn Aceptar para cerrar el dilogo Propiedades de la Imagen. Namo WebEditor intentar conectar al sitio Web donde se encuentra el archivo de la imagen y descargarla. Si tiene xito, la imagen aparecer en el punto de insercin en la ventana de Edicin. Si no se puede recibir la imagen, ver un mensaje de error y un icono de imagen desconocida en ventana de Edicin. Otra manera de insertar una imagen de la Web en un documento es copiarla y pegarla o arrastrando y soltando de la ventana del navegador Web. Vea la siguiente seccin.
4.4.4 Copiando una imagen de otro documento

Una de las maneras ms convenientes de obtener imgenes para sus documentos es copiarlas de otros. Puede copiar imgenes de casi cualquier tipo de documento que las contenga (documentos Web, documentos Microsoft Word, etc.) siempre y cuando la aplicacin que se use para ver el documento permita el copiado de imgenes al portapapeles y / o arrastrarlas fuera de la ventana de aplicacin; podr realizar una copia de las imgenes en Namo WebEditor. La tcnica bsica usando el portapapeles para copiar una imagen de otro documento en el propio es la siguiente:
1 Seleccione la imagen en el otro documento. 2 Copie la imagen al portapapeles (presione <Ctrl + C> o haga clic con el botn derecho
del ratn sobre la imagen y seleccione Copiar del men de atajo.)

3 Coloque el punto de insercin donde desea insertar la imagen en su documento Web.
Agregando y dando formato a imgenes
59
4 Pegue la imagen (presione < Ctrl + V >.)
Tenga presente que si est copiando una imagen de un navegador Web, no puede seleccionar la imagen. Para copiarla, presione el botn derecho del ratn sobre la imagen y seleccione Copiar o Copiar Imagen del men de atajo. Cuando pegue una imagen de un navegador Web en la ventana de Edicin, Namo WebEditor intentar conectar al sitio Web que guarda el archivo para descargarlo. Si tiene xito, la imagen aparecer en el punto de insercin dentro de la ventana Edicin. Si no es posible recuperar la imagen, ver un mensaje de error y un icono de imagen desconocida en la ventana de Edicin. Adems de usar el portapapeles, puede tambin usar arrastrar y soltar para copiar una imagen de otro documento a la ventana de Edicin, si la aplicacin usada para ver el documento permite arrastrar las imgenes fuera de su ventana. Simplemente haga clic sobre la imagen y arrstrela al documento en la ventana de Edicin, soltando el botn del ratn cuando se encuentre en la posicin deseada.
4.4.5 Guardando un documento con imgenes

Cuando guarda un documento por primera vez, una vez que se ha agregado por lo menos una imagen, el dilogo Copiar Archivos de Recursos aparece, preguntando si se copian los archivos de imagen a la misma carpeta del documento.
En la mayora de los casos, debe permitir a Namo WebEditor copiar los archivos de imagen. Al hacer esto, facilita la publicacin de sus documentos a su sitio Web, pues los archivos de imgenes se localizarn convenientemente en la misma carpeta que el documento. Si no quiere que las imgenes se archiven en la misma carpeta que el documento, puede elegir otro directorio (tal como un subdirectorio images) haciendo clic sobre el botn Seleccionar Carpeta. Si es necesario, puede especificar una carpeta diferente para cada archivo de imagen al seleccionarlo y hacer clic en el botn Seleccionar Carpeta.
60
Captulo 4
En general, el nico tipo de situacin en la que no debe permitir que Namo WebEditor copie un archivo de imagen es cuando sta viene de la Web y desea conservar el vnculo a la imagen en su sitio original, en lugar de mantener la imagen en su propio sitio. En tales casos, puede impedir a Namo WebEditor copiar los archivos quitando la marca de la casilla de verificacin de la columna Guardar del dilogo Copiar Archivos de Recursos.
4.4.6 Cambiando el tamao de una imagen

Para redimensionar una imagen, primero seleccinela haciendo clic sobre ella una vez. Aparecer un contorno con ocho manijas de control alrededor de la imagen, una en cada esquina y otra al centro de cada lado.
Manijas de tamao
Para cambiar el tamao de la imagen, haga clic y arrastre cualquiera de sus manijas hacia dentro o hacia fuera del centro de la imagen. Si usa una de las manijas de la esquina, las proporciones se mantendrn al cambiar el tamao. Si necesita especificar el tamao de la imagen con exactitud, siga los siguientes pasos:
1 Haga doble clic sobre la imagen. 2 En el dilogo Propiedades de la Imagen, cambie a la solapa Estilo. 3 Proporcione el nuevo ancho y alto de la imagen dentro de Tamao. Puede especificar las
unidades como pxeles o un por ciento del ancho de la ventana.

4 Haga clic sobre el botn Aceptar para cerrar el dilogo.
Tenga en cuenta que las imgenes de mapas de bits el tipo ms comn usado en la Web se deforman conforme su tamao aumenta. Es, por lo tanto, buena idea el evitar aumentar el tamao de esas imgenes siempre que sea posible.
4.4.7 Ajustando la disposicin de una imagen

En la solapa Estilo del dilogo Propiedades de la Imagen, puede cambiar la alineacin de la imagen con respecto al texto dentro del mismo prrafo, cambiar su tamao o aplicar un margen o borde a la imagen. Para abrir el dilogo Propiedades de la Imagen, haga doble clic sobre la imagen. Las opciones de alineacin son las siguientes:
Agregando y dando formato a imgenes 61
Predeterminada Arriba Centrado Lnea Base Inferior Izquierda Derecha
Deja la alineacin sin especificar. La mayora de los navegadores usan alineacin inferior en este caso. (Vea Inferior, ms adelante.) Alinea la parte superior de la imagen con el texto superior de la misma lnea. Alinea el centro de la imagen con la lnea base del texto de la misma lnea. Alinea la parte inferior de la imagen con la lnea base del texto de la misma lnea. Alinea la parte inferior de la imagen con el texto inferior de esa misma lnea. Coloca la imagen en el lado izquierdo del prrafo que la contiene. El texto del prrafo fluye a la derecha de la imagen. Coloca la imagen del lado derecho del prrafo que la contiene. El texto del prrafo fluye a la izquierda de la imagen. carcter ms alto de la misma lnea. Esto es usualmente, pero no siempre, lo mismo que la alineacin superior.
Parte Superior del Texto Alinea la parte superior de la imagen con la parte superior del
Centro Absoluto
Se alinea la parte central de la imagen con la parte media del texto de la misma lnea. Se alinea la parte inferior de la imagen con la parte inferior del carcter ms bajo de la misma lnea.
Parte Inferior Absoluta
Los controles en Tamao son tiles cuando se requiere especificar el tamao exacto de la imagen, ya sea en pxeles o como un por ciento del ancho de la ventana. Haga clic en el botn Restaurar Tamao para regresar al tamao original de la imagen. Bajo Mrgenes y bordes, se puede fijar un margen horizontal o vertical para la imagen, en pxeles. La misma cantidad de espacio se insertar en ambos lados de la imagen (Arriba y abajo o izquierda y derecha.) Se puede, tambin, aplicar un borde negro slido a la imagen al proporcionar un ancho del borde en pxeles.
4.4.8 Fijando el color transparente de una imagen

Un color en cualquier imagen puede hacerse transparente. Esto es til cuando, por ejemplo, una imagen no es rectangular y le gustara que el rea alrededor de la imagen coincidiera exactamente con el color de fondo del documento.
62
Captulo 4
con transparencia
sin transparencia
Para fijar el color transparente de una imagen, haga lo siguiente:

1 Seleccione la imagen. 2 Seleccione el comando Insertar > Imagen > Fijar el Color Transparente. La barra de
herramientas de imgenes aparecer (si an no est visible) y el botn Seleccionar Color Transparente quedar habilitado.
3 Mueva el apuntador del ratn dentro del rea de la imagen. El apuntador del ratn
cambiar a un gotero. Haga clic en la parte de la imagen donde se encuentre el color que desea hacer transparente.
4 El dilogo Guardar Imagen con Color Transparente debe aparecer. Especifique el
directorio y nombre de archivo para guardar una copia de la imagen con el color transparente. (Si desea sobrescribir la imagen original, deje la ruta de acceso dentro del recuadro Posicin sin cambiar.) Haga clic sobre el botn Aceptar.
Agregando y dando formato a imgenes
63
4.5 Creando una galera de imgenes

Si tiene un gran nmero de imgenes tales como fotografas de sus vacaciones que quisiera compartir con los visitantes de su sitio Web, es buena idea crear un juego de miniaturas (una tabla de pequeas imgenes) con vnculos a las imgenes de tamao completo. Las miniaturas permiten a sus visitantes obtener una idea de cmo se ven sus imgenes sin tener que descargarlas completamente. Si un visitante quiere obtener la imagen completa, slo tiene que hacer clic en su miniatura. El Asistente de Imgenes puede generar una galera de miniaturas de forma automtica. Si cuenta con un nmero relativamente pequeo de imgenes que le gustara desplegar en una sola pgina, en lugar de insertar cada imagen manualmente, use el Asistente de Imgenes para crear una galera de imgenes desde la carpeta donde las almacena. Para iniciar el Asistente de Imgenes, coloque el punto de insercin en el sitio del documento donde desea insertar las miniaturas y use el comando Insertar > Imagen > Galera de Imgenes. El asistente consta de cuatro pasos descritos a continuacin.
4.5.1 Paso 1: Seleccionar las imgenes
En el primer paso del Asistente de Imgenes, se seleccionan las imgenes a incluir en la galera (ya sea como miniaturas o completas.) Si desea agregar las imgenes a una carpeta, sobre el botn Agregar a Carpeta localice y seleccione la carpeta que contiene las imgenes. No se preocupe si el directorio contiene otros archivos, el asistente slo reconocer y agregar las imgenes (formato GIF, JPEG o PNG.) Si desea tambin agregar las imgenes de las subcarpetas de la carpeta seleccionada, utilice la opcin Incluir subcarpetas antes de comenzar. Para agregar las imgenes de carpetas
64
Captulo 4
adicionales, haga clic de nuevo sobre el botn Agregar Carpeta y seleccione otro directorio, repitiendo tantas veces como sea necesario. Si slo quiere agregar una o algunas imgenes del directorio, haga clic sobre el botn Agregar Archivo. Localice y seleccione las imgenes a incluir. Para seleccionar archivos mltiples, mantenga presionada la tecla de <Mays> o <Ctrl> mientras hace clic en el nombre de cada archivo. Para quitar una imagen de la lista de imgenes, seleccinela y presione sobre el botn
Remover de la Lista. Mantenga presionada la tecla <Mays> o <Ctrl> para seleccionar
imgenes mltiples a eliminar de la lista. Una vez que termine de seleccionar las imgenes, haga clic sobre el botn Siguiente.
4.5.2 Paso 2: Especificar el tamao de la imagen
En este paso, se especifica el tamao de las imgenes tal como aparecern en la galera. Para hacer que una imagen aparezca en su tamao completo en la galera, seleccione el botn Usar tamao original. Para crear miniaturas, use la opcin Especificar tamao exacto o Especificar por ciento del tamao original. Si selecciona Especificar tamao exacto, debe escoger tambin mtodo para seleccionar tamao del men. Hay tres maneras de especificar el tamao exacto:
Especificar ancho y alto
Se puede especificar tanto el ancho como el alto de las miniaturas. Si es necesario, las proporciones de la imagen se ajustan para dar cauce a las del tamao especificado. Sin embargo, si selecciona la opcin Restringir proporciones, slo se usa la dimensin menor y las otras se ajustan para mantener las proporciones originales de la imagen.
Creando una galera de imgenes
65
Especificar ancho
Se especifica solamente el ancho de las miniaturas. El alto se ajusta de manera automtica para mantener las proporciones originales de la imagen. Se especifica solamente el alto de las miniaturas. El ancho se ajusta de manera automtica para mantener la proporcin original de la imagen.
Especificar alto
Si se selecciona Especificar un porcentaje del tamao original, slo se introduce el por ciento. Las miniaturas sern reducidas (o agrandadas) a ese por ciento del tamao original. Si quiere que cada miniatura tenga un efecto de borde realzado que lo haga destacar del fondo del documento, seleccione la opcin Gofrar bordes. Haga clic en el botn Siguiente para continuar con el siguiente paso del asistente.
4.5.3 Paso 3: Especificar la distribucin y opciones de vnculos
En este paso se selecciona la opcin de colocar las imgenes en una tabla o dentro del mismo prrafo que contiene el punto de insercin. Para usar una tabla, use la opcin Usar tabla y seleccione el nmero de columnas de la misma. (El nmero de renglones se determina por la cantidad de imgenes que se encuentran en la galera.) Si selecciona Usar tabla, puede tambin solicitar al asistente que coloque una leyenda debajo de cada imagen. La leyenda puede consistir en el nombre del archivo o en el nombre del archivo y su extensin (tal como .gif o jpg). Haga su seleccin dentro de la lista Leyendas. Las leyendas no se encuentran disponibles si no se selecciona la opcin Usar tabla. En este paso tambin se especifican cmo los vnculos de las miniaturas deben ser manejados por el navegador Web. Existen tres opciones:
66
Captulo 4
Abrir cada imagen en la ventana activa
Cuando un visitante del sitio hace clic en una miniatura, la imagen completa se despliega en la misma ventana del navegador, reemplazando el documento activo. El visitante puede utilizar el botn Atrs del navegador para regresar a la galera de imgenes.
Abrir cada imagen en una nueva ventana
Cuando un visitante del sitio hace clic en una miniatura, la imagen completa se abre en una nueva ventana del navegador. Cuando hace clic sobre otra, una nueva ventana se abre, etc.
Abrir cada imagen en una ventana:
Cuando un visitante del sitio hace clic en una miniatura, la imagen completa se abre en la ventana del navegador cuyo nombre se especifica. En la mayora de los casos se puede aceptar la ventana predeterminada, image_view. Si se crea la galera de imgenes en un documento que es parte de un conjunto de marcos y se requiere que las imgenes de tamao completo aparezcan en otro marco, entonces proporcione el nombre del marco destino.
5.4: Marcos y conjuntos de marcos
Si seleccion la opcin Usar tamao original en el paso previo del asistente, estas opciones de vnculos no quedarn disponibles puesto que las imgenes completas se desplegarn dentro de la galera. Haga clic en el botn Siguiente para continuar con el ltimo paso del asistente.
4.5.4 Paso 4: Especificar dnde guardar las imgenes
En el ltimo paso del asistente de imgenes, se especifica dnde guardar las miniaturas que el asistente crea, si se salvan; dnde guardar las copias de las imgenes originales y tambin si la galera contiene imgenes de tamao completo o no.
67
Existen tres opciones:

Usar archivos de imgenes originales (no hacer copias) Seleccione esta opcin si escogi Usar tamao original en el segundo paso del
asistente y no quiere realizar copias de los originales. Esta opcin no est disponible cuando se crea una galera de miniaturas puesto que stas deben almacenarse en algn sitio.
Crear archivos de miniaturas en el directorio que contiene las imgenes originales
Seleccione esta opcin si est creando una galera de miniaturas y desea guardar los archivos en la misma carpeta (o carpetas) que las imgenes originales. Los archivos de las miniaturas tendrn el mismo nombre que las originales, pero con las letras _tm agregadas justo antes de la extensin. En general, no se debe seleccionar esta opcin a menos que los archivos de las imgenes originales se encuentren en una carpeta (o carpetas) que se vaya a publicar al sitio web. Esto se debe a que los vnculos de las miniaturas estarn relacionados con los archivos originales que deben encontrarse, por lo tanto, en el sitio Web para que los visitantes puedan verlas.
Guardar copias o miniaturas en el directorio especificado:
Los archivos de las miniaturas y las copias exactas de las imgenes originales se guardarn en la carpeta que se especifique. Haga clic en el botn Examinar para localizar y seleccionar un directorio. Las miniaturas tendrn el mismo nombre que las originales, pero con las letras _tm agregadas justo antes de la extensin. Si selecciona esta opcin, los vnculos que el Asistente de Imgenes asigna en las miniaturas no estarn relacionados con las imgenes originales. En su lugar se vincularn a las copias de tamao completo de los archivos originales que estn almacenadas en la misma carpeta que las miniaturas. Cuando publique el documento que contiene la galera de miniaturas, asegrese de publicar la carpeta completa que contiene las miniaturas, para que las copias tambin sean transmitidas. Una vez que haya realizado su eleccin, haga clic sobre el botn Finalizar. La galera de imgenes ser creada e insertada dentro del documento. Si seleccion Usar tabla en el tercer paso del asistente, se crear una tabla comn con cdigo HTML que contiene las imgenes, una en cada celda. Se puede cambiar el formato y tamao de esta tabla como se hara con cualquier otra.
4.9: Creando y editando tablas
68
Captulo 4
4.5.5 Publicar un documento que contiene una galera de imgenes

La primera vez que se guarda un documento que contiene una galera de imgenes, el dilogo Copiar Archivos de Recursos aparecer, preguntando si se copian los archivos de imagen a la misma carpeta que contiene el documento tal como cuando se agregan imgenes a un documento de cualquier otra forma. Sin embargo, si la galera contiene miniaturas, el dilogo Copiar Archivos de Recursos slo preguntar si se copian las miniaturas y no las imgenes completas a las que las miniaturas se vinculan. Cuando se publica un documento que contiene una galera de miniaturas, debe asegurarse de transmitir tanto las imgenes completas como las miniaturas. Si no se publican las imgenes completas, los visitantes no podrn visitarlas cuando hagan clic sobre el vnculo que hay en las miniaturas dentro de la galera. La forma ms sencilla de asegurarse que tanto las imgenes completas como las miniaturas sern publicadas en forma adecuada es almacenarlas en el directorio indicado. En el ltimo paso del Asistente Imgenes, se recomienda que se seleccione la opcin Guardar copias o miniaturas en el directorio especificado y proporcionar el directorio que contiene el documento donde se encuentra la galera de imgenes o un subdirectorio del mismo. Una vez realizado esto, cuando se guarda el documento y aparece el dilogo Copiar Archivos de Recursos, seleccione la misma carpeta para copiar las miniaturas y luego haga clic sobre el botn Aceptar cuando se le pregunte si se requieren sobrescribir los archivos existentes.
69
4.6 Aplicando efectos a una imagen

Namo WebEditor 4 incluye un conjunto de herramientas de manipulacin de imgenes que pueden ser usadas para aplicar efectos de uso comn dentro de los documentos Web. Los efectos disponibles son: Ajuste de brillo y contraste Rotar y girar una imagen Varios filtros populares de imgenes Gradientes de color Sombras Texto Todos estos efectos pueden aplicarse a una imagen al seleccionarla y utilizar el comando Insertar > Imagen > Efectos de Imagen o haciendo clic con el botn derecho del ratn sobre la imagen y seleccionando Imagen > Efectos de Imagen en el men de atajo. Esto abrir el dilogo Efectos de Imagen. Una vez que se ha terminado de modificar la imagen y sea haga clic sobre el botn Aceptar para cerrar el dilogo Efectos de Imagen, se le preguntar si desea guardar la imagen modificada. Especifique un nuevo nombre o localizacin si no quiere sobrescribir la original.
4.6.1 Ajustando el brillo y el contraste
La solapa Brillo / contraste del dilogo Efectos de Imagen permite ajustar el brillo y contraste de cualquier imagen. Sencillamente deslice los controles o teclee un por ciento exacto dentro de los recuadros.
70
Captulo 4
4.6.2 Girando o volteando una imagen
Usando los botones de la solapa Rotar Imagen, se puede rotar la imagen en mltiplos de 90 grados y / o voltear la imagen, ya sea horizontal o verticalmente. Para deshacer cualquiera de estas acciones, vuelva a hacer clic sobre el botn una vez ms.
4.6.3 Aplicando un filtro a la imagen
Usando las opciones dentro de la solapa Efectos, es posible aplicar varios filtros de efectos especiales a la imagen. La mayora de estos filtros pueden ser combinados, pero Gofrar bordes y Gofrar (bajorrelieve) son mutuamente excluyentes, tal como lo son Escala de Grises y Blanco y negro.
Aplicando efectos a una imagen
71
4.6.4 Aplicando un gradiente de color
La solapa Gradiente permite aplicar un gradiente de color a una imagen. En el gradiente de color, la intensidad de un color especfico vara de cero a un mximo especificado a travs de la imagen dentro de un estilo, rango y direccin. Hay disponibles cuatro tipos de gradientes:
Lineal Radial
La intensidad del color vara linealmente en una direccin a lo largo de un eje nico desde un punto de inicio hasta su final. La intensidad del color vara de forma radial desde un punto de inicio en el permetro de la imagen. La localizacin del punto final determina el radio mximo del gradiente. La intensidad del color vara con la posicin angular de un crculo centrado en el punto de inicio. La localizacin del punto final determina el ngulo inicial del gradiente. La intensidad del color vara exponencialmente en ambas direcciones a lo largo de un eje nico desde el punto de inicio al del final.
Cnico
Cilndrico
Para aplicar un gradiente, haga lo siguiente:

1 Seleccione el estilo del gradiente usando los botones que se encuentran en la solapa
Estilo.
2 Seleccione un color dentro de la lista Color. 3 Especifique la intensidad mxima del gradiente de color y su direccin general utilizando
el control de Intensidad. (Arrastre el control a la izquierda para invertir la direccin del gradiente.)
4 Fije los puntos iniciales y finales del gradiente al hacer clic en la localizacin deseada
dentro de la vista preliminar de la imagen y arrastrando el ratn hasta el punto final. Al arrastrar, una lnea aparecer desde el punto de inicio hasta la posicin actual del apuntador del ratn, indicando la longitud y direccin del gradiente. (En el caso de un
72
Captulo 4
gradiente radial, un crculo aparecer al arrastrar el ratn indicando el radio del gradiente.) Para eliminar el efecto de gradiente, haga clic nuevamente sobre el botn correspondiente al gradiente utilizado en la solapa Etilo.
4.6.5 Agregando una sombra
La solapa Sombra permite agregar una sombra a la imagen, haciendo que parezca que flota sobre el fondo del documento. Para aplicar una sombra, haga lo siguiente:
1 Seleccione la posicin de la sombra utilizando los botones de Posicin. 2 Especifique el desplazamiento de la sombra distancia, en pxeles, desde el borde de la
imagen a la cual la sombra se extender en el recuadro Desplazamiento.

3 Especifique el radio de desenfoque el grado de color en la sombra, en pxeles en
el recuadro Radio de desenfoque. Para una sombra muy definida, fije el radio a 0.
4 Especifique el color utilizando la lista Color de la sombra. 5 Especifique el color de fondo del documento utilizando la lista Color de Fondo. Esto
determina el color de las esquinas de la imagen modificada donde no estn cubiertas por la sombra. Se debe fijar el color de fondo al mismo que el del documento. Para eliminar la sombra, haga clic de nuevo sobre el botn correspondiente a la posicin seleccionada de la sombra dentro de la solapa Posicin.
73
4.6.6 Agregando texto a la imagen
En la solapa Agregar Texto, es posible escribir una lnea de texto sobre la imagen. Para agregar texto, haga lo siguiente:
1 Teclee el texto que se colocar sobre la imagen en el recuadro Texto. 2 Especifique la tipografa, tamao y color del texto en la seccin General. 3 Seleccione el estilo del texto (negrilla, cursiva y /o subrayado) en la seccin Estilos. 4 Haga clic en el texto y arrstrelo a la posicin deseada dentro de la ventana de Vista
Previa, seleccione una localizacin predefinida utilizando la lista bajo la seccin Posicin o teclee las coordenadas (desplazamiento desde la esquina superior izquierda de la imagen) en el recuadro Coordenadas en la seccin Posicin. Para remover el texto, elimine el contenido del recuadro Texto.
4.6.7 Guardando la imagen modificada

Cuando se hace clic sobre el botn Aceptar para cerrar el dilogo Efectos de Imagen, el dilogo Nombre de archivo aparecer solicitndole un nombre y localizacin para guardar la imagen modificada. Si no quiere sobrescribir la imagen original, cambie el nombre o directorio en el recuadro Ruta. Necesitar seleccionar tambin un formato de archivo para la imagen modificada. Las elecciones disponibles son:
GIF JPG
Este formato de 256 colores es muy utilizado para aquellas imgenes que tienen relativamente pocos colores, tales como ilustraciones y dibujos de lnea. Este formato de 24 bits se usa para imgenes con muchos colores, tales como fotografas.
74
Captulo 4
PNG
Este formato se usa para una compresin sin prdida, como el formato GIF, pero puede incluir millones de colores. Sin embargo, no todos los navegadores incluyen el formato PNG.
75
4.7 Creando hipervnculos

Los Hipervnculos, tambin conocidos como "vnculos" o "enlaces", son quiz la mayor razn del suceso fenomenal y del crecimiento exponencial de la Web en los pasados aos. Un vnculo es un elemento de pgina (usualmente una palabra, botn o imagen) que "apunta a otra pgina Web. Esto es, la persona que est viendo un vnculo dentro de una pgina en el navegador web, hace clic en l y el navegador despliega otra pgina. La pgina a la cual un vnculo apunta puede estar dentro del mismo sitio web o en cualquier otro sitio del mundo. El poder de los vnculos radica en su habilidad para conectar millones de pginas web, a nivel mundial, una con la otra para que queden disponibles a millones de personas que utilizan Internet. Podemos decir, sin temor a equivocarnos, que los vnculos son el punto principal de la Web. Los vnculos tambin pueden apuntar a otros elementos dentro de las pginas web. Un enlace puede apuntar a una imagen, a un documento de oficina, a un archivo descargable, a un sitio FTP o a una direccin de correo electrnico, entre otras cosas. Lo que sucede una vez que se presiona en el vnculo depende de a dnde apunta el enlace. Por ejemplo, cuando se hace clic en un enlace de correo electrnico, el navegador abre el programa cliente de correo electrnico y le solicita que abra un nuevo mensaje donde la direccin de correo electrnica est contenida en el vnculo. Debe usar con toda libertad los vnculos dentro de sus documentos para hacer de su sitio Web una experiencia verdaderamente interactiva para sus visitantes.
Siguiendo un vnculo en la ventana de Edicin Si un vnculo en un documento abierto en la ventana de Edicin enlaza a un documento Web, un archivo de imagen o cualquier otro tipo de archivo que Namo WebEditor pueda abrir, puede cargar el archivo referido por el vnculo en la ventana de Edicin haciendo clic en l mientras presiona la tecla <Ctrl>. Si Namo WebEditor puede abrir el archivo, lo har. Si el vnculo apunta a un archivo en la Web y se encuentra conectado a Internet, Namo WebEditor se conectar al sitio Web que contiene el archivo y lo descargar.
4.7.1 Vnculos absolutos vs. relativos

Existen dos tipos bsicos de vnculos usados en los documentos: absolutos y relativos. Estos trminos se refieren a cmo el vnculo enlaza a otro documento, no al tipo de documento al cual hace referencia. Un vnculo absoluto hace referencia a un documento utilizando el Localizador Uniforme de Recursos (Uniform Resource Locator o URL) y constituye la forma estndar de referirse a un documento dentro de Internet. Un ejemplo de un vnculo absoluto sera http://www.namo.com/index.html. Una direccin URL, tambin conocida como direccin Internet, es similar a una tarjeta de visita que identifica de forma unvoca un documento
76
Captulo 4
particular dentro de la red. Existe una relacin de uno a uno entre la direccin URL y el documento: cada documento en Internet tiene su propia direccin URL y cada direccin URL se refiere a un slo documento dentro de Internet. (Aunque las direcciones parecen referirse a un sitio web, no a un documento tal como http://www.namo.com normalmente se refieren a un documento predeterminado dentro del sitio, usualmente index.html o index.htm.) Un vnculo relativo, en contrapartida, se refiere a un documento en una especie de taquigrafa, basado en la localizacin con relacin al documento que contiene el vnculo. Un ejemplo de un vnculo relativo sera productos/indice.html. Este vnculo informa al navegador Web que abra un documento llamado indice.html que se localiza en la carpeta productos dentro de la carpeta que contiene el documento activo. Los vnculos relativos solamente pueden referirse a documentos que se encuentran en el mismo sitio web, puesto que no proveen el camino completo para encontrarlo en otro dominio. Para entender la diferencia entre un vnculo absoluto y relativo, considere la analoga del correo. Se enva una carta a alguna persona a travs del sistema postal. Se necesita especificar el nombre y direccin completa, tal como Betty Jones, Namo Interactive Inc., Simone Bldg, 144-1, Samsung-dong, Kangnam-gu, Seoul, 135-090, Korea. Esto es el equivalente a una direccin URL (un vnculo absoluto.) Pero si se enva el mismo correo a una persona de la compaa a travs del correo interno, puede requerirse solamente el nombre de la persona (Betty Jones) o quiz su nombre y departamento (Publicidad/Betty Jones.) Esto es el equivalente a un vnculo relativo. Cuando se crea un vnculo a un documento que se encuentra en un sitio web distinto al nuestro, se debe utilizar un vnculo absoluto. Cuando se crea un vnculo a un documento del propio sitio web, es posible usar tanto un vnculo absoluto como uno relativo. Sin embargo, los vnculos relativos son preferidos, puesto que ofrecen un mayor grado de flexibilidad sobre los absolutos. Se puede cambiar la localizacin de un conjunto de documentos sin romper los vnculos relativos especificados. Supongamos, por ejemplo, que tenemos un sitio web en la direccin www.namo.com, un directorio al nivel superior del sitio llamado productos y un documento en esa carpeta con el nombre webeditor.html. Pensemos tambin que existe otro documento en el mismo directorio que contiene dos vnculos al documento webeditor.html: uno absoluto y uno relativo. El vnculo absoluto deber ser http://www.namo.com/products/webeditor.html mientras que el relativo podra ser sencillamente webeditor.html. Qu pasara si cambiamos el nombre de la carpeta de productos a programas? El vnculo absoluto quedara roto, puesto que incluye una referencia a una carpeta que ya no existe. El vnculo relativo, a diferencia, seguira trabajando. Por esta razn, siempre se deben utilizar vnculos relativos cuando se hacen enlaces a documentos del propio sitio. Afortunadamente no es necesario saber cmo se crea un vnculo relativo. Cuando se realiza un enlace a un documento dentro del mismo proyecto o en cualquier parte del disco duro, Namo WebEditor realiza esto por usted. Todo lo que tiene que hacer ahora, es asegurarse de mantener la localizacin relativa de los documentos cuando se publican al sitio Web.
Creando hipervnculos
77
4.7.2 Ejemplos de vnculos

A continuacin mostramos ejemplos de vnculos absolutos y relativos. Vnculos Absolutos
Tipo de Vnculo Ejemplos http://www.namo.com/products/index.html Un tpico vnculo de Web. Web http://www.namo.com Enlaza el documento predeterminado al nivel superior del sitio Web. http://www.namo.com/download/webeditor/install.exe Enlaza a un archivo de programa que ser descargado por el navegador. FTP E-mail ftp://ftp.namo.com/webeditor/install.exe Enlaza a un archivo de programa que ser descargado por FTP. mailto:info@namo.com Abre un nuevo correo dirigido a esta direccin.
Vnculos Relativos
Vnculo index.html ../index.html ../../index.html productos/index.html Localizacin del documento al que se hace referencia La misma carpeta que la del documento que contiene el vnculo. Un directorio un nivel arriba del que contiene el documento con el vnculo. Un directorio dos niveles arriba del que contiene el documento con el vnculo. Una subcarpeta de la carpeta donde est el documento que contiene el vnculo. Una subcarpeta de otra que depende de la carpeta donde est el documento que contiene el vnculo. El nivel superior del sitio Web.
productos/webeditor/index.html /index.html
4.7.3 Creando un vnculo

Para crear un vnculo, haga lo siguiente:
1 Seleccione la palabra(s) o imagen que quiere usar como hipervnculo.
78
Captulo 4
2 Use el comando Insertar > Vnculo o presione la tecla <F9>. 3 En el dilogo Crear Vnculo, proporcione la direccin URL (vnculo absoluto) en el
recuadro URL o haga clic sobre el botn Examinar. Seleccione un documento o archivo en el dilogo Abrir. Si desea crear un vnculo a un documento que se encuentra abierto en la ventana de Edicin, puede presionar sobre el botn Archivos Abiertos y seleccionarlo en el dilogo Lista de Documentos Abiertos. Si el vnculo a crear es hacia un documento del proyecto activo (si existe), puede hacer clic sobre el botn Proyecto y seleccionar el documento o archivo en el dilogo Seleccionar Archivo del Proyecto. La ruta de acceso relativa del documento seleccionado rellenar de forma automtica el recuadro URL.
Si cre un vnculo de texto, el texto aparecer subrayado en azul dentro de la ventana de Edicin. Si cre un vnculo sobre una imagen, la apariencia de la imagen no cambiar, pero el vnculo al cual hace referencia aparecer a la izquierda de la barra de estado cuando se mueve el apuntador del ratn sobre la imagen. Para verificar el vnculo que acaba de crear, cambie a la solapa de vista previa e intente hacer clic sobre el vnculo. El documento al cual hace referencia deber cargarse en la ventana.
Cuando se crea un vnculo en un documento nuevo que an no se ha guardado y el vnculo apunta a un documento o archivo en su disco duro, la forma del vnculo ser una referencia a un archivo y no un vnculo relativo. Un ejemplo de referencia de archivo es C:\documentos\web\index.html. Namo WebEditor debe utilizar una referencia de archivo de forma temporal puesto que no se ha guardado el documento que contiene el vnculo y por lo tanto, Namo WebEditor no puede determinar la ruta de acceso relativa hacia el vnculo. Una vez que se guarda el documento, Namo WebEditor convertir automticamente la referencia de archivo a un vnculo relativo.
4.7.4 Editando o quitando un vnculo

Para editar un vnculo de texto, coloque el punto de insercin en cualquier punto del mismo y presione la tecla <F9> o haga doble clic sobre el vnculo. En el dilogo Propiedades del Vnculo, edite la direccin URL o la ruta de acceso en el recuadro URL. Haga clic sobre el botn Examinar para seleccionar un documento distinto. Para editar un vnculo que se encuentre en una imagen, seleccinela y presione la tecla <F9>. En el dilogo Propiedades del Vnculo, edite la direccin URL o la ruta de acceso dentro del recuadro URL. Haga clic sobre el botn Examinar para seleccionar un documento distinto. Para remover un vnculo de texto, coloque el punto de insercin sobre el mismo y presione las teclas <Mays + F9>. Para eliminar el vnculo de una imagen, seleccione la imagen y presione las teclas <Mays + F9>.
Creando hipervnculos 79
4.7.5 Creando vnculos mltiples en una imagen

Adems de poder crear un vnculo nico dentro de una imagen como se describe en los prrafos anteriores, es tambin posible crear vnculos mltiples dentro de la misma imagen utilizando una tcnica llamada mapa de imagen. En un mapa de imagen, se pueden definir varias porciones de la misma para que acten independientemente como un vnculo. Cada rea que acta como vnculo es llamada zona activa. Las zonas activas pueden ser rectangulares, circulares o poligonales. Es posible, por ejemplo, en la imagen inferior, definir una zona activa poligonal sobre la casa para que acte como vnculo hacia otro documento; una circular en el hombre que corre como vnculo a un segundo documento y finalmente una rectangular en las palabras situadas en la parte baja de la imagen para actuar como vnculo hacia un tercer documento.
Zona activa poligonal
Zona activa circular
Zona activa rectangular
Para crear un mapa de imagen, se utilizan las herramientas disponibles dentro de la barra de herramientas de imagen para dibujar las zonas activas en la imagen seleccionada. Para mostrar la barra de herramientas de imagen, utilice el comando Ver > Barra de herramientas > Imagen.
Herramientas de zona activa
Para dibujar una zona activa rectangular, haga lo siguiente:

1 Seleccione la imagen en la cual se crear la zona activa. 2 Seleccione la herramienta de dibujo de zona activa rectangular. El apuntador del ratn
cambiar a una cruz.

3 Haga clic en el punto de la imagen donde se encuentre la esquina superior izquierda de la
zona activa y, mientras mantiene el botn del ratn presionado, arrastre el apuntador del ratn al punto de la esquina inferior derecha. Al arrastrar, un rectngulo punteado
80
Captulo 4
aparecer mostrndole el tamao y posicin aproximado de la zona activa. Una vez que se suelta el botn del ratn, el dilogo Crear Vnculo aparecer.
4 En el dilogo Crear Vnculo, proporcione la direccin URL o ruta de acceso relativa al
documento referido para la zona activa que acaba de crear. Para dibujar una zona activa circular, haga lo siguiente:
1 Seleccione la imagen en la cual quiere crear la zona activa. 2 Elija la herramienta de zona activa circular. En puntero del ratn cambiar a una cruz. 3 Haga clic en cualquier punto de la imagen y, mientras mantiene el botn del ratn
presionado, arrastre el apuntador del ratn a otro punto cualquiera. Al arrastrar, aparecer un crculo punteado para indicarle el tamao y posicin de la zona activa. Una vez que se suelte el botn del ratn, el dilogo Crear Vnculo aparecer.
documento referido para la zona activa que acaba de crear. Para dibujar una zona activa poligonal, haga lo siguiente:
1 Seleccione la imagen en la cual quiere crear la zona activa. 2 Elija la herramienta de zona activa poligonal. En puntero del ratn cambiar a una cruz. 3 Haga clic en cualquier punto de la periferia en la regin donde quiere crear la zona activa
poligonal y suelte el botn del ratn. A continuacin, haga clic en otro punto, luego en otro, etc. enmarcando toda la zona poligonal. Cada vez que se realiza un clic en un punto, una lnea punteada se dibujar del punto previo al actual. Cuando se ha rodeado toda la periferia de la zona activa deseada, haga clic nuevamente sobre el punto inicial. Una vez que se suelta el botn del ratn, el dilogo Crear Vnculo aparecer.
documento referido para la zona activa que acaba de crear. Para mover una zona activa, haga clic sobre el botn Seleccionar o Editar Zona Activa (el botn que asemeja un apuntador estndar de ratn) en la barra de herramientas de Imagen. Coloque el apuntador del ratn sobre la zona activa que desea mover. Mientras el apuntador tenga la forma de una mano, haga clic y arrstrela a su nueva posicin. Para cambiar el tamao o forma de una zona activa rectangular, haga clic primero dentro de ella para seleccionarla. Aparecern manijas en las esquinas de la zona activa. Haga clic sobre cualquiera de ellas y arrstrela para cambiar el tamao o la forma de la zona activa. Para cambiar el tamao de una zona activa circular, primero haga clic dentro de ella para seleccionarla. Aparecern manijas en las esquinas formando una caja envolvente. Haga clic y arrastre cualquiera de ellas para cambiar el tamao de la zona activa. Para modificar la forma de una zona activa poligonal, haga clic primero dentro de ella para seleccionarla. Aparecern manijas en los vrtices del polgono. Haga clic y arrastre cualquiera de ellas para mover un vrtice.
Creando hipervnculos 81
Para editar un vnculo dentro de una zona activa, haga doble clic sobre la zona activa. Edite la direccin URL o la ruta de acceso dentro del dilogo Propiedades del Vnculo. Para eliminar una zona activa, seleccinela y presione la tecla <Borrar atrs> o <Supr>.
4.7.6 Creando y usando marcadores

Un marcador consiste en una referencia invisible que puede ser colocada en cualquier parte de un documento web para poder hacer referencia a l por medio de un vnculo. Cuando un visitante del sitio hace clic sobre un vnculo que contiene una referencia a un marcador, el navegador no solamente carga el documento requerido, sino que muestra la porcin del documento donde se encuentra el mismo. Los marcadores proveen una forma conveniente de permitir que el visitante salte de un punto a otro en un documento muy largo. Para crear un marcador, haga lo siguiente:
1 Seleccione una o ms palabras o coloque el punto de insercin en la posicin deseada. 2 Use el comando Insertar > Marcador o presione las teclas <Ctrl + G>. 3 En el dilogo Marcadores, escriba un nombre en el recuadro Nombre. (Si ha
seleccionado una palabra, sta aparecer como el nombre predeterminado.)

4 Haga clic en el botn Agregar y luego sobre Cerrar.
Si seleccion algn texto antes de crear el marcador, ste aparecer con un subrayado punteado azul. De otra forma, un pequeo smbolo amarillo de marcador aparecer en el punto de insercin. stos solamente son visibles en la ventana de edicin, no dentro de un navegador o en la ventana de Vista Previa. Para referirse a un marcador dentro de un vnculo, use el recuadro Marcador en el dilogo
Crear Vnculo o Propiedades del Vnculo.
82
Captulo 4
Si la referencia del vnculo es un documento en el disco duro, cualquier marcador que est definido dentro de l aparecer dentro de la lista Marcadores. Si el documento no se encuentra en el disco duro, teclee el nombre del marcador en el recuadro. El marcador se agregar a la direccin URL precedida de un signo de nmero (#). Puede crear un vnculo hacia un marcador dentro del mismo documento dejando en blanco el recuadro URL y seleccionando un marcador dentro de la lista Marcadores. El marcador seleccionado aparecer en el recuadro URL precedido de un signo de nmero ( #). Cuando un vnculo de este tipo es utilizado dentro de un navegador, el navegado sencillamente desplaza el documento a la localizacin del marcador.
Creando hipervnculos
83
4.8 Creando botones y titulares

Namo WebEditor 4 incluye una herramienta de diseo de botones y titulares llamada Asistente de Botones Inteligentes. Se puede usar esta herramienta para crear botones coloridos basados en vectores y titulares que pueden ser cambiados de tamao y editados sin que por eso pierdan su resolucin original. El Asistente de Botones Inteligentes consta de dos pasos. En el primero, se selecciona una gran variedad de formas de botones y titulares genricos ya definidos. En el segundo paso, se puede personalizar la forma y agregar una etiqueta de textos opcional. Una vez que se ha creado el botn, se puede colocar un vnculo dentro de l, tal como se hara con cualquier otra imagen.
4.8.1 Seleccionando una forma para el botn/titular

Para usar el Asistente de Botones Inteligentes, primero coloque el punto de insercin en la posicin del documento donde desea el botn o titular y luego use el comando Insertar > Componentes del Tema > Botones Inteligentes o haga clic en el botn Insertar Botn Inteligente en la barra de herramientas estndar. Esto abrir el Asistente de Botones Inteligentes.
Seleccione una forma genrica para el botn o titular en el recuadro de la derecha. Aunque algunas formas estn etiquetadas como titular y otras como botn, se pueden usar indistintamente tanto para botn como para titular. Una vez seleccionada la forma, haga clic sobre el botn Siguiente.
84
Captulo 4
4.8.2 Seleccionando un componente para editar

Cada forma de un titular o botn tiene por lo menos un componente de imagen y uno de texto. Cada componente puede ser editado de manera independiente, como tambin es posible cambiar el tamao del botn o titular como un todo.
Componentes de Imagen
Componente de Texto
Para cambiar el tamao del botn o titular, seleccione Todos dentro de la lista de seleccin de componentes en la parte inferior derecha del dilogo. Un rectngulo punteado con manijas de tamao en sus esquinas y lados aparecer alrededor del botn o titular en el rea de vista previa. Haga clic en cualquiera de las manijas y arrstrela. (Tambin se puede cambiar el tamao dentro de la ventana de Edicin una vez que se ha cerrado el Asistente de Botones Inteligentes.) Para editar un componente, primero seleccinelo haciendo clic sobre l en el rea de vista previa o seleccionando cualquiera de sus elementos dentro de la lista de componentes. Un rectngulo punteado aparecer alrededor del componente seleccionado. Cada componente de imagen tiene dos conjuntos de propiedades: atributos de color de relleno y propiedades de la sombra. Cada componente de texto tiene, adems de los dos mencionados anteriormente, un conjunto de propiedades de texto. Para editar un conjunto de propiedades de un componente seleccionado, cambie a la solapa correspondiente dentro del rea de edicin debajo de la vista previa.
Creando botones y titulares
85
Para deshacer una accin del Asistente de Botones Inteligentes, haga clic sobre el botn Deshacer justo debajo del rea de vista previa (arriba de la lista de seleccin de componentes.) Haga clic en el botn Rehacer para deshacer la accin anterior. Use el icono de la lupa para un acercamiento (zoom) en el rea de vista previa.
4.8.3 Editando los atributos de relleno de color
Los atributos del color de relleno incluyen Color inicial, Color final y Tipo de relleno. Los tipos de relleno disponibles son Slido, Lineal, Circular e Hiperblico. Si el tipo de relleno es Slido, solamente se utilizar el color de inicio. Los otros tipos de relleno corresponden a gradientes, en los cuales el componente de color cambiar uniformemente desde uno inicial hasta uno final en un patrn que se puede seleccionar. Si ha seleccionado slido como tipo de relleno, elija el color haciendo clic en la vista previa de color a un lado de Color Inicial. Esto abrir el dilogo Seleccin de Color. Si selecciona uno de los atributos de relleno de gradiente, se debe especificar tanto un color inicial como uno final junto con un punto inicial y uno final. Se hace esto cambiando la longitud, ngulo y posicin de la lnea dentro del rea de vista previa, como se muestra en el siguiente ejemplo.
Punto inicial
Punto final
El pequeo cuadro en la parte izquierda de la lnea representa el punto inicial del gradiente, mientras que el de la derecha representa el punto final. Para ajustarlos haga clic sobre cualquiera de ellos y arrstrelos. Si el componente seleccionado usa un relleno slido, ver solamente un pequeo cuadro pues el punto inicial es igual al final. Arrastre el cuadro a cualquier otra localizacin y se mostrar el que se encuentra en la parte inferior as como la lnea que los une. Mostramos a continuacin cada uno de los tipos de gradientes:
86
Captulo 4
Lineal
Circular
Hiperblico
Tanto en los gradientes circulares como hiperblicos, el ngulo del punto final con respecto al punto inicial no tiene ninguna importancia. La localizacin del punto de inicio determina el centro del gradiente y la distancia entre ste y el punto final determina el radio del gradiente.
4.8.4 Editando las propiedades de las sombras
Cualquier componente de un botn o titular puede tener una sombra. Use la solapa Propiedades de la Sombra para controlar sus ajustes. Una sombra tiene 4 propiedades: color, desplazamiento horizontal, desplazamiento vertical y difuminado. Para especificar el color, haga clic sobre la vista previa del color a un lado de Color de la sombra; esto abrir el dilogo Seleccin de Color. Los dos recuadros a un lado del control de Desplazamiento determinan qu tanto se extiende la sombra bajo el componente en pxeles, tanto horizontal como verticalmente. El control de Difuminado determina el grado de enfoque de la sombra.
4.8.5 Editando las propiedades del texto
La solapa Propiedades del Texto se encuentra disponible solamente cuando un componente de texto ha sido seleccionado. Existen cinco propiedades del texto: el texto mismo, la
87
tipografa, el tamao y si el texto se muestra en forma cursiva o en negrillas. Para hacer que el componente del texto no se muestre, borre el contenido del recuadro Texto.
4.8.6 Editando las propiedades de los fondos
La solapa Propiedades del fondo se aplica al botn o titular como un todo. En esta solapa se puede controlar el color del fondo de un botn o titular y seleccionar si ste ser transparente. El color de fondo es el que se muestra entre el rea visible de un botn o titular y los bordes de la caja que lo envuelve. De manera predeterminada, el color de fondo siempre es blanco, lo que funciona en todos los documentos que tienen un fondo blanco. Sin embargo, si el fondo del documento es de otro color que no sea blanco, o si tiene una imagen como fondo, es buena idea seleccionar Hacer color de fondo transparente para hacer que el botn o titular se fusione limpiamente con el fondo del documento.
4.10: Modificando las propiedades del documento
Una vez que ha terminado de personalizar el botn o titular, haga clic sobre el botn Finalizar para cerrar el Asistente de Botones Inteligentes e insertar el botn o titular en su documento.
4.8.7 Modificando un botn o titular en la ventana de Edicin

Se puede interactuar con el botn o titular creado por el Asistente de Botones Inteligentes dentro de la ventana de edicin, de la misma manera que con cualquier otra imagen. Se puede cambiar el tamao utilizando sus manijas, crear un vnculo o un mapa de imagen, copiar, borrar, etc. Sin embargo, cuando se cambia de tamao de un botn inteligente o titular, ste no pierde la resolucin como lo hara una imagen ordinaria. Para volver a editar las caractersticas de un botn o titular, haga doble clic sobre l para abrir el Asistente de Botones Inteligentes y modificarlo. Si lo desea, puede convertir un botn inteligente o titular en una imagen ordinaria siguiendo los pasos a continuacin numerados:
1 Haga clic con el botn derecho del ratn sobre el titular o botn y seleccione Imagen >
Convertir a Imagen Estndar en el men de atajo.
88
Captulo 4
2 Haga clic en el botn S cuando se le pregunte si desea convertir el botn a una imagen
estndar.
3 En el dilogo Guardar como, seleccione una carpeta en la cual guardar el archivo GIF
que Namo WebEditor crear, proporcione un nombre de archivo para la imagen (o acepte el nombre predeterminado) y haga clic sobre el botn Guardar. Tenga en cuenta que al convertir un botn inteligente o titular en una imagen estndar no podr ser editado.
89
4.9 Creando y editando tablas

Las tablas en un documento Web son similares a las creadas en un procesador de palabras y Namo WebEditor le permite crearlas, as como editarlas, en una forma similar. Una tabla es en esencia una caja, usualmente dividida en varias celdas o particiones. Cada celda puede contener texto, imgenes o cualquier otro elemento de pgina que un documento pueda contener. Mostramos a continuacin un ejemplo sencillo de una tabla tal como se ve en la ventana de Edicin.
La tabla de este ejemplo tiene dos columnas y cuatro renglones. Sus bordes son visibles y el fondo de cada celda es del mismo color que el fondo del documento.
4.9.1 Creando una tabla

Hay tres formas de crear una tabla en Namo WebEditor. La ms sencilla es usar el botn Crear Tabla en la barra de herramientas estndar.
Haga clic en el botn Crear Tabla y mueva el apuntador del ratn sobre la tabla miniatura que aparece bajo el botn. Al mover el ratn hacia abajo y a la derecha, las celdas de la tabla pequea se vuelven azules. Si se contina moviendo el ratn ms all del rea inferior o derecha, la tabla se expandir para mostrar ms celdas. Haga clic de nuevo cuando el tamao y forma de la zona azul corresponda a la tabla que quiere crear. Una tabla con los valores predeterminados se colocar en el punto de insercin.
90
Captulo 4
Se puede tambin crear una tabla al dibujarla usando la herramienta barra de herramientas de tabla.
Dibujar Tabla en la
Para dibujar una tabla, haga lo siguiente:

1 Seleccione la herramienta Dibujar Tabla. El apuntador del ratn cambiar a la forma de
un lpiz.
2 Usando el lpiz, dibuje un rectngulo en el sitio aproximado donde quiere la tabla. (Haga
clic en cualquier punto de la ventana de edicin, mantenga presionado el botn del ratn y arrstrelo hacia abajo y a la derecha soltndolo posteriormente.) Esto genera una tabla de slo una celda.
3 Usando de nuevo el lpiz, dibuje los bordes de los renglones y columnas dentro de la
tabla para crearlos.

4 Una vez que termine de dibujar la tabla, haga clic sobre el botn
Salir del modo de dibujo de Tablas en la barra de herramientas de tabla o presione la tecla <Esc>. El
apuntador del ratn cambiar de nuevo a su forma usual. Finalmente, tambin se puede crear una tabla utilizando el comando Tabla > Nueva Tabla. Para hacer esto, siga las siguientes instrucciones:
1 Seleccione Nueva Tabla del men Tabla. 2 En el dilogo Propiedades de la Tabla, proporcione el nmero de renglones y columnas
en el recuadro Tamao.
3 Edite las otras propiedades de la tabla segn sus necesidades. (Las propiedades de las
tablas se describen dentro de esta misma seccin ms adelante.)

4 Haga clic sobre el botn Aceptar. La nueva tabla ser creada en el punto de insercin.
Creando una tabla hija Es posible crear una tabla que quepa completamente dentro de la celda de otra. A tales tablas se les llama tablas hijas. Para crear una tabla hija, coloque el punto de insercin dentro de una celda de una tabla ya existente y use el botn Crear Tabla en la barra de herramientas estndar o use el comando Tabla > Nueva Tabla.
4.9.2 Seleccionando partes de una tabla

Para seleccionar una sola celda, haga clic dentro de ella mientras presione la tecla <Ctrl>.
Creando y editando tablas
91
Para seleccionar varias celdas adjuntas o un bloque continuo, haga clic dentro de la primera celda, mantenga presionado el botn del ratn y arrstrelo hacia arriba, abajo o en diagonal. Cuando la ltima de las celdas deseadas se encuentre realzada, suelte el botn del ratn. Alternativamente, haga clic una sola vez dentro de la primera celda y luego haga clic en la ltima mientras mantiene presionada la tecla <Mays>. Para seleccionar varias celdas que no se encuentren una al lado de la otra o en un bloque, haga clic dentro de cada una de ellas mientras mantiene presionada la tecla de <Ctrl>. Para quitar la seleccin a una de las ya seleccionadas, haga clic dentro de ella mientras mantiene presionada la tecla <Ctrl>. Para seleccionar un rengln completo, coloque el apuntador del ratn en el borde izquierdo del rengln. El apuntador debe tomar la forma de una pequea flecha que apunta hacia la derecha, cuando esto suceda, haga clic una vez. Para seleccionar una columna entera, coloque el apuntador del ratn en el borde superior de la columna. El apuntador debe tomar la forma de una pequea flecha que apunta hacia abajo, cuando esto suceda, haga clic una vez. Puede, tambin, hacer clic y arrastrar para seleccionar renglones o columnas mltiples adyacentes. Para seleccionar renglones y columnas que no se encuentran adyacentes, seleccione el primer rengln o columna y luego seleccione cualquier otro mientras mantiene presionada la tecla <Ctrl>. La forma ms rpida para seleccionar una tabla completa es hacer clic con el botn derecho del ratn en cualquier parte dentro de ella y seleccionar el comando Seleccionar Tabla en el men de atajo.
4.9.3 Agregando y eliminando renglones y columnas

Para agregar uno o ms renglones o columnas a una tabla, use el comando Tabla > Insertar Renglones o Columnas.
En el dilogo Insertar Renglones o Columnas, se debe especificar si se insertan columnas o renglones, cuntos se insertan y si se insertan antes o despus del rengln o columna que contiene el punto de insercin.
92
Captulo 4
Para borrar uno o ms renglones o columnas, coloque el punto de insercin dentro del primer rengln o columna a borrar y utilice el comando Tabla > Borrar Renglones o Columnas. En el dilogo Borrar Renglones o Columnas, especifique si se quiere borrar renglones o columnas y cuntas se van a borrar. Alternativamente, seleccione los renglones o columnas a borrar y presione la tecla <Supr>. Para borrar nicamente el contenido de las celdas seleccionadas, use el comando Tabla >
Borrar Contenido.
4.9.4 Copiando y pegando partes de una tabla

Se pueden cortar o copiar renglones y columnas completas y pegarlas antes o despus de otro rengln o columna de la misma tabla o de una distinta. Es tambin posible copiar o cortar renglones y columnas completas y pegarlas dentro de una celda como una tabla hija. Las celdas individuales o bloques de celdas que no formen un rengln o columna completa, pueden ser copiadas, pero no cortadas, y pegadas dentro de otra celda. Los grupos de celdas que no formen un bloque rectangular no pueden ser ni cortadas ni copiadas. Para cortar o copiar uno o ms renglones o columnas y pegarlos antes o despus de cualquier otra, haga lo siguiente:
1 Seleccione los renglones o columnas. 2 Presione las teclas <Ctrl + X> para cortarlas o <Ctrl + C> para copiarlas. 3 Coloque el punto de insercin en otro rengln o columna. 4 Presione las teclas <Ctrl + V>. 5 En el dilogo Pegar Tabla, especifique si quiere insertar renglones o columnas antes o
despus del rengln o columna activa y haga clic en el botn Aceptar. Para cortar o copiar un bloque de celdas y pegarlas dentro de otra celda como una tabla hija, haga lo siguiente:
1 Seleccione el bloque de celdas. 2 Presione las teclas <Ctrl + X> para cortarlas o <Ctrl + C> para copiarlas. (Si el bloque no
incluye por lo menos un rengln o columna completa, solamente puede ser copiado y no cortado.)
3 Coloque el punto de insercin en otra celda. 4 Presione las teclas <Ctrl + V>. 5 En el dilogo Pegar Tabla, seleccione Insertar como tabla hija y haga clic en el botn
Aceptar.
Es posible cortar o copiar un bloque de celdas y pegar solamente su contenido en otro bloque si stos son del mismo tamao, reemplazando el contenido anterior. Para hacer esto, siga los siguientes pasos:
Creando y editando tablas 93
1 Seleccione el bloque de celdas. 2 Presione las teclas <Ctrl + X> para cortarlo o <Ctrl + C> para copiarlo. (Si el bloque no
incluye por lo menos un rengln o columna completa, solamente puede ser copiado, no cortado.)
3 Coloque el punto de insercin en la celda superior izquierda del bloque al cual se pegar
el contenido.
4 Presione las teclas <Ctrl + V>. 5 En el dilogo Pegar Tabla, seleccione Pegar slo contenido y haga clic sobre el botn
Aceptar.
En lugar de usar cortar y pegar, tambin se puede usar arrastrar y soltar para mover un bloque de celdas. Seleccione el bloque y arrstrelo a la nueva posicin utilizando el ratn. Una vez que se suelta el botn del ratn, el dilogo Pegar Tabla aparecer.
4.9.5 Cambiando el tamao de renglones y columnas

La forma ms sencilla de cambiar el tamao de un rengln o columna de una tabla es hacer clic sobre su borde derecho o inferior y arrastrarlo utilizando el ratn. Cuando se coloca el apuntador del ratn sobre un borde, ste cambia a una barra doble con pequeas flechas: o . Mientras el apuntador ratn tenga esta forma, se puede arrastrar el borde. Al arrastrar, una lnea gris aparece mostrando dnde quedar el nuevo borde del rengln o columna cuando suelte el botn del ratn. Cuando se cambia el tamao de una columna de esta manera, el ancho total de la tabla no cambia. En lugar de eso, la columna a la derecha de la seleccionada, se har ms ancha o ms delgada para compensar. Si quiere que la columna adyacente mantenga su tamao, mantenga presionada la tecla <Ctrl> al arrastrar el borde de la columna. Esto har que el ancho de la tabla sea mayor o menor para acomodar la columna que cambia de tamao. Cuando se cambia el tamao de un rengln utilizando el ratn, este comportamiento se invierte. Normalmente, el cambiar de tamao un rengln, no causa que el rengln inferior cambie de tamao, en lugar de esto, el alto de la tabla se har mayor o menor. Sin embargo, si mantiene presionada la tecla <Ctrl>, el rengln inferior cambiar su tamao mientras la tabla mantiene su altura. Para cambiar el tamao de dos o ms columnas o renglones adyacentes al mismo tamao y al mismo tiempo, seleccione los renglones y columnas. Posteriormente arrastre el borde inferior o derecho de cualquiera de ellos. Para cambiar el tamao de una tabla, mientras se mantienen los tamaos relativos de todos los renglones o columnas, haga clic sobre el borde inferior o derecho de la tabla y arrstrelo mientras mantiene presionada la tecla <Ctrl>.
94
Captulo 4
Otra forma de cambiar el tamao de un rengln o columna es seleccionarlo y utilizar los controles de tamao que se encuentran dentro del dilogo Propiedades de la Celda, descrito ms adelante en esta seccin.
Si se habilita la opcin ajustar a rejilla (usando el comando Ver > Rejilla > Encajar), los bordes de los renglones o columnas encajan en las rejillas y divisiones invisibles al arrastrar los bordes. Los bordes tambin encajan a las guas si la opcin Ajustar a las Guas est habilitada (use el comando Ver > Guas > Encajar).
4.9.6 Dividiendo y combinando celdas

No se requiere que una tabla sea un arreglo perfectamente regular de celdas. Al dividir y yo combinar distintas celdas, es posible crear una tabla que obedezca a cualquier patrn deseado, tal como se muestra en el ejemplo inferior.
La forma ms sencilla de dividir y combinar celdas es utilizando las herramientas Dibujar

Tabla y Borrador en la barra de herramientas de tabla.
Para dividir una o ms celdas, seleccione la herramienta de dibujo y trace un nuevo borde dentro de las celdas a dividir. Al dibujar, una lnea punteada seguir sus movimientos, indicando dnde ser colocado el nuevo borde una vez que se suelte el botn del ratn. Para combinar dos o ms celdas, seleccione la herramienta borrador y utilcela para eliminar los bordes entre las celdas. Haga clic a un lado de un borde, mantenga presionado el botn del ratn y arrstrelo a travs del borde. Al arrastrar, el borde cambiar a un azul claro indicando que ser eliminado cuando se suelte el botn del ratn. La otra forma de dividir y combinar celdas es utilizando los comandos Dividir Celdas y Combinar Celdas del men Tabla. Para dividir una o ms celdas, haga lo siguiente:
1 Seleccione la celda(s) a dividir.
2 Use el comando Tabla > Dividir Celdas. 3 En el dilogo Dividir Celdas, especifique si quiere dividir las celdas en renglones o
columnas y cantos renglones o columnas tendr cada una de las celdas. Haga clic sobre el botn Aceptar. Para combinar dos o ms celdas, seleccinelas y use el comando Tabla > Combinar Celdas. No es posible combinar un grupo de celdas que no formen un bloque rectangular.
4.9.7 Editando las propiedades de una tabla

Cada tabla tiene un nmero de propiedades que pueden ser modificadas utilizando el dilogo Propiedades de la tabla. Para abrir este dilogo, utilice el comando Tabla > Propiedades de la tabla o haga clic con el botn derecho del ratn en cualquier parte de la tabla y seleccione el comando Propiedades de la tabla dentro del men de atajo.
Las propiedades de una tabla estn divididas en cuatro grupos: Tamao, Distribucin, Bordes y Fondo. Las propiedades en cada uno de los grupos se explican a continuacin.
Tamao Renglones/Columnas El tamao de la tabla en renglones y columnas. Estos recuadros solamente se encuentran activos cuando se crea una nueva tabla utilizando el comando Tabla > Nueva Tabla. Ancho/Alto
El ancho y alto de la tabla en pxeles o como un porcentaje del rea de la ventana del navegador. Si no se especifica, o si la opcin a un lado de cada elemento no se marca, el ancho y /o alto de la tabla se ajusta de forma automtica para desplegar la mxima rea de sta sin exceder el ancho de la ventana del navegador.
Distribucin
96
Captulo 4
Alineacin
La posicin de la tabla con relacin a la ventana del navegador. Si se selecciona Izquierda (Flotando) o Derecha (Flotando), el texto fuera de la tabla regresar a la izquierda o derecha de la misma. (Predeterminada) usualmente es interpretada por los navegadores como una alineacin izquierda, aunque esto puede variar dependiendo del navegador.
Ttulo de la Tabla La localizacin del ttulo de la tabla con relacin a la misma. Solamente est disponible si la tabla tiene un ttulo (vea Agregando un ttulo a una tabla en esta misma seccin.) Relleno de la Celda La cantidad de espacio (en pxeles) entre el contenido de una celda
y los bordes de la misma. Si no se especifica, la mayora de los navegadores utilizan un valor de 1.

Espacio entre Celdas La cantidad de espacio (en pxeles) entre cada celda, tanto horizontal como verticalmente. Si no se especifica, la mayora de los navegadores utilizan un valor de 2. Bordes Tipo
Los elementos de esta lista son cuatro de los ajustes para bordes ms comunes. Al seleccionar un elemento dentro de esta lista, se ajustan de forma automtica los otros parmetros del grupo Bordes, Relleno de la celda y Espacio entre celdas. El ancho del borde de la tabla (no el de las celdas) en pxeles. Si no se especifica, la mayora de los navegadores utilizar cero. El color del borde de la tabla. Si se ajusta a Predeterminado, Internet Explorer usar el color especificado en Borde Claro y Borde Oscuro (ver abajo), mientras que Netscape Navigator usar gris claro y gris oscuro. Indica el color del borde de la tabla en sus lados superior e izquierdo. No es utilizado por Netscape Navigator. Si se selecciona Predeterminado, Internet Explorer usar el color especificado en Color (vea ms arriba.) Indica el color del borde de la tabla en su lado inferior y derecho. No es utilizado por Netscape Navigator. Si se selecciona Predeterminado, Internet Explorer usar el color especificado en Color (vea ms arriba.)
Ancho Color
Borde claro
Borde oscuro
Fondo Imagen
La direccin URL o ruta de acceso a un archivo de imagen para utilizar como imagen de fondo de la tabla. Si la imagen es menor que la tabla, se crear un mosaico hasta que la tabla se llene. Haga clic sobre el botn Examinar para seleccionar un archivo de imagen del disco local.
97
Haga clic sobre el botn ClipArt para seleccionar una imagen de la librera de imgenes. Haga clic sobre el botn Proyecto para seleccionar un archivo de imagen del proyecto actual (no se encuentra disponible si no se trabaja en un proyecto.)
Color
El color de fondo de la tabla.
Si se especifica una imagen y un color de fondo al mismo tiempo, la imagen tiene prioridad. Nota sobre el tamao de la tabla y celdas Cuando tanto el tamao de las celdas como el de la tabla se encuentra especificado y estas especificaciones entran en conflicto, las siguientes reglas se aplican: Si la suma de los anchos de las celdas no es igual a la especificada para la tabla, el de la tabla toma prioridad. Los anchos relativos de las celdas son determinados por las proporciones entre los anchos especificados. Si la suma de los altos de las celdas es menor que el alto de la tabla especificado, el de la tabla toma prioridad. Las alturas relativas de las celdas se determinan por las proporciones entre las alturas especificadas. Si la suma de los altos de las celdas es mayor que el especificado para la tabla, los de las celdas toman prioridad. Para remover cualquier conflicto entre los tamaos especificados de las celdas y los de la tabla, utilice el comando Tabla > Aplicar Atributos de las Celdas Visibles. Esto ajustar de forma automtica los tamaos de las celdas para reflejar el tamao final como se ver en la ventana de Edicin.
4.9.8 Editando las propiedades de una celda

Cada celda en una tabla tiene un nmero de propiedades que pueden ser modificadas utilizando el dilogo Propiedades de la celda. Para abrir este dilogo, utilice el comando Tabla > Propiedades de la celda o haga clic con el botn derecho del ratn dentro de cualquier celda y seleccione el comando Propiedades de la celda dentro del men de atajo.
98
Captulo 4
Las propiedades de las celdas estn divididas en cuatro grupos: Tamao, Formato, Bordes e Imagen de fondo. Las propiedades de cada grupo se explican a continuacin.
Tamao
Ancho
Especifica el ancho de la celda en pxeles o como un porcentaje del tamao de la tabla. Si no se especifica, el navegador ajustar automticamente el ancho de la celda para que quepa en el espacio disponible. Especifica el alto de la celda en pxeles o como un porcentaje del tamao de la tabla. Si no se especifica, el navegador ajustar automticamente el alto de la celda para que quepa en el espacio disponible.
Alto
Formato
Alineacin Horizontal Alineacin Vertical Celda de encabezado
Especifica la alineacin horizontal del contenido de la celda. La Predeterminada es izquierda. La alineacin vertical del contenido de la celda. La
Predeterminada es centrada.
Si selecciona esta opcin, las celdas sern designadas como celdas de encabezado. Las celdas de encabezado tienen una alineacin horizontal centrada y su contenido aparece siempre en negrilla. El color de fondo de una celda.
Color de Fondo
Bordes
Color
El color del borde de la celda. Este ajuste se ignora en Netscape. En Internet Explorer, el ajuste se ignora si Borde Claro y Borde Oscuro contienen un color que no sea el predeterminado. Especifica el color para los bordes internos derecho e inferior de una celda. Este ajuste es ignorado por Netscape.
Borde claro
99
Borde oscuro
Especifica el color para los bordes internos izquierdo y superior de una celda. Este ajuste es ignorado por Netscape. Especifica la ruta de acceso o direccin URL de un archivo de imagen para utilizar como fondo de la tabla. Si la imagen es menor que la tabla, se crear un mosaico para llenarla. Se puede teclear la informacin o hacer clic sobre el botn Examinar para localizar y seleccionar un archivo en el disco local. Haga clic sobre el botn Clip Art para seleccionar una imagen de la librera de imgenes, o haga clic sobre el botn Proyecto para seleccionar un archivo del proyecto actual (si es que existe.)
Imagen de fondo
Notas acerca del tamao de la celda El alto de un rengln siempre se expande, si es necesario, para mostrar todo el contenido de las celdas. Si se ajusta el alto de una celda a un valor muy pequeo de forma tal que no pueda verse el contenido completo de la misma, este ajuste es ignorado. Si todas las celdas en un rengln no tienen la misma altura especificada, la altura utilizada se determina por la celda con la mayor altura. De forma similar, si todas las celdas en una columna no tienen el mismo ancho, el ancho utilizado para la columna es determinado por la celda que contenga el ancho mayor. Especificar el ancho o alto de una celda como un porcentaje solamente funciona si se especifica el ancho y alto de la tabla dentro del dilogo Propiedades de la tabla. Si se especifica el tamao de los renglones o columnas como un porcentaje y stos no suman el 100%, el tamao relativo se determina por las proporciones entre los porcentajes. Si se especifica el tamao de algunos renglones o columnas en pxeles y otros en porcentajes, los porcentajes son interpretados como lo que sobra del ancho o alto de la tabla despus de restar la suma total de los renglones o columnas especificados en pxeles. Si se especifican tanto imgenes de fondo como colores de fondo para una celda, la imagen toma precedencia (prioridad). El dilogo Propiedades de la celda se puede dejar abierto mientras se editan las propiedades de celdas mltiples. Para aplicar los cambios a una celda, presione sobre el botn Aplicar; puede ahora moverse a otra celda y editar sus propiedades sin cerrar el dilogo. Si se selecciona un grupo de celdas, los cambios que se hagan en el dilogo se aplicarn a todas las celdas seleccionadas.
100
Captulo 4
4.9.9 Modificando los bordes de una tabla o celda

Adems de usar los parmetros de borde disponibles dentro de los dilogos Propiedades de la tabla y Propiedades de la Celda, se puede ejercer un control ms fino sobre los bordes de las tablas y celdas utilizando el dilogo Parmetros de los bordes. Para abrir este dilogo, utilice el comando Tabla > Bordes > Bordes de la Celda o haga clic con el botn derecho del ratn en cualquier parte dentro de la tabla y seleccione el comando Tabla > Bordes del men de atajo.
La primera vez que utilice este comando en una tabla, se le preguntar si quiere convertir los bordes de esa tabla a bordes del estilo CSS. Para obtener mejores resultados haga clic sobre el botn S. Los ajustes del dilogo Parmetros de los bordes se aplican nicamente a las celdas seleccionadas. Si no se han seleccionado celdas, los parmetros se aplicarn a toda la tabla. La ventaja de utilizar el dilogo Parmetros de los bordes en lugar de los ajustes de los bordes disponibles dentro del dilogo Propiedades de la celda, consiste principalmente en que se puede aplicar un conjunto interno y externo de bordes a un bloque de celdas como una unidad. En contraste, los ajustes a los bordes realizados en el dilogo Propiedades de la celda slo se aplican a las celdas de manera individual, an si se seleccion un bloque de celdas. El siguiente ejemplo ilustra el concepto de aplicar un conjunto de bordes a un bloque de celdas como una unidad. En l, se aplica un doble borde externo a un bloque de celdas en la mitad de la tabla.
Doble borde externo
101
Para aplicar bordes de celdas del estilo CSS, haga lo siguiente:

1 Seleccione el bloque de celdas a las cuales se quiere aplicar el borde estilo CSS. 2 Use el comando Tabla > Bordes > Bordes de Celda o haga clic con el botn derecho del
ratn en cualquier parte dentro de una tabla y seleccione el comando Tabla > Bordes del men de atajo.
3 Haga clic en el botn S cuando se le pregunte si quiere cambiar los bordes al estilo CSS. 4 En el dilogo Parmetros de los bordes, seleccione un grupo de bordes utilizando uno
de los botones que se encuentran a un lado de Bordes.

5 Seleccione un estilo de borde dentro de la lista Estilo. 6 Seleccione un color para el borde utilizando la lista Color. 7 Elija el ancho del borde y las unidades a utilizar dentro del recuadro Ancho y la lista
disponible.
8 Repita los pasos del 4 al 7 para cada uno de los grupos de bordes que desea modificar.
Una vez que haya terminado, haga clic sobre el botn Aceptar.
No todos los estilos de borde se despliegan apropiadamente dentro de la ventana de Edicin. Para una vista previa precisa de los bordes aplicados, cambie a la solapa Vista Previa. Los bordes del estilo CSS son compatibles con Internet Explorer 5.x y versiones ms recientes. Pueden no desplegarse apropiadamente en otros navegadores.
4.9.10 Agregando un ttulo a una tabla

Se le puede agregar un ttulo a cualquier tabla, como se muestra en el siguiente ejemplo.
Para agregar un ttulo a una tabla, coloque el punto de insercin en cualquier lugar dentro de la misma y use el comando Tabla > Ttulo > Insertar Ttulo, escribiendo luego el texto. Para cambiar la posicin del ttulo, use el comando Tabla > Propiedades de la tabla. En el dilogo Propiedades de la tabla, seleccione una posicin distinta para el ttulo dentro de la lista Ttulo de la Tabla. Para eliminar el ttulo, coloque el punto de insercin en cualquier sitio dentro de la tabla y use el comando Tabla > Ttulo > Borrar Ttulo.
102
Captulo 4
4.9.11 Dividiendo y combinando tablas

Para dividir una tabla horizontalmente en dos, haga lo siguiente:
1 Coloque el punto de insercin en el rengln superior donde se dividir la tabla. 2 Use el comando Tabla > Utilidades > Dividir Tabla.
Todos los renglones debajo del punto de insercin se dividirn en una nueva tabla separada. Otra forma alternativa es seleccionar los renglones que formarn parte de la nueva divisin y arrastrarlos fuera de la tabla. Para dividir una tabla en forma vertical, seleccione las columnas a dividir y arrstrelas fuera de la tabla. Para unir dos tablas, haga lo siguiente:
1 Mueva o elimine cualquier prrafo que se encuentre entre las dos tablas, de forma tal que
la primera est justo encima de la segunda sin espacios entre ellas.

2 Coloque el punto de insercin en cualquier parte de la primera tabla. 3 Use el comando Tabla > Utilidades > Combinar Tablas.
Las dos tablas solamente pueden ser unidas si el rengln inferior de la primera tabla y el superior de la segunda tienen el mismo nmero de celdas. Si las tablas no tienen el mismo ancho de columnas, los anchos de las columnas de la segunda tabla sern ajustados a aquellos de la primera.
4.9.12 Ordenando una tabla

El dilogo Ordenar permite organizar todas o parte de las celdas de una tabla en una gran variedad de formas.
103
Para ordenar una tabla, haga lo siguiente:

1 Si desea ordenar solamente parte de las celdas de una tabla, seleccinelas antes de
comenzar. De otra forma, coloque el punto de insercin en cualquier sitio dentro de la tabla.
2 Use el comando Tabla > Utilidades > Ordenar para abrir el dilogo Ordenar. 3 Bajo la opcin Opciones, seleccione cualquiera de las alternativas de organizacin
(descritas ms abajo.)
4 Bajo la opcin Ordenar por, seleccione la columna o rengln a utilizar como primera
llave. Especifique si se organizar el contenido de las celdas como cadenas o nmeros y si el orden ser ascendente o descendente.
5 Opcionalmente, seleccione una o ms columnas o renglones adicionales para utilizar
como llaves secundarias de la organizacin dentro de la opcin luego por. Una vez ms, especifique si se ordena el contenido de las celdas como nmeros o cadenas y si el orden ser ascendente o descendente.
Las opciones para ordenar que se presentan, son las siguientes:

Ordenar de izquierda a derecha
Si es seleccionado, se ordenarn las columnas. Si no, solamente los renglones.

Ordenar solamente las celdas seleccionadas
Cuando se selecciona, solamente las celdas elegidas sern ordenadas. De otra forma, toda la tabla se ordenar. (Si se selecciona esta opcin, Ordenar contenido por, tambin ser seleccionada automticamente.)
Ordenar slo el contenido
Slo el contenido de las celdas se mover, no las celdas en s mismas. De otra forma tanto los atributos, tamaos y el color de fondo de las celdas se movern junto con su contenido.
Excluir el primer rengln
El primer rengln de la tabla o seleccin no se mover. Seleccione esta opcin si el primer rengln contiene encabezados.
Excluir el ltimo rengln
El ltimo rengln de la tabla o seleccin no se mover. Seleccione esta opcin si el ltimo rengln contiene encabezados.
Si la tabla a ordenar contiene celdas combinadas (no hay un nmero igual de celdas en cada rengln o columna), aparecer una advertencia al utilizar el comando Tabla > Utilidades > Ordenar: No es posible ordenar una tabla o seleccin que contenga celdas combinadas. Sin embargo, an se puede ordenar un bloque de celdas que no contenga celdas combinadas. Haga clic sobre el botn Aceptar para cerrar el mensaje de advertencia y seleccione Ordenar slo celdas seleccionadas en el dilogo Ordenar.
104
Captulo 4
Ordenando como texto o nmero El especificar si se ordena Como texto o Como nmero slo tiene caso cuando por lo menos una parte de las celdas a ordenar contiene nmeros. Si se selecciona Como texto, los nmeros son tratados como si fuesen texto. Cuando los nmeros se ordenan como texto, 2.5 se considera mayor que 15, aunque su valor sea menor. Esto es debido a que se utilizan caracteres ASCII para hacer la comparacin en forma de cadenas de izquierda a derecha y el carcter "2" tiene un valor ASCII mayor que el nmero "1". Para ordenar los nmeros por su valor, seleccione Como nmero.
4.9.13 Convirtiendo entre texto y tablas

Tanto una tabla puede convertirse en lneas ordinarias de texto, como las lneas de texto pueden ser convertidas a una tabla. Para convertir una tabla a texto, coloque el punto de insercin en cualquier sitio dentro de la tabla y utilice el comando Tabla > Utilidades > Convertir Tabla a Texto. La tabla ser recorrida de izquierda a derecha y de arriba hacia abajo. El contenido de cada celda se convertir en un prrafo. Por ejemplo, la siguiente tabla:
Pedro Julia 33 28
se convertir en estos prrafos:

Pedro 33 Julia 28
Para crear una tabla a partir de lneas de texto, haga lo siguiente:

1 Seleccione el texto que quiere convertir en tabla. 2 Use el comando Tabla > Utilidades > Convertir Texto en Tabla. 3 En el dilogo Cambiar Texto a Tabla, especifique el nmero de columnas para la nueva
tabla bajo la epgrafe Tamao de la Tabla. (El nmero de renglones se calcula automticamente al dividir el nmero de elementos entre el nmero de columnas especificadas.)
4 Seleccione un delimitador. (Las elecciones de delimitadores se describen ms adelante.) 5 Haga clic sobre el botn Aceptar.
La eleccin del delimitador determina cmo se dividir el texto seleccionado en las celdas dentro de la tabla. Por ejemplo, si desea que cada prrafo en el texto seleccionado se convierta
en una celda, seleccione Salto de Prrafo como el delimitador. Si desea que cada palabra se convierta en una celda, seleccione Espacios. Si desea que la seleccin completa se convierta en una sola celda, seleccione Sin delimitadores. Se puede especificar cualquier otro carcter como delimitador seleccionando Otro y proporcionar el carcter en el recuadro. El ejemplo siguiente muestra el resultado de la utilizacin del comando Convertir Texto a
Tabla con dos columnas y utilizando las comas como delimitadores:
Enrique, 99, Susana, 5
Se convierte en:
Enrique Susana 99 5
4.9.14 Usando una tabla para la distribucin de una pgina

Tal como se hace en los documentos de papel, las tablas usualmente son utilizadas dentro de los documentos web para organizar informacin. Las tablas se usan tambin para organizar la distribucin de un documento Web la posicin de los distintos prrafos, imgenes y otros elementos de la pgina, unos con respecto a otros. Puesto que una tabla HTML puede tener bordes invisibles, sta puede ser usada como ayuda en la distribucin de una pgina web sin que sea visible dentro de un navegador. Usar una tabla es especialmente til al disear pginas con distribucin en columnas mltiples que de otra forma seran difciles o imposibles de lograr. Muchos autores experimentados de documentos web utilizan tablas invisibles para distribuir sus pginas con excelentes resultados. De hecho, los documentos generados por el Asistente de Sitios Web de Namo WebEditor usan tablas invisibles para organizar la distribucin. La tcnica bsica del uso de una tabla para la distribucin de una pgina es la siguiente:
1 En un documento en blanco, cree una tabla de una celda. Borre los prrafos vacos que se
encuentran arriba y abajo de la misma.

2 Especifique el ancho y alto de la tabla como 100% o un valor fijo, dependiendo qu tan
ancha y alta quiere que la pgina aparezca. (Use el 100% de ancho si quiere que el contenido de la pgina se expanda y contraiga segn la apariencia de la ventana del navegador usado.)
3 Fije los bordes de la tabla al tipo Oculto. Esto hace que los espacios entre las celdas, los
espacios de las celdas y el ancho del borde sean iguales a cero. (Los bordes de la tabla sern an visibles dentro la ventana de Edicin, siempre que la opcin Ver > Marcas > Rejilla de la Tabla se encuentre habilitada.)
4 Divida la tabla en tantas columnas de renglones como desee. 5 Aplique una imagen o color de fondo a cada celda segn el diseo. 6 Agregue el contenido de cada celda.
106 Captulo 4 Edicin Bsica de un Documento
El ejemplo que mostramos forma parte del sitio web de Namo Interactive. Como puede ver, la pgina usa una distribucin de tres columnas. Las rejillas de la tabla utilizadas para realizar la distribucin se encuentran visibles como lneas punteadas, aunque no sern visibles en un navegador.
Con un poco de prctica, podr crear distribuciones complejas bien organizadas utilizando tablas invisibles.
107
4.10 Modificando las propiedades de un documento

Ciertas propiedades concernientes a la apariencia o funcionalidad de un documento web se determinan a nivel del documento. Tales propiedades incluyen el lenguaje de codificacin utilizado (el juego de caracteres), el color o imagen de fondo, los mrgenes superiores o izquierdos de la pgina, as como los colores de los vnculos utilizados en el documento. Las propiedades de un documento pueden ser vistas y modificadas en el dilogo Propiedades del Documento. Para abrir este dilogo, utilice el comando Formato > Propiedades del Documento o haga clic con el botn derecho del ratn en cualquier parte documento y seleccione el comando Propiedades del Documento dentro de men de atajo.
4.10.1 Cambiando el fondo del documento y los colores de los vnculos

La imagen o color de fondo, el color predeterminado del texto y los colores de los vnculos utilizados dentro un documento web son controlados dentro de la solapa Apariencia dentro del dilogo Propiedades del Documento.
Cualquiera de los ajustes de color Fondo, Texto, Vnculos, Vnculo visitado y Vnculo activo puede ser especificado al proporcionar un valor hexadecimal manualmente o seleccionar el color de la lista. Adicionalmente, se pueden copiar los colores de otro documento al hacer clic en la opcin Importar Colores y seleccionando documento en el dilogo Abrir. Una imagen de fondo para el documento se puede especificar de una de las siguientes formas: Al proporcionar directamente la ruta de acceso al archivo de la imagen o la direccin URL en el recuadro Imagen de fondo.
108
Captulo 4
Al hacer clic en el botn Examinar y seleccionar el archivo de la imagen en el dilogo Abrir. Haciendo clic en el botn Clip Art y seleccionando la imagen de la librera de imgenes. Al hacer clic en el botn Proyecto y seleccionar un archivo de imagen del proyecto activo (si es que lo hay.) Si se especifica una imagen de fondo, sta precede a un color de fondo.
Qu hay en un vnculo activo? Un vnculo activo dentro de una pgina Web vista en un navegador es aquel que se seguir si el visitante presiona la tecla <Intro>. En muchos navegadores, el vnculo activo se realza con un contorno punteado. Un vnculo se vuelve activo al llegar a l utilizando la tecla de tabulacin. El color del vnculo activo puede ser especificado de forma independiente de otros vnculos, documento por documento.
4.10.2 Asignando el ttulo de un documento, palabras clave y juego de caracteres

De los controles que se encuentran dentro de la solapa General del dilogo Propiedades del Documento, probablemente los ms tiles son los recuadros Ttulo, Palabras clave y la lista de Codificacin del lenguaje.
El contenido del recuadro Ttulo determina qu es lo que aparece dentro de la barra de ttulos de un navegador cuando el documento es desplegado. Si no se le asigna un ttulo al documento, Namo WebEditor lo genera automticamente de la primera lnea de texto del documento cuando se le guarda por primera vez. El recuadro Palabras clave permite asignar una serie de palabras al documento que sern utilizadas por las mquinas de bsqueda de Internet para asignarle una categora.
Modificando las propiedades de un documento 109
La lista Codificacin es usada para asignar un lenguaje de codificacin (juego de caracteres) al documento. El juego de caracteres utilizado de manera predeterminada es Occidental Europeo (Windows), que es adecuado para el espaol. Si un documento contiene caracteres extranjeros tales como japoneses o rabes, se debe seleccionar el juego de caracteres adecuado de la lista para asegurarse que el documento podr ser visto dentro de los navegadores que incluyan esa caracterstica.
4.10.3 Cambiando los mrgenes de una pgina y aplicando efectos especiales

La solapa Estilos del dilogo Propiedades del Documento ofrece varios controles tiles que afectan el comportamiento y apariencia del documento.
El control de ajuste Mrgenes determina el espacio en blanco, en pxeles, que se mantendr en la parte izquierda y superior de los bordes del documento. Si los mrgenes no son especificados, la mayora de los navegadores utilizan uno de 10 pxeles. Fijar el margen a 0 es til cuando se maneja una tabla al 100% para disear la pgina. Para el navegador Internet Explorer, es posible especificar un efecto de transicin cuando se entra o sale del documento. Bajo Efectos avanzados de pgina, seleccione un evento, un efecto y especifique su duracin. Se pueden asignar distintos efectos a cualquiera de los cuatro eventos. Estos efectos no trabajan en otro tipo de navegador. Tambin disponible en Internet Explorer se encuentra la asignacin de sonidos al documento que se reproducen en el trasfondo mientras se visualiza. En Sonido de fondo, proporcione la ruta de acceso o direccin URL a un archivo de sonido del tipo WAV (haga clic en el botn Examinar para localizar y seleccionar uno) y determine el nmero de repeticiones.
110
Captulo 4
Captulo 5
Edicin Avanzada de un Documento
Una vez que se ha familiarizado con las bases de crear y editar un documento web utilizando Namo WebEditor, recurra a este captulo para informacin de los temas avanzados. Afortunadamente, Namo WebEditor hace posible que el agregar, hasta las ms sofisticadas caractersticas a sus pginas web, sea sencillo.
En este captulo
5.1 5.2 5.3 5.4 5.5 5.6 5.7 5.8
Usando atributos de estilo Hojas de estilo Trabajando con capas Marcos y conjuntos de marcos Importando hojas de clculo Creando un grfico desde una tabla Creando formularios Web Editando el cdigo fuente HTML
111
5.1 Usando atributos de estilo

En la seccin 4.3, ha aprendido acerca del formato bsico de texto utilizando la barra de Formato, la regla horizontal y los comandos Tipografa y Prrafo en el men Formato. En esta seccin, explicamos las opciones avanzadas de formato disponibles dentro del dilogo Estilo. Los atributos que se encuentran en el dilogo Estilo proporcionan un control mucho ms fino sobre la apariencia de los prrafos y varios tipos de elementos que se encuentran en una pgina. Para usar el dilogo Estilo y aplicar atributos de estilo distintos a un prrafo, coloque el punto de insercin dentro del prrafo al cual se quiere aplicar el formato y seleccione el comando Formato > Estilo de Prrafo. Para dar formato a prrafos mltiples, seleccinelos antes de utilizar el comando. El dilogo Estilo tambin puede ser utilizado para aplicar atributos de estilo a otros tipos de elementos que no sean prrafos. Estos elementos incluyen tablas, celdas de tablas, formularios, elementos de formularios e imgenes. Para aplicar un atributo de estilo a este tipo de elementos, haga clic sobre el botn Estilo en el dilogo de propiedades de este elemento. Tenga presente que no todos los estilos se pueden aplicar a todo tipo de elemento en una pgina. Por ejemplo, slo color de fondo, mrgenes, espacios y bordes se pueden aplicar a una imagen. Cuando se utiliza el dilogo Estilo, no se requiere especificar un valor para cada uno de los parmetros. Especifique valores solamente para aquellos que quiera utilizar dejando los dems en blanco. Los valores predeterminados del navegador sern utilizados para aquellos atributos de estilo que no sean especificados.
Los atributos de estilo que se aplican utilizando el dilogo Estilo son sobrescritos por aquellos atributos que se aplican a prrafos, caracteres individuales y palabras usando los controles que se encuentran dentro de la barra de Formato, dentro del dilogo Estilo de carcter y en el dilogo Prrafo. Los atributos de apariencia disponibles dentro del dilogo Estilo no se incluyen en algunos de los navegadores ms viejos. La mayora de estos atributos son incluidos dentro de los navegadores Internet Explorer 4 y Netscape 4 o versiones ms nuevas. Aquellos que no incluyen estos atributos sencillamente los ignoran.
5.1.1 Atributos relacionados a la tipografa

La solapa Tipografa del dilogo Estilo permite aplicar varios atributos relacionados con la tipografa a los elementos de la pgina que incluyan texto, tales como prrafos y tablas.
112
Captulo 5
Tipografa primaria
La tipografa preferida para el texto. Esta tipografa es usada a menos que el ordenador, utilizado para ver el documento, no la contenga. La categora tipogrfica utilizada, si el ordenador no tiene la primaria. La tipografa asignada a cada categora la determina el navegador.
Tipografa secundaria Tipografa
El contenido de esta casilla viene de la seleccin de la Tipografa primaria y la Tipografa secundaria. Si desea especificar tipografas adicionales alternativas, escriba sus nombres despus de la tipografa primaria, separndolas con comas. El navegador utilizar la primera tipografa de la lista que est disponible en el ordenador. (Ejemplo: Verdana, Arial, sans serif.) Proporcione un nmero y especifique el mtodo del tamao a utilizar de la lista. La forma de clasificar el tamao cae en una de las cuatro categoras siguientes: Longitud - Especifica el tamao utilizando unidades de longitud. Las unidades disponibles son: puntos, mm, cm, picas, pulgadas, pxeles, em y ex. Tamao proporcional - Especifica el tamao como un porcentaje del tamao del texto normal tal como lo define el navegador. Para usar un tamao proporcional, seleccione % de la lista. Tamao Cualitativo - Especifica el tamao en trminos cualitativos tales como grande o pequeo. El tamao final correspondiente a estos trminos depende de la definicin dentro de un navegador en particular. Existen siete tamaos cualitativos: XX-Pequeo, X-Pequeo, Pequeo, Medio, Grande, X-Grande y XX-Grande. Tamao Relativo - Especifica el tamao en trminos relativos a los tamaos normales tal como los define el navegador. Existen dos tipos de tamao relativos: menor y mayor.
Tamao del texto
Decoracin
El tipo de decoracin que se utilizar en el texto: subrayado, lnea superior, tachado o parpadeando.
Usando atributos de estilo 113
Estilo Peso
Qu tanto se inclina el texto: normal, cursivo u oblicuo. Oblicuo es usualmente igual que cursivo. El grado de oscurecimiento del texto en trminos absolutos (ej., negrilla, 500) o relativos (ej., ms negrilla). La escala numrica de 100 - 900, Normal es 400 y Negrilla es 700. Ms negrilla y Ms clara son relativos al tamao del texto normal tal como los define el navegador.
Tenga presente que el tamao final del texto tal como lo ven los visitantes puede no ser igual al que ve en su pantalla, aunque se especifique el tamao usando unidades de longitud. El tamao final del texto tal como aparece en la pantalla del visitante depende de su navegador, su ordenador y el tipo de monitor utilizado para ver la pgina.
5.1.2 Colores y fondos

La solapa Distribucin del dilogo Estilo contiene los atributos relacionados con el color del texto, el color y la imagen de fondo de un prrafo u otro elemento de pgina.
Colores
Primer plano Fondo
El color del texto de un elemento de pgina. Seleccione un color de la lista. El color de fondo del elemento de pgina.
Imagen de fondo
URL
La direccin URL o ruta de acceso a un archivo de imagen que se usar como el fondo del elemento. Haga clic en el botn Examinar para localizar y seleccionar una imagen en su disco duro. Si el documento cuenta tambin con una imagen de fondo, la imagen de fondo del elemento toma precedencia. Cuando se usa el dilogo Estilo para especificar la imagen de fondo de un documento completo (haga clic en el botn Insertar Estilo en la etiqueta
Adjuntos
114
Captulo 5
<BODY> dentro de la solapa Estilos del dilogo Propiedades del Documento), este ajuste controla si la imagen de fondo se mueve o se
mantiene esttica cuando el documento se desplaza. Este ajuste no tiene ningn efecto cuando se aplica a un prrafo.
Repetir Pos. Vert.
La forma de duplicar la imagen de fondo. Seleccione Repetir para duplicar en ambos sentidos. Desplazamiento vertical de la imagen de fondo desde la parte superior de un prrafo. Este ajuste no tiene ningn efecto si la imagen se repite verticalmente. Desplazamiento horizontal de la imagen de fondo desde el borde izquierdo del prrafo. Este ajuste no tiene ningn efecto si la imagen se repite horizontalmente.
Pos. Horz.
5.1.3 Alineacin, sangras y espaciamiento

La solapa Texto del dilogo Estilos permite especificar la alineacin, sangra de la primera lnea, espaciamiento entre lneas y espaciamiento entre caracteres de un prrafo.
Alineacin
La alineacin del prrafo. Justificar significa que se agrega espacio extra entre las palabras para que el borde derecho del prrafo se vea parejo y alineado. La cantidad de sangra de la primera lnea del prrafo. Si selecciona % como unidad, la sangra se especifica como un porcentaje del ancho del prrafo. selecciona % como unidad, el espacio entre lneas se especifica como un porcentaje de la altura mxima de los caracteres.
Sangra
Espacio entre lneas La distancia entre las bases de las lneas que forman un prrafo. Si
Espacio entre caracteres La cantidad de espacio extra entre caracteres. Si selecciona %
como unidad, el ajuste no tiene ningn efecto.
Usando atributos de estilo
115
5.1.4 Mrgenes y rellenos

La solapa Caja del dilogo Estilo permite especificar los mrgenes y el espacio extra que se agrega a cada elemento de la pgina.
Bajo Mrgenes, especifique la cantidad de espacio que quiera agregar a un lado de cualquier elemento de la pgina. Los mrgenes izquierdos y derechos son las distancias entre el lado izquierdo o derecho de los elementos y el borde correspondiente de la ventana, marco, celda de tabla o capa que contiene a ese elemento. En Espacios, especifique la cantidad de espacio adicional que quiera agregar a un lado del elemento entre su margen y el borde del elemento que lo contiene. A menos que el elemento contenga un color, imagen de fondo o un borde (vea la siguiente subseccin), no hay razn para especificar mrgenes y espacios a la vez. Si el elemento tiene un color, imagen de fondo o un borde, el espacio determina el rea a dejar entre el elemento y el rea coloreada, el borde de la imagen de fondo o el borde. Si no hay ninguno de estos elementos, el espacio no se diferencia de los mrgenes.
5.1.5 Bordes
La solapa Bordes del dilogo Estilo le permite aplicar una orilla a cualquier lado de un elemento de pgina.
116
Captulo 5
Bajo Estilo, puede seleccionar el estilo del borde para cualquiera de los lados del elemento. En la opcin Colores, seleccione el color del borde. Bajo Ancho, especifique el espesor de cada borde. Si quiere agregar algn espacio entre el borde y el correspondiente lado del elemento, especifique la cantidad dentro de la solapa Caja del dilogo.
Algunos estilos de bordes no son desplegados correctamente en la ventana de edicin. Si el borde no aparece correctamente en esta ventana, cambie a la ventana de vista previa para ver cmo se desplegar el borde en un navegador. Los navegadores antiguos, tales como Internet Explorer 3.x o Netscape Navigator 3.x o versiones inferiores, no despliegan este tipo de bordes. Estos atributos son ignorados por estos navegadores. La mayora de los navegadores nuevos incluyen estos atributos, pero hay que prestar atencin a cmo son desplegados.
5.1.6 Aplicando atributos de estilo a un documento

El dilogo Estilo puede ser usado para aplicar atributos de estilo no solamente a los elementos individuales de cada pgina, sino al documento por completo. Por ejemplo, se puede predeterminar la tipografa de un documento, especificar la alineacin determinada del prrafo y aplicar los mrgenes a un conjunto de bordes de todo el documento. Para aplicar atributos de estilo a un documento, haga lo siguiente:
1 Use el comando Formato > Propiedades del Documento para abrir el dilogo
Propiedades del Documento.
2 Cambie a la solapa Estilos del dilogo Propiedades del Documento. 3 Haga clic en el botn Insertar Estilo en la etiqueta <BODY>. Esto abre el dilogo
Estilo.
4 Especifique los parmetros para los atributos de estilo que quiere aplicar al documento.
Una vez que haya terminado, haga clic en el botn Aceptar.
Usando atributos de estilo
117
5 Haga clic sobre el botn Aceptar para cerrar el dilogo Propiedades del Documento.
Existen ciertos puntos de los que hay que estar atentos al aplicar atributos de estilo en un documento: Una imagen o color de fondo aplicada al documento usando el dilogo Estilo toma precedencia sobre cualquier otra imagen o color de fondo especificada en la solapa Apariencia del dilogo Propiedades del Documento. Si se aplica un borde al documento, ste siempre aparece al margen de la ventana. A diferencia de los prrafos, la posicin de los bordes no se ve afectada por los mrgenes que se apliquen al documento. Los atributos de prrafo y carcter que se apliquen a nivel del documento son slo los predeterminados. Pueden ser sobrescritos por los atributos que se aplican a nivel prrafo o carcter.
118
Captulo 5
5.2 Hojas de estilo

Si cuenta con un conjunto de atributos de estilo que use continuamente, se puede guardar como un estilo con nombre. Se pueden tener tantos estilos en un documento como se desee. La coleccin de los estilos dentro de un documento se llama Hojas de estilo. Adems de esto, las hojas de estilo definidas en un documento pueden ser guardadas como un archivo externo y utilizadas en otros documentos. Cuando se cambia un estilo, ya sea en una hoja de estilo interna o externa, todos los prrafos o partes de los prrafos que usan ese estilo cambian automticamente. Las hojas de estilo son una forma muy poderosa de administrar el formato de un documento o de un conjunto de documentos, tal como un proyecto. Los estilos y las hojas de estilo se administran dentro del dilogo Hojas de estilo (mostrado ms bajo.) Este dilogo muestra una lista de los estilos utilizados en el documento activo y, adems de permitir agregar y quitar estilos, permite vincular a hojas de estilo externas. Para abrir este dilogo, use el comando Formato > Hojas de estilo.
5.2.1 Guardando un conjunto de atributos como un estilo

Para guardar un conjunto de atributos de estilo como una hoja de estilo, haga lo siguiente:
1 Abra el dilogo Hojas de estilo usando el comando Formato > Hojas de estilo. 2 Haga clic en el botn
(Agregar.) Esto abre el dilogo Agregar Estilo.
Hojas de estilo
119
3 Proporcione un nombre para el estilo dentro del recuadro Nombre. Si desea copiar los
atributos de un estilo ya guardado, seleccione el estilo dentro de la lista Copiar atributos de. Haga clic sobre el botn Aceptar.
4 En el dilogo Estilo, proporcione los valores para los atributos del estilo que se quieren
especificar. (Para mayor informacin del dilogo Estilo, vea la seccin 5.1: Usando atributos de estilo.)
5 Una vez que se han terminado de especificar los atributos del estilo, haga clic sobre el
botn Aceptar para cerrar el dilogo Estilo. En el dilogo Hojas de estilo, deber aparecer el que acaba de crear dentro de la lista Estilos Internos y su definicin (el conjunto de atributos especificados) aparecer bajo Definicin del Estilo. Confirme que la definicin est completa y luego haga clic sobre el botn Aceptar para cerrar el dilogo Hojas de estilo. Para editar un estilo existente, abra el dilogo Hojas de estilo y haga doble clic en el estilo editar dentro de la lista Estilos Internos. Esto abrir el dilogo Estilo. Una vez que haya terminado de editar el estilo, haga clic sobre el botn Aceptar dos veces para regresar a la ventana de Edicin. Para borrar un estilo, seleccinelo dentro de la lista Estilos Internos y haga clic sobre el botn (Remover.)
5.2.2 Aplicando un estilo

Una vez que se ha definido un estilo, se puede aplicar a prrafos o partes de un prrafo dentro de la ventana de Edicin. Hay dos maneras de aplicar un estilo a un prrafo: Coloque el punto de insercin dentro del prrafo y seleccione el estilo dentro de la lista Estilo CSS en la barra de Formato.
120
Captulo 5
Coloque el punto de insercin dentro del prrafo y use el comando Formato > Estilo del Prrafo. En la solapa Clase del dilogo Estilos, seleccione el estilo dentro de la lista Clase. Para aplicar un estilo a una parte de un prrafo tal como una palabra en lugar de a todo el prrafo, seleccione el texto y luego el estilo dentro de la lista Estilo CSS en la Barra de Formato.
5.2.3 Definiendo un conjunto de atributos para una etiqueta

Hay veces en las cuales se desea que un cierto conjunto de estilos de atributos se apliquen de forma automtica a cada caso de una etiqueta HTML en un documento, tal como la etiqueta de los elementos de una lista o los de un encabezado. Se puede realizar eso creando un estilo de etiquetas para el documento. Los estilos de etiquetas son similares a los estilos, debido a que sus definiciones son almacenadas en la hoja de estilo documento. Sin embargo, a diferencia de los estilos, que se aplican a un prrafo o a una seleccin eligindolos de la lista Estilo CSS, un estilo de etiqueta se aplica de forma automtica cuando se agrega un elemento de pgina asociado a una etiqueta correspondiente. Como un ejemplo, veamos cmo se define un estilo de etiqueta para los elementos de una lista:
(Agregar). Esto abre el dilogo Agregar Estilo.
3 Seleccione la etiqueta de los elementos de la lista (li) dentro del Etiquetas. Haga clic
sobre el botn Aceptar.

4 En el dilogo Estilo, proporcione los valores para los atributos de estilo que se desean
asociar a la etiqueta seleccionada. (Para mayor informacin sobre el dilogo Estilo, vea la seccin 5.1: Usando atributos de estilo.)
5 Una vez que se han terminado de especificar los atributos de estilo, haga clic sobre el
botn Aceptar para cerrar el dilogo Estilo. En el dilogo Hojas de estilo, aparecer el estilo de etiqueta que acaba de crear dentro de la lista Estilos Internos ordenado por nombre de etiqueta, mientras que la definicin del estilo se encuentra en Definicin del
Hojas de estilo 121
Estilo. Confirme que la definicin es la adecuada y luego haga clic sobre el botn Aceptar para cerrar el dilogo Hojas de estilo.
Ahora, cuando se cree una lista numerada o de vietas dentro del documento, el estilo que se acaba de definir ser utilizado de manera automtica. El estilo de etiquetas tambin se aplicar a los elementos de una lista ya existente. A continuacin encontrar una lista de los tipos de elemento de pgina ms comunes y sus etiquetas correspondientes. Tipo de Elemento de Pgina Prrafo Normal Elemento de Lista (vieta o numerada) Encabezado 1, Encabezado 2, etc. Tabla Celda de una Tabla Capa Imagen Regla Horizontal Vnculo Genrico Etiqueta P Li h1 h2 etc. table Td Div Img Hr A Atributos que se Aplican Todos Todos Todos
todos (los mrgenes y espacios se aplican fuera de tabla) Todos todos (el margen se aplica fuera de la capa, los espacios dentro de ella) todos excepto tipografa, texto y color de fondo todos excepto tipografa, texto y color de fondo todos excepto alineacin, sangra de primera lnea y espacio entre lneas
Ciertos atributos que pueden ser asignados a las etiquetas no se despliegan de forma correcta en la ventana de Edicin. Para ver cmo se desplegarn dentro de un navegador, cambie a la ventana de Vista Previa.
5.2.4 Definiendo el conjunto de atributos para los vnculos

Un vnculo, dentro un documento, puede tener cuatro estados distintos en cualquier momento: Normal Visitado Activo Normal, vnculo que no ha sido visitado. Vnculo que ha sido visitado. El vnculo al cual se saltar si se presiona la tecla <Intro>.
122
Captulo 5
Rondar
El vnculo sobre el cual se encuentra el apuntador del ratn.
Se puede asignar un conjunto de atributos de estilo distinto a cada estado, creando uno o ms estilos de vnculos. Para crear un estilo de vnculo, haga lo siguiente:
(Agregar.) Esto abre el dilogo Agregar Estilo.
3 Haga clic en el botn Otro. Seleccione un estado del vnculo dentro de la lista Nombre.
Haga clic sobre el botn Aceptar.

4 En el dilogo Estilo, proporcione los valores para los atributos de estilo que se quieren
asociar con el estado seleccionado del vnculo. (Para mayor informacin del dilogo Estilo, vea la seccin 5.1: Usando atributos de estilo.)
5 Una vez que se han terminado de especificar los atributos del estilo, haga clic sobre el
botn Aceptar para cerrar el dilogo Estilo.

6 Repita los pasos del 2 al 5 para cada estilo de vnculo que quiera crear. 7 En el dilogo Hojas de estilo, cada estilo de vnculo que acaba de crear aparecer
dentro de la lista Estilos Internos como a: seguido del nombre del estado del vnculo (por ejemplo, a:rondar). La definicin se localiza dentro de Definicin del Estilos. Confirme que las definiciones son las deseadas y haga clic sobre el botn Aceptar para cerrar el dilogo Hojas de estilo.
Si ha definido un estilo de etiqueta para la etiqueta <a> (vnculos genricos), todos los atributos que estn definidos en ella pero que no sean definidos en los estilos de vnculo sern aplicados a todos los vnculos. Por ejemplo, si se ha definido un estilo para la etiqueta <a> que especifica una tipografa y el estilo del vnculo no la especifica, todos los vnculos (no importando su estado) utilizarn la tipografa especificada dentro del estilo de la etiqueta <a>.
5.2.5 Guardando los estilos en una hoja externa de estilos

Una de las caractersticas ms poderosa de las hojas de estilo es el poder guardarlas como archivos externos, que pueden ser utilizadas por otros documentos. Sin duda, un conjunto completo de documentos tal como un proyecto pueden compartir una nica hoja de estilo externa, permitiendo as aplicar los mismos estilos a cada documento y cambiar el formato de ellos sencillamente modificando alguna caracterstica dentro de la hoja de estilo. Para guardar una hoja de estilo interna de un documento como un archivo externo, haga lo siguiente:
1 Use el comando Formato > Hojas de estilo para abrir el dilogo Hojas de estilo. 2 Haga clic en el botn
(Guardar como Archivo Externo.)
Hojas de estilo
123
3 En el dilogo Guardar Hojas de estilo, navegue a la carpeta en la que guardar el
archivo de la Hoja de estilo, proporcione un nombre en Nombre de Archivo y haga clic sobre el botn Guardar. La Hoja de estilo se guardar como un archivo de texto con una extensin .css. Si est usando un proyecto, no olvide anexarle la Hoja de estilo.
8.1.3: Agregando documentos existentes a un proyecto
Editando una Hoja de estilo externa Las hojas de estilo externas no pueden ser editadas dentro de Namo WebEditor. Para editar una hoja de estilo externa, brala utilizando cualquier aplicacin que pueda trabajar con archivos de texto, tal como WordPad. Realice los cambios directamente a las definiciones de estilo dentro del archivo y luego gurdelo. Para editar las definiciones de estilo directamente, se requieren tener ciertos conocimientos de las especificaciones CSS. Si no tiene la experiencia necesaria, quiz sea mejor invertir en un editor de CSS. Existen varias opciones, muy baratas, disponibles para descargar directamente de la web; sugerimos que haga una investigacin dentro de su librera preferida utilizando trminos tales como CSS editor.
5.2.6 Enlazando o importando de una hoja externa de estilo

Para poder utilizar una hoja de estilo externa, debe crear una referencia a ella dentro del documento. Existen dos formas de crear una referencia a una hoja de estilo externa: vinculando e importando. Los dos mtodos producen el mismo resultado, pero cada uno de ellos tiene una ventaja sobre el otro: La vinculacin se encuentra incluida dentro de los navegadores ms modernos (Netscape 4.0 o versin ms reciente e Internet Explorer 3 o versin ms reciente), pero solamente es posible vincular a una sola hoja de estilo externa. Al importar tenemos la ventaja de poder utilizar cualquier nmero de hojas de estilo externas en el mismo documento, pero desgraciadamente esta caracterstica solamente se encuentra incluida en Internet Explorer 4 o versin ms reciente. Para vincular una hoja de estilo externa, haga lo siguiente:
1 Use el comando Formato > Hojas de estilo para abrir el dilogo Hojas de estilo. 2 Proporcione la ruta de acceso o la direccin URL al archivo de la hoja de estilo externa
dentro del recuadro Vincular Hojas de estilo o haga clic sobre el botn (Examinar) para localizar y seleccionar el archivo en su disco duro. (Los nombres de archivo de las hojas de estilo terminan con la extensin .css.)
3 Haga clic sobre el botn Aceptar para cerrar el dilogo Hojas de estilo.
124
Captulo 5
Para importar una o ms hojas de estilo externas, haga lo siguiente:

1 Use el comando Formato > Hojas de estilo para abrir el dilogo Hojas de estilo. 2 Bajo Importar Hojas de estilo, haga clic sobre el botn
(Agregar Archivo Externo) para localizar y seleccionar un archivo de hoja de estilo en su disco duro. (Los nombres de archivo de las hojas de estilo terminan con la extensin .css). El nombre de la hoja de estilo seleccionada aparecer dentro de la lista. Repita el mismo procedimiento para cada hoja de estilo que quiera importar.
3 Haga clic sobre el botn Aceptar para cerrar el dilogo Hojas de estilo.
Los estilos definidos dentro de las hojas de estilo que se han vinculado o importado quedan ahora disponibles para ser utilizadas dentro del documento. Para aplicar el estilo, utilice la lista Estilo CSS de la Barra de Formato.
Si import ms de una hoja de estilo externa a un documento, asegrese de que no contengan estilos que compartan el mismo nombre o que estn asociados con la misma etiqueta. Si ocurre un conflicto, puede no ser posible predecir cul de las definiciones de estilo ser aplicada. Cuando se publica un documento que contiene referencias a hojas de estilo externas, se deben tambin publicar los archivos de las hojas de estilo junto con los documentos. Asegrese de que la ruta de acceso relativa del documento hacia las hojas de estilo sea el mismo dentro de su sitio web que en su disco duro. Sin embargo, si la referencia a las hojas de estilo es una direccin URL en la que se encuentran los archivos, no es necesario publicarla a su sitio Web.
Hojas de estilo
125
5.3 Trabajando con capas

Una capa es un contenedor mvil para texto, imgenes y otros elementos de pgina. Cualquier cosa que pueda ser colocada dentro de una pgina, tambin puede ser colocada en una capa (incluyendo otras capas.) Las capas pueden ser colocadas en cualquier parte de una pgina, puesto que flotan sobre los elementos de la pgina. La siguiente imagen de la ventana de Vista Previa muestra este aspecto flotante de las capas.
Mostramos ahora la misma capa tal como se ve en la ventana de Edicin, sin el texto de fondo:
Marca de etiqueta de capa
Manija de la capa
El pequeo recuadro blanco que se encuentra en la esquina superior izquierda de la capa es conocido con el nombre de Manija de la capa, y es usada para moverla dentro de la ventana de Edicin. El pequeo smbolo amarillo fuera de la capa es la marca de la etiqueta de la capa, que indica dnde se ha insertado la capa dentro del documento.
126
Captulo 5
5.3.1 Creando y moviendo las capas

Para crear una capa en el documento activo, use el comando Insertar > Capa o haga clic sobre el botn en la Barra de herramientas estndar. Un marcador de la etiqueta de la capa aparecer en el punto de insercin mientras que una capa se crea de inmediato a la derecha de la marca. Puesto que las capas se pueden mover con libertad a cualquier posicin, la localizacin del marcador de la capa no es importante; si lo desea, se puede cortar y pegar el marcador en cualquier posicin conveniente dentro del documento. Sin embargo, si elimina la marca, tambin elimina la capa. Para mover la capa, sencillamente arrstrela de su manija. El apuntador del ratn cambia a una pequea mano cuando se coloca sobre la manija de una capa. Al arrastrar, el contorno de la capa sigue al apuntador del ratn. Suelte el botn del ratn una vez que el contorno de la capa se encuentre en el punto deseado. Si se encuentra habilitada la opcin de ajustar a rejilla (use el comando Ver > Rejilla > Ajustar), los bordes de la capa encajan a las subdivisiones invisibles al arrastrarla. Las capas tambin encajan a las guas si se habilita el ajuste a las guas (use el comando Ver > Guas > Ajustar.) Usar los ajustes automticos puede resultar de gran ayuda cuando se trabaja con capas. Si se requiere colocar una capa en una coordenada especfica, use los controles de posicin localizados en el dilogo Propiedades de la Capa.
Para abrir este dilogo, haga doble clic sobre la manija de la capa. Bajo Posicin y tamao, proporcione la distancia deseada, en pxeles, desde la esquina superior izquierda del documento dentro de los recuadros Izquierda y arriba. Haga clic sobre el botn Aceptar para cerrar el dilogo.
5.3.2 Cambiando el tamao de una capa y agregando el contenido

Para cambiar el tamao de una capa, haga clic sobre cualquiera de sus manijas y arrstrela. Las manijas de cambio de tamao solamente aparecen cuando la capa se encuentra seleccionada (haga clic una vez sobre la manija de la capa para activarla.)
Trabajando con capas
127
Para especificar un tamao exacto de la capa, haga doble clic sobre la manija de la capa y proporcione tanto el alto como el ancho en pxeles dentro del dilogo Propiedades de la Capa.
Se puede agregar el contenido a una capa tal como se realiza con un documento. Coloque el punto de insercin en la capa haciendo clic en cualquier parte dentro de ella y agregue el texto, imgenes y otros elementos de la pgina por cualquier mtodo que quiera utilizar. Al agregar el contenido, el alto de la capa aumentar justo para acomodarlo y que sea visible. No es posible hacer una capa lo suficientemente pequea para que oculte su contenido.
5.3.3 Ajustando el orden de las capas

Las capas mltiples dentro de un mismo documento pueden solaparse. Normalmente, en tales casos, el orden de las capas de arriba hacia abajo es el orden inverso en el cual fueron creadas (la capa creada al ltimo es la que se encuentra ms arriba.) Para cambiar explcitamente el orden de arriba hacia abajo de capas mltiples, ajuste su ndice Z en el dilogo Propiedades de la Capa.
128
Captulo 5
Cuando una capa es creada, se le asigna un ndice Z de 1. Se puede cambiar este ndice a cualquier valor entero negativo o positivo. Mientras mayor sea el ndice Z, mayor es el orden de la capa en el orden de arriba hacia abajo. Las capas que tienen el mismo ndice Z se ordenan segn su hora de creacin. Cuando las capas que se traslapan no tienen un color de fondo o solamente tienen texto con el mismo color, puede ser difcil determinar por inspeccin visual qu capa se encuentra delante de las otras. Para confirmar el orden de las capas, verifique dentro de la ventana Capas. (Para abrir esta ventana, use el comando Ventanas > Lista de Capas o use las teclas <Alt + 5>.)
La ventana Capas lista todas aquellas dentro del documento activo, mostrando sus nombres, ndices Z y estado de visibilidad. Al hacer clic sobre una capa de dentro de la lista, sta es seleccionada en la ventana de Edicin. Si se hace doble clic sobre una capa en la lista, se abre el dilogo Propiedades de la Capa para esa capa en concreto.
5.3.4 Otras propiedades de las capas

Adems del tamao, posicin e ndice Z, existen unas cuantas propiedades extras de la capa que pueden ser ajustadas dentro del dilogo Propiedades de la Capa.
Nombre de la capa
Cada capa en un documento tiene un nombre nico que la identifica no solamente en la ventana Capa sino que tambin para ser usada en acciones, lneas de tiempo y el Asistente de Secuencias de Comandos (vea el Captulo 6: Agregando Elementos Dinmicos.)
Trabajando con capas 129
Visibilidad
En un momento dado, una capa puede ser invisible u oculta mientras el documento se despliega en un navegador. Aunque probablemente no sea prctico contar con una capa que siempre est oculta, es til poder cambiarla con el tiempo o en respuesta a un evento. Esto puede realizarse usando acciones o lneas de tiempo (vea el Captulo 6: Agregando Elementos Dinmicos.) Use el men Visibilidad para cambiar la visibilidad de una capa dentro de una secuencia de lnea de tiempo. Si la capa se encuentra dentro de otra y se fija la visibilidad a Heredada, se obliga a que la capa tenga la misma visibilidad que aquella de su padre. Cada capa puede tener una imagen de fondo. Para asignarla, proporcione su direccin URL o la ruta de acceso dentro del recuadro correspondiente o haga clic en uno de los botones: Examinar, Clip Art, o Proyecto para seleccionar el archivo de la imagen del disco duro, la librera de imgenes o el proyecto activo, respectivamente. De manera predeterminada, cada capa tiene un fondo transparente. Sin embargo, se puede asignar un color de fondo que no sea transparente usando esta lista. Para volver al color transparente de fondo inicial, seleccione la opcin Predeterminado.
Imagen de fondo
Color de fondo
Nota sobre la compatibilidad con navegadores Las capas no son incluidas en algunos navegadores, particularmente en los ms antiguos. Si un documento que usa capas se ve dentro de un navegador que no las incluye, los resultados son impredecibles. De manera predeterminada, Namo WebEditor usa la etiqueta <DIV> para definir las capas. Esto es compatible con Internet Explorer 4.x o versiones ms recientes y con Netscape 4.6 o versiones ms recientes. Para hacer que las capas sean compatibles con algunas de las versiones previas de Netscape, seleccione la opcin Guardar usando etiqueta <LAYER> en el dilogo propiedades de la Capa.
130
Captulo 5
5.4 Marcos y conjuntos de marcos

Los marcos son una forma de desplegar dos o ms documentos en la misma ventana de un navegador web de forma simultnea. Por ejemplo, si existen dos marcos dentro de la ventana de un navegador, uno de ellos puede mostrar un documento que consiste en una lista de vnculos, mientras que el otro puede mostrar el documento destino de uno de los vnculos. Cada vez que se hace clic sobre un vnculo del primer marco, el documento destino es cargado dentro del segundo marco. Cualquier nmero de marcos puede ser desplegado dentro de una ventana de un navegador al mismo tiempo y cada marco puede desplegar distintos documentos (pero solamente un documento a la vez.) Cuando se tienen varios marcos, estos reciben el nombre de conjunto de marcos y el documento que contiene la informacin acerca de ese conjunto es llamado documento de marcos. El documento de marcos es un documento HTML que solamente contiene (1) una lista de cada uno de los marcos dentro del conjunto de marcos, (2) alguna informacin acerca de cada marco, tal como su nombre, tamao y documento predeterminado, y (3) un mensaje que se muestra en los navegadores que no incluyen el uso de marcos. El documento del conjunto de marcos no contiene el contenido de los marcos que define; el contenido es proporcionado por los documentos del marco. El documento del conjunto de marcos es "invisible": cuando se abre un documento del conjunto de marcos en un navegador, no se ve el documento sino solamente los documentos contenidos en cada uno de los marcos.
5.4.1 Creando un conjunto de marcos

Para crear un nuevo conjunto de marcos, haga lo siguiente:
1 Use el comando Archivo > Nuevo o Marcos > Nuevo Marco. 2 En la solapa Marcos del dilogo Nuevo, seleccione la plantilla del conjunto de marcos.
Las plantillas se encuentran disponibles para una gran cantidad de tipos comunes de conjuntos de marcos.
El nuevo conjunto de marcos aparece en la ventana de Edicin, tal como se muestra en la imagen inferior que ha sido creada utilizando la plantilla Titular, Contenido, Detalle.
Marcos y conjuntos de marcos
131
Marco Titular
Marco Contenido
Borde del marco Marco de detalle
El nuevo documento de marcos es llamado frame1.htm. Namo WebEditor coloca un documento temporal en cada uno de los marcos, con los nombres noname1.htm, noname2.htm, etc. Solamente el documento de marcos es representado con una solapa de documento. Los documentos temporales dentro de cada marco no tienen solapa. El nombre de archivo del documento en el marco activo (aqul con un borde azul a su alrededor) se muestra en la barra de ttulo de Namo WebEditor. Una vez que se ha creado el nuevo conjunto de marcos, se puede reemplazar el documento temporal en cualquiera de los marcos con otro que ya ha sido previamente creado y guardado, o se puede agregar contenido a este documento temporal (guardndolo posteriormente, lo que cambia su estado de temporal.) Para reemplazar un documento temporal de cualquier marco con algn otro, haga lo siguiente:
1 Haga clic dentro del marco para activarlo. 2 Use el comando Marcos > Abrir Documento en Marco. 3 Seleccione un documento de su disco duro y haga clic en el botn Abrir o proporcione la
direccin URL del documento dentro de la Web en el recuadro URL y presione sobre el botn Abrir URL. El documento seleccionado se abrir dentro del marco activo. Si lo desea, puede volver a editar el documento y guardarlo posteriormente, tal como se realiza con un documento nico.
5.4.2 Guardando un conjunto de marcos

Puesto que un conjunto de marcos incluye documentos mltiples, para guardar por completo los marcos se deben guardar todos los documentos, incluyendo el que contiene a los marcos. La forma ms sencilla de realizar esto es usando el comando Marcos > Guardar Todo. Si cualquiera de los marcos contiene un documento que no ha sido previamente guardado, el
132 Captulo 5 Edicin Avanzada de un Documento
dilogo Guardar como aparecer una vez para cada documento que no se ha guardado, preguntndole el nombre del archivo y localizacin en la cual se guardar. Si desea guardar solamente el documento del marco activo, use el comando Archivo > Guardar. Para guardar solamente el documento que contiene a los marcos, use el comando Marcos > Guardar Marcos.
5.4.3 Vista previa de un conjunto de marcos

Cuando se est editando un conjunto de marcos, la solapa Vista Previa en la parte baja de la ventana principal es utilizada exclusivamente para ver el documento del marco activo. Para realizar una vista preliminar del conjunto de marcos, utilice la solapa Vista Previa Marcos. Si cualquiera de los marcos contiene un documento o temporal, se le pedir que lo guarde antes de que se pueda desplegar la vista preliminar del conjunto de marcos.
5.4.4 Determinando el documento predeterminado de un marco

Aunque cualquier marco puede contener cualquier documento, cada marco dentro de un conjunto de marcos necesita tener un documento predeterminado. Este es el documento que aparecer en el marco cuando el conjunto de marcos se abra por primera vez en un navegador. Si el marco no consta de un documento predeterminado, aparecer inicialmente en blanco. La identidad del documento predeterminado de cada marco se almacena en el documento del conjunto de marcos y es determinado por el documento que se encuentra abierto en cada marco, cuando almacena el documento del conjunto de marcos.
Si cualquier marco contiene un documento temporal en el momento de guardar el documento que tiene un conjunto de marcos, no se definir un documento predeterminado para ese marco. Por lo tanto, asegrese de que cada marco contiene un documento que no sea temporal (que est guardado) al momento de guardar su conjunto de marcos.
5.4.5 Cambiando el tamao de los marcos

Los marcos pueden ser cambiados de tamao ya sea de forma visual, al hacer clic y arrastrar cualquiera de sus bordes o de forma numrica, al especificar su tamao dentro del dilogo Propiedades del Marco. Para cambiar el tamao de un marco de manera visual, haga clic y arrastre uno de los bordes que comparte con otro marco. Obviamente, esto tambin cambiar el tamao del marco adyacente.
133
Para especificar el tamao de un marco numricamente, haga lo siguiente:

1 Active el marco (al hacer clic dentro de l.) 2 Use el comando Marcos > Propiedades del Marco para abrir el dilogo Propiedades
del Marco.
3 Bajo Tamao y espaciamiento, proporcione un valor dentro de los recuadros Ancho del
marco y / o Alto del marco y seleccione el mtodo para determinar el tamao dentro de la lista. (Vea ms abajo una explicacin de los distintos mtodos de determinar el tamao.)
Existen tres formas especificar el tamao de un marco numricamente:

Especificar el tamao del marco en pxeles Seleccione pxeles dentro de la lista y proporcione la cantidad. Por ejemplo, teclee
100 para fijar el ancho o altura del marco exactamente a 100 pxeles. Si el tamao de todos los marcos en un conjunto de marcos se especifica en pxeles y la suma de todos ellos no es igual al ancho o alto de la ventana del navegador, entonces por lo menos un marco aparecer en un tamao distinto al que se especific. Por lo tanto, es buena idea especificar el tamao de por lo menos uno de los marcos en trminos relativos (vea ms abajo.)
Especificar el tamao del marco como un porcentaje del tamao de la ventana Seleccione % dentro de la lista y proporcione el porcentaje con respecto al tamao
de la ventana del navegador. Si la suma de todos los marcos que utilizan un porcentaje excede el 100%, el tamao de cada marco ser reducido de forma proporcional a su tamao especificado. Si la suma de todos los tamaos es menor al 100%, el tamao de cada marco se aumentar de forma proporcional, a menos que otro marco tenga su tamao especificado en trminos relativos, en cuyo caso el tamao del marco se aumentar para compensar la diferencia.
Especificar el tamao del marco en trminos relativos Seleccione *(relativo) en la lista de unidades y teclee un entero que represente el
tamao del marco con relacin al de los otros. Por ejemplo, si un conjunto de marcos se divide verticalmente en tres marcos y al de ms a la izquierda se le asigna un valor relativo de ancho de 2, al del centro un valor relativo de 4 y al de la ms a la derecha un valor relativo de 3, entonces el radio de los anchos de los tres marcos ser 2:4:3.
134
Captulo 5
5.4.6 Agregando y eliminando marcos

Para agregar un marco a un conjunto de marcos, divida uno de los ya existentes en dos partes. Para realizar esto, active el marco que quiera dividir y luego seleccione Dividir Marco Horizontalmente o Dividir Marco Verticalmente en el men Marco, dependiendo de si quiere que el nuevo marco se encuentre a la derecha o debajo del ya existente. Se le debe dar un nombre al nuevo marco. Siga los siguientes pasos:
1 Use el comando Marcos > Propiedades del Marco para abrir el dilogo Propiedades
del Marco.
2 Proporcione un nombre dentro del recuadro Nombre y haga clic en el botn Aceptar.
Para remover un marco, haga lo siguiente: Si el marco es el que se encuentra ms arriba o el de ms a la izquierda dentro de un conjunto de marcos Haga clic y arrastre su borde inferior o derecho completamente al lado opuesto. Una vez que se suelta el botn del ratn, haga clic sobre el botn S para confirmar su eliminacin. Si el marco NO es el de ms arriba o el de ms a la izquierda Haga clic y arrastre su borde superior o izquierdo completamente al lado opuesto. Una vez que se suelta el botn del ratn, haga clic sobre el botn S para confirmar su eliminacin.
5.4.7 Determinando el destino predeterminado de un marco

Cuando se hace clic sobre un vnculo dentro de la ventana de un navegador que est dividida en marcos, existen varias formas en las cuales el navegador puede desplegar los documentos a los que se refiere el vnculo. Puede abrir el documento: en el marco que contiene el vnculo en otro marco en la ventana completa, reemplazando los marcos en una nueva ventana sin marcos El comportamiento que utilizar depende de las propiedades del vnculo, conocidas como su destino. El destino es el nombre del marco o ventana en el cual el documento de referencia del vnculo ser desplegado. De manera predeterminada, el destino del vnculo es la misma ventana o marco que lo contiene, pero esto puede cambiarse. (Para cambiar el destino de un vnculo dentro de Namo WebEditor, use el men Marco destino en el dilogo Propiedades del Vnculo.) Cuando se usan marcos, sin embargo, puede ser que prefiera que el documento referido dentro del vnculo de un marco siempre sea abierto dentro un marco especfico. Afortunadamente, es
Marcos y conjuntos de marcos 135
posible definir un destino predeterminado para cualquier marco. Si se especifica un destino predeterminado para un marco, la referencia del vnculo de ese marco se aplica siempre dentro del predeterminado, a menos que un vnculo particular tenga un destino especificado diferente. Si se crea un conjunto de marcos utilizando una plantilla, algunos o todos los marcos pueden ya tener destinos predeterminados asignados. Para fijar el destino predeterminado de un marco, haga lo siguiente:
1 Active el marco. 2 Use el comando Marcos > Propiedades del Marco para abrir el dilogo Propiedades
del Marco.
3 Dentro del men Marco predeterminado destino, seleccione el nombre del marco que
desea utilizar como destino predeterminado.

Para averiguar el nombre de un marco, actvelo y luego inspeccione la barra de ttulo de la ventana principal de Namo WebEditor. El primer elemento dentro de los parntesis cuadrados es el nombre de archivo o direccin URL del documento abierto dentro del marco. El segundo elemento es el nombre del marco activo.
En el ejemplo superior, productos.htm es el nombre del archivo del documento abierto dentro del marco y banner es el nombre del marco activo. Para cambiar el nombre de un marco, use el comando Marcos > Propiedades del Marco y edite el contenido del recuadro Nombre en el dilogo Propiedades del Marco. Adems de listar los nombres de los marcos dentro del conjunto de marcos, el men Marco predeterminado destino tambin contiene cuatro palabras reservadas especiales cuyo significado depende del contexto:
_self
Se refiere al propio marco activo. Si se selecciona el destino predeterminado a _self, los documentos referidos por los vnculos dentro del marco se cargarn dentro del mismo marco. Se refiere al marco padre del marco que contiene el vnculo. Si determina el marco destino de un vnculo a _parent, el documento vinculado cargar en el marco padre, reemplazando el conjunto completo de marcos. Pero Qu es un marco padre? Pongamos que existen dos conjuntos de marcos, A y B. Si el conjunto de marcos A se encuentra desplegado en uno de los marcos del conjunto de marcos B, ese marco es el marco padre de todos los marcos del conjunto de marcos A. Si el conjunto de marcos A se despliega por completo dentro de la ventana de un navegador, el marco padre de todos los marcos del conjunto de marcos A ser la misma ventana del navegador.
_parent
136
Captulo 5
_top
Se refiere a la ventana del navegador. Si determina el marco destino de un vnculo a _top, el documento enlazado cargar dentro de la ventana completa del navegador, reemplazando por entero el conjunto de marcos. Se refiere a una nueva ventana de navegador. Si determina el marco de destino de un vnculo a _blank, el documento enlazado cargar en una nueva ventana de navegador.
_blank
Si no se especifica un destino predeterminado, _self ser usado.
5.4.8 Modificando las propiedades de los marcos

Cada marco tiene un conjunto de propiedades que determinan su apariencia y comportamiento. Estas propiedades se guardan junto con el documento del conjunto de marcos. Algunas propiedades de los marcos ya han sido analizadas en esta seccin. Aqu las resumimos y describimos las restantes. Para abrir el dilogo Propiedades del Marco, use el comando Marcos > Propiedades del
Marco.
Ruta
La referencia al archivo o direccin URL del documento abierto en el marco. Para abrir un documento distinto, proporcione su direccin URL o haga clic sobre el botn Examinar y seleccinelo en su disco duro y luego presione sobre el botn Aceptar. Cuando se guarda el documento del conjunto de marcos, el documento especificado se convierte en el predeterminado del marco. El nombre del marco. El nombre se usa para referirse a l cuando se selecciona un marco destino de otro marco o cuando se selecciona el destino de un vnculo.
Nombre
Marco predeterminado destino
137
El nombre del marco en el que se abrirn aquellos documentos referidos por los vnculos encontrados en este marco. (Vea la seccin 5.4.7: Determinando el destino predeterminado de un marco.) Si no se especifica se usa _self.
Alto / ancho del marco
El ancho y alto del marco. (Vea la seccin 5.4.5 Cambiando el tamao de los marcos.)
Margen izquierdo / superior
La cantidad de espacio, en pxeles, entre el borde superior o izquierdo del marco y su contenido. Los mrgenes predeterminados son izquierdo: 10, superior: 14.
Barra de desplazamiento
Especifica si el marco deber tener una barra de desplazamiento.

Auto significa que el marco tendr una barra de desplazamiento
solamente si el contenido del marco no puede ser visto sin desplazamiento. El valor por omisin es Auto.
Permitir modificar el tamao del marco en el navegador
Si selecciona esta opcin, los visitantes a nuestro sitio WEB pueden modificar el tamao del marco en su navegador al hacer clic en uno de sus bordes y arrastrarlo.
Ancho del Borde
El espesor del borde entre los marcos especificado en pxeles. El valor predeterminado es 5. Si se fija el ancho del borde a 0, los bordes se ocultan cuando el documento se ve en un navegador. (Sin embargo, los bordes an sern visibles dentro de la ventana de Edicin de Namo WebEditor.) Este ajuste se aplica al conjunto completo de marcos, no slo al marco activo.
Debido a un problema con algunas versiones de Internet Explorer, si fija el ancho del borde a 4 o menos, los bordes sern invisibles cuando el documento se despliegue en el navegador. No confunda las propiedades del marco con las del documento abierto en el marco. Las propiedades de un documento en un marco son idnticas a las de un documento solo; pueden ser vistas y modificadas dentro del dilogo Propiedades del Documento (Formato > Propiedades del Documento).
4.10: Modificando las propiedades de un documento
138
Captulo 5
5.4.9 Determinando un mensaje para navegadores que no incluyen marcos

El mensaje de sin marcos es mostrado cuando un conjunto de marcos es abierto en un navegador que no los puede desplegar. La mayora de los navegadores modernos incluyendo las ltimas versiones de Netscape e Internet Explorer pueden desplegar marcos, pero los navegadores muy antiguos o bsicos no pueden. Es en estos navegadores donde el mensaje se despliega cuando el usuario intenta abrir un conjunto de marcos. Para ver o modificar el mensaje, haga clic en la solapa Mensaje en la parte inferior de la ventan de Edicin. El mensaje predeterminado es Esta pgina contiene marcos. Se requiere un navegador Web que incluya marcos para poder verla. El mensaje es solamente el contenido del documento del conjunto de marcos. Por lo tanto, se puede editar como cualquier otro documento Web. Normalmente, sin embargo, su contenido es invisible debido a que la mayora de los navegadores modernos s incluyen el uso de marcos.
5.4.10 Modificando las propiedades de un documento de conjunto de marcos

Puesto que el documento del conjunto de marcos es solamente un documento ordinario HTML, tiene propiedades como cualquier otro. Para ver o modificar las propiedades del documento, use el comando Marcos > Propiedades de los marcos. Sin embargo, como un documento de un conjunto de marcos es invisible para los visitantes del sitio, la mayora de sus propiedades son irrelevantes, aunque es posible cambiarlas todas. (Todas las propiedades son relevantes si el navegador usado para ver el conjunto de marcos no los puede desplegar, en cuyo caso desplegar el contenido del documento del conjunto de marcos usualmente mensaje para navegadores que no usan marcos.) Las propiedades del documento del conjunto de marcos que son relevantes cuando el navegador puede desplegar los marcos se listan a continuacin. En la solapa General:
Ttulo. El ttulo del documento que se muestra en la barra de ttulo del navegador. Palabra clave. Las palabras del documento que pueden ser usadas por las mquinas de bsqueda de Internet, tal como lo hara con cualquier otro documento web.
En la solapa Estilos:
Efectos de pgina avanzados. El efecto seleccionado operar en el conjunto de
marcos como una unidad.

Sonido de fondo. El sonido seleccionado se reproducir cuando el conjunto de
marcos sea abierto.

Marcos y conjuntos de marcos 139
En la solapa Avanzado:
URL para ir a: El documento especificado ser abierto, reemplazando el conjunto de marcos dentro de la ventana del navegador.
5.4.11 Un ejemplo de conjunto de marcos

Alguno de los conceptos con respecto a los conjuntos de marcos puede ser difcil de entender la primera vez que se crea uno de ellos. En esta seccin, trataremos el proceso de creacin, de edicin y de guardar un ejemplo de conjunto de tres marcos: un pequeo marco en la parte superior utilizado como titular, un marco angosto en el lado izquierdo que contendr la lista de vnculos y finalmente, un gran marco del lado derecho que desplegar los documentos a los cuales se refieren los vnculos que se encuentran en el marco de la izquierda. Primero, crearemos un nuevo conjunto de marcos utilizando una de las plantillas localizadas dentro del dilogo Nuevo.
1 Use el comando Archivo > Nuevo para abrir el dilogo Nuevo. 2 Cambie a la solapa Marcos y seleccione la plantilla llamada Titular, Contenido,
Cuerpo. Haga clic sobre el botn Aceptar.
He aqu cmo se vera nuestro nuevo conjunto de marcos vaco dentro de la ventana de Edicin:
140
Captulo 5
Ahora crearemos un titular sencillo agregando unas cuantas palabras en el marco superior (el marco titular.)
3 Haga clic dentro del marco de titulares para activarlo. 4 Escriba algunas palabras, tales como Recorrido por Namo WebEditor 4. 5 Dele el formato deseado al texto.
Ya hemos creado nuestro documento del titular, ahora necesitamos guardarlo.

6 Haga que el marco del titular se active, si no est activado ya. 7 Use el comando Archivo > Guardar. 8 En el dilogo Guardar como, seleccione una carpeta donde guardar el documento,
proporcione un nombre de archivo (usaremos banner.htm) y haga clic sobre el botn

Guardar.
Ahora colocaremos una lista de vnculos en el marco izquierdo (el marco de contenido). Crearemos una lista de vnculos a algunos documentos que ya hayamos previamente creado y guardado.
9 Haga clic dentro del marco de contenido para activarlo. 10 Escriba el nombre de los documentos, cada uno en su propio prrafo. 11 Cree un vnculo en cada uno de los nombres que apunte al documento correspondiente
dentro del disco duro.

12 Dele el formato deseado al texto.
Nuestro conjunto de marcos ahora se ve as:
141
Uno de los vnculos dentro del marco de contenido es demasiado largo para caber en una sola lnea. No estamos satisfechos con esto, as que hagamos el marco de contenido un poco ms ancho.
13 Haga clic sobre el borde derecho del marco de contenido y arrstrelo un poco hacia la
derecha.
La apariencia ha mejorado. Guardemos el documento del marco de contenido.

14 Active el marco de contenido, si no est activado ya. 15 Guarde el documento del marco del contenido (Archivo > Guardar) con el nombre
links.htm, en la misma carpeta donde guard banner.htm. Ahora tenemos que definir el documento predeterminado para el marco de detalle (el marco grande a la derecha). Este marco desplegar los documentos a los cuales se refieren los vnculos dentro del marco de contenido. Puesto que el primer documento listado dentro del marco de contenidos es una introduccin, utilicemos esto como el documento predeterminado del marco de detalle. Cuando los visitantes a nuestro sitio web abran este conjunto de marcos en su navegador, ser el primer documento que vern en el marco. Para fijar el documento predeterminado del marco de detalle, primero tenemos que abrir el documento deseado dentro del marco.
142
Captulo 5
16 Haga clic dentro del marco de detalle para activarlo. 17 Use el comando Marcos > Abrir Documento en Marco. 18 Seleccione el documento de introduccin (intro.htm) y haga clic en Abrir.
He aqu cmo se ve nuestro conjunto de marcos en este momento, con el archivo intro.htm abierto en el marco de detalle:
Para terminar definiendo a intro.htm como nuestro documento predeterminado dentro del marco de detalle, primero necesitamos salvar el documento que contiene a los marcos.
19 Use el comando Marcos > Guardar Marcos. 20 En el dilogo Guardar como, abra la carpeta deseada y proporcione el nombre del
documento (en nuestro caso le llamaremos feature_tour.htm)

21 Podemos aprovechar para fijar un ttulo al documento de los marcos. Teclee el ttulo
deseado dentro del recuadro Ttulo.

22 Finalmente, haga clic en Guardar.
El siguiente paso es importante. Necesitamos hacer que el marco de detalle sea el destino predeterminado del marco de contenidos, de tal forma que cuando un visitante del sitio web haga clic en alguno de los vnculos del marco de contenidos, el documento concerniente se abra en el marco de detalle.
23 Haga clic dentro del marco de contenido para activarlo. 24 Use el comando Marcos > Propiedades del Marco para abrir el dilogo Propiedades
del Marco.
25 En la lista Marco predeterminado destino, seleccione el nombre del marco a ser
utilizado como destino predeterminado. (Afortunadamente, el marco de detalle ya tiene un nombre detalle puesto que el nombre ha sido predefinido dentro de la plantilla del conjunto de marcos.)
143
Casi hemos terminado. La ltima accin a realizar es volver a guardar el documento con el conjunto de marcos. Ya que estamos en ello, tambin deberamos guardar todos los documentos que se encuentran en los marcos, para asegurarnos que todo ha sido almacenado.
27 Use el comando Marcos > Guardar Todos.
Hemos terminado. Creamos un conjunto de marcos consistente en tres marcos bsicos. Veamos cmo queda nuestro conjunto de marcos dentro de la ventana Vista Previa de Marcos para asegurarnos de que los vnculos dentro del marco de contenido abren el marco de detalle, tal como lo queramos desde un principio.
28 Haga clic en la solapa Vista Previa de Marcos en la parte inferior de la ventana de
Edicin. Haga clic en cualquiera de los vnculos del marco de contenidos, verificando que el documento al cual se refiere, se abra dentro del marco de detalle. He aqu nuestro conjunto de marcos tal como se ve dentro de la ventana de Vista Previa de Marcos, una vez que se hace clic en el tercer vnculo del marco de contenido.
144
Captulo 5
5.5 Importando hojas de clculo

Si tiene alguna informacin dentro de una hoja de clculo de Microsoft Excel, puede copiarla con toda facilidad a una tabla dentro de un documento web al utilizar la caracterstica de importacin de Namo WebEditor; mucho ms conveniente que volver a teclear toda la informacin. No slo es posible importar una tabla de Excel, sino que se puede crear un vnculo a la hoja de clculo original o incrustar una copia de forma invisible dentro del documento Web. Esto permite editar la tabla original dentro de Excel sin tener que volver a importarla.
5.5.1 Importando una hoja de clculo como una tabla esttica

Si solamente desea importar una hoja de clculo Excel y convertirla en una tabla estndar HTML, sin crear un vnculo, haga lo siguiente:
1 Coloque el punto de insercin en la posicin del documento activo en el cual desea
insertar la tabla importada.

2 Seleccione el comando Importar > Avanzado > Hoja de Clculo. Esto abrir el dilogo
Hoja de Clculo.
3 Bajo Origen, seleccione Archivo Excel y haga clic en el botn Examinar. 4 En el dilogo Abrir, localice y seleccione la hoja de clculo Excel a importar en su disco
duro y haga clic sobre Abrir.

5 Bajo Mtodo de insercin, seleccione Importacin esttica. 6 Haga clic sobre el botn Aceptar.
Excel se abrir momentneamente mientras la hoja de clculo se inserta dentro del documento como una tabla esttica HTML. Ahora se le puede dar formato a la tabla segn se requiera. En la imagen siguiente, mostramos una tabla de ejemplo tal como se ve dentro de Excel y luego cmo se ve una vez que se ha importado a un documento web.
Importando hojas de clculo
145
Antes de importar
Despus de importar
Se trata de mantener tanto del formato original de la tabla como sea posible cuando se importa hacia un documento web.
5.5.2 Importando una hoja de clculo vinculando o incrustando

Si vinculamos o incrustamos la hoja de clculo original dentro del documento web al importarla, mantendremos la habilidad de editar la tabla posteriormente en Excel. De esta manera, los cambios que se realizan dentro de Excel se reflejan de forma instantnea y automtica dentro de la tabla HTML. Tanto el proceso de vincular como el de incrustar producen el mismo resultado. La diferencia entre ellos es que al incrustar una copia de una hoja de clculo dentro de un documento web removemos la dependencia del archivo original, a expensas de incrementar el tamao del archivo del documento Web. Para importar una hoja de clculo de Excel ya sea vinculando o incrustando, haga lo siguiente:
1 Coloque el punto de insercin en la posicin del documento donde desea insertar la tabla
importada.
146
Captulo 5
2 Seleccione el comando Importar > Avanzado > Hoja de Clculo. Esto abrir el dilogo
Hoja de Clculo.
3 Bajo Origen, seleccione Archivo Excel y haga clic en Examinar. 4 En el dilogo Abrir, localice y seleccione la hoja de clculo Excel que desea importar en
su disco duro y haga clic sobre el botn Abrir.

5 Bajo Mtodo de Insercin, seleccione Vincular a la hoja de clculo original o
Incrustar en documento HTML.
Excel se abrir momentneamente, mientras que la hoja de clculo se inserta en el documento como una tabla HTML. Para editar la tabla importada dentro de Excel, haga lo siguiente:
1 Haga clic con el botn derecho del ratn en cualquier parte dentro de la tabla y seleccione
Editar Hoja de Clculo men de atajo. Excel se abrir ya sea con la hoja de clculo
original o con un archivo temporal que contiene la tabla, dependiendo si se seleccion vincular o incrustar.
2 Edite la hoja de clculo. 3 Una vez que termine de realizar los cambios, cierre el documento o salga de Excel. Si la
hoja de clculo original se encuentra vinculada, Excel le pedir que guarde los cambios realizados. Despus de una breve pausa, la tabla dentro del documento Web ser actualizada con los ltimos cambios. Si se importa una hoja de clculo vinculndola, puede editar directamente el contenido de la hoja de clculo original (sin tener que usar el comando Editar Hoja de Clculo de Namo WebEditor) y luego actualizar la tabla dentro del documento web al presionar con el botn derecho del ratn sobre ella y seleccionando Actualizar Contenido de la Hoja de Clculo en el men de atajo.
Una vez que se ha importado una hoja de clculo utilizando vnculo o incrustacin, no modifique el contenido o el formato de la tabla dentro de la ventana de Edicin a menos que no planee modificar su contenido dentro de Excel. Si se edita la tabla en Excel, cualquier cambio que se haya realizado dentro de la ventana de Edicin se perder y el contenido de la tabla y su formato cambiarn de nuevo al original que se encuentra en Excel. Por lo tanto, si desea cambiar el contenido o formato de la tabla, solamente hgalo en Excel. Si importa una hoja de clculo utilizando vinculacin y luego mueve el archivo original, el vnculo quedar roto y no ser posible volver a editar la tabla en Excel. Para evitar este problema, incruste una copia de la hoja de clculo original dentro del documento web en lugar de utilizar vnculo.
Importando hojas de clculo
147
5.5.3 Convirtiendo una tabla existente

Para hacer que una tabla existente dentro de un documento web se pueda editar en Excel, haga lo siguiente:
1 Coloque el punto de insercin dentro de la tabla. 2 Seleccione el comando Importar > Avanzado > Hoja de Clculo. Esto abrir el dilogo
Hoja de Clculo.
3 Bajo Origen, seleccione Tabla activa en el documento. 4 Bajo Mtodo de insercin, seleccione Incrustar en documento HTML. 5 Haga clic sobre el botn Aceptar. Excel se ejecutar y desplegar la tabla. 6 Si desea, puede realizar algn cambio en este momento, para posteriormente salir de
Excel. Si no quiere hacer cambios, salga de Excel. Una vez que salga de Excel, la tabla volver a ser insertada en el documento, reemplazando la anterior. Ahora ser posible editar la tabla usando Excel en cualquier momento al hacer clic sobre ella con el botn derecho del ratn y seleccionar Editar Hoja de Clculo dentro del men de atajo.
148
Captulo 5
5.6 Creando un grfico desde una tabla

El Asistente de Grficos de Namo WebEditor crea una gran variedad de grficos de los valores numricos de una tabla. Por ejemplo, el Asistente de Grficos puede tomar las etiquetas y valores de la siguiente tabla:
1997 Canad EE.UU. Francia 251 302 232 1998 320 380 265 1999 454 490 364 2000 497 545 423
y crear esta grfica:
El grfico es insertado en el documento como una imagen GIF estndar, pero es posible editar sus propiedades (valores de los datos, tipo de grfico, colores, etc.) en cualquier momento. Namo WebEditor generar una nueva imagen. Una vez que se ha creado el grfico, ste ya no depende de la tabla de la cual toma sus valores. Se puede inclusive borrar esta tabla, el grfico se mantendr en su sitio con sus valores.
5.6.1 Conceptos bsicos de grficos

Antes de comenzar a usar el Asistente de Grficos, debe familiarizarse con dos conceptos bsicos de las tablas y los grficos: series de datos y categoras. Cada tabla o grfica tiene por lo menos una serie de datos un conjunto de valores que cambia con el tiempo o conforme otra variable cambia. Los grficos ms sencillos son aquellos que solamente tienen una serie de datos, tal como se muestra en el siguiente ejemplo:
Creando un grfico desde una tabla
149
En el grfico superior, que muestra los cambios de la altura de Juan en diez aos, la nica serie de datos es la altura de Juan. Sin embargo, los grficos ms complejos tienen normalmente ms de una serie de datos, tal como se muestra en el siguiente ejemplo:
El grfico compara las ventas unitarias en tres pases de cuatro productos. Existen tres series de datos: Canad, Estados Unidos y Francia. (Dentro de una serie de datos, todos los valores se representan con el mismo color.) Los productos Productos A, Producto B, etc. se denominan categoras. Cada categora tiene un valor de la serie de datos asociado. Siguiendo con el mismo ejemplo, si intercambiamos las series y las categoras de forma tal que los productos se vuelvan series y los pases categoras, obtenemos el siguiente grfico:
La forma de organizar el grfico en series y categoras depende de qu se desea comunicar. En el primero de los dos grficos de ventas mostrados arriba, el objetivo primario comparado eran los tres pases y esa comparacin se realizaba en cuatro categoras (productos). En el segundo grfico la comparacin era realizada entre los cuatro productos y esta comparacin se realizaba en tres categoras (pases).
150
Captulo 5
Para resumir, los valores que se comparan se agrupan en categoras y cada categora tiene un valor de la serie de datos.
5.6.2 Ejecutando el Asistente de Grficos

Antes de iniciar el Asistente de Grficos, se debe decidir si se quiere crear un grfico utilizando todas las celdas de una tabla o solamente parte de ellas. Si se desea utilizar toda la tabla, coloque el punto de insercin en cualquier lugar dentro de la tabla. Si se desea solamente utilizar una parte de las celdas, primero se debe seleccionar. El siguiente paso es utilizar el comando Insertar > Avanzado > Grfico para iniciar el Asistente de Grficos. Una vez que se hayan completado todos los pasos del asistente, el grfico se inserta debajo de la tabla. El asistente consiste de tres pasos, descritos en las siguientes tres secciones. Para propsitos de describir las varias opciones, utilizaremos la tabla de ejemplo que mostramos en la seccin precedente.
5.6.3 Paso 1: Seleccionar el tipo de grfico
Como primer paso se debe seleccionar un grfico bsico a utilizar usando los botones que se encuentran en la parte superior del dilogo. Los tipos bsicos disponibles son: columnas, barras, lnea, circular, donut (dona), rea apilada, anillos y radial. Luego se selecciona el tipo usando los iconos grandes dentro del recuadro de seleccin. Cuando se hace clic sobre un icono, una descripcin aparece debajo del rea de seleccin.
151
Si requiere de un efecto en tercera dimensin, utilice la opcin Usar efecto 3D en la seccin Efecto 3D. (Esta opcin no se encuentra disponible para grficos de lnea, dispersos, rea apilada o radial.) Si selecciona la opcin Usar efecto 3D, puede tambin especificar la profundidad del efecto y el ngulo de perspectiva. Haga clic en el botn Siguiente para continuar con el prximo paso del asistente.
Para las descripciones y ejemplos de los varios tipos de grficos, refirase al tema Tipo de grfico bajo Creando Grficos del sistema de ayuda en lnea de Namo WebEditor. Muchas veces el usar efectos en tercera dimensin hace difcil leer el grfico de forma precisa. En general, solamente se deben usar estos efectos si se quieren comunicar valores de tamao relativos, en lugar de valores precisos.
5.6.4 Paso 2: Especificar series y categoras
En el segundo paso del Asistente de Grficos, ste lee la tabla para crear el grfico deseado. Aunque el asistente intenta adivinar de forma inteligente cmo debe leer la tabla, muchas veces esto no resulta. En este paso se le da la oportunidad de corregir cualquier interpretacin errnea que haga el asistente. El asistente supone que cada columna de la tabla, con la posible excepcin de la primera, contiene una serie de datos y que cada rengln, con la posible excepcin del primero, contiene una categora. Si su tabla est ordenada de otra forma con las series de datos en los renglones y las categoras en las columnas seleccione la opcin Intercambiar ejes X/Y. Al seleccionar esta opcin no realizamos una transposicin de renglones y columnas dentro de la tabla, sino que, el asistente lee internamente de esta forma los datos. Esta representacin
152
Captulo 5
interna se despliega dentro del rea de vista previa en la parte superior derecha del dilogo del Asistente de Grficos. Basndose en el contenido de la tabla, el asistente intenta adivinar si el primer rengln (en su representacin interna de la tabla) contiene nombres de series o valores. El asistente, automticamente, selecciona o no la opcin Primer rengln contiene nombres de series, dependiendo de su decisin. Para verificar las decisiones del asistente, examine el rengln amarillo marcado Series en el rea de vista previa. Si el rengln amarillo contiene elementos que no deben ser tratados como valores, quite la opcin Primer rengln contiene nombres de series. Esto hace que los valores se muevan dentro del rea blanca de la zona de vista preliminar. Si el rengln amarillo se encuentra vaco y el rengln blanco debajo de l contiene elementos que deben de ser tratados como nombres de series, seleccione la opcin Primer rengln contiene nombres de series. Esto har que los nombres de las series pasen al rengln amarillo. De manera similar, el asistente intentar adivinar si la primera columna (en su representacin interna de la tabla) contiene nombres de categoras o valores. El asistente selecciona o no, de forma automtica, la opcin Primera columna contiene nombres de categoras, dependiendo de su seleccin. Para verificar la decisin del asistente, examine la columna verde marcada como Cat en el rea de vista previa. Si la columna verde contiene elementos que no deben ser tratados como valores, quite la opcin Primera columna contiene nombres de categoras. Esto har que los valores se muevan a la derecha, dentro del rea de datos. Si la columna verde se encuentra vaca y en la columna blanca a su derecha estn los elementos que deben ser tratados como nombres de categoras, seleccione la opcin Primera columna contiene nombres de categoras. Esto har que los nombres de las categoras pasen a la columna verde. Verifique la apariencia del grfico en el rea Vista previa del grfico y luego presione sobre el botn Siguiente para continuar con el tercer y ltimo paso del asistente.
153
5.6.5 Paso 3: Especificar el ttulo de un grfico
En este ltimo paso del Asistente de Grficos, se le da un ttulo opcional al grfico, se selecciona su posicin y, opcionalmente, se le coloca un nombre a los ejes. Proporcione un ttulo para el grfico dentro del recuadro Ttulo del grfico y su posicin usando los botones de opcin Localizacin del ttulo del grfico. Los ttulos de los ejes X / Y se ajustan en Ttulos de los ejes. Verifique la apariencia del grfico en la Vista Previa del Grfico y luego haga clic sobre el botn Finalizar para salir del Asistente de Grficos. El grfico ser insertado bajo la tabla de la cual fue creado.
5.6.6 Cambiando de tamao y modificando un grfico

Para cambiar el tamao de un grfico, primero seleccinelo haciendo clic sobre l y luego haga clic sobre cualquiera de sus manijas y arrstrela al tamao deseado. Los grficos pueden cambiarse al tamao deseado sin prdida de calidad, puesto que Namo WebEditor genera una nueva imagen GIF cada vez que el grfico cambia. Varias opciones y propiedades del grfico pueden ser modificadas dentro del dilogo Propiedades del Grfico. Para abrir este dilogo, haga doble clic sobre el grfico. El dilogo contiene siete solapas. En la primera, Tipo, se puede cambiar el tipo o subtipo de grfico; equivale al primer paso del Asistente de Grficos. La segunda solapa, Ttulo, permite cambiar los ttulos del grfico y los ejes. Adems, permite seleccionar la localizacin de la leyenda de grfico u ocultarla; equivale al tercer paso del Asistente de Grficos. Las solapas restantes que se encuentran dentro del dilogo Propiedades del Grfico son descritas en las siguientes cinco secciones.
Cuando se cambia el tamao de un grfico, sus elementos de texto tales como el ttulo, en las etiquetas de los ejes y rtulos de los datos mantienen el mismo tamao. El tamao de los elementos de texto puede ser modificado dentro de la solapa Formato del grfico del dilogo Propiedades del Grfico (vea la seccin 5.6.11 ms abajo).
5.6.7 Modificando las opciones de las series

La solapa Series del dilogo Propiedades del Grfico permite modificar ciertas opciones para cada una de las series de datos en un grfico. Adems, le permite seleccionar una posicin para la leyenda del grfico u ocultarla.
Para modificar las opciones de una serie, primero seleccinela dentro de la lista que se encuentra a la izquierda del dilogo. Las opciones se describen a continuacin.
Nombre de las series
El nombre de la serie seleccionada. Si eligi la opcin Primer rengln tiene el nombre de las series en el segundo paso del Asistente de Grficos, el nombre puede ser cambiado. De otra manera, puede teclear el nombre seleccionado dentro del recuadro. El nombre de la serie se utiliza para identificarla en el ttulo del grfico.
Graficar serie en
De manera predeterminada, los valores de todas las series se grafican en el eje primario Y, cuya escala se encuentra del lado izquierdo del grfico. Para graficar una serie seleccionada en un eje Y alterno, elija la opcin Alternar eje. La escala del eje alterno se agrega del lado derecho del grfico. (Use los parmetros dentro de la solapa Ejes para modificar sus propiedades.) Mostramos a continuacin un ejemplo de un grfico con un eje Y primario y alterno:
155
Etiquetas de los Datos
Seleccione un tipo de etiqueta para agregar a cada uno de los puntos de datos. Las elecciones disponibles son Ninguna, Nombre de las series y Valores de los datos.
Opciones grfico circular 3D
Para un grfico del tipo circular o donut con efecto de tercera dimensin habilitado, se puede elegir extraer o elevar una de las rebanadas correspondientes a una serie seleccionada, para hacer que resalte de las otras.
Barra de Error
Los grficos de columnas, barras o lneas pueden tener barras de errores dentro de ciertos puntos en cualquier serie. Seleccione el tipo de barra de error dentro de la lista y luego el formato utilizando los botones de opcin.
Leyenda
Seleccione la posicin de la leyenda o utilice la opcin Ocultar leyenda para no mostrarla.
5.6.8 Editando los valores en un grfico

Una vez creada, la grfica no depende de la tabla de la cual fue generada. El Asistente de Grficos copia los nombres y valores de la tabla a una parte del documento que se mantiene invisible dentro de la ventana de Edicin o en un navegador. Es esta copia la que permite que el grfico se despliegue. Como resultado de esto, no se pueden editar los valores del grfico cambiando los de la tabla de la cual fue creada. An si se borra la tabla, esto no tiene ningn efecto sobre el grfico. Se pueden, sin embargo, editar los valores de un grfico utilizando la solapa Valores del dilogo Propiedades del Grfico. Dentro de esta solapa podemos tambin intercambiar los ejes del grfico, de forma tal que las series de datos se vuelvan categoras y viceversa.
156
Captulo 5
La tabla en forma de hoja de clculo en la parte superior del dilogo despliega los nombres de las series, nombres de las categoras y valores utilizados en el grfico. Para editar un nombre o un valor, haga doble clic sobre el grfico y proporcione el nuevo nombre o valor. De manera alternativa, seleccione la celda que contiene el nombre o valor a cambiar y modifquelo dentro del recuadro Valor. Para deshacer cualquier cambio, presione las teclas <Ctrl + Z>. Presione varias veces las teclas <Ctrl + Z> para deshacer cambios mltiples. Haga clic en el botn Intercambia ejes X/Y para alternar las series de datos y categoras dentro del grfico.
5.6.9 Agregando y eliminando series de datos o categoras

Puede usar la solapa Valores para agregar o eliminar series de datos o categoras dentro del grfico editando aquellas que se encuentran dentro de la tabla en la parte superior del dilogo. Para agregar una nueva serie de datos, haga clic con el botn derecho del ratn dentro del encabezado de la columna y seleccione el comando Insertar Columnas dentro del men de atajo. La nueva serie de datos ser insertada a la izquierda de la columna seleccionada. Para agregar una nueva serie de datos al final de todos los valores, haga clic con el botn derecho del ratn sobre el rea gris que se encuentra a la derecha del ltimo encabezado de columna.
157
Para agregar una nueva categora, haga clic con el botn derecho del ratn sobre el encabezado del rengln y seleccione el comando Insertar Renglones en el men de atajo. La nueva categora se inserta en el rengln superior del seleccionado. Para agregar una nueva categora al final de todas, haga clic con el botn derecho del ratn sobre el rea gris que se encuentra debajo del ltimo encabezado de rengln. Una vez que se ha agregado una serie de datos o categora, proporcione sus nombres y valores directamente en la tabla haciendo doble clic en cada una de las celdas o utilizando el recuadro Valor. Para eliminar una serie de datos o categora, haga clic con el botn derecho del ratn en el encabezado correspondiente del rengln o columna y seleccione el comando Borrar Columnas o Borrar Renglones del men de atajo. Para deshacer cualquier cambio, presione las teclas <Ctrl + Z>. Presione varias veces las teclas <Ctrl + Z> para deshacer cambios mltiples.
5.6.10 Agregando lneas de tendencia

La solapa Tendencia del dilogo Propiedades del Grfico permite agregar una lnea de tendencia a cualquier serie de datos de un grfico.
Para agregar una tendencia a una serie, haga lo siguiente:

1 Seleccione la serie en la lista Seleccionar serie. 2 Seleccione un tipo de lnea de tendencia en la lista Tipo de tendencia. 3 Si el tipo seleccionado de tendencia es Promedios variables, especifique el Intervalo en
Opciones de la tendencia. Si seleccion Polinomial, especifique el Grado en Opciones de la tendencia.
158
Captulo 5
4 Haga clic en el botn Agregar. La lnea seleccionada de tendencia aparecer dentro de la
lista Desplegar tendencias. Si desea mostrar la serie de datos y tipo de cada una de las lneas de tendencia, seleccione la opcin Mostrar lneas de tendencia en la leyenda en Opciones de la tendencia. El color, estilo y espesor de cada una de las lneas de tendencia se pueden modificar dentro de la solapa Formato de grfico (vea la seccin 5.6.12).
5.6.11 Modificando las opciones de los ejes

La solapa Ejes del dilogo Propiedades del Grfico le permite configurar la escala del eje primario Y y, si existe, del eje secundario Y de un grfico.
Primero debe seleccionar el eje Y a modificar dentro de la lista que se encuentra en el lado izquierdo del dilogo. Para cambiar el tipo de escala del predeterminado lineal a cualquier otro, seleccinelo dentro de la lista Tipo de escala. Adems de la lineal, existen dos del tipo logartmico. De manera predeterminada, los rangos de escala e intervalos entre las rejillas se configuran de forma automtica. Para hacerlo manualmente, deshabilite la opcin Configurar rango de datos automticamente y luego proporcione los valores mximos y mnimos, los intervalos entre las rejillas mayores y el nmero de rejillas menores entre las mayores. Se puede tambin editar el ttulo del eje seleccionado dentro del recuadro Ttulo.
159
5.6.12 Modificando la apariencia de un grfico

La solapa Formato del grfico del dilogo Propiedades del Grfico permite modificar la apariencia de cualquiera de los elementos del grfico.
Las propiedades de la apariencia se dividen en cuatro categoras: Texto, Color, Lneas / bordes y Datos. No todas las categoras se pueden aplicar a cualquier elemento del grfico. Por ejemplo, los atributos de texto no pueden aplicarse a las rejillas. Si una categora no se puede aplicar a un elemento seleccionado, las opciones dentro de esa categora se encuentran en un tono gris (deshabilitadas). La categora Datos es la nica que se puede aplicar a series de datos. Para modificar la apariencia de un elemento, primero seleccinelo dentro de la lista que se encuentra en la parte izquierda del dilogo. Cada serie de datos se encuentra dentro de la lista con un nmero entre parntesis cuadrados, seguida por el nombre de la serie, si existe, por ejemplo, [3] Francia. Si el grfico cuenta con lneas de tendencia, cada una de ellas se encuentra dentro de la lista por el nombre de la serie de datos a la cual se aplica, seguido por el tipo de tendencia, por ejemplo, Francia, Lineal. Algunos elementos cuentan con propiedades opcionales que se encuentran ocultas de manera predeterminada. Por ejemplo, el ttulo principal puede tener un color de fondo y un borde, pero estos se encuentran ocultos en un principio. Para hacer visible una propiedad y seleccionar un parmetro para ella, deshabilite la opcin Ocultar localizada a un lado del control de la propiedad. Use las opciones Vista previa del elemento y Vista Previa del Grfico para verificar los efectos de cualquier modificacin que se haga a un elemento.
160
Captulo 5
Si selecciona Fondo en la lista de elementos y Ocultar en la categora de Color, el fondo de grfico ser transparente. Cualquier color o imagen aplicada al fondo del documento ser visible a travs del grfico.
5.6.13 Cambiando la carpeta predeterminada de los archivos de imagen de un grfico

De forma predeterminada, Namo WebEditor guarda las imgenes de los grficos en una carpeta llamada images dentro de la carpeta que contiene el documento con el grfico. Esta carpeta se crea de forma automtica si no existe. Por ejemplo, si un documento que contiene un grfico es almacenado en el directorio C:\html, Namo WebEditor guarda la imagen de grfico que contiene en el directorio C:\html\images. Para cambiar la carpeta en la cual se guardan los grficos de las imgenes, haga lo siguiente:
1 Use el comando Herramientas > Preferencias para abrir el dilogo Preferencias. 2 Cambie a la solapa Editar Preferencias. 3 En el recuadro Guardar ecuaciones e imgenes de grficos en, proporcione la ruta de
acceso a la carpeta en la cual se almacenarn las imgenes de los grficos, en trminos relativos al directorio donde se encuentra el documento.
De este momento en adelante, todas las nuevas imgenes de grficos se almacenarn en la carpeta especificada relativa a aqulla en la cual se almacenan los documentos. Cualquier imagen de un grfico ya existente en un documento abierto se copia a la nueva carpeta cuando el documento se guarda. Sin embargo, cualquier imagen ya existente en un documento que no se encuentra abierto no ser copiada a la nueva carpeta hasta que se abra el documento. A continuacin mostramos algunos ejemplos de caminos de acceso relativos.
Ruta de la Carpeta images\ images\charts\ .\ ..\ ..\images\ Localizacin de la carpeta Una subcarpeta de la carpeta del documento. Una subcarpeta de una subcarpeta de la carpeta del documento. La misma carpeta que la del documento. La carpeta padre de la carpeta donde se encuentra el documento. Una carpeta al mismo nivel que la carpeta del documento.
Cuando se publica un documento que contiene grficos, asegrese tambin de publicar la carpeta donde estn las imgenes de los grficos.
161
5.7 Creando formularios Web

Uno de los factores que hacen que la web tenga tanto xito es que es un medio de dos vas: no solamente la gente puede obtener informacin del sitio web, sino que tambin puede enviar la informacin al servidor que sirve de anfitrin a este sitio. Esta informacin puede ser procesada y usada por el operador del sitio de varias maneras. El mtodo principal de recolectar informacin de un visitante de un sitio web es el formulario. Un formulario es un rea dentro del documento web en la que el visitante del sitio puede proveer informacin que se enva al servidor web. El formulario contiene una serie de elementos del formulario. Estos elementos incluyen campos del formulario y/ o controles de seleccin, que son elementos tales como cajas de texto y botones de opcin que el visitante utiliza para registrar su informacin o sus elecciones. El formulario tiene por lo menos un botn el botn de envo que hace que el navegado enve informacin al servidor cuando se presiona sobre l. (El botn de envo puede ser invisible, en cuyo caso al presionar la tecla <Intro> mientras el punto de insercin se encuentra en una caja de texto, hace que la informacin se enve al servidor.) Se puede pensar en un formulario web como una versin electrnica de un formulario en papel. En ambos casos, una persona llena la forma y luego la enva o entrega a alguien. En el caso de un formulario de papel, la forma se enva a otra persona o a una organizacin entregndola a un tercero, colocndola en una caja de entrada o envindola por correo. En el caso de los formularios web, el formulario se enva al servidor web al presionar un botn dentro de la ventana del navegador. Mostramos a continuacin un ejemplo sencillo de un formulario que puede ser utilizado por un cliente para realizar un pedido en lnea:
162
Captulo 5
Cuando el visitante del sitio presiona sobre el botn de envo de un formulario, el navegador enva los elementos del formulario nombre y valor a un servidor web. (El nombre y valor de un control de seleccin, no son enviados a menos que sean seleccionados.) Para la imagen del ejemplo anterior, la informacin que se enva al servidor podra ser la siguiente: nombre=Julia Snchez calle=Mi calle 123 ciudad=Pueblillo estado=MD cp=32256 email=jsan@kasdjkdj.com producto=nw4 paga con tarjeta crdito=s visa_mc=s nmero=1234 5678 9012 3456 mes exp=12 ao exp=00 envia=Envia pedido Note que el nombre del elemento del formulario no es el mismo que su etiqueta, que aparece como un texto comn y corriente a un lado del elemento. El nombre del elemento es parte de su definicin, que es almacenada dentro del cdigo fuente HTML del documento. Para que un formulario web sea til, debe existir un programa del lado del servidor al cual se enva la informacin para realizar algo con ella. El programa puede ser tan sencillo que solamente inserte la informacin dentro de la base de datos de la compaa o puede ser algo mucho ms sofisticado, como un programa que genere dinmicamente un documento web cuya informacin se determine de alguna manera por aquella que se encuentre dentro del formulario. Si bien es cierto que se puede utilizar Namo WebEditor para crear el formulario Web, Namo WebEditor no incluye ninguna funcionalidad para manejar el formulario. Se debe instalar un programa del lado del servidor web que pueda manejar el formulario. (Existe una excepcin a esta regla: se puede crear un formulario que utilice el navegador web para enviar informacin a una direccin de correo electrnico. Esto no requiere ningn programa del lado del servidor, puesto que el navegador mismo maneja el formulario.)
5.7.1 Creando un formulario e insertando elementos

Para crear un formulario, sencillamente inserte aquellos elementos que sern utilizados dentro del documento utilizando el submen Campo de Formulario del men Insertar. No es necesario hacer nada especial para comenzar un formulario al insertar el primer elemento, todos aquellas etiquetas y marcas necesarias del formulario para que sea reconocido por un navegador Web se insertan de forma automtica en el documento. Dentro de la ventana de edicin, si no se ha deshabilitado la opcin de desplegar las marcas especiales de etiquetas (Ver > Marcadores > Marcas especiales de etiquetas), la presencia
Creando formularios Web 163
de un formulario en un documento se indica por un borde punteado, tal como se muestra en la siguiente imagen.
Tenga cuidado de asegurarse que el punto de insercin quede dentro de los bordes punteados al agregar ms elementos de formularios. De otra forma, crear inadvertidamente dos o ms formularios separados, cada uno de ellos con un conjunto incompleto de elementos. Por otro lado, si quiere crear ms de un formulario en el mismo documento, asegrese de mover el punto de insercin fuera del borde del formulario antes de agregar otro. A excepcin de los botones, campos de imagen y ocultos, cada elemento de un formulario debe tener una etiqueta. La etiqueta es sencillamente una o dos palabras de texto ordinario que se colocan a un lado del elemento. Las etiquetas no se encuentran activas y no son enviadas junto con la informacin del formulario sencillamente sirven para que el visitante a nuestro sitio sepa para qu es el elemento del formulario.
Si desea evitar que Namo WebEditor inserte de manera automtica las etiquetas del formulario al insertar el primer elemento, deshabilite la opcin Insertar > Campo de Formulario > Insertar etiquetas de formulario. Este elemento del men se encuentra activo de forma predeterminada.
5.7.2 Creando un formulario en una tabla

Si quiere ordenar los elementos de formularios en una tabla, se debe deshabilitar la insercin automtica de etiquetas de formulario junto con los elementos del mismo antes de agregar cualquiera de ellos. (Deshabilite Insertar > Campo de Formulario > Insertar etiquetas de formularios si se encuentra habilitada.) La razn para hacer esto es que cuando se inserta un elemento de un formulario dentro de la celda de una tabla, Namo WebEditor crea un nuevo formulario dentro de la celda. Esto se repite en cada celda donde se inserte un elemento. Puesto que todos los elementos en la tabla pertenecen al mismo formulario, se debe evitar que Namo WebEditor cree un nuevo formulario con cada celda al deshabitar la insercin automtica de etiquetas de formulario. Sin embargo, si se deshabilita la insercin automtica de etiquetas de formulario, stas deben insertarse manualmente una vez que se insertaron todos aquellos elementos requeridos dentro de la tabla. Para hacer esto, seleccione la tabla y utilice el comando Formato > Formulario. En el dilogo Propiedades del Formulario, especifique los parmetros del formulario o haga clic sobre el botn Aceptar para cerrar el dilogo y especificar los ajustes posteriormente. Una vez que se cierra el dilogo, las etiquetas se insertan alrededor de la tabla.
5.7.3 Agregando campos de entrada de texto

Existen dos tipos de campo de formulario que permiten al visitante introducir texto: caja de texto y cuadros combinados. El segundo de ellos permite al visitante del sitio introducir ms de una lnea de texto. A continuacin mostramos un ejemplo de los dos tipos de elementos de formularios:
Para agregar una caja de texto, haga lo siguiente:

1 Seleccione el comando Insertar > Campo de Formulario > Caja de Texto. El dilogo
Propiedades de la caja de texto aparece.
2 Proporcione un Nombre para identificar la caja de texto. 3 En Valor inicial, teclee un texto opcional que aparecer inicialmente dentro de la caja
cuando se despliegue en un navegador.

4 Especifique el Ancho en caracteres y la Longitud Mxima (tambin en caracteres). 5 Seleccione un Tipo de entrada. Para la mayora de los propsitos, seleccione Texto
estndar. Si selecciona Contrasea, cada carcter que sea introducido en el recuadro se mostrar como un asterisco en lugar del carcter tecleado. Si selecciona Nombre de archivo, un botn de Examinar se insertar a un lado de la caja de texto, permitiendo al
visitante del sitio seleccionar un archivo en su disco duro, cuyo nombre se insertar automticamente dentro del recuadro.
Para agregar un cuadro combinado, seleccione el comando Insertar > Campo de Formulario > Cuadro combinado. Los parmetros dentro del dilogo Propiedades del cuadro combinado son en su mayora exactamente iguales a los del cuadro de texto, a excepcin de la longitud mxima, en cuyo lugar se especifica el Nmero de lneas que tendr el cuadro. No existe la seleccin del tipo de entrada, que siempre es texto.
Creando formularios Web
165
5.7.4 Agregando controles de seleccin

Existen tres tipos de controles de seleccin que permiten al visitante del sitio elegir entre elementos mltiples previamente definidos:
Casilla de verificacin
Usualmente es utilizada para permitir que el visitante del sitio seleccione uno o ms elementos de un grupo. Una sola casilla de verificacin puede ser utilizada para que el visitante elija una respuesta del tipo S/no a una pregunta. Se usa para permitir al visitante seleccionar solamente un elemento dentro de un grupo de opciones mutuamente excluyentes.
Botn de opcin Men desplegable
Usado para permitir al visitante seleccionar uno ms elementos de un grupo. Un men desplegable puede presentar varias elecciones en un espacio relativamente pequeo.
A continuacin mostramos ejemplos de cada uno de los tipos de controles de seleccin:
Casilla de verificacin
Botn de opcin
Men desplegable
Para agregar una casilla de verificacin, haga lo siguiente:

1 Seleccione el comando Insertar > Campo de Formulario > Casilla de verificacin. El
dilogo Propiedades de la casilla de verificacin aparece.
2 Proporcione un Nombre para identificar la casilla. 3 Teclee un Valor que ser enviado al servidor si la casilla de verificacin es seleccionada. 4 Especifique un Estado inicial de la casilla de verificacin ya sea Marcada o No
marcada.
Para agregar un botn de opcin, seleccione el comando Insertar > Campo de Formulario > Botn de Opcin. Los ajustes dentro del dilogo Propiedades del botn de opcin son los mismos que para una casilla de verificacin. Para agregar un men desplegable, haga lo siguiente:
166
Captulo 5
1 Seleccione el comando Insertar > Campo de Formulario > Men desplegable. El
dilogo Propiedades del men desplegable aparecer.
2 Proporcione un Nombre para identificar al men desplegable. 3 Haga clic en el botn Agregar para agregar un elemento al men. El dilogo Parmetros
del men desplegable aparecer.
4 En Nombre, teclee el texto del elemento tal y como aparecer en el men. 5 Proporcione el Valor que se enviar al servidor si el elemento se selecciona. 6 Especifique si el elemento debe estar Seleccionado inicialmente. 7 Haga clic sobre el botn Aceptar para cerrar el dilogo Parmetros del men
desplegable.
8 Repita los pasos del 3 al 7 para cada elemento que quiera agregar al men. 9 Especifique la Altura del men con un nmero de lneas. Si la altura se fija a un valor
superior a 1, el control aparecer como una caja combinada en lugar de un men.

10 Especifique si desea Permitir selecciones mltiples en el men (o caja combinada.) 11 Haga clic sobre el botn Aceptar.
Si se habilita Permitir selecciones mltiples y el visitante realiza selecciones mltiples, cada uno de los valores de los elementos se enviar el servidor junto con el nombre de control. Por ejemplo, si un visitante selecciona ajedrez y estampillas en un men que se llama pasatiempos, tanto pasatiempos=ajedrez como pasatiempos=estampillas se enviar al servidor.
167
5.7.5 Agregando un campo oculto

Un campo oculto es utilizado para guardar valores estticos que se envan al servidor junto con el resto de la informacin de un formulario, pero que se mantiene invisible al visitante. Se puede utilizar un campo invisible, por ejemplo, para enviar el nombre del archivo del documento que contiene el formulario. Para agregar un campo oculto, haga lo siguiente:
1 Seleccione el comando Insertar > Campo de Formulario > Campo oculto. El dilogo
Propiedades del Campo Oculto aparecer.
2 Proporcione un Nombre para identificar el campo. 3 Proporcione el Valor que ser enviado al servidor. 4 Haga clic sobre el botn Aceptar.
En la ventana de edicin, un campo oculto de formulario se indica por un pequeo marcador amarillo similar a una casilla de verificacin parcialmente oscura: . Esta marca no es visible en un navegador ni en la ventana de vista previa.
5.7.6 Agregando botones

Un botn de comando permite al visitante del sitio indicar al navegador web una orden con respecto al formularia tal como enviar este formulario inmediatamente o limpiar este formulario. Algunas veces, un botn se usa en combinacin con una accin JavaScript que realiza alguna otra funcin cuando el botn es presionado. Para agregar un botn de comando, haga lo siguiente:
1 Seleccione el comando Insertar > Campo de Formulario > Botn de comando. El
dilogo Propiedades del botn de comando aparecer.
2 Proporcione un Nombre para identificar el botn. 3 En Valor, proporcione un texto para utilizar como etiqueta del botn. Si el tipo de botn
es Enviar, este valor tambin se transmitir al servidor.
168
Captulo 5
4 Seleccione un Tipo de botn. Si el tipo es Enviar, al presionar sobre el botn, se
transmiten los valores del formulario al servidor. Si se selecciona botn tipo Iniciar, el formulario volver a su estado inicial (sin valores). Si es General, el botn no realiza ninguna accin por s mismo, necesita anexarse a una accin JavaScript que realiza alguna funcin cuando el botn sea presionado.
5.7.7 Agregando un campo de imagen

Un campo de formulario de imagen acta de manera similar a un botn de envo. Al igual que un botn estndar de envo, al ser presionado, hace que la informacin del formulario se transmita al servidor web. A diferencia de un botn de envo, sin embargo, una imagen enva tambin las coordenadas X - Y del punto de la imagen donde el visitante hizo clic. La informacin es enviada utilizando el siguiente formato: nombre_campo.x = desplz_x nombre_campo.y = desplz_y Por ejemplo, si el nombre del campo de formulario de imagen es btnimagen, los valores enviados pueden ser: btnimagen.x = 92 btnimagen.y = 30 Para insertar un campo de formulario de imagen, haga lo siguiente:
1 Seleccione el comando Insertar > Campo de Formulario > Imagen. El dilogo
Propiedades del campo de formulario de imagen aparecer.
2 Proporcione un Nombre al identificar el campo de formulario de imagen. 3 Teclee la Ruta al archivo de imagen que se usar. Haga clic en el botn Examinar para
localizar y seleccionar un archivo en su disco duro o sobre el botn Clip Art para seleccionar una imagen de la librera clip art. Tambin se puede hacer clic sobre el botn
169
Proyecto para seleccionar un archivo de imagen de entre los documentos del proyecto
actual.
5.7.8 Modificando las propiedades de un formulario

En el dilogo Propiedades del Formulario es donde se puede especificar, entre otras cosas, el nombre del programa en el servidor que administrar el formulario.
Nombre del Formulario Marco destino
El nombre del formulario. Este nombre no se enva al servidor, se usa nicamente para diferenciarlo de otros dentro del mismo documento. Si se envan los resultados del formulario a un documento web distinto que ser abierto por el navegador, el marco destino determina en qu marco o ventana se abrir el otro documento. Deje en blanco si se utilizar el mismo marco o ventana.
Accin
La ruta de acceso o direccin URL del administrador del formulario. Usualmente es un programa CGI o cualquier otro dentro del servidor. Si se usa mailto: seguido de una direccin electrnica de correo (e-mail), el contenido del formulario ser enviado por correo a la direccin especificada. El mtodo de transmisin del contenido del formulario al programa del servidor. Las elecciones posibles son Obtener (GET) y Mandar (POST). Si los datos del formulario sern utilizados para una bsqueda, seleccione Obtener (GET). Si los datos del formulario sern almacenados por el programa en el servidor, o enviados por correo electrnico, seleccione Mandar (POST). En caso de duda, seleccione Mandar (POST).
Mtodo
Tipo de codificacin
El tipo MIME como sern tratados los datos del formulario. El contenido de solamente texto, deje este campo en blanco o llnelo con text/plain. El botn Eliminar Formulario puede ser usado para quitar las etiquetas del formulario activo. No remueve los campos del formulario.
5.8 Editando el cdigo fuente HTML

Adems del modo de diseo visual disponible dentro de la ventana de edicin, Namo WebEditor incluye la caracterstica de editar directamente el cdigo fuente HTML. Se accede a la ventana HTML presionando sobre la solapa HTML en la parte inferior de la ventana principal o presionando la tecla <F6>. Para editar el cdigo fuente HTML hace falta tener conocimientos de la especificacin HTML (4.0). Conocer la especificacin CSS tambin ayuda. Estos temas estn fuera del alcance de esta gua de usuario.
5.8.1 Intercambiando entre edicin visual y edicin de cdigo fuente

La ventana HTML despliega el cdigo fuente del documento activo. Se puede intercambiar entre el modo de diseo visual (la ventana de edicin) y el modo HTML presionando la tecla <F6>. Cuando se intercambia del modo visual al modo HTML, Namo WebEditor coloca el punto de insercin en la localizacin dentro del cdigo fuente que corresponde de manera ms exacta a lo que se ve en la ventana de edicin. Lo mismo se cumple cuando se intercambia en la otra direccin. Los cambios que se realizan en cualquiera de los modos se reflejan de manera instantnea en el otro.
5.8.2 Insercin automtica de etiquetas en la ventana HTML

Ciertas etiquetas HTML pueden ser insertadas dentro de la ventana HTML usando los botones de la barra de herramientas y comandos del men en lugar de teclearlos manualmente. Los siguientes elementos del men Insertar estn disponibles: Submen de Salto de Lnea Lnea Horizontal Comentario Imagen > Desde archivo Imagen > Clip Art Campo de Formulario submen Secuencia de comandos > Secuencia de comandos del Cuerpo Insertar > Java Applet Insertar > Plug-In Insertar > Control ActiveX
Editando el cdigo fuente HTML 171
Vnculo Otros > Fecha y hora Otros > Espacio no separable En el men Tabla, se encuentra disponible Nueva Tabla. Los siguientes botones de la barra estndar se encuentran disponibles: Insertar Clip Art Insertar Imagen de archivo Crear Tabla Crear/Modificar vnculo Los siguientes botones de la barra de formato estn disponibles y operan sobre la seleccin activa: Men tipografa Men tamao del texto Negrilla Cursiva Subrayada
5.8.3 Opciones de despliegue de cdigo fuente

Existen varias formas de personalizar la forma en que el cdigo HTML es desplegado. Para mostrar o no los colores en el cdigo, haga clic con el botn derecho en cualquier parte dentro de la ventana HTML y seleccione Mostrar Color de Cdigo. Para activar el despliegue de los nmeros de lnea, haga clic con el botn derecho del ratn y seleccione Mostrar Nmeros de Lnea. Existen ms opciones de despliegue dentro de la solapa Opciones de Edicin de Cdigo del dilogo Preferencias. Haga clic con el botn derecho del ratn dentro de la ventana HTML y seleccione Opciones de Edicin de Cdigo en el men de atajo.
172
Captulo 5
En este punto se pueden configurar las caractersticas de la tipografa, colores y opciones de nmeros de lnea para la ventana HTML. Si activ la opcin Sangra automtica, el punto de insercin se colocar automticamente en el margen izquierdo de la lnea presente cuando se comienza una nueva lnea. Si la opcin Usar tabuladores para sangras no est seleccionada, se utilizarn espacios para realizar la sangra.
5.8.4 Opciones de formato de cdigo fuente

El dilogo Opciones de formato HTML contiene varias opciones relacionadas de cmo Namo WebEditor da formato al cdigo HTML que genera.
Para abrir este dilogo, haga lo siguiente:

1 Seleccione el comando Herramientas > Preferencias. 2 En el dilogo Preferencias, Cambie a la solapa Editar Preferencias. 3 Haga clic en el botn Opciones de formato HTML.
De manera predeterminada, Namo WebEditor usa las reglas especificadas dentro del dilogo Opciones de Formato HTML solamente para formato al cdigo HTML. No intenta dar
Editando el cdigo fuente HTML 173
formato al cdigo HTML existente esto es, escrito a mano o importado de otro programa. Si quiere que Namo WebEditor d formato al cdigo existente aplicando las mismas reglas que usa para el que genera, quite la seleccin de la opcin Conservar Cdigo HTML existente en la solapa Editar Preferencias del dilogo Preferencias.
5.8.5 Editando el cdigo fuente HTML de un conjunto de marcos

Cuando se trabaja en un conjunto de marcos, la solapa HTML despliega el cdigo HTML del documento en el marco activo. Para ver o editar el cdigo fuente del documento del conjunto de marcos, utilice la solapa Cdigo de marcos.
174
Captulo 5
Captulo 6
Agregando Elementos Dinmicos
Namo WebEditor permite agregar una gran variedad de elementos dinmicos a los documentos web, incluyendo efectos JavaScript, acciones JavaScript anexadas a elementos de pgina, animaciones utilizando lneas de tiempo y varios elementos multimedia.
En esta seccin
6.1 El Asistente de Secuencias de Comandos 6.2 Acciones, eventos y el Administrador de Secuencias de Comandos 6.3 Creando lneas de tiempo 6.4 Agregando objetos multimedia
175
6.1 El Asistente de Secuencias de Comandos

Utilice el Asistente de Secuencias de Comandos (guiones o script) para agregar una gran cantidad de elementos dinmicos muy comunes y efectos a sus documentos web. El asistente permite agregar giros, desvanecimientos y efectos de aparecer y desaparecer, animaciones sencillas, capas flotantes, mens desplegables y mucho ms con unos cuantos clic de ratn.
Para iniciar el Asistente de Secuencias de Comandos, haga clic en el botn Insertar efecto del Asistente de Secuencias de Comandos en la barra estndar de herramientas, o use el comando Insertar > Secuencias de comandos >Asistente de Secuencias de Comandos. El primer paso al utilizar el asistente es seleccionar el efecto dinmico o elemento que se quiere usar. Una vez que se realiza la seleccin, haga clic sobre el botn Siguiente y siga con uno o dos pasos sencillos ms para terminar de agregar el efecto o elemento seleccionado en el documento activo. Encontrar informacin completa de los 16 efectos y elementos del Asistente de Secuencias de Comandos disponibles dentro de Namo WebEditor en la ayuda en lnea. Para ayuda de cualquiera de los dilogos del Asistente de Secuencias de Comandos, presione la tecla <F1> mientras se encuentra en el dilogo.
Nota sobre la compatibilidad con los navegadores Los efectos y elementos dinmicos creados utilizando el Asistente de Secuencias de Comandos utilizan JavaScript. Por lo tanto, no funciona en aquellos navegadores web que no incluyen JavaScript. Internet Explorer 4.x y Netscape 4.x, o versiones ms recientes, s incluyen JavaScript. Para otros navegadores, intente ver un documento que contenga efectos creados por el Asistente de Secuencias de Comandos. Si el navegador incluye JavaScript, los efectos funcionarn. Tenga en cuenta, tambin, que dos de los elementos dinmicos creados por el Asistente de Secuencias de Comandos: el men de texto y el men de navegacin, utilizan capas que se
176
Captulo 6
insertan en el documento. Para compatibilidad con las versiones de Netscape anteriores a la 4.6, se debe seleccionar la opcin Usar etiquetas <LAYER> en el dilogo Propiedades de la capa para esas capas. (Sin embargo, realizando esta accin las capas no sern visibles en Internet Explorer.)
177
6.2 Acciones, eventos y el Administrador de Secuencias de Comandos

Las acciones y eventos permiten agregar una gran variedad de caractersticas dinmicas e interactivas a sus documentos web. Una accin es una secuencia de comandos parte del cdigo de un programa que ejecutar el navegador web cuando ocurra algn evento que la dispare. Son posibles muchos tipos de acciones, algunas de las usadas ms frecuentemente incluyen aquellas en las cuales una imagen es reemplazada por otra (creando un efecto de giro), abrir un dilogo para mostrar un mensaje al visitante y mostrar u ocultar una capa del documento. Un evento es usualmente algo que el visitante del sitio web hace para disparar una accin. Existen varios tipos de eventos. Por ejemplo, si el visitante hace clic en un elemento de la pgina, tal como una capa, esto genera un evento del tipo OnClick. El simple hecho de mover el apuntador del ratn sobre un elemento de la pgina puede generar un evento (OnMouseOver). Otro ejemplo es el evento OnLoad, que es generado cuando un documento es abierto por un navegador. Cada accin dentro de un documento debe anexarse a un elemento de la pgina o al mismo documento. Esto significa que la accin es disparada por un evento que de alguna forma se relaciona al elemento al cual se anexa. Por ejemplo, una accin de reemplazo de imagen siempre se anexa a una imagen. Cuando el visitante al sitio mueve el apuntador del ratn sobre la imagen, causa un evento OnMouseOver, la accin de reemplazo de imagen es ejecutada. No todos los tipos de elementos de pgina pueden tener acciones anexas a ellos. Los elementos que s pueden incluir acciones son: Imgenes Capas Vnculos Elementos de formularios El propio documento Hay dos formas de anexar una accin a un elemento de pgina. Una de ellas es utilizar el botn Accin dentro del dilogo de propiedades del elemento que si pueda incluir acciones. Todo dilogo de propiedades de un elemento que soporta acciones tiene este tipo de botn. Al presionar sobre este botn, abrimos el dilogo Acciones, donde podemos agregar y eliminar las acciones que se anexan a un elemento de pgina. La otra forma de anexar una accin a un elemento de pgina es usar el administrador de secuencias de comandos. En el dilogo Administrador de Secuencias de Comandos se lista cada elemento dentro de un documento que incluye acciones. Seleccione el elemento de la pgina dentro de la lista y presione sobre el botn Agregar para anexar una accin. Se accede
178
Captulo 6
al administrador de secuencias de comandos desde Formato > Administrador de Secuencias de Comandos. Ambos mtodos son explicados en las siguientes dos secciones. La ltima de ellas lista las acciones y eventos incluidos en cada tipo de elemento de pgina.
Nota sobre la compatibilidad con los navegadores Las acciones incluidas en Namo WebEditor son programadas en JavaScript. Por lo tanto, no trabajan en aquellos navegadores web que no incluyen JavaScript. Internet Explorer 4.x y Netscape 4.x, o versiones ms recientes, s incluyen JavaScript. En otros navegadores estas acciones no se ejecutarn.
6.2.1 Anexando una accin usando el dilogo de Acciones

Los dilogos de propiedades de imgenes, capas, vnculos, campos de formularios y documentos incluyen un botn Accin. Al hacer clic sobre l se abre el dilogo Acciones, donde se puede anexar una o ms acciones al elemento. Para anexar acciones a un elemento utilizando el dilogo Acciones, haga lo siguiente:
1 Abra el dilogo de propiedades del elemento. (Haga clic con el botn derecho del ratn
sobre el elemento y seleccione [elemento] Propiedades en el men de atajo.) Si el elemento es un documento, cambie a la solapa Estilos en el dilogo Propiedades del Documento.
2 Haga clic en el botn Accin. Esto abre el dilogo Acciones.
3 Haga clic en el botn Agregar. Esto abre el dilogo Propiedades de la Accin.
179
Acciones, eventos y el Administrador de Secuencias de Comandos
4 Seleccione una accin para anexar al elemento dentro de la lista Acciones y seleccione el
evento que dispara esta accin en el men Eventos. Slo se listan los eventos que se aplican al elemento.
5 En Parmetros, teclee un valor para cada uno de los parmetros de la accin. (Por
ejemplo en el parmetro de cada una de las acciones, presione la tecla <F1> mientras ve el dilogo Propiedades de la Accin.)
6 Haga clic sobre el botn Aceptar. 7 Repita los pasos del 3 al 6 para cada accin adicional que desee anexar al elemento. 8 Haga clic sobre el botn Aceptar para cerrar el dilogo Acciones y una vez ms para
cerrar el dilogo de propiedades del elemento. Para modificar o eliminar una accin existente, seleccinela dentro del dilogo Acciones y haga clic sobre el botn Modificar o Eliminar.
6.2.2 Usando el Administrador de Secuencias de Comandos

El administrador de secuencias de comandos provee una forma conveniente de agregar, remover o modificar todas las acciones (scripts) del documento activo. Para abrir el administrador de secuencias de comandos, use el comando Formato > Administrador de Secuencias de Comando.
180
Captulo 6
La lista jerrquica de la izquierda del dilogo muestra los elementos dentro del documento que pueden tener acciones. Los elementos que ya tienen acciones anexas se muestran con un pequeo crculo rojo en la esquina de sus iconos. Para ver una lista de las acciones que ya han sido asignadas a un elemento, seleccinelo haciendo clic sobre l. La lista en la esquina superior derecha del dilogo, lista de acciones, muestra todas aquellas acciones que se han anexado al elemento seleccionado. La lista debajo de la de acciones, etiquetadas como Efectos del Asistente de Secuencia de comandos, muestra los efectos asignados al elemento seleccionado usando el Asistente de Secuencia de Comandos. Para anexar una accin a un elemento, haga lo siguiente:
1 Seleccione el elemento de la lista. 2 Haga clic en el botn Agregar bajo la lista de acciones. Esto abre el dilogo Propiedades
de la Accin.
181
3 Elija una accin dentro de la lista Acciones y seleccione el evento que disparar la accin
dentro de la lista Eventos. Slo se muestran aquellos eventos que se pueden aplicar al elemento.
4 En Parmetros, proporcione un valor para cada uno de los parmetros de la accin. (Para
ms ayuda de cada uno de los parmetros de las acciones, presione la tecla <F1> mientras se encuentre en el dilogo Propiedades de la Accin.)
Para modificar o eliminar una accin, seleccinela de la lista de acciones y haga clic sobre el botn Modificar o Eliminar. Un efecto del asistente de secuencias de comandos puede ser eliminado al seleccionarlo de la lista y presionar sobre el botn Borrar. (Para modificar un efecto del asistente de secuencia de comandos seleccione el elemento al cual se encuentra anexo dentro de la ventana de edicin y abra el asistente de secuencias de comando.)
182
Captulo 6
6.2.3 Acciones y eventos incluidos

La siguiente tabla muestra una lista de las acciones (junto con sus parmetros) incluidas en Namo WebEditor.
Accin Llama funcin JavaScript Verificar Navegador
Parmetros Funcin URL de Netscape URL de Internet Explorer Marco objeto Nombre del Plugin URL si el Plugin existe
Verificar si Plugin Existe
URL si el plugin no existe - Netscape URL si el plugin no existe - IE Marco objeto
Ir a un marco de la lnea de tiempo
Nombre de la Lnea de Tiempo Nmero de marco Repeticiones Nombre de la Ventana Direccin URL Coordenada X Coordenada Y Ancho
Abrir ventana del navegador
Alto Mostrar barra de herramientas Mostrar barra de men Mostrar barra de estado Mostrar barra de desplazamiento Cambiar tamao
Reproducir lnea de tiempo Detener lnea de tiempo Mensaje emergente Carga previa de la Imagen Reemplazar Imagen Restaurar Imagen Fijar Texto barra de Estado Mostrar/Ocultar Capa
Nombre de la Lnea de Tiempo Nombre de la Lnea de Tiempo Texto del Mensaje Ruta de acceso de la Imagen Nombre de la imagen original Ruta de acceso de la imagen de reemplazo Carga previa de la imagen de reemplazo Nombre de la Imagen Texto del Mensaje Nombre de la capa Mostrar u Ocultar
183
La siguiente tabla lista los tipos de eventos incluidos en Namo WebEditor. Tome en cuenta que no todos los eventos se pueden aplicar a cada tipo de elemento de pgina.
Evento onAbort onError onLoad Cmo se genera Ocurre cuando el visitante cancela la carga de una pgina en proceso, usando el botn de Detener o presionando sobre un vnculo para ir a una pgina diferente. Ocurre cuando el navegador encuentra un error al cargar la pgina. Ocurre cuando el navegador termina de cargar el objeto relevante, tal como una imagen. Ocurre cuando un campo de un formulario se convierte en el objetivo ya que el visitante hizo clic sobre el campo o presion la tecla de tabulacin para llegar al mismo. Ocurre cuando un campo de un formulario pierde el "enfoque". (Vea onFocus.) Ocurre cuando el visitante edita el contenido de un campo de un formulario y luego deja el campo. Ocurre cuando el visitante selecciona todo o parte del contenido de un campo en un formulario. Ocurre cuando el visitante completa la "presin" de una tecla mientras se encuentra en un campo de un formulario. Ocurre mientras el visitante mantiene presionada una tecla mientras se encuentra en un campo de un formulario. Ocurre cuando el visitante suelta una tecla mientras se encuentra en un campo de un formulario. Ocurre cuando el visitante hace clic en el objeto referido de la secuencia de comandos usando el ratn. Ocurre cuando el visitante hace doble clic sobre un objeto relevante usando el ratn. Ocurre cuando el apuntador del ratn entra al permetro de un objeto relevante. Ocurre cuando el apuntador del ratn sale de los lmites de un objeto relevante. Ocurre cuando el visitante hace clic sobre un objeto relevante, en la parte "de arriba hacia abajo" de presionar el botn. Ocurre cuando el visitante suelta el botn del ratn en el proceso de hacer clic sobre un objeto relevante. Ocurre cuando una lnea de tiempo llega a un marco especfico. (Slo est disponible si se anexa una accin a un marco de una lnea de tiempo.)
onFocus
onBlur onChange onSelect onKeyDown onKeyPress onKeyUp onClick onDblClick
onMouseOver
onMouseOut onMouseDown
onMouseUp
onFrame[n]
184
Captulo 6
6.3 Creando lneas de tiempo

Una de las caractersticas de las capas es la posibilidad de colocarlas en cualquier punto de una pgina. Utilizando la lneas de tiempo se puede hacer que las capas cambien de posicin mientras se despliegan en un navegador. Adems, se pueden anexar acciones (script) a puntos especficos de una lnea de tiempo, por ejemplo, para reemplazar una imagen en una capa con otra. Esta combinacin de habilidades hace que las lneas de tiempo sean un mtodo poderoso de animar elementos de pgina y agregar otros efectos dinmicos a sus documentos web.
5.3: Trabajando con capas
6.3.1 La ventana de Lneas de Tiempo

La ventana de Lnea de Tiempo es donde se puede realizar la creacin y edicin de las mismas. Para abrir esta ventana, seleccione el comando Ventana > Lnea de Tiempo o presione las teclas <Alt + 4>. La ventana es del tipo flotante, para poder continuar trabajando dentro de la ventana de edicin mientras se conserva abierta.
La ventana de Lnea de Tiempo se encuentra divida en renglones y columnas. Cada columna representa un marco de la lnea de tiempo (similar a un marco de una pelcula.) La lnea roja delgada es el indicador del marco activo. Las barras grises horizontales dentro de la imagen superior, etiquetadas como Capa 1, Capa 2, Capa 3, representan un objeto grfico (sprite). El objeto grfico controla el movimiento de una de las capas en una secuencia de marcos. Puede haber cualquier nmero de objetos grficos dentro de una lnea de tiempo, haciendo posible la animacin de varias capas simultneamente. Cada objeto grfico tiene por lo menos dos marcos llave. En un marco llave, la posicin de la capa la especifica el diseador (usted). En cada marco entre los marcos llave, la posicin de la capa se calcula automticamente dentro del navegador web para que la capa se mueva uniformemente entre los marcos llave. Se pueden agregar o quitar marcos llave segn se desee, para poder producir un movimiento de mayor complejidad. Un marco llave se indentifica por un pequeo crculo blanco dentro del objeto grfico.
Creando lneas de tiempo
185
Estos conceptos se ilustran con un sencillo ejemplo mostrado a continuacin. En este ejemplo, una capa (que contiene la imagen de un pequeo autobs rojo), se mueve del lado izquierdo de la ventana hacia el derecho, en lnea recta.
Este ejemplo de lnea de tiempo solamente contiene un objeto grfico, etiquetado Capa 1 para simbolizar el movimiento que describe. En el Marco 1, el primer marco del objeto grfico, la capa se encuentra en la esquina superior derecha del documento. El Marco 1 es un marco llave, lo que significa que la posicin de la capa para este marco la especificamos nosotros.
186
Captulo 6
En el Marco 10, el punto central del objeto grfico, la capa ha pasado hasta la mitad de la ventana. No especificamos explcitamente la posicin de la capa dentro del Marco 10, que no es un marco llave. El lugar de eso, la posicin de la capa en este marco es calculada por Namo WebEditor (y, posteriormente, ser calculada por el navegador Web).
En el Marco 20, el ltimo marco del objeto grfico, la capa ha llegado a su posicin final. El Marco 20 es otro marco llave, as que la posicin la especificamos nosotros.
187
En una lnea de tiempo ms compleja, pueden existir muchos objetos grficos, tanto secuenciales como traslapados. Adems, es posible anexar varias acciones a marcos especficos de la lnea de tiempo, de forma tal que una accin se dispare cuando la lnea de tiempo llege a un marco especificado. En las siguientes secciones explicamos la creacin de objetos grficos y la manera de anexar acciones a una lnea de tiempo.
6.3.2 Creando y editando un objeto grfico (sprite)

Para crear un objeto grfico (sprite), sencillamente arrastre una capa a la ventana de Lnea de Tiempo. Use las siguientes instrucciones:
1 Haga clic dentro de la capa para hacer que sus manijas aparezcan. 2 Arrastre la capa por una de sus manija hasta la ventana de Lnea de Tiempo. Cuando el
apuntador del ratn, que en este momento tiene la forma de una mano, est sobre la ventana, un objeto grfico aparecer debajo de l. Contine arrastrando hasta que el objeto grfico se encuentre en la posicin deseada dentro de la lnea de tiempo y en ese momento suelte el botn del ratn. De manera alternativa, seleccione la capa haciendo clic sobre su manija y luego haga clic con el botn derecho del ratn sobre cualquier parte de la ventana de Lnea de Tiempo y seleccione Insertar Capa en el men de atajo. Se pueden agregar objetos grficos adicionales a la lnea de tiempo procediendo de la misma forma. Cada capa en un documento puede ser controlada por uno o ms objetos grficos. Sin embargo, si existen objetos grficos mltiples para la misma capa, no pueden traslaparse. Un nuevo objeto grfico tiene una longitud de 16 marcos. Para ajustar su longitud, haga clic sobre l y arrstrelo hasta el primero o el ltimo de los marcos. Para mover un objeto grfico cambiar donde comienza o termina sin cambiar su longitud, haga clic en cualquier parte del centro del objeto grfico (pero no en un marco llave) y arrstrelo. Una vez creado un objeto grfico bsico, se debe especificar la posicin de la capa en el primero y el ltimo marco (la posicin final e inicial de la capa.) Posteriormente, se pueden agregar ms marcos llaves, si es necesario, y especificar cada una de las posiciones de las capas. Hay dos formas de especificar la posicin de una capa dentro de un marco llave: Haga clic en el marco llave para mover el indicador del marco activo al marco deseado y luego, en la ventana de edicin, arrastre la capa de su manija hasta la posicin requerida o
188
Captulo 6
Haga doble clic en el marco llave y luego, dentro del dilogo Propiedades de la capa, teclee las coordenadas horizontales y verticales de la esquina superior derecha de la capa El segundo mtodo es til cuando se requiere especificar la posicin de la capa de forma muy precisa. Una vez que coloc la capa en el segundo marco llave, una delgada lnea de camino negra se dibujar dentro de la ventana de edicin entre la posicin inicial de la capa y su nueva posicin, indicando el camino que la capa tomar.
Si el apuntador del ratn no cambia a una mano cuando se coloca sobre la manija de una capa, haga clic sobre la barra de ttulo de Namo WebEditor una vez. El apuntador del ratn debe cambiar ahora apropiadamente cuando se coloque sobre una manija de una capa.
Para hacer que un objeto grfico realice una accin mucho ms complicada que mover una capa entre dos puntos en una lnea recta, se requiere agregar marcos llave adicionales al objeto grfico. Para agregar un marco llave, haga clic con el botn derecho del ratn en un marco y seleccione Insertar Marco llave en el men de atajo. Un pequeo crculo blanco debe aparecer en el marco, indicando que ste es un marco llave. Ahora debe especificar la posicin de la capa dentro del nuevo marco llave utilizando uno de los mtodos descritos anteriormente. La lnea del camino cambiar para reflejar la modificacin de la capa. Para hacer que un marco llave vuelva a convertirse en un marco normal, haga clic con el botn derecho del ratn dentro del marco llave y seleccione Eliminar Marco Llave en el men de atajo. El crculo blanco desaparecer y la lnea del camino a los lados del marco llave anterior cambiar de forma, enderezndose. No es posible remover los marcos llave que se encuentran en los extremos de un objeto grfico. Si desea intercambiar el camino completo de una capa sin modificar su forma esto es, sin cambiar las posiciones relativas de las capas en cada uno de los marcos llave mueva el indicador del marco activo a uno dentro del objeto grfico que no sea llave y luego arrastre la capa por su manija en la ventana de Edicin. Una vez que suelte el botn del ratn, la nueva lnea de camino se mover a su posicin final. Se puede cortar o copiar un objeto grfico y luego pegarlo en una nueva posicin dentro de la lnea de tiempo. Para copiar o pegar un objeto grfico, primero seleccinelo haciendo clic sobre l una vez y luego haga clic con el botn derecho del ratn dentro de la lnea de tiempo seleccionando Cortar objeto grfico o Copiar objeto grfico en el men de atajo. Para pegar un objeto grfico previamente cortado o copiado, mueva el indicador del marco activo al marco, donde desea pegarlo y luego haga clic con el botn derecho en cualquier parte dentro de la lnea de tiempo seleccionando Pegar objeto grfico en el men de atajo. Recuerde que dos objetos grficos que controlan a la misma capa no pueden traslapararse, as que cuando copie un objeto grfico, no ser posible pegarlo si el indicador del marco activo se encuentra dentro del objeto grfico original.
Creando lneas de tiempo 189
Para eliminar un objeto grfico, seleccinelo y luego haga clic con el botn derecho del ratn dentro de la lnea de tiempo utilizando el comando Eliminar capa en el men de atajo.
6.3.3 Creando un objeto grfico al grabar el camino de una capa

Si desea crear un objeto grfico con movimiento curvo y complejo, puede ser bastante difcil utilizando las tcnicas descritas en las secciones anteriores, puesto que se deben agregar varios marcos llave y especificar la posicin de la capa en cada uno de ellos. La forma ms sencilla de grabar el camino de una capa es arrastrndola por la ventana de edicin mientras se graban sus movimientos, Namo WebEditor inserta tantos marcos llave como sean necesarios para describir con exactitud el camino que toma la capa. La posicin de la capa se fija automticamente dentro de cada marco llave. Para grabar el camino de una capa, haga lo siguiente:
1 Seleccione la capa haciendo clic en una de sus manijas. (Cuando una capa se selecciona,
sus manejas de cambio de tamao son visibles en sus lados y esquinas.)

2 Haga clic que con el botn derecho del ratn en cualquier parte dentro de la ventana
Lnea de Tiempo y seleccione el comando Grabar Camino de Capa en el men de atajo.
El apuntador del ratn debe cambiar a una flecha con un pequeo icono de un casete de grabacin.
3 Haga clic en la manija de la capa y arrstrela por el camino deseado.
Al ir arrastrando la capa, una serie de pequeos asteriscos aparecern a lo largo del camino. Cuando se suelta el botn del ratn, un nuevo objeto grfico se insertar dentro de la lnea de tiempo, justo despus de la que ya se encontraba ms a la derecha, si es que haba alguna. Una vez que se crea un objeto grfico de esta manera, se necesita ajustar el camino de la capa. Para hacer esto, utilice las tcnicas descritas en la seccin anterior para ajustar la posicin de una capa dentro de un marco llave o agregar y eliminar marcos llave.
190
Captulo 6
6.3.4 Anexando acciones a una lnea de tiempo

Probablemente uno de los aspectos ms poderosos de las lneas de tiempo es la posibilidad de anexar acciones (scripts) a un marco especfico. Cuando la lnea de tiempo llega a un marco que tiene una accin anexa, sta es ejecutada por el navegador. Por ejemplo, se puede anexar una accin de Reemplazo de Imagen a un marco para cambiar la imagen dentro de una capa. En un marco posterior, se puede anexar una accin Restaurar Imagen para volver a la imagen original. Puesto que cualquier accin puede anexarse a cualquier marco dentro de la lnea de tiempo, la posibilidad de orquestar efectos dinmicos usando lneas de tiempo solamente est limitada por la imaginacin. En casos extremos, puede ser deseable crear una lnea de tiempo que no contenga capas de animacin, sino que solamente provoque que se ejecuten varias acciones en el tiempo (con o sin la interaccin del visitante). Para anexar una accin a un marco de una lnea de tiempo, haga lo siguiente:
1 Haga doble clic en el rengln de acciones (marcado A) en la parte superior de la lnea de
tiempo del marco deseado.
2 En el dilogo Acciones, haga clic sobre el botn Agregar. El dilogo Propiedades de la

Accin aparecer.
3 Seleccione una accin y proporcione los valores de sus parmetros. 4 Haga clic sobre el botn Aceptar dos veces para cerrar los dilogos.
Cuando un marco tiene una accin anexa, una A aparece dentro del rengln de accin de ese marco. Se pueden anexar acciones adicionales al mismo marco u otros marcos repitiendo los pasos descritos arriba. Para mover una accin anexa a un marco distinto, haga clic y arrastre la A a otro marco.
Para que las acciones anexas a una lnea de tiempo sean ejecutadas, debe haber por lo menos un objeto grfico dentro de la lnea. Esto se debe a que una lnea de tiempo que no tenga objetos grficos no puede ser reproducida. Si desea utilizar una lnea de tiempo nicamente para disparar ciertas acciones, no para animar capas, cree un nico objeto grfico utilizando cualquier capa (una capa vaca puede servir) y coloque el objeto grfico en cualquier parte de la lnea de accin.
191
6.3.5 Especificando cmo inician las lneas de tiempo

Una lnea de tiempo puede comenzar su reproduccin tan pronto como el documento termine de cargarse en el navegador o puede ser iniciada por una accin anexa a algn elemento del documento que se activa por un evento, por ejemplo, un visitante haciendo clic sobre un botn. Para hacer que la lnea de tiempo su ejecute tan pronto como el documento sea cargado en el navegador, seleccione la opcin Auto inicio dentro de la ventana Lnea de Tiempo. Para anexar una accin que haga que la lnea de tiempo comience su reproduccin por un elemento de pgina, haga lo siguiente:
1 Abra el dilogo de propiedades del elemento. 2 Haga clic en el botn Accin para abrir el dilogo Acciones. 3 Haga clic en el botn Agregar. Esto abrir el dilogo Propiedades de la Accin.
4 En la lista de Acciones, seleccione Reproducir Lnea de Tiempo. 5 En Parmetros, seleccione el nombre de la lnea de tiempo que ser iniciada por la
accin Reproducir Lnea de Tiempo.

6 En la lista Evento, seleccione el elemento que disparar la accin Reproducir Lnea de
Tiempo.
7 Haga clic sobre el botn Aceptar tres veces para cerrar todos los dilogos.
De forma similar, la reproduccin de una lnea de tiempo puede ser detenida por una accin. Para realizar esto, siga los pasos anteriores, pero seleccione Detener Lnea de Tiempo en el men Acciones. Una lnea de tiempo puede iniciarse o detenerse cuando otra lnea de tiempo alcance cierto marco. Para realizar esto, siga las instrucciones de las secciones anteriores para anexar una accin a un marco dentro de una lnea de tiempo. Se puede especificar que una lnea de tiempo se repita de manera indefinida seleccionando la opcin Repetir en la ventana Lnea de Tiempo. Si no se selecciona Repetir, la lnea de tiempo ser reproducir una vez y luego se detendr. La velocidad a la cual la lnea de tiempo se reproduce puede ser ajustada utilizando el control marcos/seg. En la parte superior de la ventana de Lnea de Tiempo. Recuerde que, debido a las diferencias entre los navegadores y las plataformas informticas, la velocidad especificada solamente es una aproximacin de lo que sucede durante su reproduccin.
192
Captulo 6
6.3.6 Trabajando con lneas de tiempo mltiples

El mismo documento puede tener cualquier nmero de lneas de tiempo, cada una de ellas reproducindose de forma independiente de las otras. Para agregar una lnea de tiempo, haga clic con el botn derecho del ratn en cualquier parte de la ventana Lnea de Tiempo y seleccione Agregar Lnea de Tiempo en el men de atajo. Una nueva lnea de tiempo, vaca, aparecer dentro de la ventana. El nombre de esta lnea ser timelineN, donde N eso un nmero entero. La lnea de tiempo previamente desplegada se enviar detrs de la nueva en la ventana Lnea de Tiempo. Para seleccionar una lnea de tiempo y traerla a la parte de enfrente de la ventana Lnea de Tiempo, seleccione su nombre dentro de la lista encontrada en la esquina superior derecha de la ventana.
Para cambiar el nombre a una lnea de tiempo, haga clic sobre su nombre dentro de la lista de lneas de tiempo y luego escriba el nuevo y presione la tecla <Tab>. Los objetos grficos pueden ser cortados o copiado de una lnea de tiempo y pegados en otra. El procedimiento es el mismo que para los objetos grficos dentro de la misma lnea, a excepcin de que se debe seleccionar la otra lnea de tiempo antes de pegar. Cuando existen lneas de tiempo mltiples, los controles en la parte superior de la ventana
Lnea de Tiempo marcos/seg., Auto inicio y Repetir se aplican de manera
independiente a cada lnea de tiempo.
193
6.4 Agregando objetos multimedia

Namo WebEditor incluye la insercin de varios tipos de objetos multimedia dentro de los documentos web en el modo de edicin visual. Para insertar un objeto multimedia, utilice alguno de los comandos que se encuentran dentro del men Insertar > Avanzado. Entre los objetos multimedia incluidos se encuentran: Animaciones Flash y Shockwave Flash y Shockwave son dos tipos de archivos multimedia. Comparados a la mayora de los otros objetos multimedia, los objetos flash son archivos de tamao relativamente pequeo, puesto que se basan en grficos vectoriales (imgenes que son descritas por expresiones matemticas en lugar de mapas de bits). Debido a eso toman menos tiempo para ser descargadas de un sitio web. Los archivos Flash usan la extensin .swf mientras que los Shockwave usan la .dcr. Para obtener una vista preliminar de objetos Flash o ShockWave en la ventana de Vista Previa, es necesario tener instalado el Plug-in reproductor de Shockwave o Flash para el navegador Internet Explorer en su ordenador. Los visitantes al sitio Web deben tenerlos instalados tambin para poder ver los objetos Flash o Shockwave. Pelculas Quicktime QuickTime es un formato de archivos multimedia propiedad de Apple Computer. Muchas de la pelculas y archivos de sonido que se encuentran en la Web estn en formato QuickTime. Los archivos QuickTime usan la extensin .mov. Para poder tener una vista preliminar de los objetos QuickTime en la ventana de Vista Previa, se debe tener instalado el Plug-in de QuickTime para el navegador Internet Explorer en su ordenador. Los visitantes al sitio web tambin deben tener instalado el plug-in para poder ver objetos QuickTime. Sonidos MIDI MIDI, que significa Interfase Digital para Instrumentos Musicales (Musical Instrument Digital Interface), es un formato de archivos de msica. Un archivo MIDI es como la partitura de una cancin o sinfona; no contiene sonidos sino que depende de la tarjeta de msica del ordenador para generarlos, Los archivos MIDI son muy compactos y rpidos de descargar. Los archivos MIDI usan las extensiones .mid o .midi. Para obtener una vista preliminar de un objeto MIDI en la ventana de Vista Previa, se debe tener instalado el plug-in capaz de reproducir archivos MIDI para el navegador Internet Explorer instalado en su ordenador. Los visitantes al sitio web tambin deben tener instalado el plug-in para poder escuchar objetos MIDI.
194
Captulo 6
Sonidos RealAudio El RealAudio es un archivo de sonido de alta compresin "de torrente", propiedad de RealNetworks. "De torrente" significa que los sonidos de RealAudio (que pueden tener duraciones de minutos a horas) no tienen que ser descargados por completo antes de comenzar a reproducirse; en lugar de eso, los datos de los sonidos son "vertidos" en la computadora mientras los sonidos se reproducen. RealAudio se usa con frecuencia para reproducir msica y grabaciones de palabras habladas. Los archivos RealAudio usan la extensin .ra, .rm o .ram. Para obtener una vista preliminar de un objeto RealAudio en la ventana de Vista Previa, se debe tener instalado el Plug-in RealPlayer para el navegador Internet Explorer instalado en su ordenador. Los visitantes al sitio web tambin deben tener instalado el plug-in para poder escuchar objetos RealAudio. Otros objetos plug-in Un conector (plug-in) es un cdigo de programa que provee cierta funcionalidad que no se incluye inicialmente en su navegador Web. Generalmente, el conector maneja formatos que el navegador no puede, tales como ciertos tipos de archivos multimedia. Un objeto plug-in es un archivo que puede ser reconocido por un conector. Las pelculas QuickTime y archivos RealAudio son dos de los tipos de objetos plug-in, pero existen muchos ms. Use el comando Insertar > Avanzado > Plug-In cuando quiera insertar un objeto a plug-in que no se incluya dentro de los elementos del submen. Java applets Un applet Java es un pequeo programa que puede ser insertado en una pgina Web. A diferencia de una aplicacin ordinaria, un applet Java no es ejecutado al hacer doble clic sobre un icono o seleccionando un elemento del men de Inicio de Windows; en vez de eso, es ejecutado de forma automtica cuando se ve la pgina Web que lo contiene o cuando se hace clic en un botn localizado en esa pgina. La mayora de los applets Java no se ejecutan en su propia ventana; son ejecutados en la propia ventana del navegador. Existen applets Java disponibles para ejecutar una gran cantidad de acciones, las mismas que una aplicacin ordinaria, tales como editar una hoja de clculo, dibujar grficos o jugar. Los archivos de applets Java usan la extensin .cla o .class. Para encontrar y usar interesantes applets Java, intente buscar "Java applets" en su buscador preferido de Internet. No todos los navegadores utilizan Java, pero los ms modernos s, incluyendo las versiones ms recientes de Internet Explorer y Netscape. Controles ActiveX Los controles ActiveX son similares a los applets Java, en el sentido de que son pequeos programas que pueden ser insertados en las pginas Web para realizar acciones similares a los que una aplicacin ordinaria puede hacer. ActiveX es un estndar perteneciente a Microsoft. Muchos controles ActiveX se encuentran interconstruidos en Windows y estn disponibles (junto con otros controles ActiveX
Agregando objetos multimedia 195
ya instalados en su sistema) en el men ID de Clase cuando se abre el dilogo Propiedades de Control ActiveX. Flash, Shockwave y RealAudio son objetos que Namo WebEditor trata como controles ActiveX. Los controles ActiveX no son incluidos en Netscape y puede que no funcionen en otros navegadores que no sean Internet Explorer.
Cuando se inserta un objeto multimedia en un documento, se representa en la ventana de Edicin como un marcador: un pequeo recuadro blanco con un borde punteado y la ruta de acceso del objeto desplegada en el centro. Para obtener una vista preliminar de un objeto multimedia en accin, cambie a la solapa de Vista Previa.
6.4.1 Insertando una animacin Flash o Shockwave

Para insertar un objeto Flash, haga lo siguiente:
1 Seleccione el comando Insertar > Avanzado > Flash. 2 En el dilogo Abrir, localice y seleccione un archivo Flash en su disco duro o
proporcione la direccin URL donde se puede localizar en la Web y luego haga clic sobre el botn Abrir o Abrir URL.
3 En el dilogo Propiedades del control ActiveX, proporcione la ID (nombre) de la
animacin Flash y fije el tamao, espaciamiento y alineacin. No modifique el parmetro

ID de Clase.
4 Haga clic en el botn Parmetros para abrir el dilogo Parmetros del Control ActiveX
y edite los ajustes concernientes a Flash.

5 Haga clic sobre el botn Aceptar dos veces para regresar a la ventana de Edicin.
Para insertar un objeto Shockwave, haga lo siguiente:

1 Seleccione el comando Insertar > Avanzado > Shockwave. 2 En el dilogo Abrir, localice y seleccione un archivo Shockwave en su disco duro o
3 En el dilogo Propiedades del Control ActiveX, proporcione la ID (nombre) del objeto
Shockwave y fije el tamao, espaciamiento y alineacin. No modifique el parmetro ID

de Clase.
4 Haga clic en el botn Parmetros para abrir el dilogo Parmetros de Control ActiveX
y edite los ajustes concernientes a Shockwave.

196
Captulo 6
6.4.2 Insertando una pelcula QuickTime

Para insertar una pelcula QuickTime, haga lo siguiente:
1 Seleccione el comando Insertar > Avanzado > QuickTime. 2 En el dilogo Abrir, localice y seleccione una pelcula QuickTime en su disco duro o
3 Edite los parmetros generales de la pelcula QuickTime en el dilogo Propiedades del
Plug-in.
4 Haga clic en el botn Propiedades QuickTime. El dilogo Propiedades QuickTime
aparecer.
5 Edite las propiedades especficas de la pelcula QuickTime. 6 Haga clic sobre el botn Aceptar dos veces para regresar a la ventana de Edicin.
6.4.3 Insertando un sonido MIDI

Para insertar un archivo MIDI, haga lo siguiente:
1 Seleccione el comando Insertar > Avanzado > MIDI. 2 En el dilogo Abrir, localice y seleccione un archivo MIDI de su disco duro o
proporcione la direccin URL donde se pueda localizar en la Web y luego haga clic sobre el botn Abrir o Abrir URL.
3 En el dilogo Propiedades del Plug-in, edite las propiedades del sonido MIDI. 4 Haga clic sobre el botn Aceptar.
6.4.4 Insertando un sonido RealAudio

1 Seleccione el comando Insertar > Avanzado > RealAudio. 2 En el dilogo Abrir, localice y seleccione un archivo RealAudio de su disco duro o
proporcione la direccin URL donde se pueda localizar en la Web y luego haga clic sobre el botn Abrir o Abrir URL.
3 En el dilogo Propiedades del Control ActiveX, proporcione la ID (nombre) del archivo
RealAudio y fije el tamao, espaciamiento y alineacin. No modifique el parmetro ID

de Clase.
4 Haga clic en el botn Parmetros para abrir el dilogo Parmetros de Control ActiveX
y editar los parmetros especficos de RealAudio.

Agregando objetos multimedia
197
Captulo 7
Creando Documentos basados en Bases de Datos
El poderoso y flexible Asistente de Base de Datos de Namo WebEditor le permite crear documentos de alta calidad basados en una base de datos en minutos sin necesidad de programar.
En este captulo
7.1 Introduccin al Asistente de Bases de Datos 7.2 Seleccionando un documento de tipo dinmico 7.3 Seleccionando una fuente de datos 7.4 Seleccionando campos de una base de datos 7.5 Proporcionando una sentencia de seleccin 7.6 Agregando y quitando elementos de bloque 7.7 Apariencia de los bloques en la ventana de Edicin 7.8 Creando un bloque de lista o tabla 7.9 Creando un bloque de detalle 7.10 Creando un bloque de grfico 7.11 Creando un bloque de entrada 7.12 Creando un bloque de modificacin 7.13 Agregando elementos de bloque en la ventana de Edicin 7.14 Modificando las propiedades basadas en una base de datos
199
7.1 Introduccin al Asistente de Bases de Datos

El Asistente de Base de Datos de Namo WebEditor le ayuda a crear una gran variedad de pginas web dinmicas basadas en una base de datos, en unos cuantos pasos fciles.
7.1.1 Acerca de las bases de datos

Una base de datos es, dentro de los trminos ms generales, sencillamente una coleccin de datos. Los datos pueden almacenar cualquier tipo de informacin, tal como nombres de empleados, ttulos de pelculas, recetas de pasteles, etc.. Coleccin significa un conjunto de datos similares, tales como la lista de los nombres de empleados, el libro de recetas u otra informacin. En trminos informticos, una base de datos es un archivo (o un conjunto de archivos) que contienen una o ms colecciones de datos que se organizan en formas tiles. La base de datos almacena cada coleccin de datos similares en una tabla. Una base de datos para un amante de la msica, por ejemplo, podr tener una tabla que contenga informacin de cada uno de los CD de su propiedad, otra podr contener informacin de una lista de artistas y canciones favoritas, etc. Dentro de cada tabla, la informacin de una entidad nica (un CD de msica, por ejemplo) se almacena en un registro. El registro puede contener datos tales como el ttulo del CD, el nombre del artista, el ttulo de cada cancin, la longitud total, etc. Los registros se organizan en campos (tambin llamados columnas, por analoga con las tablas de hoja de clculo). Cada campo de un registro contiene una pieza nica de datos, tal como un ttulo de un CD. A continuacin mostramos el ejemplo de una tabla de base de datos que contiene informacin acerca de una coleccin de msica en CD. Ttulo Boys for Pele Joshua Judges Ruth Simona No. 5 Artista Tori Amos Lyle Lovett Beethoven Gnero Pop/Rock Country Clsico Duracin 71:10 53:48 33:12
Cada rengln de la tabla es un registro (en el sentido tcnico, no en el sentido de la industria de la msica), mientras que cada columna es un campo. La tabla tiene cuatro campos: Ttulo, Artista, Gnero y Duracin. Cuando una base de datos contiene ms de una tabla, es prctica comn referirse a los campos por el nombre de la tabla y del campo. Por ejemplo, si la tabla mostrada se llamara CD, los nombres de los campos seran CD.Ttulo, CD.Artista, CD.Gnero y CD.Duracin.
200
Captulo 7
7.1.2 Acerca de los documentos activados por bases de datos

Un documento web habilitado por una base de datos (o manejado por una base datos, para utilizar otro trmino popular) es aquel en el que una parte, o todo el contenido, viene de una base de datos. El beneficio de obtener el contenido de la base de datos es que cuando los datos en ella cambian, el documento web tambin lo hace de manera automtica. En un documento web normal (no habilitado por una base de datos), se provee todo el contenido al editar el documento. Si se quiere cambiar el contenido, se debe abrir el mismo dentro de una herramienta para modificar HTML (Namo WebEditor) y editarse a mano. Si por ejemplo, nuestra pgina web contiene la lista de una coleccin de CD de msica y tambin se cuenta con una base de datos de Microsoft Access que contiene la misma informacin, cuando se aada un disco ms a la coleccin (al no utilizar un documento que se habilite con una base de datos) se debe editar su contenido para insertar la informacin. Si, en cambio, el documento estuviese habilitado por una base de datos, al agregar la informacin a la base, la pgina se actualizar de manera inmediata ahorrando tiempo y esfuerzo. La ventaja es an ms clara si nos imaginamos un sitio web donde se pueden hacer compras en lnea y donde se tengan cientos o miles de pginas con todo tipo de datos que cambian frecuentemente: nombres de productos, precios, estado de acciones y similares. Si se tuvieran que modificar todos estos documentos cuando hubiese un cambio en un catlogo, se perdera un tiempo considerable. Seguramente el comerciante en lnea deber tener de todas formas la informacin almacenada en una base de datos, as que tiene mucho sentido tomar de ah el contenido para modificar las pginas Web. Para crear un documento web habilitado por una base de datos se colocan ciertas instrucciones dentro del mismo que le indican al servidor web que sirve las pginas dnde buscar la informacin dentro de una base de datos. Usualmente esto implica colocar cierto cdigo JavaScript en el cdigo fuente HTML. Afortunadamente no es necesario escribir ningn cdigo para habilitar un documento por medio de una base de datos, el Asistente de Bases de Datos de Namo WebEditor genera este cdigo para usted despus del guiarlo a travs de un proceso de seleccionar la base de datos, las partes de la base de datos que se desean en el documento y decidir cmo presentar la informacin a los visitantes del sitio web.
7.1.3 Tipos de documentos activados por bases de datos

El Asistente de Base de Datos puede crear seis tipos distintos de documentos activados por una base de datos. Cuatro de ellos despliegan registros de la base de datos en distintas formas, mientras que los otros dos permiten a los visitantes modificar o dar de alta nuevos registros en la base de datos. El Asistente de Base de Datos no crea por completo los documentos. En lugar de eso, inserta los llamados bloques en el documento abierto en la ventana de Edicin. Un bloque es una regin del documento que despliega registros o deja que el visitante modifique los registros de la base de datos. Puesto que el Asistente de Base de Datos inserta bloques en lugar de generar
Introduccin al Asistente de Bases de Datos
201
un documento completo, usted retiene el control total sobre el formato y el contenido esttico (no basado en la base de datos) del documento. Existen seis tipos de bloques que el Asistente de Base de Datos puede crear: Bloque de Tabla Bloque de Lista Bloque de Detalle Bloque de Grfico Bloque de Entrada Despliega registros mltiples, un registro por rengln, con cada uno de los campos de una base de datos en una columna. Despliega registros mltiples en una lista, con cada campo en su propia lnea. Despliega un slo registro. Despliega datos numricos de registros mltiples como un grfico. Provee un formulario para que los visitantes al sitio puedan dar de alta nuevos registros.
Bloque de Modificacin Provee un formulario para que los visitantes al sitio puedan modificar un registro existente. Un nico documento puede tener ms de un bloque. Sin embargo, algunos de los bloques no pueden coexistir en el mismo documento. Los bloques de entrada, modificacin, tablas y listas son mutuamente excluyentes y slo uno de ellos puede existir en un documento. Por otro lado, todos los tipos de bloques pueden coexistir con bloques de detalle y grficos, de los que puede haber ms de uno en un documento. Para ejemplos de cmo se ven los bloques en un navegador, vea las secciones individuales de cada tipo de bloque, de la 7.8 a la 7.13.
7.1.4 Pasos bsicos para usar el Asistente de Bases de Datos

A continuacin mostramos los pasos bsicos para usar el Asistente de Base de Datos. No se preocupe si alguno de los trminos usados no le es familiar, los procedimientos se describen en detalle en otras secciones de este captulo.
1 Cree un nuevo documento o abra uno ya existente. 2 Seleccione el comando Base de datos del men Insertar que corresponde al tipo de
bloque a incluir en el documento. Esto activar el asistente para ese tipo de bloque.
3 Especifique el formato dinmico del documento (ASP o PHP) y el mtodo de conexin a
la base de datos utilizada.

4 Seleccione un origen de los datos (su base de datos) y provea su nombre de usuario y
contrasea, si se requiere, para tener acceso a la base de datos.

5 Seleccione las tablas y campos de la base de datos a usar en el documento. 6 Especifique unas cuantas opciones concernientes al tipo de bloque particular que se
seleccion.
202
Captulo 7
7.1.5 Requerimientos para usar el Asistente de Bases de Datos

Antes de usar el Asistente de Base de Datos, asegrese de que cuenta con los siguientes requerimientos bsicos:
Servidor capaz de interpretar ASP o PHP Los documentos basados en una base de datos que el Asistente de Base de Datos crea, se guardan como documentos ASP o PHP. Por lo tanto, el servidor Web debe poder ejecutar secuencias de comandos ASP o PHP, dependiendo del formato dinmico seleccionado para el documento. Si el servidor ejecuta Microsoft IIS o PWS, no se requieren programas adicionales para ejecutar programas ASP. Si su servidor Web tiene instaldo el SO Windows y desea usar PHP, debe instalar PHP para Windows. Si su servidor Web usa Unix o Linux y desea usar ASP, se debe instalar un programa capaz de manejar secuencias de comandos ASP, tal como Chili!Soft ASP. Si su servidor Web ejecuta Unix o Linux y desea usar PHP, debe instalar el programa apropiado de PHP para su sistema operativo Una conexin de base de datos ODBC en su ordenador Namo WebEditor usa ODBC para conectarse a la base de datos mientras crea o edita un documento basado en bases de datos. Por lo tanto, se requiere establecer la base de datos como el origen de los datos (DSN) dentro del dilogo Fuentes de ODBC del panel de control de Windows, en la computadora donde este utilizando Namo WebEditor. Una conexin de base de datos ODBC en el servidor Web Tanto Namo WebEditor como su servidor Web deben ser capaces de conectarse a su base de datos. Para la mayora de las bases de datos, esta conexin se establece a travs de ODBC. Por lo tanto, necesita establecer su base de datos como datos orgenes (DSN) dentro del panel de control de Windows en la opcin Fuente de Datos ODBC. De manera alternativa, se pueden usar bases de datos de MySQL puesto que el servidor Web puede conectarse a la base de datos usando el manejador MySQL Servidor Web Personal de Microsoft o Internet Information Server en su ordenador (para la vista previa de los documentos habilitados por base de datos) Para poder tener una vista previa de los documentos Active Server Pages (ASP) que se crearon usando el Asistente de Base de Datos, se debe tener instalado, ya sea el Microsoft Personal Web Server (PWS) o Microsoft Internet Information Server (IIS), en la computadora en la cual se usa Namo WebEditor.
7.1.6 Creando una conexin ODBC a una base de datos

El Asistente de Base de Datos requiere que el ordenador donde ejecuta Namo WebEditor pueda conectarse a la base de datos usando ODBC, un estndar ampliamente difundido para
203
conexiones a bases de datos. El servidor Web usado tambin debe ser capaz de conectarse a la base de datos usando ODBC, a menos de que tenga una base de datos MySQL. Para fijar una conexin ODBC a la base de datos, use el applet (programa) Fuentes de Datos ODBC en el Panel de Control de Windows para agregar un DSN (nombre de fuente de datos; data source name) para su base de datos. Si an no lo a hecho, siga los siguientes pasos tanto en su ordenador como en el servidor Web. (Si el sistema operativo del servidor no es Windows, refirase a la documentacin del programa ODBC instalado.)
1 Dentro del men Inicio de Windows, seleccione Configuracin > Panel de Control. 2 Abra el applet Fuentes de datos ODBC. (El nombre puede variar ligeramente
dependiendo de la versin de Windows que use.)

3 Haga clic en la solapa DSN de sistema y luego haga clic sobre el botn Agregar . 4 Seleccione el manejador adecuado para su tipo de base de datos. Por ejemplo, si su base
de datos es Microsoft Access, seleccione Microsoft Access Driver. Haga clic sobre el botn Finalizar.
5 Proporcione un nombre para el origen de datos (el DSN). El nombre puede ser cualquiera
que elija.
6 En Base de datos, haga clic sobre el botn Seleccionar. 7 Localice y seleccione su base de datos y luego haga clic sobre el botn Aceptar. 8 Si desea proteger el origen de datos con una contrasea, haga clic sobre el botn
Avanzado, proporcione su nombre de acceso y contrasea y luego haga clic sobre el botn Aceptar.
9 Haga clic sobre el botn Aceptar para agregar el DSN. El nuevo DSN debe aparecer en la
lista DSN del Sistema. Si la informacin es correcta, haga clic sobre el botn Aceptar para cerrar el applet.
7.1.7 Lista de pasos del Asistente de Bases de Datos

Hay entre cinco y siete pasos dentro del Asistente de Base de Datos, dependiendo del tipo de bloque que quiera crear. Todos los tipos de bloques tienen tres pasos en comn y la mayora de ellos tienen tambin el mismo cuarto y quinto pasos. La siguiente tabla muestra el nombre de los pasos dentro del asistente para los seis tipos de bloques.
204
Captulo 7
Tipo de Bloque Entrada
Paso 1 Tipo de Documento Tipo de Documento Tipo de Documento Tipo de Documento Tipo de Documento Tipo de Documento
Paso 2 Origen de Datos Origen de Datos Origen de Datos Origen de Datos Origen de Datos Origen de Datos
Paso 3 Campo de la Base de Datos Campo de la Base de Datos Campo de la Base de Datos Campo de la Base de Datos Campo de la Base de Datos Campo de la Base de Datos
Paso 4 Elementos de Bloque Sentencia de seleccin Sentencia de seleccin Sentencia de seleccin Sentencia de seleccin Sentencia de seleccin
Paso 5 Mtodo de entrada Elementos de Bloque Elementos de Bloque Elementos de Bloque Elementos de Bloque Parmetro s del grfico
Paso 6
Paso 7
Modificacin
Mtodo de entrada Parmetro s de la lista Parmetro s de la lista
Tabla
Lista
Detalle
Grfico
Tipo de grfico
Ttulos del grfico
La mayora de estos pasos se describen en las siguientes cinco secciones. La informacin de los otros pasos, especficas de un bloque, as como de notas de cada paso, pueden ser encontradas en las secciones 7.8 a la 7.13.
205
7.2 Seleccionando un documento de tipo dinmico

Tipo de Documento, el primer paso del Asistente de Base de Datos para todos los tipos de
bloques, es en el que se selecciona un tipo documento dinmico (ASP o PHP), especificando el tipo de conexin de la base datos y el sistema operativo utilizado en el servidor web que contendr los documentos habilitados por bases de datos.
7.2.1 Seleccionando un tipo de secuencia de comandos (script)

En el men Tipo de Secuencia de Comandos, seleccione el formato del documento dinmico que desea utilizar. Hay dos elecciones posibles: ASP y PHP. ASP (Active Server Pages) es el estndar propiedad de Microsoft para crear documentos actualizados de manera dinmica. El programa de servidor de Microsoft, Internet Information Server (IIS) y Personal Web Server (PWS), contienen apoyo interconstruido para ASP. En otras plataformas, el ASP se provee a travs de programas de terceras compaas tales como Chili!Soft ASP. Si su servidor Web tiene instalado IIS o PWS, ASP es probablemente la mejor seleccin para el formato del documento.
206 Captulo 7 Creando Documentos basados en Bases de Datos
PHP (PHP Hypertext Preprocessor) es un estndar de cdigo abierto para crear documentos web actualizados de manera dinmica. Es similar en su funcionamiento a ASP, pero de distribucin libre. PHP puede ser descargado de forma gratuita desde http://www.php.net.
7.2.2 Especificando el tipo de conexin de la base de datos

En el men Base de datos, especifique el tipo de conexin que es utilizado para tener acceso a la base de datos. Puede ser ODBC o Manejador MySQL Interconstruido. En la mayora de los casos se debe utilizar ODBC. Seleccione Manejador MySQL Interconstruido si utiliza una base de datos en un servidor Web del tipo Unix.
7.2.3 Especificando el Sistema Operativo del servidor

En el men SO del Servidor, se determina qu sistema operativo es el que usa el servidor que atiende al documento habilitado por la base de datos. Este ajuste slo es importante si se crea un bloque de grfico, en cuyo caso se usa para determinar el programa CGI apropiado que se usa para generar dinmicamente el grfico. Si el documento no contendr un bloque de grfico, este ajuste se ignora.
Requerimientos para tener una vista previa de un documento habilitado por una base de datos Para poder tener una vista previa del documento, debe seleccionar ASP como el tipo de secuencia de comandos y ODBC como el tipo de conexin de base de datos. Esto se debe a que Namo WebEditor usa conexiones ODBC para comunicarse con la base de datos para propsitos de la vista previa. Si selecciona PHP como el tipo de secuencia de comandos y el manejador MySQL interconstruido como tipo de conexin, no ser posible tener una vista previa del documento. Para superar esta limitacin, sugerimos que utilice ODBC mientras construye el documento y luego intercambie a Manejador MySQL Interconstruido justo antes de publicar el documento al sitio Web. Se pueden cambiar estos parmetros en el dilogo Propiedades del Encabezado del Documento (use el comando Insertar > Base de datos > Propiedades del Documento).
Seleccionando un documento de tipo dinmico
207
7.3 Seleccionando un origen de los datos

Origen de Datos, el segundo paso del Asistente de Base de Datos para todos los tipos de
bloques, incluye determinar un origen de datos (base de datos) del cual obtener el contenido del bloque, as como proporcionar su ID de usuario y contraseas, si son necesarios, para tener acceso a los datos.
Seleccione un origen de datos ODBC dentro de la lista Origen de Datos. Si es necesario, proporcione su ID de Usuario y Contrasea en los recuadros adecuados. Si el origen de los datos se encuentra protegido por contrasea y no se proporciona, se pueden terminar todos los pasos del asistente de bases de datos. Sin embargo, no se podr tener una vista previa del documento habilitado con la base de datos dentro de la ventana de Vista Previa.
7.1.6: Creando una conexin ODBC a una base de datos
Se debe seleccionar un origen de datos ODBC, aunque se haya seleccionado Manejador de MySQL interconstruido como la Conexin de la Base de Datos en el Paso 1 del Asistente de Bases de Datos. Esto se debe a que Namo WebEditor debe conectarse a la base de datos a travs de ODBC para poder obtener una lista de tablas y campos. Sin embargo, el documento publicado puede usar cualquier mtodo de conexin seleccionado en el primer paso del asistente (o en el dilogo Propiedades del Encabezado del Documento).
208
Captulo 7
7.4 Seleccionando campos de una base de datos

En Campos de la Base de Datos, el tercer paso del Asistente de Base de Datos para todo tipo de bloque, se seleccionan los campos de la base de datos que se desplegarn en el bloque.
La lista jerrquica del lado izquierdo del dilogo muestra todas las tablas del origen de datos que se especific en el paso previo del Asistente de Base de Datos. Si se hace clic sobre el smbolo de ms que se encuentra junto al nombre de la tabla, se muestran los campos de la tabla. La lista de la derecha muestra los nombres de los campos que sern usados en ese bloque, junto con el tipo de dato y otras informaciones. Para agregar un campo a la lista, seleccinelo a la izquierda y haga clic sobre el botn Agregar. Para agregar todos los campos a la vez, seleccione la tabla y haga clic sobre el botn Agregar. Para eliminar un campo de la lista de la derecha, seleccinelo y haga clic sobre el botn Eliminar. Para remover los campos de la lista derecha y volver a empezar, haga clic sobre el botn Borrar. Dependiendo del tipo de bloque, es posible seleccionar campos de ms de una tabla para incluir en el bloque. Si se est creando un bloque de entrada o modificacin, slo se pueden incluir campos de una tabla. Sin embargo, para cualquier otro tipo de bloque (los de salida), se pueden agregar campos de tablas mltiples. Si desea hacerlo, debe incluir un comando del
Seleccionando campos de una base de datos
209
tipo unin (join) dentro del paso de la Sentencia de Seleccin del asistente, para especificar cmo se relacionan las tablas. Para desplegar registros de bases de datos sencillas, normalmente slo se requieren seleccionar campos de una tabla. (En muchos casos la base de datos slo tiene una tabla.) Sin embargo, para desplegar los registros de bases de datos ms complejas, la seleccin de campos de tablas mltiples es esencial. Para comprender por qu, consideremos un ejemplo.
7.4.1 Seleccionando campos de una tabla

Primero consideremos un caso sencillo. Tenemos una base de datos con una tabla que contiene una lista de los pedidos de nuestros clientes. La estructura de los registros es la siguiente: Nombre del campo ID Fecha Cliente Producto Cantidad Tipo de Dato Nmero Fecha Cadena Cadena Nmero
Para crear un bloque de tabla que despliegue la informacin de esta base de datos, slo requerimos seleccionar todos los campos de la tabla. Puesto que slo contamos con una tabla, no se necesitan seleccionar campos de otras. Los primeros tres registros desplegados en nuestro bloque de tabla son similares a: ID 1 2 3 Fecha 8/5/00 8/12/00 8/27/00 Cliente John Doe Jane Deer Bill Blast Producto Namo WebEditor 4.0 DeepSearch 3.0 Namo WebEditor 4.0 Cantidad 5 1 10
7.4.2 Seleccionando campos de tablas mltiples

Consideremos ahora un ejemplo un poco ms complicado en el que intervienen tablas mltiples. Digamos que tenemos una base de datos que contiene dos tablas, una llamada Pedidos, que contiene la lista de pedidos u rdenes de los clientes y otra llamada Clientes, que almacena los datos de los clientes. La tabla de Pedidos tiene la siguiente estructura de registros:
210
Captulo 7
Nombre del campo Pedidos.ID Pedidos.Fecha Pedidos.Cliente Pedidos.Producto Pedidos.Cantidad Y la de Clientes esta: Nombre del campo Clientes.ID Clientes.Nombre Clientes.Calle Clientes.Ciudad [y as sucesivamente]
Tipo de dato Numro Fecha Numro Cadena Nmero
Tipo de dato Nmero Cadena Cadena Cadena []
Mientras que en la base de datos de tabla nica los clientes eran identificados por el nombre, dentro de la base de datos con dos tablas, los clientes se identifican por un nmero de identificacin. Los nmeros de identificacin dentro de Pedidos.Cliente corresponden directamente a los de Clientes.ID. Qu pasara si, al seleccionar los campos de nuestro documento habilitado por la base de datos, seleccionamos slo campos de la tabla de Pedidos y no de la de Clientes? Los primeros tres registros de nuestro bloque de tabla se veran as: ID 1 2 3 Fecha 8/5/00 8/12/00 8/27/00 Cliente 106 33 418 Producto Namo WebEditor 4.0 DeepSearch 3.0 Namo WebEditor 4.0 Cantidad 5 1 10
Obviamente, el tener nmero de identificacin de cliente en nuestra columna de clientes no es muy til. Sera mucho mejor si tuviramos sus nombres en esa columna. Para poder hacer esto, necesitamos seleccionar dos columnas de la tabla de Clientes Clientes.ID y Clientes.Nombre adems de los campos ya seleccionados de nuestra tabla de Pedidos. Al hacer esto, nuestro documento puede comparar los nmeros dentro del campo Pedidos.Cliente con los de Clientes.ID y encontrar el nombre correcto para desplegar. Este emparejamiento de tablas se realiza usando una clusula unin (join) en el paso Sentencia de Seleccin del Asistente de Base de Datos, descrito en la siguiente seccin.
Seleccionando campos de una base de datos
211
7.5 Proporcionando una Sentencia de Seleccin

La Sentencia de Seleccin es el cuarto paso del Asistente de Base de Datos para todo tipo de bloque a excepcin de los bloques de entrada, a los cuales esta informacin no se aplica. En este paso, se proporciona una clusula del tipo unin (join) si es que se seleccion campos de ms de una tabla dentro del paso Campo de la Base de Datos. Opcionalmente es posible elegir las clusulas donde (where) y ordenado por (order) para especificar qu campos de la base de datos se despliegan y en qu orden.
7.5.1 Clusula unin (join)

Una clusula de unin (join) le indica al documento cmo se relacionan los campos de mltiples tablas unos con otros. Una clusula de unin (join) no es necesaria (ni posible) si el bloque slo incluye campos de una tabla. Por otro lado, si el bloque incluye campos de ms de una tabla, la clusula de unin (join) es obligatoria.
212
Captulo 7
Cmo se formule la clusula unin (join) depende de la informacin que desea desplegar en el bloque y qu campos se encuentran relacionados. La forma bsica de una clusula de unin (join) es la siguiente: tabla1.campo1 = tabla2.campo2 La idea bsica es establecer una relacin entre los campos de dos tablas al incluir el signo de = entre los nombres de los dos campos. Si se deben hacer ms comparaciones del mismo tipo, se coloca la palabra AND (Y) entre ellas. Para ilustrar este punto, continuemos con el ejemplo de la seccin previa. Queremos establecer un bloque de tabla que muestre los registros de la base de datos Pedidos, que identifica a los clientes por nmero de identidad, pero usando los nombres que encontramos en la otra tabla para que aparezcan en la columna Clientes. As que agregamos los campos Clientes.ID y Clientes.Nombre al bloque para poder desplegar el nombre al emparejar la identificacin del cliente en el campo Pedidos.Cliente con el que se encuentra en Clientes.ID. La clusula unin (join) que debemos usar es la siguiente: Pedidos.Cliente = Clientes.ID Esto le indica al Asistente de Base de Datos que tomaremos los registros de la tabla Clientes donde el nmero que se encuentra en Clientes.ID sea el mismo que el encontrado en Pedidos.Cliente. Si no establecemos la clusula unin (join) (si fuera posible), el documento no podra saber qu registros de la tabla de Clientes debera desplegar en el bloque de tabla. El botn a un lado del recuadro Unin (join) nos da un atajo para introducir los nombres de los campos y operadores lgicos. En lugar de teclear los nombres, hacemos clic en el botn y los seleccionamos de la lista de los incluidos en el bloque. Una clusula de unin (join) no se aplica a bloques de entrada o modificacin, puesto que estos slo incluyen campos de una tabla nica.
7.5.2 Clusula donde (where)

Una clusula donde (where) es una condicin usada para especificar qu registro o registros de la tabla se despliegan en un bloque. Esta clusula es opcional dentro de un bloque de tabla, lista o grfico, pero obligatoria para bloques de detalle o modificacin, en los cuales se debe seleccionar un nico registro. La clusula donde (where) no es usada en los bloques de entrada. La forma bsica de una clusula donde (where) es:
tabla1.campo1 operador_comparacin valor|tabla2.campo2
Proporcionando una Sentencia de Seleccin
213
(El smbolo | entre los dos ltimos trminos indica que cualquiera de los dos, pero no ambos, puede ser usado.) Algunos operadores de comparacin son = (igual a), ! (no es igual a), < (menor que), > (mayor que) y BETWEENAND (entre y). Para hacer ms de una comparacin se debe usar la palabra AND (Y) si las condiciones deben ser ambas verdaderas, u OR (O) si basta con que una de ellas sea verdadera. Algunos ejemplos de clusulas donde (where) son:
Pedidos.Cantidad > 10 Pedidos.Cantidad BETWEEN 10 AND 20 Pedidos.Cantidad > 10 AND Clientes.Nombre = 'Trisha Long' Clientes.ID = <a,ID_cliente>
El ltimo ejemplo compara los valores en el campo con el argumento pasado al documento por un vnculo (la a significa argumento). Este tipo de clusula donde (where) es usado para un bloque de detalle o modificacin, en los cuales el registro seleccionado se despliega al hacer clic sobre el campo de salida que contiene un vnculo en otro documento.
7.9: Creando un bloque de detalle
El botn a un lado del recuadro Donde (where) nos da un atajo para introducir los nombres de los campos y operadores lgicos. En lugar de teclear los nombres, hacemos clic en el botn y los seleccionamos de la lista de los incluidos en el bloque.
7.5.3 Clusula ordenado por (order)

Una clusula ordenado por (order) se usa para especificar el orden de los registros desplegados en un bloque de tabla o lista. Sencillamente proporcione un nombre de campo por el cual realizar el ordenamiento. Si desea que la ordenacin se haga por llaves mltiples, proporcione el nombre de varios campos separados por comas. Dos ejemplos de una clusula ordenado por (order) son: Pedidos.Fecha Pedidos.Fecha, Clientes.Nombre En el primer ejemplo se ordenan los registros por el campo Pedidos.Fecha. En el segundo se ordenan los registros por dos campos primero por Pedidos.Fecha y luego por Clientes.Nombre. El botn a un lado del recuadro Ordenado por (order) nos da un atajo para introducir los nombres de los campos y operadores lgicos. En lugar de teclear los nombres, hacemos clic en el botn y los seleccionamos de la lista de los incluidos en el bloque.
214
Captulo 7
7.6 Agregando y quitando elementos de bloque

Elementos de Bloque es el cuarto paso del Asistente de Base de Datos para bloques de entrada y el quinto para los de tabla, lista, detalle o modificacin. Este paso no se usa en bloque de grficos.
En este paso se seleccionan los elementos que compondrn en bloque.
Los elementos de bloque son los ladrillos de los cuales se forman los documentos habilitados por bases de datos. Cada elemento del bloque provee una parte activa (es decir, generada dinmicamente) del contenido del documento cuando se ve en un navegador. Por ejemplo, si un bloque de tabla tiene un elemento de campo de salida, los valores en el campo de la base de datos que corresponden al campo de salida aparecern en el bloque cuando se vea en un navegador. As, la combinacin de elementos de bloque dentro de un bloque determina el tipo del contenido activo qu campos de la base de datos que aparecer en los documentos habilitados por bases de datos.
Agregando y quitando elementos de bloque
215
7.6.1 Tipos de elementos de bloque

Hay cinco tipos bsicos de elementos que un bloque puede tener: Campos de Salida Un campo de salida despliega los valores de un campo particular de una base de datos para cada registro del bloque. Campos de Entrada Un campo de entrada permite al visitante del sitio proporcionar un valor particular para un campo de una base datos de un registro. Controles de Entrada Un control de entrada es similar a un campo de entrada, pero permite al visitante del sitio seleccionar un elemento de un grupo, previamente definido, utilizando el ratn. Campos Ocultos Un campo oculto es utilizado para insertar un valor dentro de un registro de una base datos sin permitir que el visitante lo cambie. Conjunto de vnculos de pgina Un conjunto de vnculos de pgina permite al visitante ver registros adicionales de una tabla o bloque de lista al permitirle pasar a otra pgina de registros. No todo tipo de elemento puede existir en cualquier tipo de bloque. Los campos de salida son apropiados para los bloques de tabla, lista, detalle y (algunas veces) modificacin. Los campos y controles de entrada solamente pueden existir dentro de los bloques de entrada y modificacin. Los campos ocultos solamente son tiles dentro de los bloques de modificacin. Los vnculos de pgina solamente pueden existir dentro de los bloques de tabla o lista. A excepcin de los conjuntos de vnculos de pgina, cada tipo de elemento tiene dos o ms subtipos. En la tabla siguiente encontrar una lista detallada de los elementos junto con el tipo de bloque con el que pueden coexistir.
Tipo de elemento de bloque Campo de nmeros Campo de cadenas Campo de texto Campo de fecha entrada de entrada de entrada de entrada de Entrada, modificacin Bloque al que se aplica
Campos de entrada
Controles de entrada
Lista desplegable Grupo de botones de opcin
Entrada, modificacin
216
Captulo 7
Campos de salida
Campo de salida Campo de salida (vnculo)
Todos excepto el de entrada Modificacin Tabla, lista
Campo oculto Conjunto de vnculos de pgina
Adems de los tipos de elementos ya mencionadas, existe otro elemento de bloque que solamente puede existir dentro de uno grfico: el elemento grfico.
7.6.2 Editando la lista de elementos

Inicialmente la lista de los elementos de un bloque que se est creando contiene un campo de salida y uno de entrada por cada uno de los campos de la base datos que seleccion en el paso Campo de la Base de Datos del asistente. Adems de esto, si el bloque es uno del tipo tabla o lista, la lista de elementos incluye un conjunto de vnculos de pgina para permitir que el visitante pueda ver pginas adicionales de registros. En la mayora de los casos, no hay necesidad de editar la lista de elementos. Existen casos, sin embargo, en los cuales se deben agregar o eliminar ciertos elementos, particularmente si se incluyeron campos de una base datos que contiene ms de una tabla. Un ejemplo de una situacin en la cual es necesario eliminar ciertos elementos, la encontramos en los pedidos de los clientes que usamos como ejemplo en las secciones 7.4 y 7.5. En ese ejemplo, aadimos campos de dos tablas dentro de un bloque de tabla, incluyendo dos campos de la tabla Clientes: Clientes.ID y Clientes.Nombre. Agregamos esos campos para poder desplegar el nombre de cliente correspondiente a su identificacin, en lugar de slo un nmero. Sin embargo, puesto que el Asistente de Base de Datos agrega elementos de bloque para cada campo incluido, tenemos ahora elementos para los campos Clientes.ID y Clientes.Nombre en la lista elementos. Puesto que no necesitamos desplegar la identificacin de cliente, debemos remover el campo de salida para Clientes.ID de la lista de elementos. Adicionalmente, no requerimos un campo de salida para Pedidos.Cliente, que slo contiene el nmero de identificacin de cliente, por lo que tambin lo eliminamos. Hay veces en las cuales necesitaremos agregar elementos de bloque. Por ejemplo, se puede reemplazar un campo de entrada con una lista desplegable o un grupo de botones de opcin, para limitar al visitante a seleccionar un cierto nmero de elementos ya definidos para agregar al campo de la base datos. Si tenemos, por ejemplo, un bloque de entrada que sirve como formulario de pedido, se puede reemplazar el campo de entrada de los productos con una lista en la cual impedimos que el visitante invente nuevos productos. Para agregar un elemento al bloque, haga lo siguiente:
Agregando y quitando elementos de bloque
217
1 Haga clic en el botn Agregar. Una lista que contiene los tipos de elementos a usar
aparecer.
2 Seleccione un tipo de elemento de la lista. Se mostrar un dilogo de propiedades para el
elemento seleccionado.
3 Llene las propiedades del dilogo y haga clic sobre el botn Aceptar.
Se pueden tambin aadir elementos a un bloque dentro de la ventana de edicin, una vez que se han completado todos los pasos del Asistente de Base de Datos. Para mayor informacin de cmo aadir elementos a un bloque, incluyendo la descripcin del dilogo de propiedades de ese elemento, vea la seccin 7.13: Agregando y eliminando elementos de bloque en la ventana de Edicin. Para mayor informacin acerca de cmo agregar controles de entrada, vea la seccin 7.11: Creando un bloque de entrada.
218
Captulo 7
7.7 Apariencia de los bloques en la ventana de Edicin

Una vez que se haya completado el Asistente de Base de Datos, un nuevo bloque se insertar dentro del documento activo en la ventana de edicin, en el sitio donde se encontraba el punto de insercin. En la siguiente imagen se muestra cmo aparece un bloque de tabla para una lista de rdenes de clientes en la ventana de edicin, antes de realizar cualquier modificacin:
El rengln superior de la tabla contiene los nombres de la base de datos, que son etiquetas estticas. El segundo rengln contiene la mayora de los elementos activos del bloque: cada celda contiene un campo de salida. Las palabras valor de escritura sirven como marcador para cada uno de los campos de salida. Finalmente, el rengln inferior de la tabla contiene el conjunto de vnculos de la pgina utilizado para ver pginas adicionales de registros. La imagen inferior muestra un sencillo bloque de entrada para agregar nuevas rdenes de clientes, tal como aparece en la ventana de Edicin antes de cualquier modificacin.
En un bloque de entrada, los nombres de los campos aparecen a la izquierda de una tabla de dos columnas; los campos de entrada y controles, del lado derecho. Existe un rengln por
Apariencia de los bloques en la ventana de Edicin
219
cada elemento del bloque. En el caso particular que se muestra en la imagen superior, los elementos son del tipo campo de entrada de fecha, seguidos por dos mens desplegables y un campo de entrada de nmeros. Finalmente, en la parte inferior, encontramos el botn de envo (utilizado para que el visitante del sitio transmita la orden) y un botn de inicio (utilizado para limpiar todas las entradas del formulario de pedidos.)
7.7.1 Modificando la apariencia de un bloque

Se puede modificar y dar formato a un bloque, tal como si se tratara de un elemento esttico de la pgina. Si no est satisfecho con la distribucin de los elementos de un bloque, se pueden mover utilizando la tcnica de arrastrar y soltar o copiar y pegar. (Sin embargo, no se debe mover ningn elemento fuera del bloque.) Se le puede aplicar formato a un campo de salida sencillo o con vnculo al igual que si se tratara de un texto esttico. Se puede cambiar su tipografa, tamao de texto, colores y dems. Se puede aplicar incluso un estilo tipo CSS. Es posible cambiar el tamao, combinar o dividir las celdas de una tabla que se utiliza para ordenar los elementos de un bloque. Es posible, incluso, cambiar el tamao de la tabla as como sus bordes, color de fondo y cualquier otro atributo de apariencia. Las etiquetas que el Asistente de Base de Datos genera para los elementos pueden ser editadas y cambiadas de formato libremente. Incluso se pueden eliminar, puesto que son solamente texto esttico. Se puede agregar ms texto esttico o imgenes dentro o fuera del bloque. Se pueden modificar las etiquetas de los botones dentro de los bloques de entrada o modificacin. Para cambiar la etiqueta de un botn, haga doble clic sobre l y teclee el nuevo texto dentro del recuadro Valor.
220
Captulo 7
7.8 Creando un bloque de lista o tabla

Los bloques de lista o tabla son utilizados para desplegar registros mltiples. Un bloque de tabla muestra registros dentro de renglones y columnas, tal como una hoja de clculo, mientras que un bloque de lista los despliega de forma secuencial, con cada campo de salida en su propio rengln.
7.8.1 Ejemplo de un bloque de tabla

A continuacin mostramos un ejemplo de la salida de un bloque de tabla, tal como se ve en la ventana de Vista Previa:
A continuacin mostramos el mismo bloque de tabla dentro de la ventana de Edicin:
Este bloqueo de entrada en particular contiene campos de salidas con vnculos, que se indican por las palabras subrayadas nombre del vnculo, adems de los campos de salida normales.
Creando un bloque de lista o tabla 221
7.13.2: Agregando un vnculo a un campo de salida
7.8.2 Ejemplo de un bloque de lista

A continuacin mostramos un ejemplo de un bloque de lista tal como se ve en la ventana de Vista Previa. Este bloque en particular se utiliza para desplegar una lista de los artculos nuevos.
Como se muestra en el ejemplo, cualquier texto HTML dentro de un campo en la base datos se despliega correctamente dentro del navegador.
222
Captulo 7
A continuacin mostramos el mismo bloque de lista tal como se ve en la ventana de Edicin.
En este bloque de lista encontramos tres elementos: un campo de salida para la fecha de los nuevos artculos, un campo de salida para los artculos nuevos y un conjunto de vnculos de pgina. Las etiquetas (nombres de los campos) de ambos campos de salida han sido eliminados, dejando solamente los elementos activos. Se agreg texto esttico en la parte superior del bloque y una lnea de divisin horizontal debajo del segundo campo de salida.
7.8.3 Pasos para crear un bloque de lista o de tabla

Para crear un bloque de tabla, haga lo siguiente:
1 Cree un nuevo documento o abra uno ya existente. 2 Seleccione el comando Insertar > Base de datos > Bloque de Tabla. Esto inicia el
Asistente de Base de Datos.

3 Seleccione un tipo de documento dinmico tal como se describe en la Seccin 7.2 y luego
haga clic sobre el botn Siguiente.

4 Seleccione un origen de los datos tal como se describe en la Seccin 7.3 y luego haga clic
sobre el botn Siguiente.

5 Seleccione los campos de una o ms bases de datos como se describe en la Seccin 7.4 y
luego haga clic sobre el botn Siguiente.

6 Proporcione sentencias de seleccione opcionales tal como una clusula de unin (join)
si se incluyen campos de ms de una tabla dentro de la base de datos en el paso anterior como se describe en la Seccin 7.5 y luego haga clic sobre el botn Siguiente.
7 Si es necesario, edite la lista de elementos del bloque como ser describe en la Seccin 7.6
y luego haga clic sobre el botn Siguiente.

8 En el paso Parmetros de la lista, especifique el nmero de registros a desplegar por
pgina y luego haga clic sobre el botn Finalizar.
Creando un bloque de lista o tabla
223
Para crear un bloque de lista, haga lo siguiente:

1 Cree un documento nuevo o abra uno ya existente. 2 Seleccione el comando Insertar > Base de datos > Bloque de Lista. Esto inicia el

3 Seleccione un formato de documento dinmico tal como se describe en la Seccin 7.2 y



6 Proporcione sentencias de selecciones opcionales tal como una clusula de unin
(join) si se incluyen campos de ms de una tabla dentro de la base de datos en el paso anterior, como se describe en la Seccin 7.5 y luego haga clic sobre el botn Siguiente
7 Si es necesario, edite la lista de elementos del bloque como ser describe en la Seccin 7.6
y luego haga clic sobre el botn Siguiente.

8 En el paso Parmetros de la lista, especifique el nmero de registros a desplegar por
pgina y luego haga clic sobre el botn Finalizar. Una vez que se han completado todo los pasos del Asistente de Base de Datos, el bloque de tabla o lista se incorpora en la posicin donde encuentra el punto de insercin en el documento activo. De formato al bloque y agregue el contenido esttico que se requiera (vea la Seccin 7.16).
224
Captulo 7
7.9 Creando un bloque de detalle

Un bloque de detalle se utiliza para desplegar un registro nico, seleccionado por nmero de identificacin o cualquier otro criterio.
7.9.1 Ejemplo de un bloque de detalle

A continuacin mostramos un ejemplo de un bloque de detalle de un registro de un cliente, tal como se ve en la ventana de Vista Previa:
Creando un bloque de detalle
225
A continuacin mostramos el mismo bloque tal y como aparece en la ventana de Edicin:
Este bloque de detalle contiene once campos de salida, cada uno con una etiqueta. Se le ha dado formato al primer campo de salida y a su etiqueta modificndolo con una tipografa de gran tamao que sirve como una especie de encabezado para el resto del bloque.
7.9.2 Pasos para crear un bloque de detalle

Para crear un bloque de detalle, haga lo siguiente:
1 Cree un nuevo documento o abra uno ya existente. 2 Seleccione el comando Insertar > Base de datos > Bloque de Detalle. Esto inicia el



5 Seleccione los campos de la base de datos tal como se describe en la Seccin 7.4 y luego

6 En el paso Sentencia de Seleccin, proporcione una clusula donde (where) para
especificar qu registros se despliegan en el bloque y luego haga clic sobre el botn Siguiente. (Vea un poco ms abajo para mayor informacin.)
226
Captulo 7
7 Si es necesario, edite la lista de los elementos del bloque tal y como se describe en la
Seccin 7.6 y luego haga clic sobre el botn Finalizar. A diferencia de la mayora de los otros tipos de bloques, dentro de un bloque de detalle se debe proporcionar una clusula donde (where) que selecciona slo un registro. Si no se proporciona la clusula donde (where), el bloque de detalle sencillamente despliega el primer registro de la tabla de la base de datos. Si la clusula proporcionada no selecciona un registro nico, el bloque despliega el primer registro de los registros que la cumplen. Una forma de especificar un registro que no admita duplicados para desplegar, es especificar el valor de un campo que se encuentre restringido con caractersticas nicas, tal como un campo de identificacin. Por ejemplo se puede proporcionar una clusula donde (where) tal como Clientes.ID = 7 para seleccionar un registro nico que cumpla con esas caractersticas. Si se quiere relacionar un bloque de detalle con un campo de salida que utilice vnculos, la clusula donde (where) debe tener la siguiente forma: campo.tabla = <a,nombre_argumento> Esta sentencia compara los valores de un campo especfico con los del argumento enviados al bloque de detalle de parte del vnculo. Vea la siguiente seccin para ms informacin.
7.9.3 Creando un vnculo a un bloque de detalle

La forma ms prctica de utilizar un bloque de detalle es hacer que despliegue un registro que corresponda al valor nico de un campo. Esto se hace pasndole argumentos por medio de un campo de salida con un vnculo dentro de otro bloque. Para mostrar este punto, consideremos el siguiente ejemplo. Digamos que tenemos un bloque de tabla que despliega los pedidos de los clientes, tal como se muestra en la siguiente imagen:
227
En este bloque de tabla, los clientes se identifican por un nmero nico de identificacin. Quisiramos crear un vnculo sobre cada identificador a otro documento donde se mostrar el registro de informacin del cliente. Dentro del otro documento tendramos un bloque de detalle que podra ser similar al mostrado al principio de esta seccin. Para hacer esto necesitamos reemplazar el campo de salida con el identificador de cliente dentro del bloque de la tabla con un vnculo hacia el documento de detalle. El vnculo contendr un argumento, o parmetro, que contiene el nmero de identificador del cliente sobre el que el visitante hace clic. Necesitamos, tambin, declarar el argumento en el bloque detalle, de forma tal que sepa qu hacer con los argumentos que recibe. Finalmente, necesitamos colocar una clusula donde (where) dentro del bloque de detalle para comparar el valor del argumento con el de Clientes.ID incluido en el bloque. Estos son los pasos necesarios:
1 Borre el campo de salida para la identificacin de cliente dentro del bloque tabla.
Elimine este campo de salida.
2 Sin mover el punto de insercin, seleccione el comando Insertar > Base de datos >
Campo de Salida (Vnculo). El dilogo Propiedades del Campo de Salida (Vnculo)
aparecer.
3 Haga clic en el botn
a un lado del recuadro Campo de Base de datos y seleccione <f,Pedidos.Cliente>. (Este es el nombre del campo dentro de la base de datos para la identificacin de cliente. La f indica que lo que sigue es el nombre de un campo.) Haciendo esto especificamos que el campo de salida con vnculo despliegue los valores encontrados en el campo Pedidos.Cliente esto es, la identificacin del cliente tal como lo haca el campo de salida que eliminamos.
228
Captulo 7
4 En el recuadro URL, proporcione la ruta de acceso al documento que contiene el bloque
de detalle.
5 En Parmetros, dentro del recuadro Nombre, proporcione el nombre del argumento que
se enviar al documento de detalle cuando el campo de salida con vnculo sea presionado. Podemos utilizar cualquier nombre (sin espacios), puesto que an no hemos declarado ningn parmetro dentro del bloque de detalle. Llammosle ID_cliente.
a un lado del recuadro Valor y seleccione <f,Pedidos.Cliente> otra vez. Haciendo eso, especificamos que el valor del argumento debe ser la identificacin de cliente en la cual el visitante hizo clic. Por ejemplo, si el visitante hace clic en la identificacin del cliente 7, 7 es el valor del argumento que se enva al documento de detalle. en el lugar donde el campo de salida ordinario se encontraba.
7 Haga clic sobre el botn Aceptar. Nuestro nuevo campo de salida con vnculo se inserta
Insertar Campo de salida (vnculo).
8 Abra o cambie al documento que contiene el bloque de detalle
(detalle_cliente.asp, en este ejemplo).

9 Haga clic con el botn derecho del ratn en cualquier parte dentro del bloque de detalle y
seleccione Base de datos > Propiedades del Documento en el men de atajo. El dilogo Propiedades del Encabezado del Documento aparecer.
10 Haga clic en la solapa Parmetros y luego haga clic sobre el botn Agregar. Un nuevo
argumento aparece en la lista con el nombre temporal <Nuevo Arg>.

11 Escriba el nombre del argumento que se especific en la paso 5, ID_cliente y
presione la tecla <Intro>. El argumento ha sido declarado.
229
Agregar nuevo argumento.
12 Haga clic sobre el botn Aceptar para cerrar el dilogo. 13 Haga clic con el botn derecho del ratn nuevamente en cualquier parte del bloque y
seleccione Base de datos > Propiedades del Bloque en el men de atajo. El dilogo Propiedades del Bloque de Detalle aparecer.
14 Haga clic en la solapa Sentencia de Seleccin. 15 En el recuadro Donde (where), escriba Clientes.ID = <a,ID_cliente>, o use
el botn a un lado del recuadro que se utiliz para construir la sentencia trmino a trmino. (La a indica que lo que sigue en un argumento.) Esto informa al bloque de detalle que debe desplegar los registros cuyos valores dentro del campo Clientes.ID corresponda al argumento ID_cliente.
16 Haga clic sobre el botn Aceptar para cerrar el dilogo. 17 Guarde el documento.
Ahora lo que hacemos es verificar si el campo de salida con vnculo funciona. Cambie de nuevo al documento que contiene el bloque de tabla, pase a la ventana de Vista Previa y haga clic sobre cualquier campo que tengo un vnculo. Si el documento de detalle que es cargado dentro de la ventana de Vista Previa despliega el registro del cliente correspondiente a su identificador, el campo de salida con vnculo funciona correctamente.
230
Captulo 7
7.10 Creando un bloque de grfico

Un bloque grfico toma valores numricos de una o ms tablas de una base de datos y las muestra en un formato grfico.
7.10.1 Ejemplo de bloque de grfico

Por ejemplo, un bloque de grfico puede tomar los valores y nombres de los siguientes registros:
ID 1 2 3 4 5 6 Pas EE.UU. EE.UU. Corea Corea Japn Japn Producto Widgets Gewgaws Widgets Gewgaws Widgets Gewgaws Unidades 796 520 359 425 311 701
Y volcarlos en un grfico:
Creando un bloque de grfico
231
As es como se ve el grfico en la ventana de Edicin:
Se puede cambiar el tamao del bloque grfico haciendo clic sobre l y arrastrando las manijas que aparecen en sus esquinas y lados. Si hace doble clic sobre el grfico, abrir el dilogo Propiedades del Bloque Grfico, donde puede modificar el grfico casi de la misma manera que se modificara un grfico creado usando el Asistente de Grficos.
5.6: Creando grficos de tablas
7.10.2 Requerimientos de formato de una tabla de base de datos

Existen ciertas restricciones en la forma en que se le puede dar formato a una tabla, si es que queremos que sirva como origen de datos para un bloque de grficos: El bloque grfico solamente puede usar un valor numrico por registro. Si una tabla contiene ms de un campo numrico, solamente uno ser utilizado por el bloque grfico. Si desea que un bloque grfico obtenga las etiquetas de la tabla, sta debe proveer tanto etiquetas de series como de categoras. Si la tabla solamente tiene un tipo de etiqueta, el bloque grfico no puede usarlas y se deben proporcionar manualmente. Mostramos a continuacin ejemplos de tablas con el formato apropiado para ser usadas en un bloque grfico.
232
Captulo 7
Ejemplo 1
Registro 1 2 3 4 5 6 Pas EE.UU. EE.UU. Suiza Suecia Japn Japn Producto Widgets Gewgaws Widgets Gewgaws Widgets Gewgaws Vts_unit 796 520 359 425 311 701
Esta tabla es ideal para utilizar con un bloque grfico. Solamente hay un campo numrico y dos campos de cadenas, una de las cuales ser utilizada como origen de las etiquetas de las series y la otra de las categoras. La grfica producida de esta tabla puede tener ya sea dos series o tres categoras o tres series y dos categoras, dependiendo si los pases son series y los productos categoras o viceversa. Ejemplo 2
Registro 1 2 3 4 5 6 Tema Temperatura Temperatura Temperatura Temperatura Temperatura Temperatura media media media media media media Mes Enero Febrero Marzo Abril Mayo Junio Valor 30 40 47 55 60 65
Esta tabla tambin tiene un formato apropiado para su uso con un bloque grfico. En esta tabla, solamente encontramos una serie (temperatura media) junto con seis categoras (los meses). Ejemplo 3
Registro 1 2 3 4 5 6 Valor 796 520 359 425 311 701
En esta tabla slo encontramos valores, no hay etiquetas. Las etiquetas de las series y /o categoras se deben proporcionar manualmente. El nmero de series y categoras tambin debe especificarse manualmente.
7.10.3 Pasos para crear un bloque de grfico

1 Cree un nuevo documento o abra uno ya existente.
233
2 Seleccione el comando Insertar > Base de datos > Bloque de Grfico. Esto inicia el




6 Proporcione sentencias de selecciones opcionales tal como una clusula de unin
(join) si se incluyen campos de ms de una tabla dentro de la base de datos en el paso anterior como se describe en la Seccin 7.5 y luego haga clic sobre el botn Siguiente
7 En el paso Parmetros del grfico, seleccione el campo de la base de datos de donde se
obtendrn los valores numricos, utilizando la lista Valores dentro de Campos fuente. Slo los campos numricos aparecen en la lista
8 Seleccione los campos de la base de datos para obtener los Nombres de las series y los
Nombres de las Categoras o seleccione Introducir manualmente para proporcionar los nombres posteriormente. (Vea las siguientes dos secciones para detalles de este paso.) Cuando termine, haga clic sobre el botn Siguiente.
9 Seleccione un tipo y subtipo de grfico y luego haga clic sobre el botn Siguiente. (Este
paso es idntico al primer paso del Asistente de Grficos.)

10 Opcionalmente, proporcione un ttulo para el grfico y sus ejes X / Y y luego haga clic
sobre el botn Finalizar. (Este paso es idntico al ltimo paso del Asistente de Grficos.) El bloque grfico ser insertado en el documento activo. Para modificar su apariencia, haga doble clic sobre l y utilice la solapas Tipo de grfico, Ttulo, Series, Tendencias, Ejes y Formato del grfico en el dilogo Propiedades del Bloque Grfico.
234
Captulo 7
7.10.4 Obteniendo etiquetas de series y categoras de una base de datos
Para obtener etiquetas de las series y categoras a partir de un bloque grfico de una base datos, haga lo siguiente:
1 En el paso Parmetros del Grfico del Asistente de Base de Datos, seleccione
Recuperar de base de datos en Origen.
2 En la lista Nombre de las series en Campos fuente, seleccione el campo de la base de
datos del cual se tomarn las etiquetas de las series.

3 En la lista Nombre de Categoras, seleccione el campo de la base de datos del cual se
tomarn las etiquetas de las categoras. Una vez completado el Asistente de Base de Datos, si decide utilizar distintos campos como origen de las etiquetas de las series o categoras, se pueden cambiar las elecciones dentro de la solapa Parmetros del Bloque Grfico del dilogo Propiedades del Bloque Grfico. Para abrir el dilogo, haga doble clic sobre el bloque grfico.
235
7.10.5 Proporcionando las etiquetas de series y categoras de forma manual
Para proporcionar las etiquetas de las series o categoras de forma manual, haga lo siguiente:
1 En el paso Parmetros del Grfico del Asistente de Base de Datos, en Origen,
seleccione Introducir manualmente.

2 Proporcione el Nmero de Categoras y el Nmero de Series que el grfico debe tener. 3 Complete el Asistente de Grficos. 4 En la ventana de Edicin, haga doble clic sobre el bloque grfico para abrir el dilogo
Propiedades del Bloque Grfico y luego haga clic sobre la solapa Series.
236
Captulo 7
5 Seleccione una serie de la lista que se encuentra de lado izquierdo del dilogo y
proporcione el Nombre de las series en el recuadro correspondiente. Repita para cada serie.
6 Haga clic en la solapa Valores.
7 En la tabla en forma de hoja de clculo que se encuentra en la parte superior del dilogo,
proporcione la etiqueta de la categora para cada una de las celdas verdes en el encabezado Categora. Para teclear una etiqueta, haga doble clic en la celda, teclee el nombre y luego presione la tecla <Intro>.
Para confirmar que las etiquetas se introdujeron correctamente, cambie a la ventana de Vista Previa.
7.10.6 Publicando un documento con un bloque grfico

Un bloque grfico es distinto de los otros tipos que son creados por el Asistente de Base de Datos debido a que requiere un programa adicional, adems del ya existente para el servidor web, con el que su contenido se genera. Este programa adicional es llamado CGI y el Asistente de Base de Datos lo coloca, de forma predeterminada, en la misma carpeta en la cual se almacen el documento que contiene el bloque grfico. Cuando se publica un documento que contiene un bloque grfico, tambin se debe publicar el programa CGI. Si no se hace esto, el visitante del sitio no podr ver el grfico. El mantener el programa CGI dentro de la misma carpeta del documento facilita la publicacin, puesto que en la mayora de los casos se publica el contenido completo del directorio.
237
Sin embargo, puede ser que se requiera almacenar el programa CGI en una carpeta dentro del sitio web. Esto puede ser el caso si los derechos de acceso pblicos en la carpeta del documento no incluyen el permiso de ejecucin, en cuyo caso el programa CGI no puede ser activado. Si requiere almacenar el programa CGI en una carpeta distinta, tal como cgi-bin en su directorio de inicio, se debe especificar la ruta de acceso al programa CGI dentro de las propiedades del bloque grfico. Para hacer esto, primero se debe conocer el nombre del programa CGI. Refirase a la siguiente tabla para determinar el nombre correcto a utilizar.
Si el sistema operativo de su servidor Web es: Windows Linux Solaris Solaris x86 FreeBSD El nombre del programa CGI es: wed_chart_windows.cgi wed_chart_linux.cgi wed_chart_solaris.cgi wed_chart_solaris_x86.cgi wed_chart_freebsd.cgi
Una vez que se conoce el nombre del programa CGI, se puede construir la ruta de acceso apropiada para poderla especificar dentro de las propiedades del bloque grfico. Para construir la ruta, sencillamente anexe el nombre del archivo CGI a la ruta de la carpeta CGI a usar. Por ejemplo, si la carpeta CGI se encuentra en su directorio de inicio, el nombre de esa carpeta es cgi-bin, su servidor usa el sistema operativo Windows y almacenar el documento que contiene el bloque grfico en el directorio de inicio. Entonces la ruta de acceso correcta ser cgi-bin/wed_chart_windows.cgi. Para especificar la ruta de acceso dentro de las propiedades del bloque grfico, haga lo siguiente:
1 Haga doble clic sobre el bloque grfico para abrir el dilogo Propiedades del Bloque
Grfico y luego haga clic en la solapa Parmetros del Bloque Grfico.
2 Dentro de Ruta del CGI, proporcione la ruta de acceso del programa CGI. 3 Haga clic sobre el botn Aceptar.
Una vez que se cambia la especificacin de la ruta, no podr tener una vista preliminar del grfico a menos de que se copie el programa CGI a la misma localizacin en su disco duro, relativa al documento que se especific en la ruta. Por ejemplo, si su programa CGI va a residir en cgi-bin/wed_chart_windows.cgi, se debe crear una carpeta cgi-bin dentro del directorio donde se encuentra el documento y luego copiar el archivo wed_chart_windows.cgi a ella. Los programas CGI se localizan dentro de la carpeta donde fue instalado Namo WebEditor en el directorio lib/DBWizard. Si se utilizaron los parmetros predeterminados para la instalacin de Namo WebEditor ,el camino completo es: C:\Archivos de Programa\Namo\WebEditor 4\lib\DBWizard\
238
Captulo 7
Cuando publique un documento que tiene un bloque grfico, asegrese tambin de publicar el programa CGI al directorio adecuado dentro de su sitio web.
239
7.11 Creando un bloque de entrada

Un bloque de entrada es usado para permitir a los visitantes de su sitio Web crear nuevos registros en su base de datos.
7.11.1 Ejemplo de un bloque de entrada

Mostramos a continuacin un bloque de entrada para crear informacin de facturacin a un cliente:
240
Captulo 7
El mismo bloque tal como se ve en la ventana de Edicin:
En este ejemplo encontramos siete campos de entrada de cadena, una lista desplegable y dos grupos de botones de opcin. Ya se han realizado algunas modificaciones a la disposicin de la tabla. La lista Estado y el campo de entrada CPhan sido movidos de renglones separados al mismo rengln donde se encuentra el campo de entrada Ciudad. El grupo de botones de opcin Tipo de tarjeta de crdito y el campo de entrada Nmero de tarjeta de crdito tambin fueron movidos de su posicin original.
7.11.2 Pasos para crear un bloque de entrada

Para crear un bloque de entrada, haga lo siguiente:
1 Cree un nuevo documento o abra uno ya existente. 2 Seleccione el comando Insertar > Base de datos > Bloque de Entrada. Esto inicia el




6 Confirme que la lista de elementos del bloque es la correcta. Si desea reemplazar uno o
ms de los campos de entrada con controles de entrada, puede hacerlo en este momento presionando sobre el botn Agregar y seleccionando Men desplegable o Grupo de botones de opcin de la lista. Sin embargo, puede ser ms fcil agregar los controles de
Creando un bloque de entrada
241
entrada una vez que se ha terminado el asistente. (Vea la Seccin 7.13 para ms instrucciones.) Haga clic en el botn Siguiente.
7 Seleccione un mtodo de entrada: Obtener (GET) o Mandar (POST). ste es el mtodo
usado para enviar la informacin proporcionada por el visitante en el bloque de entrada a su servidor Web. Mandar (POST) es el mtodo recomendado cuando la informacin transmitida ser almacenada por el servidor, por ejemplo, en una base de datos. Puesto que ste es nuestro caso, seleccione Mandar (POST) a menos que tenga una razn especfica para utilizar Obtener (GET).
8 Opcionalmente, proporcione una direccin URL o un camino de acceso relativo en URL
resultante. Cuando el visitante del sitio haga clic sobre el botn de envo para transmitir
la informacin del bloque, el documento especfico ser abierto por el navegador. Si no se especifica una URL resultante, se recibe el mensaje genrico El proceso de entrada ha sido completado.
9 Haga clic en el botn Finalizar.
Una vez que se ha completado el Asistente de Base de Datos, puede reemplazar uno o ms de los campos de entrada con mens desplegables o grupos de botones de opcin.
7.13: Agregando o eliminado elementos de bloque en la ventana de Edicin.
242
Captulo 7
7.12 Creando un bloque de modificacin

Un bloque de modificacin es utilizado para permitir al visitante editar los registros existentes en una base datos. Es similar a un bloque de entrada, a excepcin de que en lugar de presentar una forma en blanco al visitante, el formulario ya se rellen con informacin existente del registro.
7.12.1 Ejemplo de un bloque de modificacin

A continuacin mostramos un bloque de modificacin para cambiar la informacin de facturacin de un cliente:
Creando un bloque de modificacin
243
El mismo bloque tal como se ve en la ventana de Edicin:
7.12.2 Pasos para crear un bloque de modificacin

Para crear un bloque de modificacin, haga lo siguiente:
1 Cree un nuevo documento o abra uno ya existente. 2 Seleccione el comando Insertar > Base de datos > Bloque de modificacin. Esto
inicia el Asistente de Base de Datos.




6 En el paso Sentencia de Seleccin, proporcione una clusula donde (where) para
especificar qu registro se despliega en el bloque y luego haga clic sobre el botn Siguiente. (Vea abajo para ms informacin.)
7 Confirme que la lista de elementos del bloque es la correcta. Si desea reemplazar uno o
ms de los campos de entrada con controles de entrada, puede hacerlo en este momento presionando sobre el botn Agregar y seleccionando Men desplegable o Grupo de botones de opcin de la lista. Sin embargo, puede ser ms fcil agregar los controles de entrada una vez que se ha terminado el asistente. (Vea la Seccin 7.13 para ms instrucciones.) Haga clic en el botn Siguiente.
8 Seleccione un mtodo de entrada: Obtener (GET) o Mandar (POST). ste es el mtodo
usado para enviar la informacin proporcionada por el visitante en el bloque de entrada a su servidor Web. Mandar (POST) es el mtodo recomendado cuando la informacin
transmitida ser almacenada por el servidor, por ejemplo, en una base de datos. Puesto que ste es nuestro caso, seleccione Mandar (POST) a menos que tenga una razn especfica para utilizar Obtener (GET).
9 Opcionalmente, proporcione una direccin URL o un camino de acceso relativo en URL
resultante. Cuando el visitante del sitio haga clic sobre el botn de envo para transmitir
la informacin del bloque, el documento especfico ser abierto por el navegador. Si no se especifica una URL resultante, se recibe el mensaje genrico El proceso de entrada ha sido completado.
Tal como en el bloque de detalle, se debe especificar una clusula donde (where) que seleccione nicamente un registro. Si no se proporciona, el bloque de modificacin desplegar el primer registro de la base de datos. Cuando el visitante haga clic sobre el botn de enviar, la informacin de todos los registros ser reemplazada por la informacin transmitida. Si se proporciona una clusula donde (where) que no seleccione un registro nico, el bloque desplegar el primero de ellos y la informacin de todos los registros coincidentes ser reemplazada con la informacin transmitida. Para ms informacin de cmo seleccionar correctamente la clusula donde (where), vea las secciones 7.9.2 y 7.9.3 en la seccin de cmo crear un bloque de detalle. Los procedimientos para el bloque de modificacin son los mismos.
Creando un bloque de modificacin
245
7.13 Agregando elementos de bloque en la ventana de Edicin

Si, una vez que se ha completado el Asistente de Base Datos, no se encuentra satisfecho con el conjunto de elementos de bloque dentro de su bloque, se pueden agregar, reemplazar o eliminar estos elementos dentro de la ventana de Edicin. Por ejemplo, se puede reemplazar un campo de entrada con un men desplegable o un grupo de botones de opcin. En los bloques de tabla, lista y detalle se pueden agregar nuevos campos de salida para los campos de la base datos que no fueron seleccionados en el proceso del Asistente de Base de Datos. En las siguientes secciones proveemos las instrucciones para agregar cada uno de los tipos de elementos de bloque.
No es posible agregar o remover elementos de bloque dentro de un bloque grfico. Un bloque grfico slo puede tener un elemento el propio grfico.
7.13.1 Agregando un campo de salida

Un campo de salida es un elemento de bloque que despliega el valor del campo de una base de datos. Los campos de salida (y, opcionalmente, los campos de salida con vnculo) son los constituyentes bsicos de los bloques de tabla, lista y detalle. Es posible agregar tambin campos de salida a un bloque de modificacin donde se desea mostrar el valor de un campo particular de una base de datos sin dejar que el visitante lo pueda modificar. Para agregar un campo de salida, haga lo siguiente:
1 Coloque el punto de insercin en el sitio dentro del bloque donde desea insertar el campo.
(El punto de insercin debe estar dentro del bloque.)

2 Seleccione el comando Insertar > Base de datos > Campo de salida. El dilogo
Propiedades del Campo de salida aparecer.
a un lado del recuadro Campo de Base de Datos y seleccione el campo de la base de datos cuyo contenido desea desplegar dentro del campo de salida y luego haga clic sobre el botn Aceptar.
Si el campo de la base de datos que desea utilizar no aparece dentro de lista Campo de Base de Datos, deber agregarlo dentro de las propiedades de bloque. Para agregar un campo de una base de datos, haga lo siguiente:
1 Haga clic con el botn derecho del ratn en cualquier parte dentro del bloque y
seleccione Propiedades del Bloque. El dilogo Propiedades del Bloque correspondiente al bloque activo aparecer.
2 Haga clic en la solapa Campos de la Base de datos.
246
Captulo 7
3 Seleccione el campo de la base de datos deseado dentro de la lista jerrquica del lado
izquierdo del dilogo y haga clic sobre el botn Agregar. El campo seleccionado aparecer en la lista de los incluidos dentro del lado derecho. Haga clic sobre el botn Aceptar. Ahora, use el comando Insertar > Base de datos > Campo de Salida de nuevo y seleccione el nuevo campo agregado a la base de datos dentro de la lista.
7.13.2 Agregando un campo de salida con vnculo

Un campo de salida con vnculo, al igual que un campo de salida ordinario, despliega el valor de un campo de una base de datos. Sin embargo, tambin acta como un vnculo a otro documento, por ejemplo a uno que contenga un bloque de detalle o modificacin. Al hacer clic sobre el campo de salida con vnculo, un visitante a nuestro sitio puede ver o modificar el registro correspondiente al elemento mostrado en ese campo de salida. Cuando se utiliza un campo de salida con vnculo para enlazar a un documento de detalle o modificacin, el vnculo enva al documento un argumento que contiene el identificador nico del registro a desplegarse dentro del bloque. El bloque de detalle o modificacin, por lo tanto, debe contener una declaracin del argumento para que sepa qu hacer con l. Los pasos necesarios para ajustar un campo de salida con vnculo son los siguientes:
1 En el documento al cual enlazar el campo de salida con vnculo, haga doble clic en
cualquier parte dentro del bloque de detalle o modificacin y seleccione Base de datos > Propiedades del Documento en el men de atajo. El dilogo Propiedades del Encabezado del Documento aparecer.
2 Haga clic en la solapa Parmetros y luego haga clic sobre el botn Agregar. Un nuevo
argumento con el nombre temporal <Nuevo Arg> se agregar.

3 Teclee el nombre para el nuevo argumento y presione la tecla <Intro>. El nombre puede
ser cualquiera mientras no contenga espacios ni cualquier otro smbolo de puntuacin que no sea el carcter de subrayado. Al finalizar, haga clic sobre el botn Aceptar.
4 Guarde el documento y cambie al documento en el cual quiere agregar el campo de salida
con vnculo.
5 Coloque el punto de insercin en la posicin del bloque donde desea agregar el campo de
salida con vnculo.

6 Seleccione el comando Insertar > Base de datos > Campo de Salida (Vnculo). El
dilogo Campo de Salida (Vnculo) aparecer.

a un lado del recuadro Campo de Base de Datos y seleccione el campo de la base de datos cuyo contenido desea desplegar dentro del campo de salida con vnculo.
Agregando elementos de bloque en la ventana de Edicin
247
8 En el recuadro URL, proporcione la direccin URL o el camino relativo de acceso al
documento con el cual enlazar el campo de salida con vnculo.

9 En el recuadro Nombre en Parmetros, teclee el nombre del argumento que agreg al
otro documento.
a un lado del recuadro Valor y seleccione el campo de la base de dato cuyo valor ser enviado al otro documento.
11 Haga clic sobre el botn Aceptar. 7.9.3: Creando un vnculo a un bloque de detalle
7.13.3 Agregando un campo de entrada

Un campo de entrada es un elemento de bloque que permite al visitante proporcionar un valor para un campo y registro particular de una base de datos. Los campos de entrada junto con los controles de entrada son los elementos principales de los bloques de entrada y modificacin. Los campos de entrada no pueden ser agregados a otros tipos de bloques. Hay cuatro tipos de campos de entrada, que corresponden a cuatro tipos de datos: nmero, cadena, texto y fecha. En una base datos, a cada campo se le asigna un tipo de dato, por lo que se debe usar el correspondiente campo de entrada. Para agregar un campo de entrada, haga lo siguiente:
1 Coloque el punto de insercin en el sitio del bloque de entrada o modificacin donde
quiere que el campo se agregue. (El punto de insercin debe estar dentro del bloque.)
2 Seleccione cualquiera de los comandos de campos de entrada dentro del submen
Insertar > Base de datos, tal como Insertar > Base de datos > Campo de Entrada de Nmeros. El dilogo correspondiente se abrir, en este ejemplo: Propiedades del Campo de Entrada.
3 Haga clic en la solapa Parmetros del Campo de Entrada. 4 En la lista Campo destino, seleccione el campo de la base datos que aceptar el valor
introducido dentro del campo de entrada. Solamente los campos de la base datos que correspondan al mismo tipo que el campo de entrada, aparecern en este men.
5 Si est agregando un campo de entrada a un bloque de modificacin, haga clic sobre el
botn que se encuentra a un lado del recuadro Valor predeterminado y seleccione el campo que proveer el valor para campo de entrada. (Dentro de lista, los nombres de los campos de la base de datos aparecen dentro de parntesis angulares, precedidos por una letra f,. Por ejemplo, <f,Clientes.Nombre>.)
6 Si est agregando un campo de entrada de nmeros o cadenas, especifique el Ancho en
caracteres y la Longitud mxima (tambin en caracteres).
7 Al agregar un campo de entrada de texto, especifique el Ancho en caracteres y la altura
del campo en Nmero de lneas.

8 Si est agregando un campo de entrada de fecha, especifique el Formato de fecha. Use
aa para representar el ao, mm para el mes, dd para el da, hh para las horas, mi para los minutos y ss para los segundos. Se puede usar cualquier carcter como separador.
Para introducir valores en un campo de datos Booleano (Verdadero/falso o S/no), use campos de entrada de nmeros, donde 1 = verdadero; 0 = falso.
7.13.4 Agregando un campo oculto

Un campo oculto es utilizado en un bloque de modificacin para insertar un valor dentro del registro de una base datos sin permitir que el visitante del sitio lo cambie. Por ejemplo, se puede reemplazar un campo de entrada con un campo oculto para un identificador dentro de una base datos, de forma tal que el visitante del sitio no pueda modificarlo. Para agregar un campo oculto, haga lo siguiente:
1 Coloque el punto de insercin en la posicin dentro del bloque de entrada o modificacin
donde desea que el campo se inserte. (El punto de insercin debe estar dentro del bloque.)
2 Seleccione el comando Insertar > Base de datos > Campo Oculto. El dilogo
Propiedades del Campo Oculto aparecer.
3 En la lista Campo destino, seleccione el campo de la base datos que aceptar el valor del
campo oculto.
a un lado del recuadro Valor predeterminado y seleccione el campo de la base datos que proveer el valor del campo de entrada.(En la lista solamente aparecen los nombres de los campos de la base datos dentro de parntesis angulares, precedidos por la letra f,. Por ejemplo, <f,Clientes.Nombre>.)
De manera predeterminada, un campo oculto no es invisible. El valor de campo oculto es visible para el navegador. Para hacer que el campo oculto sea efectivamente invisible, seleccione la pequea marca amarilla que representaba al campo oculto dentro de la ventana de Edicin y utilice el men Color de Tipografa en la barra de Formato y aplique el color del fondo documento al campo oculto.
7.13.5 Agregando un men desplegable o un grupo de botones de opcin

Los mens desplegables y grupos de botones de opcin llamados en conjunto controles de entrada son elementos de bloque que permiten al visitante seleccionar un elemento de una
Agregando elementos de bloque en la ventana de Edicin 249
lista. Los elementos de la lista son provistos por un campo dentro de la base datos (y los valores asociados potencialmente provistos por otro). Seleccionar un elemento de un control de entrada da el mismo resultado que escribir el valor dentro de un campo de entrada, pero ofrece la ventaja de limitar aquello que se puede seleccionar de forma tal que el visitante no pueda cometer errores. Cuando se usa un men desplegable o un grupo de botones de opcin, el valor que se introduce al usarlo puede ser distinto del elemento seleccionado por el visitante. Por ejemplo, en el grupo de botones de opcin que se muestra a continuacin, el visitante selecciona el elemento Visa, la palabra Visa no es necesariamente el valor que se almacena en la base datos. Aunque el valor que se enva a la base de datos puede ser el mismo que el elemento (la palabra Visa), puede ser cualquier otra cosa, tal como por ejemplo el nmero 3.
Es su eleccin si los elementos son los mismos que los valores. Si el campo de la base datos a la cual se agregaran los valores es del tipo numrico, los valores deben ser nmeros, sin embargo, probablemente desee obtener los elementos del control de entrada de un campo distinto de la base de datos, que contenga palabras en lugar de nmeros. Por lo tanto, cuando se agrega un men desplegable o un grupo de botones de opcin, no slo debe especificar el campo de la base de datos que proveer los elementos del control de entrada, sino el campo que provee los valores asociados an cuando los elementos y sus valores sean idnticos. Para agregar un men desplegable o un grupo de botones de opcin, haga lo siguiente:
1 Coloque el punto de insercin en el sitio del bloque de entrada o modificacin donde
quiere que el campo se agregue. (El punto de insercin debe estar dentro del bloque.)
2 Seleccione el comando Insertar > Base de datos > Men desplegable o Insertar >
Base de datos > Grupo de botones de opcin. Esto iniciar una variacin del Asistente
de Base de Datos para el control de entrada seleccionado.

3 Seleccione un origen de datos ODBC, proporcione la ID de usuario y contrasea si es
necesario y luego haga clic sobre el botn Siguiente.

4 En el paso Campo de la Base de Datos, en la lista jerrquica de la izquierda, seleccione
el campo origen de la base de datos para los elementos del control de entrada. Si los elementos y sus valores asociados sern distintos, seleccione tambin el campo origen de los valores y luego haga clic sobre el botn Agregar. Una vez terminado, haga clic sobre el botn Siguiente.
5 Opcionalmente proporcione la clusula donde (where) para especificar qu registros
utilizar (deje en blanco para usar todos los registros) y / o la clusula ordenado por
250
Captulo 7
(order) para indicar cmo se ordenan los registros. Al terminar, haga clic sobre el botn Siguiente.
6 En la lista Campo destino, seleccione el campo de la base de datos que recibir el valor
seleccionado dentro del control de entrada.

7 En la lista Campo origen para los elementos del men o Campo origen para las
etiquetas del botn de opcin dependiendo de qu tipo de control de entrada se est
agregando seleccione el campo origen de la base de datos para los elementos del control de entrada.
8 En la lista Campo origen para los valores de los elementos o Campo origen para los
valores del botn de opcin seleccione el campo origen de la base de datos para los valores asociados con los elementos del control de entrada.
9 Si est agregando el control de entrada a un bloque de modificacin, haga clic en el botn
a un lado del recuadro Valor predeterminado seleccione el campo de la base de datos que proveer el valor predeterminado para el control de entrada. (ste es usualmente el mismo que el campo destino.)
Agregando elementos de bloque en la ventana de Edicin
251
7.14 Modificando las propiedades basadas en una base de datos

Si una vez que se completo el Asistente de Base de Datos no se encuentra a gusto con cualquiera de las elecciones realizadas, se pueden modificar en cualquier momento al hacer clic con el botn derecho del ratn dentro de un bloque y seleccionar Base de datos > Propiedades del Documento o Base de datos > Propiedades del Bloque en el men de atajo.
Se puede modificar cualquiera de las elecciones realizadas dentro del Asistente de Base de Datos a excepcin del origen de los datos. Si se requiere cambiar la eleccin del origen de los datos, se debe crear un nuevo bloque utilizando el asistente.
7.14.1 Cambiando el tipo de documento

Para cambiar cualquiera de estos ajustes: El formato del documento dinmico El mtodo de conexin de la base de datos Los parmetros del sistema operativo del servidor Haga clic con el botn derecho del ratn y seleccione Base de datos > Propiedades del Documento en el men de atajo. Cambie cualquier parmetro en la solapa Tipo de Documento del dilogo Propiedades del Encabezado del Documento. (Esta solapa es idntica a la del paso del Asistente de Base de Datos con el mismo nombre.)
7.14.2 Cambiando la lista de los campos de una base de datos incluidos

Para agregar o quitar campos de la base datos incluidos dentro de un bloque, haga clic con el botn derecho del ratn en el bloque, seleccione Base de datos > Propiedades del Bloque en el men de atajo y luego haga clic en la solapa Campo de la Base de Datos. (Esta solapa es idntica a la del paso del Asistente de Base de Datos con el mismo nombre.)
7.14.3 Cambiando la sentencia de seleccin

Para cambiar la sentencia de seleccin de un bloque, haga clic con el botn derecho del ratn en el bloque, seleccione Base de datos > Propiedades del Bloque en el men de atajo y
252
Captulo 7
luego haga clic en la solapa Sentencia de Seleccin. (Esta solapa es idntica a la del paso del Asistente de Base de Datos con el mismo nombre.)
7.14.4 Cambiando el mtodo de entrada o los parmetros de la lista

Para cambiar el mtodo de entrada de un bloque de entrada o modificacin, haga clic con el botn derecho del ratn en el bloque, seleccione Base de datos > Propiedades del Bloque en el men de atajo y luego haga clic en la solapa Mtodo de entrada. (Esta solapa es idntica a la del paso del Asistente de Base de Datos con el mismo nombre.) Para cambiar los parmetros de la lista en un bloque de tabla o lista, haga clic con el botn derecho del ratn en el bloque, seleccione Base de datos > Propiedades del Bloque en el men de atajo y luego haga clic en la solapa Parmetros de la lista. (Esta solapa es idntica a la del paso del Asistente de Base de Datos con el mismo nombre.)
Modificando las propiedades basadas en una base de datos
253
Parte Tres
Proyectos y Administracin de Sitios Web
Captulo 8
Trabajando con Proyectos
Al mantener los documentos Web dentro de un proyecto tomamos ventaja de las poderosas caractersticas del Administrador de Sitio Web incluido con Namo WebEditor. En l encontramos funciones tales como la verificacin automtica de vnculos y la bsqueda y reemplazo global. Adems de esto, se puede crear un rbol de navegacin para el proyecto e incluir una barra de navegacin dinmica en sus documentos.
En este captulo
8.1 8.2 8.3
Creando un proyecto Administrando los documentos de un proyecto Administrando la navegacin del sitio Web
257
8.1 Creando un proyecto

El proyecto es una coleccin de documentos web y sus archivos de recursos (imgenes, hojas de estilo, etc.) que se mantienen en la misma carpeta del disco duro y se gestionan utilizando el Administrador de Sitio Web. Si est construyendo un sitio Web completo, es una buena idea mantener los documentos y sus archivos de recursos dentro de un proyecto, puesto que de esa manera se pueden administrar ms eficientemente. Al utilizar un proyecto se vuelve mucho ms sencillo agregar o remover documentos, publicar los documentos a un sitio web y realizar operaciones sobre varios documentos a la vez, tales como bsqueda y reemplazo global, verificar vnculos y cambiar el juego de caracteres usados. Adems, el mantener los documentos en un proyecto permite crear un rbol de navegacin para el sitio web. Un rbol de navegacin no solamente ayuda a visualizar las relaciones entre los documentos de un proyecto, sino que permite crear barras de navegacin dinmicas dentro del documento que cambian de forma automtica al agregar, remover, arreglar o cambiar de nombre a un documento.
8.1.1 Creando un nuevo proyecto

Hay dos formas de crear un nuevo proyecto: se puede usar el Asistente de Sitios Web que crea un proyecto completo con documentos listos para modificar, o se puede crear un proyecto nuevo, vaco. Para crear un nuevo proyecto vaco, haga lo siguiente:
1 Use el comando Archivo > Proyecto > Nuevo Proyecto. 2 En el dilogo Crear Nuevo Proyecto, de un nombre al proyecto y especifique en qu
carpeta se guardar. (Haga clic en el botn Examinar para seleccionar un directorio.)

3 Haga clic sobre el botn Aceptar. Si el directorio especificado no existe, se le preguntar
si se crea. Haga clic en el botn S.

4 Aparecer un nuevo dilogo donde se le pregunta si quiere habilitar el control de cdigo
para el proyecto. Si va a usar Microsoft SourceSafe en el proyecto, haga clic sobre el botn S. De otra forma, presione el botn No.
9.1: Introduccin al Control de Cdigo
Un nuevo proyecto ser creado en el directorio especificado y la ventana del Administrador de Sitio Web aparecer. En la parte superior de la ventana encontrar un nuevo icono que representa el proyecto, junto con su nombre y directorio.
1.1: Usando el Asistente de Sitios Web
258
Captulo 8
8.1.2 Agregando nuevos documentos a un proyecto

Una vez que se ha creado un nuevo proyecto, se le pueden agregar documentos usando la solapa Proyecto del Administrador de Sitio Web. Para agregar un nuevo documento al proyecto, haga lo siguiente:
1 Cambie al Administrador de Sitio Web, si no es la ventana que se encuentra al frente.
(Haga clic en el botn Administrador de Sitio Web, en la barra de tareas de Windows o use el comando Ventana > Administrador de Sitio Web o presione las teclas <Alt + 1> dentro de la ventana principal de Namo WebEditor.)
2 Haga clic en la solapa Proyecto. 3 Para crear un nuevo documento a nivel superior del proyecto, haga clic con el botn
derecho del ratn sobre el nombre del proyecto o en el icono que se encuentra en el panel superior de la ventana del Administrador de Sitio Web y seleccione Nuevo > Nuevo Documento en el men de atajo. Para crear un nuevo documento en una carpeta dentro del proyecto, haga clic con el botn derecho del ratn sobre el nombre de la carpeta o su icono. Un nuevo documento en blanco se agregar al proyecto, con el nombre predeterminado de newfile.htm. Proporcione de inmediato un nombre y presione la tecla <Intro> o solamente presione la tecla <Intro> para aceptar el nombre propuesto. Si proporciona un nuevo nombre, aparecer un dilogo con el mensaje: El proyecto ha sido modificado. Quiere cambiar los hipervnculos? Puesto que probablemente an no tiene vnculos en su nuevo documento, haga clic sobre el botn No.
8.1.3 Agregando documentos existentes a un proyecto

Cuando se crea un nuevo proyecto vaco, cualquier documento que ya existe en la carpeta donde el proyecto se crea no se registra automticamente en ste. Los archivos que no han sido registrados dentro del proyecto no pueden ser gestionados por el Administrador de Sitio Web. Para agregar un documento ya existente que no se encuentre registrado dentro del proyecto, haga clic con el botn derecho del ratn sobre el nombre del proyecto o su icono en el panel superior de la solapa Proyecto del Administrador de Sitio Web y seleccione Agregar todos los archivos al Proyecto. Esto har que los archivos de la carpeta y sus subcarpetas se registren en el proyecto. Si desea registrar solamente algunos de los documentos existentes, seleccinelos (Mays-clic o Ctrl-clic para seleccionar documentos mltiples), o haga clic con el botn derecho del ratn en cualquiera de ellos y seleccione Agregar al Proyecto en el men de atajo.
Creando un proyecto
259
Si tiene algunos documentos en carpetas distintas a la cual reside el proyecto, primero deben ser movidos a la carpeta del proyecto. Utilice el icono Mi PC o el explorador de Windows para moverlos y luego agregarlos al proyecto como se describi en el prrafo anterior. Para quitar un documento del proyecto, haga clic con el botn derecho del ratn sobre l y seleccione Remover del Proyecto.
8.1.4 Creando carpetas en un proyecto

Si tiene un gran nmero de archivos en su proyecto, es buena idea crear subdirectorios para almacenar grupos de documentos similares relacionados. Por ejemplo, se pueden mantener todos los archivos de imgenes dentro de una carpeta llamada images, todas las hojas externas de estilo dentro de una carpeta llamada css y tener un directorio distinto para cada seccin de documentos en un proyecto grande. Las carpetas pueden dividirse a su vez en otras carpetas. Para crear una nueva carpeta o subcarpetas dentro de un proyecto, haga clic con el botn derecho del ratn sobre el icono del proyecto o una carpeta dentro de la lista que se encuentra bajo el icono de proyectos (en el panel superior de la solapa Proyecto) y seleccione Nuevo > Nueva carpeta. Se agrega una carpeta llamada newfolder en la lista de carpetas bajo el proyecto o en el directorio seleccionado. Proporcione de inmediato un nombre y presione la tecla <Intro>, o solamente presione la tecla <Intro> para aceptar el nombre propuesto. Si proporciona un nuevo nombre, aparecer un dilogo con el mensaje: El proyecto ha sido modificado. Quiere cambiar los hipervnculos? Puesto que la carpeta est vaca, haga clic sobre el botn No.
8.1.5 Creando un subproyecto

Es posible crear un subproyecto dentro del proyecto. Generalmente, la nica razn para hacer esto es utilizar un rbol de navegacin separado para un grupo de documentos dentro del proyecto.
8.3.1: Creando un rbol de navegacin
Para crear un subproyecto dentro del proyecto, cambie a la solapa Proyecto del Administrador de Sitio Web, haga clic con el botn derecho del ratn sobre el icono del proyecto y seleccione Nuevo > Subproyecto. En el dilogo Crear Subproyecto, proporcione el nombre de la carpeta donde el subproyecto se almacenar y luego haga clic sobre el botn Aceptar. (La carpeta del subproyecto ser creada dentro de la del proyecto.) Un nuevo subproyecto llamado Nuevo Proyecto aparecer dentro del proyecto. Para cambiar el nombre de su proyecto haga clic con el botn derecho del ratn sobre su icono o su nombre y seleccione Propiedades en el men de atajo. En el recuadro Nombre del dilogo Propiedades del archivo, teclee el nuevo nombre y haga clic sobre el botn Aceptar.
260
Captulo 8
8.2 Administrando los documentos de un proyecto
8.2.1 Cambiando de nombre o renombrando archivos y carpetas

Para cambiar el nombre de un archivo o carpeta en un proyecto, haga lo siguiente:
1 Cambie a la solapa Proyecto del Administrador de Sitio Web. 2 Haga clic con el botn derecho del ratn en el archivo o carpeta que quiere cambiar el
nombre y seleccione Cambiar Nombre en el men de atajo.

3 Teclee el nuevo nombre y presione la tecla <Intro>.
Aparecer un dilogo con el mensaje El proyecto ha sido modificado Quiere cambiar los hipervnculos? Si se presiona sobre el botn S, cualquier vnculo en los documentos que pertenezcan al proyecto que apunten al archivo con el nuevo nombre (o cualquier archivo dentro del recin nombrado directorio) sern actualizados a la nueva ruta de acceso. Para borrar un archivo o carpeta, haga clic con el botn derecho del ratn sobre l y seleccione Borrar en el men de atajo. Aparece un dilogo pidiendo la confirmacin de la eliminacin. Haga clic en el botn S para proceder.
8.2.2 Moviendo o copiando documentos dentro de un proyecto

Para mover un archivo de una carpeta a otra, cambie a la solapa Proyecto del Administrador de Sitio Web y arrastre el archivo a la nueva posicin. Un dilogo aparece con el mensaje El proyecto ha sido modificado Quiere cambiar los hipervnculos? Si presiona sobre el botn S, cualquier vnculo de los documentos que pertenezcan al proyecto y que apunten al archivo que se acaba de mover sern actualizados a la nueva ruta de acceso. Para copiar el archivo en lugar de moverlo, mantenga presionada la tecla <Ctrl> mientras arrastra el archivo a su nueva carpeta destino. No es posible mover una carpeta. Sin embargo, se puede crear una nueva carpeta en la posicin deseada, darle el mismo nombre que la vieja, mover todos los archivos de una a otra y borrar posteriormente la carpeta vieja.
Administrando los documentos de un proyecto
261
8.2.3 Desplegando los vnculos de y hacia un documento

La solapa Vnculos del Administrador de Sitio Web despliega una vista grfica de los vnculos que van desde y hacia cualquier documento del proyecto.
El icono a la mitad de la ventana representa el documento analizado (documento cuyos vnculos se muestran). Los iconos a la izquierda representan los documentos del proyecto que tienen un vnculo hacia el documento analizado. Los iconos a la derecha representan los vnculos que se encuentran dentro del documento analizado. Estos pueden ser archivos dentro del proyecto o direcciones URL de Internet. Si un vnculo dentro del documento analizado est roto, el icono referenciado tendr una X roja. La primera vez que se cambia a la ventana de Vnculos despus de abrir un proyecto, solamente aparece un icono. A qu documento se refiere el icono es determinado por el documento que se encuentra en ese momento activo dentro de la ventana de Edicin. (Si no hay documentos abiertos en la ventana de edicin, la ventana Vnculos estar vaca.) Para poder ver todos los vnculos dentro de un documento de un proyecto, se debe realizar una verificacin de vnculos de proyecto. Utilice el comando Verificar todos los Vnculos en el men Herramientas del Administrador de Sitio Web para realizar una comprobacin completa. Para cambiar a un documento distinto dentro de la ventana Vnculos, haga doble clic en otro icono de documento. El documento seleccionado ser ahora el nuevo documento analizado. Solamente los documentos HTML del proyecto no los archivos de recursos o documentos dentro de la web pueden ser analizados.
262
Captulo 8
8.2.4 Verificando los vnculos de un proyecto

Antes de publicar un proyecto y peridicamente mientras se trabaja en l se deben verificar los vnculos dentro de los documentos del proyecto para asegurarse de que son vlidos. Para realizar esto, utilice el comando Verificar todos los vnculos o Verificar vnculos de forma incremental en el men Herramientas del Administrador de Sitio Web. La diferencia entre los dos comandos es que el ltimo verifica solamente aquellos vnculos que han sido aadidos o modificados desde la ltima vez que se realiz una revisin, mientras que el primero analiza todos. El resultado de una verificacin de vnculos aparece dentro de la ventana Resultados, que inicialmente se encuentra encajada en la parte baja de la ventana principal de Namo WebEditor. Se puede mover la ventana de Resultados a otra posicin al arrastrar por sus manijas (la barra doble en su borde derecho).
Hay tres tipos de problemas que pueden ser descubiertos en una verificacin de vnculos: Vnculo roto Indica que el destino de un vnculo no pudo ser encontrado. Esto puede ocurrir si se borra un documento pero no se remueve o cambia el vnculo en otros documentos. Un vnculo roto tambin puede ser el resultado de mover o cambiar el nombre a un documento fuera de Namo WebEditor, por ejemplo al utilizar el explorador de Windows. (Si mueve o cambia el nombre de un documento utilizando el Administrador de Sitios Web de Namo WebEditor, este modificar todos los vnculos afectados de forma automtica.)
Vnculo externo Indica que el destino de un vnculo pertenece a un sitio web externo. Esto no significa que el enlace est roto o sea invlido, sino que Namo WebEditor no ha verificado el vnculo puesto que no se tiene la opcin Verificar vnculos externos al verificar vnculos activada dentro de la solapa Proyectos del dilogo Preferencias. (Nota: Namo WebEditor slo puede verificar vnculos externos HTTP (Web). Otros tipos de vnculos, tales como FTP y mailto, no son verificados.) Hurfano Indica que no hay vnculos a este documento existentes en otros documentos del proyecto. Los documentos hurfanos no pueden ser visitados desde el exterior puesto que no hay forma de acceder a ellos. Si no es su intencin utilizar un documento hurfano, se puede borrar con seguridad.
263
Para examinar un vnculo roto, haga doble clic sobre l dentro de la ventana de Resultados. El documento que tiene el vnculo roto ser abierto en la ventana de Edicin. El punto de insercin se colocar justo antes del vnculo para removerlo o arreglarlo. Haga doble clic en un elemento hurfano en la ventana de Resultados para abrirlo en la ventana de Edicin si es posible.
8.2.5 Realizando bsqueda y reemplazo global

El comando de Bsqueda y Reemplazo Global permite buscar texto especfico en todos los documentos del proyecto actual, o en los documentos dentro de una carpeta, opcionalmente reemplazando el texto encontrado con otro especificado. Para realizar una bsqueda y reemplazo global, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 Seleccione Bsqueda y Reemplazo Global en el men de Herramientas. El dilogo
Bsqueda Global aparecer.
3 En el recuadro Buscar, teclee el texto a buscar o use la lista proporcionada para
seleccionar cadenas utilizadas anteriormente.

4 Si desea reemplazar el texto encontrado con otro, seleccione Reemplazar con y teclee el
texto de reemplazo dentro del recuadro o utilice la lista proporcionada para seleccionar de cadenas utilizadas anteriormente.
5 Seleccione Buscar proyecto para realizar la bsqueda dentro del proyecto activo o
seleccione Buscar carpeta para buscar dentro de un directorio determinado. Si selecciona Buscar carpeta, proporcione la ruta de acceso o haga clic sobre el botn Examinar para localizar y seleccionar una carpeta.
6 En Opciones, seleccione las deseadas. Para buscar el cdigo fuente HTML de los
documentos, en lugar del texto visible dentro de la ventana de edicin o en un navegador, seleccione Buscar en Cdigo HTML.
7 Haga clic en el botn: Buscar Siguiente, Buscar Todo, Reemplazar o Reemplazar
Todo, dependiendo de la accin que desee realizar.
Si presiona sobre el botn Buscar Todo o Reemplazar Todo, el resultado de la bsqueda (o el reemplazo) se muestra en la lista en la parte inferior del dilogo. Si hace doble clic sobre un elemento de la lista de resultados, el documento que contiene el texto ser abierto en la ventana de Edicin. Dentro del documento, la primera aparicin del texto se realza.
El resultado de una accin de reemplazo global no puede deshacerse. Utilice este comando con cuidado.
264
Captulo 8
8.2.6 Cambiando el lenguaje de codificacin en un proyecto

Si su proyecto contiene algn documento con un idioma que usa caracteres no latinos, se debe seleccionar una codificacin del lenguaje (juego de caracteres) apropiado al tipo de caracteres utilizados en l. Al especificar un lenguaje de codificacin ayudamos a que el documento se despliegue correctamente dentro del navegador del visitante al sitio. As, por ejemplo, se tiene un documento que contiene texto en chino, pero si no se fija el lenguaje de codificacin al juego de caracteres chinos, el documento puede representarse de forma ilegible en aquellos navegadores que utilicen la codificacin occidental europea de manera predeterminada. Al especificar el lenguaje correcto de codificacin, aseguramos que el navegador despliegue el documento, si esto es posible. Aunque es posible determinar el idioma de codificacin de documentos individuales dentro del dilogo Propiedades del Documento, es mucho ms conveniente fijar la codificacin para todos los documentos del proyecto a la vez. Para fijar o cambiar el lenguaje de codificacin dentro de un proyecto, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 Seleccione Cambiar Codificacin en el men Herramientas. El dilogo Cambiar
Codificacin aparecer.
3 Seleccione un juego de caracteres de la lista Cambiar codificacin a. (Seleccione

definido por el usuario para dejarlo sin especificar.)
4 En Destino, especifique el rango de los documentos a los cuales se aplicar la nueva
codificacin. Si se selecciona Documentos seleccionados en el proyecto, todo los documentos del proyecto se seleccionan de manera predeterminada. Para quitar la seleccin a un documento de la lista, haga clic sobre l mientras mantiene presionada la tecla <Ctrl>.
5 Haga clic en el botn Cambiar para aplicar el juego seleccionado de caracteres a los
documentos especificados.
265
8.3 Administrando la navegacin del sitio Web

Una de las grandes ventajas de utilizar un proyecto es que se puede crear un rbol de navegacin para sus documentos. Un rbol de navegacin es como un rbol de familia: el rbol define las relaciones entre los documentos del proyecto. Cada documento es un padre, hijo o hermano de por lo menos otro. A continuacin mostramos un ejemplo del rbol de navegacin de un pequeo sitio web del tema familia:
El propsito principal de crear un rbol de navegacin es habilitar el uso de las barras dinmicas de navegacin dentro de los documentos del proyecto. Los vnculos dentro de la barra dinmica de navegacin siempre enlazan a un juego especfico de documentos, determinado por la relacin que los documentos guardan dentro de la barra de navegacin. Por ejemplo, la barra dinmica de navegacin de un documento puede contener vnculos a todo los hijos de ese documento. Si alguno de los documentos hijos cambian de nombre, son eliminados o se reemplazan con otros documentos, la barra dinmica de navegacin se actualiza de forma automtica para reflejar esos cambios. Si existen varias barras dinmicas de navegacin en un proyecto, las actualizaciones automticas ahorran mucho tiempo y esfuerzo comparado con realizar esta accin manualmente. Para mostrar este punto, consideremos un ejemplo basado en el rbol de navegacin de la imagen inferior. La barra dinmica de navegacin mostrada contiene vnculos a cada uno de los documentos de primer nivel de rbol, justo debajo de la pgina ndice. Esta barra de navegacin podra estar en cualquiera de los documentos del proyecto.
266
Captulo 8
La imagen inferior muestra una barra de navegacin que se encuentra en el documento llamado Nuestra familia y que contiene vnculos a los documentos hijos:
Ahora movamos al documento titulado Asuntos de familia fuera del primer nivel del rbol de navegacin y hagmoslo un hijo de Nuestra familia. La imagen inferior muestra cmo se ve en el rbol modificado:
Puesto que Asuntos de familia ya no se encuentra en el primer nivel del rbol, la primera barra de navegacin se ve ahora as:
Y, puesto que Asuntos de familia es ahora un hijo de Nuestra familia, la segunda barra de navegacin se ve ahora as:
8.3.1 Creando el rbol de navegacin

En la solapa Estructura del Administrador de Sitio Web es donde se edita el rbol de navegacin del proyecto. Si ha creado el proyecto utilizando el Asistente de Sitios Web, el proyecto ya contiene un rbol de navegacin completo, tal como el que se muestra en la imagen inferior.
Administrando la navegacin del sitio Web
267
Si cre el proyecto utilizando el comando Nuevo Proyecto, el proyecto contiene un rbol de navegacin con slo un nodo: el propio proyecto.
Para crear un rbol de navegacin, se aaden documentos y se define su relacin arreglando los iconos dentro del rbol. Para agregar uno o ms documentos del proyecto a un rbol vaco, haga lo siguiente:
1 Haga clic con el botn derecho del ratn en el icono del proyecto y seleccione Agregar al
rbol de Navegacin > Insertar Documento Existente en el men de atajo. El dilogo Seleccionar archivo aparecer.
2 La lista contiene todos los documentos del proyecto. Inicialmente todos estn
seleccionados. Para agregarlos de inmediato, haga clic sobre el botn Aceptar. De otra forma, seleccione los documentos a agregar y haga clic sobre el botn Aceptar. Es buena idea comenzar con slo la pgina ndice del proyecto, puesto que debe estar sola en la parte superior de rbol (adems del propio proyecto). Para agregar uno o ms de los documentos existentes como hijos de un documento que ya se encuentra en el rbol, siga las instrucciones anteriores, pero haga clic con el botn derecho del
268
Captulo 8
ratn sobre el icono del que ser el documento padre en lugar de en el icono del proyecto. Slo los documentos que no se encuentran en el rbol aparecern dentro del dilogo Seleccionar archivo. Mientras est construyendo el rbol de navegacin, tenga en cuenta cmo quiere que la barra dinmica de navegacin trabaje en sus documentos. Por ejemplo, si tiene una pgina ndice para sus productos, probablemente querr que la barra de navegacin dentro de ese documento tenga un vnculo a cada una de las pginas de detalle del producto, de forma tal que se deben agregar las pginas de detalle como hijas de la pgina ndice de los productos. Para cambiar las relaciones entre los documentos, arrastre los iconos de los documentos a sus nuevas posiciones dentro del rbol. Haga clic sobre el icono de un documento y arrstrelo a un lado de otro documento para hacer que el primer documento sea un hermano del segundo. Haga clic y arrastre el icono del documento debajo de otro para hacer que el primer documento sea hijo del segundo. Cuando el icono que se est arrastrando se encuentra en el lugar adecuado, un pequeo tringulo aparecer a un lado o debajo del segundo icono. En la imagen siguiente, el documento Revisin, que es un documento hijo de Noticias, se est transformando en un hermano de ste.
Si mueve un documento que es padre de otros, todos los hijos del primero se movern junto con l. Se pueden mover ms de un documento a la vez seleccionndolos primero antes de arrastrar. Para seleccionar documentos mltiples, dibuje una caja alrededor de ellos o haga clic en cada uno de ellos mientras mantiene presionada la tecla <Ctrl>. Cuando se seleccionan y mueven documentos mltiples a una nueva posicin, todos los documentos seleccionados se convierten en hermanos de los otros, no importando su relacin previa. Por ejemplo, en la imagen inferior, Soporte y Preguntas frecuentes, que tena una relacin previa padre-hijo, se convierten ahora en hijos de Descarga.
269
La imagen siguiente muestra las nuevas relaciones:
8.3.2 Quitando documentos de un rbol de navegacin

Para quitar un documento del rbol de navegacin, haga clic con el botn derecho del ratn sobre l y seleccione Remover del rbol de Navegacin en el men de atajo o seleccinelo y presione la tecla <Supr>. Para eliminar documentos mltiples, seleccinelos todos antes de presionar la tecla <Supr>. Cualquier hijo de los documentos eliminados tambin se borrar. Al quitar un documento del rbol de navegacin no lo eliminamos. Si posteriormente cambia de opinin y decide volver a incorporarlo, haga clic con el botn derecho del ratn sobre el documento que ser el padre y seleccione Agregar al rbol de Navegacin > Insertar Documento Existente en el men de atajo.
8.3.3 Agregando barras de navegacin

An el rbol de navegacin que ha sido planificado ms cuidadosamente no sirve de nada si los documentos del proyecto no tienen una barra de navegacin dinmica para tomar ventaja de ello. Las barras de navegacin dinmicas forman parte de los Componentes de Tema. Por lo tanto, antes de agregar una barra de navegacin a un documento, se debe aplicar un tema, si no es que ya se aplic. Para aplicar un tema, haga lo siguiente:
1 Abra el documento al cual desea aplicar el tema. 2 Seleccione el comando Formato > Cambiar Tema. El dilogo Galera de Temas
aparecer.
270
Captulo 8
3 Seleccione una categora del tema en la lista que se encuentra del lado izquierdo. Las
miniaturas de los temas dentro de la categora se desplegarn. Para obtener una vista previa mayor de un tema, haga doble clic sobre l.
4 Para elegir el tema seleccionado, haga clic sobre el botn Aplicar. Aparecer un dilogo
en el que se le solicita seleccionar el rango de los documentos a los cuales se aplica el tema.
5 Seleccione un rango. Si selecciona Todos los archivos del proyecto, no ser necesario
aplicar un tema a los otros documentos antes de agregar la barra de navegacin para usarlos. Una vez que se selecciona un rango, haga clic sobre el botn Aceptar. Ya que se ha aplicado un tema a un documento, estamos listos para agregar una barra de navegacin. Para hacerlo siga los siguientes pasos:
1 Coloque el punto de insercin donde quiere agregar la barra de navegacin. 2 Seleccione el comando Insertar > Componentes del Tema > Barra de navegacin. El
dilogo Propiedades de la Barra de navegacin aparecer.
271
3 Seleccione conjunto destino de la barra de navegacin (el conjunto de documentos a los
cuales la barra de navegacin se vincula) en la lista Tipo de Barra de Navegacin. En la vista previa del rbol de navegacin, los documentos en el conjunto destino seleccionado se encuentran realzados en azul, mientras que el documento activo se encuentra realzado en rojo.
4 Seleccione Incluir pgina de inicio si desea incluir la pgina del ndice principal del
proyecto dentro del conjunto destino.

5 En Orientacin, elija la disposicin de la barra de navegacin. 6 En Apariencia, especifique si se usan vnculos de texto, botones o iconos. Los vnculos
son pequeas imgenes con etiquetas con palabras como Negro, Siguiente, Arriba o Inicio y slo estn disponibles si el conjunto seleccionado es Previo/Siguiente, Previo/Arriba/Siguiente, Previo/Inicio/Siguiente, Pgina Padre o Inicio.
Un documento slo puede tener un nmero limitado de barras dinmicas de navegacin. Para agregar otra barra de navegacin repita los pasos anteriores. Para cambiar cualquiera de los parmetros seleccionados en la creacin de una barra de navegacin, haga doble clic sobre ella. El dilogo Propiedades de la Barra de navegacin aparecer.
1.3.5: Modificando la apariencia de los botones de una barra de navegacin
272
Captulo 8
Captulo 9
Colaborando en un Proyecto
Si trabaja en un proyecto web como parte de un equipo, querr tomar ventaja de las caractersticas del control de cdigo que proporciona Namo WebEditor para evitar los conflictos entre versiones. En este captulo le mostraremos cmo hacer esto.
En este captulo
9.1 9.2
Introduccin al control de cdigo Usando el control de cdigo
273
9.1 Introduccin al control de cdigo

Si varias personas trabajan sobre el mismo proyecto de un sitio web a la vez, puede suceder de vez en cuando que dos o ms traten de editar el mismo documento al mismo tiempo, lo que dar como resultado un conflicto cuando el documento sea almacenado. Podemos evitar este problema al hacer que cada usuario haga una copia del documento en el cual est trabajando a su disco duro de una red local y solamente editar en forma local, pero este mtodo tambin crea otro problema: puede no ser posible mantener una pista de qu copia del documento es la ltima versin, especialmente si ms de una persona trabaja sobre el documento. El Control de Cdigo es una forma efectiva de evitar los problemas que surgen cuando un equipo colabora en el mismo conjunto de documentos. La idea bsica del control de cdigos es que una base de datos en la red mantenga las copias maestras de todos los documentos y lleve la pista de quien est trabajando en qu documento. Los usuarios deben "dar salida" a un documento antes de poder editarlo, lo que realiza una copia del documento en el disco duro local y evita que otros usuarios puedan editar el mismo documento. Cuando se termina de editar el documento, se debe "registrar" una vez ms en la base de datos de control de cdigo, actualizando la copia que se encuentra almacenada ah. Si un usuario abre una copia local del documento sin "darle salida" no podr realizar cambios en l Namo WebEditor usa el control de cdigo Microsoft SourceSafe ya instalado en su equipo o en la red. Si desea tomar ventaja de las caractersticas de control de cdigo de Namo WebEditor, debe de instalar primero SourceSafe.
274
Captulo 9
9.2 Usando el control de cdigo

Para llevar a cabo la caracterstica de control de cdigos, Namo WebEditor interacta con Microsoft SourceSafe, un programa muy popular de control del cdigo. El men de Control de Cdigo del Administrador de Sitios WEB de Namo WebEditor contiene comandos para trabajar de forma directa con la base de datos de SourceSafe. Se puede agregar un proyecto de WebEditor a la base de datos de SourceSafe, agregar o remover documentos desde el control de cdigos, dar entrada o salida a documentos y obtener la ltima versin de un documento, todo ello desde un men nico. Para usar las caractersticas de control del cdigo de Namo WebEditor, se requiere tener lo siguiente: Tener el servidor de SourceSafe instalado en un servidor en la red local. Haber creado una base datos SourceSafe en el servidor para almacenar su proyecto web. Instalar un cliente del programa SourceSafe (SourceSafe Explorer) en cada uno de los ordenadores de los usuarios. Tambin se le deben dar a cada usuario los permisos de acceso a la base de datos de SourceSafe.
Las instrucciones en las siguientes secciones asumen que tiene el cliente de SourceSafe instalado en su ordenador y que tiene los derechos de acceso a la base de datos adecuada.
9.2.1 Creando un nuevo proyecto SourceSafe

Para agregar un Namo WebEditor proyecto a la base de datos de SourceSafe, haga lo siguiente:
1 Cree un nuevo proyecto de Web, o abra uno ya existente. 2 Cambie al Administrador de Sitio Web. 3 En el men Control de Cdigo, seleccione Conectar al Control de Cdigo. El dilogo
Entrada al Control de Cdigo aparecer.
4 Proporcione su nombre y contrasea SourceSafe. 5 Haga clic en el botn Examinar a un lado del recuadro Base de datos y luego localice y
seleccione una base de datos SourceSafe en un servidor de red.

6 Haga clic sobre el botn Aceptar para entrar a la base de datos de SourceSafe. El dilogo
Seleccionar el Proyecto del Control de Cdigo aparecer.
7 Haga clic en el botn Nuevo Proyecto. El dilogo Crear Proyecto aparecer.
Usando el control de cdigo
275
8 En el recuadro Nombre del proyecto, proporcione un nombre para el nuevo proyecto
SourceSafe. No requiere ser el mismo que el utilizado en el proyecto de Namo WebEditor.

9 En el recuadro Comentario, opcionalmente, proporcione una breve descripcin del nuevo
proyecto y haga clic sobre el botn Aceptar. El dilogo Agregar archivos al Control de
Cdigo aparecer.
10 El panel Lista de archivos muestra todos aquellos del proyecto web activo. Seleccione
los que quiere que sean agregados a la base datos de SourceSafe. (Inicialmente todos los archivos encuentran seleccionados.) Opcionalmente, teclee un comentario dentro del recuadro Comentario y luego haga clic sobre el botn Aceptar. Aparecer un dilogo que muestra el progreso de la adicin del proyecto a la base de datos del control de cdigo. Una vez que el dilogo de progreso desaparezca, la solapa Proyecto del Administrador de Sitio Web se selecciona de forma automtica. La columna Estado del Control de Cdigo en el panel de la lista de archivos mostrar el estado del registro de todos los archivos del proyecto.
9.2.2 Agregando o eliminado archivos del control de cdigo

Cuando se agregan nuevos archivos al proyecto bajo el control de cdigo, el dilogo Agregar archivos al Control de Cdigo usualmente se activa y le pregunta si quiere agregar los archivos a la base de datos del control de cdigo. Si no aparece y desea agregar los nuevos archivos a la base de datos del control de cdigo, haga lo siguiente:
1 Seleccione el comando Control de Cdigo > Agregar al Control de Cdigo en el men
de atajo. Esto abrir el dilogo Agregar archivos al Control de Cdigo.

2 En la lista de archivos, seleccione el que desea agregar a la base de datos del control de
cdigo. Inicialmente todos los archivos se encuentran seleccionados. Para quitar la seleccin a un archivo, haga clic sobre el mientras mantiene presionada la tecla <Ctrl>.
3 Haga clic sobre el botn Aceptar para agregar el archivo (s) seleccionado a la base de
datos del control de cdigo. Si borra la copia local de un documento, la copia maestra del mismo an se encuentra dentro de la base de datos del control de cdigo. Si quiere borrar la copia maestra del documento y tiene los derechos de acceso para hacerlo, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 En panel de la lista de archivos de la solapa Proyecto, seleccione el archivo(s) que quiere
eliminar del control de cdigo.

3 Seleccione el comando Control de Cdigo > Eliminar del Control de Cdigo. El dilogo
Eliminar del Control de Cdigo aparecer.
276
Captulo 9
4 Seleccione los archivos a ser eliminados del control de cdigo y luego haga clic sobre el
botn Aceptar.
5 Si los archivos se encuentran en salida, un dilogo aparece pidiendo confirmacin de su
eliminacin. Haga clic sobre el botn S para borrar los archivos de la base de datos del control de cdigo De otra forma, haga clic sobre el botn No.
9.2.3 Dando salida a archivos del control de cdigo

Para realizar cambios a un documento bajo el control de cdigo primero se le debe dar salida de su base de datos. Cuando se le da salida a un archivo, una copia es creada en su disco duro (reemplazando cualquier copia anterior). Un archivo al cual se le ha dado salida no puede asignrsele a ninguna otra persona, a menos que el administrador de SourceSafe permita salidas mltiples. Cuando se le da salida a un archivo, otros pueden ver el archivo pero no modificarlo. Se puede dar salida a un archivo, archivos mltiples o todos los archivos de un proyecto SourceSafe. Cmo se le da salida a un archivo depende si es usted el creador o no. Para dar salida a un archivo que usted ha creado, haga lo siguiente:
1 Cambie al Administrador de Sitio Web. 2 En la lista de archivos de la solapa Proyecto, seleccione el archivo(s) al cual quiere dar
salida. Para seleccionar archivos mltiples, mantenga presionada la tecla <Mays> o <Ctrl> al hacer clic. Si desea dar salida al proyecto completo o a una carpeta dentro del proyecto, seleccinelos primero.
3 Seleccione el comando Control de Cdigo > Salida. El dilogo Dar salida a archivos
aparecer.
4 En la lista de archivos aparecern aquellos a los cuales ya se les ha dado salida. Para
quitar la seleccin de un archivo, haga clic sobre l mientras mantiene presionada la tecla <Ctrl>.
5 Haga clic sobre el botn Aceptar para dar salida a los archivos.
Aparecer momentneamente un dilogo de progreso mientras Namo WebEditor da salida a los archivos. En la solapa Proyecto del Administrador de Sitio Web, aparecern marcas de verificacin de rojas dentro del icono SourceSafe en la columna Estado del Control de Cdigo para cada uno de los documentos a los cuales se les dio salida. Si requiere acceder a un proyecto que otro usuario cre y agreg a la base datos de SourceSafe, haga lo siguiente:
1 Ejecute el explorador de SourceSafe. Se puede ejecutar desde Namo WebEditor usando el
comando Herramientas > Administrador de Sitio > Ejecutar SourceSafe.

2 Entre en SourceSafe y abra su base de datos.
277
3 Haga clic con el botn derecho del ratn en el proyecto SourceSafe (carpeta) que
contiene el proyecto de Namo WebEditor y use Seleccionar Carpeta de Trabajo en el men de atajo.
4 En el dilogo Seleccionar Carpeta de Trabajo, seleccione una carpeta en su disco duro
en la cual se almacenar la copia local del proyecto, creando una si es necesario y luego haga clic sobre el botn Aceptar.
5 Haga clic con el botn derecho del ratn una vez ms en el proyecto SourceSafe y
seleccione Obtener ltima versin en el men de atajo para descargar los archivos del proyecto a su disco duro. En el dilogo Obtener, asegrese de escoger la opcin Recursivo si el proyecto tiene subcarpetas. Haga clic sobre el botn Aceptar y los archivos se copiarn a su ordenador.
6 Cambie a Namo WebEditor y abra el proyecto. Para abrir el proyecto, use el comando
Archivo > Proyecto > Abrir. En el dilogo Abrir, navegue al directorio donde la copia
local del proyecto est almacenada y haga doble clic sobre el archivo del proyecto (el que tiene la extensin .wej). El proyecto se abrir dentro de la ventana del Administrador de Sitio Web.
7 En el Administrador de Sitio Web, seleccione el comando Control de Cdigo > Conectar
al Control de Cdigo.
8 En el dilogo Seleccionar Control de Cdigo Proyecto, seleccione el proyecto
SourceSafe (carpeta) que contiene al de Namo WebEditor. Haga clic sobre el botn
Aceptar para continuar.
Ahora est listo para comenzar a trabajar con el proyecto. Para editar un documento, asegrese de darle salida usando el comando Control de Cdigo > Salida.
9.2.4 Deshaciendo una salida

El comando Deshacer Salida cambia el estado del ltimo archivo al que se le dio salida, cancelando los cambios tanto en la copia maestra del control de cdigo como en su copia local. El archivo o proyecto regresa al control de cdigo en el mismo estado en que estaba cuando sali. Para deshacer una salida, haga lo siguiente:
1 En la solapa Proyecto del Administrador de Sitio Web, seleccione el archivo(s) al que se
le dio salida.
2 Seleccione el comando Control de Cdigo > Deshacer Salida. El dilogo Deshacer
Salida aparecer.
3 Confirme la lista de los archivos a los cuales no se les dar salida y luego haga clic sobre
el botn Aceptar.
278
Captulo 9
9.2.5 Dando entrada a archivos al control de cdigo

Una vez que se termina de editar los archivos a los que se dio salida en el control de cdigo, se requiere registrarlos de nuevo, guardando as los cambios en la base de datos del control de cdigo. Para registrar un archivo, haga lo siguiente:
1 En la solapa Proyecto del Administrador de Sitio Web, seleccione los archivos a registrar. 2 Seleccione el comando Control de Cdigo > Registrar archivos. El dilogo Registrar
Archivos aparecer.
3 Confirme la lista de los archivos a registrar. Opcionalmente, proporcione un Comentario
en el recuadro describiendo los cambios realizados a los archivos y luego haga clic sobre el botn Aceptar.
9.2.6 Actualizando copias locales de archivos bajo el control de cdigo

Si desea actualizar las copias locales de sus documentos bajo el control de cdigo con las ltimas modificaciones, seleccione los documentos a actualizar en la solapa Proyecto del Administrador de Sitio Web y use el comando Control de Cdigo > Descargar la ltima versin.
279
Otros Temas
Preferencias Auto Correcin Insercin rpida (Quick Insert) Macros Edicin de ecuaciones Importando documentos y sitios Web Importando documentos de Microsoft Word Enviando un documento como correo electrnico (e-mail) Agregando imagenes a la librera de imgenes Lista de atajos de teclado
281
Preferencias
Las preferencias y ajustes del programa Namo WebEditor pueden ser cambiadas dentro del dilogo Preferencias, al cual se accede usando el comando Herramientas > Preferencias. Los ajustes disponibles en las distintas solapas se explican a continuacin. Solapa Opciones Predeterminadas del Documento
Colores
Texto Fondo Vnculo Vnculo Visitado Vnculo Activo
Seleccione el color del texto predeterminado de la lista. El Predeterminado es negro. Seleccione el color del fondo del documento predeterminado de la lista. El Predeterminado es gris claro. Seleccione el color predeterminado para los vnculos de la lista. El
Predeterminado es azul.
Seleccione el color predeterminado para los vnculos visitados de la lista. El Predeterminado es violeta. Seleccione el color predeterminado para los vnculos activos de la lista. El Predeterminado es rojo. Un vnculo activo es un vnculo que ha sido seleccionado dentro de un navegador utilizando la tecla de tabulacin para llegar hasta l. Los vnculos activos se despliegan con un recuadro punteado en la mayora de los navegadores utilizados en Windows.
Codificacin y tipografa
Codificacin
Seleccione la codificacin de idioma predeterminada de la lista. Definido por el Usuario significa que el documento utilizar cualquier codificacin definida en el navegador como predeterminada. El cdigo de Internet para la codificacin seleccionada aparece en la caja de texto a la derecha de la lista. de la lista.
Tipografa Proporcional Seleccione la tipografa proporcional predeterminada y su tamao Tipografa ancho fijo
Seleccione la tipografa de ancho fijo a utilizar (mono espacio) y su tamao, de la lista.
Los ajustes predeterminados de tipografa solamente son utilizados por Namo WebEditor dentro de la ventana de edicin. Cada navegador tiene su propia tipografa definida, la que es utilizada cuando un documento HTML no especifica qu tipografa utilizar.
283
Informacin
Autor
Proporcione el nombre predeterminado del autor. Este nombre aparecer a un lado de Autor tanto en el dilogo Informacin del Documento como en la solapa General del dilogo Propiedades del Documento para un nuevo documento.
Solapa Preferencias de Edicin

General
Bloquea tecla Insercin Deshabilita el cambio al modo de sobre escritura al utilizar la tecla
<Insert>.
Carga documento ms reciente al iniciar
Seleccione esta opcin para que Namo WebEditor abra de forma automtica todos aquellos documentos que se encontraban abiertos la ltima vez que se sali del programa.
Desplegar tipografa usada en lista de tipografa
Despliega el nombre de los tipos en el men de tipografa de la barra de herramientas de formato en la forma en que se ven.
Creacin Automtica de vnculos
Habilita la creacin automtica de vnculos cuando se escribe una direccin URL dentro de la ventana de Edicin. Por ejemplo, si esta opcin se encuentra habilitada y se escribe "www.misitio.com" seguido de un espacio o de la tecla <Intro> en la ventana de Edicin, Namo WebEditor crea de forma automtica un hipervnculo a 'http://www.misitio.com' en la direccin URL.
Directorio de la librera de imgenes
Especifica la ruta de acceso a la librera de imgenes dentro del disco duro. Si se instal Namo WebEditor de forma normal, no ser necesario modificarla. Sin embargo, si se instala una librera de imgenes despus de haber instalado Namo WebEditor, puede ser necesario especificar el directorio correcto en este punto. Use el botn para localizar y seleccionar el directorio.
Ortografa
Verificar ortografa al escribir
Verifica la ortografa en el momento de escribir dentro de la ventana de Edicin. Las palabras errneas sern marcadas con una lnea roja ondulada que las subraya.
284
Ocultar errores de ortografa
No marca las palabras errneas con el subrayado rojo. Esta opcin solamente est disponible si Verificar ortografa al escribir est habilitado.
Diccionario ortogrfico 1, Diccionario ortogrfico 2
Especifica los diccionarios ortogrficos activos primarios y secundarios. Ambos diccionarios pueden ser utilizados al mismo tiempo, de forma tal que se puede verificar la ortografa de dos idiomas al mismo tiempo. Los lenguajes disponibles son ingls (US), ingls (UK), francs, alemn, dans, holands, finlands, italiano, noruego, portugus, portugus (Brasil), espaol y sueco.
Guardar
Crear copia de seguridad Guarda la ltima versin del documento de forma automtica
cuando se guarda ste. El archivo de copia de seguridad tiene el mismo nombre, pero con la extensin.bak. Para abrir el archivo de copia de seguridad, cambie su extensin a .htm o .html y bralo como cualquier otro documento.
Auto guardar
Seleccione esta opcin para hacer que Namo WebEditor guarde el documento actual de forma peridica. Especifique el intervalo de tiempo en minutos. No dar formato o modificar de ninguna otra forma el cdigo fuente existente al abrir, editar o guardar un archivo HTML que no fue originalmente creado con Namo WebEditor. Tambin se aplica a HTML escrito manualmente en la ventana de HTML. Si esta opcin no est seleccionada, al cdigo existente o introducido de forma manual, se le dar formato y ser "limpiado" usando las mismas reglas que se aplican al cdigo HTML que Namo WebEditor genera.
Conservar el cdigo fuente HTML existente
Opciones de formato HTML (botn)
Haga clic en este botn para fijar varias opciones de formato para el cdigo HTML generado por Namo WebEditor en el dilogo Opciones de Formato HTML.
Guardar imgenes de ecuaciones y grficos en
Especifique la ruta de acceso o carpeta en la cual se guardarn las imgenes generadas de forma automtica para las ecuaciones y los grficos. De manera predeterminada, la ruta de acceso apunta al directorio 'images' en la misma carpeta que el documento. Para guardar las imgenes de ecuaciones y grficos en la misma carpeta que el documento, deje este recuadro en blanco.
285
Solapa Navegadores Web

Navegador 1, Navegador 2
Navegador Nombre DDE
Seleccione un navegador de la lista. Para utilizar un navegador que no sea Netscape o Internet Explorer, seleccione Otro. Es el nombre que utiliza Namo WebEditor para referirse al navegador e indicarle que abra el documento activo. El nombre DDE es usualmente el mismo nombre que el archivo ejecutable del navegador sin la extensin .exe (por ejemplo, Opera). El nombre DDE se proporciona de manera automtica si se selecciona Netscape o Internet Explorer como navegador. Especifique la ruta de acceso hacia el archivo ejecutable del navegador (por ejemplo, "C:\Archivos de Programa\Internet Explorer\iexplore.exe"). Haga clic en el botn Examinar para localizar y seleccionar el ejecutable.
Ruta del Programa
Si selecciona Otro como navegador, el nombre DDE es tambin usado por Namo WebEditor como el nombre del navegador en el men Ver. Por ejemplo, si est configurando Opera como el Navegador 1, se debe proporcionar 'Opera' como nombre DDE y Namo WebEditor desplegar Ver con Opera en el men Ver. Solapa Opciones de Edicin de Cdigo Fuente
General
Tipografa Fuente Tamao del tipo Color tipografa Color fondo
Seleccione la tipografa a utilizar en la ventana HTML. Seleccione el tamao de la tipografa para la ventana HTML. Selecciona el color para la tipografa general dentro de la ventana HTML. El Predeterminado es negro. Seleccione el color de fondo para utilizar en la ventana HTML. El Predeterminado es blanco.
Color del cdigo fuente

Permitir la coloracin del cdigo
Los tipos especiales de texto en la ventana HTML sern desplegados en color.

Nombres de etiquetas Nombres de Atributos
Seleccione el color para las etiquetas de los nombres utilizados en HTML, tales como head, body, table, etc. Seleccione el color a utilizar para los nombres de atributos, tales como name, color, class, etc.
286
Valores de Atributos Smbolos
Seleccione el color para los valores de atributos (los textos entre comillas que siguen a [attribute]=). Seleccione el color para los cdigos que representan a caracteres especiales, tales como & (ampersand), (espacio de no separacin), etc. Seleccione el color para los comentarios.
Comentarios
Otras opciones
Mostrar nmeros de lnea
Muestra los nmeros de lnea en el lado izquierdo de la ventana HTML. Los nmeros de lnea son especialmente tiles cuando se intentan descubrir errores dentro de un programa (secuencias de comandos).
Color para los nmeros de las Lneas
Seleccione el color para los nmeros de las lneas.

Color del margen Sangra Automtica
Seleccione el color para utilizar en el rea del margen que contiene los nmeros de lneas. Coloca una sangra automtica a una nueva lnea para que comience en la posicin inicial de la anterior. Realiza las sangras utilizando tabulaciones. De otra forma, usa espacios.
Usar tabulaciones para sangra
Ancho tabulacin
Especifique la longitud de la tabulacin en caracteres.
Solapa Programas Externos Se pueden especificar hasta cuatro programas externos para abrir el documento actual al utilizar comandos del men. Para cada programa, proporcione su nombre y la ruta de acceso del programa ejecutable (.exe o .com). Haga clic sobre el botn Examinar para localizar los ejecutables. Los programas externos pueden ejecutarse usando el submen Programas Externos del men Herramientas. Cuando se ejecuta un programa externo, el programa abre automticamente el documento que se est editando en ese momento dentro de Namo WebEditor.
287
Solapa Guas / rejillas

Rejillas
Color Estilo
Seleccione el color para la rejilla de la lista. Elija entre la opcin de lnea slida o punteada. Proporcione el espaciamiento entre las rejillas, en pxeles.
Espaciamiento de la rejilla Subdivisiones
Proporcione el espacio entre las divisiones invisibles que hay en la rejilla. Estas divisiones se utilizan para ajustar objetos a la rejilla cuando se habilita la opcin Ajustar a Rejilla.
Para obtener mejores resultados en el ajuste a la rejilla haga que el espaciamiento sea un mltiplo par de las subdivisiones. Los objetos se ajustan en realidad a las subdivisiones y no a la rejilla. Si hacemos que las rejillas se "sincronicen" con las subdivisiones, los objetos se ajustarn efectivamente a la rejilla.
Guas
Color Estilo
Seleccione el color de las guas de la lista. Elija entre la opcin de lnea slida o punteada.
Solapa Proyectos
Opciones de confirmacin
Verifica nombre invlido de archivo
Verifica los nombres de archivos invlidos al cambiar el nombre en el Administrador de Sitios web.
Confirma el borrado de archivos
Despliega un dilogo de confirmacin al borrar archivos del proyecto.

Correccin de Auto vnculos
Nunca corregir Siempre corregir
Nunca corrige los enlaces de otros documentos cuando se cambia el nombre del documento en el proyecto. Siempre corrige el enlace en otros documentos, sin preguntar, cuando se cambia el nombre el documento en el proyecto. Pregunta al corregir los enlaces en otros documentos cuando se cambia el nombre del documento en el proyecto.
Confirmar antes de corregir
288
Otras opciones
Carga proyecto ms reciente al iniciar
Al iniciar Namo WebEditor, abre el proyecto que estaba abierto la ltima vez al salir del programa (si es que haba uno).
Verificar vnculos externos al revisar vnculos
Cuando se verifican los enlaces en un proyecto, tambin verifica la validez de los enlaces a los documentos Web en otros sitios. Namo WebEditor slo puede verificar vnculos HTTP (Web) externos. Otros enlaces, tales como FTP y mailto, no pueden ser comprobados.)
Mostrar las solapas del Administrador de Sitio Web como iconos
Muestra las solapas o pestaas en la parte inferior de la ventana del Administrador de Sitios WEB slo como iconos. De manera predeterminada, la solapa se muestra como iconos con etiquetas de texto. Solapa Internet
Conexin Internet (HTTP)
Usar FTP al guardar directamente al servidor
Esta opcin especifica qu protocolo de comunicaciones de Internet ser utilizado para guardar un documento directamente al servidor web (haga esto utilizando el botn Guardar a URL dentro del dilogo Guardar como o guardando un documento que se abri directamente de una direccin URL). Si se habilita Usar FTP al guardar directamente al servidor, Namo WebEditor usar FTP para transferir el documento; de otra manera usar HTTP (el protocolo normalmente utilizado por los navegadores web). FTP es preferible porque se puede guardar el documento a un nuevo directorio dentro del servidor (el nuevo directorio ser creado de forma automtica). Esto no es posible utilizando HTTP.
Mostrar el estado de la transferencia HTTP
Muestra el estado del progreso de la transferencia en una ventana cuando se descargan o transfieren documentos utilizando HTTP.
289
Modo fuera de lnea
Normalmente, cuando se abre un documento que contiene recursos remotos (recursos, tales como imgenes, que residen en el servidor remoto en lugar de su propio ordenador), Namo WebEditor intenta cargar los recursos del servidor para que puedan ser desplegados en la ventana de cesin. Esto puede ser causa de problemas si la conexin a Internet es intermitente; si usa una conexin va telefnica, el ordenador puede intentar conectar a Internet. Si se seleccion Modo Fuera de Lnea, Namo WebEditor no intentar descargar estos recursos remotos. Dentro del modo fuera de lnea, Namo WebEditor no puede conectar a Internet. Por lo tanto, ciertas funciones, tales como la publicacin, importar documentos de la web y guardar documentos directamente al servidor no estn disponibles.
Seleccionar DLL
Usar NamoNet.DLL
Seleccione esta opcin para hacer que Namo WebEditor use sus propios DLL (Dynamic Link Library) interconstruidos para toda conexin a Internet. Haga clic sobre el botn Parmetros para abrir el dilogo Parmetros de NamoNet.DLL, desde donde puede configurar varias opciones de conexin. Seleccione esta opcin para hacer que Namo WebEditor use WinInet.DLL de Windows para las conexiones de Internet. Haga clic sobre el botn Parmetros para abrir el dilogo Propiedades de Internet, desde donde se pueden configurar varias opciones de conexin.
Usar DLL de Internet Explorer (WinInet.DLL)
Normalmente, se debe dejar Usar NamoNet.DLL habilitado. Slo se requiere utilizar los DLL de Windows si se experimentan problemas con un servidor en particular al utilizar NamoNet.DLL.
290
Publicar
Convertir nombres de archivos a minsculas al publicar
Seleccione esta opcin para permitir que Namo WebEditor publique siempre los archivos utilizando nombres en minsculas, excepto cuando se publica un proyecto. Puesto que los servidores Unix disciernen entre maysculas y minsculas, esta opcin puede ser til cuando todos los vnculos de sus documentos utilizan el nombre de archivos en minsculas, pero algunos de los archivos objeto utilizan maysculas o una combinacin entre minsculas y maysculas. Este ajuste no se aplica cuando se publica un proyecto, puesto que se puede utilizar el comando Herramientas
> Administracin de Sitio Web > Verificar todos los vnculos
para verificar los enlaces al publicar.

Extensiones (botn)
Haga clic en este botn para editar la lista de las extensiones de los archivos que sern tratadas como archivos de texto cuando se publique.
291
Auto correccin
Se puede usar la caracterstica de auto correccin para detectar y corregir de forma automtica equivocaciones, palabras mal escritas, errores gramaticales as como el uso incorrecto de maysculas. Por ejemplo, si teclea "atravez", la Auto correccin puede reemplazarlo con "a travs" de manera automtica. Inicialmente la lista de auto correccin contiene alrededor 1000 correcciones de los errores ms comunes de maysculas, faltas de ortografa y equivocaciones de escritura. Se puede, tambin, utilizar auto correccin para insertar de forma rpida frases de uso comn sin tener que escribirlas. Por ejemplo, se le puede agregar un elemento a la auto correccin que reemplace "ni" con "Namo Interactive Inc.". Para agregar o editar entradas de la auto correccin, haga lo siguiente:
1 Seleccione el comando Auto correccin dentro del men Herramientas. 2 Dentro del dilogo Auto correccin, la lista de las palabras que sern corregidas y sus
reemplazos aparecen en la parte superior del dilogo. Para deshabilitar un elemento, haga clic sobre la casilla de verificacin que se encuentra a un lado del elemento.
3 Haga clic en el botn Agregar para aadir un nuevo elemento o seleccione uno ya
existente de la lista y haga clic que sobre el botn Modificar para editarlo. El dilogo
Informacin de Auto Correccin aparecer.
4 En el recuadro Reemplazar, teclee la palabra o frase que remplazar a lo que se teclee en
el recuadro Con. Para reemplazar solamente parte de una palabra, existen dos smbolos especiales disponibles: - (guin) y * (asterisco). Por ejemplo, teclee -late en Reemplazar y -toso- en Con para reemplazar una palabra que incluye late tal como chocolate con chocolatoso. La palabra late por s sola no ser reemplazada.
5 En el recuadro Con, teclee la palabra o frase que remplazar a la que se encuentre dentro
del recuadro Remplazar. Si intenta reemplazar solamente parte de una palabra, use el mismo smbolo especial que utiliz dentro del recuadro Remplazar.
De manera predeterminada, la opcin de Auto Correccin est habilitada. Siempre es posible deshabitarla al seleccionar el comando Auto Correccin dentro del men Herramientas y poner o quitar la marca de Activar que se encuentra dentro del dilogo Auto Correccin.
292
Insercin rpida
La Insercin rpida provee una forma rpida de insertar frases, operaciones o prrafos de uso frecuente sin tener que escribirlos cada vez. Sencillamente se escribe una sola palabra o carcter y luego se usan las teclas <Ctrl + => para reemplazar instantneamente el atajo con el texto deseado. Para agregar o editar un elemento de la insercin rpida, haga lo siguiente:
1 Seleccione Insertar en el men Herramientas. 2 Haga clic en el botn Agregar en el dilogo Insercin Rpida. El dilogo Agregar
Insercin Rpida aparecer.
3 En el recuadro Atajo, proporcione el texto que ser utilizado (en combinacin con las
teclas <Ctrl + =>) para identificar al elemento de la Insercin Rpida.

4 Dentro de Elemento a insertar, encontramos dos opciones: Texto y Archivo. 5 Seleccione Texto para proporcionar el texto de reemplazo directamente dentro del
dilogo. Teclee el texto dentro del recuadro provisto. Slo se puede proporcionar un texto sin formato dentro de este campo. Si se quiere insertar texto con formato usando la insercin rpida, coloque el texto dentro de un archivo HTML, guarde el archivo y luego use Archivo en lugar de Texto (vea abajo).
6 Seleccione Archivo para especificar un archivo a insertar en el documento cuando se
utiliza este elemento de la insercin rpida.

7 Presione el botn Aceptar para regresar al dilogo Insercin Rpida. El elemento que
acaba de insertar se encontrar dentro de la lista Atajo.

8 Seleccione el elemento deseado de la insercin rpida y presione sobre el botn Insertar
para incrustar el elemento en el punto de insercin dentro de la ventana de Edicin.

9 Para utilizar la insercin rpida al vuelo (en el momento de escribir), escriba un atajo
ya definido y presione las teclas <Ctrl + =>. El elemento definido dentro de la Insercin Rpida reemplazar al texto correspondiente.
293
Macros
Un macro es una secuencia grababa de teclas que puede ser "reproducida" en cualquier momento. Si se encuentra utilizando la misma secuencia de teclas una y otra vez, se puede grabar un macro que realice toda la secuencia. Entonces, en lugar de teclear de nuevo toda la secuencia, simplemente se ejecuta el macro. Puesto que todos los comandos de men y la mayora de las operaciones en los dilogos se realizan utilizando teclas, los macros pueden hacer mucho ms que solamente dar entrada a texto. Los macros no graban los movimientos ni las pulsaciones de los botones del ratn, as que evite usar el ratn cuando se est grabando un macro. Para grabar un macro, haga lo siguiente:
1 Seleccione el comando Herramientas > Macros > Iniciar Grabacin o presione las
teclas <Ctrl + Mays + M>. El apuntador del ratn cambiar a un pequeo icono de un casete de cinta, indicando que se est grabando.
2 Realice la secuencia de teclas que quiere grabar. 3 Para detener la grabacin, seleccione Herramientas > Macros > Detener Grabacin o
presione las teclas <Ctrl + Mays + M>. Puede reproducir de inmediato el macro grabado presionando las teclas <Ctrl + M> o seleccionando el comando Herramientas > Macros > Ejecutar Macro. Una vez que se ha grabado un nuevo macro o se inicia de nuevo Namo WebEditor, el macro previo ser removido de la memoria. Para almacenar permanentemente un macro, haga lo siguiente:
1 Seleccione Herramientas > Macros > Macros. El dilogo Macros aparecer. 2 Haga clic en el botn Agregar. El dilogo Agregar Macro aparecer. 3 En la caja de texto Nombre del Macro, proporcione un nombre para el macro. 4 Opcionalmente, teclee una breve descripcin del macro en el recuadro Descripcin. 5 Seleccione Guardar macro previamente grabado si ya grab un macro usando el
comando Herramientas > Macros > Comenzar a Grabar y ahora quiere guardar el macro con otro nombre.
6 Seleccione Grabar nuevo macro si quiere grabar otro. 7 Haga clic sobre el botn Aceptar. En la ventana de Edicin, el apuntador del ratn
cambiar a un pequeo icono de un casete de cinta, indicando que se est efectuando una grabacin.
8 Realice la secuencia de teclas que quiera grabar. 9 Para detener la grabacin, seleccione Herramientas > Macros > Detener Grabacin o
presione las teclas <Ctrl + Mays + M>.
294
10 Para grabar y guardar otro macro, repita los pasos del 1 al 9.
Para reproducir un macro grabado, haga lo siguiente:

1 Seleccione Herramientas > Macros > Macros. El dilogo Macros aparecer. 2 En la lista de macros grabados, seleccione el que quiere reproducir. 3 En Repeticiones, especifique el nmero de veces que se reproducir el macro
seleccionado.
4 Haga clic en el botn Ejecutar Macro.
295
Editor de ecuaciones
Al usar el editor de ecuaciones construido de manera interna en Namo WebEditor, se puede crear una frmula con notacin matemtica e insertarla en el documento activo, todo de forma visual. Para crear una ecuacin matemtica, haga lo siguiente:
1 Seleccione el comando Insertar > Ecuacin. El dilogo Ecuaciones aparecer. 2 Cree la ecuacin escribiendo los nmeros y las letras que lleva y utilizando los botones
en la parte superior del dilogo para agregar la anotacin matemtica. La mayora de los botones son listas que muestran varios smbolos relacionados, seleccione cualquiera de la lista para insertar. El icono de la lupa que se encuentra en el primer rengln de los botones, aumenta o disminuye el tamao visual de la ecuacin.
3 Cuando termine de escribir la ecuacin, presione sobre el botn Aceptar.
Una vez que se ha salido del dilogo Ecuacin, Namo WebEditor genera una imagen de bits y la coloca en el sitio adecuado dentro del documento actual. Se puede editar la ecuacin al hacer doble clic sobre la imagen. A diferencia de otras imgenes, no se puede cambiar el tamao de una ecuacin utilizando las manijas de tamao que aparecen alrededor de la imagen cuando sta es seleccionada. Para cambiar el tamao de una ecuacin, haga doble clic sobre ella y utilice el icono del lente de aumento dentro del dilogo Ecuacin. Cuando se guarda un documento que contiene una ecuacin, una imagen de bits es almacenada como archivo GIF utilizado la siguiente convencin para su nombre: [nombre_archivo]_[ext]_eqn[#].gif donde [nombre_archivo] es el nombre del documento, [ext] es la extensin del archivo (usualmente htm o html) y [#] es un nmero tal como 1, 2, 3, etc. La primera ecuacin que se inserta en el documento se numera con el uno; la segunda con el 2; etc. Por ejemplo, el archivo GIF de la tercera ecuacin dentro de un documento llamado fisica.html se llamar fisica_html_eqn3.gif. El archivo GIF se guarda dentro de la carpeta images en la misma carpeta donde se encuentra el documento; el directorio se crea si es necesario. Para cambiar el directorio donde los archivos de imgenes de ecuaciones son almacenados, teclelo dentro del recuadro Guardar imgenes de ecuaciones y grficos en de la solapa Preferencias de Edicin en el dilogo Preferencias.
296
Importando documentos y sitios Web

Namo WebEditor provee una forma de importar un sitio Web completo o partes de l, desde Internet. Esto es til cuando se requieren editar documentos ya publicados dentro de la web de los cuales no tenemos una copia en nuestro ordenador. Para importar un sitio web completo o una parte de l, haga lo siguiente:
1 Seleccione el comando Herramientas > Importar desde la Web > Importar de la
Web. El dilogo Importar de la Web aparecer.
2 Haga clic en el botn Nuevo para proporcionarle informacin del sitio a ser importado.
El dilogo Propiedades de Importacin aparecer.

3 Haga clic en la solapa General y teclee la direccin URL del sitio en el recuadro URL a
importar.
4 En el recuadro Guardar en carpeta, especifique el directorio donde ser almacenado el
sitio.
5 Haga clic en la solapa Autentificacin y proporcione la informacin de usuario del sitio,
si es necesario. Haga clic sobre el botn Aceptar para regresar al dilogo Importar
desde la Web.
6 En la lista de la parte superior del dilogo, seleccione el sitio que acaba de agregar y haga
clic sobre el botn Importar. Un dilogo de Estado se mostrar con los datos de la operacin de importacin.
7 Una vez que la operacin importacin se ha completado, un mensaje aparece indicando:
La importacin desde la Web se ha completado. Haga clic sobre el botn Aceptar.

8 Haga clic en el botn Cerrar para salir del dilogo Importar de la Web.
Para importar rpidamente un slo documento desde la Web, haga lo siguiente:

1 Abra el documento ya sea utilizando el navegador Netscape o Internet Explorer. 2 Cambie de nuevo a Namo WebEditor y seleccione el comando Importar de Netscape o
Importar de Internet Explorer en el submen Herramientas > Importar desde la Web.
3 Si lo desea, guarde el documento importado en su disco duro.
297
Importando documentos de Microsoft Word

Namo WebEditor puede abrir documentos que han sido creados con cualquier versin de Microsoft Word. El formato propio del documento Word ser convertido a etiquetas HTML y CSS, conservando tanto de la apariencia original de documento como sea posible. Para importar un documento de Microsoft Word, haga lo siguiente:
1 Seleccione el comando Archivo > Abrir. 2 En el dilogo Abrir, localice y seleccione el documento Word. Si no aparece ningn
documento Word, seleccione Todos los archivos o Archivos MS Word dentro de la lista Archivos del tipo. Una vez seleccionado el archivo, haga clic sobre el botn Aceptar.
3 En el dilogo Opciones de importar archivo externo, seleccione las opciones para
indicar a Namo WebEditor cmo se debe manejar la informacin de formato dentro del documento Word y luego haga clic sobre el botn Aceptar. Las opciones de importacin son:
Mantener formato original
Intenta preservar el formato del documento original tanto como sea posible usando etiquetas CSS y . Esta opcin importa el documento tan fidedignamente como sea posible, pero el cdigo fuente HTML del documento importado puede ser difcil de editar debido a la gran cantidad de etiquetas que se generan para preservar el formato.
Usar slo etiquetas 
Slo etiquetas del tipo se utilizarn para convertir los cdigos de formato del documento original. Las etiquetas del tipo CSS no sern utilizadas. Esta opcin sacrifica la igualdad del formato del documento original en favor de crear un cdigo fuente HTML ms limpio.
Importar slo texto
Slo importa el texto del documento original. Toda la informacin de formato (excepto tablas, saltos de prrafos y saltos de lnea) ser descartada. Esta opcin crea el cdigo fuente HTML ms limpio, pero la mayora de la informacin de formato se pierde. Selecciona el uso de etiquetas CSS al importar un documento. cdigos de formato del documento original.
Usar propiedades CSS
Usar etiquetas Slo etiquetas del tipo se utilizarn para convertir los
298
Enviando un documento como correo electrnico (e-mail)

Para enviar un documento web como correo electrnico (e-mail), haga lo siguiente:
1 Abra el documento que desea enviar por correo electrnico. 2 Seleccione el comando Archivo > Enviar Correo. Su programa de correo electrnico se
ejecutar y se crear un nuevo mensaje. El documento web se insertar dentro del cuerpo del mensaje.
3 Proporcione la direccin de correo a la cual se enva y el tema antes de proceder a enviar
el mensaje. Namo WebEditor incluye una seleccin de plantillas diseadas por profesionales que incluye en ocasiones tales como tarjetas de cumpleaos, felicitaciones de fechas diversas, cartas de agradecimiento y muchas otras especialmente adaptadas para enviar como correo electrnico. Muchas de estas plantillas contienen imgenes animadas. Para usar una plantilla de tarjeta de felicitacin, haga lo siguiente:
1 Seleccione el comando Archivo > Nuevo. 2 En el dilogo Nuevo, haga clic en la solapa Tarjeta de felicitacin. 3 Seleccione una plantilla para la tarjeta de felicitacin. Una vista preliminar de la tarjeta
seleccionada se muestra dentro del recuadro Vista Previa.

4 Haga clic sobre el botn Aceptar. Un nuevo documento ser creado utilizando la
plantilla.
5
Escriba el nombre del destinatario, las palabras de felicitacin y su nombre dentro del documento. electrnico. No es necesario guardar primero el documento.
6 Use el comando Archivo > Enviar Correo para transmitir el documento como un correo
299
Agregando imgenes a la librera de imgenes

Si se tiene uno o ms archivos de imgenes que se usa de forma frecuente, se puede agregar a la librera de imgenes de Namo WebEditor para un acceso fcil. Para agregar imgenes a la librera de imgenes, siga los siguientes pasos:
1 Use el comando Insertar > Imagen > Clip Art. El dilogo Clip Art aparecer. 2 Seleccione la categora a la cual agregar las imgenes y presione sobre el botn Importar
Imgenes.
3 En el dilogo Abrir, seleccione uno o ms archivos de imagen del disco duro y haga clic
sobre el botn Abrir. O proporcione la direccin URL de una imagen en Internet y haga clic sobre el botn Abrir URL Si se tiene una gran cantidad de imgenes que quisiera agregar a la librera de imgenes de Namo WebEditor, es buena idea agregar una o ms categoras que las contengan. Para crear una nueva categora (que viene a ser una subcategora, puesto que no se puede agregar a la categora del nivel superior), siga los siguientes pasos:
1 Abra el dilogo Clip Art (use el comando Insertar > Imagen > Clip Art). 2 Seleccione la categora de nivel superior en la cual se crear la nueva subcategora. 3 Haga clic en el botn Nueva Categora. Una nueva categora ser creada bajo el nivel
seleccionado, con el nombre "Nuevo grupo 1"

4 Haga clic con el botn derecho del ratn sobre el nombre de la nueva categora y
seleccione Renombrar del men de atajo. Teclee el nombre deseado y presione la tecla <Intro>.
5 Para agregar imgenes a la nueva categora, haga clic sobre el botn Importar Imgenes
y seleccione las imgenes deseadas dentro del dilogo Abrir.

Slo se pueden agregar imgenes en formato GIF o JPEG a la librera de imgenes.
300
Lista de atajos de teclado

Atajos de edicin de Texto
Teclas Ctrl + A Ctrl + C Ctrl + Mays + C Ctrl + F Ctrl + Mays + F Ctrl + H Ctrl + R Ctrl + Mays + T Ctrl + V Ctrl + X Ctrl + Mays + X Ctrl + Y Ctrl + Z Alt + Z Tab Mays + Tab Ctrl + Backspace Alt + Backspace Ctrl + Intro Mays + Intro Ctrl + Insert Mays + Insert Ctrl + Supr Ctrl + Inicio Ctrl + Fin Ctrl + Re Pg Ctrl + Av Pg Ctrl + Izq. Ctrl + Derecha Mays + Ctrl + Izq. Mays + Arriba Mays + Abajo Funcin Seleccionar todo Copiar seleccin al portapapeles Agregar seleccin al portapapeles Buscar... Bsqueda y reemplazo global... Bsqueda y reemplazo... Bsqueda y reemplazo... Insertar tabla... Pegar contenido del portapapeles Cortar seleccin al portapapeles Agregar seleccin al portapapeles y suprimir Suprimir lnea Deshacer Rehacer Ir a la siguiente celda Ir a la celda anterior Suprimir palabra a la izquierda Rehacer Insertar salto de pgina Insertar salto de lnea Copiar seleccin al portapapeles Pegar contenido del portapapeles Suprimir palabra a la derecha Ir al principio del documento Ir al final del documento Ir al principio de la ventana Ir al final de la ventana Ir al principio de la palabra previa Ir al principio de la siguiente palabra Seleccin extendida al principio de la palabra previa Seleccin extendida una lnea arriba Seleccin extendida una lnea abajo
Mays + Ctrl + Derecha Seleccin extendida al principio de la siguiente palabra
301
Atajos de edicin de texto (cont.)

Teclas Inicio Fin Mays + Inicio Mays + Fin Ctrl + = F3 F7 F8 Mays + F8 F9 Ctrl + F7 Mays + F7 Mays + F9 Funcin Ir al principio de la lnea Ir al final de la lnea Seleccin extendida al principio de la lnea Seleccin extendida al final de la lnea Insercin Rpida (despus de teclear la palabra de Insercin Rpida) Buscar otra vez Verificar ortografa Unir listas Dividir listas Crear vnculo... Insertar smbolo... Auto Correccin... Remover vnculo
302
Atajos de Formato
Teclas Ctrl + Alt + C Ctrl + E Ctrl + Mays + I Alt + Mays + I Ctrl + B Ctrl + I Ctrl + J Ctrl + L Ctrl + Alt + L Ctrl + Mays + R Ctrl + T Ctrl + Alt + T Ctrl + U Ctrl + 1~6 Ctrl + 7 Ctrl + 8 Ctrl + 9 Ctrl + 0 (cero) Alt + 6 Ctrl + [ Ctrl + ] F2 Mays + F2 Ctrl + F6 Mays + F6 Funcin Alineacin centrada Quitar formato de carcter Propiedades de la Imagen... Efectos de la Imagen... Negrilla Itlica Aplicar color de tipografa Formato de Carcter... Alineacin Izquierda Propiedades del Marco... Formato del Prrafo... Propiedades de la Tabla... Subrayar Aplicar Estilo de Encabezado 1 ~ Encabezado 6 Aplicar estilo de texto con formato Aplicar estilo de lista numerada Aplicar estilo de vieta Aplicar estilo normal Propiedades de la Celda... Disminuir sangra Aumentar sangra Pegar formato Copiar formato... Hojas de estilo... Estilo de Prrafo...
303
Atajos de vista de ventanas

Teclas Ctrl + W Alt + Mays + R Alt + 1 Alt + 2 Alt + 3 Alt + 4 Alt + 5 Alt + Tab Ctrl + Mays + Tab Alt + Intro F5 Mays + F5 F6 F11 F12 Ctrl + F4 Funcin Lista de ventanas... Mostrar / ocultar reglas Ver ventana del Administrador de Sitios Web Ver ventana de Resultados Ver esquema del documento Ver ventana de Lnea de Tiempo Ver lista de capas Cambiar al siguiente documento Cambiar a documento previo Ver atributos del objeto seleccionado Volver a cargar documento Actualizar pantalla Intercambiar entre modo de edicin visual y edicin HTML Vista previa del documento en Internet Explorer Vista previa del documento en Netscape Cerrar documento
304
Otros atajos
Teclas Ctrl + Mays + A Ctrl + D Ctrl + G Ctrl + K Ctrl + Q Ctrl + M Ctrl + Mays + M Ctrl + N Ctrl + Mays + N Ctrl + O Ctrl + Mays + O Ctrl + P Alt + P Ctrl + Mays + P Ctrl + S Alt + S Ctrl + Mays + S Alt + Mays + S Ctrl + Mays + W Alt + Mays + W Alt + X F1 F4 Ctrl + F1 Ctrl + F2 Alt + F4 Mays + F10 Mays + F11 Mays + F12 Funcin Insertar capa Guardar documento como... Agregar marcador... Asignar marcador temporal (presione Ctrl + K seguido de 1~9) Ir a marcador temporal (presione Ctrl + Q seguido de 1~9) Reproducir macro Grabar macro Nuevo documento Nuevo documento en marco Abrir documento... Abrir documento en marco... Imprimir... Configuracin de la pgina... Imprimir conjunto de marcos... Guardar documento Guardar todos los documentos abiertos Guardar todos los marcos Guardar proyecto Administrador de Secuencias de Comandos... Asistente de Secuencia de Comandos... Salir del programa Ayuda Publicar... Informacin del documento... Propiedades del documento... Salir del programa Men Contextual Importar documento de Internet Explorer Importar documento de Netscape
Ctrl + Mays + 0 (cero) Macros...
305
ndice
A
Abrir URL .......................................... 132, 196 Acciones Acciones ........................................ 178, 183 Anexando una accin............................. 179 Eventos .................................................. 178 Propiedades de la accin................ 179, 181 Acoplar ................................................... 39, 43 Administrador de Secuencias de Comandos180 Alineacin .................................................... 54 Animaciones Flash o Shockwave ............... 196 Apple .......................................................... 194 rbol de navegacin rbol de navegacin ................ 11, 257, 266 Creando el rbol de navegacin..... 260, 267 Archivos de MS Word........................ 281, 298 Asistente de Bases de Datos Asistente de Bases de Datos .......... 199, 200 Bloque de Detalle .................. 199, 214, 225 Bloque de Entrada ................. 199, 218, 240 Bloque de Grfico.......................... 199, 231 Bloque de Lista.............................. 199, 221 Bloque de Modificacin ................ 199, 243 Bloque de Tabla............................. 199, 221 Pasos bsicos ......................................... 202 Proporcionando una sentencia de seleccin Clusula de unin (join).................... 212 Clusula donde (where) .................... 213 Clusula ordenar por (order) ............. 214 Requerimientos para usar el Asistente de Bases de Datos .................................. 203 Asistente de Botones Inteligentes ................. 84 Asistente de Grficos.................................. 149 Agregando lneas de tendencia .............. 158 Paso 1 Seleccionar el tipo de grfico............ 151 Paso 2 Especificar series y categoras .......... 152 Paso 3 Especificar el ttulo del grfico ......... 154 Asistente de Sitios Web Asistente de Sitios Web ..................... 8, 258 Carpeta..................................................... 10 Informacin del sitio Web.......................... 9 Plantillas de Sitios Web ............................. 8 Tema .......................................................... 9 Usando el ... ............................................... 7 ASP..................................................... 203, 206 Atributos de estilo Aplicando atributos de estilo.................. 117 Auto Correccin Auto Correccin..................................... 292
B
bajorelieve .................................................... 71 Barra de herramientas Barra de herramientas de formato ............ 40 Barra de herramientas estndar ................ 40 Barra de navegacin de texto........................ 18 Barras de navegacin Barra de navegacin de texto ................... 18 Modificando la apariencia de los botones de la barra ................................................ 19 Modificando la apariencia de los botones de una barra de navegacin.................... 272 Modificar Forma de la Imagen ....... 19 Barras de navegacin grficas ...................... 18 Bloque de Detalle Bloque de Detalle................... 199, 214, 225 Bloque de Lista Bloque de Lista ...................................... 223 Parmetros de la Lista............................ 221 Bloque de Tabla.................................. 199, 221 Bordes de la Tabla Modificando los bordes de una tabla o celda .......................................................... 101 Parmetros de los bordes ....................... 101 Botn Inteligente Atributos de Relleno de Color ................. 86 Modificando un botn.............................. 88 Propiedades de la Sombra ........................ 87 Propiedades del fondo.............................. 88 Seleccionando un botn ........................... 84 Bsqueda y Reemplazo Global Buscar en cdigo fuente HTML............. 264 Buscar en el proyecto............................. 264
307
C
Cambiando la codificacin ......................... 265 Campo de Formulario................................. 162 Botn de comando................................. 168 Botn de opcin..................................... 166 Cajas de texto ........................................ 165 Campo oculto ................................ 168, 249 Casilla de verificacin ........................... 166 Cuadro combinado ................................ 165 Imagen................................................... 169 Men desplegable.................................. 166 Campos de salida (vnculo) ........................ 216 Capas Capas ..................................................... 126 Lista de capas ........................................ 129 Manija de la capa................................... 126 Propiedades de la capa........................... 127 Agregando contenido........................ 127 Cambiando el tamao de una capa.... 127 Capas Mltiples ................................ 128 Creando una capa.............................. 127 Marca de la etiqueta de la capa ......... 126 Moviendo una capa........................... 127 Visibilidad ............................................. 130 Capas:......................................................... 130 CGI CGI........................ 170, 207, 237, 238, 239 Chili!Soft ASP ................................... 203, 206 Clip Art ...................................................... 300 Codificacin ............................................... 109 Cdigo HTML Opciones de formato HTML ......... 173, 285 Solapa opciones de edicin de cdigo Color de la tipografa ................ 172, 286 Mostrar nmeros de lnea ................. 287 Ventana HTML Ancho tabulacin.............................. 287 Componentes de Temas Barra de Navegacin ............................... 22 Botn Inteligente ..................................... 23 Objeto de un tema.................................... 22 Titulares................................................... 22 Conjunto de Marcos Origen de los marcos ............................. 174 Conservar cdigo HTML existente ... 173, 174, 285 Control ActiveX ......................................... 195 Control de Cdigo Agregar archivos al Control de Cdigo . 276 Carpeta de Trabajo ................................ 278
Conectando al Control de Cdigo.......... 275 Descargar la ltima versin ................... 279 Eliminar del Control de Cdigo............. 276 Registrar archivos .................................. 279 Salida ..................................................... 277 Convertir Texto a Tabla...................... 105, 106 Copiar Formato............................................. 57 CSS..................................................... 124, 125
D
Diccionario ortogrfico............................... 285 Directorio de inicio..................................... 238 Distribucin................................................ 106 Documento Guardar .............................................. 14, 60 Propiedades del Documento .. 108, 117, 138 Vista Previa ............................................. 13 DSN DSN ............................................... 203, 204
E
Edicin de cdigo fuente ............................ 171 Edicin HTML Editando cdigo HTML Submen Salto de lnea..................... 171 Efectos JavaScript ...................................... 175 em113 Entorno de edicin Barra de herramientas de formato............ 40 Barra de herramientas estndar................ 40 Solapa Documentos ................................. 40 Solapa Modo............................................ 40 Ventana de Edicin.................................. 40 Entorno de Edicin Barra de estado ........................................ 40 Espacios................................................... 42 Marcas de Prrafo.............................. 42 Marcas Especiales.................................... 42 Rejillas de Tabla ...................................... 42 Espaciamiento de lnea ................................. 54 Estilo Alineacin.............................................. 115 Espaciamiento entre Lneas ................... 115 Estilo...................................................... 119 Sangra................................................... 115 Estilo del Prrafo ........................................ 121
F
Formularios
308
Creando un formulario........................... 163 FTP............................................................... 28
G
Galera de Imgenes ..................................... 64 Abrir cada imagen en una nueva ventana 67 Especificar dnde guardar las imgenes .. 67 Leyendas.................................................. 66 Giro Efecto de giro ........................................ 178 Grficos Iniciando el Asistente de Grficos ......... 151 Modificando las opciones de las series .. 155 Guas Guas........................................................ 43 Parmetros de las guas Ajustar .............................................. 127 Encajar .......................................... 44, 95 Mostrar/Ocultar................................... 44
Texto ................................................... 74 Fijar el Color Transparente ...................... 62 Formato de imgenes ......................... 47, 58 Guardando un documento con imgenes . 60 Imagen de fondo ................ 47, 88, 108, 138 Importar desde la Web................................ 297 ndice Z....................................................... 128 Insercin automtica de etiquetas ............... 171 Insercin rpida .......................................... 293 Agregar Insercin rpida........................ 293 Insertando elementos en el formulario........ 163
J
JPG ............................................................... 74
L
Lnea slida ................................................ 288 Lneas de Tiempo Anexando Acciones ............................... 191 Auto inicio ............................................. 192 Lneas de Tiempo................................... 185 Marcos llave........................................... 188 Objetos grficos ..................................... 190 Rengln de Acciones ............................. 191 Repetir ................................................... 192
H
Hojas de Clculo Actualizar el contenido de la Hoja de Clculo.............................................. 147 Importando Hojas de Clculo 145, 147, 148 Incrustada en documento HTML ........... 147 Vincular a la hoja de clculo original .... 147 Hojas de estilo ............................................ 119 Agregar Estilo........................................ 119 Borrar Estilo .......................................... 119 Estilo del Prrafo ..................................... 54 Guardar .................................................. 123 Vincular a una Hoja de estilo externa .... 125 Hojas de estilo externas .............................. 124 Hurfano............................................... 31, 263
M
Macros Grabar .................................................... 294 Macros ................................................... 294 Reproducir ............................................. 294 Mapa de Imagen Crear un mapa de imagen ........................ 80 Dibujar una zona activa rectangular......... 80 Mapa de Imagen....................................... 80 Zona activa............................................... 80 Marcadores Creando y usando marcadores ................. 82 Marcadores .............................................. 82 Nombre del marcador .............................. 82 Marcas Mostrar/Ocultar Marcas ........................... 41 Todas ....................................................... 41 Marcos Agregando y eliminando marcos Dividir Marcos Horizontalmente....... 135 Dividir Marcos Verticalmente........... 135 Ancho del borde Ocultos .............................................. 138 Bordes del marco
309
I
IIS203, 206 Imgenes Agregando imgenes ......................... 47, 58 Cambiando el tamao de una imagen ...... 61 Copiando una imagen .............................. 59 Efectos de imagen Sombra................................................ 87 Efectos de Imagen Ajustando el brillo y el contraste ........ 70 Filtro de Imagen.................................. 71 Gradiente ............................................ 72 Sombra................................................ 73 Sombras .............................................. 70
Ancho del Borde............................... 138 Bordes....................................... 133, 138 Cambiando el tamao de los marcos .... 133, 138 Determinando el destino predeterminado de un marco ................................... 135, 138 Guardando un conjunto de marcos ........ 132 Guardar conjunto de marcos como ........ 132 Marco destino ........................................ 135 Marcos................................................... 131 Nombre del marco ................................. 137 Nuevo Marco......................................... 131 Nmero de marcos................... 67, 111, 131 Removiendo marcos .............................. 135 Vista previa de un conjunto de marcos.. 133 Microsoft Excel Importando hojas de clculo.......... 111, 145 Miniaturas .................................................... 64
N
Nodo................................................... 260, 267 Nombre del vnculo.................................... 221 NT .................................................................. 1
O
Objetos multimedia Animaciones Flash y Shockwave .......... 196 Otros objetos plug-in ............................. 195 Pelculas QuickTime ............................. 195 Sonidos MIDI........................................ 197 Sonidos RealAudio................................ 197 Objetos Multimedia pelculas QuickTime.............................. 194 Obtener ltima versin ............................... 278 ODBC......................................................... 203 onMouseOut............................................... 184 onMouseOver............................................. 184 Opciones de despliegue de cdigo............ 173 Sangra Automtica ............................... 287 Opciones de guardar de la galera de imgenes ................................................. 69 Opciones de importar archivo externo 281, 298 Ordenar....................................................... 103
pixeles........................................................... 53 Plantilla......................................................... 48 Plug-in ........................................................ 195 PNG.................................................. 58, 64, 75 Portapapeles.................................................. 50 Preferencias Opciones del Documento....................... 283 Programas externos .................................... 287 Propiedades de las Tablas............................. 96 Alineacin................................................ 96 Tamao.................................................... 96 Propiedades del Formulario........................ 170 Propiedades QuickTime ............................. 197 Proyectos .................................................... 258 Administrando los documentos en un proyecto .................................... 257, 261 Agregando nuevos documentos a un proyecto ............................................ 259 Creando carpetas en un proyecto ........... 260 Creando un nuevo proyecto ................... 258 Publicando.................................................... 27 Conectando con el sitio Web ................... 33 Descargando archivos de su sitio Web ... 27, 35 Informacin del sitio Web ....................... 28 Publicando ......................................... 27, 32 Seleccionando los archivos que han cambiado............................................. 32 Transmitiendo los archivos al sitio Web.. 33 Volviendo a crear un proyecto borrado.... 35 PWS.................................................... 203, 206
R
Reemplazar Reemplazar .............................................. 51 Reemplazar Todo..................................... 51 Reglas ........................................................... 43 Rejilla Parmetros de la rejilla Ajustar .............................................. 127 Encajar .......................................... 44, 95 Mostrar/Ocultar................................... 44 Rejilla ...................................................... 43
P
Pegar Formato .............................................. 57 Personal Web Server .................................. 203 Personalizando las barras de herramientas .. 39, 43 PHP .................................................... 203, 206
310
S
Solapa Modo Modo Edicin .......................................... 40 Modo HTML ........................................... 40 Modo vista previa .................................... 40 SourceSafe.......................................... 273, 275
T
Tablas Borrar....................................................... 95 Convirtiendo entre texto y tablas ........... 105 Copiando y pegando partes de una tabla.. 93 Creando una tabla .............................. 90, 91 Editando tablas Agregando renglones y columnas ....... 92 Borrando renglones y columnas.......... 92 Cambiando el tamao de renglones y columnas .................................. 12, 94 Color de fondo .................................... 98 Editando las propiedades de una celda 98 Imagen de fondo ......................... 97, 100 Seleccionando partes de una tabla....... 91 Ordenando una tabla.............................. 103 Tablas hijas.............................................. 91 Tablas hijas................................................... 91 Tablas y distribucin .................................. 106 Tamao de la ventana................................... 44 Tema Cambiando temas ................................ 7, 21 Galera de temas .......................... 7, 21, 270 Rango de documentos a los cuales aplicar un tema ........................................... 7, 21 Texto Alineacin................................................ 54 Introduciendo y seleccionando texto ....... 49
Tipografa Decoracin............................................. 112 Tipografa Primaria................................ 112 Tipografa Secundaria............................ 112 Titular Editando la etiqueta de un titular ............. 15
V
Valores Predeterminados del Documento Autor........................................................ 45 Color de la tipografa ............................... 45 Color del fondo ........................................ 45 Color del vnculo ..................................... 45 Tamao de la tipografa ........................... 45 Valores Predeterminados del Documento 45 Verificando vnculos............................. 30, 263 Hurfano .......................................... 31, 263 Vnculo externo................................ 31, 263 Verificar todos los vnculos .. 30, 262, 263, 291 Vnculo roto.......................................... 30, 263 Vnculos Crear/Modificar Vnculos .................. 78, 79 Hipervnculos........................................... 76 Remover Vnculos ................................... 79 Tipo de vnculo ........................................ 76
Z
zona activa .................................................... 80
311

Manual

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Manual

Cargado por

Copyright:

Formatos disponibles

La solucin ideal para sitios La solucin ideal para sitios La solucin ideal para sitios Web fantsticos Web

fantsticos Web fantsticos

Comenzando con su Pgina Inicial ...............5 Captulo 1

Creando un Proyecto con el Asistente de

Agregando contenido personal ...............................................12

Editando los titulares y la barra de navegacin ......................15

Cambiando los temas y agregando componentes ...................21

Publicando su Proyecto ............................. 27

Preparndose para publicar....................................................28 Publicando un proyecto a su sitio Web ...................................32

Descargando archivos de su sitio Web....................................35

Descargando los archivos a un proyecto existente Volviendo a crear un proyecto borrado

Creando Documentos Web........................ 37 Captulo 3

Perspectiva general de la interfase de Namo WebEditor.........40 Personalizando el entorno de edicin .....................................43

Edicin Bsica de un Documento ............... 47

Creando nuevos documentos ..................................................48

Agregando y editando texto....................................................49

Formato bsico de texto .........................................................52

Agregando y dando formato a imgenes.................................58

Creando una galera de imgenes ...........................................64

Aplicando efectos a una imagen .............................................70

Creando hipervnculos ............................................................76

Creando botones y titulares....................................................84

Creando y editando tablas ......................................................90

Modificando las propiedades de un documento.....................108

Edicin Avanzada de un Documento........ 111

Usando atributos de estilo ....................................................112

Hojas de estilo ......................................................................119

Trabajando con capas ...........................................................126

Marcos y conjuntos de marcos ..............................................131

Importando hojas de clculo ................................................145

Creando un grfico desde una tabla......................................149

Creando formularios Web .....................................................162

Editando el cdigo fuente HTML............................................171

Agregando Elementos Dinmicos ............ 175

Creando lneas de tiempo .....................................................185

Agregando objetos multimedia .............................................194

Creando Documentos basados en Bases de

7.1.5 7.1.6 7.1.7 7.2.1 7.2.2 7.2.3

Seleccionando un documento de tipo dinmico.....................206

203 203 204

7.3 7.4 7.5

7.6 7.7 7.8

Creando un bloque de detalle ...............................................225

Creando un bloque de grfico ...............................................231

7.11 7.12 7.13

Modificando las propiedades basadas en una base de datos.252

7.14.1 7.14.2 7.14.3 7.14.4

Proyectos y Administracin de Sitios Web 255 Captulo 8

Trabajando con Proyectos....................... 257

Creando un proyecto ............................................................258

Administrando los documentos de un proyecto ....................261

Administrando la navegacin del sitio Web ..........................266

Colaborando en un Proyecto ................... 273

Introduccin al control de cdigo .........................................274 Usando el control de cdigo..................................................275

Otros Temas ......................................... 281

Requisitos del Sistema

Instalando Namo WebEditor 4

archivos de instalacin sean descomprimidos, el programa de instalacin se ejecutar automticamente.

Acerca de este manual

Denota informacin de apoyo al contenido principal de una seccin o subdivisin.

Obteniendo soporte tcnico

Comenzando con su Pgina Inicial

Creando un Proyecto con el Asistente de Sitios Web

1.1 1.2 1.3 1.4