La solución ideal para sitios La solución ideal para sitios La solución ideal para sitios Web fantásticos Web

fantásticos Web fantásticos

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 República 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 Teléfono: +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 dueños respectivos

ii

.

Contenido
Requisitos del Sistema .........................................................................1 Instalando Namo WebEditor 4 .............................................................2 Acerca de este manual .........................................................................3 Obteniendo soporte técnico .................................................................4

Comenzando con su Página Inicial ...............5 Capítulo 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 información 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 imágenes Guardando un documento 12 13 14

1.3

Editando los titulares y la barra de navegación ......................15
Editando la etiqueta de un titular 15 Modificando la apariencia de un titular 15 Cambiando el conjunto de destinos de una barra de navegación 17 Intercambiando entre barra de navegación en modo gráfico y en modo 18 Modificando la apariencia de los botones de la barra de navegación 19 Cambiando el tema Agregando una barra de navegación Agregando un titular y otros objetos de un tema Agregando un botón inteligente 21 22 22 23

1.4

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

Capítulo 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

Preparándose 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 información del sitio Web Verificando los vínculos

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 Capítulo 3
3.1 3.2
3.1.1 3.1.2

El Entorno de Edición................................. 39
40 41

Perspectiva general de la interfase de Namo WebEditor.........40 Personalizando el entorno de edición .....................................43
Elementos de la Interfase Elementos de la ventana de Edición

3.2.1 Usando las reglas, guías y rejillas 43 3.2.2 Seleccionando el tamaño 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

Capítulo 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

Edición Básica de un Documento ............... 47
48 48 48

Creando nuevos documentos ..................................................48
Creando un documento vacío 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 aplicación Buscando y reemplazando texto Formato de carácter Formato de párrafo Copiando y pegando formatos Agregando una imagen del disco duro Agregando una imagen de la librería de imágenes Agregando una imagen de la Web Copiando una imagen de otro documento Guardando un documento con imágenes Cambiando el tamaño de una imagen Ajustando la disposición 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 básico de texto .........................................................52
52 54 57 58 58 59 59 60 61 61 62

4.4

Agregando y dando formato a imágenes.................................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 galería de imágenes ...........................................64
Paso 1: Seleccionar las imágenes Paso 2: Especificar el tamaño de la imagen Paso 3: Especificar la distribución y opciones de vínculos 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 dónde guardar las imágenes Publicar un documento que contiene una galería de imágenes

67 69

4.7

Creando hipervínculos ............................................................76
Vínculos absolutos vs. relativos Ejemplos de vínculos Creando un vínculo Editando o quitando un vínculo Creando vínculos múltiples 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 botón/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 botón o titular en la ventana de Edición Creando una tabla Seleccionando partes de una tabla Agregando y eliminando renglones y columnas Copiando y pegando partes de una tabla Cambiando el tamaño 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 título a una tabla Dividiendo y combinando tablas Ordenando una tabla Convirtiendo entre texto y tablas Usando una tabla para la distribución de una página 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 vínculos 108 Asignando el título de un documento, palabras clave y juego de caracteres 109 Cambiando los márgenes de una página y aplicando efectos especiales110

Capítulo 5

Edición 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 tipografía Colores y fondos Alineación, sangrías y espaciamiento Márgenes 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 vínculos 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 tamaño 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 tamaño 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 cálculo como una tabla estática Importando una hoja de cálculo vinculando o incrustando Convirtiendo una tabla existente Conceptos básicos de gráficos Ejecutando el Asistente de Gráficos Paso 1: Seleccionar el tipo de gráfico Paso 2: Especificar series y categorías Paso 3: Especificar el título de un gráfico Cambiando de tamaño y modificando un gráfico Modificando las opciones de las series Editando los valores en un gráfico Agregando y eliminando series de datos o categorías Agregando líneas de tendencia Modificando las opciones de los ejes Modificando la apariencia de un gráfico 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 cálculo ................................................145

5.6

Creando un gráfico 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

..2 6.4..1 El Asistente de Secuencias de Comandos.....2 5........7.....185 La ventana de Líneas de Tiempo Creando y editando un objeto gráfico (sprite) Creando un objeto gráfico al grabar el camino de una capa Anexando acciones a una línea de tiempo Especificando cómo inician las líneas de tiempo Trabajando con líneas de tiempo múltiples Insertando Insertando Insertando Insertando una animación Flash o Shockwave una película QuickTime un sonido MIDI un sonido RealAudio 185 188 190 191 192 193 6.........5 6....1.......5.......4 6...3 5.2........................162 163 164 165 166 168 168 169 170 5.1..........1 6....2...3..........1...171 Intercambiando entre edición visual y edición de código fuente Inserción automática de etiquetas en la ventana HTML Opciones de despliegue de código fuente Opciones de formato de código fuente Editando el código fuente HTML de un conjunto de marcos 171 171 172 173 174 Capítulo 6 6.6 6.4 Creando Documentos basados en Bases de 199 Introducción al Asistente de Bases de Datos .8.8..3 6.........2 6..1 5.8 Editando el código fuente HTML...3...3 6.4 Agregando objetos multimedia ...176 6.8.....1..1 6...5 5.......4...8......3....7....3 Creando líneas de tiempo .13 Cambiando la carpeta predeterminada de los archivos de imagen de un gráfico 161 5.. 175 6.3 6......7...........1 6....8...4..3 7....6 5.3..6.7 5. eventos y el Administrador de Secuencias de Comandos 178 Anexando una acción usando el diálogo de Acciones Usando el Administrador de Secuencias de Comandos Acciones y eventos incluidos 179 180 183 6.7.5 Creando un formulario e insertando elementos Creando un formulario en una tabla Agregando campos de entrada de texto Agregando controles de selección Agregando un campo oculto Agregando botones Agregando un campo de imagen Modificando las propiedades de un formulario Creando formularios Web ...3.....3 5......4 5................8 5............2 Acciones...7..1 7.....4.2.....2 5........4 5......7.194 196 197 197 197 Capítulo 7 Datos 7...............7...7 5...4 Agregando Elementos Dinámicos ...2 7.7.3......2 6.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 básicos para usar el Asistente de Bases de Datos 200 201 201 202 vii .1 7.......1 5.....

........6 7......4 7.5 Creando un bloque de entrada .....1 7...1 7.12 7...2 7..2........1.215 Apariencia de los bloques en la ventana de Edición ......206 Seleccionando un tipo de secuencia de comandos (script) Especificando el tipo de conexión 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 conexión ODBC a una base de datos Lista de pasos del Asistente de Bases de Datos 203 203 204 7.1 7.........10.........6.....5.....2 7...8...8....1......225 225 226 227 7.9..2 7.............243 Agregando elementos de bloque en la ventana de Edición......5 7.......2 7.....2 7.6 7..............11..3 7..6...10........219 Creando un bloque de lista o tabla..9 Creando un bloque de detalle ..8 Agregando y quitando elementos de bloque .4............13..............240 Creando un bloque de modificación ...........7 7...10 Creando un bloque de gráfico .....4 7...2..13.....7....12...5.....4...1.5 7..10.7 7...3 7.10.....3 7..11 7...246 Agregando Agregando Agregando Agregando Agregando un un un un un campo de salida campo de salida con vínculo campo de entrada campo oculto menú desplegable o un grupo de botones de opción 246 247 248 249 249 Ejemplo de un bloque de modificación Pasos para crear un bloque de modificación 243 244 240 241 viii .13..208 Seleccionando campos de una base de datos..8..2 7..2 7........3 7.2 7......13....3 7.............1 7...4 7....1 7.2 7.1 7.7..6 7..............1 7..........2........10..9....11.......9......3 Seleccionando un documento de tipo dinámico...2 7..5 Seleccionando un origen de los datos ...231 Ejemplo de bloque de gráfico 231 Requerimientos de formato de una tabla de base de datos 232 Pasos para crear un bloque de gráfico 233 Obteniendo etiquetas de series y categorías de una base de datos 235 Proporcionando las etiquetas de series y categorías de forma manual 236 Publicando un documento con un bloque gráfico 237 Ejemplo de un bloque de entrada Pasos para crear un bloque de entrada 7...2 7.....212 Cláusula “unión” (join) Cláusula “donde” (where) Cláusula “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 múltiples 210 210 7.........12..1 7..209 Proporcionando una Sentencia de Selección ..........1 7...3 7...13 7.....1 7..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 vínculo a un bloque de detalle 221 222 223 Modificando la apariencia de un bloque 220 216 217 7.........10......13...........1 7.....5................

................2............274 Usando el control de código...........2......14.... 273 275 276 277 278 279 279 Introducción al control de código ......261 Cambiando de nombre o renombrando archivos y carpetas Moviendo o copiando documentos dentro de un proyecto Desplegando los vínculos “de” y “hacia” un documento Verificando los vínculos de un proyecto Realizando búsqueda y reemplazo global Cambiando el lenguaje de codificación en un proyecto Creando el árbol de navegación Quitando documentos de un árbol de navegación Agregando barras de navegación 261 261 262 263 264 265 267 270 270 8.293 Macros .....................2 7.................. 281 Preferencias .................1 9....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..252 Cambiando Cambiando Cambiando Cambiando el la la el tipo de documento lista de los campos de una base de datos incluidos sentencia de selección método de entrada o los parámetros de la lista 252 252 252 253 7.............14.275 Creando un nuevo proyecto SourceSafe Agregando o eliminado archivos del control de código Dando salida a archivos del control de código Deshaciendo una salida Dando entrada a archivos al control de código Actualizando copias locales de archivos bajo el control de código Otros Temas ............................2.....7...3 Trabajando con Proyectos....5 8................5 8..............1 9...1.2...................294 Editor de ecuaciones ...............14.......................2 9...........................266 Capítulo 9 9......................6 8....1 8............297 ix ................2 8...................14 Modificando las propiedades basadas en una base de datos. 257 258 259 259 260 260 Creando un proyecto .....1 7..4 8......1................292 Inserción rápida.........................14..2 8...........3...........4 8...2.........3 Administrando la navegación del sitio Web ...............2...3 9......................4 9..2 9....2 Administrando los documentos de un proyecto .....2....1 8..2.......................................4 Proyectos y Administración de Sitios Web 255 Capítulo 8 8..............1...............................3 8.....3 8.........5 9......2.........................6 Colaborando en un Proyecto ........3..283 Auto corrección .................2......1 8...................1 8..2..........1.2 8.............2....3 7...296 Importando documentos y sitios Web .........................1..............................3......

......................................Importando documentos de Microsoft Word .....................301 x .................................................299 Agregando imágenes a la librería de imágenes ............................300 Lista de atajos de teclado.........298 Enviando un documento como correo electrónico (e-mail)....

NT 4.02 ó 2000 32 MB RAM Espacio en Disco Duro: 10 MB (instalación mínima) 200 MB (instalación estándar. incluyendo imágenes clip art) Lectora de CD-ROM (para la instalación) Internet Explorer 4 o más reciente (para vista previa interna) Además. 1 . 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 estén instalados en su ordenador. 98.Requisitos del Sistema Éstos son los requisitos mínimos del sistema para instalar y usar Namo WebEditor 4: Windows 95.

el programa de instalación se ejecutará automáticamente.namo. 3 La primera vez que ejecute Namo WebEditor después de la instalación. Una vez que los archivos de instalación sean descomprimidos. se le preguntará su número de serie y llave de licencia. Si descargó WebEditor de Internet: 1 Haga doble clic sobre el nombre del paquete de instalación descargado. Si elige no instalarlas. 2 . actualizaciones gratuitas y ofertas especiales de actualización. El programa de instalación debe empezar automáticamente. 3 Siga las instrucciones de la pantalla para terminar la instalación.. Proporciónelos tal y como los recibió de la empresa a la que compró Namo WebEditor 4.Instalando Namo WebEditor 4 Si está instalando del CD-ROM: 1 Inserte el CD-ROM de Namo WebEditor en su lectora. 2 Siga las instrucciones de la pantalla para completar la instalación. puede usar la biblioteca de imágenes directamente de su CD-ROM de Namo WebEditor. 4 La primera vez que ejecute Namo WebEditor. Proporciónelos exactamente como se encuentran en la parte posterior de la funda del CD-ROM de Namo WebEditor 4. Por consiguiente. Para registrar Namo WebEditor.” del menú Inicio de Windows y teclee “D:\setup. visite la página de registro en línea http://www. se le preguntará su número de serie y llave del CD.com/register / o rellene y envíe por fax o por correo la tarjeta de registro que se encuentra dentro de su paquete de Namo WebEditor. Por favor tenga en cuenta que la instalación de la biblioteca de imágenes Clip Art requiere un espacio adicional en el disco duro de 120MB. Los usuarios registrados reciben acceso de prioridad al soporte técnico.. Registrando su programa Le sugerimos que registre su copia de Namo WebEditor.exe” donde “D” es la letra de su lectora de CD-ROM. seleccione el comando “Ejecutar. 2 Si el programa de instalación no comienza de forma automática. asegúrese de tener suficiente espacio en su disco antes de intentar instalar las imágenes.

<presionar> Las palabras en tipografía normal entre paréntesis en ángulo indican que hay que presionar o pulsar una tecla. el paréntesis angular. los nombres de campo en la base de datos y similares. 3 . Convenciones tipográficas Los símbolos y tipografías siguientes tienen significados especiales y pueden encontrarse a lo largo de este manual: Comentario Denota información de apoyo al contenido principal de una sección o subdivisión. se usa para separar menú. Referencia cruzada Denota una referencia cruzada a otra sección pertinente o subdivisión del manual.Acerca de este manual Este manual se ha diseñado especialmente para satisfacer las necesidades del usuario principiante y aquellos con experiencia limitada en la creación de páginas Web. Además. Recurso de Programa Una tipografía negrita Sans serif se usa para los elementos del menú y del texto encontrados en la interfaz del usuario de Namo WebEditor. submenú y nombres de elementos de menú. Aun cuando sea un diseñador de Web profesional. debe examinar por lo menos esta parte para aprender sobre cómo Namo WebEditor enfoca estos temas. puede ir directamente a la Parte Dos que comienza con una vista general de la interfaz del usuario y continúa con la información 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 administración del sitio. Por ejemplo. “>”. Si es un usuario más experimentado. Así. Nombre de Archivo Una tipografía de monoespacio se usa para la mayoría de los nombres de archivos. la Parte Uno del manual incluye una introducción detallada de cómo crear un primer proyecto de Web y publicarlo. como la tecla <Intro>. Insertar > Avanzado> Hoja de cálculo significa el elemento de menú Hoja de cálculo en el submenú Avanzado del menú Insertar. nombres de etiqueta.

puede verificar fácilmente las actualizaciones de Namo WebEditor seleccionando la opción Actualizaciones de Namo WebEditor en el menú de Ayuda.com o envíenos un fax al +82-2-55-99-334. Para una lista actualizada de distribuidores. le sugerimos que verifique la sección de solución de problemas de la ayuda en línea de Namo WebEditor. Sólo use estos contactos si compró Namo WebEditor directamente de Namo Interactive o si su país no se lista en la página de contactos de soporte regional. La sección lista varias preguntas frecuentes (FAQs) considerando los problemas técnicos. Si se presiona <F1> en cualquier diálogo.Obteniendo soporte técnico El soporte técnico para Namo WebEditor generalmente lo proporciona el distribuidor de Namo Interactive en su país o región del mundo. Antes de contactar con el soporte técnico. Además.com/support/wecontact. por favor envíe un correo electrónico con su pregunta o problema a support@namo. el sistema de ayuda abrirá el archivo pertinente. 4 . Se puede tener acceso a la ayuda en línea presionando <F1> o seleccionando Ayuda de Namo WebEditor en el menú Ayuda. Si su país o región no se encuentra en la lista o si compró Namo WebEditor directamente de Namo Interactive usando las páginas de pedido en línea de nuestro sitio Web. Debe encontrase conectado a Internet para usar esta opción.html. visite nuestra página de contactos de soporte regional en la Web http://www.namo.

Parte Uno Comenzando con su Página Inicial .

.

3 1.Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web El Asistente de Sitios Web de Namo WebEditor es la manera más fácil de crear su página de bienvenida en la Web. Usando al asistente se ahorra el tener que diseñar y crear todo el sitio.4 Usando el Asistente de Sitios Web Agregando contenido Editando los titulares y la barra de navegación Cambiando los temas y agregando componentes 7 .1 1. El Administrador de Sitios Web usa plantillas y “temas” ya diseñados para mantener una estructura y apariencia profesional en su nuevo sitio Web. pronto se encontrará en marcha con su propio sitio de Web en menos tiempo del que podría pensar. En este capítulo 1.2 1. Aun cuando sea un principiante absoluto en el diseño Web.

Si decide que no quiere uno o más de los documentos de la plantilla seleccionada. Para utilizar el Asistente de Sitios Web. 8 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . etc. 1. puede personalizar el proyecto con el contenido seleccionado y “publicarlo” a un sitio Web. 2 Complete cada uno de los cuatro pasos del asistente como se describe a continuación. compañía. Después de seleccionar una plantilla para el sitio y decidir qué documentos desea incluir. quite la marca de la casilla de verificación a un lado de sus nombres. siga estos pasos: 1 Seleccione el comando Archivo > Proyecto > Asistente de Sitios Web. Una selección de los documentos (páginas) que están en la plantilla escogida aparece en la lista de en medio. haga clic en el botón Siguiente. Elija una plantilla basada en el tipo de sitio que desea crear: personal.1.1 Usando el Asistente de Sitios Web El Asistente de Sitios Web genera un proyecto completo después de seguir unos simples pasos. Si pulsa sobre el nombre de un documento.1 Paso 1: Seleccionar una plantilla para el sitio Web Seleccione una plantilla para el sitio de la lista del lado izquierdo del diálogo.1. su vista preliminar aparece en el recuadro del lado derecho. Una vez que se usa el Asistente de Sitios Web.

1. Para conseguir una vista preliminar de cualquiera de los documentos del proyecto con un tema seleccionado. 1. Los temas disponibles aparecen en la lista del lado izquierdo del diálogo. Esto abrirá el diálogo Galería de temas.tal como las formas de un botón.2 Paso 2: Proporcionar información del sitio Web Proporcione su nombre o el de la organización.3 Paso 3: Seleccionar un tema Namo WebEditor 4 viene con 200 temas prediseñados. Un tema es una colección de elementos de diseño . elija el documento en la lista de en medio. Lo que haya proporcionado como nombre se usará como la base del titular de la página índice del proyecto. Los temas son divididos en categorías.1. imágenes de fondo y selección de tipografía .que han sido seleccionadas para dar una apariencia consistente a un documento o un sitio Web completo. haga clic sobre el botón Siguiente. como se muestra a continuación. su dirección de correo electrónico y cualquier información de derechos de autor que desea que aparezca en la parte de abajo de cada documento del proyecto. La dirección del correo electrónico se insertará como un hipervínculo en la parte baja de cada documento del proyecto. Cuando termine.1. Una vista preliminar del documento usando el tema seleccionado aparecerá en el recuadro derecho. para ver los temas en una categoría haga doble clic sobre el nombre de la categoría. Pulse sobre el botón Ver tema para una vista preliminar de cualquier tema. Usando el Asistente de Sitios Web 9 .

Si desea usar otro directorio.1. como se muestra en la imagen inferior. La carpeta predefinida se encuentra dentro de Mis Documentos. pulse sobre el botón Finalizar. en unos segundos. tecléelo en la caja del texto o seleccione una carpeta después de pulsar sobre el botón Examinar.1. Si aparece un diálogo preguntando si se crea el directorio. con el nombre “Namo_Site” seguida de un número.4 Paso 4: Seleccionar una carpeta Seleccione una carpeta para guardar el nuevo proyecto. El Asistente de Sitios Web generará su proyecto y. Puede empezar ahora a personalizar los documentos de su nuevo proyecto. 10 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . la página índice del proyecto (el primer documento que se ve cuando visitan su sitio) aparecerá en la ventana de Edición de Namo WebEditor. Finalmente. presione sobre el botón Sí.

8. ordenados por nombre de archivo. 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 navegación del proyecto.3: Administrando la navegación del sitio Web Usando el Asistente de Sitios Web 11 . Se muestra una lista de todos los documentos del proyecto en la solapa Proyecto. haga doble clic sobre su nombre. Para abrir un documento.Abriendo otros documentos del proyecto Para abrir otro documento que no sea la página índice. cambie al Administrador de Sitios Web usando la barra de tareas de Windows. Alternativamente.

Si es posible.2. Para empezar un nuevo párrafo presione la tecla <Intro>. Siguiendo la norma Web. También puede copiar y pegar texto o arrastrar y soltar de otra aplicación. Si quiere empezar una nueva línea sin empezar un nuevo párrafo presione las teclas <Mayús + Intro>. el del ejemplo se elimina. imágenes y el contenido de cada documento del proyecto.2 Agregando contenido personal Una vez que el Asistente de Sitios Web ha generado su nuevo proyecto. (Puede ver los bordes punteados de la tabla en la ventana de Edición. 4.5: Cambiando el tamaño 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 tipografía.) Las tablas ayudan a dar una apariencia ordenada y organizada a cada documento. como un procesador de texto o un navegador de Web. En general. puede empezar a agregar su propio texto. 1. No se preocupe si se queda sin espacio al teclear. como en “<Asunto>” y “<Descripción>”.1 Agregando texto Los documentos creados por el Asistente de Sitios Web se disponen en tablas invisibles. pero no se muestran en un navegador Web o en la ventana de Vista Previa. un espacio en blanco igual a la altura de una línea aparecerá entre la parte superior del nuevo párrafo y la inferior del anterior.3: Edición básica de texto ¿Por qué aparece un subrayado rojo al escribir cada palabra? De manera predeterminada. Las celdas de la tabla del diseño se expanden para acomodar cantidades mayores de texto automáticamente. tamaño y color de texto seleccionado. éstas tendrán un subrayado rojo hasta terminar de escribirlas. Para reemplazar el texto con el propio. El texto e imágenes le indican dónde debe agregar su propio contenido.9. el texto se encuentra entre paréntesis angulares. Namo WebEditor verifica la ortografía de cada palabra al escribirla. sólo haga clic en uno de sus bordes y arrástrelo. Namo WebEditor conservará el formato del texto copiado.1. simplemente selecciónelo y comience a escribir. En cuanto teclee su propio texto. 12 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . Puesto que la mayoría de las palabras incompletas no están en el diccionario. Si quiere cambiar manualmente el tamaño de una celda. 4. Se resaltan por medio de un subrayado en rojo las palabras mal deletreadas y aquellas que no están en el diccionario ortográfico.

Así es como se ven: Para reemplazar una imagen con la propia. desactive la opción Verificar ortografía al escribir de la solapa Preferencias de Edición en el diálogo Preferencias. Para reemplazar una imagen con una de la librería haga lo siguiente: 1 Haga doble clic sobre la imagen.2 Agregando imágenes El Asistente de Sitios Web inserta espacios para las imágenes en varios lugares a lo largo de un proyecto. También puede ver el documento activo en un navegador Web real. Agregando contenido personal 13 . Presione la tecla <F11> para ver el documento en Internet Explorer (predeterminado). También puede seleccionar una imagen de las miles disponibles en la librería de imágenes. 3 En el diálogo Clip Art seleccione una categoría y subcategoría y luego seleccione la imagen que desea insertar en el documento. 2 En el diálogo Propiedades de la Imagen pulse sobre el botón Clip Art a un lado de Ruta de la Imagen. pulse sobre la solapa Vista Previa en la parte inferior de la ventana principal de Namo WebEditor. Haga clic en el botón Insertar. 3 En el diálogo Abrir localice y seleccione la imagen que desea insertar en el documento. 2 En el diálogo Propiedades de la Imagen pulse sobre el botón Examinar a un lado de Ruta de la Imagen. Presione la tecla <F12> para verlo en Netscape Navigator (predeterminado).Si desea quitar la comprobación automática de la ortografía. Puede cambiar las asignaciones de los navegadores en la solapa Navegadores Web del diálogo Preferencias. haga lo siguiente: 1 Haga doble clic sobre la imagen. Vista previa de un documento La ventana de la Vista Previa muestra cómo se verá el documento activo en Internet Explorer 4.x o más reciente.2. 1. Para ver la ventana de Vista Previa. 4 Presione sobre el botón Aceptar para cerrar el diálogo Propiedades de la Imagen.

4 Presione sobre el botón Aceptar para cerrar el diálogo Propiedades de la Imagen.2. Si ha agregado imágenes al documento. Haga clic sobre el botón Aceptar para copiar los archivos de imagen al directorio del proyecto o haga clic sobre el botón Seleccionar Carpeta para escoger una subcarpeta dentro de la del proyecto. sálvelo seleccionando Guardar en el menú Archivo o haciendo clic en el botón Guardar en la barra de herramientas Estándar. el diálogo Copiar Archivos de Recursos aparecerá.3 Guardando un documento Cuando haya terminado con los cambios a un documento. 1. 14 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . luego haga clic sobre el botón Aceptar. preguntándole si quiere copiar los archivos de imagen a la carpeta del proyecto (predeterminado) o a una subcarpeta de la carpeta del proyecto.

Cuando cambia una etiqueta de un titular está cambiando el nombre de navegación del documento que contiene el titular. Editando los titulares y la barra de navegación 15 . como se describe a continuación. 3 Haga clic en el botón Aceptar. Mientras que los cuatro botones en forma de estrella debajo de él constituyen una barra de la navegación. cambiará para usar el nuevo nombre automáticamente. Se pueden editar varias de las propiedades de los titulares y barras de navegación. 1.1 Editando la etiqueta de un titular Para editar la etiqueta de texto en un titular. Una barra de navegación es un juego de botones gráficos o vínculos de texto que permiten a los visitantes del sitio navegar rápidamente a través de los varios documentos en un sitio Web. Para modificarlo. Como resultado cualquier botón o enlace en las barras de navegación que vincule al documento.3.3. puede cambiarlo de varias maneras.2 Modificando la apariencia de un titular Si no está satisfecho con la apariencia del titular en su proyecto. Un titular es una imagen con una etiqueta del texto que se pone en la parte superior de un documento para identificar su propósito o contenido. 2 En el diálogo Propiedades del Titular edite o reemplace el texto en la caja de texto Etiqueta. haga lo siguiente: 1 Doble clic sobre el titular. En la imagen siguiente la parte superior es un titular.1. haga lo siguiente: 1 Doble clic en el titular. 1.3 Editando los titulares y la barra de navegación El Asistente de Sitios Web inserta un titular y dos o más barras de navegación en cada documento que crea.

16 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . 6 Para cambiar las propiedades de la etiqueta de texto. Esto abrirá el Asistente de Botones Inteligentes. pulse sobre el botón Texto en la lista a la izquierda bajo la vista previa del titular. 4 La imagen del titular en uso se despliega. haga doble clic sobre el botón Tema en la lista del lado izquierdo del diálogo y seleccione una categoría. 3 En la parte superior del diálogo del Asistente de Botones Inteligentes. pulse sobre el botón Seleccionar Forma. haga clic sobre Modificar Imagen. use las manijas de las esquinas y lados en la vista previa del titular. Si desea seleccionar otra imagen. Las imágenes disponibles en la categoría seleccionada se despliegan en el lado derecho. Si desea modificar la imagen. haga clic sobre el botón Siguiente y continúe con el paso 5. tamaño y color. 5 Para cambiar el tamaño. Seleccione una imagen para el titular y presione sobre el botón Siguiente. tales como la tipografía.2 En el diálogo Propiedades del Titular.

Editando los titulares y la barra de navegación 17 . El juego de documentos a los que una barra de navegación particular se vincula es llamado conjunto destino. No se puede modificar la apariencia de un sólo titular. Se puede cambiar el conjunto destino de una barra de navegación siguiendo estos pasos. Cuando modifica la apariencia de un titular. 1 Haga doble clic sobre la barra de navegación. mientras que el conjunto de destinos de otra barra de navegación podría ser todos los documentos en el mismo nivel del padre del documento que la contiene. tamaño y estilo de la etiqueta de texto. Para volver a colocar la etiqueta.7 Use la solapa Propiedades de Texto para cambiar la tipografía. haga clic sobre ella y arrástrela a la ventana de vista previa.3. en cambio. Los documentos en un conjunto no se especifican individualmente.) Por ejemplo. todos los titulares de todos los documentos del proyecto toman la nueva apariencia. pulse el botón Terminar. Use la solapa Propiedades de la Sombra para agregar o modificar una sombra bajo la etiqueta. 1.3 Cambiando el conjunto de destinos de una barra de navegación Cada barra de navegación en un proyecto contiene un juego de vínculos a varios documentos del proyecto. el conjunto de destinos de una barra de navegación podría consistir en todos los documentos “hijos” del documento que la contiene. se especifican desde el punto de vista de sus relaciones al documento que contiene la barra de la navegación (estas relaciones se definen en la solapa Estructura del Administrador de Sitios Web. Use la solapa Atributos de Color de Relleno para cambiar el color de la etiqueta. 8 Cuando termine con las modificaciones del titular.

el conjunto destino se resalta en la lista Tipo de barra de navegación a la derecha.3. 1. seleccione Usar texto o Usar botones. los documentos destino se resaltan con un contorno azul. 3 Haga clic sobre el botón Aceptar. mientras el documento actual se resalta con un contorno rojo.2 En el diálogo Propiedades de la barra de navegación (mostrado abajo). seleccione Incluir la página de inicio.) Para cambiar una barra de navegación de botones gráficos a vínculos de texto o viceversa. 4 Si desea incluir la página índice del proyecto en el conjunto. 18 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . Los nuevos documentos designados se resaltarán con un contorno azul en la vista previa del Árbol de navegación.4 Intercambiando entre barra de navegación en modo gráfico y en modo texto La barra de navegación puede tener tanto botones gráficos como de texto (pero no ambos. En la vista previa del Árbol de Navegación. 3 Seleccione el conjunto destino en la lista Tipo de barra de navegación. 2 En el diálogo Propiedades de la barra de navegación. haga lo siguiente: 1 Haga doble clic en la barra de navegación. 5 Haga clic sobre el botón Aceptar.

Por ejemplo. haga clic en Modificar Forma de la Imagen. Seleccionar Tipo. haga clic en Modificar la Barra de navegación. puede modificar la apariencia de los botones de la barra gráfica de navegación. a diferencia de los titulares. giro e inactivo cada uno de los cuales usa una imagen distinta. 5 En el segundo paso.5 Modificando la apariencia de los botones de la barra de navegación Como con los titulares.1. 3 En el diálogo Parámetros de la barra de navegación. elija el tipo de imagen de botón que desea modificar. seleccione Botones de giro Verticales. decida si desea modificar la imagen del botón existente o seleccionar una imagen diferente. para modificar la imagen del botón horizontal normal. para modificar la imagen de giro vertical. 2 En el diálogo Propiedades de la barra de navegación. ya sea editando las imágenes del botón existente o reemplazándolas con otras. Para modificar una imagen de botón. haga clic en el botón Siguiente y continúe con el paso 6. los botones en una barra horizontal de navegación son diferentes a los de las barras verticales. Sin embargo. haga lo siguiente: 1 Haga doble clic en cualquier barra de navegación del proyecto.3. seleccione primero el tipo a modificar. Si desea seleccionar una imagen diferente. haga doble clic sobre el botón Tema en la lista del lado izquierdo del diálogo y seleccione una categoría. Además. Cuando desee modificar la imagen de un botón. así que hay un total de seis imágenes diferentes. Seleccionar Forma. los botones de las barras de navegación vienen en tres “estados” diferentes: normal. Después de seleccionar un tipo. 4 En el primer paso del Asistente de Botones Inteligentes. haga clic en el botón Siguiente. seleccione Botones Horizontales. Si desea modificar la imagen actual. Las imágenes disponibles en la categoría seleccionada son Editando los titulares y la barra de navegación 19 . Esto abre el Asistente de Botones Inteligentes.

6 En el tercer paso.desplegadas en el lado derecho. Para cambiar el tamaño del botón. Cuando se modifica la apariencia de la imagen de un botón de la barra de navegación. No es posible modificar la apariencia de sólo una barra de navegación. todas las barras de navegación en todos los documentos del proyecto usan ahora la nueva apariencia. tamaño o estilo de la etiqueta. tales como tipografía. Seleccione una imagen y haga clic sobre el botón Siguiente. haga clic y arrástrela en la vista previa. use las manijas en las esquinas y lados dentro de la vista previa. Use la solapa Atributos del Color de Relleno para cambiar el color de la etiqueta. haga clic en el botón Texto en la pequeña lista del lado izquierdo bajo la vista previa del botón. 7 Para cambiar las propiedades del texto de la etiqueta del botón. 20 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . 8 Use la solapa Propiedades del Texto para cambiar la tipografía. Use la solapa Propiedades de la Sombra para añadir o modificar una sombra bajo la etiqueta. haga clic en el botón Finalizar. tamaño y color. se pueden modificar varias propiedades de la imagen seleccionada. 9 Cuando haya terminado de realizar las modificaciones a la imagen. Editar Botones. Para cambiar de posición la etiqueta.

una colección de elementos de diseño unificados . permitiéndole seleccionar el rango de documentos a los que se aplica el tema. haga lo siguiente: 1 Abra cualquier documento del proyecto. La vista previa muestra los componentes del tema. haga doble clic en su miniatura.1. 6 Un diálogo aparecerá.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. 1.1 Cambiando el tema Para cambiar el tema que usa un proyecto. Aparecerán una serie de Miniaturas de los temas de la categoría seleccionada del lado derecho. Seleccione un rango. haga clic en el botón Aplicar. 5 Para aplicar el tema seleccionado. 4 Para ver una vista preliminar de un tema en particular.que puede cambiar cuando se quiera. tal como Todos los archivos en el proyecto y presione el botón Aceptar. Cambiando los temas y agregando componentes 21 . Esto es posible porque un proyecto creado con el Asistente de Sitios Web usa un tema . 2 Seleccione Cambiar Tema en el menú de Formato. seleccione una categoría de la lista de la izquierda. tales como titulares y barras de navegación. 3 En el diálogo Galería de Temas. Esto abre la Galería de Temas. el uso de un tema hace posible agregar varios componentes del tema ya diseñados a los documentos de un proyecto.4. Además.

4 más adelante.4.3 Agregando un titular y otros objetos de un tema Para agregar un titular. 2 Seleccione Insertar > Componentes de Tema > Barra de navegación. La etiqueta de texto en un titular agregado de esta manera siempre es el nombre de navegación del documento.) Hay varios tipos de componentes de tema además de la barra de navegación y los titulares.2 Agregando una barra de navegación Aunque cada documento creado por el Asistente de Sitios Web contiene varios componentes del tema. Para agregar una barra de navegación. 4 Seleccione la orientación de la barra de navegación haciendo clic en el botón Horizontal o Vertical. la barra del navegación y los divisores horizontales. use un botón inteligente en su lugar (vea la sección 1. 3 En el diálogo Propiedades de la barra de navegación. Si desea agregar un titular con una etiqueta propia. Los documentos destino serán realzados en azul dentro de la vista previa del Árbol de Navegación.4. tres iconos pequeños con las palabras "Refrescante". seleccione un conjunto destino para la misma en la lista Tipo de Barra de navegación.1. coloque el punto de inserción en la posición del documento donde desea insertarlo y seleccione Insertar > Componentes de Tema > Titular. Éstos incluyen dos tipos de viñetas. haga lo siguiente: 1 Coloque el punto de inserción en la posición del documento donde quiera agregar la barra de navegación.4. como los titulares. 5 Especifique si quiere usar botones gráficos o vínculos de texto en Apariencia. puede agregar más componentes si lo desea. Ciertos conjuntos destino permiten especificar el uso de iconos. 6 Haga clic sobre el botón Aceptar para insertar la barra de navegación. 22 Capítulo 1 Creando un Proyecto con el Asistente de Sitios Web . 1.

"Caliente" y "Nuevo" así como un divisor horizontal gráfico. Para agregar cualquiera de éstos componentes, haga lo siguiente:
1 Coloque el punto de inserción en el lugar del documento donde desea insertar el

componente del tema.
2 Seleccione Insertar > Componentes del Tema > Más Objetos.

3 En el diálogo Insertar Objeto del Tema, seleccione el componente a insertar y haga clic

sobre el botón Aceptar.

1.4.4 Agregando un botón inteligente
Un botón inteligente es una imagen que puede cambiar de tamaño, con una etiqueta de texto que generalmente se usa como botón de enlace o titular. A diferencia de otros tipos de botones que usan imágenes de mapas de bits que se deforman cuando cambian de tamaño, los botones inteligentes usan imágenes de "vector" que no pierden resolución. Además, puede cambiar el color de un botón inteligente, e incluso agregar un gradiente, sin tener que usar un programa de edición de imágenes. También es posible editar el texto de la etiqueta Para insertar un botón inteligente, haga lo siguiente:
1 Coloque el punto de inserción en la posición del documento donde desea insertar el botón

inteligente.
2 Seleccione Insertar > Componentes del Tema > Botones Inteligentes. Esto abre el

Asistente de Botones Inteligentes.

Cambiando los temas y agregando componentes

23

3 En el primer paso del asistente, Seleccionar Forma, elija una de las formas del botón en

la lista de la derecha y presione el botón Siguiente.
4 En el segundo paso, Editar Botón, puede revisar varias de las propiedades del botón. Para

cambiar el tamaño del botón, use las manijas de las esquinas y lados en la vista previa

5 Cada botón inteligente tiene por lo menos un componente de imagen que se puede

cambiar de tamaño y otro de texto. Seleccione el componente a modificar pulsándolo en la vista previa.
6 Para cambiar la posición de un componente, haga clic y arrástrelo dentro de la ventana de

vista previa.
7 Use la solapa Propiedades de Texto para cambiar el texto, tipografía, tamaño o estilo de

un componente de texto. Use la solapa Atributos de Color de Relleno para cambiar el

24

Capítulo 1

Creando un Proyecto con el Asistente de Sitios Web

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 botón inteligente, pulse el botón Finalizar para

insertar el botón en el documento. Puede modificar posteriormente el botón haciendo doble clic en él.
Estrictamente hablando, un botón 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 sólo pueden agregarse a documentos que usan un tema, los botones inteligentes pueden añadirse a cualquier documento.

Cambiando los temas y agregando componentes

25

Capítulo 2

Publicando su Proyecto

Una vez que se ha creado un proyecto Web y se ha editado a su satisfacción, 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 páginas Web.

En este capítulo

2.1 2.2 2.3

Preparándose para publicar Publicando un proyecto a su sitio Web Descargando archivos de su sitio Web

27

2.1 Preparándose para publicar
Antes de publicar su proyecto Web, necesitará preparar la información para su sitio Web. Además un paso optativo, pero altamente recomendable antes de publicar, es realizar la comprobación de los vínculos del proyecto completo para encontrar los que están rotos y otro tipo de problemas.

2.1.1 Ajustando la información del sitio Web
Para publicar su proyecto Web, necesitará el acceso a un servidor Web o a un servicio de anfitrión Web donde se publicará el proyecto. A menos que usted, la compañía u organización tengan su propio servidor Web, deberá contratar una cuenta con un proveedor que hará de anfitrión para sus páginas Web. Muchos Proveedores de Servicio de Internet (ISP) y portales de Web ofrecen estos servicios; contactar con uno es fácil; normalmente puede hacerlo en línea usando un navegador. Ya sea que use un servicio de anfitrión o su propio servidor Web, necesitará cierta información con respecto al servidor que organizará su sitio. Si usa un servicio de anfitrión, puede obtener esta información de su página de bienvenida o preguntando por correo electrónico. Si usa el servidor Web de la compañía, el administrador de la red puede proporcionarle la información. La información requerida es: Nombre de anfitrión Esta es la dirección FTP del servidor Web a la cual se transmitirán los datos de su proyecto Web. El nombre del anfitrión puede ser una dirección URL, tal como ftp.namo.com o una dirección IP, como 210.101.143.7. Tenga presente que el nombre del anfitrión 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 publicarán y en el que se almacenarán los documentos. Si usa un servicio de anfitrión de Web, el directorio es usualmente public_html. Si usa un servidor propio o el de la compañía, el directorio puede ser cualquiera — pregunte al administrador de la red.

Nombre de Usuario Esta es su identificación de usuario para poder entrar al servidor Web. Si usa un servicio de anfitrión de Web, usualmente escogerá el nombre al darse de alta. Contraseña Esta es su contraseña de usuario usada para entrar al servidor Web. Si usa un servicio de anfitrión de Web, usualmente escogerá la contraseña al darse de alta. Además, debe saber la dirección Web para acceder a su sitio desde un navegador. Por ejemplo, si usa un servicio de anfitrión, esto puede ser algo similar a

28

Capítulo 2

Publicando su Proyecto

Aunque esta información no se usa al publicar el proyecto. Esto abrirá el diálogo Parámetros del Sitio Web. haga lo siguiente: 1 Cambie a la solapa Publicar del Administrador de Sitio Web. 7 Haga clic sobre el botón Aceptar para guardar la información del sitio y cerrar el diálogo Parámetros del Sitio Web. se requiere para guardar los documentos directamente al sitio Web usando el comando Guardar. 2 En el menú Herramientas. Esta información es usada por Namo WebEditor cuando se guardan los documentos directamente a un sitio Web usando la ventana Publicar. donde el nombre después de la tilde es el nombre de usuario.http://www. Haga clic en el botón Cerrar para regresar al Administrador de Sitio Web. proporcione un nombre para el sitio. si no lo ha hecho ya. puede dejar el nombre sin cambiar. nombre de usuario y contraseña. 2 Conecte con Internet. haga lo siguiente: 1 Cambie al Administrador de Sitio Web. Preparándose para publicar 29 . selecciónelo y haga clic sobre el botón Modificar. directorio. Para confirmar que la información es correcta. Este nombre sólo se usa para identificarlo en la lista. 3 El diálogo Lista de Sitios Web muestra inicialmente varios servicios de anfitrión Web comunes. deje el nombre del anfitrión sin cambiar. proporcione el nombre del anfitrión. Su sitio debe aparecer en el diálogo Lista de sitios Web. puede no ser el mismo que el nombre del anfitrión. haga clic sobre el botón Agregar.com/~jsmith. Si el suyo se encuentra en la lista. seleccione Parámetros del Sitio Web.) 5 Bajo Información FTP. proporcione la dirección Web (URL) usada para acceder al sitio Web en un navegador. (Si seleccionó un servicio existente en la lista. 6 En Información HTTP. 4 En el recuadro Nombre del Sitio. Para modificar la información de su sitio Web en Namo WebEditor.namo. 3 Seleccione su sitio en el menú Sitio en la parte superior de la ventana del Administrador de Sitio Web.) No cambie el número en la caja de texto Puerto a menos que se lo recomiende el administrador del sistema o el servicio contratado. (Si seleccionó un servicio existente en la lista. De otra forma.

Cuando la comprobación está completa. Haga clic en el botón Desconectar para cancelar la conexión al sitio hasta que esté listo a publicar. es Buena idea verificar los vínculos en todos los documentos para buscar problemas potenciales.2 Verificando los vínculos Antes de publicar un proyecto Web. Si la información del sitio es correcta y válida. (Si se hace Publicando su Proyecto 30 Capítulo 2 . seleccione Verificar Todos los Vínculos . 2 En el menú Herramientas. Se encuentra listo para publicar su proyecto. Afortunadamente. Sin embargo. Si hubo algún problema en la conexión al sitio. el diálogo 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. aparecerá un diálogo indicándole “No es posible conectar a [nombre del sitio].4 Haga clic en el botón Conectar. Verifique la contraseña y nombre de usuario en los parámetros del sitio. Para verificar todos los vínculos de un proyecto. antes de hacerlo. debe realizar un paso más: verificar los vínculos del proyecto.” Haga clic sobre el botón Aceptar y edite los parámetros del sitio en el diálogo Parámetros del sitio Web e intente de nuevo. permitiéndole cambiar o quitar los vínculos rotos antes de publicar. Namo WebEditor provee de una forma sencilla de realizar esto en un sólo paso. El documento o recurso pudo haber sido movido o eliminado usando otro programa. 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 verificación de los vínculos: Vínculo roto Indica que el documento al que se refiere el vínculo no pudo ser encontrado. Podrá publicar sus documentos al sitio sin ningún problema. Un diálogo indicando el progreso aparecerá mientras Namo WebEditor verifica todos los vínculos en los documentos del proyecto. 2.1. haga lo siguiente: 1 Cambie al Administrador de Sitio Web. Un diálogo que le indica el progreso de la operación aparecerá indicándole que Namo WebEditor está intentando conectar y entrar a su servidor Web. tal como el Explorador de Windows.

Si no piensa usar un archivo huérfano. Cualquier otro. no se verifica. puede eliminarlo con seguridad.usando el Administrador de Sitio Web. como FTP y mailto. para que pueda quitarlo o arreglarlo. Si desea que Namo WebEditor verifique los vínculos externos. El documento que contiene el vínculo roto se abrirá en la ventana de Edición y el punto de inserción deberá colocarse antes del vínculo roto. haga doble clic sobre el elemento en la ventana de Resultado. Esto no significa que el hipervínculo esté roto o sea inválido. Para examinar un vínculo roto.) Vínculo externo Indica que el vínculo referido pertenece a un sitio Web externo. Haga doble clic en un elemento huérfano en la ventana Resultado para intentar abrir el archivo en la ventana de Edición. Preparándose para publicar 31 . Namo WebEditor cambia de manera automática todos los vínculos afectados. Los archivos huérfanos no pueden ser abiertos por los visitantes del sitio. (Nota: Namo WebEditor sólo puede verificar vínculos HTTP externos.) Huérfano Indica que no existe un vínculo al documento o recurso en ningún otro documento del proyecto. sino que Namo WebEditor no lo verificó. habilite la opción Verificar vínculos externos al verificar vínculos en la solapa Proyectos del diálogo Preferencias.

puede usar las casillas de verificación 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). (2) conectarse al sitio Web y (3) transmitir los archivos al sitio Web. Selecciona los archivos que han cambiado desde la última vez que se publicó el proyecto. Éstos se describen a continuación Selecciona todos los archivos del proyecto (incluyendo aquellos dentro de las carpetas). Use esta opción si publica el proyecto por primera vez.) Muy útil para poner al día el sitio Web rápidamente con las últimas versiones de sus documentos.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 fácilmente los archivos a publicar. Todos éstos se realizan en la solapa Publicar del Administrador de Sitio Web 2. Selecciona los documentos que están en la ventana de Edición. Sin embargo. (Compara las fechas de modificación de los archivos locales y los archivos remotos. es mucho más conveniente usar los botones sobre la lista de archivos locales para seleccionar rápidamente un grupo de archivos. 32 Capítulo 2 Publicando su Proyecto .2. Para seleccionar los archivos individuales y carpetas a publicar.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 Seleccione su sitio en el menú Sitio en la parte superior de la ventana Publicar. está listo para seguir al próximo paso: conectar con su sitio Web. Para conectar a su sitio Web. Los archivos y carpetas ya en el sitio. Un diálogo aparecerá indicando el progreso de la transferencia. verifique la información de cuenta en el diálogo Parámetros del Sitio Web (use el comando Herramientas > Parámetros del Sitio Web) y pruebe de nuevo. haga lo siguiente: 1 Conecte a Internet. Quita la selección de todos los archivos.2. 3 Haga clic en el botón Conectar.1. Si recibe un mensaje de error que dice que Namo WebEditor no puede conectar con el sitio. si no lo ha hecho. si los hay. como se describe en la sección 2. aparecerán en la lista de archivos remotos. debe haber preparado la información del sitio y verificado que se puede conectar a él. Selecciona todos los archivos de imagen que se usan en los documentos seleccionados (si los hay). simplemente haga clic en el botón Publicar. Cuando la transferencia sea completada con éxito. 2. Una vez que ha seleccionado los archivos para publicar.1.Selecciona los mismos archivos que había seleccionado la última vez que publicó el proyecto.2 Conectando con el sitio Web Antes de conectar a su sitio Web. 2.2. pulse sobre el botón Aceptar para cerrar el diálogo. ¿Qué indica una marca gris? Una marca de verificación 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.3 Transmitiendo los archivos al sitio Web Una vez seleccionados los archivos a ser publicados y que se haya conectado a su sitio. Publicando un proyecto a su sitio Web 33 . Un diálogo indicando el progreso aparecerá hasta que Namo WebEditor haya conectado con éxito al servidor.

Si cualquier archivo no pudiera transferirse.Se resaltarán los archivos y carpetas publicados con éxito con una casilla de verificación verde en la lista de archivos locales.) 34 Capítulo 2 Publicando su Proyecto . (Verifique su conexión con Internet y pruebe de nuevo. se resalta con casilla de verificación roja.

2 Volviendo a crear un proyecto borrado Cada proyecto creado en Namo WebEditor tiene varios “archivos invisibles” que guardan la información del estado del proyecto y la configuración. 5 En la lista de archivos remotos. el archivo local es reemplazado sin ningún aviso. aparece el mensaje"La importación terminó con éxito.3. los archivos de configuración de su sitio Web no pueden recuperarse. si ha eliminado alguna o todas las copias locales de sus documentos Web inadvertidamente. Cuando la recepción está completa.3. Esto hará que la lista de archivos locales apunte a su proyecto.3 Descargando archivos de su sitio Web Ocasionalmente puede necesitar recibir archivos de su sitio Web a su ordenador . si no está conectado." Haga clic sobre el botón Aceptar para cerrar el diálogo. por ejemplo.2. 6 Haga clic en el botón Descargar. seleccione los archivos y/o carpetas que desea descargar. 3 Cambie a la solapa Publicar del Administrador de Sitio Web. 2 Conecte con Internet. 2.1 Descargando los archivos a un proyecto existente Para descargar archivos de su sitio Web a un proyecto existente. Sin embargo. si no se encuentra abierto. Si anula una carpeta completa del proyecto inadvertidamente. Use la tecla < Mayús > mientras hace clic para seleccionar elementos contiguos múltiples o la de < Ctrl > para seleccionar elementos no contiguos. Estos archivos no aparecen en ninguna de las vistas del Administrador de Sitio Web y no se publican a su sitio Web. Namo WebEditor proporciona la opción de recibir archivos de su sitio Web usando 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. Después de descargar los documentos. 2. Los archivos recibidos aparecerán en la lista de archivos locales. Un diálogo aparece indicando el progreso de la descarga. haga lo siguiente: 1 Abra el proyecto. Para tales casos. puede volver a crear los archivos de configuración descargando todos los documentos y archivos de recursos de su sitio a una Descargando archivos de su sitio Web 35 . Si ya existe un archivo en la carpeta del proyecto con el mismo nombre del que se intenta descargar del sitio. puede revisarlos como de costumbre y entonces volver a publicarlos al sitio. 4 Asegúrese de que la casilla de verificación Publicar proyecto (arriba de la lista de archivos locales) está marcada.

teclee un nombre para el proyecto y presione sobre el botón Examinar. 8. haga lo siguiente: 1 Usando la ventana Publicar.1: Creando una estructura de navegación 36 Capítulo 2 Publicando su Proyecto . Los nuevos archivos y carpetas del proyecto aparecerán en la solapa Proyecto. que alguna información se perderá (como la estructura de navegación del proyecto.3. Tenga presente. El proyecto se creará y aparecerá el Administrador de Sitio Web.carpeta en su unidad de disco duro y creando un nuevo proyecto en esa carpeta. 2 Cambie a la ventana principal de Namo WebEditor y seleccione Archivo > Proyecto > Nuevo Proyecto. conecte a su sitio Web y descargue todos los archivos y carpetas del sitio en un directorio vacío en su unidad de disco duro. Debe ahora volver a crear la estructura de navegación del proyecto manualmente.) Para volver a crear un proyecto borrado. 5 Haga clic sobre el botón Aceptar para cerrar el diálogo Crear Nuevo Proyecto. Haga clic sobre el botón Aceptar. que tendrá que ser recreada a mano. 3 En el diálogo Crear Nuevo Proyecto. sin embargo. 6 Haga clic con el botón derecho del ratón sobre el icono del proyecto que se encuentra en el panel superior de la ventana y seleccione Agregar Todos los Archivos al Proyecto. 4 En el diálogo Examinar localice y seleccione la carpeta en la que guardó los archivos de su sitio Web.

Parte Dos Creando Documentos Web .

.

Capítulo 3 El Entorno de Edición Las características de WebEditor son intuitivas.1 Perspectiva general de la interfase de Namo WebEditor 3. aprenderá a usar al máximo la interfase de Namo WebEditor. para la creación y edición visual de documentos Web. En este capítulo. En este capítulo 3. pero poderosas.2 Personalizando el entorno de edición 39 .

Como con otras aplicaciones de Windows. Barra de Menú Barra de herramientas estándar Solapas de Documento Ventana de Edición Barra de herramientas de Formato Barra de Estado Solapas de Modo A continuación describimos estos elementos de arriba hacia abajo: Barra de Menú Ésta es una barra normal de menú de Windows. También puede presionar las teclas <Ctrl + Tab> para intercambiar entre los documentos abiertos.1. Solapas de Documentos Las solapas de documento le permiten cambiar entre los documentos abiertos. 40 Capítulo 3 El Entorno de Edición .1 Elementos de la Interfase La imagen siguiente muestra los elementos básicos de la ventana principal de Namo WebEditor.3. 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. puede acceder a un menú rápidamente tecleando la letra subrayada mientras presiona la tecla <Alt> Barra de Herramientas Estándar La barra de herramientas estándar contiene los atajos a muchos de los comandos generales de uso frecuente.1 Perspectiva general de la interfase de Namo WebEditor 3. La barra del menú contiene la mayoría de los comandos de Namo WebEditor.

Algunos de éstos se ilustran en la imagen inferior. Perspectiva general de la interfase de Namo WebEditor 41 .2.Ventana de Edición La ventana de Edición es su área de trabajo con el documento. tales como la localización en el disco duro de una imagen o hipervínculo bajo el apuntador del ratón. Además de las barras de herramientas Estándar y de Formato. Es donde se revisa el texto. La barra de herramientas de Imagen aparece cuando se pulsa sobre una imagen y desaparece cuando se hace clic fuera de ella. se vuelve una ventana flotante. Solapa de Modos Barra de Estado De manera predeterminada. Estas solapas se usan para cambiar entre los tres modos de la ventana principal: modo de Edición. arrástrela a uno de los bordes de la ventana. la barra del menú y las barras de herramientas Estándar 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 línea doble del lado izquierdo. Si mueve la barra del menú o una de las barras de herramientas fuera de un borde de la ventana.2 Elementos de la ventana de Edición Además del texto e imágenes que constituyen un documento Web.1. Como con las otras barras de herramientas. dos barras de herramientas adicionales "aparecen" como flotantes dependiendo de lo que se está haciendo en la ventana de Edición. se puede estacionar (acoplar) cualquiera de ellas al borde de la ventana principal 3. Para fijarla. el estado de modificación del documento y las etiquetas HTML en el punto de inserción.3: Personalizando las barras de herramientas 3. estos elementos no aparecen cuando el documento se ve en un navegador. La barra de estado es un área que despliega información útil sobre el documento actual y el ambiente de trabajo. se insertan imágenes y todo lo demás relacionado a crear y revisar documentos de Web. modo HTML y modo de Vista Previa. La barra de herramientas de Tablas aparece cuando se usa el comando Dibujar Tabla del menú Tabla.) Pueden colocarse en cualquier borde de la ventana. la ventana de Edición puede contener varios otros elementos que sólo aparecen cuando está revisando un documento.

applets.Manija de capa Punto de inserción Marca de salto de línea Marca de etiqueta de capa Borde de capa Indicador de inicio Marcador Marca de párrafo Rejillas ocultas de tabla Todos estos símbolos especiales y marcas se despliegan de manera predeterminada. use Ver > Marcas > Todas. comentarios. Para mostrar u ocultar todas las marcas. etiquetas desconocidas. Use Ver > Marcas > Marcas de Párrafo para intercambiar el despliegue de símbolos de párrafo y saltos de línea. 42 Capítulo 3 El Entorno de Edición . marcadores. controles ActiveX y objetos multimedia. plug-ins. Use Ver > Marcas > Marcas Especiales para intercambiar el despliegue de símbolos especiales que indican etiquetas de capas. Use Ver > Marcas > Espacios para intercambiar el despliegue de los pequeños puntos que indican un espacio. bordes punteados alrededor de formularios. el inicio de viñetas o listas numeradas. pero si prefiere puede deshabilitarlas para tener un escritorio más “limpio” (a excepción del punto de inserción) 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.

Puede personalizar todas las barras de herramientas y fijar rápidamente el tamaño de la ventana principal para aproximarse a las resoluciones gráficas comunes de pantalla. vertical o ambas. puede predeterminar varios valores de los documentos y las preferencias del usuario en el diálogo Preferencias. Para mostrar la regla horizontal. varias guías y una rejilla de diseño habilitada. la guía de diseño y una rejilla pueden ser una gran ayuda en el bosquejo cuando la precisión es importante. Además de usar las reglas para medir el tamaño de los elementos en la página.3. use uno de los comandos en el submenú Ver > Reglas. coloque el punto de inserción dentro del párrafo y arrastre uno de los controles de sangría (como se muestra en la figura superior) al punto deseado. 3. Sangría de primera línea Sangría izquierda Sangría derecha Para fijar la sangría de un párrafo usando la regla horizontal. La unidad usada en las reglas es el píxel.1 Usando las reglas. Reglas. Además. se puede usar la regla horizontal para fijar la sangría de un párrafo.2. guías y rejillas Las reglas.2 Personalizando el entorno de edición Es posible personalizar el entorno de edición de Namo WebEditor de varias maneras. guías y una rejilla de trazado están disponibles para ayudarle al diseño preciso de sus páginas. Personalizando el entorno de edición 43 . La imagen siguiente muestra la ventana de Edición con las reglas horizontales y verticales.

haga clic dentro de una de las reglas. arrástrela de Nuevo a la regla. Por consiguiente. Para ocultar todas las guías sin removerlas. es posible que un documento que requiera desplazamiento en la ventana de Edición no lo requiera en un navegador.2 Seleccionando el tamaño de la ventana Al diseñar un documento Web. Tres tamaños comunes de pantalla están disponibles. los visitantes del sitio también tendrán que hacerlo si las ventanas de sus navegadores son del mismo tamaño. coloque el apuntador del ratón directamente sobre la guía. Para mover una guía. los bordes de las capas “encajan” a ellas al moverlas o cambiarlas de tamaño. Puede usar reglas y guías de diseño para hacer esto. Para mostrar las rejillas de diseño. De manera similar. Para eliminar una guía. Además. cuando el apuntador del ratón tenga la forma de una barra doble con pequeñas flechas en ambos lados. estos elementos encajan a subdivisiones invisibles de la rejilla de diseño. Cuando presione sobre el botón Aceptar. Para crear una guía de diseño. sabrá que si necesita desplazarse para ver el documento entero en la ventana de Edición. arrastre fuera de ella a la posición deseada dentro de la ventana de Edición y suelte el botón del ratón. use el comando Ver > Guías > Mostrar. 44 Capítulo 3 El Entorno de Edición . con 10 píxeles entre subdivisiones.3: Trabajando con capas De manera predeterminada las rejillas se separan en 50 píxeles.Una rejilla o guía de diseño puede ayudar a alinear los elementos en la página con respecto a los demás. Si habilita “ajustar a” para las rejillas o guías. pero es posible especificar un tamaño personalizado. use el comando Ver > Rejilla > Mostrar. la ventana principal se redimensionará al instante al tamaño seleccionado. También se pueden cambiar los colores de las rejillas y guías usando el mismo comando. Sin embargo. haga clic y arrástrela a la nueva posición. 3. Una vez realizado esto. pero una manera más fácil es cambiar el tamaño de la ventana de Namo WebEditor al mismo que el del navegador designado usando el comando Ver > Tamaño de la ventana. úselo de nuevo para mostrar las guías.2. Para habilitar o deshabilitar el ajuste a guías use el comando Ver > Guías > Encajar. Para habilitar o deshabilitar el ajuste a rejillas use el comando Ver > Rejilla > Encajar. Se pueden cambiar estos parámetros usando el comando Ver > Rejilla > Parámetros. tenga presente que el comando Tamaño de la ventana no toma en cuenta el tamaño de cualquier barra de herramientas que pueda estar acoplada a cualquier borde de la ventana principal. los bordes de las tablas encajan en las rejillas o guías al moverlas. 5. a veces es necesario asegurarse de que el documento entero esté visible en una ventana del navegador aumentada al máximo en un cierto tamaño de pantalla — tal como 800 x 600 píxeles — sin que se requiera desplazarla.

Para mayor información sobre preferencias del usuario vea la sección Preferencias en la parte 6 de esta guía.3. Estos parámetros solamente afectan a cómo se muestra el texto en la ventana de Edición del cual no se ha especificado una tipografía. seleccione una categoría y luego arrastre el botón deseado a la barra de herramientas.2. Dele un nombre y presione el botón Aceptar. Personalizando el entorno de edición 45 . Los parámetros iniciales (definidos por el usuario) significan que los documentos nuevos no tendrán un lenguaje específico de codificación. Para mostrar u ocultar rápidamente una barra de herramientas.4 Ajustando las opciones predeterminadas del documento y las preferencias del usuario Se pueden cambiar varios parámetros y preferencias del usuario en el diálogo Preferencias. La nueva barra de herramientas aparecerá y el diálogo Personalizar Barra de herramientas se abrirá. realizar una copia de seguridad de forma automática cuando se guarda un documento y otras más. El texto predeterminado.2. se muestran todos los botones disponibles. dependiendo de los propios parámetros de tipografía. color de fondo y de vínculo para un documento nuevo se especifican en la solapa Propiedades del Documento. Para quitar un botón de una barra de herramientas. usará la codificación especificada en él. Recuerde que puede mover una barra de herramientas a cualquier posición en la pantalla o acoplarla a cualquiera de los bordes de la ventana principal. haga clic con el botón derecho del ratón en cualquier barra de herramientas acoplada o en la barra de menú y seleccione su nombre del menú de atajos. Las otras solapas del diálogo Preferencias permiten fijar otras preferencias del usuario tales como verificar la ortografía al escribir. La solapa Propiedades del Documento también permite especificar el ancho del texto proporcional y fijo para todos los documentos. use el comando Herramientas > Preferencias. Para agregar un botón. haga clic en el botón Nuevo en el diálogo Barra de herramientas. El mismo texto pueda aparecer de formas diferentes en distintos navegadores. arrástrelo fuera de ella. cuando un documento de este tipo se vea en un navegador. Para personalizar una barra de herramientas existente. agrupados por categorías.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. Cambie a la solapa Botones para agregar o remover botones tal y como se describe en los párrafos anteriores. selecciónela en el diálogo Barra de herramientas y haga clic en el botón Personalizar. En la solapa Botones del diálogo Personalizar Barra de herramientas. 3. Se puede también especificar el lenguaje predeterminado de codificación (juego de caracteres) para el nuevo documento. Para abrirlo. Para crear una nueva barra de herramientas.

cámbiela 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. Si quiere que la ventana de Edición y la de Vista Previa usen la misma tipografía.¿Por qué el texto aparece en una tipografía distinta en la ventana de Vista Previa? En la ventana de Edición. usa una de las predefinidas en la solapa Valores predeterminados de Documento del Diálogo Preferencias. el texto para el que no se ha especificado una tipografía. La ventana de Vista Previa. usa la tipografía definida en el applet Opciones de Internet del Panel de control de Windows. 46 Capítulo 3 El Entorno de Edición . A menudo estas no coinciden. por otro lado.

5 4. En este capítulo 4. Namo WebEditor hace que su creación y revisión sea lo más fácil posible.2 4.8 4.4 4.6 4.10 Creando nuevos documentos Agregando y editando texto Formato básico de texto Agregando y dando formato a imágenes Creando una galería de imágenes Aplicando efectos a una imagen Creando hipervínculos Creando botones y titulares Creando y editando tablas Modificando las propiedades de un documento 47 .9 4.7 4.1 4. En este capítulo.Capítulo 4 Edición Básica de un Documento Ya sea que esté personalizando los documentos generados por el Asistente de Sitios Web o creando nuevos.3 4. aprenderá todo lo necesario para crear documentos de Web básicos.

4.1: Creando un proyecto 48 Capítulo 4 Edición Básica de un Documento .3 Agregando un documento a un proyecto Si está trabajando en un proyecto (tal como uno creado con el Asistente de Sitios Web).1 Creando nuevos documentos 4. En el diálogo Nuevo. 4. haga clic sobre el botón Nuevo de la barra de herramientas estándar. 8. El nuevo documento será colocado en la carpeta en uso.1.1. la plantilla de documento único se forma de tablas invisibles para propósitos de despliegue y tiene texto de muestra (y algunas veces imágenes. use el comando Archivo > Nuevo. 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 vacío agregándolo de forma automática al proyecto. Tal como los documentos generados por el Asistente de Sitios Web. Alternativamente. use el comando Archivo > Nuevo y seleccione Documento en blanco dentro del diálogo Nuevo.2 Creando un documento usando una plantilla Para crear un documento usando una plantilla de documento único.1. 4.) Debe de reemplazar estos textos e imágenes con las propias. o presione las teclas <Ctrl + N>.1 Creando un documento vacío Para crear un documento en blanco. seleccione uno de los tipos de documentos listados en la solapa Documentos.

selecciónelo y presione la tecla <Borrar atrás> o <Delete> (no importa cual). Para seleccionar un bloque de texto usando únicamente el ratón.4. Haga clic en el botón del ratón al principio del bloque (y suelte el botón). mueva el apuntador del ratón al final del bloque. 4. seleccione Deshacer del menú Editar o haga clic sobre el botón Deshacer en la barra estándar de herramientas. La forma más rápida de seleccionar un bloque de texto es utilizando el ratón y el teclado juntos. Para seleccionar un bloque de texto utilizando solamente el ratón. El texto aparecerá en el punto de inserción (la barra vertical que parpadea). Agregando y editando texto 49 . Deténgase cuando haya llegado al último carácter del bloque. arrástrelo al final del bloque y suelte el botón. editar y dar formato al texto son las mismas.2 Borrando texto Para borrar un sólo carácter de texto.2 Agregando y editando texto Usar la ventana de Edición de Namo WebEditor es muy similar a usar un procesador de palabras.1 Introduciendo y seleccionando texto Para introducir nuevo texto en la ventana de Edición. presione la tecla <Mayús> y vuelva a presionar el botón del ratón. mantenga presionado el botón del ratón. Para borrar un bloque de texto. presione la tecla <Borrar atrás> o <Delete> en el teclado dependiendo si quiere borrar caracteres a la izquierda o derecha del punto de inserción. coloque el punto de inserción frente al primer carácter del bloque y presione cualquiera de las teclas de dirección del teclado mientras mantiene presionada la tecla <Mayús>. También puede presionar la combinación de teclas <Ctrl + Z> antes de hacer cualquier otra cosa. La técnica básica para introducir.2. Puede seleccionar texto usando el ratón o el teclado así como una combinación de ambos. Si presiona la tecla de flecha izquierda o derecha mientras mantiene presionada la combinación de teclas <Mayús + Ctrl> se extenderá la selección de una palabra a la vez. haga clic al principio del bloque. La manera más fácil de seleccionar una palabra es hacer doble clic sobre ella en rápida sucesión. 4.2. Hay varias formas de seleccionar un texto para su edición. Se puede deshacer cualquier operación de la misma manera. Si decide que no quiere borrar el texto. simplemente tecléelo.

Para usar "arrastrar y soltar" para mover un bloque de texto. Si la otra aplicación utiliza HTML para dar formato 50 Capítulo 4 Edición Básica de un Documento . ésta reemplaza el contenido. Una vez que se corta o copia una selección al portapapeles. Conforme se arrastra. mantenga presionada la tecla <Mayús> mientras corta o copia. se copia en la posición del punto de inserción. presione y mantenga presionado al botón del ratón y arrástrelo a la nueva posición soltando en ese punto el botón del ratón.) Si se copia una selección de texto. Copiar y Pegar del menú de Edición. Se puede usar el comando Cortar. 4. moverlo manteniéndolo también en su posición original -. mueva el apuntador de ratón sobre el bloque de texto seleccionado. al pegar el contenido del portapapeles. se puede pegar tantas veces como se quiera.siga los mismos pasos anteriores. seleccione el texto. pero presione la tecla de control cuando suelte el botón del ratón.5 Copiando texto de otra aplicación Se puede usar tanto el portapapeles como la operación de “arrastrar y soltar” para copiar texto de una aplicación a la ventana de edición. Si a la mitad de una operación de "arrastrar y soltar" decide que no quiere realizarla. Para utilizar “arrastrar y soltar” para copiar un bloque de texto -. El portapapeles es un sitio temporal e invisible que puede contener texto y otros objetos.2. Finalmente.2.(La selección desaparece de su posición original. estará familiarizado con los conceptos tales como cortar. lo mueve de su posición actual hasta el portapapeles. es más fácil usar las combinaciones de teclas <Ctrl + X> para cortar.4.) La acción de cortar un texto. Sin embargo.4 Usando arrastrar y soltar Otra forma de mover o copiar una selección de texto (a veces más fácil) a una nueva posición es utilizando lo que se llama arrastrar y soltar. Se puede usar el portapapeles para mover texto de una posición a otra del mismo documento o a uno distinto.esto es. (Esto es mucho más sencillo que volver a escribir el texto en la nueva posición. Una vez que se ha cortado o copiado una selección. copiar y pegar texto usando el portapapeles.3 Usando el portapapeles Si alguna vez ha utilizado un procesador de palabras. si es que lo había. éste se mueve al portapapeles sin quitarlo de su posición en el documento. el punto de inserción seguirá al apuntador del ratón permitiendo saber dónde se insertará el bloque de texto cuando se suelte el botón. 4. <Ctrl + C> para copiar y <Ctrl + V> para pegar. mueva el apuntador del ratón de nuevo hacia la parte superior de la selección y suelte el botón del ratón. el texto seleccionado se quedará en su posición original. debido a que la acción de pegar no remueve el contenido del portapapeles. Si quiere agregar la selección al contenido del portapapeles en lugar de reemplazarlo.2.

Agregando y editando texto 51 .6 Buscando y reemplazando texto Use el comando Editar > Buscar para encontrar rápidamente cierta palabra o frase en el documento activo. Para reemplazar de una en una haga clic en el botón Buscar Siguiente y luego en el de Reemplazar para sustituirlo o en el de Buscar Siguiente de nuevo para ir al siguiente. seleccione la opción Buscar en vínculo. 4. 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 ratón en esa posición por un momento. Si selecciona la opción Buscar en todos los documentos abiertos al buscar o reemplazar texto. Para reemplazar cierta palabra que aparezca dentro de otra o en una frase. suelte el texto en la posición deseada. Si desea arrastrar y soltar algún texto desde otra aplicación hasta la ventana de Namo WebEditor.a la información — como lo hace un navegador — entonces el formato del texto copiado será conservado. use el comando Editar > Reemplazar. Si está buscando un vínculo o parte de él. se buscará en todos los documentos que estén abiertos en la ventana de Edición y no sólo en el activo. Escriba la palabra o frase a buscar en el recuadro Buscar y haga clic sobre el botón Buscar Siguiente. Para sustituir todos los textos encontrados a la vez haga clic sobre el botón Reemplazar Todos. Escriba el texto original en el recuadro Buscar y el de sustitución en el cuadro Reemplazar con. pero la ventana está oculta detrás de otras. Cuando aparezca la ventana de Namo WebEditor. Si se copia texto desde Microsoft Word el formato del texto se conservará tanto como sea posible.2.

tales como palabras u oraciones.1 Formato de carácter Los caracteres de formato incluyen atributos de texto tales como tipografía. Haga clic para aplicar el estilo cursivo. etc. Seleccione un color para el texto de la lista o haga clic directamente para aplicar el color previamente seleccionado. tamaño. De izquierda a derecha estos comandos son: Tipografía Tamaño del tipo Negrilla Cursiva Subrayado Color del tipo Seleccione una tipografía de la lista. explicamos los conceptos básicos del formato de texto. 52 Capítulo 4 Edición Básica de un Documento . color y estilo (negrilla.4. el formato del texto puede realizarse en Namo WebEditor usando los conceptos familiares del procesamiento de palabras. cursiva.3. a las que se puede tener acceso usando el comando Formato > Tipografía.3 Formato básico de texto Así como con la edición. Para información avanzada consulte la Sección 5. Color de fondo del texto Seleccione un color de fondo para el texto de la lista o haga clic Eliminar Formato de carácter Haga clic para eliminar todos los formatos de texto aplicados. Haga clic para aplicar el estilo subrayado. En esta sección. primero seleccione el bloque de texto al que aplicar el formato y luego use los comandos de la barra de herramientas de Formato. que se aplican a los caracteres individuales y a grupos de ellos. directamente para aplicar el color previamente seleccionado.). subrayado. La mayoría de los formatos de carácter pueden aplicarse usando el área asignada dentro de la barra de herramientas de formato. Seleccione un tamaño estándar de letra o tecléelo en puntos dentro de la lista. Haga clic para aplicar el estilo negrilla. Para aplicar un formato del carácter. 4. Existen más opciones de formato dentro del diálogo Estilo de Carácter.3: Estilos y hojas de estilo.

Tenga en cuenta. Esto puede hacerse usando los atributos CSS. monoespacio. sin embargo. además de lo ya disponible dentro de la barra de herramientas de Formato. pero ningún tamaño corresponde a uno absoluto en particular. superíndice y subíndice En la solapa Estilos Extendidos. Una nota sobre los tamaños del texto El menú de Tamaño de Tipografía en la barra de herramientas de Formato y el menú Tamaño en el diálogo Estilo de Carácter le permiten especificar el tamaño del texto de dos maneras: Como un texto Web estándar. existen varios estilos extras de texto disponibles. 3. estos se interpretan diferente dependiendo del navegador Web usado. Estos son interpretados de manera diferente según el tipo de navegador. lo siguiente: Una tipografía alternativa que se usará si la computadora usada para ver el documento no tiene la tipografía primaria instalada (la especificada en la barra de herramientas de Formato es la primaria) Varios estilos adicionales de texto: tachado. o en puntos. Namo WebEditor muestra el tamaño en puntos que corresponde al equivalente Web usado en Internet Explorer.En la solapa Carácter del diálogo. Por conveniencia. Además. no absoluto. Si es importante que su texto siempre aparezca del mismo tamaño con respecto a otros elementos de la página. 2. se puede especificar la cantidad de espacio para poner entre caracteres o palabras. A diferencia del tamaño especificado en puntos. etc. tal como 1. debe especificar el tamaño en píxeles.2: Hojas de estilo Formato básico de texto 53 . Desgraciadamente. en sus menús. en varios tipos de unidades. el de un texto Web estándar es relativo. que no todos los navegadores reconocen el tamaño en píxeles. se puede especificar. sin embargo. por lo que es aconsejable no usarlos. 5. como las imágenes. Probablemente estará familiarizado con las medidas en puntos que normalmente son usadas en la mayoría de los procesadores de palabras. El tamaño 2 es mayor que el 1. ninguno de estos métodos de especificar el tamaño de un texto es texto consistente en todos los navegadores ni en todas las plataformas.

4. El menú de estilo de HTML también se encuentra en esta barra de herramientas. dentro del comando Formato > Párrafo. Pueden aplicarse muchos formatos de párrafo usando los botones de la barra de herramientas de Formato. Decrementar Sangría Incrementar Sangría Haga clic para aumentar la sangría izquierda del párrafo en 40 píxeles. coloque el punto de inserción en cualquier parte dentro del párrafo a formatear — no hay necesidad de seleccionar el párrafo —y use uno de los controles de la barra de herramientas Formato. son formatos a nivel de párrafo. Lista Numerada Viñetas Haga clic para convertir el párrafo en una lista numerada. el espacio entre líneas y párrafos y otros. Haga clic para convertir el párrafo en una viñeta.3. Alineación Izquierda Haga clic para alinear el párrafo al margen izquierdo.2 Formato de párrafo Los formatos del párrafo incluyen atributos del texto que son aplicables a los párrafos. Estos atributos incluyen la alineación el sangrado. Alineación Centrada Haga clic para centrar el párrafo entre los márgenes izquierdo y derecho. Alineación Derecha Haga clic para alinear el párrafo del lado derecho. Haga clic para disminuir la sangría izquierda del párrafo en 40 píxeles. 54 Capítulo 4 Edición Básica de un Documento . Además. como Encabezado 1. Si desea aplicar el mismo formato a más de un párrafo. Puede encontrar opciones adicionales para el formato de un párrafo en el diálogo Párrafo. selecciónelos antes de usar la barra de herramientas. los estilos estándar de HTML. Para aplicar un formato de párrafo. De izquierda a derecha estos controles son: Estilo HTML Seleccione un estilo estándar HTML de la lista. no a caracteres individuales o palabras. Dirección y Viñetas.

Note que la sangría derecha es medida desde el borde derecho de la ventana. se usarán píxeles. introduzca -50 para la sangría de la primera línea. La sangría puede especificarse en una variedad de unidades. Además de usar el diálogo Párrafo.En la solapa Sangrías y Espacios del diálogo puede modificar: Alineación del párrafo (incluyendo la justificación. entre el borde de la ventana y el borde (margen) del texto. Si no especifica una unidad. Como resultado. derecha y de primera línea) Espacio entre líneas Espacio entre párrafos (antes y después) La sangría se refiere al espacio en blanco en cualquier lado de un párrafo. puede fijar también las sangrías usando los controles de la regla horizontal. no del izquierdo. Sangría de la primera línea Sangría izquierda Sangría derecha Formato básico de texto 55 . no al borde izquierdo de la ventana. Ésta se especifica con relación a la sangría izquierda del párrafo. usando la lista al lado de cada ajuste de sangría. La sangría izquierda de la primera línea de un párrafo puede fijarse de manera independiente usando la opción Sangría de la primera línea. el ancho de un párrafo variará con el ancho de la ventana de Edición o la del navegador. Por ejemplo. donde se agregan espacios adicionales entre las palabras de un párrafo para hacer que cada línea se vea de la misma longitud) sangría (izquierda. si desea una sangría en la primera línea de un párrafo de 50 píxeles menos que el resto del párrafo.

puede: Seleccionar un estilo HTML estándar en el menú Estilo (mismo que el menú Estilo de HTML en la barra de herramientas de Formato) Seleccionar una forma de viñeta o un formato del número para una lista numerada Especificar el número inicial para una lista numerada La forma de la viñeta o el formato del número que elija se aplicará a cada elemento en la misma lista. Luego seleccione la forma de la viñeta. Si no se especifica la unidad para el espacio entre líneas. se usarán los píxeles. Si no especifica la unidad para el espacio entre párrafos. 56 Capítulo 4 Edición Básica de un Documento . El espacio entre líneas se refiere a la cantidad de espacio entre la parte inferior de una línea y el de la próxima línea en un párrafo. El espacio entre párrafos se refiere a la cantidad de espacio extra entre los párrafos. Como con las sangrías. se interpretará como un múltiplo de alguna altura base que depende del tamaño del texto. se puede especificar el espacio entre líneas y párrafos usando una variedad de unidades. coloque el punto de inserción dentro del párrafo y arrastre uno de los controles de sangría (como se muestra en la imagen superior) a la posición deseada. la bala o formato del número en el diálogo Propiedades de la Viñeta o en el diálogo Propiedades de la Lista.Para fijar la sangría de un párrafo usando la regla horizontal. Si desea modificar la forma de la viñeta o el formato del número de manera independiente para un sólo elemento de la lista. En la solapa Opciones de Estilo y Lista del diálogo Párrafo. Puede escoger una combinación común dentro del menú Predeterminado o fijarlos independientemente. haga clic con el botón derecho del ratón dentro del elemento de la lista y seleccione Propiedades del elemento de la lista en el menú de atajo.

haga lo siguiente: 1 Coloque el punto de inserción dentro del bloque de texto que contiene el formato a copiar (no seleccione el bloque. coloque el punto de inserción dentro del bloque) y use el comando Editar > Pegar Formato o presione la tecla <F2>. tanto a nivel carácter como párrafo. no sólo el estilo HTML. pueden llevarse de un bloque de texto a otro “copiándolos” y “pegándolos”. Para copiar formatos de un bloque del texto a otro. 3 En el diálogo Copiar Formato.3 Copiando y pegando formatos Los atributos de formato. (Los Estilos de Párrafo se refieren a los atributos de los párrafos.) 4 Seleccione el bloque de texto a donde se desea “pegar” el formato copiado (o. Formato básico de texto 57 . si está pegando sólo formatos de párrafo.) 2 Seleccione el comando Editar > Copiar Formato o presione las teclas <Mayús + F2>.4. seleccione los distintos atributos a copiar y presione sobre el botón Aceptar.3.

4. 3 En el diálogo Clip Art. haga lo siguiente: 1 Coloque el punto de inserción donde quiere insertar la imagen. haga clic en el botón Examinar. 5 Haga clic sobre el botón Aceptar para cerrar el diálogo Propiedades de la Imagen. La imagen se insertará en la posición del apuntador del ratón en el momento en que soltó el botón del mismo. seleccione la categoría y subcategoría en la lista de la izquierda. Namo WebEditor hace del usar y añadir imágenes en sus documentos una tarea muy fácil. tales como iconos. JPEG o PNG. 3 En el diálogo Propiedades de la Imagen. Hay varias maneras de agregar una imagen a un documento Web. 2 Seleccione el comando Insertar > Imagen > Desde Archivo o haga clic en el botón Insertar Imagen desde Archivo en la barra de herramientas estándar. que contiene más de 9. botones e imágenes de fondo. La imagen se insertará en el punto de inserción usando la alineación predeterminada (la parte baja de la imagen se alineará con la parte inferior del texto en la misma línea. haga lo siguiente: 1 Coloque el punto de inserción donde quiere insertar la imagen.4. Haga clic en el botón Abrir. puede arrastrar un icono de archivo de imagen del escritorio de Windows o del Explorador de Windows a la ventana de Edición. aparece un menú de atajo del que se selecciona Insertar Archivo o Imagen. 4 Localice y seleccione la imagen en el diálogo Abrir. 2 Seleccione el comando Insertar > Imagen > Clip Art o haga clic en el botón Insertar Clip Art de la barra de herramientas estándar. 4.000 imágenes en una gran variedad de categorías. Afortunadamente.1 Agregando una imagen del disco duro Para agregar una imagen almacenada en su disco duro u otro disco de la red local.2 Agregando una imagen de la librería de imágenes Namo WebEditor 4 viene con una biblioteca de imágenes extensa. 5 Haga clic en el botón Insertar o doble clic en la imagen seleccionada. Se pueden insertar imágenes del tipo GIF. Para insertar una imagen Clip Art. 58 Capítulo 4 Edición Básica de un Documento .4. seleccione la imagen dentro de la subcategoría. Cuando suelte el botón del ratón. 4. 4 En la lista de la derecha.4 Agregando y dando formato a imágenes Las imágenes son una parte importante de la mayoría de los sitios Web.) Alternativamente. viñetas.

podrá realizar una copia de las imágenes en Namo WebEditor. verá un mensaje de error y un icono de “imagen desconocida” en ventana de Edición. documentos Microsoft Word. Haga clic sobre el botón Aceptar para cerrar el diálogo Propiedades de la Imagen. En el diálogo Propiedades de la Imagen.) siempre y cuando la aplicación que se use para ver el documento permita el copiado de imágenes al portapapeles y / o arrastrarlas fuera de la ventana de aplicación. se puede insertar en su documento proporcionando su URL en el diálogo Propiedades de la Imagen.4 Copiando una imagen de otro documento Una de las maneras más convenientes de obtener imágenes para sus documentos es copiarlas de otros. Vea la siguiente sección. Namo WebEditor intentará conectar al sitio Web donde se encuentra el archivo de la imagen y descargarla. siga los siguientes pasos: Asegúrese de estar conectado a Internet.La imagen se agregará en el punto de inserción con la alineación predefinida (la parte baja de la imagen se alineará con la parte inferior del texto en la misma línea. Agregando y dando formato a imágenes 59 . etc.4.) 4.3 Agregando una imagen de la Web Si conoce la dirección URL (Internet address) de un archivo de imagen en la Web. Para hacer esto. La técnica básica usando el portapapeles para copiar una imagen de otro documento en el propio es la siguiente: 1 Seleccione la imagen en el otro documento.4. Coloque el punto de inserción donde quiere insertar la imagen. 2 Copie la imagen al portapapeles (presione <Ctrl + C> o haga clic con el botón derecho del ratón sobre la imagen y seleccione Copiar del menú de atajo. se interpretará como una ruta de acceso relativa. Si no se puede recibir la imagen. 4. Puede copiar imágenes de casi cualquier tipo de documento que las contenga (documentos Web. la imagen aparecerá en el punto de inserción en la ventana de Edición.) 3 Coloque el punto de inserción donde desea insertar la imagen en su documento Web. Si tiene éxito. 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. proporcione la URL del archivo de imagen en el recuadro Ruta de la Imagen. Asegúrese de incluir “http://” al principio de la dirección URL — de otra forma. Seleccione el comando Insertar > Imagen > Desde archivo o haga clic en el botón Insertar Imagen desde Archivo en la barra de herramientas estándar.

el diálogo Copiar Archivos de Recursos aparece.5 Guardando un documento con imágenes Cuando guarda un documento por primera vez. la imagen aparecerá en el punto de inserción dentro de la ventana Edición. no puede seleccionar la imagen. una vez que se ha agregado por lo menos una imagen. Al hacer esto. Namo WebEditor intentará conectar al sitio Web que guarda el archivo para descargarlo. En la mayoría de los casos. Si es necesario. puede también usar “arrastrar y soltar” para copiar una imagen de otro documento a la ventana de Edición. Si tiene éxito. pues los archivos de imágenes se localizarán convenientemente en la misma carpeta que el documento. verá un mensaje de error y un icono de “imagen desconocida” en la ventana de Edición.) Tenga presente que si está copiando una imagen de un navegador Web. puede elegir otro directorio (tal como un subdirectorio “images”) haciendo clic sobre el botón Seleccionar Carpeta. si la aplicación usada para ver el documento permite arrastrar las imágenes fuera de su ventana. Si no es posible recuperar la imagen. Además de usar el portapapeles. preguntando si se copian los archivos de imagen a la misma carpeta del documento. facilita la publicación de sus documentos a su sitio Web. soltando el botón del ratón cuando se encuentre en la posición deseada. 60 Capítulo 4 Edición Básica de un Documento . Para copiarla.4. puede especificar una carpeta diferente para cada archivo de imagen al seleccionarlo y hacer clic en el botón Seleccionar Carpeta. Cuando pegue una imagen de un navegador Web en la ventana de Edición. presione el botón derecho del ratón sobre la imagen y seleccione Copiar o Copiar Imagen del menú de atajo. debe permitir a Namo WebEditor copiar los archivos de imagen. 4. Si no quiere que las imágenes se archiven en la misma carpeta que el documento. Simplemente haga clic sobre la imagen y arrástrela al documento en la ventana de Edición.4 Pegue la imagen (presione < Ctrl + V >.

2 En el diálogo Propiedades de la Imagen. Para abrir el diálogo Propiedades de la Imagen. 4.En general. Si usa una de las manijas de la esquina. cambie a la solapa Estilo. puede impedir a Namo WebEditor copiar los archivos quitando la marca de la casilla de verificación de la columna Guardar del diálogo Copiar Archivos de Recursos. Si necesita especificar el tamaño de la imagen con exactitud.6 Cambiando el tamaño de una imagen Para redimensionar una imagen. primero selecciónela haciendo clic sobre ella una vez. Manijas de tamaño Para cambiar el tamaño de la imagen. siga los siguientes pasos: 1 Haga doble clic sobre la imagen. en lugar de mantener la imagen en su propio sitio.4.7 Ajustando la disposición de una imagen En la solapa Estilo del diálogo Propiedades de la Imagen. Las opciones de alineación son las siguientes: Agregando y dando formato a imágenes 61 . buena idea el evitar aumentar el tamaño de esas imágenes siempre que sea posible. haga clic y arrastre cualquiera de sus manijas hacia dentro o hacia fuera del centro de la imagen. Puede especificar las unidades como píxeles o un por ciento del ancho de la ventana. Es.4. las proporciones se mantendrán al cambiar el tamaño. una en cada esquina y otra al centro de cada lado. Tenga en cuenta que las imágenes de mapas de bits  el tipo más común usado en la Web  se “deforman” conforme su tamaño aumenta. Aparecerá un contorno con ocho manijas de control alrededor de la imagen. En tales casos. cambiar su tamaño o aplicar un margen o borde a la imagen. 4 Haga clic sobre el botón Aceptar para cerrar el diálogo. por lo tanto. el único tipo de situación 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 vínculo a la imagen en su sitio original. 3 Proporcione el nuevo ancho y alto de la imagen dentro de Tamaño. 4. puede cambiar la alineación de la imagen con respecto al texto dentro del mismo párrafo. haga doble clic sobre la imagen.

(Vea Inferior. 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 línea. Coloca la imagen en el lado izquierdo del párrafo que la contiene. una imagen no es rectangular y le gustaría que el área alrededor de la imagen coincidiera exactamente con el color de fondo del documento. carácter más alto de la misma línea. La misma cantidad de espacio se insertará en ambos lados de la imagen (Arriba y abajo o izquierda y derecha. aplicar un borde negro sólido a la imagen al proporcionar un ancho del borde en píxeles. La mayoría de los navegadores usan alineación inferior en este caso. Parte Inferior Absoluta Los controles en Tamaño son útiles cuando se requiere especificar el tamaño exacto de la imagen. Esto es útil cuando. Alinea la parte inferior de la imagen con la línea base del texto de la misma línea. en píxeles. Se alinea la parte inferior de la imagen con la parte inferior del carácter más bajo de la misma línea. 62 Capítulo 4 Edición Básica de un Documento . se puede fijar un margen horizontal o vertical para la imagen.Predeterminada Arriba Centrado Línea Base Inferior Izquierda Derecha Deja la alineación sin especificar. por ejemplo.) Alinea la parte superior de la imagen con el texto superior de la misma línea.) Se puede. El texto del párrafo fluye a la derecha de la imagen.8 Fijando el color transparente de una imagen Un color en cualquier imagen puede hacerse transparente. Bajo Márgenes y bordes. más adelante. 4.4. Alinea el centro de la imagen con la línea base del texto de la misma línea. lo mismo que la alineación superior. ya sea en píxeles o como un por ciento del ancho de la ventana. El texto del párrafo fluye a la izquierda de la imagen. Alinea la parte inferior de la imagen con el texto inferior de esa misma línea. Haga clic en el botón Restaurar Tamaño para regresar al tamaño original de la imagen. Coloca la imagen del lado derecho del párrafo que la contiene. también. Esto es usualmente. pero no siempre.

deje la ruta de acceso dentro del recuadro Posición sin cambiar. 3 Mueva el apuntador del ratón dentro del área de la imagen. 2 Seleccione el comando Insertar > Imagen > Fijar el Color Transparente.) Haga clic sobre el botón Aceptar.con transparencia sin transparencia Para fijar el color transparente de una imagen. haga lo siguiente: 1 Seleccione la imagen. Especifique el directorio y nombre de archivo para guardar una copia de la imagen con el color transparente. (Si desea sobrescribir la imagen original. Agregando y dando formato a imágenes 63 . El apuntador del ratón cambiará a un gotero. La barra de herramientas de imágenes aparecerá (si aún no está visible) y el botón Seleccionar Color Transparente quedará habilitado. Haga clic en la parte de la imagen donde se encuentre el color que desea hacer transparente. 4 El diálogo Guardar Imagen con Color Transparente debe aparecer.

) Si desea también agregar las imágenes de las subcarpetas de la carpeta seleccionada. coloque el punto de inserción en el sitio del documento donde desea insertar las miniaturas y use el comando Insertar > Imagen > Galería de Imágenes. use el Asistente de Imágenes para crear una galería de imágenes desde la carpeta donde las almacena.5 Creando una galería de imágenes Si tiene un gran número de imágenes — tales como fotografías de sus vacaciones — que quisiera compartir con los visitantes de su sitio Web. 4. en lugar de insertar cada imagen manualmente.) Si desea agregar las imágenes a una carpeta. se seleccionan las imágenes a incluir en la galería (ya sea como miniaturas o completas. El asistente consta de cuatro pasos descritos a continuación.1 Paso 1: Seleccionar las imágenes En el primer paso del Asistente de Imágenes. el asistente sólo reconocerá y agregará las imágenes (formato GIF. El Asistente de Imágenes puede generar una galería de miniaturas de forma automática. sobre el botón Agregar a Carpeta localice y seleccione la carpeta que contiene las imágenes. Para agregar las imágenes de carpetas 64 Capítulo 4 Edición Básica de un Documento . No se preocupe si el directorio contiene otros archivos.5. Si cuenta con un número relativamente pequeño de imágenes que le gustaría desplegar en una sola página.4. Para iniciar el Asistente de Imágenes. Si un visitante quiere obtener la imagen completa. es buena idea crear un juego de miniaturas (una tabla de pequeñas imágenes) con vínculos a las imágenes de tamaño completo. sólo tiene que hacer clic en su miniatura. utilice la opción Incluir subcarpetas antes de comenzar. Las miniaturas permiten a sus visitantes obtener una idea de cómo se ven sus imágenes sin tener que descargarlas completamente. JPEG o PNG.

4. Si es necesario. Mantenga presionada la tecla <Mayús> o <Ctrl> para seleccionar imágenes múltiples a eliminar de la lista. si selecciona la opción Restringir proporciones. Para seleccionar archivos múltiples.adicionales. debe escoger también método para seleccionar tamaño del menú. Una vez que termine de seleccionar las imágenes. Sin embargo. mantenga presionada la tecla de <Mayús> o <Ctrl> mientras hace clic en el nombre de cada archivo. haga clic sobre el botón Agregar Archivo. Hay tres maneras de especificar el tamaño exacto: Especificar ancho y alto Se puede especificar tanto el ancho como el alto de las miniaturas.2 Paso 2: Especificar el tamaño de la imagen En este paso. las proporciones de la imagen se ajustan para dar cauce a las del tamaño especificado. Para hacer que una imagen aparezca en su tamaño completo en la galería. haga clic de nuevo sobre el botón Agregar Carpeta y seleccione otro directorio. Localice y seleccione las imágenes a incluir. selecciónela y presione sobre el botón Remover de la Lista. sólo se usa la dimensión menor y las otras se ajustan para mantener las proporciones originales de la imagen. Si selecciona Especificar tamaño exacto. repitiendo tantas veces como sea necesario. Para quitar una imagen de la lista de imágenes. haga clic sobre el botón Siguiente. Creando una galería de imágenes 65 . use la opción Especificar tamaño exacto o Especificar por ciento del tamaño original.5. Para crear miniaturas. se especifica el tamaño de las imágenes tal como aparecerán en la galería. Si sólo quiere agregar una o algunas imágenes del directorio. seleccione el botón Usar tamaño original.

Haga clic en el botón Siguiente para continuar con el siguiente paso del asistente. Si quiere que cada miniatura tenga un efecto de borde realzado que lo haga destacar del fondo del documento. La leyenda puede consistir en el nombre del archivo o en el nombre del archivo y su extensión (tal como . Existen tres opciones: 66 Capítulo 4 Edición Básica de un Documento . En este paso también se especifican cómo los vínculos de las miniaturas deben ser manejados por el navegador Web. sólo se introduce el por ciento. puede también solicitar al asistente que coloque una leyenda debajo de cada imagen. Se especifica solamente el alto de las miniaturas.Especificar ancho Se especifica solamente el ancho de las miniaturas. use la opción Usar tabla y seleccione el número de columnas de la misma. seleccione la opción Gofrar bordes. Especificar alto Si se selecciona Especificar un porcentaje del tamaño original. El ancho se ajusta de manera automática para mantener la proporción original de la imagen.) Si selecciona Usar tabla. (El número de renglones se determina por la cantidad de imágenes que se encuentran en la galería. Haga su selección dentro de la lista Leyendas. El alto se ajusta de manera automática para mantener las proporciones originales de la imagen.gif o jpg). Para usar una tabla. Las leyendas no se encuentran disponibles si no se selecciona la opción Usar tabla.5. Las miniaturas serán reducidas (o agrandadas) a ese por ciento del tamaño original. 4.3 Paso 3: Especificar la distribución y opciones de vínculos En este paso se selecciona la opción de colocar las imágenes en una tabla o dentro del mismo párrafo que contiene el punto de inserción.

estas opciones de vínculos no quedarán disponibles puesto que las imágenes completas se desplegarán dentro de la galería. la imagen completa se abre en la ventana del navegador cuyo nombre se especifica.5. Si se crea la galería de imágenes en un documento que es parte de un conjunto de marcos y se requiere que las imágenes de tamaño completo aparezcan en otro marco. se especifica dónde guardar las miniaturas que el asistente crea. Haga clic en el botón Siguiente para continuar con el último paso del asistente.4 Paso 4: Especificar dónde guardar las imágenes En el último paso del asistente de imágenes. Abrir cada imagen en una nueva ventana Cuando un visitante del sitio hace clic en una miniatura. Cuando hace clic sobre otra. si se salvan. etc. la imagen completa se abre en una nueva ventana del navegador. dónde guardar las copias de las imágenes originales y también si la galería contiene imágenes de tamaño completo o no. 5. la imagen completa se despliega en la misma ventana del navegador. “image_view”. Abrir cada imagen en una ventana: Cuando un visitante del sitio hace clic en una miniatura. 4. entonces proporcione el nombre del marco destino. En la mayoría de los casos se puede aceptar la ventana predeterminada.Abrir cada imagen en la ventana activa Cuando un visitante del sitio hace clic en una miniatura. Creando una galería de imágenes 67 . El visitante puede utilizar el botón Atrás del navegador para regresar a la galería de imágenes. una nueva ventana se abre. reemplazando el documento activo.4: Marcos y conjuntos de marcos Si seleccionó la opción Usar tamaño original en el paso previo del asistente.

los vínculos que el Asistente de Imágenes asigna en las miniaturas no estarán relacionados con las imágenes originales. no se debe seleccionar esta opción a menos que los archivos de las imágenes originales se encuentren en una carpeta (o carpetas) que se vaya a publicar al sitio web. una en cada celda. Las miniaturas tendrán el mismo nombre que las originales. en el sitio Web para que los visitantes puedan verlas. se creará una tabla común con código HTML que contiene las imágenes. Crear archivos de miniaturas en el directorio que contiene las imágenes originales Seleccione esta opción si está creando una galería de miniaturas y desea guardar los archivos en la misma carpeta (o carpetas) que las imágenes originales. Esta opción no está disponible cuando se crea una galería de miniaturas puesto que éstas deben almacenarse en algún sitio. Los archivos de las miniaturas tendrán el mismo nombre que las originales. Guardar copias o miniaturas en el directorio especificado: Los archivos de las miniaturas y las copias exactas de las imágenes originales se guardarán en la carpeta que se especifique. En su lugar se vincularán a las copias de tamaño completo de los archivos originales que están almacenadas en la misma carpeta que las miniaturas. pero con las letras “_tm” agregadas justo antes de la extensión. Una vez que haya realizado su elección.Existen tres opciones: Usar archivos de imágenes originales (no hacer copias) Seleccione esta opción si escogió Usar tamaño original en el segundo paso del asistente y no quiere realizar copias de los originales. Si seleccionó Usar tabla en el tercer paso del asistente. La galería de imágenes será creada e insertada dentro del documento. para que las copias también sean transmitidas. Cuando publique el documento que contiene la galería de miniaturas. Se puede cambiar el formato y tamaño de esta tabla como se haría con cualquier otra. haga clic sobre el botón Finalizar.9: Creando y editando tablas 68 Capítulo 4 Edición Básica de un Documento . asegúrese de publicar la carpeta completa que contiene las miniaturas. Esto se debe a que los vínculos de las miniaturas estarán relacionados con los archivos originales que deben encontrarse. por lo tanto. Si selecciona esta opción. 4. En general. pero con las letras “_tm” agregadas justo antes de la extensión. Haga clic en el botón Examinar para localizar y seleccionar un directorio.

En el último paso del Asistente Imágenes. si la galería contiene miniaturas. los visitantes no podrán visitarlas cuando hagan clic sobre el vínculo que hay en las miniaturas dentro de la galería. La forma más sencilla de asegurarse que tanto las imágenes completas como las miniaturas serán publicadas en forma adecuada es almacenarlas en el directorio indicado. Sin embargo. seleccione la misma carpeta para copiar las miniaturas y luego haga clic sobre el botón Aceptar cuando se le pregunte si se requieren sobrescribir los archivos existentes. el diálogo Copiar Archivos de Recursos sólo preguntará si se copian las miniaturas y no las imágenes completas a las que las miniaturas se vinculan.5. cuando se guarda el documento y aparece el diálogo Copiar Archivos de Recursos. debe asegurarse de transmitir tanto las imágenes completas como las miniaturas. preguntando si se copian los archivos de imagen a la misma carpeta que contiene el documento — tal como cuando se agregan imágenes a un documento de cualquier otra forma. el diálogo Copiar Archivos de Recursos aparecerá. Si no se publican las imágenes completas. Una vez realizado esto. Cuando se publica un documento que contiene una galería de miniaturas.4. Creando una galería de imágenes 69 .5 Publicar un documento que contiene una galería de imágenes La primera vez que se guarda un documento que contiene una galería de imágenes. se recomienda que se seleccione la opción Guardar copias o miniaturas en el directorio especificado y proporcionar el directorio que contiene el documento donde se encuentra la galería de imágenes o un subdirectorio del mismo.

Especifique un nuevo nombre o localización si no quiere sobrescribir la original.6. Sencillamente deslice los controles o teclee un por ciento exacto dentro de los recuadros.1 Ajustando el brillo y el contraste La solapa Brillo / contraste del diálogo Efectos de Imagen permite ajustar el brillo y contraste de cualquier imagen. Una vez que se ha terminado de modificar la imagen y sea haga clic sobre el botón Aceptar para cerrar el diálogo Efectos de Imagen. 70 Capítulo 4 Edición Básica de un Documento . Esto abrirá el diálogo Efectos de Imagen. se le preguntará si desea guardar la imagen modificada.6 Aplicando efectos a una imagen Namo WebEditor 4 incluye un conjunto de herramientas de manipulación de imágenes que pueden ser usadas para aplicar efectos de uso común dentro de los documentos Web. 4.4. Los efectos disponibles son: Ajuste de brillo y contraste Rotar y girar una imagen Varios filtros populares de imágenes 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 botón derecho del ratón sobre la imagen y seleccionando Imagen > Efectos de Imagen en el menú de atajo.

pero Gofrar bordes y Gofrar (bajorrelieve) son mutuamente excluyentes. tal como lo son Escala de Grises y Blanco y negro. se puede rotar la imagen en múltiplos de 90 grados y / o voltear la imagen.6. La mayoría de estos filtros pueden ser combinados.6.4. vuelva a hacer clic sobre el botón una vez más.2 Girando o volteando una imagen Usando los botones de la solapa Rotar Imagen. Para deshacer cualquiera de estas acciones.3 Aplicando un filtro a la imagen Usando las opciones dentro de la solapa Efectos. ya sea horizontal o verticalmente. 4. es posible aplicar varios filtros de efectos especiales a la imagen. Aplicando efectos a una imagen 71 .

Hay disponibles cuatro tipos de gradientes: Lineal Radial La intensidad del color varía linealmente en una dirección a lo largo de un eje único desde un punto de inicio hasta su final.4. La localización del punto final determina el ángulo inicial del gradiente. La localización del punto final determina el radio máximo del gradiente. (En el caso de un 72 Capítulo 4 Edición Básica de un Documento . rango y dirección. La intensidad del color varía de forma radial desde un punto de inicio en el perímetro de la imagen. 2 Seleccione un color dentro de la lista Color. indicando la longitud y dirección del gradiente.4 Aplicando un gradiente de color La solapa Gradiente permite aplicar un gradiente de color a una imagen. la intensidad de un color específico varía de cero a un máximo especificado a través de la imagen dentro de un estilo. 3 Especifique la intensidad máxima del gradiente de color y su dirección general utilizando el control de Intensidad. haga lo siguiente: 1 Seleccione el estilo del gradiente usando los botones que se encuentran en la solapa Estilo.6. Cónico Cilíndrico Para aplicar un gradiente. En el gradiente de color.) 4 Fije los puntos iniciales y finales del gradiente al hacer clic en la localización deseada dentro de la vista preliminar de la imagen y arrastrando el ratón hasta el punto final. Al arrastrar. La intensidad del color varía con la posición angular de un círculo centrado en el punto de inicio. (Arrastre el control a la izquierda para invertir la dirección del gradiente. La intensidad del color varía exponencialmente en ambas direcciones a lo largo de un eje único desde el punto de inicio al del final. una línea aparecerá desde el punto de inicio hasta la posición actual del apuntador del ratón.

Para una sombra muy definida. haciendo que parezca que flota sobre el fondo del documento. 2 Especifique el desplazamiento de la sombra — distancia. haga lo siguiente: 1 Seleccione la posición de la sombra utilizando los botones de Posición. 4.6. Se debe fijar el color de fondo al mismo que el del documento. haga clic nuevamente sobre el botón correspondiente al gradiente utilizado en la solapa Etilo. haga clic de nuevo sobre el botón correspondiente a la posición seleccionada de la sombra dentro de la solapa Posición. Para eliminar la sombra.5 Agregando una sombra La solapa Sombra permite agregar una sombra a la imagen. desde el borde de la imagen a la cual la sombra se extenderá — en el recuadro Desplazamiento. 5 Especifique el color de fondo del documento utilizando la lista Color de Fondo. un círculo aparecerá al arrastrar el ratón indicando el radio del gradiente. 4 Especifique el color utilizando la lista Color de la sombra. en píxeles — en el recuadro Radio de desenfoque. Aplicando efectos a una imagen 73 . en píxeles. 3 Especifique el radio de desenfoque — el grado de “color” en la sombra.) Para eliminar el efecto de gradiente.gradiente radial. Para aplicar una sombra. fije el radio a 0. Esto determina el color de las esquinas de la imagen modificada donde no están cubiertas por la sombra.

74 Capítulo 4 Edición Básica de un Documento .6. 2 Especifique la tipografía.6 Agregando texto a la imagen En la solapa Agregar Texto. seleccione una localización predefinida utilizando la lista bajo la sección Posición o teclee las coordenadas (desplazamiento desde la esquina superior izquierda de la imagen) en el recuadro Coordenadas en la sección Posición. Para agregar texto. es posible escribir una línea de texto sobre la imagen. tales como fotografías.4. Para remover el texto. Si no quiere sobrescribir la imagen original. tamaño y color del texto en la sección General. el diálogo Nombre de archivo aparecerá solicitándole un nombre y localización para guardar la imagen modificada. 3 Seleccione el estilo del texto (negrilla. Este formato de 24 bits se usa para imágenes con muchos colores. 4. cursiva y /o subrayado) en la sección Estilos.6. haga lo siguiente: 1 Teclee el texto que se colocará sobre la imagen en el recuadro Texto. elimine el contenido del recuadro Texto. tales como ilustraciones y dibujos de línea. Las elecciones disponibles son: GIF JPG Este formato de 256 colores es muy utilizado para aquellas imágenes que tienen relativamente pocos colores.7 Guardando la imagen modificada Cuando se hace clic sobre el botón Aceptar para cerrar el diálogo Efectos de Imagen. cambie el nombre o directorio en el recuadro Ruta. Necesitará seleccionar también un formato de archivo para la imagen modificada. 4 Haga clic en el texto y arrástrelo a la posición deseada dentro de la ventana de Vista Previa.

Sin embargo. pero puede incluir millones de colores. no todos los navegadores incluyen el formato PNG. Aplicando efectos a una imagen 75 . como el formato GIF.PNG Este formato se usa para una compresión sin pérdida.

4. cuando se hace clic en un enlace de correo electrónico.7 Creando hipervínculos Los Hipervínculos. Podemos decir. hace clic en él y el navegador despliega otra página. Esto es. El poder de los vínculos radica en su habilidad para conectar millones de páginas web. Un vínculo es un elemento de página (usualmente una palabra. Lo que sucede una vez que se presiona en el vínculo depende de a dónde apunta el enlace. también conocida como dirección Internet. sin temor a equivocarnos.7. lo hará. la persona que está viendo un vínculo dentro de una página en el navegador web.namo. Un ejemplo de un vínculo absoluto sería “http://www. Por ejemplo. La página a la cual un vínculo apunta puede estar dentro del mismo sitio web o en cualquier otro sitio del mundo. una con la otra para que queden disponibles a millones de personas que utilizan Internet. es similar a una tarjeta de visita que identifica de forma unívoca un documento 76 Capítulo 4 Edición Básica de un Documento . entre otras cosas. Namo WebEditor se conectará al sitio Web que contiene el archivo y lo descargará. a un documento de oficina. relativos Existen dos tipos básicos de vínculos usados en los documentos: absolutos y relativos. un archivo de imagen o cualquier otro tipo de archivo que Namo WebEditor pueda abrir. a un archivo descargable. Debe usar con toda libertad los vínculos dentro de sus documentos para hacer de su sitio Web una experiencia verdaderamente interactiva para sus visitantes. Si el vínculo apunta a un archivo en la Web y se encuentra conectado a Internet. Un enlace puede apuntar a una imagen. son quizá la mayor razón del suceso fenomenal y del crecimiento exponencial de la Web en los pasados años. Estos términos se refieren a cómo el vínculo enlaza a otro documento. el navegador abre el programa cliente de correo electrónico y le solicita que abra un nuevo mensaje donde la dirección de correo electrónica está contenida en el vínculo. puede cargar el archivo referido por el vínculo en la ventana de Edición haciendo clic en él mientras presiona la tecla <Ctrl>. a un sitio FTP o a una dirección de correo electrónico. Siguiendo un vínculo en la ventana de Edición Si un vínculo en un documento abierto en la ventana de Edición enlaza a un documento Web. Una dirección URL.com/index. Si Namo WebEditor puede abrir el archivo. botón o imagen) que "apunta” a otra página Web. Los vínculos también pueden apuntar a otros elementos dentro de las páginas web. no al tipo de documento al cual hace referencia.html”. que los vínculos son el punto principal de la Web. 4. también conocidos como "vínculos" o "enlaces". a nivel mundial.1 Vínculos absolutos vs. Un vínculo absoluto hace referencia a un documento utilizando el Localizador Uniforme de Recursos (Uniform Resource Locator o URL) y constituye la forma estándar de referirse a un documento dentro de Internet.

Existe una relación de uno a uno entre la dirección URL y el documento: cada documento en Internet tiene su propia dirección URL y cada dirección URL se refiere a un sólo documento dentro de Internet. Cuando se crea un vínculo a un documento del propio sitio web. Supongamos. es posible usar tanto un vínculo absoluto como uno relativo. Creando hipervínculos 77 . usualmente “index.html” o “index. se debe utilizar un vínculo absoluto. puede requerirse solamente el nombre de la persona (“Betty Jones”) o quizá su nombre y departamento (“Publicidad/Betty Jones”.namo. que tenemos un sitio web en la dirección www.html: uno absoluto y uno relativo. Samsung-dong. no a un documento — tal como http://www.html”. puesto que incluye una referencia a una carpeta que ya no existe.html” mientras que el relativo podría ser sencillamente “webeditor.com — normalmente se refieren a un documento predeterminado dentro del sitio. Se puede cambiar la localización de un conjunto de documentos sin “romper” los vínculos relativos especificados. Este vínculo informa al navegador Web que abra un documento llamado “indice. Para entender la diferencia entre un vínculo absoluto y relativo.. Pensemos también que existe otro documento en el mismo directorio que contiene dos vínculos al documento webeditor. es asegurarse de mantener la localización relativa de los documentos cuando se publican al sitio Web. Sin embargo. Namo WebEditor realiza esto por usted.) Esto es el equivalente a un vínculo relativo.) Pero si se envía el mismo correo a una persona de la compañía a través del correo interno.namo. seguiría trabajando. un directorio al nivel superior del sitio llamado “productos” y un documento en esa carpeta con el nombre “webeditor. Namo Interactive Inc. basado en la localización con relación al documento que contiene el vínculo. Se necesita especificar el nombre y dirección completa. puesto que ofrecen un mayor grado de flexibilidad sobre los absolutos. 144-1. Simone Bldg.particular dentro de la red. (Aunque las direcciones parecen referirse a un sitio web. considere la analogía del correo. puesto que no proveen el camino completo para encontrarlo en otro dominio. los vínculos relativos son preferidos. siempre se deben utilizar vínculos relativos cuando se hacen enlaces a documentos del propio sitio. Seoul. Kangnam-gu. se refiere a un documento en una especie de taquigrafía. Los vínculos relativos solamente pueden referirse a documentos que se encuentran en el mismo sitio web. Esto es el equivalente a una dirección URL (un vínculo absoluto. por ejemplo. a diferencia. en contrapartida. Se envía una carta a alguna persona a través del sistema postal.htm”.com/products/webeditor. 135-090. ¿Qué pasaría si cambiamos el nombre de la carpeta de “productos” a “programas”? El vínculo absoluto quedaría “roto”. Todo lo que tiene que hacer ahora. Por esta razón.html”. Afortunadamente no es necesario saber cómo se crea un vínculo relativo. Cuando se realiza un enlace a un documento dentro del mismo proyecto o en cualquier parte del disco duro. tal como “Betty Jones. Un ejemplo de un vínculo relativo sería “productos/indice.com. El vínculo relativo.html” que se localiza en la carpeta “productos” dentro de la carpeta que contiene el documento activo. Cuando se crea un vínculo a un documento que se encuentra en un sitio web distinto al nuestro. Korea”.html”.) Un vínculo relativo.namo. El vínculo absoluto deberá ser “http://www.

Un directorio dos niveles arriba del que contiene el documento con el vínculo./. mailto:info@namo..com Abre un nuevo correo dirigido a esta dirección.7.html /index. Un directorio un nivel arriba del que contiene el documento con el vínculo..com/download/webeditor/install./index.namo.com Enlaza el documento predeterminado al nivel superior del sitio Web.4. Vínculos Relativos Vínculo index. 78 Capítulo 4 Edición Básica de un Documento .namo.html Un típico vínculo de Web. El nivel superior del sitio Web.html .html productos/index..html Localización del documento al que se hace referencia La misma carpeta que la del documento que contiene el vínculo.com/webeditor/install. Una subcarpeta de otra que depende de la carpeta donde está el documento que contiene el vínculo. Una subcarpeta de la carpeta donde está el documento que contiene el vínculo. haga lo siguiente: 1 Seleccione la palabra(s) o imagen que quiere usar como hipervínculo.2 Ejemplos de vínculos A continuación mostramos ejemplos de vínculos absolutos y relativos.3 Creando un vínculo Para crear un vínculo.html 4. http://www. Web http://www.namo. Vínculos Absolutos Tipo de Vínculo Ejemplos http://www. productos/webeditor/index.exe Enlaza a un archivo de programa que será descargado por FTP.html .7.namo. FTP E-mail ftp://ftp.com/products/index./index.exe Enlaza a un archivo de programa que será descargado por el navegador.

Namo WebEditor convertirá automáticamente la referencia de archivo a un vínculo relativo. edite la dirección URL o la ruta de acceso en el recuadro URL. Para verificar el vínculo que acaba de crear. Para remover un vínculo de texto. Namo WebEditor debe utilizar una referencia de archivo de forma temporal puesto que no se ha guardado el documento que contiene el vínculo y por lo tanto. Namo WebEditor no puede determinar la ruta de acceso relativa hacia el vínculo. pero el vínculo al cual hace referencia aparecerá a la izquierda de la barra de estado cuando se mueve el apuntador del ratón sobre la imagen. Una vez que se guarda el documento. Seleccione un documento o archivo en el diálogo Abrir. Para eliminar el vínculo de una imagen. coloque el punto de inserción en cualquier punto del mismo y presione la tecla <F9> o haga doble clic sobre el vínculo.2 Use el comando Insertar > Vínculo o presione la tecla <F9>. cambie a la solapa de vista previa e intente hacer clic sobre el vínculo. puede hacer clic sobre el botón Proyecto y seleccionar el documento o archivo en el diálogo Seleccionar Archivo del Proyecto.4 Editando o quitando un vínculo Para editar un vínculo de texto. En el diálogo Propiedades del Vínculo. 4. Creando hipervínculos 79 . Si desea crear un vínculo a un documento que se encuentra abierto en la ventana de Edición. puede presionar sobre el botón Archivos Abiertos y seleccionarlo en el diálogo Lista de Documentos Abiertos. Para editar un vínculo que se encuentre en una imagen. El documento al cual hace referencia deberá cargarse en la ventana. edite la dirección URL o la ruta de acceso dentro del recuadro URL. Si creó un vínculo de texto. La ruta de acceso relativa del documento seleccionado rellenará de forma automática el recuadro URL. En el diálogo Propiedades del Vínculo. la apariencia de la imagen no cambiará.7. el texto aparecerá subrayado en azul dentro de la ventana de Edición. Un ejemplo de referencia de archivo es C:\documentos\web\index. Haga clic sobre el botón Examinar para seleccionar un documento distinto. 3 En el diálogo Crear Vínculo. la forma del vínculo será una referencia a un archivo y no un vínculo relativo. seleccione la imagen y presione las teclas <Mayús + F9>. Si creó un vínculo sobre una imagen.html. Si el vínculo a crear es hacia un documento del proyecto activo (si existe). coloque el punto de inserción sobre el mismo y presione las teclas <Mayús + F9>. proporcione la dirección URL (vínculo absoluto) en el recuadro URL o haga clic sobre el botón Examinar. 4 Haga clic sobre el botón Aceptar. selecciónela y presione la tecla <F9>. Haga clic sobre el botón Examinar para seleccionar un documento distinto. Cuando se crea un vínculo en un documento nuevo que aún no se ha guardado y el vínculo apunta a un documento o archivo en su disco duro.

5 Creando vínculos múltiples en una imagen Además de poder crear un vínculo único dentro de una imagen como se describe en los párrafos anteriores. 3 Haga clic en el punto de la imagen donde se encuentre la esquina superior izquierda de la zona activa y. se pueden definir varias porciones de la misma para que actúen independientemente como un vínculo. Cada área que actúa como vínculo es llamada zona activa.4. circulares o poligonales. Las zonas activas pueden ser rectangulares. Zona activa poligonal Zona activa circular Zona activa rectangular Para crear un mapa de imagen. es también posible crear vínculos múltiples dentro de la misma imagen utilizando una técnica llamada mapa de imagen. arrastre el apuntador del ratón al punto de la esquina inferior derecha. utilice el comando Ver > Barra de herramientas > Imagen. En 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. definir una zona activa poligonal sobre la casa para que actúe como vínculo hacia otro documento. una circular en el hombre que corre como vínculo a un segundo documento y finalmente una rectangular en las palabras situadas en la parte baja de la imagen para actuar como vínculo hacia un tercer documento.7. El apuntador del ratón cambiará a una cruz. mientras mantiene el botón del ratón presionado. Para mostrar la barra de herramientas de imagen. por ejemplo. 2 Seleccione la herramienta de dibujo de zona activa rectangular. haga lo siguiente: 1 Seleccione la imagen en la cual se creará la zona activa. Al arrastrar. en la imagen inferior. Es posible. un rectángulo punteado 80 Capítulo 4 Edición Básica de un Documento . Herramientas de zona activa Para dibujar una zona activa rectangular.

Cuando se ha rodeado toda la periferia de la zona activa deseada. 4 En el diálogo Crear Vínculo. aparecerá un círculo punteado para indicarle el tamaño y posición de la zona activa. Al arrastrar. proporcione la dirección URL o ruta de acceso relativa al documento referido para la zona activa que acaba de crear. Para dibujar una zona activa poligonal. Para cambiar el tamaño de una zona activa circular. Aparecerán manijas en los vértices del polígono. el diálogo Crear Vínculo aparecerá. primero haga clic dentro de ella para seleccionarla. haga clic primero dentro de ella para seleccionarla. una línea punteada se dibujará del punto previo al actual. haga clic primero dentro de ella para seleccionarla. Aparecerán manijas en las esquinas formando una “caja envolvente”. En puntero del ratón cambiará a una cruz. Cada vez que se realiza un clic en un punto. 4 En el diálogo Crear Vínculo. arrastre el apuntador del ratón a otro punto cualquiera. Haga clic y arrastre cualquiera de ellas para mover un vértice. A continuación. Creando hipervínculos 81 . Para dibujar una zona activa circular. mientras mantiene el botón del ratón presionado. 2 Elija la herramienta de zona activa poligonal. Haga clic y arrastre cualquiera de ellas para cambiar el tamaño de la zona activa. luego en otro. proporcione la dirección URL o ruta de acceso relativa al documento referido para la zona activa que acaba de crear. 2 Elija la herramienta de zona activa circular. el diálogo Crear Vínculo aparecerá. Una vez que se suelta el botón del ratón. proporcione la dirección URL o ruta de acceso relativa al documento referido para la zona activa que acaba de crear. Para cambiar el tamaño o forma de una zona activa rectangular.aparecerá mostrándole el tamaño y posición aproximado de la zona activa. haga lo siguiente: 1 Seleccione la imagen en la cual quiere crear la zona activa. Para modificar la forma de una zona activa poligonal. Una vez que se suelta el botón del ratón. 4 En el diálogo Crear Vínculo. Para mover una zona activa. haga lo siguiente: 1 Seleccione la imagen en la cual quiere crear la zona activa. Aparecerán manijas en las esquinas de la zona activa. haga clic en otro punto. Una vez que se suelte el botón del ratón. haga clic y arrástrela a su nueva posición. 3 Haga clic en cualquier punto de la imagen y. el diálogo Crear Vínculo aparecerá. 3 Haga clic en cualquier punto de la periferia en la región donde quiere crear la zona activa poligonal y suelte el botón del ratón. etc. Haga clic sobre cualquiera de ellas y arrástrela para cambiar el tamaño o la forma de la zona activa. Mientras el apuntador tenga la forma de una mano. haga clic sobre el botón Seleccionar o Editar Zona Activa (el botón que asemeja un apuntador estándar de ratón) en la barra de herramientas de Imagen. En puntero del ratón cambiará a una cruz. Coloque el apuntador del ratón sobre la zona activa que desea mover. haga clic nuevamente sobre el punto inicial. enmarcando toda la zona poligonal.

82 Capítulo 4 Edición Básica de un Documento . sino que muestra la porción del documento donde se encuentra el mismo. use el recuadro Marcador en el diálogo Crear Vínculo o Propiedades del Vínculo. el navegador no solamente carga el documento requerido. Edite la dirección URL o la ruta de acceso dentro del diálogo Propiedades del Vínculo. Éstos solamente son visibles en la ventana de edición.7. ésta aparecerá como el nombre predeterminado. Para crear un marcador. Si seleccionó algún texto antes de crear el marcador. escriba un nombre en el recuadro Nombre. 2 Use el comando Insertar > Marcador o presione las teclas <Ctrl + G>. un pequeño símbolo amarillo de marcador aparecerá en el punto de inserción. éste aparecerá con un subrayado punteado azul. De otra forma.) 4 Haga clic en el botón Agregar y luego sobre Cerrar.Para editar un vínculo dentro de una zona activa. (Si ha seleccionado una palabra. Para referirse a un marcador dentro de un vínculo.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 vínculo. haga lo siguiente: 1 Seleccione una o más palabras o coloque el punto de inserción en la posición deseada. Para eliminar una zona activa. Los marcadores proveen una forma conveniente de permitir que el visitante salte de un punto a otro en un documento muy largo. no dentro de un navegador o en la ventana de Vista Previa. selecciónela y presione la tecla <Borrar atrás> o <Supr>. 3 En el diálogo Marcadores. haga doble clic sobre la zona activa. Cuando un visitante del sitio hace clic sobre un vínculo que contiene una referencia a un marcador. 4.

cualquier marcador que esté definido dentro de él aparecerá dentro de la lista Marcadores. teclee el nombre del marcador en el recuadro. Creando hipervínculos 83 . Cuando un vínculo de este tipo es utilizado dentro de un navegador. Puede crear un vínculo hacia un marcador dentro del mismo documento dejando en blanco el recuadro URL y seleccionando un marcador dentro de la lista Marcadores. El marcador se agregará a la dirección URL precedida de un signo de número (#). Si el documento no se encuentra en el disco duro.Si la referencia del vínculo es un documento en el disco duro. el navegado sencillamente desplaza el documento a la localización del marcador. El marcador seleccionado aparecerá en el recuadro URL precedido de un signo de número ( #).

haga clic sobre el botón Siguiente. se puede personalizar la forma y agregar una etiqueta de textos opcional. Seleccione una forma genérica para el botón o titular en el recuadro de la derecha. tal como se haría con cualquier otra imagen. se selecciona una gran variedad de formas de botones y titulares genéricos ya definidos. En el segundo paso. Esto abrirá el Asistente de Botones Inteligentes. 84 Capítulo 4 Edición Básica de un Documento . se pueden usar indistintamente tanto para botón como para titular. Aunque algunas formas están etiquetadas como “titular” y otras como “botón”. En el primero.4.1 Seleccionando una forma para el botón/titular Para usar el Asistente de Botones Inteligentes. El Asistente de Botones Inteligentes consta de dos pasos. primero coloque el punto de inserción en la posición del documento donde desea el botón o titular y luego use el comando Insertar > Componentes del Tema > Botones Inteligentes o haga clic en el botón Insertar Botón Inteligente en la barra de herramientas estándar. 4.8 Creando botones y titulares Namo WebEditor 4 incluye una herramienta de diseño de botones y titulares llamada Asistente de Botones Inteligentes. Una vez que se ha creado el botón. Se puede usar esta herramienta para crear botones coloridos basados en vectores y titulares que pueden ser cambiados de tamaño y editados sin que por eso pierdan su resolución original. Una vez seleccionada la forma. se puede colocar un vínculo dentro de él.8.

4. como también es posible cambiar el tamaño del botón o titular como un todo. Componentes de Imagen Componente de Texto Para cambiar el tamaño del botón o titular. Un rectángulo punteado aparecerá alrededor del componente seleccionado. Cada componente puede ser editado de manera independiente. Cada componente de imagen tiene dos conjuntos de propiedades: atributos de color de relleno y propiedades de la sombra. (También se puede cambiar el tamaño dentro de la ventana de Edición una vez que se ha cerrado el Asistente de Botones Inteligentes. primero selecciónelo haciendo clic sobre él en el área de vista previa o seleccionando cualquiera de sus elementos dentro de la lista de componentes. además de los dos mencionados anteriormente.) Para editar un componente. cambie a la solapa correspondiente dentro del área de edición debajo de la vista previa.2 Seleccionando un componente para editar Cada forma de un titular o botón tiene por lo menos un componente de imagen y uno de texto. Haga clic en cualquiera de las manijas y arrástrela. un conjunto de propiedades de texto. Un rectángulo punteado con manijas de tamaño en sus esquinas y lados aparecerá alrededor del botón o titular en el área de vista previa. Cada componente de texto tiene. seleccione Todos dentro de la lista de selección de componentes en la parte inferior derecha del diálogo. Creando botones y titulares 85 . Para editar un conjunto de propiedades de un componente seleccionado.8.

Lineal. verá solamente un pequeño cuadro pues el punto inicial es igual al final.3 Editando los atributos de relleno de color Los atributos del color de relleno incluyen Color inicial. Punto inicial Punto final El pequeño cuadro en la parte izquierda de la línea representa el punto inicial del gradiente. Si el componente seleccionado usa un relleno sólido. Los tipos de relleno disponibles son Sólido. Para ajustarlos haga clic sobre cualquiera de ellos y arrástrelos. Si el tipo de relleno es Sólido. elija el color haciendo clic en la vista previa de color a un lado de Color Inicial. Los otros tipos de relleno corresponden a gradientes. se debe especificar tanto un color inicial como uno final junto con un punto inicial y uno final.8. Si ha seleccionado sólido como tipo de relleno. Esto abrirá el diálogo Selección de Color. 4. ángulo y posición de la línea dentro del área de vista previa. Arrastre el cuadro a cualquier otra localización y se mostrará el que se encuentra en la parte inferior así como la línea que los une. mientras que el de la derecha representa el punto final.Para deshacer una acción del Asistente de Botones Inteligentes. Color final y Tipo de relleno. en los cuales el componente de color cambiará uniformemente desde uno inicial hasta uno final en un patrón que se puede seleccionar. Se hace esto cambiando la longitud. como se muestra en el siguiente ejemplo. Use el icono de la lupa para un acercamiento (zoom) en el área de vista previa. Si selecciona uno de los atributos de relleno de gradiente.) Haga clic en el botón Rehacer para deshacer la acción anterior. Mostramos a continuación cada uno de los tipos de gradientes: 86 Capítulo 4 Edición Básica de un Documento . haga clic sobre el botón Deshacer justo debajo del área de vista previa (arriba de la lista de selección de componentes. Circular e Hiperbólico. solamente se utilizará el color de inicio.

Use la solapa Propiedades de la Sombra para controlar sus ajustes. desplazamiento horizontal.5 Editando las propiedades del texto La solapa Propiedades del Texto se encuentra disponible solamente cuando un componente de texto ha sido seleccionado. el ángulo del punto final con respecto al punto inicial no tiene ninguna importancia. la Creando botones y titulares 87 . tanto horizontal como verticalmente. 4. Los dos recuadros a un lado del control de Desplazamiento determinan qué tanto se extiende la sombra “bajo” el componente en píxeles.8. La localización del punto de inicio determina el centro del gradiente y la distancia entre éste y el punto final determina el radio del gradiente. Una sombra tiene 4 propiedades: color.4 Editando las propiedades de las sombras Cualquier componente de un botón o titular puede tener una sombra. Para especificar el color. esto abrirá el diálogo Selección de Color.Lineal Circular Hiperbólico Tanto en los gradientes circulares como hiperbólicos. 4.8. El control de Difuminado determina el grado de enfoque de la sombra. desplazamiento vertical y difuminado. Existen cinco propiedades del texto: el texto mismo. haga clic sobre la vista previa del color a un lado de Color de la sombra.

De manera predeterminada.8. Sin embargo. etc.8. haga doble clic sobre él para abrir el Asistente de Botones Inteligentes y modificarlo. Sin embargo.10: Modificando las propiedades del documento Una vez que ha terminado de personalizar el botón o titular. si el fondo del documento es de otro color que no sea blanco. es buena idea seleccionar Hacer color de fondo transparente para hacer que el botón o titular se fusione limpiamente con el fondo del documento. o si tiene una imagen como fondo. borrar. el tamaño y si el texto se muestra en forma cursiva o en negrillas. Se puede cambiar el tamaño utilizando sus manijas. haga clic sobre el botón Finalizar para cerrar el Asistente de Botones Inteligentes e insertar el botón o titular en su documento. Para hacer que el componente del texto no se muestre. éste no pierde la resolución como lo haría una imagen ordinaria. 4. copiar.7 Modificando un botón o titular en la ventana de Edición Se puede interactuar con el botón o titular creado por el Asistente de Botones Inteligentes dentro de la ventana de edición.6 Editando las propiedades de los fondos La solapa Propiedades del fondo se aplica al botón o titular como un todo. cuando se cambia de tamaño de un botón inteligente o titular. de la misma manera que con cualquier otra imagen. En esta solapa se puede controlar el color del fondo de un botón o titular y seleccionar si éste será transparente. Para volver a editar las características de un botón o titular. Si lo desea. 4. crear un vínculo o un mapa de imagen. el color de fondo siempre es blanco. puede convertir un botón inteligente o titular en una imagen ordinaria siguiendo los pasos a continuación numerados: 1 Haga clic con el botón derecho del ratón sobre el titular o botón y seleccione Imagen > Convertir a Imagen Estándar en el menú de atajo. 4. 88 Capítulo 4 Edición Básica de un Documento . lo que funciona en todos los documentos que tienen un fondo blanco. borre el contenido del recuadro Texto. El color de fondo es el que se muestra entre el área visible de un botón o titular y los bordes de la caja que lo “envuelve”.tipografía.

Creando botones y titulares 89 .2 Haga clic en el botón Sí cuando se le pregunte si desea convertir el botón a una imagen estándar. seleccione una carpeta en la cual guardar el archivo GIF que Namo WebEditor creará. Tenga en cuenta que al convertir un botón inteligente o titular en una imagen estándar no podrá ser editado. proporcione un nombre de archivo para la imagen (o acepte el nombre predeterminado) y haga clic sobre el botón Guardar. 3 En el diálogo Guardar como.

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. en una forma similar. La más sencilla es usar el botón Crear Tabla en la barra de herramientas estándar.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. usualmente dividida en varias celdas o particiones. 90 Capítulo 4 Edición Básica de un Documento .1 Creando una tabla Hay tres formas de crear una tabla en Namo WebEditor. Haga clic en el botón Crear Tabla y mueva el apuntador del ratón sobre la tabla miniatura que aparece bajo el botón. Si se continúa moviendo el ratón más allá del área inferior o derecha. así como editarlas. 4. imágenes o cualquier otro elemento de página que un documento pueda contener. Mostramos a continuación un ejemplo sencillo de una tabla tal como se ve en la ventana de Edición.9.4. Una tabla con los valores predeterminados se colocará en el punto de inserción. la tabla se expandirá para mostrar más celdas. Cada celda puede contener texto. Al mover el ratón hacia abajo y a la derecha. Haga clic de nuevo cuando el tamaño y forma de la zona azul corresponda a la tabla que quiere crear. las celdas de la tabla pequeña se vuelven azules. Una tabla es en esencia una caja.

Dibujar Tabla en la Para dibujar una tabla. dibuje un rectángulo en el sitio aproximado donde quiere la tabla. A tales tablas se les llama tablas hijas. proporcione el número de renglones y columnas en el recuadro Tamaño. 3 Edite las otras propiedades de la tabla según sus necesidades. coloque el punto de inserción dentro de una celda de una tabla ya existente y use el botón Crear Tabla en la barra de herramientas estándar o use el comando Tabla > Nueva Tabla.2 Seleccionando partes de una tabla Para seleccionar una sola celda. haga clic sobre el botón Salir del modo de dibujo de Tablas en la barra de herramientas de tabla o presione la tecla <Esc>.Se puede también crear una tabla al “dibujarla” usando la herramienta barra de herramientas de tabla. 4 Una vez que termine de dibujar la tabla. mantenga presionado el botón del ratón y arrástrelo hacia abajo y a la derecha soltándolo posteriormente. 4. también se puede crear una tabla utilizando el comando Tabla > Nueva Tabla. dibuje los bordes de los renglones y columnas dentro de la tabla para crearlos. El apuntador del ratón cambiará de nuevo a su forma usual. (Las propiedades de las tablas se describen dentro de esta misma sección más adelante. Para hacer esto. Finalmente.9. siga las siguientes instrucciones: 1 Seleccione Nueva Tabla del menú Tabla. 2 Usando el lápiz. 2 En el diálogo Propiedades de la Tabla. 3 Usando de nuevo el lápiz. haga lo siguiente: 1 Seleccione la herramienta Dibujar Tabla. Creando una tabla hija Es posible crear una tabla que quepa completamente dentro de la celda de otra. (Haga clic en cualquier punto de la ventana de edición. El apuntador del ratón cambiará a la forma de un lápiz. haga clic dentro de ella mientras presione la tecla <Ctrl>. Creando y editando tablas 91 .) 4 Haga clic sobre el botón Aceptar. La nueva tabla será creada en el punto de inserción.) Esto genera una tabla de sólo una celda. Para crear una tabla hija.

haga clic dentro de cada una de ellas mientras mantiene presionada la tecla de <Ctrl>. Para seleccionar varias celdas que no se encuentren una al lado de la otra o en un bloque. haga clic dentro de ella mientras mantiene presionada la tecla <Ctrl>. haga clic una vez. haga clic dentro de la primera celda. El apuntador debe tomar la forma de una pequeña flecha que apunta hacia abajo. Para seleccionar un renglón completo. Alternativamente. 4. Para seleccionar una columna entera. use el comando Tabla > Insertar Renglones o Columnas. haga clic una vez. 92 Capítulo 4 Edición Básica de un Documento . Para seleccionar renglones y columnas que no se encuentran adyacentes. coloque el apuntador del ratón en el borde superior de la columna. Cuando la última de las celdas deseadas se encuentre realzada. En el diálogo Insertar Renglones o Columnas.9. El apuntador debe tomar la forma de una pequeña flecha que apunta hacia la derecha.3 Agregando y eliminando renglones y columnas Para agregar uno o más renglones o columnas a una tabla. haga clic una sola vez dentro de la primera celda y luego haga clic en la última mientras mantiene presionada la tecla <Mayús>. abajo o en diagonal. cuando esto suceda. seleccione el primer renglón o columna y luego seleccione cualquier otro mientras mantiene presionada la tecla <Ctrl>. hacer clic y arrastrar para seleccionar renglones o columnas múltiples adyacentes. coloque el apuntador del ratón en el borde izquierdo del renglón. La forma más rápida para seleccionar una tabla completa es hacer clic con el botón derecho del ratón en cualquier parte dentro de ella y seleccionar el comando Seleccionar Tabla en el menú de atajo. también. Puede.Para seleccionar varias celdas adjuntas o un bloque continuo. cuando esto suceda. Para quitar la selección a una de las ya seleccionadas. mantenga presionado el botón del ratón y arrástrelo hacia arriba. se debe especificar si se insertan columnas o renglones. cuántos se insertan y si se insertan antes o después del renglón o columna que contiene el punto de inserción. suelte el botón del ratón.

4 Presione las teclas <Ctrl + V>. seleccione los renglones o columnas a borrar y presione la tecla <Supr>. 2 Presione las teclas <Ctrl + X> para cortarlas o <Ctrl + C> para copiarlas. seleccione Insertar como tabla hija y haga clic en el botón Aceptar. siga los siguientes pasos: Creando y editando tablas 93 . Las celdas individuales o bloques de celdas que no formen un renglón o columna completa. 5 En el diálogo Pegar Tabla. Los grupos de celdas que no formen un bloque rectangular no pueden ser ni cortadas ni copiadas. 4 Presione las teclas <Ctrl + V>. 5 En el diálogo Pegar Tabla. 3 Coloque el punto de inserción en otro renglón o columna. y pegadas dentro de otra celda. Para cortar o copiar uno o más renglones o columnas y pegarlos antes o después de cualquier otra. Para borrar únicamente el contenido de las celdas seleccionadas. haga lo siguiente: 1 Seleccione los renglones o columnas. coloque el punto de inserción dentro del primer renglón o columna a borrar y utilice el comando Tabla > Borrar Renglones o Columnas. especifique si quiere insertar renglones o columnas antes o después del renglón o columna activa y haga clic en el botón Aceptar.Para borrar uno o más renglones o columnas. Es también posible copiar o cortar renglones y columnas completas y pegarlas dentro de una celda como una tabla hija. 2 Presione las teclas <Ctrl + X> para cortarlas o <Ctrl + C> para copiarlas. 4. reemplazando el contenido anterior. haga lo siguiente: 1 Seleccione el bloque de celdas. Es posible cortar o copiar un bloque de celdas y pegar solamente su contenido en otro bloque si éstos son del mismo tamaño. Alternativamente. pueden ser copiadas. use el comando Tabla > Borrar Contenido.9. pero no cortadas. Para hacer esto. especifique si se quiere borrar renglones o columnas y cuántas se van a borrar.4 Copiando y pegando partes de una tabla Se pueden cortar o copiar renglones y columnas completas y pegarlas antes o después de otro renglón o columna de la misma tabla o de una distinta. solamente puede ser copiado y no cortado.) 3 Coloque el punto de inserción en otra celda. En el diálogo Borrar Renglones o Columnas. Para cortar o copiar un bloque de celdas y pegarlas dentro de otra celda como una tabla hija. (Si el bloque no incluye por lo menos un renglón o columna completa.

Normalmente. si mantiene presionada la tecla <Ctrl>. Posteriormente arrastre el borde inferior o derecho de cualquiera de ellos. Para cambiar el tamaño de dos o más columnas o renglones adyacentes al mismo tamaño y al mismo tiempo. una línea gris aparece mostrando dónde quedará el nuevo borde del renglón o columna cuando suelte el botón del ratón. este comportamiento se invierte.1 Seleccione el bloque de celdas. Una vez que se suelta el botón del ratón. en lugar de esto. solamente puede ser copiado. Al arrastrar. Sin embargo. Cuando se cambia el tamaño de una columna de esta manera. mientras se mantienen los tamaños relativos de todos los renglones o columnas. no causa que el renglón inferior cambie de tamaño.5 Cambiando el tamaño de renglones y columnas La forma más sencilla de cambiar el tamaño de un renglón o columna de una tabla es hacer clic sobre su borde derecho o inferior y arrastrarlo utilizando el ratón. Cuando se coloca el apuntador del ratón sobre un borde. 4 Presione las teclas <Ctrl + V>. Para cambiar el tamaño de una tabla. Si quiere que la columna adyacente mantenga su tamaño.) 3 Coloque el punto de inserción en la celda superior izquierda del bloque al cual se pegará el contenido. el diálogo Pegar Tabla aparecerá. haga clic sobre el borde inferior o derecho de la tabla y arrástrelo mientras mantiene presionada la tecla <Ctrl>. Mientras el apuntador ratón tenga esta forma. éste cambia a una barra doble con pequeñas flechas: o . Cuando se cambia el tamaño de un renglón utilizando el ratón. mantenga presionada la tecla <Ctrl> al arrastrar el borde de la columna. el ancho total de la tabla no cambia. Seleccione el bloque y arrástrelo a la nueva posición utilizando el ratón. 5 En el diálogo Pegar Tabla. también se puede usar arrastrar y soltar para mover un bloque de celdas.9. se hará más ancha o más delgada para compensar. (Si el bloque no incluye por lo menos un renglón o columna completa. seleccione los renglones y columnas. Esto hará que el ancho de la tabla sea mayor o menor para acomodar la columna que cambia de tamaño. se puede arrastrar el borde. el renglón inferior cambiará su tamaño mientras la tabla mantiene su altura. la columna a la derecha de la seleccionada. En lugar de eso. el alto de la tabla se hará mayor o menor. seleccione Pegar sólo contenido y haga clic sobre el botón Aceptar. 94 Capítulo 4 Edición Básica de un Documento . 4. En lugar de usar cortar y pegar. 2 Presione las teclas <Ctrl + X> para cortarlo o <Ctrl + C> para copiarlo. el cambiar de tamaño un renglón. no cortado.

Haga clic a un lado de un borde. La forma más sencilla de dividir y combinar celdas es utilizando las herramientas Dibujar Tabla y Borrador en la barra de herramientas de tabla. seleccione la herramienta de dibujo y “trace” un nuevo borde dentro de las celdas a dividir. Creando y editando tablas 95 . Al arrastrar. descrito más adelante en esta sección. haga lo siguiente: 1 Seleccione la celda(s) a dividir. los bordes de los renglones o columnas “encajan” en las rejillas y divisiones invisibles al arrastrar los bordes. Los bordes también encajan a las guías si la opción Ajustar a las Guías está habilitada (use el comando Ver > Guías > Encajar). es posible crear una tabla que obedezca a cualquier patrón deseado. La otra forma de dividir y combinar celdas es utilizando los comandos Dividir Celdas y Combinar Celdas del menú Tabla. 4. Al dividir y yo combinar distintas celdas. mantenga presionado el botón del ratón y arrástrelo a través del borde. Para dividir una o más celdas. Para combinar dos o más celdas. tal como se muestra en el ejemplo inferior. Al dibujar. indicando dónde será colocado el nuevo borde una vez que se suelte el botón del ratón.Otra forma de cambiar el tamaño de un renglón o columna es seleccionarlo y utilizar los controles de tamaño que se encuentran dentro del diálogo Propiedades de la Celda. Si se habilita la opción ajustar a rejilla (usando el comando Ver > Rejilla > Encajar). seleccione la herramienta borrador y utilícela para “eliminar” los bordes entre las celdas.6 Dividiendo y combinando celdas No se requiere que una tabla sea un arreglo perfectamente regular de celdas. una línea punteada seguirá sus movimientos. Para dividir una o más celdas.9. el borde cambiará a un azul claro indicando que será eliminado cuando se suelte el botón del ratón.

7 Editando las propiedades de una tabla Cada tabla tiene un número de propiedades que pueden ser modificadas utilizando el diálogo Propiedades de la tabla. 3 En el diálogo Dividir Celdas. Las propiedades en cada uno de los grupos se explican a continuación. Distribución. Bordes y Fondo. Ancho/Alto El ancho y alto de la tabla en píxeles o como un porcentaje del área de la ventana del navegador. especifique si quiere dividir las celdas en renglones o columnas y cúantos renglones o columnas tendrá cada una de las celdas. o si la opción a un lado de cada elemento no se marca. Para combinar dos o más celdas.9. selecciónelas y use el comando Tabla > Combinar Celdas. Tamaño Renglones/Columnas El tamaño de la tabla en renglones y columnas. Las propiedades de una tabla están divididas en cuatro grupos: Tamaño. el ancho y /o alto de la tabla se ajusta de forma automática para desplegar la máxima área de ésta sin exceder el ancho de la ventana del navegador. Para abrir este diálogo. 4. Haga clic sobre el botón Aceptar. Distribución 96 Capítulo 4 Edición Básica de un Documento . No es posible combinar un grupo de celdas que no formen un bloque rectangular. Si no se especifica. Estos recuadros solamente se encuentran activos cuando se crea una nueva tabla utilizando el comando Tabla > Nueva Tabla.2 Use el comando Tabla > Dividir Celdas. utilice el comando Tabla > Propiedades de la tabla o haga clic con el botón derecho del ratón en cualquier parte de la tabla y seleccione el comando Propiedades de la tabla dentro del menú de atajo.

Título de la Tabla La localización del título de la tabla con relación a la misma. Si se selecciona Izquierda (Flotando) o Derecha (Flotando). tanto horizontal como verticalmente. Si se selecciona Predeterminado. mientras que Netscape Navigator usará gris claro y gris oscuro. Haga clic sobre el botón Examinar para seleccionar un archivo de imagen del disco local. la mayoría de los navegadores utilizan un valor de 1. Relleno de la celda y Espacio entre celdas. No es utilizado por Netscape Navigator. El ancho del borde de la tabla (no el de las celdas) en píxeles. Solamente está disponible si la tabla tiene un título (vea “Agregando un título a una tabla” en esta misma sección. Internet Explorer usará el color especificado en Color (vea más arriba. Si se ajusta a Predeterminado. Si no se especifica. Al seleccionar un elemento dentro de esta lista. Bordes Tipo Los elementos de esta lista son cuatro de los ajustes para bordes más comunes. Creando y editando tablas 97 . Indica el color del borde de la tabla en sus lados superior e izquierdo. Si no se especifica. Internet Explorer usará el color especificado en Borde Claro y Borde Oscuro (ver abajo). El color del borde de la tabla. Si no se especifica. se creará un mosaico hasta que la tabla se llene. la mayoría de los navegadores utilizará cero. No es utilizado por Netscape Navigator. (Predeterminada) usualmente es interpretada por los navegadores como una alineación izquierda. Si la imagen es menor que la tabla.) Ancho Color Borde claro Borde oscuro Fondo Imagen La dirección URL o ruta de acceso a un archivo de imagen para utilizar como imagen de fondo de la tabla.Alineación La posición de la tabla con relación a la ventana del navegador. se ajustan de forma automática los otros parámetros del grupo Bordes. Espacio entre Celdas La cantidad de espacio (en píxeles) entre cada celda. Internet Explorer usará el color especificado en Color (vea más arriba.) Indica el color del borde de la tabla en su lado inferior y derecho. la mayoría de los navegadores utilizan un valor de 2. el texto fuera de la tabla regresará a la izquierda o derecha de la misma. Si se selecciona Predeterminado. aunque esto puede variar dependiendo del navegador.) Relleno de la Celda La cantidad de espacio (en píxeles) entre el contenido de una celda y los bordes de la misma.

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. 98 Capítulo 4 Edición Básica de un Documento . utilice el comando Tabla > Propiedades de la celda o haga clic con el botón derecho del ratón dentro de cualquier celda y seleccione el comando Propiedades de la celda dentro del menú de atajo. 4. Si la suma de los altos de las celdas es mayor que el especificado para la tabla.) Color El color de fondo de la tabla. el de la tabla toma prioridad. Los anchos relativos de las celdas son determinados por las proporciones entre los anchos especificados. Si se especifica una imagen y un color de fondo al mismo tiempo. Esto ajustará de forma automática los tamaños de las celdas para reflejar el tamaño final como se verá en la ventana de Edición. Haga clic sobre el botón Proyecto para seleccionar un archivo de imagen del proyecto actual (no se encuentra disponible si no se trabaja en un proyecto.8 Editando las propiedades de una celda Cada celda en una tabla tiene un número de propiedades que pueden ser modificadas utilizando el diálogo Propiedades de la celda. Las alturas relativas de las celdas se determinan por las proporciones entre las alturas especificadas. Para abrir este diálogo. los de las celdas toman prioridad.Haga clic sobre el botón ClipArt para seleccionar una imagen de la librería de imágenes. la imagen tiene prioridad. utilice el comando Tabla > Aplicar Atributos de las Celdas Visibles. Para remover cualquier conflicto entre los tamaños especificados de las celdas y los de la tabla. Si la suma de los altos de las celdas es menor que el alto de la tabla especificado. Nota sobre el tamaño de la tabla y celdas Cuando tanto el tamaño de las celdas como el de la tabla se encuentra especificado y estas especificaciones entran en conflicto.9.

Borde claro Creando y editando tablas 99 . Si no se especifica. Este ajuste es ignorado por Netscape.Las propiedades de las celdas están divididas en cuatro grupos: Tamaño. Especifica el alto de la celda en píxeles o como un porcentaje del tamaño de la tabla. el navegador ajustará automáticamente el ancho de la celda para que quepa en el espacio disponible. Color de Fondo Bordes Color El color del borde de la celda. Si selecciona esta opción. Si no se especifica. Tamaño Ancho Especifica el ancho de la celda en píxeles o como un porcentaje del tamaño de la tabla. el navegador ajustará automáticamente el alto de la celda para que quepa en el espacio disponible. Las propiedades de cada grupo se explican a continuación. El color de fondo de una celda. el ajuste se ignora si Borde Claro y Borde Oscuro contienen un color que no sea el predeterminado. Bordes e Imagen de fondo. Las celdas de encabezado tienen una alineación horizontal centrada y su contenido aparece siempre en negrilla. Alto Formato Alineación Horizontal Alineación Vertical Celda de encabezado Especifica la alineación horizontal del contenido de la celda. Formato. La Predeterminada es izquierda. Este ajuste se ignora en Netscape. Especifica el color para los bordes internos derecho e inferior de una celda. las celdas serán designadas como celdas de encabezado. En Internet Explorer. La alineación vertical del contenido de la celda. La Predeterminada es centrada.

Si se selecciona un grupo de celdas. Si se especifican tanto imágenes de fondo como colores de fondo para una celda. se creará un mosaico para llenarla. Para aplicar los cambios a una celda. Si todas las celdas en un renglón no tienen la misma altura especificada. este ajuste es ignorado. Si se especifica el tamaño de los renglones o columnas como un porcentaje y éstos no suman el 100%. Si se especifica el tamaño de algunos renglones o columnas en píxeles y otros en porcentajes. los cambios que se hagan en el diálogo se aplicarán a todas las celdas seleccionadas. los porcentajes son interpretados como lo que sobra del ancho o alto de la tabla después de restar la suma total de los renglones o columnas especificados en píxeles. Si se ajusta el alto de una celda a un valor muy pequeño de forma tal que no pueda verse el contenido completo de la misma. 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 diálogo Propiedades de la tabla. presione sobre el botón Aplicar. El diálogo Propiedades de la celda se puede dejar abierto mientras se editan las propiedades de celdas múltiples.Borde oscuro Especifica el color para los bordes internos izquierdo y superior de una celda. o haga clic sobre el botón Proyecto para seleccionar un archivo del proyecto actual (si es que existe. Haga clic sobre el botón Clip Art para seleccionar una imagen de la librería de imágenes. Especifica la ruta de acceso o dirección URL de un archivo de imagen para utilizar como fondo de la tabla.) Imagen de fondo Notas acerca del tamaño de la celda El alto de un renglón siempre se expande. para mostrar todo el contenido de las celdas. Este ajuste es ignorado por Netscape. Si la imagen es menor que la tabla. si es necesario. si todas las celdas en una columna no tienen el mismo ancho. 100 Capítulo 4 Edición Básica de un Documento . De forma similar. puede ahora moverse a otra celda y editar sus propiedades sin cerrar el diálogo. Se puede teclear la información o hacer clic sobre el botón Examinar para localizar y seleccionar un archivo en el disco local. la altura utilizada se determina por la celda con la mayor altura. el tamaño relativo se determina por las proporciones entre los porcentajes. la imagen toma precedencia (prioridad).

En contraste. Para abrir este diálogo. los parámetros se aplicarán a toda la tabla.9 Modificando los bordes de una tabla o celda Además de usar los parámetros de borde disponibles dentro de los diálogos Propiedades de la tabla y Propiedades de la Celda.4. En él. consiste principalmente en que se puede aplicar un conjunto interno y externo de bordes a un bloque de celdas como una unidad. Doble borde externo Creando y editando tablas 101 . Los ajustes del diálogo Parámetros de los bordes se aplican únicamente a las celdas seleccionadas. El siguiente ejemplo ilustra el concepto de aplicar un conjunto de bordes a un bloque de celdas como una unidad. Para obtener mejores resultados haga clic sobre el botón Sí. La ventaja de utilizar el diálogo Parámetros de los bordes en lugar de los ajustes de los bordes disponibles dentro del diálogo Propiedades de la celda. se aplica un doble borde externo a un bloque de celdas en la mitad de la tabla. se puede ejercer un control más fino sobre los bordes de las tablas y celdas utilizando el diálogo Parámetros de los bordes. La primera vez que utilice este comando en una tabla. aún si se seleccionó un bloque de celdas.9. Si no se han seleccionado celdas. se le preguntará si quiere convertir los bordes de esa tabla a bordes del estilo CSS. los ajustes a los bordes realizados en el diálogo Propiedades de la celda sólo se aplican a las celdas de manera individual. utilice el comando Tabla > Bordes > Bordes de la Celda o haga clic con el botón derecho del ratón en cualquier parte dentro de la tabla y seleccione el comando Tabla > Bordes del menú de atajo.

seleccione un grupo de bordes utilizando uno de los botones que se encuentran a un lado de Bordes. Para agregar un título a una tabla. Los bordes del estilo CSS son compatibles con Internet Explorer 5. Para una vista previa precisa de los bordes aplicados. coloque el punto de inserción en cualquier lugar dentro de la misma y use el comando Tabla > Título > Insertar Título. 5 Seleccione un estilo de borde dentro de la lista Estilo. escribiendo luego el texto. haga lo siguiente: 1 Seleccione el bloque de celdas a las cuales se quiere aplicar el borde estilo CSS. seleccione una posición distinta para el título dentro de la lista Título de la Tabla.9. cambie a la solapa Vista Previa. 2 Use el comando Tabla > Bordes > Bordes de Celda o haga clic con el botón derecho del ratón en cualquier parte dentro de una tabla y seleccione el comando Tabla > Bordes del menú de atajo. 6 Seleccione un color para el borde utilizando la lista Color. 102 Capítulo 4 Edición Básica de un Documento . haga clic sobre el botón Aceptar. use el comando Tabla > Propiedades de la tabla. No todos los estilos de borde se despliegan apropiadamente dentro de la ventana de Edición.Para aplicar bordes de celdas del estilo CSS. Para eliminar el título.x y versiones más recientes. Pueden no desplegarse apropiadamente en otros navegadores. como se muestra en el siguiente ejemplo. 7 Elija el ancho del borde y las unidades a utilizar dentro del recuadro Ancho y la lista disponible. Para cambiar la posición del título. 4 En el diálogo Parámetros de los bordes. 8 Repita los pasos del 4 al 7 para cada uno de los grupos de bordes que desea modificar. En el diálogo Propiedades de la tabla.10 Agregando un título a una tabla Se le puede agregar un título a cualquier tabla. Una vez que haya terminado. 3 Haga clic en el botón Sí cuando se le pregunte si quiere cambiar los bordes al estilo CSS. coloque el punto de inserción en cualquier sitio dentro de la tabla y use el comando Tabla > Título > Borrar Título. 4.

9. Otra forma alternativa es seleccionar los renglones que formarán parte de la nueva división y arrastrarlos fuera de la tabla. haga lo siguiente: 1 Coloque el punto de inserción en el renglón superior donde se dividirá la tabla. 4. Si las tablas no tienen el mismo ancho de columnas. Las dos tablas solamente pueden ser unidas si el renglón inferior de la primera tabla y el superior de la segunda tienen el mismo número de celdas. Creando y editando tablas 103 . 2 Use el comando Tabla > Utilidades > Dividir Tabla. 2 Coloque el punto de inserción en cualquier parte de la primera tabla. seleccione las columnas a dividir y arrástrelas fuera de la tabla.4. de forma tal que la primera esté justo encima de la segunda sin espacios entre ellas. Para dividir una tabla en forma vertical. Para unir dos tablas.11 Dividiendo y combinando tablas Para dividir una tabla horizontalmente en dos. 3 Use el comando Tabla > Utilidades > Combinar Tablas. Todos los renglones debajo del punto de inserción se dividirán en una nueva tabla separada. haga lo siguiente: 1 Mueva o elimine cualquier párrafo que se encuentre entre las dos tablas.9. los anchos de las columnas de la segunda tabla serán ajustados a aquellos de la primera.12 Ordenando una tabla El diálogo Ordenar permite organizar todas o parte de las celdas de una tabla en una gran variedad de formas.

Seleccione esta opción si el primer renglón contiene encabezados.) Ordenar sólo el contenido Sólo el contenido de las celdas se moverá. De otra forma. (Si se selecciona esta opción. seleccione la columna o renglón a utilizar como primera llave. Excluir el último renglón El último renglón de la tabla o selección no se moverá. 5 Opcionalmente. aún se puede ordenar un bloque de celdas que no contenga celdas combinadas. 104 Capítulo 4 Edición Básica de un Documento . Seleccione esta opción si el último renglón contiene encabezados. Especifique si se organizará el contenido de las celdas como cadenas o números y si el orden será ascendente o descendente. Excluir el primer renglón El primer renglón de la tabla o selección no se moverá. 3 Bajo la opción Opciones. Haga clic sobre el botón Aceptar para cerrar el mensaje de advertencia y seleccione Ordenar sólo celdas seleccionadas en el diálogo Ordenar. Ordenar contenido por. Ordenar solamente las celdas seleccionadas Cuando se selecciona. 2 Use el comando Tabla > Utilidades > Ordenar para abrir el diálogo Ordenar. Si la tabla a ordenar contiene celdas combinadas (no hay un número igual de celdas en cada renglón o columna). De otra forma tanto los atributos. seleccione una o más columnas o renglones adicionales para utilizar como llaves secundarias de la organización dentro de la opción luego por. Las opciones para ordenar que se presentan. De otra forma.” Sin embargo. haga lo siguiente: 1 Si desea ordenar solamente parte de las celdas de una tabla. coloque el punto de inserción en cualquier sitio dentro de la tabla. aparecerá una advertencia al utilizar el comando Tabla > Utilidades > Ordenar: “No es posible ordenar una tabla o selección que contenga celdas combinadas.Para ordenar una tabla. no las celdas en sí mismas. selecciónelas antes de comenzar. 6 Haga clic sobre el botón Aceptar. también será seleccionada automáticamente.) 4 Bajo la opción Ordenar por. especifique si se ordena el contenido de las celdas como números o cadenas y si el orden será ascendente o descendente. Una vez más. solamente los renglones. son las siguientes: Ordenar de izquierda a derecha Si es seleccionado. tamaños y el color de fondo de las celdas se moverán junto con su contenido. solamente las celdas elegidas serán ordenadas. Si no. toda la tabla se ordenará. seleccione cualquiera de las alternativas de organización (descritas más abajo. se ordenarán las columnas.

Para ordenar los números por su valor.Ordenando como texto o número El especificar si se ordena Como texto o Como número sólo tiene caso cuando por lo menos una parte de las celdas a ordenar contiene números. Por ejemplo. (El número de renglones se calcula automáticamente al dividir el número de elementos entre el número de columnas especificadas. Esto es debido a que se utilizan caracteres ASCII para hacer la comparación en forma de cadenas de izquierda a derecha y el carácter "2" tiene un valor ASCII mayor que el número "1". haga lo siguiente: 1 Seleccione el texto que quiere convertir en tabla. 4.13 Convirtiendo entre texto y tablas Tanto una tabla puede convertirse en líneas ordinarias de texto. 2 Use el comando Tabla > Utilidades > Convertir Texto en Tabla. los números son tratados como si fuesen texto. si desea que cada párrafo en el texto seleccionado se convierta Creando y editando tablas 105 .) 5 Haga clic sobre el botón Aceptar. Cuando los números se ordenan como texto. coloque el punto de inserción en cualquier sitio dentro de la tabla y utilice el comando Tabla > Utilidades > Convertir Tabla a Texto. como las líneas de texto pueden ser convertidas a una tabla. Por ejemplo. seleccione Como número. 2.9. 3 En el diálogo Cambiar Texto a Tabla. Para convertir una tabla a texto. La tabla será “recorrida” de izquierda a derecha y de arriba hacia abajo.5 se considera mayor que 15. Si se selecciona Como texto.) 4 Seleccione un delimitador. aunque su valor sea menor. La elección del delimitador determina cómo se dividirá el texto seleccionado en las celdas dentro de la tabla. (Las elecciones de delimitadores se describen más adelante. especifique el número de columnas para la nueva tabla bajo la epígrafe Tamaño de la Tabla. la siguiente tabla: Pedro Julia 33 28 se convertirá en estos párrafos: Pedro 33 Julia 28 Para crear una tabla a partir de líneas de texto. El contenido de cada celda se convertirá en un párrafo.

) 3 Fije los bordes de la tabla al tipo Oculto. imágenes y otros elementos de la página. Si desea que cada palabra se convierta en una celda. (Use el 100% de ancho si quiere que el contenido de la página se expanda y contraiga según la apariencia de la ventana del navegador usado. Susana.en una celda. Usar una tabla es especialmente útil al diseñar páginas con distribución en columnas múltiples que de otra forma serían difíciles o imposibles de lograr. siempre que la opción Ver > Marcas > Rejilla de la Tabla se encuentre habilitada. unos con respecto a otros. 99. 5 Aplique una imagen o color de fondo a cada celda según el diseño. Muchos autores experimentados de documentos web utilizan tablas invisibles para distribuir sus páginas con excelentes resultados.9. Esto hace que los espacios entre las celdas.) 4 Divida la tabla en tantas columnas de renglones como desee. 106 Capítulo 4 Edición Básica de un Documento . seleccione Espacios. seleccione Salto de Párrafo como el delimitador. De hecho. las tablas usualmente son utilizadas dentro de los documentos web para organizar información. cree una tabla de una celda. Las tablas se usan también para organizar la distribución de un documento Web — la posición de los distintos párrafos. Si desea que la selección completa se convierta en una sola celda. seleccione Sin delimitadores. 5 Se convierte en: Enrique Susana 99 5 4. 2 Especifique el ancho y alto de la tabla como 100% o un valor fijo. Se puede especificar cualquier otro carácter como delimitador seleccionando Otro y proporcionar el carácter en el recuadro. los documentos generados por el Asistente de Sitios Web de Namo WebEditor usan tablas invisibles para organizar la distribución. 6 Agregue el contenido de cada celda. los espacios de las celdas y el ancho del borde sean iguales a cero. (Los bordes de la tabla serán aún visibles dentro la ventana de Edición.14 Usando una tabla para la distribución de una página Tal como se hace en los documentos de papel. La técnica básica del uso de una tabla para la distribución de una página es la siguiente: 1 En un documento en blanco. El ejemplo siguiente muestra el resultado de la utilización del comando Convertir Texto a Tabla con dos columnas y utilizando las comas como delimitadores: Enrique. dependiendo qué tan ancha y alta quiere que la página aparezca. Borre los párrafos vacíos que se encuentran arriba y abajo de la misma. ésta puede ser usada como ayuda en la distribución de una página web sin que sea visible dentro de un navegador. Puesto que una tabla HTML puede tener bordes invisibles.

Las rejillas de la tabla utilizadas para realizar la distribución se encuentran visibles como líneas punteadas. la página usa una distribución de tres columnas. Creando y editando tablas 107 . aunque no serán visibles en un navegador. Con un poco de práctica. podrá crear distribuciones complejas bien organizadas utilizando tablas invisibles. Como puede ver.El ejemplo que mostramos forma parte del sitio web de Namo Interactive.

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. Vínculos. así como los colores de los vínculos utilizados en el documento. 108 Capítulo 4 Edición Básica de un Documento . Las propiedades de un documento pueden ser vistas y modificadas en el diálogo Propiedades del Documento. utilice el comando Formato > Propiedades del Documento o haga clic con el botón derecho del ratón en cualquier parte documento y seleccione el comando Propiedades del Documento dentro de menú de atajo. el color o imagen de fondo. Texto. Vínculo visitado y Vínculo activo — puede ser especificado al proporcionar un valor hexadecimal manualmente o seleccionar el color de la lista. Tales propiedades incluyen el lenguaje de codificación utilizado (el juego de caracteres). 4. los márgenes superiores o izquierdos de la página. Para abrir este diálogo. se pueden copiar los colores de otro documento al hacer clic en la opción Importar Colores y seleccionando documento en el diálogo Abrir. Cualquiera de los ajustes de color — Fondo.10.4. Adicionalmente. 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 dirección URL en el recuadro Imagen de fondo.1 Cambiando el fondo del documento y los colores de los vínculos La imagen o color de fondo. el color predeterminado del texto y los colores de los vínculos utilizados dentro un documento web son controlados dentro de la solapa Apariencia dentro del diálogo Propiedades del Documento.

Un vínculo se vuelve activo al llegar a él utilizando la tecla de tabulación. documento por documento. El contenido del recuadro Título determina qué es lo que aparece dentro de la barra de títulos de un navegador cuando el documento es desplegado. En muchos navegadores.2 Asignando el título de un documento. Si no se le asigna un título al documento. Haciendo clic en el botón Clip Art y seleccionando la imagen de la librería de imágenes.10. Namo WebEditor lo genera automáticamente de la primera línea de texto del documento cuando se le guarda por primera vez. El recuadro Palabras clave permite asignar una serie de palabras al documento que serán utilizadas por las máquinas de búsqueda de Internet para asignarle una categoría.) Si se especifica una imagen de fondo. Modificando las propiedades de un documento 109 . El color del vínculo activo puede ser especificado de forma independiente de otros vínculos. 4. Palabras clave y la lista de Codificación del lenguaje. Al hacer clic en el botón Proyecto y seleccionar un archivo de imagen del proyecto activo (si es que lo hay. el vínculo activo se realza con un contorno punteado. palabras clave y juego de caracteres De los controles que se encuentran dentro de la solapa General del diálogo Propiedades del Documento. ¿Qué hay en un vínculo “activo”? Un vínculo “activo” dentro de una página Web vista en un navegador es aquel que se seguirá si el visitante presiona la tecla <Intro>. probablemente los más útiles son los recuadros Título.Al hacer clic en el botón Examinar y seleccionar el archivo de la imagen en el diálogo Abrir. ésta precede a un color de fondo.

que es adecuado para el español. Bajo Efectos avanzados de página.3 Cambiando los márgenes de una página y aplicando efectos especiales La solapa Estilos del diálogo Propiedades del Documento ofrece varios controles útiles que afectan el comportamiento y apariencia del documento. Si un documento contiene caracteres extranjeros tales como japoneses o árabes. Para el navegador Internet Explorer. que se mantendrá en la parte izquierda y superior de los bordes del documento. Se pueden asignar distintos efectos a cualquiera de los cuatro eventos. seleccione un evento. la mayoría de los navegadores utilizan uno de 10 píxeles. Si los márgenes no son especificados. El control de ajuste Márgenes determina el espacio en blanco.10. Fijar el margen a 0 es útil cuando se maneja una tabla al 100% para diseñar la página. El juego de caracteres utilizado de manera predeterminada es Occidental Europeo (Windows). 110 Capítulo 4 Edición Básica de un Documento . un efecto y especifique su duración. 4.La lista Codificación es usada para asignar un lenguaje de codificación (juego de caracteres) al documento. Estos efectos no trabajan en otro tipo de navegador. 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 característica. proporcione la ruta de acceso o dirección URL a un archivo de sonido del tipo WAV (haga clic en el botón Examinar para localizar y seleccionar uno) y determine el número de repeticiones. es posible especificar un efecto de transición cuando se entra o sale del documento. En Sonido de fondo. También disponible en Internet Explorer se encuentra la asignación de sonidos al documento que se reproducen en el trasfondo mientras se visualiza. en píxeles.

6 5.7 5.2 5.5 5.Capítulo 5 Edición Avanzada de un Documento Una vez que se ha familiarizado con las bases de crear y editar un documento web utilizando Namo WebEditor.4 5.8 Usando atributos de estilo Hojas de estilo Trabajando con capas Marcos y conjuntos de marcos Importando hojas de cálculo Creando un gráfico desde una tabla Creando formularios Web Editando el código fuente HTML 111 . hasta las más sofisticadas características a sus páginas web. sea sencillo. recurra a este capítulo para información de los temas avanzados. En este capítulo 5. Namo WebEditor hace posible que el agregar.3 5.1 5. Afortunadamente.

tales como párrafos y tablas. elementos de formularios e imágenes. 112 Capítulo 5 Edición Avanzada de un Documento . Estos elementos incluyen tablas. Los atributos de estilo que se aplican utilizando el diálogo Estilo son sobrescritos por aquellos atributos que se aplican a párrafos. En esta sección. ha aprendido acerca del formato básico de texto utilizando la barra de Formato. Los atributos de apariencia disponibles dentro del diálogo Estilo no se incluyen en algunos de los navegadores más viejos. la regla horizontal y los comandos Tipografía y Párrafo en el menú Formato. no se requiere especificar un valor para cada uno de los parámetros. La mayoría de estos atributos son incluidos dentro de los navegadores Internet Explorer 4 y Netscape 4 o versiones más nuevas. coloque el punto de inserción dentro del párrafo al cual se quiere aplicar el formato y seleccione el comando Formato > Estilo de Párrafo.1 Atributos relacionados a la tipografía La solapa Tipografía del diálogo Estilo permite aplicar varios atributos relacionados con la tipografía a los elementos de la página que incluyan texto. márgenes. Para aplicar un atributo de estilo a este tipo de elementos. Por ejemplo. selecciónelos antes de utilizar el comando. dentro del diálogo Estilo de carácter y en el diálogo Párrafo. haga clic sobre el botón Estilo en el diálogo de propiedades de este elemento.1 Usando atributos de estilo En la sección 4. Cuando se utiliza el diálogo Estilo. Para dar formato a párrafos múltiples.3. explicamos las opciones avanzadas de formato disponibles dentro del diálogo Estilo. sólo color de fondo. Los atributos que se encuentran en el diálogo Estilo proporcionan un control mucho más fino sobre la apariencia de los párrafos y varios tipos de elementos que se encuentran en una página. espacios y bordes se pueden aplicar a una imagen. Especifique valores solamente para aquellos que quiera utilizar dejando los demás en blanco. Aquellos que no incluyen estos atributos sencillamente los ignoran. Tenga presente que no todos los estilos se pueden aplicar a todo tipo de elemento en una página. formularios.1. Para usar el diálogo Estilo y aplicar atributos de estilo distintos a un párrafo. Los valores predeterminados del navegador serán utilizados para aquellos atributos de estilo que no sean especificados. 5. El diálogo Estilo también puede ser utilizado para aplicar atributos de estilo a otros tipos de elementos que no sean párrafos. celdas de tablas.5. caracteres individuales y palabras usando los controles que se encuentran dentro de la barra de Formato.

Tipografía secundaria Tipografía El contenido de esta casilla viene de la selección de la Tipografía primaria y la Tipografía secundaria. seleccione % de la lista. Existen siete tamaños cualitativos: XX-Pequeño.Especifica el tamaño como un porcentaje del tamaño del texto “normal” tal como lo define el navegador. no la contenga. cm. Arial. línea superior. Tamaño Relativo . Tamaño del texto Decoración El tipo de decoración que se utilizará en el texto: subrayado. utilizado para ver el documento. separándolas con comas. Usando atributos de estilo 113 . tachado o parpadeando. picas. El navegador utilizará la primera tipografía de la lista que esté disponible en el ordenador.) Proporcione un número y especifique el método del tamaño a utilizar de la lista. La forma de clasificar el tamaño cae en una de las cuatro categorías siguientes: Longitud . El tamaño final correspondiente a estos términos depende de la definición dentro de un navegador en particular. sans serif”. em y ex. si el ordenador no tiene la primaria. Grande. Si desea especificar tipografías adicionales alternativas.Tipografía primaria La tipografía preferida para el texto. La categoría tipográfica utilizada. mm. Tamaño Cualitativo . X-Grande y XX-Grande. X-Pequeño.Especifica el tamaño en términos cualitativos tales como “grande” o “pequeño”. Medio. Tamaño proporcional . (Ejemplo: “Verdana. escriba sus nombres después de la tipografía primaria.Especifica el tamaño en términos relativos a los tamaños “normales” tal como los define el navegador. píxeles.Especifica el tamaño utilizando unidades de longitud. Las unidades disponibles son: puntos. Existen dos tipos de tamaño relativos: menor y mayor. pulgadas. La tipografía asignada a cada categoría la determina el navegador. Esta tipografía es usada a menos que el ordenador. Pequeño. Para usar un tamaño proporcional.

Haga clic en el botón Examinar para localizar y seleccionar una imagen en su disco duro. “negrilla”. El tamaño final del texto tal como aparece en la pantalla del visitante depende de su navegador. Colores Primer plano Fondo El color del texto de un elemento de página. Cuando se usa el diálogo Estilo para especificar la imagen de fondo de un documento completo (haga clic en el botón Insertar Estilo en la etiqueta Adjuntos 114 Capítulo 5 Edición Avanzada de un Documento . “500”) o relativos (ej. “Normal” es 400 y “Negrilla” es 700. cursivo u oblicuo.Estilo Peso Qué tanto se “inclina” el texto: normal. aunque se especifique el tamaño usando unidades de longitud. Imagen de fondo URL La dirección URL o ruta de acceso a un archivo de imagen que se usará como el fondo del elemento. Si el documento cuenta también con una imagen de fondo. El color de fondo del elemento de página. “más negrilla”). La escala numérica de 100 . Seleccione un color de la lista. 5. Oblicuo es usualmente igual que cursivo. El grado de oscurecimiento del texto en términos absolutos (ej. su ordenador y el tipo de monitor utilizado para ver la página.2 Colores y fondos La solapa Distribución del diálogo Estilo contiene los atributos relacionados con el color del texto. Tenga presente que el tamaño final del texto tal como lo ven los visitantes puede no ser igual al que ve en su pantalla.1... la imagen de fondo del elemento toma precedencia. el color y la imagen de fondo de un párrafo u otro elemento de página.900. “Más negrilla” y “Más clara” son relativos al tamaño del texto “normal” tal como los define el navegador.

Horz. Si selecciona % como unidad. Usando atributos de estilo 115 . Desplazamiento vertical de la imagen de fondo desde la parte superior de un párrafo. Si selecciona % como unidad. selecciona % como unidad.1. sangrías y espaciamiento La solapa Texto del diálogo Estilos permite especificar la alineación. el espacio entre líneas se especifica como un porcentaje de la altura máxima de los caracteres.3 Alineación.<BODY> dentro de la solapa Estilos del diálogo Propiedades del Documento). La forma de duplicar la imagen de fondo. Desplazamiento horizontal de la imagen de fondo desde el borde izquierdo del párrafo. Vert. Alineación La alineación del párrafo. sangría de la primera línea. Este ajuste no tiene ningún efecto cuando se aplica a un párrafo. el ajuste no tiene ningún efecto. este ajuste controla si la imagen de fondo se mueve o se mantiene estática cuando el documento se desplaza. Pos. “Justificar” significa que se agrega espacio extra entre las palabras para que el borde derecho del párrafo se vea parejo y alineado. la sangría se especifica como un porcentaje del ancho del párrafo. Este ajuste no tiene ningún efecto si la imagen se repite verticalmente. La cantidad de sangría de la primera línea del párrafo. Seleccione “Repetir” para duplicar en ambos sentidos. Repetir Pos. Si Espacio entre caracteres La cantidad de espacio extra entre caracteres. espaciamiento entre líneas y espaciamiento entre caracteres de un párrafo. Sangría Espacio entre líneas La distancia entre las bases de las líneas que forman un párrafo. 5. Este ajuste no tiene ningún efecto si la imagen se repite horizontalmente.

5. 5. especifique la cantidad de espacio que quiera agregar a un lado de cualquier elemento de la página. Si el elemento tiene un color. imagen de fondo o un borde. 116 Capítulo 5 Edición Avanzada de un Documento . 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. el borde de la imagen de fondo o el borde. marco.4 Márgenes y rellenos La solapa Caja del diálogo Estilo permite especificar los márgenes y el espacio extra que se agrega a cada elemento de la página. Si no hay ninguno de estos elementos.5 Bordes La solapa Bordes del diálogo Estilo le permite aplicar una orilla a cualquier lado de un elemento de página. imagen de fondo o un borde (vea la siguiente subsección). En Espacios.1.1. no hay razón para especificar márgenes y espacios a la vez. Bajo Márgenes. celda de tabla o capa que contiene a ese elemento. el espacio no se diferencia de los márgenes. el espacio determina el área a dejar entre el elemento y el área coloreada. Los márgenes izquierdos y derechos son las distancias entre el lado izquierdo o derecho de los elementos y el borde correspondiente de la ventana.

4 Especifique los parámetros para los atributos de estilo que quiere aplicar al documento. Algunos estilos de bordes no son desplegados correctamente en la ventana de edición. tales como Internet Explorer 3. seleccione el color del borde. Bajo Ancho. sino al documento por completo. pero hay que prestar atención a cómo son desplegados. En la opción Colores. La mayoría de los navegadores nuevos incluyen estos atributos. 2 Cambie a la solapa Estilos del diálogo Propiedades del Documento. se puede predeterminar la tipografía de un documento.x o versiones inferiores. Por ejemplo. Los navegadores antiguos. haga clic en el botón Aceptar. puede seleccionar el estilo del borde para cualquiera de los lados del elemento.Bajo Estilo. Si el borde no aparece correctamente en esta ventana. 5. haga lo siguiente: 1 Use el comando Formato > Propiedades del Documento para abrir el diálogo Propiedades del Documento. Una vez que haya terminado. especificar la alineación determinada del párrafo y aplicar los márgenes a un conjunto de bordes de todo el documento.x o Netscape Navigator 3. no despliegan este tipo de bordes.1. 3 Haga clic en el botón Insertar Estilo en la etiqueta <BODY>. Si quiere agregar algún espacio entre el borde y el correspondiente lado del elemento. especifique el espesor de cada borde. Esto abre el diálogo Estilo.6 Aplicando atributos de estilo a un documento El diálogo Estilo puede ser usado para aplicar atributos de estilo no solamente a los elementos individuales de cada página. Estos atributos son ignorados por estos navegadores. Usando atributos de estilo 117 . Para aplicar atributos de estilo a un documento. cambie a la ventana de vista previa para ver cómo se desplegará el borde en un navegador. especifique la cantidad dentro de la solapa Caja del diálogo.

Si se aplica un borde al documento. Los atributos de párrafo y carácter que se apliquen a nivel del documento son sólo los predeterminados. éste siempre aparece al margen de la ventana. 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 diálogo Estilo toma precedencia sobre cualquier otra imagen o color de fondo especificada en la solapa Apariencia del diálogo Propiedades del Documento. la posición de los bordes no se ve afectada por los márgenes que se apliquen al documento. Pueden ser sobrescritos por los atributos que se aplican a nivel párrafo o carácter.5 Haga clic sobre el botón Aceptar para cerrar el diálogo Propiedades del Documento. 118 Capítulo 5 Edición Avanzada de un Documento . A diferencia de los párrafos.

2. Hojas de estilo 119 . las hojas de estilo definidas en un documento pueden ser guardadas como un archivo externo y utilizadas en otros documentos. Los estilos y las hojas de estilo se administran dentro del diálogo Hojas de estilo (mostrado más bajo. 5. haga lo siguiente: 1 Abra el diálogo Hojas de estilo usando el comando Formato > Hojas de estilo. se puede guardar como un estilo con nombre. tal como un proyecto. ya sea en una hoja de estilo interna o externa. Además de esto. permite vincular a hojas de estilo externas.1 Guardando un conjunto de atributos como un estilo Para guardar un conjunto de atributos de estilo como una hoja de estilo.) Esto abre el diálogo Agregar Estilo.) Este diálogo muestra una lista de los estilos utilizados en el documento activo y. Cuando se cambia un estilo.5. todos los párrafos o partes de los párrafos que usan ese estilo cambian automáticamente. La colección de los estilos dentro de un documento se llama Hojas de estilo. use el comando Formato > Hojas de estilo. Se pueden tener tantos estilos en un documento como se desee. Las hojas de estilo son una forma muy poderosa de administrar el formato de un documento o de un conjunto de documentos. además de permitir agregar y quitar estilos.2 Hojas de estilo Si cuenta con un conjunto de atributos de estilo que use continuamente. 2 Haga clic en el botón (Agregar. Para abrir este diálogo.

Una vez que haya terminado de editar el estilo.) 5 Una vez que se han terminado de especificar los atributos del estilo.2 Aplicando un estilo Una vez que se ha definido un estilo. Para borrar un estilo. o 120 Capítulo 5 Edición Avanzada de un Documento . deberá aparecer el que acaba de crear dentro de la lista Estilos Internos y su definición (el conjunto de atributos especificados) aparecerá bajo Definición del Estilo. Haga clic sobre el botón Aceptar. haga clic sobre el botón Aceptar para cerrar el diálogo Estilo. 4 En el diálogo Estilo. (Para mayor información del diálogo Estilo. vea la sección 5. Hay dos maneras de aplicar un estilo a un párrafo: Coloque el punto de inserción dentro del párrafo y seleccione el estilo dentro de la lista Estilo CSS en la barra de Formato. proporcione los valores para los atributos del estilo que se quieren especificar.2. Confirme que la definición esté completa y luego haga clic sobre el botón Aceptar para cerrar el diálogo Hojas de estilo. abra el diálogo Hojas de estilo y haga doble clic en el estilo editar dentro de la lista Estilos Internos.1: Usando atributos de estilo.3 Proporcione un nombre para el estilo dentro del recuadro Nombre. se puede aplicar a párrafos o partes de un párrafo dentro de la ventana de Edición. Esto abrirá el diálogo Estilo.) 5. Si desea copiar los atributos de un estilo ya guardado. En el diálogo Hojas de estilo. seleccione el estilo dentro de la lista Copiar atributos de. haga clic sobre el botón Aceptar dos veces para regresar a la ventana de Edición. Para editar un estilo existente. selecciónelo dentro de la lista Estilos Internos y haga clic sobre el botón (Remover.

Coloque el punto de inserción dentro del párrafo y use el comando Formato > Estilo del Párrafo. En la solapa Clase del diálogo Estilos, seleccione el estilo dentro de la lista Clase. Para aplicar un estilo a una parte de un párrafo — tal como una palabra — en lugar de a todo el párrafo, 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 automática 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 párrafo o a una selección eligiéndolos de la lista Estilo CSS, un estilo de etiqueta se aplica de forma automática cuando se agrega un elemento de página asociado a una etiqueta correspondiente. Como un ejemplo, veamos cómo se define un estilo de etiqueta para los elementos de una lista:
1 Abra el diálogo Hojas de estilo usando el comando Formato > Hojas de estilo. 2 Haga clic en el botón

(Agregar). Esto abre el diálogo Agregar Estilo.

3 Seleccione la etiqueta de los elementos de la lista (li) dentro del Etiquetas. Haga clic

sobre el botón Aceptar.
4 En el diálogo Estilo, proporcione los valores para los atributos de estilo que se desean

asociar a la etiqueta seleccionada. (Para mayor información sobre el diálogo Estilo, vea la sección 5.1: Usando atributos de estilo.)
5 Una vez que se han terminado de especificar los atributos de estilo, haga clic sobre el

botón Aceptar para cerrar el diálogo Estilo. En el diálogo 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 definición del estilo se encuentra en Definición del
Hojas de estilo 121

Estilo. Confirme que la definición es la adecuada y luego haga clic sobre el botón Aceptar para cerrar el diálogo Hojas de estilo.

Ahora, cuando se cree una lista numerada o de viñetas dentro del documento, el estilo que se acaba de definir será utilizado de manera automática. El estilo de etiquetas también se aplicará a los elementos de una lista ya existente. A continuación encontrará una lista de los tipos de elemento de página más comunes y sus etiquetas correspondientes. Tipo de Elemento de Página Párrafo Normal Elemento de Lista (viñeta o numerada) Encabezado 1, Encabezado 2, etc. Tabla Celda de una Tabla Capa Imagen Regla Horizontal Vínculo Genérico Etiqueta P Li h1 h2 etc. table Td Div Img Hr A Atributos que se Aplican Todos Todos Todos

todos (los márgenes y espacios se aplican fuera de tabla) Todos todos (el margen se aplica fuera de la capa, los espacios dentro de ella) todos excepto tipografía, texto y color de fondo todos excepto tipografía, texto y color de fondo todos excepto alineación, sangría de primera línea y espacio entre líneas

Ciertos atributos que pueden ser asignados a las etiquetas no se despliegan de forma correcta en la ventana de Edición. Para ver cómo se desplegarán dentro de un navegador, cambie a la ventana de Vista Previa.

5.2.4 Definiendo el conjunto de atributos para los vínculos
Un vínculo, dentro un documento, puede tener cuatro estados distintos en cualquier momento: Normal Visitado Activo Normal, vínculo que no ha sido visitado. Vínculo que ha sido visitado. El vínculo al cual se saltará si se presiona la tecla <Intro>.

122

Capítulo 5

Edición Avanzada de un Documento

Rondar

El vínculo sobre el cual se encuentra el apuntador del ratón.

Se puede asignar un conjunto de atributos de estilo distinto a cada estado, creando uno o más estilos de vínculos. Para crear un estilo de vínculo, haga lo siguiente:
1 Abra el diálogo Hojas de estilo usando el comando Formato > Hojas de estilo. 2 Haga clic en el botón

(Agregar.) Esto abre el diálogo Agregar Estilo.

3 Haga clic en el botón Otro. Seleccione un estado del vínculo dentro de la lista Nombre.

Haga clic sobre el botón Aceptar.
4 En el diálogo Estilo, proporcione los valores para los atributos de estilo que se quieren

asociar con el estado seleccionado del vínculo. (Para mayor información del diálogo Estilo, vea la sección 5.1: Usando atributos de estilo.)
5 Una vez que se han terminado de especificar los atributos del estilo, haga clic sobre el

botón Aceptar para cerrar el diálogo Estilo.
6 Repita los pasos del 2 al 5 para cada estilo de vínculo que quiera crear. 7 En el diálogo Hojas de estilo, cada estilo de vínculo que acaba de crear aparecerá

dentro de la lista Estilos Internos como “a:” seguido del nombre del estado del vínculo (por ejemplo, “a:rondar”). La definición se localiza dentro de Definición del Estilos. Confirme que las definiciones son las deseadas y haga clic sobre el botón Aceptar para cerrar el diálogo Hojas de estilo.
Si ha definido un estilo de etiqueta para la etiqueta <a> (vínculos genéricos), todos los atributos que estén definidos en ella pero que no sean definidos en los estilos de vínculo serán aplicados a todos los vínculos. Por ejemplo, si se ha definido un estilo para la etiqueta <a> que especifica una tipografía y el estilo del vínculo no la especifica, todos los vínculos (no importando su estado) utilizarán la tipografía especificada dentro del estilo de la etiqueta <a>.

5.2.5 Guardando los estilos en una hoja externa de estilos
Una de las características más 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 característica 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 diálogo Hojas de estilo. 2 Haga clic en el botón

(Guardar como Archivo Externo.)

Hojas de estilo

123

3 En el diálogo 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 botón Guardar. La Hoja de estilo se guardará como un archivo de texto con una extensión .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 aplicación que pueda trabajar con archivos de texto, tal como WordPad. Realice los cambios directamente a las definiciones de estilo dentro del archivo y luego guárdelo. 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 investigación dentro de su librería preferida utilizando términos 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 métodos producen el mismo resultado, pero cada uno de ellos tiene una ventaja sobre el otro: La vinculación se encuentra incluida dentro de los navegadores más modernos (Netscape 4.0 o versión más reciente e Internet Explorer 3 o versión más reciente), pero solamente es posible vincular a una sola hoja de estilo externa. Al importar tenemos la ventaja de poder utilizar cualquier número de hojas de estilo externas en el mismo documento, pero desgraciadamente esta característica solamente se encuentra incluida en Internet Explorer 4 o versión más reciente. Para vincular una hoja de estilo externa, haga lo siguiente:
1 Use el comando Formato > Hojas de estilo para abrir el diálogo Hojas de estilo. 2 Proporcione la ruta de acceso o la dirección URL al archivo de la hoja de estilo externa

dentro del recuadro Vincular Hojas de estilo o haga clic sobre el botón (Examinar) para localizar y seleccionar el archivo en su disco duro. (Los nombres de archivo de las hojas de estilo terminan con la extensión .css.)
3 Haga clic sobre el botón Aceptar para cerrar el diálogo Hojas de estilo.

124

Capítulo 5

Edición Avanzada de un Documento

Para importar una o más hojas de estilo externas, haga lo siguiente:
1 Use el comando Formato > Hojas de estilo para abrir el diálogo Hojas de estilo. 2 Bajo Importar Hojas de estilo, haga clic sobre el botón

(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 extensión .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 botón Aceptar para cerrar el diálogo 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ó más de una hoja de estilo externa a un documento, asegúrese de que no contengan estilos que compartan el mismo nombre o que estén asociados con la misma etiqueta. Si ocurre un conflicto, puede no ser posible predecir cuál de las definiciones de estilo será aplicada. Cuando se publica un documento que contiene referencias a hojas de estilo externas, se deben también publicar los archivos de las hojas de estilo junto con los documentos. Asegúrese 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 dirección 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 móvil para texto, imágenes y otros elementos de página. Cualquier cosa que pueda ser colocada dentro de una página, también puede ser colocada en una capa (incluyendo otras capas.) Las capas pueden ser colocadas en cualquier parte de una página, puesto que “flotan” sobre los elementos de la página. 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 Edición, sin el texto de fondo:
Marca de etiqueta de capa

Manija de la capa

El pequeño 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 Edición. El pequeño símbolo amarillo fuera de la capa es la marca de la etiqueta de la capa, que indica dónde se ha insertado la capa dentro del documento.

126

Capítulo 5

Edición Avanzada de un Documento

Al arrastrar. Puesto que las capas se pueden mover con libertad a cualquier posición.) Usar los ajustes automáticos puede resultar de gran ayuda cuando se trabaja con capas. la localización del marcador de la capa no es importante. si lo desea. Bajo Posición y tamaño.3. si elimina la marca. Haga clic sobre el botón Aceptar para cerrar el diálogo. se puede cortar y pegar el marcador en cualquier posición conveniente dentro del documento. Si se encuentra habilitada la opción de ajustar a rejilla (use el comando Ver > Rejilla > Ajustar). Si se requiere colocar una capa en una coordenada específica.3. en píxeles. Suelte el botón del ratón una vez que el contorno de la capa se encuentre en el punto deseado.5. El apuntador del ratón cambia a una pequeña mano cuando se coloca sobre la manija de una capa.1 Creando y moviendo las capas Para crear una capa en el documento activo. 5. Un marcador de la etiqueta de la capa aparecerá en el punto de inserción mientras que una capa se crea de inmediato a la derecha de la marca.) Trabajando con capas 127 . Para mover la capa. haga doble clic sobre la manija de la capa.2 Cambiando el tamaño de una capa y agregando el contenido Para cambiar el tamaño de una capa. Las manijas de cambio de tamaño solamente aparecen cuando la capa se encuentra seleccionada (haga clic una vez sobre la manija de la capa para activarla. use el comando Insertar > Capa o haga clic sobre el botón en la Barra de herramientas estándar. el contorno de la capa sigue al apuntador del ratón. use los controles de posición localizados en el diálogo Propiedades de la Capa. también elimina la capa. sencillamente arrástrela de su manija. Las capas también encajan a las guías si se habilita el ajuste a las guías (use el comando Ver > Guías > Ajustar. los bordes de la capa “encajan” a las subdivisiones invisibles al arrastrarla. proporcione la distancia deseada. Sin embargo. Para abrir este diálogo. haga clic sobre cualquiera de sus manijas y arrástrela. desde la esquina superior izquierda del documento dentro de los recuadros Izquierda y arriba.

3 Ajustando el orden de las capas Las capas múltiples dentro de un mismo documento pueden solaparse.Para especificar un tamaño exacto de la capa. No es posible hacer una capa lo suficientemente pequeña para que oculte su contenido. 128 Capítulo 5 Edición Avanzada de un Documento . en tales casos.3. imágenes y otros elementos de la página por cualquier método que quiera utilizar. 5. haga doble clic sobre la manija de la capa y proporcione tanto el alto como el ancho en píxeles dentro del diálogo Propiedades de la Capa. Coloque el punto de inserción en la capa haciendo clic en cualquier parte dentro de ella y agregue el texto. ajuste su Índice Z en el diálogo Propiedades de la Capa. Al agregar el contenido. 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 más arriba. Normalmente. Se puede agregar el contenido a una capa tal como se realiza con un documento.) Para cambiar explícitamente el orden de arriba hacia abajo de capas múltiples. el alto de la capa aumentará justo para acomodarlo y que sea visible.

3. (Para abrir esta ventana. índices Z y estado de visibilidad. Mientras mayor sea el índice Z. se le asigna un índice Z de 1.) Trabajando con capas 129 . ésta es seleccionada en la ventana de Edición. Se puede cambiar este índice a cualquier valor entero negativo o positivo. líneas de tiempo y el Asistente de Secuencias de Comandos (vea el Capítulo 6: Agregando Elementos Dinámicos. posición e índice Z. Si se hace doble clic sobre una capa en la lista.Cuando una capa es creada. puede ser difícil determinar por inspección visual qué capa se encuentra delante de las otras.) La ventana Capas lista todas aquellas dentro del documento activo. Para confirmar el orden de las capas. Cuando las capas que se traslapan no tienen un color de fondo o solamente tienen texto con el mismo color. 5. mayor es el orden de la capa en el orden de arriba hacia abajo. Las capas que tienen el mismo índice Z se ordenan según su hora de creación. verifique dentro de la ventana Capas. se abre el diálogo Propiedades de la Capa para esa capa en concreto. use el comando Ventanas > Lista de Capas o use las teclas <Alt + 5>. existen unas cuantas propiedades extras de la capa que pueden ser ajustadas dentro del diálogo Propiedades de la Capa.4 Otras propiedades de las capas Además del tamaño. mostrando sus nombres. Al hacer clic sobre una capa de dentro de la lista. Nombre de la capa Cada capa en un documento tiene un nombre único que la identifica no solamente en la ventana Capa sino que también para ser usada en acciones.

Aunque probablemente no sea práctico contar con una capa que siempre esté oculta.x o versiones más recientes y con Netscape 4. la librería de imágenes o el proyecto activo. Namo WebEditor usa la etiqueta <DIV> para definir las capas. Para asignarla. respectivamente. Imagen de fondo Color de fondo Nota sobre la compatibilidad con navegadores Las capas no son incluidas en algunos navegadores. Sin embargo.6 o versiones más recientes. Esto puede realizarse usando acciones o líneas de tiempo (vea el Capítulo 6: Agregando Elementos Dinámicos. 130 Capítulo 5 Edición Avanzada de un Documento . o Proyecto para seleccionar el archivo de la imagen del disco duro. Para hacer que las capas sean compatibles con algunas de las versiones previas de Netscape. particularmente en los más antiguos. Si la capa se encuentra dentro de otra y se fija la visibilidad a Heredada.) Use el menú Visibilidad para cambiar la visibilidad de una capa dentro de una secuencia de línea de tiempo. De manera predeterminada. cada capa tiene un fondo transparente. una capa puede ser invisible u oculta mientras el documento se despliega en un navegador.Visibilidad En un momento dado. seleccione la opción Predeterminado. Para volver al color transparente de fondo inicial. seleccione la opción Guardar usando etiqueta <LAYER> en el diálogo propiedades de la Capa. se puede asignar un color de fondo que no sea transparente usando esta lista. los resultados son impredecibles. es útil poder cambiarla con el tiempo o en respuesta a un evento. Clip Art. se obliga a que la capa tenga la misma visibilidad que aquella de su “padre”. Cada capa puede tener una imagen de fondo. proporcione su dirección URL o la ruta de acceso dentro del recuadro correspondiente o haga clic en uno de los botones: Examinar. De manera predeterminada. Si un documento que usa capas se ve dentro de un navegador que no las incluye. Esto es compatible con Internet Explorer 4.

1 Creando un conjunto de marcos Para crear un nuevo conjunto de marcos. estos reciben el nombre de conjunto de marcos y el documento que contiene la información acerca de ese conjunto es llamado documento de marcos. el contenido es proporcionado por los documentos del marco. Cada vez que se hace clic sobre un vínculo del primer marco. si existen dos marcos dentro de la ventana de un navegador. Por ejemplo. 3 Haga clic sobre el botón Aceptar. mientras que el otro puede mostrar el documento destino de uno de los vínculos. tal como su nombre. 2 En la solapa Marcos del diálogo Nuevo. seleccione la plantilla del conjunto de marcos. El documento del conjunto de marcos es "invisible": cuando se abre un documento del conjunto de marcos en un navegador. 5.4. Contenido. y (3) un mensaje que se muestra en los navegadores que no incluyen el uso de marcos. tamaño y documento predeterminado.) Cuando se tienen varios marcos. Cualquier número 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. haga lo siguiente: 1 Use el comando Archivo > Nuevo o Marcos > Nuevo Marco. El nuevo conjunto de marcos aparece en la ventana de Edición. no se ve el documento sino solamente los documentos contenidos en cada uno de los marcos.4 Marcos y conjuntos de marcos Los marcos son una forma de desplegar dos o más documentos en la misma ventana de un navegador web de forma simultánea. el documento destino es cargado dentro del segundo marco. 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. Detalle”. tal como se muestra en la imagen inferior que ha sido creada utilizando la plantilla “Titular. Marcos y conjuntos de marcos 131 . El documento del conjunto de marcos no contiene el contenido de los marcos que define. (2) alguna información acerca de cada marco.5. Las plantillas se encuentran disponibles para una gran cantidad de tipos comunes de conjuntos de marcos. uno de ellos puede mostrar un documento que consiste en una lista de vínculos.

lo que cambia su estado de temporal. El documento seleccionado se abrirá dentro del marco activo. Solamente el documento de marcos es representado con una solapa de documento. con los nombres noname1. Si lo desea. Una vez que se ha creado el nuevo conjunto de marcos. o se puede agregar contenido a este documento temporal (guardándolo posteriormente. se puede reemplazar el documento temporal en cualquiera de los marcos con otro que ya ha sido previamente creado y guardado.) Para reemplazar un documento temporal de cualquier marco con algún otro. Los documentos temporales dentro de cada marco no tienen solapa. 3 Seleccione un documento de su disco duro y haga clic en el botón Abrir o proporcione la dirección URL del documento dentro de la Web en el recuadro URL y presione sobre el botón Abrir URL.Marco “Titular” Marco “Contenido” Borde del marco Marco de “detalle” El nuevo documento de marcos es llamado frame1. La forma más sencilla de realizar esto es usando el comando Marcos > Guardar Todo.htm.htm. 2 Use el comando Marcos > Abrir Documento en Marco. incluyendo el que contiene a los marcos.4. etc. tal como se realiza con un documento único. 5.htm. el 132 Capítulo 5 Edición Avanzada de un Documento . Si cualquiera de los marcos contiene un documento que no ha sido previamente guardado. para guardar por completo los marcos se deben guardar todos los documentos.2 Guardando un conjunto de marcos Puesto que un conjunto de marcos incluye documentos múltiples. haga lo siguiente: 1 Haga clic dentro del marco para activarlo. Namo WebEditor coloca un documento temporal en cada uno de los marcos. puede volver a editar el documento y guardarlo posteriormente. El nombre de archivo del documento en el marco activo (aquél con un borde azul a su alrededor) se muestra en la barra de título de Namo WebEditor. noname2.

Si cualquiera de los marcos contiene un documento o temporal. la solapa Vista Previa en la parte baja de la ventana principal es utilizada exclusivamente para ver el documento del marco activo. 5.4. aparecerá inicialmente en blanco. se le pedirá que lo guarde antes de que se pueda desplegar la vista preliminar del conjunto de marcos. Si cualquier marco contiene un documento temporal en el momento de guardar el documento que tiene un conjunto de marcos. use el comando Archivo > Guardar. 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. al hacer clic y arrastrar cualquiera de sus bordes o de forma numérica. esto también cambiará el tamaño del marco adyacente. Este es el documento que aparecerá en el marco cuando el conjunto de marcos se abra por primera vez en un navegador. utilice la solapa Vista Previa Marcos. Por lo tanto.4. haga clic y arrastre uno de los bordes que comparte con otro marco. Para realizar una vista preliminar del conjunto de marcos. 5.4 Determinando el documento predeterminado de un marco Aunque cualquier marco puede contener cualquier documento. cuando almacena el documento del conjunto de marcos. Si desea guardar solamente el documento del marco activo. Para cambiar el tamaño de un marco de manera visual. Marcos y conjuntos de marcos 133 . asegúrese de que cada marco contiene un documento que no sea temporal (que esté guardado) al momento de guardar su conjunto de marcos.3 Vista previa de un conjunto de marcos Cuando se está editando un conjunto de marcos. Para guardar solamente el documento que contiene a los marcos.diálogo Guardar como aparecerá una vez para cada documento que no se ha guardado. 5. preguntándole el nombre del archivo y localización en la cual se guardará. al especificar su tamaño dentro del diálogo Propiedades del Marco. Obviamente. cada marco dentro de un conjunto de marcos necesita tener un documento predeterminado. Si el marco no consta de un documento predeterminado.5 Cambiando el tamaño de los marcos Los marcos pueden ser cambiados de tamaño ya sea de forma visual. use el comando Marcos > Guardar Marcos. no se definirá un documento predeterminado para ese marco.4.

entonces por lo menos un marco aparecerá en un tamaño distinto al que se especificó. entonces el radio de los anchos de los tres marcos será 2:4:3.) 2 Use el comando Marcos > Propiedades del Marco para abrir el diálogo Propiedades del Marco. (Vea más abajo una explicación de los distintos métodos de determinar el tamaño.Para especificar el tamaño de un marco numéricamente. 134 Capítulo 5 Edición Avanzada de un Documento . el tamaño de cada marco será reducido de forma proporcional a su tamaño especificado. Por lo tanto. proporcione un valor dentro de los recuadros Ancho del marco y / o Alto del marco y seleccione el método para determinar el tamaño dentro de la lista. si un conjunto de marcos se divide verticalmente en tres marcos y al de más a la izquierda se le asigna un valor relativo de ancho de 2. haga lo siguiente: 1 Active el marco (al hacer clic dentro de él. a menos que otro marco tenga su tamaño especificado en términos relativos.) Especificar el tamaño del marco como un porcentaje del tamaño de la ventana Seleccione % dentro de la lista y proporcione el porcentaje con respecto al tamaño de la ventana del navegador. Por ejemplo. Si el tamaño de todos los marcos en un conjunto de marcos se especifica en píxeles y la suma de todos ellos no es igual al ancho o alto de la ventana del navegador. es buena idea especificar el tamaño de por lo menos uno de los marcos en términos relativos (vea más abajo. Si la suma de todos los tamaños es menor al 100%. Existen tres formas especificar el tamaño de un marco numéricamente: Especificar el tamaño del marco en píxeles Seleccione píxeles dentro de la lista y proporcione la cantidad. Por ejemplo. 3 Bajo Tamaño y espaciamiento. Si la suma de todos los marcos que utilizan un porcentaje excede el 100%.) 4 Haga clic sobre el botón Aceptar. teclee 100 para fijar el ancho o altura del marco exactamente a 100 píxeles. al del centro un valor relativo de 4 y al de la más a la derecha un valor relativo de 3. Especificar el tamaño del marco en términos relativos Seleccione *(relativo) en la lista de unidades y teclee un entero que represente el tamaño del marco con relación al de los otros. el tamaño de cada marco se aumentará de forma proporcional. en cuyo caso el tamaño del marco se aumentará para compensar la diferencia.

) Cuando se usan marcos. el destino del vínculo es la misma ventana o marco que lo contiene. use el menú Marco destino en el diálogo Propiedades del Vínculo. pero esto puede cambiarse. conocidas como su destino. Una vez que se suelta el botón del ratón. haga clic sobre el botón Sí para confirmar su eliminación. reemplazando los marcos en una nueva ventana sin marcos El comportamiento que utilizará depende de las propiedades del vínculo. Para remover un marco.4. Afortunadamente.4. puede ser que prefiera que el documento referido dentro del vínculo de un marco siempre sea abierto dentro un marco específico. Una vez que se suelta el botón del ratón. Siga los siguientes pasos: 1 Use el comando Marcos > Propiedades del Marco para abrir el diálogo Propiedades del Marco. De manera predeterminada. divida uno de los ya existentes en dos partes. 2 Proporcione un nombre dentro del recuadro Nombre y haga clic en el botón Aceptar. existen varias formas en las cuales el navegador puede desplegar los documentos a los que se refiere el vínculo. active el marco que quiera dividir y luego seleccione Dividir Marco Horizontalmente o Dividir Marco Verticalmente en el menú Marco. Si el marco NO es el de más arriba o el de más a la izquierda Haga clic y arrastre su borde superior o izquierdo completamente al lado opuesto. sin embargo.5. haga lo siguiente: Si el marco es el que se encuentra más arriba o el de más a la izquierda dentro de un conjunto de marcos Haga clic y arrastre su borde inferior o derecho completamente al lado opuesto.6 Agregando y eliminando marcos Para agregar un marco a un conjunto de marcos. es Marcos y conjuntos de marcos 135 . El destino es el nombre del marco o ventana en el cual el documento de referencia del vínculo será desplegado. 5. haga clic sobre el botón Sí para confirmar su eliminación. Se le debe dar un nombre al nuevo marco. Para realizar esto.7 Determinando el destino predeterminado de un marco Cuando se hace clic sobre un vínculo dentro de la ventana de un navegador que está dividida en marcos. Puede abrir el documento: en el marco que contiene el vínculo en otro marco en la ventana completa. dependiendo de si quiere que el nuevo marco se encuentre a la derecha o debajo del ya existente. (Para cambiar el destino de un vínculo dentro de Namo WebEditor.

A y B. el menú Marco predeterminado destino también contiene cuatro palabras reservadas especiales cuyo significado depende del contexto: _self Se refiere al propio marco activo. Pero ¿Qué es un marco padre? Pongamos que existen dos conjuntos de marcos. ese marco es el marco padre de todos los marcos del conjunto de marcos A. 2 Use el comando Marcos > Propiedades del Marco para abrir el diálogo Propiedades del Marco. actívelo y luego inspeccione la barra de título de la ventana principal de Namo WebEditor. Para fijar el destino predeterminado de un marco. El primer elemento dentro de los paréntesis cuadrados es el nombre de archivo o dirección URL del documento abierto dentro del marco. Si se especifica un destino predeterminado para un marco. el marco padre de todos los marcos del conjunto de marcos A será la misma ventana del navegador. Para cambiar el nombre de un marco. reemplazando el conjunto completo de marcos. Si determina el marco destino de un vínculo a _parent. 3 Dentro del menú Marco predeterminado destino. Además de listar los nombres de los marcos dentro del conjunto de marcos. Para averiguar el nombre de un marco. algunos o todos los marcos pueden ya tener destinos predeterminados asignados. el documento vinculado cargará en el marco padre. El segundo elemento es el nombre del marco activo. use el comando Marcos > Propiedades del Marco y edite el contenido del recuadro Nombre en el diálogo Propiedades del Marco. Si se selecciona el destino predeterminado a _self. Si el conjunto de marcos A se despliega por completo dentro de la ventana de un navegador. Se refiere al marco “padre” del marco que contiene el vínculo. la referencia del vínculo de ese marco se aplica siempre dentro del predeterminado. a menos que un vínculo particular tenga un destino especificado diferente. 4 Haga clic sobre el botón Aceptar. Edición Avanzada de un Documento _parent 136 Capítulo 5 . seleccione el nombre del marco que desea utilizar como destino predeterminado. los documentos referidos por los vínculos dentro del marco se cargarán dentro del mismo marco. Si el conjunto de marcos A se encuentra desplegado en uno de los marcos del conjunto de marcos B. 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. haga lo siguiente: 1 Active el marco.posible definir un destino predeterminado para cualquier marco. Si se crea un conjunto de marcos utilizando una plantilla.

El nombre del marco. Ruta La referencia al archivo o dirección URL del documento abierto en el marco.8 Modificando las propiedades de los marcos Cada marco tiene un conjunto de propiedades que determinan su apariencia y comportamiento. Para abrir un documento distinto.4. el documento enlazado cargará dentro de la ventana completa del navegador._top Se refiere a la ventana del navegador. Cuando se guarda el documento del conjunto de marcos. _self será usado. Algunas propiedades de los marcos ya han sido analizadas en esta sección. el documento enlazado cargará en una nueva ventana de navegador. proporcione su dirección URL o haga clic sobre el botón Examinar y selecciónelo en su disco duro y luego presione sobre el botón Aceptar. _blank Si no se especifica un destino predeterminado. Estas propiedades se guardan junto con el documento del conjunto de marcos. 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 vínculo. Para abrir el diálogo Propiedades del Marco. 5. use el comando Marcos > Propiedades del Marco. Si determina el marco de destino de un vínculo a _blank. Se refiere a una nueva ventana de navegador. Nombre Marco predeterminado destino Marcos y conjuntos de marcos 137 . reemplazando por entero el conjunto de marcos. el documento especificado se convierte en el predeterminado del marco. Si determina el marco destino de un vínculo a _top. Aquí las resumimos y describimos las restantes.

en píxeles. superior: 14.4. los bordes serán invisibles cuando el documento se despliegue en el navegador. los bordes se ocultan cuando el documento se ve en un navegador. los bordes aún serán visibles dentro de la ventana de Edición de Namo WebEditor. (Vea la sección 5. 4.7: Determinando el destino predeterminado de un marco. Auto significa que el marco tendrá una barra de desplazamiento solamente si el contenido del marco no puede ser visto sin desplazamiento. los visitantes a nuestro sitio WEB pueden modificar el tamaño del marco en su navegador al hacer clic en uno de sus bordes y arrastrarlo. Debido a un problema con algunas versiones de Internet Explorer. (Sin embargo.10: Modificando las propiedades de un documento 138 Capítulo 5 Edición Avanzada de un Documento . no sólo al marco activo.) Si no se especifica se usa _self. Los márgenes predeterminados son izquierdo: 10. El valor por omisión es Auto. Barra de desplazamiento Especifica si el marco deberá tener una barra de desplazamiento. Ancho del Borde El espesor del borde entre los marcos especificado en píxeles. Permitir modificar el tamaño del marco en el navegador Si selecciona esta opción.4.El nombre del marco en el que se abrirán aquellos documentos referidos por los vínculos encontrados en este marco. Si se fija el ancho del borde a 0. entre el borde superior o izquierdo del marco y su contenido. No confunda las propiedades del marco con las del documento abierto en el marco. El valor predeterminado es 5.5 Cambiando el tamaño de los marcos.) Este ajuste se aplica al conjunto completo de marcos. Las propiedades de un documento en un marco son idénticas a las de un documento solo.) Margen izquierdo / superior La cantidad de espacio. (Vea la sección 5. pueden ser vistas y modificadas dentro del diálogo Propiedades del Documento (Formato > Propiedades del Documento). Alto / ancho del marco El ancho y alto del marco. si fija el ancho del borde a 4 o menos.

En la solapa General: Título.4. pero los navegadores muy antiguos o básicos no pueden.4.) Las propiedades del documento del conjunto de marcos que son relevantes cuando el navegador puede desplegar los marcos se listan a continuación. haga clic en la solapa Mensaje en la parte inferior de la ventan de Edición. Se requiere un navegador Web que incluya marcos para poder verla. sin embargo. El mensaje predeterminado es “Esta página contiene marcos. Palabra clave. El sonido seleccionado se reproducirá cuando el conjunto de marcos sea abierto. su contenido es invisible debido a que la mayoría de los navegadores modernos sí incluyen el uso de marcos. Las palabras del documento que pueden ser usadas por las máquinas de búsqueda de Internet. tiene propiedades como cualquier otro. Por lo tanto. El título del documento que se muestra en la barra de título del navegador. Para ver o modificar las propiedades del documento. la mayoría de sus propiedades son irrelevantes.” El mensaje es solamente el contenido del documento del conjunto de marcos. aunque es posible cambiarlas todas. se puede editar como cualquier otro documento Web.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.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. Sonido de fondo. Normalmente. Sin embargo. (Todas las propiedades son relevantes si el navegador usado para ver el conjunto de marcos no los puede desplegar. Marcos y conjuntos de marcos 139 . use el comando Marcos > Propiedades de los marcos. 5. Es en estos navegadores donde el mensaje se despliega cuando el usuario intenta abrir un conjunto de marcos. La mayoría de los navegadores modernos — incluyendo las últimas versiones de Netscape e Internet Explorer — pueden desplegar marcos. Para ver o modificar el mensaje. El efecto seleccionado operará en el conjunto de marcos como una unidad. como un documento de un conjunto de marcos es invisible para los visitantes del sitio. en cuyo caso desplegará el contenido del documento del conjunto de marcos — usualmente mensaje para navegadores que no usan marcos. En la solapa Estilos: Efectos de página avanzados. tal como lo haría con cualquier otro documento web.5.

trataremos el proceso de creación.En la solapa Avanzado: URL para ir a: El documento especificado será abierto. un gran marco del lado derecho que desplegará los documentos a los cuales se refieren los vínculos que se encuentran en el marco de la izquierda. crearemos un nuevo conjunto de marcos utilizando una de las plantillas localizadas dentro del diálogo Nuevo. 5.11 Un ejemplo de conjunto de marcos Alguno de los conceptos con respecto a los conjuntos de marcos puede ser difícil de entender la primera vez que se crea uno de ellos. de edición y de guardar un ejemplo de conjunto de tres marcos: un pequeño marco en la parte superior utilizado como titular. 1 Use el comando Archivo > Nuevo para abrir el diálogo Nuevo. Haga clic sobre el botón Aceptar. un marco angosto en el lado izquierdo que contendrá la lista de vínculos y finalmente. Contenido. 2 Cambie a la solapa Marcos y seleccione la plantilla llamada “Titular. He aquí cómo se vería nuestro nuevo conjunto de marcos vacío dentro de la ventana de Edición: 140 Capítulo 5 Edición Avanzada de un Documento . Primero. En esta sección.4. reemplazando el conjunto de marcos dentro de la ventana del navegador. Cuerpo”.

Ahora colocaremos una lista de vínculos en el marco izquierdo (el marco de “contenido”).Ahora crearemos un titular sencillo agregando unas cuantas palabras en el marco superior (el marco “titular”.htm) y haga clic sobre el botón Guardar. Ya hemos creado nuestro documento del titular. ahora necesitamos guardarlo. Crearemos una lista de vínculos a algunos documentos que ya hayamos previamente creado y guardado. si no está activado ya. seleccione una carpeta donde guardará el documento. proporcione un nombre de archivo (usaremos banner. 7 Use el comando Archivo > Guardar. cada uno en su propio párrafo. 10 Escriba el nombre de los documentos. 12 Dele el formato deseado al texto. 5 Dele el formato deseado al texto. 9 Haga clic dentro del marco de contenido para activarlo. 11 Cree un vínculo en cada uno de los nombres que apunte al documento correspondiente dentro del disco duro. 6 Haga que el marco del titular se active. tales como “Recorrido por Namo WebEditor 4”. 8 En el diálogo Guardar como.) 3 Haga clic dentro del marco de titulares para activarlo. 4 Escriba algunas palabras. Nuestro conjunto de marcos ahora se ve así: Marcos y conjuntos de marcos 141 .

Cuando los visitantes a nuestro sitio web abran este conjunto de marcos en su navegador. La apariencia ha mejorado.htm. si no está activado ya. primero tenemos que abrir el documento deseado dentro del marco. así que hagamos el marco de contenido un poco más ancho. utilicemos esto como el documento predeterminado del marco de detalle. Este marco desplegará los documentos a los cuales se refieren los vínculos dentro del marco de contenido. Ahora tenemos que definir el documento predeterminado para el marco de “detalle” (el marco grande a la derecha). será el primer documento que verán en el marco. Puesto que el primer documento listado dentro del marco de contenidos es una introducción. 14 Active el marco de contenido.Uno de los vínculos dentro del marco de contenido es demasiado largo para caber en una sola línea. en la misma carpeta donde guardó banner. No estamos satisfechos con esto. Guardemos el documento del marco de contenido. Para fijar el documento predeterminado del marco de detalle. 15 Guarde el documento del marco del contenido (Archivo > Guardar) con el nombre links. 13 Haga clic sobre el borde derecho del marco de contenido y arrástrelo un poco hacia la derecha. 142 Capítulo 5 Edición Avanzada de un Documento .htm.

el marco de detalle ya tiene un nombre — “detalle” — puesto que el nombre ha sido predefinido dentro de la plantilla del conjunto de marcos. abra la carpeta deseada y proporcione el nombre del documento (en nuestro caso le llamaremos feature_tour. 25 En la lista Marco predeterminado destino. 23 Haga clic dentro del marco de contenido para activarlo. El siguiente paso es importante. He aquí cómo se ve nuestro conjunto de marcos en este momento. 17 Use el comando Marcos > Abrir Documento en Marco. 22 Finalmente. Necesitamos hacer que el marco de detalle sea el destino predeterminado del marco de contenidos. 19 Use el comando Marcos > Guardar Marcos. con el archivo intro. el documento concerniente se abra en el marco de detalle.htm abierto en el marco de detalle: Para terminar definiendo a intro.htm) y haga clic en Abrir. haga clic en Guardar.htm como nuestro documento predeterminado dentro del marco de detalle. de tal forma que cuando un visitante del sitio web haga clic en alguno de los vínculos del marco de contenidos. Marcos y conjuntos de marcos 143 . 18 Seleccione el documento de introducción (intro. 20 En el diálogo Guardar como.) 26 Haga clic sobre el botón Aceptar. (Afortunadamente.16 Haga clic dentro del marco de detalle para activarlo. seleccione el nombre del marco a ser utilizado como destino predeterminado. Teclee el título deseado dentro del recuadro Título.htm) 21 Podemos aprovechar para fijar un título al documento de los marcos. 24 Use el comando Marcos > Propiedades del Marco para abrir el diálogo Propiedades del Marco. primero necesitamos salvar el documento que contiene a los marcos.

28 Haga clic en la solapa Vista Previa de Marcos en la parte inferior de la ventana de Edición. He aquí nuestro conjunto de marcos tal como se ve dentro de la ventana de Vista Previa de Marcos. se abra dentro del marco de detalle. una vez que se hace clic en el tercer vínculo del marco de contenido.Casi hemos terminado. tal como lo queríamos desde un principio. 144 Capítulo 5 Edición Avanzada de un Documento . Hemos terminado. verificando que el documento al cual se refiere. también deberíamos guardar todos los documentos que se encuentran en los marcos. La última acción a realizar es volver a guardar el documento con el conjunto de marcos. Veamos cómo queda nuestro conjunto de marcos dentro de la ventana Vista Previa de Marcos para asegurarnos de que los vínculos dentro del marco de contenido abren el marco de detalle. Creamos un conjunto de marcos consistente en tres marcos básicos. Haga clic en cualquiera de los vínculos del marco de contenidos. Ya que estamos en ello. 27 Use el comando Marcos > Guardar Todos. para asegurarnos que todo ha sido almacenado.

6 Haga clic sobre el botón Aceptar. En la imagen siguiente. Esto abrirá el diálogo Hoja de Cálculo. sin crear un vínculo. mostramos una tabla de ejemplo tal como se ve dentro de Excel y luego cómo se ve una vez que se ha importado a un documento web.1 Importando una hoja de cálculo como una tabla estática Si solamente desea importar una hoja de cálculo Excel y convertirla en una tabla estándar HTML. 3 Bajo Origen. sino que se puede crear un vínculo a la hoja de cálculo original o incrustar una copia de forma invisible dentro del documento Web. 2 Seleccione el comando Importar > Avanzado > Hoja de Cálculo. Esto permite editar la tabla original dentro de Excel sin tener que volver a importarla. mucho más conveniente que volver a teclear toda la información. seleccione Importación estática.5. localice y seleccione la hoja de cálculo Excel a importar en su disco duro y haga clic sobre Abrir. Excel se abrirá momentáneamente mientras la hoja de cálculo se inserta dentro del documento como una tabla estática HTML. haga lo siguiente: 1 Coloque el punto de inserción en la posición del documento activo en el cual desea insertar la tabla importada. 5. 5 Bajo Método de inserción. No sólo es posible importar una tabla de Excel. 4 En el diálogo Abrir. Ahora se le puede dar formato a la tabla según se requiera. seleccione Archivo Excel y haga clic en el botón Examinar. Importando hojas de cálculo 145 .5. puede copiarla con toda facilidad a una tabla dentro de un documento web al utilizar la característica de importación de Namo WebEditor.5 Importando hojas de cálculo Si tiene alguna información dentro de una hoja de cálculo de Microsoft Excel.

Para importar una hoja de cálculo de Excel ya sea vinculando o incrustando. los cambios que se realizan dentro de Excel se reflejan de forma instantánea y automática dentro de la tabla HTML. 146 Capítulo 5 Edición Avanzada de un Documento .2 Importando una hoja de cálculo vinculando o incrustando Si vinculamos o incrustamos la hoja de cálculo original dentro del documento web al importarla.5. 5. De esta manera. a expensas de incrementar el tamaño del archivo del documento Web. mantendremos la habilidad de editar la tabla posteriormente en Excel.Antes de importar Después de importar Se trata de mantener tanto del formato original de la tabla como sea posible cuando se importa hacia un documento web. haga lo siguiente: 1 Coloque el punto de inserción en la posición del documento donde desea insertar la tabla importada. 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 cálculo dentro de un documento web removemos la dependencia del archivo original.

cierre el documento o salga de Excel. Si se edita la tabla en Excel. incruste una copia de la hoja de cálculo original dentro del documento web en lugar de utilizar vínculo. puede editar directamente el contenido de la hoja de cálculo original (sin tener que usar el comando Editar Hoja de Cálculo de Namo WebEditor) y luego actualizar la tabla dentro del documento web al presionar con el botón derecho del ratón sobre ella y seleccionando Actualizar Contenido de la Hoja de Cálculo en el menú de atajo. Por lo tanto. Excel le pedirá que guarde los cambios realizados. 3 Bajo Origen. localice y seleccione la hoja de cálculo Excel que desea importar en su disco duro y haga clic sobre el botón Abrir. 3 Una vez que termine de realizar los cambios. Después de una breve pausa. Si se importa una hoja de cálculo vinculándola. 2 Edite la hoja de cálculo. no modifique el contenido o el formato de la tabla dentro de la ventana de Edición a menos que no planee modificar su contenido dentro de Excel. dependiendo si se seleccionó vincular o incrustar. Para evitar este problema. seleccione Archivo Excel y haga clic en Examinar. Excel se abrirá ya sea con la hoja de cálculo original o con un archivo temporal que contiene la tabla. Si importa una hoja de cálculo utilizando vinculación y luego mueve el archivo original. cualquier cambio que se haya realizado dentro de la ventana de Edición se perderá y el contenido de la tabla y su formato cambiarán de nuevo al original que se encuentra en Excel. 5 Bajo Método de Inserción. seleccione Vincular a la hoja de cálculo original o Incrustar en documento HTML. 6 Haga clic sobre el botón Aceptar.2 Seleccione el comando Importar > Avanzado > Hoja de Cálculo. Importando hojas de cálculo 147 . haga lo siguiente: 1 Haga clic con el botón derecho del ratón en cualquier parte dentro de la tabla y seleccione Editar Hoja de Cálculo menú de atajo. solamente hágalo en Excel. mientras que la hoja de cálculo se inserta en el documento como una tabla HTML. el vínculo quedará “roto” y no será posible volver a editar la tabla en Excel. 4 En el diálogo Abrir. Si la hoja de cálculo original se encuentra vinculada. la tabla dentro del documento Web será actualizada con los últimos cambios. Para editar la tabla importada dentro de Excel. Excel se abrirá momentáneamente. si desea cambiar el contenido o formato de la tabla. Esto abrirá el diálogo Hoja de Cálculo. Una vez que se ha importado una hoja de cálculo utilizando vínculo o incrustación.

seleccione Incrustar en documento HTML. haga lo siguiente: 1 Coloque el punto de inserción dentro de la tabla. Excel se ejecutará y desplegará la tabla. salga de Excel. puede realizar algún cambio en este momento. Una vez que salga de Excel. para posteriormente salir de Excel. 3 Bajo Origen. Ahora será posible editar la tabla usando Excel en cualquier momento al hacer clic sobre ella con el botón derecho del ratón y seleccionar Editar Hoja de Cálculo dentro del menú de atajo.5. 2 Seleccione el comando Importar > Avanzado > Hoja de Cálculo. 148 Capítulo 5 Edición Avanzada de un Documento .5. 5 Haga clic sobre el botón Aceptar. 6 Si desea. seleccione Tabla activa en el documento. reemplazando la anterior. la tabla volverá a ser insertada en el documento. Si no quiere hacer cambios. Esto abrirá el diálogo Hoja de Cálculo. 4 Bajo Método de inserción.3 Convirtiendo una tabla existente Para hacer que una tabla existente dentro de un documento web se pueda editar en Excel.

Una vez que se ha creado el gráfico. tal como se muestra en el siguiente ejemplo: Creando un gráfico desde una tabla 149 .1 Conceptos básicos de gráficos Antes de comenzar a usar el Asistente de Gráficos.) en cualquier momento.UU. el Asistente de Gráficos puede tomar las etiquetas y valores de la siguiente tabla: 1997 Canadá EE. Se puede inclusive borrar esta tabla.6 Creando un gráfico desde una tabla El Asistente de Gráficos de Namo WebEditor crea una gran variedad de gráficos de los valores numéricos de una tabla. Francia 251 302 232 1998 320 380 265 1999 454 490 364 2000 497 545 423 y crear esta gráfica: El gráfico es insertado en el documento como una imagen GIF estándar. Por ejemplo. Los gráficos más sencillos son aquellos que solamente tienen una serie de datos. el gráfico se mantendrá en su sitio con sus valores. éste ya no depende de la tabla de la cual toma sus valores. pero es posible editar sus propiedades (valores de los datos.5. colores. 5. Cada tabla o gráfica tiene por lo menos una serie de datos — un conjunto de valores que cambia con el tiempo o conforme otra variable cambia. tipo de gráfico. debe familiarizarse con dos conceptos básicos de las tablas y los gráficos: series de datos y categorías.6. Namo WebEditor generará una nueva imagen. etc.

En el primero de los dos gráficos de ventas mostrados arriba. Existen tres series de datos: Canadá. los gráficos más complejos tienen normalmente más de una serie de datos. Estados Unidos y Francia. 150 Capítulo 5 Edición Avanzada de un Documento . si intercambiamos las series y las categorías de forma tal que los productos se vuelvan series y los países categorías. (Dentro de una serie de datos.) Los productos — Productos A. la única serie de datos es la altura de Juan. tal como se muestra en el siguiente ejemplo: El gráfico compara las ventas unitarias en tres países de cuatro productos. — se denominan categorías. Sin embargo. obtenemos el siguiente gráfico: La forma de organizar el gráfico en series y categorías depende de qué se desea comunicar. Cada categoría tiene un valor de la serie de datos asociado. el objetivo primario comparado eran los tres países y esa comparación se realizaba en cuatro categorías (productos). Siguiendo con el mismo ejemplo. todos los valores se representan con el mismo color. En el segundo gráfico la comparación era realizada entre los cuatro productos y esta comparación se realizaba en tres categorías (países). Producto B. que muestra los cambios de la altura de Juan en diez años.En el gráfico superior. etc.

se debe decidir si se quiere crear un gráfico utilizando todas las celdas de una tabla o solamente parte de ellas.6. una descripción aparece debajo del área de selección. el gráfico se inserta debajo de la tabla. El asistente consiste de tres pasos. barras.Para resumir. coloque el punto de inserción en cualquier lugar dentro de la tabla. Si se desea solamente utilizar una parte de las celdas. utilizaremos la tabla de ejemplo que mostramos en la sección precedente. Los tipos básicos disponibles son: columnas. Luego se selecciona el tipo usando los iconos grandes dentro del recuadro de selección. descritos en las siguientes tres secciones. anillos y radial. Para propósitos de describir las varias opciones.3 Paso 1: Seleccionar el tipo de gráfico Como primer paso se debe seleccionar un gráfico básico a utilizar usando los botones que se encuentran en la parte superior del diálogo. área apilada. donut (dona). primero se debe seleccionar.6. los valores que se comparan se agrupan en categorías y cada categoría tiene un valor de la serie de datos. 5.2 Ejecutando el Asistente de Gráficos Antes de iniciar el Asistente de Gráficos. El siguiente paso es utilizar el comando Insertar > Avanzado > Gráfico para iniciar el Asistente de Gráficos. Creando un gráfico desde una tabla 151 . circular. 5. línea. Una vez que se hayan completado todos los pasos del asistente. Si se desea utilizar toda la tabla. Cuando se hace clic sobre un icono.

(Esta opción no se encuentra disponible para gráficos de línea. muchas veces esto no resulta.) Si selecciona la opción Usar efecto 3D. con la posible excepción de la primera. dispersos. contiene una serie de datos y que cada renglón. el asistente lee internamente de esta forma los datos.4 Paso 2: Especificar series y categorías En el segundo paso del Asistente de Gráficos. Al seleccionar esta opción no realizamos una transposición de renglones y columnas dentro de la tabla. En general. puede también especificar la profundidad del efecto y el ángulo de perspectiva. refiérase al tema Tipo de gráfico bajo Creando Gráficos del sistema de ayuda en línea de Namo WebEditor. 5.6. Si su tabla está ordenada de otra forma — con las series de datos en los renglones y las categorías en las columnas — seleccione la opción Intercambiar ejes X/Y. Para las descripciones y ejemplos de los varios tipos de gráficos. utilice la opción Usar efecto 3D en la sección Efecto 3D.Si requiere de un efecto en tercera dimensión. Aunque el asistente intenta adivinar de forma inteligente cómo debe leer la tabla. contiene una categoría. en lugar de valores precisos. sino que. Esta representación 152 Capítulo 5 Edición Avanzada de un Documento . área apilada o radial. Muchas veces el usar efectos en tercera dimensión hace difícil leer el gráfico de forma precisa. Haga clic en el botón Siguiente para continuar con el próximo paso del asistente. con la posible excepción del primero. solamente se deben usar estos efectos si se quieren comunicar valores de tamaño relativos. éste “lee” la tabla para crear el gráfico deseado. El asistente supone que cada columna de la tabla. En este paso se le da la oportunidad de corregir cualquier interpretación errónea que haga el asistente.

la opción Primera columna contiene nombres de categorías. el asistente intenta adivinar si el primer renglón (en su representación interna de la tabla) contiene nombres de series o valores. Si la columna verde contiene elementos que no deben ser tratados como valores. quite la opción Primer renglón contiene nombres de series. Esto hará que los nombres de las categorías pasen a la columna verde. El asistente. Para verificar la decisión del asistente. Basándose en el contenido de la tabla. el asistente intentará adivinar si la primera columna (en su representación interna de la tabla) contiene nombres de categorías o valores. Esto hará que los valores se muevan a la derecha. de forma automática.interna se despliega dentro del área de vista previa en la parte superior derecha del diálogo del Asistente de Gráficos. Para verificar las decisiones del asistente. Si la columna verde se encuentra vacía y en la columna blanca a su derecha están los elementos que deben ser tratados como nombres de categorías. dependiendo de su selección. Si el renglón amarillo se encuentra vacío y el renglón blanco debajo de él contiene elementos que deben de ser tratados como nombres de series. examine el renglón amarillo marcado Series en el área de vista previa. Verifique la apariencia del gráfico en el área Vista previa del gráfico y luego presione sobre el botón Siguiente para continuar con el tercer y último paso del asistente. dentro del área de datos. De manera similar. automáticamente. selecciona o no la opción Primer renglón contiene nombres de series. El asistente selecciona o no. examine la columna verde marcada como Cat en el área de vista previa. quite la opción Primera columna contiene nombres de categorías. dependiendo de su decisión. seleccione la opción Primer renglón contiene nombres de series. Esto hace que los valores se muevan dentro del área blanca de la zona de vista preliminar. Esto hará que los nombres de las series pasen al renglón amarillo. Creando un gráfico desde una tabla 153 . Si el renglón amarillo contiene elementos que no deben ser tratados como valores. seleccione la opción Primera columna contiene nombres de categorías.

6 Cambiando de tamaño y modificando un gráfico Para cambiar el tamaño de un gráfico. primero selecciónelo haciendo clic sobre él y luego haga clic sobre cualquiera de sus manijas y arrástrela al tamaño deseado. En la primera. se puede cambiar el tipo o subtipo de gráfico. permite seleccionar la localización de la leyenda de gráfico u ocultarla. Título. Además. se selecciona su posición y. se le coloca un nombre a los ejes. 5. equivale al tercer paso del Asistente de Gráficos.5. opcionalmente. Varias opciones y propiedades del gráfico pueden ser modificadas dentro del diálogo Propiedades del Gráfico.5 Paso 3: Especificar el título de un gráfico En este último paso del Asistente de Gráficos. Tipo.6. La segunda solapa. Proporcione un título para el gráfico dentro del recuadro Título del gráfico y su posición usando los botones de opción Localización del título del gráfico. equivale al primer paso del Asistente de Gráficos. permite cambiar los títulos del gráfico y los ejes. se le da un título opcional al gráfico. 154 Capítulo 5 Edición Avanzada de un Documento . Las solapas restantes que se encuentran dentro del diálogo Propiedades del Gráfico son descritas en las siguientes cinco secciones. Para abrir este diálogo. puesto que Namo WebEditor genera una nueva imagen GIF cada vez que el gráfico cambia. haga doble clic sobre el gráfico. Verifique la apariencia del gráfico en la Vista Previa del Gráfico y luego haga clic sobre el botón Finalizar para salir del Asistente de Gráficos. El gráfico será insertado bajo la tabla de la cual fue creado. Los títulos de los ejes X / Y se ajustan en Títulos de los ejes. Los gráficos pueden cambiarse al tamaño deseado sin pérdida de calidad.6. El diálogo contiene siete solapas.

El nombre de la serie se utiliza para identificarla en el título del gráfico. Las opciones se describen a continuación. en las etiquetas de los ejes y rótulos de los datos — mantienen el mismo tamaño. le permite seleccionar una posición para la leyenda del gráfico u ocultarla.6. cuya escala se encuentra del lado izquierdo del gráfico. sus elementos de texto — tales como el título. Para graficar una serie seleccionada en un eje Y alterno. el nombre puede ser cambiado. (Use los parámetros dentro de la solapa Ejes para modificar sus propiedades. Si eligió la opción Primer renglón tiene el nombre de las series en el segundo paso del Asistente de Gráficos. De otra manera. puede teclear el nombre seleccionado dentro del recuadro. Para modificar las opciones de una serie. El tamaño de los elementos de texto puede ser modificado dentro de la solapa Formato del gráfico del diálogo Propiedades del Gráfico (vea la sección 5.6.11 más abajo). elija la opción Alternar eje. los valores de todas las series se grafican en el eje primario Y. La escala del eje alterno se agrega del lado derecho del gráfico.) Mostramos a continuación un ejemplo de un gráfico con un eje Y primario y alterno: Creando un gráfico desde una tabla 155 . Nombre de las series El nombre de la serie seleccionada.Cuando se cambia el tamaño de un gráfico. primero selecciónela dentro de la lista que se encuentra a la izquierda del diálogo. Graficar serie en De manera predeterminada. Además.7 Modificando las opciones de las series La solapa Series del diálogo Propiedades del Gráfico permite modificar ciertas opciones para cada una de las series de datos en un gráfico. 5.

Dentro de esta solapa podemos también intercambiar los ejes del gráfico. El Asistente de Gráficos copia los nombres y valores de la tabla a una parte del documento que se mantiene invisible dentro de la ventana de Edición o en un navegador.6. Se pueden.8 Editando los valores en un gráfico Una vez creada. Es esta copia la que permite que el gráfico se despliegue. 156 Capítulo 5 Edición Avanzada de un Documento . Como resultado de esto. Nombre de las series y Valores de los datos. se puede elegir extraer o elevar una de las “rebanadas” correspondientes a una serie seleccionada. sin embargo. Aún si se borra la tabla. Las elecciones disponibles son Ninguna. la gráfica no depende de la tabla de la cual fue generada. editar los valores de un gráfico utilizando la solapa Valores del diálogo Propiedades del Gráfico. Opciones gráfico circular 3D Para un gráfico del tipo circular o donut con efecto de tercera dimensión habilitado. de forma tal que las series de datos se vuelvan categorías y viceversa. no se pueden editar los valores del gráfico cambiando los de la tabla de la cual fue creada. para hacer que resalte de las otras.Etiquetas de los Datos Seleccione un tipo de etiqueta para agregar a cada uno de los puntos de datos. barras o líneas pueden tener barras de errores dentro de ciertos puntos en cualquier serie. Barra de Error Los gráficos de columnas. 5. Seleccione el tipo de barra de error dentro de la lista y luego el formato utilizando los botones de opción. Leyenda Seleccione la posición de la leyenda o utilice la opción Ocultar leyenda para no mostrarla. esto no tiene ningún efecto sobre el gráfico.

Presione varias veces las teclas <Ctrl + Z> para deshacer cambios múltiples. haga clic con el botón derecho del ratón sobre el área gris que se encuentra a la derecha del último encabezado de columna. Para agregar una nueva serie de datos. Para deshacer cualquier cambio. haga doble clic sobre el gráfico y proporcione el nuevo nombre o valor.9 Agregando y eliminando series de datos o categorías Puede usar la solapa Valores para agregar o eliminar series de datos o categorías dentro del gráfico editando aquellas que se encuentran dentro de la tabla en la parte superior del diálogo. De manera alternativa. Para editar un nombre o un valor.6. presione las teclas <Ctrl + Z>. seleccione la celda que contiene el nombre o valor a cambiar y modifíquelo dentro del recuadro Valor.La tabla en forma de hoja de cálculo en la parte superior del diálogo despliega los nombres de las series. 5. haga clic con el botón derecho del ratón dentro del encabezado de la columna y seleccione el comando Insertar Columnas dentro del menú de atajo. Creando un gráfico desde una tabla 157 . Haga clic en el botón Intercambia ejes X/Y para alternar las series de datos y categorías dentro del gráfico. nombres de las categorías y valores utilizados en el gráfico. 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.

Para eliminar una serie de datos o categoría. haga clic con el botón derecho del ratón sobre el área gris que se encuentra debajo del último encabezado de renglón. 5. Para agregar una nueva categoría al final de todas. 158 Capítulo 5 Edición Avanzada de un Documento . proporcione sus nombres y valores directamente en la tabla haciendo doble clic en cada una de las celdas o utilizando el recuadro Valor. 3 Si el tipo seleccionado de tendencia es Promedios variables. Para deshacer cualquier cambio. especifique el Intervalo en Opciones de la tendencia. La nueva categoría se inserta en el renglón superior del seleccionado. Una vez que se ha agregado una serie de datos o categoría.6. presione las teclas <Ctrl + Z>. Si seleccionó Polinomial. haga clic con el botón derecho del ratón sobre el encabezado del renglón y seleccione el comando Insertar Renglones en el menú de atajo. especifique el Grado en Opciones de la tendencia. 2 Seleccione un tipo de línea de tendencia en la lista Tipo de tendencia. Para agregar una tendencia a una serie.Para agregar una nueva categoría.10 Agregando líneas de tendencia La solapa Tendencia del diálogo Propiedades del Gráfico permite agregar una línea de tendencia a cualquier serie de datos de un gráfico. Presione varias veces las teclas <Ctrl + Z> para deshacer cambios múltiples. haga lo siguiente: 1 Seleccione la serie en la lista Seleccionar serie. haga clic con el botón derecho del ratón en el encabezado correspondiente del renglón o columna y seleccione el comando Borrar Columnas o Borrar Renglones del menú de atajo.

Se puede también editar el título del eje seleccionado dentro del recuadro Título. existen dos del tipo logarítmico. seleccione la opción Mostrar líneas de tendencia en la leyenda en Opciones de la tendencia.12). Si desea mostrar la serie de datos y tipo de cada una de las líneas de tendencia. los rangos de escala e intervalos entre las rejillas se configuran de forma automática.6. selecciónelo dentro de la lista Tipo de escala. del eje secundario Y de un gráfico. estilo y espesor de cada una de las líneas de tendencia se pueden modificar dentro de la solapa Formato de gráfico (vea la sección 5. Para hacerlo manualmente. La línea seleccionada de tendencia aparecerá dentro de la lista Desplegar tendencias. los intervalos entre las rejillas mayores y el número de rejillas menores entre las mayores.11 Modificando las opciones de los ejes La solapa Ejes del diálogo Propiedades del Gráfico le permite configurar la escala del eje primario Y y. Creando un gráfico desde una tabla 159 . 5. si existe. El color. Además de la lineal. deshabilite la opción Configurar rango de datos automáticamente y luego proporcione los valores máximos y mínimos.4 Haga clic en el botón Agregar. Primero debe seleccionar el eje Y a modificar dentro de la lista que se encuentra en el lado izquierdo del diálogo. De manera predeterminada.6. Para cambiar el tipo de escala del predeterminado lineal a cualquier otro.

5. Líneas / bordes y Datos. Por ejemplo. Algunos elementos cuentan con propiedades opcionales que se encuentran ocultas de manera predeterminada. Use las opciones Vista previa del elemento y Vista Previa del Gráfico para verificar los efectos de cualquier modificación que se haga a un elemento. primero selecciónelo dentro de la lista que se encuentra en la parte izquierda del diálogo. La categoría Datos es la única que se puede aplicar a series de datos. el título principal puede tener un color de fondo y un borde. por ejemplo. “[3] Francia”. 160 Capítulo 5 Edición Avanzada de un Documento . “Francia. No todas las categorías se pueden aplicar a cualquier elemento del gráfico. Las propiedades de la apariencia se dividen en cuatro categorías: Texto. Si el gráfico cuenta con líneas de tendencia. seguido por el tipo de tendencia.6. Si una categoría no se puede aplicar a un elemento seleccionado. pero estos se encuentran ocultos en un principio.12 Modificando la apariencia de un gráfico La solapa Formato del gráfico del diálogo Propiedades del Gráfico permite modificar la apariencia de cualquiera de los elementos del gráfico. Cada serie de datos se encuentra dentro de la lista con un número entre paréntesis cuadrados. seguida por el nombre de la serie. las opciones dentro de esa categoría se encuentran en un tono gris (deshabilitadas). Color. Para modificar la apariencia de un elemento. por ejemplo. los atributos de texto no pueden aplicarse a las rejillas. Para hacer visible una propiedad y seleccionar un parámetro para ella. Por ejemplo. deshabilite la opción Ocultar localizada a un lado del control de la propiedad. Lineal”. cada una de ellas se encuentra dentro de la lista por el nombre de la serie de datos a la cual se aplica. si existe.

4 Haga clic sobre el botón Aceptar.. 3 En el recuadro Guardar ecuaciones e imágenes de gráficos en. La misma carpeta que la del documento. Cuando se publica un documento que contiene gráficos. Namo WebEditor guarda las imágenes de los gráficos en una carpeta llamada “images” dentro de la carpeta que contiene el documento con el gráfico. Cualquier color o imagen aplicada al fondo del documento será visible a través del gráfico. 5.\images\ Localización de la carpeta Una subcarpeta de la carpeta del documento.\ . haga lo siguiente: 1 Use el comando Herramientas > Preferencias para abrir el diálogo Preferencias. 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. asegúrese también de publicar la carpeta donde están las imágenes de los gráficos.6. Esta carpeta se crea de forma automática si no existe. proporcione la ruta de acceso a la carpeta en la cual se almacenarán las imágenes de los gráficos. Ruta de la Carpeta images\ images\charts\ .13 Cambiando la carpeta predeterminada de los archivos de imagen de un gráfico De forma predeterminada. Una subcarpeta de una subcarpeta de la carpeta del documento. Namo WebEditor guarda la imagen de gráfico que contiene en el directorio C:\html\images. todas las nuevas imágenes de gráficos se almacenarán en la carpeta especificada relativa a aquélla en la cual se almacenan los documentos. el fondo de gráfico será transparente. A continuación mostramos algunos ejemplos de caminos de acceso relativos. Por ejemplo. en términos relativos al directorio donde se encuentra el documento. Cualquier imagen de un gráfico ya existente en un documento abierto se copia a la nueva carpeta cuando el documento se guarda. De este momento en adelante. Para cambiar la carpeta en la cual se guardan los gráficos de las imágenes.. si un documento que contiene un gráfico es almacenado en el directorio C:\html.Si selecciona Fondo en la lista de elementos y Ocultar en la categoría de Color. Sin embargo. Creando un gráfico desde una tabla 161 . Una carpeta al mismo nivel que la carpeta del documento. 2 Cambie a la solapa Editar Preferencias.\ . La carpeta padre de la carpeta donde se encuentra el documento.

El formulario tiene por lo menos un botón — el botón de “envío” — que hace que el navegado envíe información al servidor cuando se presiona sobre él. El método principal de recolectar información de un visitante de un sitio web es el formulario. (El botón de envío puede ser invisible. Un formulario es un área dentro del documento web en la que el visitante del sitio puede proveer información que se envía al servidor web. El formulario contiene una serie de elementos del formulario. sino que también puede enviar la información al servidor que sirve de anfitrión a este sitio. la forma se envía a otra persona o a una organización entregándola a un tercero.7 Creando formularios Web Uno de los factores que hacen que la web tenga tanto éxito es que es un medio de dos vías: no solamente la gente puede obtener información del sitio web. en cuyo caso al presionar la tecla <Intro> mientras el punto de inserción se encuentra en una caja de texto. hace que la información se envíe al servidor. En el caso de los formularios web.5. En el caso de un formulario de papel. que son elementos tales como cajas de texto y botones de opción que el visitante utiliza para registrar su información o sus elecciones. Estos elementos incluyen campos del formulario y/ o controles de selección. colocándola en una caja de entrada o enviándola por correo. Mostramos a continuación un ejemplo sencillo de un formulario que puede ser utilizado por un cliente para realizar un pedido en línea: 162 Capítulo 5 Edición Avanzada de un Documento . el formulario se envía al servidor web al presionar un botón dentro de la ventana del navegador.) Se puede pensar en un formulario web como una versión electrónica de un formulario en papel. En ambos casos. una persona llena la forma y luego la envía o entrega a alguien. Esta información puede ser procesada y usada por el operador del sitio de varias maneras.

) Para la imagen del ejemplo anterior. como un programa que genere dinámicamente un documento web cuya información 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. El programa puede ser tan sencillo que solamente inserte la información dentro de la base de datos de la compañía o puede ser algo mucho más sofisticado. El nombre del elemento es parte de su definición. No es necesario hacer nada especial para comenzar un formulario — al insertar el primer elemento. (Existe una excepción a esta regla: se puede crear un formulario que utilice el navegador web para enviar información a una dirección de correo electrónico.Cuando el visitante del sitio presiona sobre el botón de envío de un formulario. Para que un formulario web sea útil. Esto no requiere ningún programa del lado del servidor. Namo WebEditor no incluye ninguna funcionalidad para manejar el formulario.1 Creando un formulario e insertando elementos Para crear un formulario. sencillamente inserte aquellos elementos que serán utilizados dentro del documento utilizando el submenú Campo de Formulario del menú Insertar. debe existir un programa del lado del servidor al cual se envía la información para realizar algo con ella. el navegador envía los elementos del formulario nombre y valor a un servidor web.7.) 5. Se debe instalar un programa del lado del servidor web que pueda manejar el formulario. la presencia Creando formularios Web 163 . la información que se envía al servidor podría ser la siguiente: nombre=Julia Sánchez calle=Mi calle 123 ciudad=Pueblillo estado=MD cp=32256 email=jsan@kasdjkdj. Dentro de la ventana de edición. (El nombre y valor de un control de selección.com producto=nw4 paga con tarjeta crédito=sí visa_mc=sí número=1234 5678 9012 3456 mes exp=12 año exp=00 envia=Envia pedido Note que el nombre del elemento del formulario no es el mismo que su etiqueta. si no se ha deshabilitado la opción de desplegar las marcas especiales de etiquetas (Ver > Marcadores > Marcas especiales de etiquetas). que es almacenada dentro del código fuente HTML del documento. que aparece como un texto común y corriente a un lado del elemento. todos aquellas etiquetas y marcas necesarias del formulario para que sea reconocido por un navegador Web se insertan de forma automática en el documento. no son enviados a menos que sean seleccionados. puesto que el navegador mismo maneja el formulario.

) La razón para hacer esto es que cuando se inserta un elemento de un formulario dentro de la celda de una tabla. (Deshabilite Insertar > Campo de Formulario > Insertar etiquetas de formularios si se encuentra habilitada. se debe evitar que Namo WebEditor cree un nuevo formulario con cada celda al deshabitar la inserción automática de etiquetas de formulario. Para hacer esto. si quiere crear más de un formulario en el mismo documento. Si desea evitar que Namo WebEditor inserte de manera automática las etiquetas del formulario al insertar el primer elemento. asegúrese de mover el punto de inserción fuera del borde del formulario antes de agregar otro. Este elemento del menú se encuentra activo de forma predeterminada. En el diálogo Propiedades del Formulario. las etiquetas se insertan alrededor de la tabla. Sin embargo. Una vez que se cierra el diálogo. Por otro lado. creará inadvertidamente dos o más formularios separados. cada elemento de un formulario debe tener una etiqueta. especifique los parámetros del formulario o haga clic sobre el botón Aceptar para cerrar el diálogo y especificar los ajustes posteriormente. tal como se muestra en la siguiente imagen. deshabilite la opción Insertar > Campo de Formulario > Insertar etiquetas de formulario.2 Creando un formulario en una tabla Si quiere ordenar los elementos de formularios en una tabla.7. Namo WebEditor crea un nuevo formulario dentro de la celda. seleccione la tabla y utilice el comando Formato > Formulario. Tenga cuidado de asegurarse que el punto de inserción quede dentro de los bordes punteados al agregar más elementos de formularios. La etiqueta es sencillamente una o dos palabras de texto ordinario que se colocan a un lado del elemento. si se deshabilita la inserción automática de etiquetas de formulario. cada uno de ellos con un conjunto incompleto de elementos. Puesto que todos los elementos en la tabla pertenecen al mismo formulario. De otra forma. Esto se repite en cada celda donde se inserte un elemento. campos de imagen y ocultos.de un formulario en un documento se indica por un borde punteado. éstas deben insertarse manualmente una vez que se insertaron todos aquellos elementos requeridos dentro de la tabla. A excepción de los botones. 164 Capítulo 5 Edición Avanzada de un Documento . se debe deshabilitar la inserción automática de etiquetas de formulario junto con los elementos del mismo antes de agregar cualquiera de ellos. Las etiquetas no se encuentran “activas” y no son enviadas junto con la información del formulario — sencillamente sirven para que el visitante a nuestro sitio sepa para qué es el elemento del formulario. 5.

permitiendo al visitante del sitio seleccionar un archivo en su disco duro. seleccione Texto estándar. Para la mayoría de los propósitos. No existe la selección del tipo de entrada. Para agregar un cuadro combinado. haga lo siguiente: 1 Seleccione el comando Insertar > Campo de Formulario > Caja de Texto. 6 Haga clic sobre el botón Aceptar. El diálogo Propiedades de la caja de texto aparece. Si selecciona Contraseña. seleccione el comando Insertar > Campo de Formulario > Cuadro combinado. en cuyo lugar se especifica el Número de líneas que tendrá el cuadro.7. Los parámetros dentro del diálogo Propiedades del cuadro combinado son en su mayoría exactamente iguales a los del cuadro de texto.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. cada carácter que sea introducido en el recuadro se mostrará como un asterisco en lugar del carácter tecleado. 4 Especifique el Ancho en caracteres y la Longitud Máxima (también en caracteres). 5 Seleccione un Tipo de entrada. A continuación mostramos un ejemplo de los dos tipos de elementos de formularios: Para agregar una caja de texto. 2 Proporcione un Nombre para identificar la caja de texto.5. Creando formularios Web 165 . un botón de Examinar se insertará a un lado de la caja de texto. que siempre es texto. cuyo nombre se insertará automáticamente dentro del recuadro. 3 En Valor inicial. a excepción de la longitud máxima. Si selecciona Nombre de archivo. El segundo de ellos permite al visitante del sitio introducir más de una línea de texto. teclee un texto opcional que aparecerá inicialmente dentro de la caja cuando se despliegue en un navegador.

seleccione el comando Insertar > Campo de Formulario > Botón de Opción. Los ajustes dentro del diálogo Propiedades del botón de opción son los mismos que para una casilla de verificación. 2 Proporcione un Nombre para identificar la casilla. haga lo siguiente: 166 Capítulo 5 Edición Avanzada de un Documento . Se usa para permitir al visitante seleccionar solamente un elemento dentro de un grupo de opciones mutuamente excluyentes. El diálogo Propiedades de la casilla de verificación aparece. Botón de opción Menú desplegable Usado para permitir al visitante seleccionar uno más elementos de un grupo.4 Agregando controles de selección Existen tres tipos de controles de selección que permiten al visitante del sitio elegir entre elementos múltiples previamente definidos: Casilla de verificación Usualmente es utilizada para permitir que el visitante del sitio seleccione uno o más elementos de un grupo. 3 Teclee un Valor que será enviado al servidor si la casilla de verificación es seleccionada. Una sola casilla de verificación puede ser utilizada para que el visitante elija una respuesta del tipo Sí/no a una pregunta. 4 Especifique un Estado inicial de la casilla de verificación ya sea Marcada o No marcada. Para agregar un botón de opción.5. haga lo siguiente: 1 Seleccione el comando Insertar > Campo de Formulario > Casilla de verificación.7. Para agregar un menú desplegable. A continuación mostramos ejemplos de cada uno de los tipos de controles de selección: Casilla de verificación Botón de opción Menú desplegable Para agregar una casilla de verificación. 5 Haga clic sobre el botón Aceptar. Un menú desplegable puede presentar varias elecciones en un espacio relativamente pequeño.

Si se habilita Permitir selecciones múltiples y el visitante realiza selecciones múltiples.1 Seleccione el comando Insertar > Campo de Formulario > Menú desplegable. teclee el texto del elemento tal y como aparecerá en el menú. Si la altura se fija a un valor superior a 1. cada uno de los valores de los elementos se enviará el servidor junto con el nombre de control. 3 Haga clic en el botón Agregar para agregar un elemento al menú. 9 Especifique la Altura del menú con un número de líneas. Creando formularios Web 167 .) 11 Haga clic sobre el botón Aceptar. 10 Especifique si desea Permitir selecciones múltiples en el menú (o caja combinada. El diálogo Propiedades del menú desplegable aparecerá. 7 Haga clic sobre el botón Aceptar para cerrar el diálogo Parámetros del menú desplegable. 8 Repita los pasos del 3 al 7 para cada elemento que quiera agregar al menú. si un visitante selecciona “ajedrez” y “estampillas” en un menú que se llama “pasatiempos”. Por ejemplo. El diálogo Parámetros del menú desplegable aparecerá. 6 Especifique si el elemento debe estar Seleccionado inicialmente. 4 En Nombre. 2 Proporcione un Nombre para identificar al menú desplegable. tanto “pasatiempos=ajedrez” como “pasatiempos=estampillas” se enviará al servidor. 5 Proporcione el Valor que se enviará al servidor si el elemento se selecciona. el control aparecerá como una caja combinada en lugar de un menú.

para enviar el nombre del archivo del documento que contiene el formulario.5 Agregando un campo oculto Un campo oculto es utilizado para guardar valores estáticos que se envían al servidor junto con el resto de la información de un formulario. este valor también se transmitirá al servidor. Para agregar un botón de comando. 168 Capítulo 5 Edición Avanzada de un Documento . haga lo siguiente: 1 Seleccione el comando Insertar > Campo de Formulario > Campo oculto. Si el tipo de botón es Enviar. un botón se usa en combinación con una acción JavaScript que realiza alguna otra función cuando el botón es presionado. Esta marca no es visible en un navegador ni en la ventana de vista previa. 3 En Valor.5. Algunas veces. haga lo siguiente: 1 Seleccione el comando Insertar > Campo de Formulario > Botón de comando. En la ventana de edición. 4 Haga clic sobre el botón Aceptar. proporcione un texto para utilizar como etiqueta del botón. 2 Proporcione un Nombre para identificar el botón. pero que se mantiene invisible al visitante.7. 2 Proporcione un Nombre para identificar el campo.6 Agregando botones Un botón 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”. por ejemplo. El diálogo Propiedades del Campo Oculto aparecerá. un campo oculto de formulario se indica por un pequeño marcador amarillo similar a una casilla de verificación parcialmente oscura: . Se puede utilizar un campo invisible. 5. 3 Proporcione el Valor que será enviado al servidor. El diálogo Propiedades del botón de comando aparecerá. Para agregar un campo oculto.7.

La información es enviada utilizando el siguiente formato: nombre_campo.y = desplz_y Por ejemplo. al ser presionado. Al igual que un botón estándar de envío. Haga clic en el botón Examinar para localizar y seleccionar un archivo en su disco duro o sobre el botón Clip Art para seleccionar una imagen de la librería clip art. 3 Teclee la Ruta al archivo de imagen que se usará. los valores enviados pueden ser: btnimagen. 5 Haga clic sobre el botón Aceptar. el botón no realiza ninguna acción por sí mismo. hace que la información del formulario se transmita al servidor web. Si el tipo es Enviar. una imagen envía también las coordenadas X . al presionar sobre el botón.y = 30 Para insertar un campo de formulario de imagen. También se puede hacer clic sobre el botón Creando formularios Web 169 . se transmiten los valores del formulario al servidor.Y del punto de la imagen donde el visitante hizo clic. el formulario volverá a su estado inicial (sin valores). 2 Proporcione un Nombre al identificar el campo de formulario de imagen.x = 92 btnimagen. si el nombre del campo de formulario de imagen es “btnimagen”. Si se selecciona botón tipo Iniciar. El diálogo Propiedades del campo de formulario de imagen aparecerá.7 Agregando un campo de imagen Un campo de formulario de imagen actúa de manera similar a un botón de envío. sin embargo. haga lo siguiente: 1 Seleccione el comando Insertar > Campo de Formulario > Imagen.7.4 Seleccione un Tipo de botón. 5.x = desplz_x nombre_campo. Si es General. necesita anexarse a una acción JavaScript que realiza alguna función cuando el botón sea presionado. A diferencia de un botón de envío.

el nombre del programa en el servidor que administrará el formulario. entre otras cosas. el marco destino determina en qué marco o ventana se abrirá el otro documento. Acción La ruta de acceso o dirección URL del administrador del formulario. El botón Eliminar Formulario puede ser usado para quitar las etiquetas del formulario activo. seleccione Mandar (POST). deje este campo en blanco o llénelo con “text/plain”. se usa únicamente para diferenciarlo de otros dentro del mismo documento. seleccione Mandar (POST). el contenido del formulario será enviado por correo a la dirección especificada. El contenido de solamente texto. Si los datos del formulario serán almacenados por el programa en el servidor. Si se usa “mailto:” seguido de una dirección electrónica de correo (e-mail). 4 Haga clic sobre el botón Aceptar. 170 Capítulo 5 Edición Avanzada de un Documento . No remueve los campos del formulario. Nombre del Formulario Marco destino El nombre del formulario. Si se envían los resultados del formulario a un documento web distinto que será abierto por el navegador.Proyecto para seleccionar un archivo de imagen de entre los documentos del proyecto actual. El método de transmisión del contenido del formulario al programa del servidor. Usualmente es un programa CGI o cualquier otro dentro del servidor. En caso de duda. Si los datos del formulario serán utilizados para una búsqueda. Deje en blanco si se utilizará el mismo marco o ventana.8 Modificando las propiedades de un formulario En el diálogo Propiedades del Formulario es donde se puede especificar.7. seleccione Obtener (GET). o enviados por correo electrónico. Este nombre no se envía al servidor. 5. Las elecciones posibles son Obtener (GET) y Mandar (POST). Método Tipo de codificación El tipo MIME como serán tratados los datos del formulario.

Se accede a la ventana HTML presionando sobre la solapa HTML en la parte inferior de la ventana principal o presionando la tecla <F6>.8. Cuando se intercambia del modo visual al modo HTML.1 Intercambiando entre edición visual y edición de código fuente La ventana HTML despliega el código fuente del documento activo. Se puede intercambiar entre el modo de diseño visual (la ventana de edición) y el modo HTML presionando la tecla <F6>.5. Estos temas están fuera del alcance de esta guía de usuario. 5. Para editar el código fuente HTML hace falta tener conocimientos de la especificación HTML (4. Conocer la especificación CSS también ayuda. Los siguientes elementos del menú Insertar están disponibles: Submenú de Salto de Línea Línea 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 código fuente HTML 171 . 5. Lo mismo se cumple cuando se intercambia en la otra dirección.2 Inserción automática 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.8.0).8 Editando el código fuente HTML Además del modo de diseño visual disponible dentro de la ventana de edición. Los cambios que se realizan en cualquiera de los modos se reflejan de manera instantánea en el otro. Namo WebEditor incluye la característica de editar directamente el código fuente HTML. Namo WebEditor coloca el punto de inserción en la localización dentro del código fuente que corresponde de manera más exacta a lo que se ve en la ventana de edición.

172 Capítulo 5 Edición Avanzada de un Documento .Vínculo Otros > Fecha y hora Otros > Espacio no separable En el menú Tabla. Para activar el despliegue de los números de línea. Los siguientes botones de la barra estándar se encuentran disponibles: Insertar Clip Art Insertar Imagen de archivo Crear Tabla Crear/Modificar vínculo Los siguientes botones de la barra de formato están disponibles y operan sobre la selección activa: Menú tipografía Menú tamaño del texto Negrilla Cursiva Subrayada 5.8. Haga clic con el botón derecho del ratón dentro de la ventana HTML y seleccione Opciones de Edición de Código en el menú de atajo.3 Opciones de despliegue de código fuente Existen varias formas de personalizar la forma en que el código HTML es desplegado. Existen más opciones de despliegue dentro de la solapa Opciones de Edición de Código del diálogo Preferencias. se encuentra disponible Nueva Tabla. haga clic con el botón derecho en cualquier parte dentro de la ventana HTML y seleccione Mostrar Color de Código. haga clic con el botón derecho del ratón y seleccione Mostrar Números de Línea. Para mostrar o no los colores en el código.

Namo WebEditor usa las reglas especificadas dentro del diálogo Opciones de Formato HTML solamente para formato al código HTML. 3 Haga clic en el botón Opciones de formato HTML. Para abrir este diálogo. se utilizarán espacios para realizar la sangría. colores y opciones de números de línea para la ventana HTML. No intenta dar Editando el código fuente HTML 173 . Cambie a la solapa Editar Preferencias. 2 En el diálogo Preferencias. 5.4 Opciones de formato de código fuente El diálogo Opciones de formato HTML contiene varias opciones relacionadas de cómo Namo WebEditor da formato al código HTML que genera. De manera predeterminada. haga lo siguiente: 1 Seleccione el comando Herramientas > Preferencias.En este punto se pueden configurar las características de la tipografía. el punto de inserción se colocará automáticamente en el margen izquierdo de la línea presente cuando se comienza una nueva línea.8. Si la opción Usar tabuladores para sangrías no está seleccionada. Si activó la opción Sangría automática.

Para ver o editar el código fuente del documento del conjunto de marcos.formato al código HTML existente — esto es. escrito a mano o importado de otro programa. utilice la solapa Código de marcos.8. 5. 174 Capítulo 5 Edición Avanzada de un Documento . la solapa HTML despliega el código HTML del documento en el marco activo. Si quiere que Namo WebEditor dé formato al código existente aplicando las mismas reglas que usa para el que genera.5 Editando el código fuente HTML de un conjunto de marcos Cuando se trabaja en un conjunto de marcos. quite la selección de la opción Conservar Código HTML existente en la solapa Editar Preferencias del diálogo Preferencias.

Capítulo 6 Agregando Elementos Dinámicos Namo WebEditor permite agregar una gran variedad de elementos dinámicos a los documentos web.2 Acciones. acciones JavaScript anexadas a elementos de página. incluyendo efectos JavaScript. animaciones utilizando líneas de tiempo y varios elementos multimedia. eventos y el Administrador de Secuencias de Comandos 6.1 El Asistente de Secuencias de Comandos 6. En esta sección 6.3 Creando líneas de tiempo 6.4 Agregando objetos multimedia 175 .

intente ver un documento que contenga efectos creados por el Asistente de Secuencias de Comandos. haga clic sobre el botón Siguiente y siga con uno o dos pasos sencillos más para terminar de agregar el efecto o elemento seleccionado en el documento activo. El asistente permite agregar giros. sí incluyen JavaScript. o use el comando Insertar > Secuencias de comandos >Asistente de Secuencias de Comandos. menús desplegables y mucho más con unos cuantos clic de ratón. presione la tecla <F1> mientras se encuentra en el diálogo. capas flotantes. Nota sobre la compatibilidad con los navegadores Los efectos y elementos dinámicos creados utilizando el Asistente de Secuencias de Comandos utilizan JavaScript. Para iniciar el Asistente de Secuencias de Comandos. Si el navegador incluye JavaScript. haga clic en el botón Insertar efecto del Asistente de Secuencias de Comandos en la barra estándar de herramientas.1 El Asistente de Secuencias de Comandos Utilice el Asistente de Secuencias de Comandos (guiones o script) para agregar una gran cantidad de elementos dinámicos muy comunes y efectos a sus documentos web. los efectos funcionarán. que dos de los elementos dinámicos creados por el Asistente de Secuencias de Comandos: el menú de texto y el menú de navegación.x y Netscape 4. animaciones sencillas. no funciona en aquellos navegadores web que no incluyen JavaScript.6. Una vez que se realiza la selección. desvanecimientos y efectos de aparecer y desaparecer. utilizan capas que se 176 Capítulo 6 Agregando Elementos Dinámicos . también. Para otros navegadores. Tenga en cuenta. Para ayuda de cualquiera de los diálogos del Asistente de Secuencias de Comandos. Internet Explorer 4. Encontrará información completa de los 16 efectos y elementos del Asistente de Secuencias de Comandos disponibles dentro de Namo WebEditor en la ayuda en línea. El primer paso al utilizar el asistente es seleccionar el efecto dinámico o elemento que se quiere usar. o versiones más recientes. Por lo tanto.x.

6. Para compatibilidad con las versiones de Netscape anteriores a la 4. realizando esta acción las capas no serán visibles en Internet Explorer.insertan en el documento.) 177 . (Sin embargo. se debe seleccionar la opción Usar etiquetas <LAYER> en el diálogo Propiedades de la capa para esas capas.

No todos los tipos de elementos de página pueden tener acciones anexas a ellos. si el visitante hace clic en un elemento de la página. Los elementos que sí pueden incluir acciones son: Imágenes Capas Vínculos Elementos de formularios El propio documento Hay dos formas de anexar una acción a un elemento de página. Cuando el visitante al sitio mueve el apuntador del ratón sobre la imagen. Esto significa que la acción es disparada por un evento que de alguna forma se relaciona al elemento al cual se anexa. Todo diálogo de propiedades de un elemento que soporta acciones tiene este tipo de botón. Son posibles muchos tipos de acciones. El simple hecho de mover el apuntador del ratón sobre un elemento de la página puede generar un evento (OnMouseOver). Existen varios tipos de eventos. Un evento es usualmente algo que el visitante del sitio web hace para disparar una acción. Otro ejemplo es el evento OnLoad. causa un evento OnMouseOver. Por ejemplo.2 Acciones. que es generado cuando un documento es abierto por un navegador. eventos y el Administrador de Secuencias de Comandos Las acciones y eventos permiten agregar una gran variedad de características dinámicas e interactivas a sus documentos web. La otra forma de anexar una acción a un elemento de página es usar el administrador de secuencias de comandos. Cada acción dentro de un documento debe “anexarse” a un elemento de la página o al mismo documento. Una acción es una secuencia de comandos — parte del código de un programa — que ejecutará el navegador web cuando ocurra algún evento que la dispare. Al presionar sobre este botón. donde podemos agregar y eliminar las acciones que se anexan a un elemento de página.6. Se accede 178 Capítulo 6 Agregando Elementos Dinámicos . algunas de las usadas más frecuentemente incluyen aquellas en las cuales una imagen es reemplazada por otra (creando un efecto de “giro”). tal como una capa. esto genera un evento del tipo “OnClick”. una acción de reemplazo de imagen siempre se anexa a una imagen. Una de ellas es utilizar el botón Acción dentro del diálogo de propiedades del elemento que si pueda incluir acciones. abrimos el diálogo Acciones. En el diálogo Administrador de Secuencias de Comandos se lista cada elemento dentro de un documento que incluye acciones. Por ejemplo. la acción de reemplazo de imagen es ejecutada. Seleccione el elemento de la página dentro de la lista y presione sobre el botón Agregar para anexar una acción. abrir un diálogo para mostrar un mensaje al visitante y mostrar u ocultar una capa del documento.

no trabajan en aquellos navegadores web que no incluyen JavaScript. Nota sobre la compatibilidad con los navegadores Las acciones incluidas en Namo WebEditor son programadas en JavaScript. vínculos. capas. 3 Haga clic en el botón Agregar. En otros navegadores estas acciones no se ejecutarán. Esto abre el diálogo Propiedades de la Acción. (Haga clic con el botón derecho del ratón sobre el elemento y seleccione [elemento] Propiedades en el menú de atajo.1 Anexando una acción usando el diálogo de Acciones Los diálogos de propiedades de imágenes.x y Netscape 4. donde se puede anexar una o más acciones al elemento. Esto abre el diálogo Acciones. Por lo tanto. 6. Al hacer clic sobre él se abre el diálogo Acciones. campos de formularios y documentos incluyen un botón Acción. Internet Explorer 4.al administrador de secuencias de comandos desde Formato > Administrador de Secuencias de Comandos.x. Para anexar acciones a un elemento utilizando el diálogo Acciones. sí incluyen JavaScript. La última de ellas lista las acciones y eventos incluidos en cada tipo de elemento de página. eventos y el Administrador de Secuencias de Comandos .) Si el elemento es un documento. 179 Acciones.2. 2 Haga clic en el botón Acción. haga lo siguiente: 1 Abra el diálogo de propiedades del elemento. o versiones más recientes. Ambos métodos son explicados en las siguientes dos secciones. cambie a la solapa Estilos en el diálogo Propiedades del Documento.

Para abrir el administrador de secuencias de comandos. Sólo se listan los eventos que se aplican al elemento. remover o modificar todas las acciones (scripts) del documento activo.4 Seleccione una acción para anexar al elemento dentro de la lista Acciones y seleccione el evento que dispara esta acción en el menú Eventos. 8 Haga clic sobre el botón Aceptar para cerrar el diálogo Acciones y una vez más para cerrar el diálogo de propiedades del elemento. 5 En Parámetros. Para modificar o eliminar una acción existente. 180 Capítulo 6 Agregando Elementos Dinámicos . use el comando Formato > Administrador de Secuencias de Comando. (Por ejemplo en el parámetro de cada una de las acciones.) 6 Haga clic sobre el botón Aceptar. 6. teclee un valor para cada uno de los parámetros de la acción.2. selecciónela dentro del diálogo Acciones y haga clic sobre el botón Modificar o Eliminar. 7 Repita los pasos del 3 al 6 para cada acción adicional que desee anexar al elemento. presione la tecla <F1> mientras ve el diálogo Propiedades de la Acción.2 Usando el Administrador de Secuencias de Comandos El administrador de secuencias de comandos provee una forma conveniente de agregar.

muestra todas aquellas acciones que se han anexado al elemento seleccionado. Los elementos que ya tienen acciones anexas se muestran con un pequeño círculo rojo en la esquina de sus iconos. haga lo siguiente: 1 Seleccione el elemento de la lista. Esto abre el diálogo Propiedades de la Acción. 181 Acciones. selecciónelo haciendo clic sobre él. 2 Haga clic en el botón Agregar bajo la lista de acciones. etiquetadas como Efectos del Asistente de Secuencia de comandos. La lista en la esquina superior derecha del diálogo. Para ver una lista de las acciones que ya han sido asignadas a un elemento.La lista jerárquica de la izquierda del diálogo muestra los elementos dentro del documento que pueden tener acciones. eventos y el Administrador de Secuencias de Comandos . Para anexar una acción a un elemento. lista de acciones. muestra los efectos asignados al elemento seleccionado usando el Asistente de Secuencia de Comandos. La lista debajo de la de acciones.

presione la tecla <F1> mientras se encuentre en el diálogo Propiedades de la Acción. Para modificar o eliminar una acción. selecciónela de la lista de acciones y haga clic sobre el botón Modificar o Eliminar. (Para más ayuda de cada uno de los parámetros de las acciones.3 Elija una acción dentro de la lista Acciones y seleccione el evento que disparará la acción dentro de la lista Eventos. Sólo se muestran aquellos eventos que se pueden aplicar al elemento. proporcione un valor para cada uno de los parámetros de la acción.) 5 Haga clic sobre el botón Aceptar. Un efecto del asistente de secuencias de comandos puede ser eliminado al seleccionarlo de la lista y presionar sobre el botón Borrar. (Para modificar un efecto del asistente de secuencia de comandos seleccione el elemento al cual se encuentra anexo dentro de la ventana de edición y abra el asistente de secuencias de comando. 4 En Parámetros.) 182 Capítulo 6 Agregando Elementos Dinámicos .

IE Marco objeto Ir a un marco de la línea de tiempo Nombre de la Línea de Tiempo Número de marco Repeticiones Nombre de la Ventana Dirección 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 tamaño Reproducir línea de tiempo Detener línea de tiempo Mensaje emergente Carga previa de la Imagen Reemplazar Imagen Restaurar Imagen Fijar Texto barra de Estado Mostrar/Ocultar Capa Nombre de la Línea de Tiempo Nombre de la Línea 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 Acciones.2.6.Netscape URL si el plugin no existe . Acción Llama función JavaScript Verificar Navegador Parámetros Función 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 .3 Acciones y eventos incluidos La siguiente tabla muestra una lista de las acciones (junto con sus parámetros) incluidas en Namo WebEditor. eventos y el Administrador de Secuencias de Comandos .

(Vea onFocus. Ocurre cuando un campo de un formulario pierde el "enfoque". en la parte "de arriba hacia abajo" de presionar el botón. Ocurre cuando el apuntador del ratón entra al perímetro de un objeto relevante.) onFocus onBlur onChange onSelect onKeyDown onKeyPress onKeyUp onClick onDblClick onMouseOver onMouseOut onMouseDown onMouseUp onFrame[n] 184 Capítulo 6 Agregando Elementos Dinámicos . Ocurre cuando el apuntador del ratón sale de los límites de un objeto relevante.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 página. Evento onAbort onError onLoad Cómo se genera Ocurre cuando el visitante cancela la carga de una página en proceso. 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 sobre un objeto relevante. tal como una imagen. Ocurre cuando el visitante completa la "presión" de 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 ratón. Ocurre cuando el navegador termina de cargar el objeto relevante. (Sólo está disponible si se anexa una acción a un marco de una línea de tiempo. Ocurre cuando el visitante selecciona todo o parte del contenido de un campo en un formulario.) Ocurre cuando el visitante edita el contenido de un campo de un formulario y luego deja el campo. Ocurre cuando el navegador encuentra un error al cargar la página. Ocurre cuando una línea de tiempo llega a un marco específico. 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 tabulación para llegar al mismo. Ocurre cuando el visitante hace doble clic sobre un objeto relevante usando el ratón. Ocurre cuando el visitante suelta el botón del ratón en el proceso de hacer clic sobre un objeto relevante. usando el botón de Detener o presionando sobre un vínculo para ir a una página diferente.

3: Trabajando con capas 6. Un marco llave se indentifica por un pequeño círculo blanco dentro del objeto gráfico. La ventana de Línea de Tiempo se encuentra divida en renglones y columnas. para poder producir un movimiento de mayor complejidad. haciendo posible la animación de varias capas simultáneamente. Cada columna representa un marco de la línea de tiempo (similar a un marco de una película. 5. seleccione el comando Ventana > Línea de Tiempo o presione las teclas <Alt + 4>. “Capa 3”. Esta combinación de habilidades hace que las líneas de tiempo sean un método poderoso de animar elementos de página y agregar otros efectos dinámicos a sus documentos web.1 La ventana de Líneas de Tiempo La ventana de Línea de Tiempo es donde se puede realizar la creación y edición de las mismas.3. Las barras grises horizontales dentro de la imagen superior.) La línea roja delgada es el indicador del marco activo. etiquetadas como “Capa 1”. Creando líneas de tiempo 185 . En cada marco entre los marcos llave. Para abrir esta ventana. para poder continuar trabajando dentro de la ventana de edición mientras se conserva abierta. En un marco llave. Además. la posición de la capa la especifica el diseñador (usted). por ejemplo. representan un objeto gráfico (sprite). se pueden anexar acciones (script) a puntos específicos de una línea de tiempo.6. El objeto gráfico controla el movimiento de una de las capas en una secuencia de marcos. la posición de la capa se calcula automáticamente dentro del navegador web para que la capa se mueva uniformemente entre los marcos llave. Utilizando la líneas de tiempo se puede hacer que las capas cambien de posición mientras se despliegan en un navegador. para reemplazar una imagen en una capa con otra. Cada objeto gráfico tiene por lo menos dos marcos llave. Puede haber cualquier número de objetos gráficos dentro de una línea de tiempo. La ventana es del tipo flotante. “Capa 2”.3 Creando líneas de tiempo Una de las características de las capas es la posibilidad de colocarlas en cualquier punto de una página. Se pueden agregar o quitar marcos llave según se desee.

etiquetado “Capa 1” para simbolizar el movimiento que describe. una capa (que contiene la imagen de un pequeño autobús rojo). 186 Capítulo 6 Agregando Elementos Dinámicos . el primer marco del objeto gráfico. en línea recta. En el Marco 1. lo que significa que la posición de la capa para este marco la especificamos nosotros. En este ejemplo.Estos conceptos se ilustran con un sencillo ejemplo mostrado a continuación. se mueve del lado izquierdo de la ventana hacia el derecho. Este ejemplo de línea de tiempo solamente contiene un objeto gráfico. la capa se encuentra en la esquina superior derecha del documento. El Marco 1 es un marco llave.

Creando líneas de tiempo 187 . que no es un marco llave. En el Marco 20. la capa ha llegado a su posición final. la posición de la capa en este marco es calculada por Namo WebEditor (y. El Marco 20 es otro marco llave. El lugar de eso. el último marco del objeto gráfico. posteriormente. así que la posición la especificamos nosotros. No especificamos explícitamente la posición de la capa dentro del Marco 10. el punto central del objeto gráfico.En el Marco 10. la capa ha pasado hasta la mitad de la ventana. será calculada por el navegador Web).

Cuando el apuntador del ratón. en la ventana de edición. 6. Un nuevo objeto gráfico tiene una longitud de 16 marcos. Para mover un objeto gráfico — cambiar donde comienza o termina — sin cambiar su longitud. Para ajustar su longitud. se debe especificar la posición de la capa en el primero y el último marco (la posición final e inicial de la capa. seleccione la capa haciendo clic sobre su manija y luego haga clic con el botón derecho del ratón sobre cualquier parte de la ventana de Línea de Tiempo y seleccione Insertar Capa en el menú de atajo. si es necesario. Una vez creado un objeto gráfico básico. tanto secuenciales como traslapados. Se pueden agregar objetos gráficos adicionales a la línea de tiempo procediendo de la misma forma. Use las siguientes instrucciones: 1 Haga clic dentro de la capa para hacer que sus manijas aparezcan. haga clic en cualquier parte del centro del objeto gráfico (pero no en un marco llave) y arrástrelo. Sin embargo. es posible anexar varias acciones a marcos específicos de la línea de tiempo. no pueden traslaparse. se pueden agregar más marcos llaves.2 Creando y editando un objeto gráfico (sprite) Para crear un objeto gráfico (sprite). si existen objetos gráficos múltiples para la misma capa. Continúe arrastrando hasta que el objeto gráfico se encuentre en la posición deseada dentro de la línea de tiempo y en ese momento suelte el botón del ratón.3. haga clic sobre él y arrástrelo hasta el primero o el último de los marcos. Además. y especificar cada una de las posiciones de las capas. En las siguientes secciones explicamos la creación de objetos gráficos y la manera de anexar acciones a una línea de tiempo. arrastre la capa de su manija hasta la posición requerida o 188 Capítulo 6 Agregando Elementos Dinámicos . 2 Arrastre la capa por una de sus manija hasta la ventana de Línea de Tiempo. que en este momento tiene la forma de una mano. pueden existir muchos objetos gráficos. un objeto gráfico aparecerá debajo de él.En una línea de tiempo más compleja. Cada capa en un documento puede ser controlada por uno o más objetos gráficos. de forma tal que una acción se dispare cuando la línea de tiempo llege a un marco especificado.) Posteriormente. sencillamente arrastre una capa a la ventana de Línea de Tiempo. esté sobre la ventana. Hay dos formas de especificar la posición 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. De manera alternativa.

Para hacer que un marco llave vuelva a convertirse en un marco normal.Haga doble clic en el marco llave y luego. mueva el indicador del marco activo al marco. haga clic con el botón derecho del ratón dentro del marco llave y seleccione Eliminar Marco Llave en el menú de atajo. Se puede cortar o copiar un objeto gráfico y luego pegarlo en una nueva posición dentro de la línea de tiempo. una delgada línea de camino negra se dibujará dentro de la ventana de edición entre la posición inicial de la capa y su nueva posición. El círculo blanco desaparecerá y la línea del camino a los lados del marco llave anterior cambiará de forma. La línea del camino cambiará para reflejar la modificación de la capa. donde desea pegarlo y luego haga clic con el botón derecho en cualquier parte dentro de la línea de tiempo seleccionando Pegar objeto gráfico en el menú de atajo. El apuntador del ratón debe cambiar ahora apropiadamente cuando se coloque sobre una manija de una capa. Para agregar un marco llave. indicando el camino que la capa tomará. Para hacer que un objeto gráfico realice una acción mucho más complicada que mover una capa entre dos puntos en una línea recta. así que cuando copie un objeto gráfico. Para pegar un objeto gráfico previamente cortado o copiado. haga clic con el botón derecho del ratón en un marco y seleccione Insertar Marco llave en el menú de atajo. primero selecciónelo haciendo clic sobre él una vez y luego haga clic con el botón derecho del ratón dentro de la línea de tiempo seleccionando Cortar objeto gráfico o Copiar objeto gráfico en el menú de atajo. Para copiar o pegar un objeto gráfico. 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 gráfico que no sea llave y luego arrastre la capa por su manija en la ventana de Edición. haga clic sobre la barra de título de Namo WebEditor una vez. Recuerde que dos objetos gráficos que controlan a la misma capa no pueden traslapararse. la nueva línea de camino se moverá a su posición final. No es posible remover los marcos llave que se encuentran en los extremos de un objeto gráfico. Una vez que suelte el botón del ratón. enderezándose. indicando que éste es un marco llave. se requiere agregar marcos llave adicionales al objeto gráfico. no será posible pegarlo si el indicador del marco activo se encuentra dentro del objeto gráfico original. Creando líneas de tiempo 189 . Si desea intercambiar el camino completo de una capa sin modificar su forma — esto es. Si el apuntador del ratón no cambia a una mano cuando se coloca sobre la manija de una capa. teclee las coordenadas horizontales y verticales de la esquina superior derecha de la capa El segundo método es útil cuando se requiere especificar la posición de la capa de forma muy precisa. Ahora debe especificar la posición de la capa dentro del nuevo marco llave utilizando uno de los métodos descritos anteriormente. dentro del diálogo Propiedades de la capa. Un pequeño círculo blanco debe aparecer en el marco. Una vez que colocó la capa en el segundo marco llave.

sus manejas de cambio de tamaño son visibles en sus lados y esquinas.) 2 Haga clic que con el botón derecho del ratón en cualquier parte dentro de la ventana Línea de Tiempo y seleccione el comando Grabar Camino de Capa en el menú de atajo. 6. Cuando se suelta el botón del ratón. Para grabar el camino de una capa. utilice las técnicas descritas en la sección anterior para ajustar la posición de una capa dentro de un marco llave o agregar y eliminar marcos llave. (Cuando una capa se selecciona. 3 Haga clic en la manija de la capa y arrástrela por el camino deseado. Una vez que se crea un objeto gráfico de esta manera. selecciónelo y luego haga clic con el botón derecho del ratón dentro de la línea de tiempo utilizando el comando Eliminar capa en el menú de atajo. Al ir arrastrando la capa. justo después de la que ya se encontraba más a la derecha. El apuntador del ratón debe cambiar a una flecha con un pequeño icono de un casete de grabación. puesto que se deben agregar varios marcos llave y especificar la posición de la capa en cada uno de ellos. si es que había alguna.Para eliminar un objeto gráfico.3 Creando un objeto gráfico al grabar el camino de una capa Si desea crear un objeto gráfico con movimiento curvo y complejo. haga lo siguiente: 1 Seleccione la capa haciendo clic en una de sus manijas. Para hacer esto. La forma más sencilla de grabar el camino de una capa es arrastrándola por la ventana de edición mientras se graban sus movimientos. La posición de la capa se fija automáticamente dentro de cada marco llave. puede ser bastante difícil utilizando las técnicas descritas en las secciones anteriores. 190 Capítulo 6 Agregando Elementos Dinámicos .3. una serie de pequeños asteriscos aparecerán a lo largo del camino. se necesita ajustar el camino de la capa. Namo WebEditor inserta tantos marcos llave como sean necesarios para describir con exactitud el camino que toma la capa. un nuevo objeto gráfico se insertará dentro de la línea de tiempo.

haga clic sobre el botón Agregar. En casos extremos. la posibilidad de orquestar efectos dinámicos usando líneas de tiempo solamente está limitada por la imaginación. ésta es ejecutada por el navegador. En un marco posterior. Si desea utilizar una línea de tiempo únicamente para disparar ciertas acciones. Cuando la línea de tiempo llega a un marco que tiene una acción anexa. haga lo siguiente: 1 Haga doble clic en el renglón de acciones (marcado A) en la parte superior de la línea de tiempo del marco deseado. Esto se debe a que una línea de tiempo que no tenga objetos gráficos no puede ser reproducida. Por ejemplo. sino que solamente provoque que se ejecuten varias acciones en el tiempo (con o sin la interacción del visitante). Se pueden anexar acciones adicionales al mismo marco u otros marcos repitiendo los pasos descritos arriba. haga clic y arrastre la A a otro marco. 3 Seleccione una acción y proporcione los valores de sus parámetros. El diálogo Propiedades de la Acción aparecerá. Para que las acciones anexas a una línea de tiempo sean ejecutadas. se puede anexar una acción de Reemplazo de Imagen a un marco para cambiar la imagen dentro de una capa. Creando líneas de tiempo 191 . se puede anexar una acción Restaurar Imagen para volver a la imagen original. una A aparece dentro del renglón de acción de ese marco.4 Anexando acciones a una línea de tiempo Probablemente uno de los aspectos más poderosos de las líneas de tiempo es la posibilidad de anexar acciones (scripts) a un marco específico. cree un único objeto gráfico utilizando cualquier capa (una capa vacía puede servir) y coloque el objeto gráfico en cualquier parte de la línea de acción. Para anexar una acción a un marco de una línea de tiempo. Cuando un marco tiene una acción anexa. 2 En el diálogo Acciones. 4 Haga clic sobre el botón Aceptar dos veces para cerrar los diálogos. puede ser deseable crear una línea de tiempo que no contenga capas de animación.6. Puesto que cualquier acción puede anexarse a cualquier marco dentro de la línea de tiempo.3. debe haber por lo menos un objeto gráfico dentro de la línea. no para animar capas. Para mover una acción anexa a un marco distinto.

La velocidad a la cual la línea de tiempo se reproduce puede ser ajustada utilizando el control marcos/seg. En la parte superior de la ventana de Línea de Tiempo. por ejemplo. pero seleccione Detener Línea de Tiempo en el menú Acciones. 3 Haga clic en el botón Agregar. un visitante haciendo clic sobre un botón. la línea de tiempo ser reproducirá una vez y luego se detendrá. 2 Haga clic en el botón Acción para abrir el diálogo Acciones. siga los pasos anteriores. seleccione Reproducir Línea de Tiempo. Una línea de tiempo puede iniciarse o detenerse cuando otra línea de tiempo alcance cierto marco. la velocidad especificada solamente es una aproximación de lo que sucede durante su reproducción.5 Especificando cómo inician las líneas de tiempo Una línea de tiempo puede comenzar su reproducción tan pronto como el documento termine de cargarse en el navegador o puede ser iniciada por una acción anexa a algún elemento del documento que se activa por un evento. 6 En la lista Evento. haga lo siguiente: 1 Abra el diálogo de propiedades del elemento.3. 5 En Parámetros. la reproducción de una línea de tiempo puede ser detenida por una acción.6. 192 Capítulo 6 Agregando Elementos Dinámicos . De forma similar. debido a las diferencias entre los navegadores y las plataformas informáticas. Recuerde que. 4 En la lista de Acciones. seleccione la opción Auto inicio dentro de la ventana Línea de Tiempo. Se puede especificar que una línea de tiempo se repita de manera indefinida seleccionando la opción Repetir en la ventana Línea de Tiempo. 7 Haga clic sobre el botón Aceptar tres veces para cerrar todos los diálogos. Para realizar esto. siga las instrucciones de las secciones anteriores para anexar una acción a un marco dentro de una línea de tiempo. Para realizar esto. Si no se selecciona Repetir. seleccione el nombre de la línea de tiempo que será iniciada por la acción Reproducir Línea de Tiempo. Para anexar una acción que haga que la línea de tiempo comience su reproducción por un elemento de página. Esto abrirá el diálogo Propiedades de la Acción. seleccione el elemento que disparará la acción Reproducir Línea de Tiempo. Para hacer que la línea de tiempo su ejecute tan pronto como el documento sea cargado en el navegador.

los controles en la parte superior de la ventana Línea de Tiempo — marcos/seg. seleccione su nombre dentro de la lista encontrada en la esquina superior derecha de la ventana. haga clic con el botón derecho del ratón en cualquier parte de la ventana Línea de Tiempo y seleccione Agregar Línea de Tiempo en el menú de atajo. El procedimiento es el mismo que para los objetos gráficos dentro de la misma línea.. El nombre de esta línea será “timelineN”. vacía.6. donde “N” eso un número entero.6 Trabajando con líneas de tiempo múltiples El mismo documento puede tener cualquier número de líneas de tiempo. Auto inicio y Repetir — se aplican de manera independiente a cada línea de tiempo. Para seleccionar una línea de tiempo y traerla a la parte de enfrente de la ventana Línea de Tiempo.3. a excepción de que se debe seleccionar la otra línea de tiempo antes de pegar. Los objetos gráficos pueden ser cortados o copiado de una línea de tiempo y pegados en otra. Creando líneas de tiempo 193 . aparecerá dentro de la ventana. cada una de ellas reproduciéndose de forma independiente de las otras. haga clic sobre su nombre dentro de la lista de líneas de tiempo y luego escriba el nuevo y presione la tecla <Tab>. Para cambiar el nombre a una línea de tiempo. Para agregar una línea de tiempo. Una nueva línea de tiempo. Cuando existen líneas de tiempo múltiples. La línea de tiempo previamente desplegada se enviará “detrás” de la nueva en la ventana Línea de Tiempo.

Un archivo MIDI es como la partitura de una canción o sinfonía. Comparados a la mayoría de los otros objetos multimedia. Para poder tener una vista preliminar de los objetos QuickTime en la ventana de Vista Previa. Los archivos MIDI son muy compactos y rápidos de descargar. Los archivos Flash usan la extensión . Para insertar un objeto multimedia. se debe tener instalado el plug-in capaz de reproducir archivos MIDI para el navegador Internet Explorer instalado en su ordenador. que significa Interfase Digital para Instrumentos Musicales (Musical Instrument Digital Interface). Debido a eso toman menos tiempo para ser descargadas de un sitio web.4 Agregando objetos multimedia Namo WebEditor incluye la inserción de varios tipos de objetos multimedia dentro de los documentos web en el modo de edición visual. Los archivos MIDI usan las extensiones . es necesario tener instalado el Plug-in reproductor de Shockwave o Flash para el navegador Internet Explorer en su ordenador. Entre los objetos multimedia incluidos se encuentran: Animaciones Flash y Shockwave Flash y Shockwave son dos tipos de archivos multimedia. Los visitantes al sitio web también deben tener instalado el plug-in para poder ver objetos QuickTime. utilice alguno de los comandos que se encuentran dentro del menú Insertar > Avanzado.swf mientras que los Shockwave usan la .6.dcr. 194 Capítulo 6 Agregando Elementos Dinámicos . Los archivos QuickTime usan la extensión . los objetos flash son archivos de tamaño relativamente pequeño.midi. se debe tener instalado el Plug-in de QuickTime para el navegador Internet Explorer en su ordenador. Sonidos MIDI MIDI.mov. es un formato de archivos de música. Los visitantes al sitio Web deben tenerlos instalados también para poder ver los objetos Flash o Shockwave.mid o . puesto que se basan en gráficos vectoriales (imágenes que son descritas por expresiones matemáticas en lugar de mapas de bits). Películas Quicktime QuickTime es un formato de archivos multimedia propiedad de Apple Computer. Para obtener una vista preliminar de un objeto MIDI en la ventana de Vista Previa. Muchas de la películas y archivos de sonido que se encuentran en la Web están en formato QuickTime. Para obtener una vista preliminar de objetos Flash o ShockWave en la ventana de Vista Previa. Los visitantes al sitio web también deben tener instalado el plug-in para poder escuchar objetos MIDI. no contiene sonidos sino que depende de la tarjeta de música del ordenador para generarlos.

se debe tener instalado el Plug-in RealPlayer para el navegador Internet Explorer instalado en su ordenador. en vez de eso. son ejecutados en la propia ventana del navegador. . propiedad de RealNetworks. dibujar gráficos o jugar. las mismas que una aplicación ordinaria. Los archivos RealAudio usan la extensión . Para encontrar y usar interesantes applets Java. en lugar de eso. tales como editar una hoja de cálculo. "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. es ejecutado de forma automática cuando se ve la página Web que lo contiene o cuando se hace clic en un botón localizado en esa página. RealAudio se usa con frecuencia para reproducir música y grabaciones de palabras habladas. tales como ciertos tipos de archivos multimedia. Un objeto plug-in es un archivo que puede ser reconocido por un conector. Los visitantes al sitio web también deben tener instalado el plug-in para poder escuchar objetos RealAudio. pero existen muchos más. los datos de los sonidos son "vertidos" en la computadora mientras los sonidos se reproducen.cla o . 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ú. Otros objetos plug-in Un conector (plug-in) es un código de programa que provee cierta funcionalidad que no se incluye inicialmente en su navegador Web. Las películas QuickTime y archivos RealAudio son dos de los tipos de objetos plug-in. en el sentido de que son pequeños programas que pueden ser insertados en las páginas Web para realizar acciones similares a los que una aplicación ordinaria puede hacer. Generalmente. Para obtener una vista preliminar de un objeto RealAudio en la ventana de Vista Previa. ActiveX es un estándar perteneciente a Microsoft. Existen applets Java disponibles para ejecutar una gran cantidad de acciones.ra.Sonidos RealAudio El RealAudio es un archivo de sonido de alta compresión "de torrente". A diferencia de una aplicación ordinaria. La mayoría de los applets Java no se ejecutan en su propia ventana. Los archivos de applets Java usan la extensión . Java applets Un applet Java es un pequeño programa que puede ser insertado en una página Web. incluyendo las versiones más recientes de Internet Explorer y Netscape. No todos los navegadores utilizan Java.class. intente buscar "Java applets" en su buscador preferido de Internet. un applet Java no es ejecutado al hacer doble clic sobre un icono o seleccionando un elemento del menú de Inicio de Windows. Controles ActiveX Los controles ActiveX son similares a los applets Java.rm o . Muchos controles ActiveX se encuentran interconstruidos en Windows y están disponibles (junto con otros controles ActiveX Agregando objetos multimedia 195 . pero los más modernos sí.ram. el conector maneja formatos que el navegador no puede.

Cuando se inserta un objeto multimedia en un documento. 4 Haga clic en el botón Parámetros para abrir el diálogo Parámetros de Control ActiveX y edite los ajustes concernientes a Shockwave. No modifique el parámetro ID de Clase. Para obtener una vista preliminar de un objeto multimedia en acción.ya instalados en su sistema) en el menú ID de Clase cuando se abre el diálogo Propiedades de Control ActiveX. haga lo siguiente: 1 Seleccione el comando Insertar > Avanzado > Shockwave. 6. haga lo siguiente: 1 Seleccione el comando Insertar > Avanzado > Flash. localice y seleccione un archivo Flash en su disco duro o proporcione la dirección URL donde se puede localizar en la Web y luego haga clic sobre el botón Abrir o Abrir URL. se representa en la ventana de Edición como un marcador: un pequeño recuadro blanco con un borde punteado y la ruta de acceso del objeto desplegada en el centro.1 Insertando una animación Flash o Shockwave Para insertar un objeto Flash. espaciamiento y alineación. 5 Haga clic sobre el botón Aceptar dos veces para regresar a la ventana de Edición. Flash. Shockwave y RealAudio son objetos que Namo WebEditor trata como controles ActiveX. 196 Capítulo 6 Agregando Elementos Dinámicos . 2 En el diálogo Abrir. 3 En el diálogo Propiedades del control ActiveX. Para insertar un objeto Shockwave. No modifique el parámetro ID de Clase. 4 Haga clic en el botón Parámetros para abrir el diálogo Parámetros del Control ActiveX y edite los ajustes concernientes a Flash. cambie a la solapa de Vista Previa. proporcione la ID (nombre) del objeto Shockwave y fije el tamaño. espaciamiento y alineación. proporcione la ID (nombre) de la animación Flash y fije el tamaño.4. 3 En el diálogo Propiedades del Control ActiveX. Los controles ActiveX no son incluidos en Netscape y puede que no funcionen en otros navegadores que no sean Internet Explorer. localice y seleccione un archivo Shockwave en su disco duro o proporcione la dirección URL donde se puede localizar en la Web y luego haga clic sobre el botón Abrir o Abrir URL. 2 En el diálogo Abrir. 5 Haga clic sobre el botón Aceptar dos veces para regresar a la ventana de Edición.

No modifique el parámetro ID de Clase. 4 Haga clic en el botón Propiedades QuickTime. 4 Haga clic sobre el botón Aceptar.4.2 Insertando una película QuickTime Para insertar una película QuickTime. Agregando objetos multimedia 197 . 6. 4 Haga clic en el botón Parámetros para abrir el diálogo Parámetros de Control ActiveX y editar los parámetros específicos de RealAudio. 2 En el diálogo Abrir.3 Insertando un sonido MIDI Para insertar un archivo MIDI. edite las propiedades del sonido MIDI. 6 Haga clic sobre el botón Aceptar dos veces para regresar a la ventana de Edición. haga lo siguiente: 1 Seleccione el comando Insertar > Avanzado > QuickTime.4. 5 Edite las propiedades específicas de la película QuickTime. localice y seleccione un archivo MIDI de su disco duro o proporcione la dirección URL donde se pueda localizar en la Web y luego haga clic sobre el botón Abrir o Abrir URL.4. espaciamiento y alineación. 2 En el diálogo Abrir. localice y seleccione una película QuickTime en su disco duro o proporcione la dirección URL donde se puede localizar en la Web y luego haga clic sobre el botón Abrir o Abrir URL. 3 En el diálogo Propiedades del Plug-in. 6. localice y seleccione un archivo RealAudio de su disco duro o proporcione la dirección URL donde se pueda localizar en la Web y luego haga clic sobre el botón Abrir o Abrir URL. 3 En el diálogo Propiedades del Control ActiveX. haga lo siguiente: 1 Seleccione el comando Insertar > Avanzado > MIDI. El diálogo Propiedades QuickTime aparecerá. 5 Haga clic sobre el botón Aceptar dos veces para regresar a la ventana de Edición.4 Insertando un sonido RealAudio 1 Seleccione el comando Insertar > Avanzado > RealAudio.6. 3 Edite los parámetros generales de la película QuickTime en el diálogo Propiedades del Plug-in. proporcione la ID (nombre) del archivo RealAudio y fije el tamaño. 2 En el diálogo Abrir.

.

12 Creando un bloque de modificación 7. En este capítulo 7.13 Agregando elementos de bloque en la ventana de Edición 7.8 Creando un bloque de lista o tabla 7.10 Creando un bloque de gráfico 7.1 Introducción al Asistente de Bases de Datos 7.6 Agregando y quitando elementos de bloque 7.3 Seleccionando una fuente de datos 7.14 Modificando las propiedades basadas en una base de datos 199 .11 Creando un bloque de entrada 7.5 Proporcionando una sentencia de selección 7.4 Seleccionando campos de una base de datos 7.9 Creando un bloque de detalle 7.7 Apariencia de los bloques en la ventana de Edición 7.2 Seleccionando un documento de tipo dinámico 7.Capítulo 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.

CD. es práctica común referirse a los campos por el nombre de la tabla y del campo. A continuación mostramos el ejemplo de una tabla de base de datos que contiene información acerca de una colección de música en CD. podrá tener una tabla que contenga información de cada uno de los CD de su propiedad.Género y CD. 200 Capítulo 7 Creando Documentos basados en Bases de Datos . una base de datos es un archivo (o un conjunto de archivos) que contienen una o más colecciones de datos que se organizan en formas útiles. Los registros se organizan en campos (también llamados columnas. CD. tales como la lista de los nombres de empleados. etc. Dentro de cada tabla. Una base de datos para un amante de la música. tal como un título de un CD.. El registro puede contener datos tales como el título del CD. 7. los nombres de los campos serían CD. Cada campo de un registro contiene una pieza única de datos.1 Acerca de las bases de datos Una base de datos es. La base de datos almacena cada colección de datos similares en una tabla. el título de cada canción. Título Boys for Pele Joshua Judges Ruth Simonía No. si la tabla mostrada se llamara “CD”. la información de una entidad única (un CD de música.Título.1.7. otra podrá contener información de una lista de artistas y canciones favoritas. la longitud total. Género y Duración. el libro de recetas u otra información. Los “datos” pueden almacenar cualquier tipo de información. dentro de los términos más generales. etc. La tabla tiene cuatro campos: Título. etc. por ejemplo. Cuando una base de datos contiene más de una tabla. el nombre del artista. sencillamente una colección de datos. por ejemplo) se almacena en un registro. En términos informáticos.Duración. no en el sentido de la industria de la música). mientras que cada columna es un campo. tal como nombres de empleados. títulos de películas. por analogía con las tablas de hoja de cálculo).1 Introducción al Asistente de Bases de Datos El Asistente de Base de Datos de Namo WebEditor le ayuda a crear una gran variedad de páginas web dinámicas basadas en una base de datos.Artista. “Colección” significa un conjunto de datos similares. 5 Artista Tori Amos Lyle Lovett Beethoven Género Pop/Rock Country Clásico Duración 71:10 53:48 33:12 Cada renglón de la tabla es un registro (en el sentido técnico. Por ejemplo. recetas de pasteles. Artista. en unos cuantos pasos fáciles.

Si se tuvieran que modificar todos estos documentos cuando hubiese un cambio en un catálogo.1. las partes de la base de datos que se desean en el documento y decidir cómo presentar la información a los visitantes del sitio web.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. Seguramente el comerciante en línea deberá tener de todas formas la información almacenada en una base de datos. se debe abrir el mismo dentro de una herramienta para modificar HTML (Namo WebEditor) y editarse a mano.7. En lugar de eso. el documento estuviese habilitado por una base de datos. Un bloque es una región del documento que despliega registros o deja que el visitante modifique los registros de la base de datos. Si por ejemplo. el documento web también lo hace de manera automática. nuestra página web contiene la lista de una colección de CD de música y también se cuenta con una base de datos de Microsoft Access que contiene la misma información. inserta los llamados bloques en el documento abierto en la ventana de Edición. el Asistente de Bases de Datos de Namo WebEditor genera este código para usted después del guiarlo a través de un proceso de seleccionar la base de datos. Si se quiere cambiar el contenido. en cambio. En un documento web normal (no habilitado por una base de datos). Cuatro de ellos despliegan registros de la base de datos en distintas formas. la página se actualizará de manera inmediata ahorrando tiempo y esfuerzo. 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 páginas dónde buscar la información dentro de una base de datos. mientras que los otros dos permiten a los visitantes modificar o dar de alta nuevos registros en la base de datos. La ventaja es aún más clara si nos imaginamos un sitio web donde se pueden hacer compras en línea y donde se tengan cientos o miles de páginas con todo tipo de datos que cambian frecuentemente: nombres de productos. se perdería un tiempo considerable. Puesto que el Asistente de Base de Datos inserta bloques en lugar de generar Introducción al Asistente de Bases de Datos 201 .1. Si. cuando se añada un disco más a la colección (al no utilizar un documento que se habilite con una base de datos) se debe editar su contenido para insertar la información. así que tiene mucho sentido tomar de ahí el contenido para modificar las páginas Web. 7. para utilizar otro término popular) es aquel en el que una parte. viene de una base de datos. se provee todo el contenido al editar el documento. al agregar la información a la base. o todo el contenido. estado de acciones y similares.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. precios. El beneficio de obtener el contenido de la base de datos es que cuando los datos en ella cambian. El Asistente de Base de Datos no crea por completo los documentos. Usualmente esto implica colocar cierto código JavaScript en el código fuente HTML. Afortunadamente no es necesario escribir ningún código para habilitar un documento por medio de una base de datos.

7. 1 Cree un nuevo documento o abra uno ya existente. Despliega un sólo registro. Para ejemplos de cómo se ven los bloques en un navegador. 202 Capítulo 7 Creando Documentos basados en Bases de Datos . Bloque de Modificación Provee un formulario para que los visitantes al sitio puedan modificar un registro existente. 2 Seleccione el comando Base de datos del menú Insertar que corresponde al tipo de bloque a incluir en el 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 Gráfico Bloque de Entrada Despliega registros múltiples. 4 Seleccione un origen de los datos (su base de datos) y provea su nombre de usuario y contraseña. con cada campo en su propia línea. Despliega registros múltiples en una lista. usted retiene el control total sobre el formato y el contenido estático (no basado en la base de datos) del documento. de la 7.1. Sin embargo. 6 Especifique unas cuantas opciones concernientes al tipo de bloque particular que se seleccionó. Provee un formulario para que los visitantes al sitio puedan dar de alta nuevos registros.8 a la 7. los procedimientos se describen en detalle en otras secciones de este capítulo.13. un registro por renglón. todos los tipos de bloques pueden coexistir con bloques de detalle y gráficos. Despliega datos numéricos de registros múltiples como un gráfico. algunos de los bloques no pueden coexistir en el mismo documento. 5 Seleccione las tablas y campos de la base de datos a usar en el documento. Los bloques de entrada. con cada uno de los campos de una base de datos en una columna. para tener acceso a la base de datos. modificación.4 Pasos básicos para usar el Asistente de Bases de Datos A continuación mostramos los pasos básicos para usar el Asistente de Base de Datos. 3 Especifique el formato dinámico del documento (ASP o PHP) y el método de conexión a la base de datos utilizada. Por otro lado. No se preocupe si alguno de los términos usados no le es familiar.un documento completo. Esto activará el asistente para ese tipo de bloque. Un único documento puede tener más de un bloque. tablas y listas son mutuamente excluyentes y sólo uno de ellos puede existir en un documento. si se requiere. de los que puede haber más de uno en un documento. vea las secciones individuales de cada tipo de bloque.

1. tal como Chili!Soft ASP. en la computadora en la cual se usa Namo WebEditor. 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. en la computadora donde este utilizando Namo WebEditor. un estándar ampliamente difundido para Introducción al Asistente de Bases de Datos 203 . Si su servidor Web ejecuta Unix o Linux y desea usar PHP. se debe instalar un programa capaz de manejar secuencias de comandos ASP. Si su servidor Web tiene instaldo el SO Windows y desea usar PHP. dependiendo del formato dinámico seleccionado para el documento.5 Requerimientos para usar el Asistente de Bases de Datos Antes de usar el Asistente de Base de Datos. se debe tener instalado. se requiere establecer la base de datos como el origen de los datos (DSN) dentro del diálogo Fuentes de ODBC del panel de control de Windows. Por lo tanto. De manera alternativa. Si su servidor Web usa Unix o Linux y desea usar ASP. el servidor Web debe poder ejecutar secuencias de comandos ASP o PHP. debe instalar PHP para Windows. Para la mayoría de las bases de datos. necesita establecer su base de datos como datos orígenes (DSN) dentro del panel de control de Windows en la opción Fuente de Datos ODBC. esta conexión se establece a través de ODBC. Por lo tanto. Por lo tanto.7. 7. asegúrese de que cuenta con los siguientes requerimientos básicos: Servidor capaz de interpretar ASP o PHP Los documentos basados en una base de datos que el Asistente de Base de Datos crea. ya sea el Microsoft Personal Web Server (PWS) o Microsoft Internet Information Server (IIS). se guardan como documentos ASP o PHP. Una conexión 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. Si el servidor ejecuta Microsoft IIS o PWS.6 Creando una conexión 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.1. debe instalar el programa apropiado de PHP para su sistema operativo Una conexión 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. no se requieren programas adicionales para ejecutar programas ASP.

conexiones a bases de datos. 7 Localice y seleccione su base de datos y luego haga clic sobre el botón Aceptar. data source name) para su base de datos. (El nombre puede variar ligeramente dependiendo de la versión de Windows que use. seleccione “Microsoft Access Driver”. 4 Seleccione el manejador adecuado para su tipo de base de datos. haga clic sobre el botón Seleccionar. siga los siguientes pasos tanto en su ordenador como en el servidor Web. dependiendo del tipo de bloque que quiera crear. 7. 6 En 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. 8 Si desea proteger el origen de datos con una contraseña. a menos de que tenga una base de datos MySQL. (Si el sistema operativo del servidor no es Windows. El nuevo DSN debe aparecer en la lista DSN del Sistema. si su base de datos es Microsoft Access. Para fijar una conexión ODBC a la base de datos.) 1 Dentro del menú Inicio de Windows. El servidor Web usado también debe ser capaz de conectarse a la base de datos usando ODBC. seleccione Configuración > Panel de Control.7 Lista de pasos del Asistente de Bases de Datos Hay entre cinco y siete pasos dentro del Asistente de Base de Datos. Haga clic sobre el botón Finalizar. Si la información es correcta. La siguiente tabla muestra el nombre de los pasos dentro del asistente para los seis tipos de bloques. proporcione su nombre de acceso y contraseña y luego haga clic sobre el botón Aceptar. Si aún no lo a hecho. Todos los tipos de bloques tienen tres pasos en común y la mayoría de ellos tienen también el mismo cuarto y quinto pasos. haga clic sobre el botón Aceptar para cerrar el applet. 204 Capítulo 7 Creando Documentos basados en Bases de Datos . haga clic sobre el botón Avanzado. Por ejemplo. 2 Abra el applet Fuentes de datos ODBC. 5 Proporcione un nombre para el origen de datos (el DSN).) 3 Haga clic en la solapa DSN de sistema y luego haga clic sobre el botón Agregar . El nombre puede ser cualquiera que elija.1. refiérase a la documentación del programa ODBC instalado. 9 Haga clic sobre el botón Aceptar para agregar el DSN.

La información de los otros pasos.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 selección Sentencia de selección Sentencia de selección Sentencia de selección Sentencia de selección Paso 5 Método de entrada Elementos de Bloque Elementos de Bloque Elementos de Bloque Elementos de Bloque Parámetro s del gráfico Paso 6 Paso 7 Modificación Método de entrada Parámetro s de la lista Parámetro s de la lista Tabla Lista Detalle Gráfico Tipo de gráfico Títulos del gráfico La mayoría de estos pasos se describen en las siguientes cinco secciones. pueden ser encontradas en las secciones 7.8 a la 7. específicas de un bloque. así como de notas de cada paso.13. Introducción al Asistente de Bases de Datos 205 .

2 Seleccionando un documento de tipo dinámico Tipo de Documento. el primer paso del Asistente de Base de Datos para todos los tipos de bloques. especificando el tipo de conexión de la base datos y el sistema operativo utilizado en el servidor web que contendrá los documentos habilitados por bases de datos.7. 7. es en el que se selecciona un tipo documento dinámico (ASP o PHP). seleccione el formato del documento dinámico que desea utilizar. Internet Information Server (IIS) y Personal Web Server (PWS). Si su servidor Web tiene instalado IIS o PWS.1 Seleccionando un tipo de secuencia de comandos (script) En el menú Tipo de Secuencia de Comandos. En otras plataformas. ASP es probablemente la mejor selección para el formato del documento. Hay dos elecciones posibles: ASP y PHP.2. ASP (Active Server Pages) es el estándar propiedad de Microsoft para crear documentos actualizados de manera dinámica. el ASP se provee a través de programas de terceras compañías tales como Chili!Soft ASP. El programa de servidor de Microsoft. contienen apoyo interconstruido para ASP. 206 Capítulo 7 Creando Documentos basados en Bases de Datos .

pero de distribución libre. en cuyo caso se usa para determinar el programa CGI apropiado que se usa para generar dinámicamente el gráfico. este ajuste se ignora. En la mayoría de los casos se debe utilizar ODBC.2. 7. Si el documento no contendrá un bloque de gráfico. Es similar en su funcionamiento a ASP. 7.2. Requerimientos para tener una vista previa de un documento habilitado por una base de datos Para poder tener una vista previa del documento. Puede ser ODBC o Manejador MySQL Interconstruido. Seleccione Manejador MySQL Interconstruido si utiliza una base de datos en un servidor Web del tipo Unix. sugerimos que utilice ODBC mientras construye el documento y luego intercambie a Manejador MySQL Interconstruido justo antes de publicar el documento al sitio Web.php. Si selecciona PHP como el tipo de secuencia de comandos y el manejador MySQL interconstruido como tipo de conexión. Seleccionando un documento de tipo dinámico 207 .2 Especificando el tipo de conexión de la base de datos En el menú Base de datos. Se pueden cambiar estos parámetros en el diálogo Propiedades del Encabezado del Documento (use el comando Insertar > Base de datos > Propiedades del Documento). PHP puede ser descargado de forma gratuita desde http://www.PHP (PHP Hypertext Preprocessor) es un estándar de código abierto para crear documentos web actualizados de manera dinámica. Para superar esta limitación. Este ajuste sólo es importante si se crea un bloque de gráfico. especifique el tipo de conexión que es utilizado para tener acceso a la base de datos.net. no será posible tener una vista previa del documento. Esto se debe a que Namo WebEditor usa conexiones ODBC para comunicarse con la base de datos para propósitos de la vista previa. se determina qué sistema operativo es el que usa el servidor que atiende al documento habilitado por la base de datos. debe seleccionar ASP como el tipo de secuencia de comandos y ODBC como el tipo de conexión de base de datos.3 Especificando el Sistema Operativo del servidor En el menú SO del Servidor.

3 Seleccionando un origen de los datos Origen de Datos. Sin embargo. para tener acceso a los datos. aunque se haya seleccionado Manejador de MySQL interconstruido como la Conexión de la Base de Datos en el Paso 1 del Asistente de Bases de Datos. Sin embargo.1.7. 208 Capítulo 7 Creando Documentos basados en Bases de Datos . incluye determinar un origen de datos (base de datos) del cual obtener el contenido del bloque.6: Creando una conexión ODBC a una base de datos Se debe seleccionar un origen de datos ODBC. el segundo paso del Asistente de Base de Datos para todos los tipos de bloques. así como proporcionar su ID de usuario y contraseñas. no se podrá tener una vista previa del documento habilitado con la base de datos dentro de la ventana de Vista Previa. se pueden terminar todos los pasos del asistente de bases de datos. Si el origen de los datos se encuentra protegido por contraseña y no se proporciona. Seleccione un origen de datos ODBC dentro de la lista Origen de Datos. si son necesarios. Esto se debe a que Namo WebEditor debe conectarse a la base de datos a través de ODBC para poder obtener una lista de tablas y campos. 7. el documento publicado puede usar cualquier método de conexión seleccionado en el primer paso del asistente (o en el diálogo Propiedades del Encabezado del Documento). Si es necesario. proporcione su ID de Usuario y Contraseña en los recuadros adecuados.

Para eliminar un campo de la lista de la derecha. se pueden agregar campos de tablas múltiples. La lista jerárquica del lado izquierdo del diálogo muestra todas las tablas del origen de datos que se especificó en el paso previo del Asistente de Base de Datos. se muestran los campos de la tabla. haga clic sobre el botón Borrar. selecciónelo a la izquierda y haga clic sobre el botón Agregar. selecciónelo y haga clic sobre el botón Eliminar. es posible seleccionar campos de más de una tabla para incluir en el bloque. Si se hace clic sobre el símbolo de más que se encuentra junto al nombre de la tabla. La lista de la derecha muestra los nombres de los campos que serán usados en ese bloque. sólo se pueden incluir campos de una tabla.7. Dependiendo del tipo de bloque. Para remover los campos de la lista derecha y volver a empezar. el tercer paso del Asistente de Base de Datos para todo tipo de bloque. Sin embargo. Para agregar un campo a la lista. debe incluir un comando del Seleccionando campos de una base de datos 209 . Si desea hacerlo.4 Seleccionando campos de una base de datos En Campos de la Base de Datos. seleccione la tabla y haga clic sobre el botón Agregar. Si se está creando un bloque de entrada o modificación. Para agregar todos los campos a la vez. para cualquier otro tipo de bloque (los de salida). junto con el tipo de dato y otras informaciones. se seleccionan los campos de la base de datos que se desplegarán en el bloque.

no se necesitan seleccionar campos de otras.tipo “unión” (join) dentro del paso de la Sentencia de Selección del asistente. 7.4. que contiene la lista de pedidos u órdenes de los clientes y otra llamada Clientes.0 Cantidad 5 1 10 7. sólo requerimos seleccionar todos los campos de la tabla. consideremos un ejemplo. Digamos que tenemos una base de datos que contiene dos tablas. una llamada Pedidos.0 DeepSearch 3. la selección de campos de tablas múltiples es esencial.4. para especificar cómo se relacionan las tablas. La estructura de los registros es la siguiente: Nombre del campo ID Fecha Cliente Producto Cantidad Tipo de Dato Número Fecha Cadena Cadena Número Para crear un bloque de tabla que despliegue la información de esta base de datos. para desplegar los registros de bases de datos más complejas. que almacena los datos de los clientes. 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. Para desplegar registros de bases de datos sencillas. Para comprender por qué. La tabla de Pedidos tiene la siguiente estructura de registros: 210 Capítulo 7 Creando Documentos basados en Bases de Datos . (En muchos casos la base de datos sólo tiene una tabla.2 Seleccionando campos de tablas múltiples Consideremos ahora un ejemplo un poco más complicado en el que intervienen tablas múltiples. Tenemos una base de datos con una tabla que contiene una lista de los pedidos de nuestros clientes. Puesto que sólo contamos con una tabla.0 Namo WebEditor 4. normalmente sólo se requieren seleccionar campos de una tabla.) Sin embargo.1 Seleccionando campos de una tabla Primero consideremos un caso sencillo.

¿Qué pasaría si.ID Pedidos.Nombre del campo Pedidos. los clientes se identifican por un número de identificación.ID Clientes.0 Cantidad 5 1 10 Obviamente. Seleccionando campos de una base de datos 211 . el tener número de identificación de cliente en nuestra columna de clientes no es muy útil. seleccionamos sólo campos de la tabla de Pedidos y no de la de Clientes? Los primeros tres registros de nuestro bloque de tabla se verían así: ID 1 2 3 Fecha 8/5/00 8/12/00 8/27/00 Cliente 106 33 418 Producto Namo WebEditor 4.Ciudad […y así sucesivamente] Tipo de dato Numéro Fecha Numéro Cadena Número Tipo de dato Número Cadena Cadena Cadena […] Mientras que en la base de datos de tabla única los clientes eran identificados por el nombre.Fecha Pedidos.Cantidad Y la de Clientes esta: Nombre del campo Clientes. necesitamos seleccionar dos columnas de la tabla de Clientes — Clientes.Cliente con los de Clientes.Cliente corresponden directamente a los de Clientes.0 DeepSearch 3.0 Namo WebEditor 4. Sería mucho mejor si tuviéramos sus nombres en esa columna. Al hacer esto.Nombre Clientes.Calle Clientes.ID.ID y encontrar el nombre correcto para desplegar. dentro de la base de datos con dos tablas. Los números de identificación dentro de Pedidos.Cliente Pedidos.ID y Clientes. descrito en la siguiente sección.Producto Pedidos. Este emparejamiento de tablas se realiza usando una cláusula unión (join) en el paso Sentencia de Selección del Asistente de Base de Datos.Nombre — además de los campos ya seleccionados de nuestra tabla de Pedidos. al seleccionar los campos de nuestro documento habilitado por la base de datos. Para poder hacer esto. nuestro documento puede comparar los números dentro del campo Pedidos.

212 Capítulo 7 Creando Documentos basados en Bases de Datos .1 Cláusula “unión” (join) Una cláusula de unión (join) le indica al documento cómo se relacionan los campos de múltiples tablas unos con otros. si el bloque incluye campos de más de una tabla. En este paso. Opcionalmente es posible elegir las cláusulas donde (where) y ordenado por (order) para especificar qué campos de la base de datos se despliegan y en qué orden. 7. la cláusula de unión (join) es obligatoria. Una cláusula de unión (join) no es necesaria (ni posible) si el bloque sólo incluye campos de una tabla.7. se proporciona una cláusula del tipo unión (join) si es que se seleccionó campos de más de una tabla dentro del paso Campo de la Base de Datos. a los cuales esta información no se aplica.5 Proporcionando una Sentencia de Selección La Sentencia de Selección es el cuarto paso del Asistente de Base de Datos para todo tipo de bloque a excepción de los bloques de entrada. Por otro lado.5.

Queremos establecer un bloque de tabla que muestre los registros de la base de datos Pedidos. pero usando los nombres que encontramos en la otra tabla para que aparezcan en la columna Clientes. que identifica a los clientes por número de identidad.Cómo se formule la cláusula unión (join) depende de la información que desea desplegar en el bloque y qué campos se encuentran relacionados.campo2 Proporcionando una Sentencia de Selección 213 . en los cuales se debe seleccionar un único registro. Esta cláusula es opcional dentro de un bloque de tabla. puesto que estos sólo incluyen campos de una tabla única. Una cláusula de unión (join) no se aplica a bloques de entrada o modificación.campo1 operador_comparación valor|tabla2.ID sea el mismo que el encontrado en Pedidos.Cliente = Clientes.2 Cláusula “donde” (where) Una cláusula donde (where) es una condición usada para especificar qué registro o registros de la tabla se despliegan en un bloque. La forma básica de una cláusula donde (where) es: tabla1. Si se deben hacer más comparaciones del mismo tipo. En lugar de teclear los nombres.5. Para ilustrar este punto. el documento no podría saber qué registros de la tabla de Clientes debería desplegar en el bloque de tabla. hacemos clic en el botón y los seleccionamos de la lista de los incluidos en el bloque.ID.ID Esto le indica al Asistente de Base de Datos que tomaremos los registros de la tabla Clientes donde el número que se encuentra en Clientes.Cliente con el que se encuentra en Clientes.campo2 La idea básica es establecer una relación entre los campos de dos tablas al incluir el signo de “=” entre los nombres de los dos campos.Nombre al bloque para poder desplegar el nombre al emparejar la identificación del cliente en el campo Pedidos.campo1 = tabla2. 7. El botón a un lado del recuadro Unión (join) nos da un atajo para introducir los nombres de los campos y operadores lógicos. Así que agregamos los campos Clientes. continuemos con el ejemplo de la sección previa. La cláusula unión (join) que debemos usar es la siguiente: Pedidos.Cliente. lista o gráfico. Si no establecemos la cláusula unión (join) (si fuera posible). La forma básica de una cláusula de unión (join) es la siguiente: tabla1. se coloca la palabra “AND” (Y) entre ellas. La cláusula donde (where) no es usada en los bloques de entrada. pero obligatoria para bloques de detalle o modificación.ID y Clientes.

9: Creando un bloque de detalle El botón a un lado del recuadro Donde (where) nos da un atajo para introducir los nombres de los campos y operadores lógicos. En lugar de teclear los nombres. hacemos clic en el botón y los seleccionamos de la lista de los incluidos en el bloque. Dos ejemplos de una cláusula ordenado por (order) son: Pedidos.Nombre.) Algunos operadores de comparación son “=” (igual a). El botón a un lado del recuadro Ordenado por (order) nos da un atajo para introducir los nombres de los campos y operadores lógicos.5. “!” (no es igual a).Cantidad > 10 Pedidos.Fecha y luego por Clientes. hacemos clic en el botón y los seleccionamos de la lista de los incluidos en el bloque.Fecha. Sencillamente proporcione un nombre de campo por el cual realizar el ordenamiento. “<” (menor que).ID = <a.Cantidad BETWEEN 10 AND 20 Pedidos.Fecha. Para hacer más de una comparación se debe usar la palabra “AND” (Y) si las condiciones deben ser ambas verdaderas. Este tipo de cláusula donde (where) es usado para un bloque de detalle o modificación. En lugar de teclear los nombres.Nombre = 'Trisha Long' Clientes. puede ser usado. pero no ambos. Algunos ejemplos de cláusulas donde (where) son: Pedidos.Fecha Pedidos. 214 Capítulo 7 Creando Documentos basados en Bases de Datos . 7.3 Cláusula “ordenado por” (order) Una cláusula ordenado por (order) se usa para especificar el orden de los registros desplegados en un bloque de tabla o lista.(El símbolo “|” entre los dos últimos términos indica que cualquiera de los dos. Clientes. 7.Nombre En el primer ejemplo se ordenan los registros por el campo Pedidos. “>” (mayor que) y “BETWEEN…AND” (entre … y). en los cuales el registro seleccionado se despliega al hacer clic sobre el campo de salida que contiene un vínculo en otro documento. Si desea que la ordenación se haga por llaves múltiples.ID_cliente> El último ejemplo compara los valores en el campo con el argumento pasado al documento por un vínculo (la “a” significa “argumento”). u “OR” (O) si basta con que una de ellas sea verdadera. proporcione el nombre de varios campos separados por comas. En el segundo se ordenan los registros por dos campos — primero por Pedidos.Cantidad > 10 AND Clientes.

lista. la combinación 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. Así. Agregando y quitando elementos de bloque 215 . Por ejemplo. si un bloque de tabla tiene un elemento de campo de salida. generada dinámicamente) del contenido del documento cuando se ve en un navegador. los valores en el campo de la base de datos que corresponden al campo de salida aparecerán en el bloque cuando se vea en un navegador. Cada elemento del bloque provee una parte activa (es decir.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. En este paso se seleccionan los elementos que compondrán en bloque.7. detalle o modificación. Los elementos de bloque son los “ladrillos” de los cuales se forman los documentos habilitados por bases de datos. Este paso no se usa en bloque de gráficos.

1 Tipos de elementos de bloque Hay cinco tipos básicos 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. En la tabla siguiente encontrará una lista detallada de los elementos junto con el tipo de bloque con el que pueden coexistir.6. pero permite al visitante del sitio seleccionar un elemento de un grupo. Los vínculos de página solamente pueden existir dentro de los bloques de tabla o lista. cada tipo de elemento tiene dos o más subtipos. 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. previamente definido. Tipo de elemento de bloque Campo de números Campo de cadenas Campo de texto Campo de fecha entrada de entrada de entrada de entrada de Entrada. modificación Bloque al que se aplica Campos de entrada Controles de entrada Lista desplegable Grupo de botones de opción Entrada. utilizando el ratón. A excepción de los conjuntos de vínculos de página. 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.7. No todo tipo de elemento puede existir en cualquier tipo de bloque. modificación 216 Capítulo 7 Creando Documentos basados en Bases de Datos . Los campos de salida son apropiados para los bloques de tabla. Los campos y controles de entrada solamente pueden existir dentro de los bloques de entrada y modificación. lista. Controles de Entrada Un control de entrada es similar a un campo de entrada. Conjunto de vínculos de página Un conjunto de vínculos de página permite al visitante ver registros adicionales de una tabla o bloque de lista al permitirle pasar a otra página de registros. Los campos ocultos solamente son útiles dentro de los bloques de modificación. detalle y (algunas veces) modificación.

Agregamos esos campos para poder desplegar el nombre de cliente correspondiente a su identificación.4 y 7. tenemos ahora elementos para los campos Clientes. en los cuales se deben agregar o eliminar ciertos elementos. Sin embargo. 7. En ese ejemplo. se puede reemplazar el campo de entrada de los productos con una lista en la cual impedimos que el visitante invente nuevos productos. no hay necesidad de editar la lista de elementos. por ejemplo. por lo que también lo eliminamos.Cliente. lista Campo oculto Conjunto de vínculos de página Además de los tipos de elementos ya mencionadas. sin embargo.ID de la lista de elementos. Puesto que no necesitamos desplegar la identificación de cliente. no requerimos un campo de salida para Pedidos.5. para limitar al visitante a seleccionar un cierto número de elementos ya definidos para agregar al campo de la base datos.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. la encontramos en los pedidos de los clientes que usamos como ejemplo en las secciones 7. añadimos campos de dos tablas dentro de un bloque de tabla. Adicionalmente.Nombre en la lista elementos. Para agregar un elemento al bloque. la lista de elementos incluye un conjunto de vínculos de página para permitir que el visitante pueda ver páginas adicionales de registros.6. particularmente si se incluyeron campos de una base datos que contiene más de una tabla. Un ejemplo de una situación en la cual es necesario eliminar ciertos elementos. Si tenemos. en lugar de sólo un número. Por ejemplo. existe otro elemento de bloque que solamente puede existir dentro de uno gráfico: el elemento gráfico. puesto que el Asistente de Base de Datos agrega elementos de bloque para cada campo incluido.ID y Clientes. un bloque de entrada que sirve como formulario de pedido. haga lo siguiente: Agregando y quitando elementos de bloque 217 . debemos remover el campo de salida para Clientes. Además de esto. Existen casos. se puede reemplazar un campo de entrada con una lista desplegable o un grupo de botones de opción. Hay veces en las cuales necesitaremos agregar elementos de bloque.ID y Clientes.Nombre.Campos de salida Campo de salida Campo de salida (vínculo) Todos excepto el de entrada Modificación Tabla. En la mayoría de los casos. incluyendo dos campos de la tabla Clientes: Clientes. que sólo contiene el número de identificación de cliente. si el bloque es uno del tipo tabla o lista.

Para mayor información de cómo añadir elementos a un bloque. una vez que se han completado todos los pasos del Asistente de Base de Datos. vea la sección 7. Se mostrará un diálogo de propiedades para el elemento seleccionado. 3 Llene las propiedades del diálogo y haga clic sobre el botón Aceptar. incluyendo la descripción del diálogo de propiedades de ese elemento.13: Agregando y eliminando elementos de bloque en la ventana de Edición.1 Haga clic en el botón Agregar. Una lista que contiene los tipos de elementos a usar aparecerá. Se pueden también añadir elementos a un bloque dentro de la ventana de edición. vea la sección 7. Para mayor información acerca de cómo agregar controles de entrada. 2 Seleccione un tipo de elemento de la lista.11: Creando un bloque de entrada. 218 Capítulo 7 Creando Documentos basados en Bases de Datos .

Las palabras “valor de escritura” sirven como marcador para cada uno de los campos de salida. del lado derecho. Existe un renglón por Apariencia de los bloques en la ventana de Edición 219 . tal como aparece en la ventana de Edición antes de cualquier modificación. el renglón inferior de la tabla contiene el conjunto de vínculos de la página utilizado para ver páginas adicionales de registros. En un bloque de entrada. El segundo renglón contiene la mayoría de los elementos activos del bloque: cada celda contiene un campo de salida. Finalmente. que son etiquetas estáticas. En la siguiente imagen se muestra cómo aparece un bloque de tabla para una lista de órdenes de clientes en la ventana de edición. antes de realizar cualquier modificación: El renglón superior de la tabla contiene los nombres de la base de datos.7. un nuevo bloque se insertará dentro del documento activo en la ventana de edición. en el sitio donde se encontraba el punto de inserción. La imagen inferior muestra un sencillo bloque de entrada para agregar nuevas órdenes de clientes. los nombres de los campos aparecen a la izquierda de una tabla de dos columnas.7 Apariencia de los bloques en la ventana de Edición Una vez que se haya completado el Asistente de Base de Datos. los campos de entrada y controles.

haga doble clic sobre él y teclee el nuevo texto dentro del recuadro Valor. color de fondo y cualquier otro atributo de apariencia. Se puede cambiar su tipografía. colores y demás.cada elemento del bloque. puesto que son solamente texto estático. Finalmente. no se debe mover ningún elemento fuera del bloque. tamaño de texto.) Se le puede aplicar formato a un campo de salida sencillo o con vínculo al igual que si se tratara de un texto estático. encontramos el botón de envío (utilizado para que el visitante del sitio transmita la orden) y un botón de inicio (utilizado para limpiar todas las entradas del formulario de pedidos. Si no está satisfecho con la distribución de los elementos de un bloque. tal como si se tratara de un elemento estático de la página. Es posible. 220 Capítulo 7 Creando Documentos basados en Bases de Datos . Para cambiar la etiqueta de un botón. Se pueden modificar las etiquetas de los botones dentro de los bloques de entrada o modificación. Las etiquetas que el Asistente de Base de Datos genera para los elementos pueden ser editadas y cambiadas de formato libremente. seguidos por dos menús desplegables y un campo de entrada de números.) 7. Se puede aplicar incluso un estilo tipo CSS. los elementos son del tipo campo de entrada de fecha. Se puede agregar más texto estático o imágenes dentro o fuera del bloque. (Sin embargo. combinar o dividir las celdas de una tabla que se utiliza para ordenar los elementos de un bloque. Es posible cambiar el tamaño. Incluso se pueden eliminar. incluso. en la parte inferior.1 Modificando la apariencia de un bloque Se puede modificar y dar formato a un bloque. cambiar el tamaño de la tabla así como sus bordes. se pueden mover utilizando la técnica de arrastrar y soltar o copiar y pegar.7. En el caso particular que se muestra en la imagen superior.

que se indican por las palabras subrayadas “nombre del vínculo”. 7. mientras que un bloque de lista los despliega de forma secuencial.7. tal como una hoja de cálculo.8. con cada campo de salida en su propio renglón.1 Ejemplo de un bloque de tabla A continuación mostramos un ejemplo de la salida de un bloque de tabla. Un bloque de tabla muestra registros dentro de renglones y columnas. además de los campos de salida normales.8 Creando un bloque de lista o tabla Los bloques de lista o tabla son utilizados para desplegar registros múltiples. tal como se ve en la ventana de Vista Previa: A continuación mostramos el mismo bloque de tabla dentro de la ventana de Edición: Este bloqueo de entrada en particular contiene campos de salidas con vínculos. Creando un bloque de lista o tabla 221 .

222 Capítulo 7 Creando Documentos basados en Bases de Datos .13.2: Agregando un vínculo a un campo de salida 7.7. cualquier texto HTML dentro de un campo en la base datos se despliega correctamente dentro del navegador.2 Ejemplo de un bloque de lista A continuación mostramos un ejemplo de un bloque de lista tal como se ve en la ventana de Vista Previa.8. Este bloque en particular se utiliza para desplegar una lista de los artículos nuevos. Como se muestra en el ejemplo.

Las etiquetas (nombres de los campos) de ambos campos de salida han sido eliminados.A continuación mostramos el mismo bloque de lista tal como se ve en la ventana de Edición. En este bloque de lista encontramos tres elementos: un campo de salida para la fecha de los nuevos artículos. dejando solamente los elementos activos. 4 Seleccione un origen de los datos tal como se describe en la Sección 7. haga lo siguiente: 1 Cree un nuevo documento o abra uno ya existente. 7 Si es necesario. edite la lista de elementos del bloque como ser describe en la Sección 7.3 y luego haga clic sobre el botón Siguiente.5 y luego haga clic sobre el botón Siguiente. especifique el número de registros a desplegar por página y luego haga clic sobre el botón Finalizar. 2 Seleccione el comando Insertar > Base de datos > Bloque de Tabla. 7. Se agregó texto estático en la parte superior del bloque y una línea de división horizontal debajo del segundo campo de salida. 5 Seleccione los campos de una o más bases de datos como se describe en la Sección 7.2 y luego haga clic sobre el botón Siguiente. Esto inicia el Asistente de Base de Datos. 3 Seleccione un tipo de documento dinámico tal como se describe en la Sección 7.6 y luego haga clic sobre el botón Siguiente.4 y luego haga clic sobre el botón Siguiente. Creando un bloque de lista o tabla 223 . 6 Proporcione sentencias de seleccione opcionales — tal como una cláusula de unión (join) si se incluyen campos de más de una tabla dentro de la base de datos en el paso anterior — como se describe en la Sección 7.8.3 Pasos para crear un bloque de lista o de tabla Para crear un bloque de tabla. 8 En el paso Parámetros de la lista. un campo de salida para los artículos nuevos y un conjunto de vínculos de página.

6 y luego haga clic sobre el botón Siguiente. como se describe en la Sección 7. 8 En el paso Parámetros de la lista.Para crear un bloque de lista. 6 Proporcione sentencias de selecciones opcionales — tal como una cláusula de unión (join) — si se incluyen campos de más de una tabla dentro de la base de datos en el paso anterior. Una vez que se han completado todo los pasos del Asistente de Base de Datos. De formato al bloque y agregue el contenido estático que se requiera (vea la Sección 7.2 y luego haga clic sobre el botón Siguiente. edite la lista de elementos del bloque como ser describe en la Sección 7. haga lo siguiente: 1 Cree un documento nuevo o abra uno ya existente. Esto inicia el Asistente de Base de Datos. 2 Seleccione el comando Insertar > Base de datos > Bloque de Lista. 4 Seleccione un origen de los datos tal como se describe en la Sección 7. 3 Seleccione un formato de documento dinámico tal como se describe en la Sección 7. especifique el número de registros a desplegar por página y luego haga clic sobre el botón Finalizar. 224 Capítulo 7 Creando Documentos basados en Bases de Datos . 5 Seleccione los campos de una o más bases de datos como se describe en la Sección 7.16). el bloque de tabla o lista se incorpora en la posición donde encuentra el punto de inserción en el documento activo.5 y luego haga clic sobre el botón Siguiente 7 Si es necesario.4 y luego haga clic sobre el botón Siguiente.3 y luego haga clic sobre el botón Siguiente.

tal como se ve en la ventana de Vista Previa: Creando un bloque de detalle 225 . 7.7. seleccionado por número de identificación o cualquier otro criterio.1 Ejemplo de un bloque de detalle A continuación mostramos un ejemplo de un bloque de detalle de un registro de un cliente.9.9 Creando un bloque de detalle Un bloque de detalle se utiliza para desplegar un registro único.

2 y luego haga clic sobre el botón Siguiente.2 Pasos para crear un bloque de detalle Para crear un bloque de detalle. 2 Seleccione el comando Insertar > Base de datos > Bloque de Detalle. 5 Seleccione los campos de la base de datos tal como se describe en la Sección 7. proporcione una cláusula donde (where) para especificar qué registros se despliegan en el bloque y luego haga clic sobre el botón Siguiente. 3 Seleccione un formato de documento dinámico tal como se describe en la Sección 7.A continuación mostramos el mismo bloque tal y como aparece en la ventana de Edición: Este bloque de detalle contiene once campos de salida.) 226 Capítulo 7 Creando Documentos basados en Bases de Datos .3 y luego haga clic sobre el botón Siguiente. 6 En el paso Sentencia de Selección.4 y luego haga clic sobre el botón Siguiente. 4 Seleccione un origen de los datos tal como se describe en la Sección 7.9. (Vea un poco más abajo para mayor información. Se le ha dado formato al primer campo de salida y a su etiqueta modificándolo con una tipografía de gran tamaño que sirve como una especie de encabezado para el resto del bloque. Esto inicia el Asistente de Base de Datos. haga lo siguiente: 1 Cree un nuevo documento o abra uno ya existente. 7. cada uno con una etiqueta.

el bloque despliega el primer registro de los registros que la cumplen. Si la cláusula proporcionada no selecciona un registro único. la cláusula donde (where) debe tener la siguiente forma: campo. tal como se muestra en la siguiente imagen: Creando un bloque de detalle 227 . Si no se proporciona la cláusula donde (where).nombre_argumento> Esta sentencia compara los valores de un campo específico con los del argumento enviados al bloque de detalle de parte del vínculo.ID = 7 para seleccionar un registro único que cumpla con esas características. tal como un campo de identificación. Una forma de especificar un registro que no admita duplicados para desplegar. Vea la siguiente sección para más información. edite la lista de los elementos del bloque tal y como se describe en la Sección 7. Si se quiere relacionar un bloque de detalle con un campo de salida que utilice vínculos. Por ejemplo se puede proporcionar una cláusula donde (where) tal como Clientes. el bloque de detalle sencillamente despliega el primer registro de la tabla de la base de datos.tabla = <a. dentro de un bloque de detalle se debe proporcionar una cláusula donde (where) que selecciona sólo un registro.9. A diferencia de la mayoría de los otros tipos de bloques. consideremos el siguiente ejemplo. Para mostrar este punto. 7. Esto se hace pasándole argumentos por medio de un campo de salida con un vínculo dentro de otro bloque. es especificar el valor de un campo que se encuentre restringido con características únicas.3 Creando un vínculo a un bloque de detalle La forma más práctica de utilizar un bloque de detalle es hacer que despliegue un registro que corresponda al valor único de un campo.6 y luego haga clic sobre el botón Finalizar. Digamos que tenemos un bloque de tabla que despliega los pedidos de los clientes.7 Si es necesario.

de forma tal que “sepa” qué hacer con los argumentos que recibe. La “f” indica que lo que sigue es el nombre de un campo.Cliente>. Elimine este campo de salida. Dentro del otro documento tendríamos un bloque de detalle que podría ser similar al mostrado al principio de esta sección. o parámetro. Finalmente. los clientes se identifican por un número único de identificación.ID incluido en el bloque. Quisiéramos crear un vínculo sobre cada identificador a otro documento donde se mostrará el registro de información del cliente. también.Pedidos.) Haciendo esto especificamos que el campo de salida con vínculo despliegue los valores encontrados en el campo Pedidos. Estos son los pasos necesarios: 1 Borre el campo de salida para la identificación de cliente dentro del bloque tabla. necesitamos colocar una cláusula donde (where) dentro del bloque de detalle para comparar el valor del argumento con el de Clientes. El diálogo Propiedades del Campo de Salida (Vínculo) aparecerá. declarar el argumento en el bloque detalle. 228 Capítulo 7 Creando Documentos basados en Bases de Datos . 3 Haga clic en el botón a un lado del recuadro Campo de Base de datos y seleccione <f. Necesitamos. Para hacer esto necesitamos reemplazar el campo de salida con el identificador de cliente dentro del bloque de la tabla con un vínculo hacia el documento de detalle. 2 Sin mover el punto de inserción.Cliente — esto es. El vínculo contendrá un argumento. que contiene el número de identificador del cliente sobre el que el visitante hace clic. la identificación del cliente — tal como lo hacía el campo de salida que eliminamos.En este bloque de tabla. (Este es el nombre del campo dentro de la base de datos para la identificación de cliente. seleccione el comando Insertar > Base de datos > Campo de Salida (Vínculo).

El argumento ha sido declarado. proporcione el nombre del argumento que se enviará al documento de detalle cuando el campo de salida con vínculo sea presionado.4 En el recuadro URL. 7 Haga clic sobre el botón Aceptar.Pedidos. especificamos que el valor del argumento debe ser la identificación de cliente en la cual el visitante hizo clic. puesto que aún no hemos declarado ningún parámetro dentro del bloque de detalle. en este ejemplo). proporcione la ruta de acceso al documento que contiene el bloque de detalle. Por ejemplo. en el lugar donde el campo de salida ordinario se encontraba. Nuestro nuevo campo de salida con vínculo se inserta Insertar Campo de salida (vínculo). dentro del recuadro Nombre. 6 Haga clic en el botón a un lado del recuadro Valor y seleccione <f.asp. ID_cliente y presione la tecla <Intro>. 10 Haga clic en la solapa Parámetros y luego haga clic sobre el botón Agregar. 9 Haga clic con el botón derecho del ratón en cualquier parte dentro del bloque de detalle y seleccione Base de datos > Propiedades del Documento en el menú de atajo. si el visitante hace clic en la identificación del cliente 7. Podemos utilizar cualquier nombre (sin espacios). 5 En Parámetros. Haciendo eso.Cliente> otra vez. Creando un bloque de detalle 229 . 8 Abra o cambie al documento que contiene el bloque de detalle (detalle_cliente. El diálogo Propiedades del Encabezado del Documento aparecerá. Llamémosle ID_cliente. 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. “7” es el valor del argumento que se envía al documento de detalle.

ID_cliente>. Ahora lo que hacemos es verificar si el campo de salida con vínculo funciona. Cambie de nuevo al documento que contiene el bloque de tabla. 17 Guarde el documento. 230 Capítulo 7 Creando Documentos basados en Bases de Datos . pase a la ventana de Vista Previa y haga clic sobre cualquier campo que tengo un vínculo. o use el botón a un lado del recuadro que se utilizó para construir la sentencia término a término. Si el documento de detalle que es cargado dentro de la ventana de Vista Previa despliega el registro del cliente correspondiente a su identificador. 15 En el recuadro Donde (where). 14 Haga clic en la solapa Sentencia de Selección. El diálogo Propiedades del Bloque de Detalle aparecerá.ID = <a. (La “a” indica que lo que sigue en un argumento. 16 Haga clic sobre el botón Aceptar para cerrar el diálogo.ID corresponda al argumento ID_cliente. 12 Haga clic sobre el botón Aceptar para cerrar el diálogo. el campo de salida con vínculo funciona correctamente.) Esto informa al bloque de detalle que debe desplegar los registros cuyos valores dentro del campo Clientes. 13 Haga clic con el botón derecho del ratón nuevamente en cualquier parte del bloque y seleccione Base de datos > Propiedades del Bloque en el menú de atajo.Agregar nuevo argumento. escriba Clientes.

1 Ejemplo de bloque de gráfico Por ejemplo. Corea Corea Japón Japón Producto Widgets Gewgaws Widgets Gewgaws Widgets Gewgaws Unidades 796 520 359 425 311 701 Y volcarlos en un gráfico: Creando un bloque de gráfico 231 .UU.10 Creando un bloque de gráfico Un bloque gráfico toma valores numéricos de una o más tablas de una base de datos y las muestra en un formato gráfico.7. EE. un bloque de gráfico puede tomar los valores y nombres de los siguientes registros: ID 1 2 3 4 5 6 País EE. 7.UU.10.

si es que queremos que sirva como origen de datos para un bloque de gráficos: El bloque gráfico solamente puede usar un valor numérico por registro. solamente uno será utilizado por el bloque gráfico.10. donde puede modificar el gráfico casi de la misma manera que se modificaría un gráfico creado usando el Asistente de Gráficos. 5. abrirá el diálogo Propiedades del Bloque Gráfico. Si una tabla contiene más de un campo numérico. Si la tabla solamente tiene un tipo de etiqueta.6: Creando gráficos de tablas 7. Si desea que un bloque gráfico obtenga las etiquetas de la tabla. el bloque gráfico no puede usarlas y se deben proporcionar manualmente.Así es como se ve el gráfico en la ventana de Edición: Se puede cambiar el tamaño del bloque gráfico haciendo clic sobre él y arrastrando las manijas que aparecen en sus esquinas y lados. ésta debe proveer tanto etiquetas de series como de categorías.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 hace doble clic sobre el gráfico. 232 Capítulo 7 Creando Documentos basados en Bases de Datos . Mostramos a continuación ejemplos de tablas con el formato apropiado para ser usadas en un bloque gráfico.

El número de series y categorías también debe especificarse manualmente. 7. Las etiquetas de las series y /o categorías se deben proporcionar manualmente. Creando un bloque de gráfico 233 . dependiendo si los países son series y los productos categorías o viceversa. La gráfica producida de esta tabla puede tener ya sea dos series o tres categorías o tres series y dos categorías. una de las cuales será utilizada como origen de las etiquetas de las series y la otra de las categorías. Solamente hay un campo numérico y dos campos de cadenas. solamente encontramos una serie (temperatura media) junto con seis categorías (los meses). 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 también tiene un formato apropiado para su uso con un bloque gráfico.UU.10.Ejemplo 1 Registro 1 2 3 4 5 6 País EE. EE.3 Pasos para crear un bloque de gráfico 1 Cree un nuevo documento o abra uno ya existente. En esta tabla.UU. no hay etiquetas. Suiza Suecia Japón Japón Producto Widgets Gewgaws Widgets Gewgaws Widgets Gewgaws Vts_unit 796 520 359 425 311 701 Esta tabla es ideal para utilizar con un bloque gráfico. Ejemplo 3 Registro 1 2 3 4 5 6 Valor 796 520 359 425 311 701 En esta tabla sólo encontramos valores.

9 Seleccione un tipo y subtipo de gráfico y luego haga clic sobre el botón Siguiente.) El bloque gráfico será insertado en el documento activo.4 y luego haga clic sobre el botón Siguiente. (Este paso es idéntico al primer paso del Asistente de Gráficos. 3 Seleccione un formato de documento dinámico tal como se describe en la Sección 7.2 Seleccione el comando Insertar > Base de datos > Bloque de Gráfico. 5 Seleccione los campos de una o más bases de datos como se describe en la Sección 7. Esto inicia el Asistente de Base de Datos. Para modificar su apariencia. Series. seleccione el campo de la base de datos de donde se obtendrán los valores numéricos. 6 Proporcione sentencias de selecciones opcionales — tal como una cláusula de unión (join) si se incluyen campos de más de una tabla dentro de la base de datos en el paso anterior — como se describe en la Sección 7. Tendencias. Sólo los campos numéricos 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 Categorías o seleccione Introducir manualmente para proporcionar los nombres posteriormente. Título. 4 Seleccione un origen de los datos tal como se describe en la Sección 7.3 y luego haga clic sobre el botón Siguiente. (Vea las siguientes dos secciones para detalles de este paso. utilizando la lista Valores dentro de Campos fuente. haga clic sobre el botón Siguiente. (Este paso es idéntico al último paso del Asistente de Gráficos.2 y luego haga clic sobre el botón Siguiente.5 y luego haga clic sobre el botón Siguiente 7 En el paso Parámetros del gráfico. Ejes y Formato del gráfico en el diálogo Propiedades del Bloque Gráfico.) Cuando termine. haga doble clic sobre él y utilice la solapas Tipo de gráfico. 234 Capítulo 7 Creando Documentos basados en Bases de Datos .) 10 Opcionalmente. proporcione un título para el gráfico y sus ejes X / Y y luego haga clic sobre el botón Finalizar.

haga lo siguiente: 1 En el paso Parámetros del Gráfico del Asistente de Base de Datos. se pueden cambiar las elecciones dentro de la solapa Parámetros del Bloque Gráfico del diálogo Propiedades del Bloque Gráfico.7. Una vez completado el Asistente de Base de Datos. 2 En la lista Nombre de las series en Campos fuente. si decide utilizar distintos campos como origen de las etiquetas de las series o categorías.10. Creando un bloque de gráfico 235 .4 Obteniendo etiquetas de series y categorías de una base de datos Para obtener etiquetas de las series y categorías a partir de un bloque gráfico de una base datos. 3 En la lista Nombre de Categorías. seleccione el campo de la base de datos del cual se tomarán las etiquetas de las series. seleccione el campo de la base de datos del cual se tomarán las etiquetas de las categorías. haga doble clic sobre el bloque gráfico. Para abrir el diálogo. seleccione Recuperar de base de datos en Origen.

haga doble clic sobre el bloque gráfico para abrir el diálogo Propiedades del Bloque Gráfico y luego haga clic sobre la solapa Series.10. 3 Complete el Asistente de Gráficos. 2 Proporcione el Número de Categorías y el Número de Series que el gráfico debe tener. 236 Capítulo 7 Creando Documentos basados en Bases de Datos . seleccione Introducir manualmente.7. haga lo siguiente: 1 En el paso Parámetros del Gráfico del Asistente de Base de Datos. 4 En la ventana de Edición.5 Proporcionando las etiquetas de series y categorías de forma manual Para proporcionar las etiquetas de las series o categorías de forma manual. en Origen.

de forma predeterminada.5 Seleccione una serie de la lista que se encuentra de lado izquierdo del diálogo y proporcione el Nombre de las series en el recuadro correspondiente. Creando un bloque de gráfico 237 . Repita para cada serie. 7. Si no se hace esto. Para confirmar que las etiquetas se introdujeron correctamente. Para teclear una etiqueta. también se debe publicar el programa CGI. además del ya existente para el servidor web. 7 En la tabla en forma de hoja de cálculo que se encuentra en la parte superior del diálogo. Cuando se publica un documento que contiene un bloque gráfico. puesto que en la mayoría de los casos se publica el contenido completo del directorio. 8 Haga clic sobre el botón Aceptar. 6 Haga clic en la solapa Valores. proporcione la etiqueta de la categoría para cada una de las celdas verdes en el encabezado Categoría. en la misma carpeta en la cual se almacenó el documento que contiene el bloque gráfico. teclee el nombre y luego presione la tecla <Intro>. haga doble clic en la celda. El mantener el programa CGI dentro de la misma carpeta del documento facilita la publicación.10. cambie a la ventana de Vista Previa. con el que su contenido se genera. el visitante del sitio no podrá ver el gráfico.6 Publicando un documento con un bloque gráfico Un bloque gráfico es distinto de los otros tipos que son creados por el Asistente de Base de Datos debido a que requiere un programa adicional. Este programa adicional es llamado CGI y el Asistente de Base de Datos lo coloca.

Por ejemplo.cgi wed_chart_linux.cgi wed_chart_solaris. Para hacer esto. Entonces la ruta de acceso correcta será cgi-bin/wed_chart_windows. si la carpeta CGI se encuentra en su directorio de inicio.cgi wed_chart_solaris_x86. en cuyo caso el programa CGI no puede ser activado. tal como cgi-bin en su directorio de inicio.cgi a ella. si su programa CGI va a residir en cgi-bin/wed_chart_windows. se puede construir la ruta de acceso apropiada para poderla especificar dentro de las propiedades del bloque gráfico. no podrá tener una vista preliminar del gráfico a menos de que se copie el programa CGI a la misma localización en su disco duro. relativa al documento que se especificó en la ruta.Sin embargo. Para especificar la ruta de acceso dentro de las propiedades del bloque gráfico.el camino completo es: C:\Archivos de Programa\Namo\WebEditor 4\lib\DBWizard\ 238 Capítulo 7 Creando Documentos basados en Bases de Datos . Por ejemplo. Si requiere almacenar el programa CGI en una carpeta distinta.cgi. 2 Dentro de Ruta del CGI. su servidor usa el sistema operativo Windows y almacenará el documento que contiene el bloque gráfico en el directorio de inicio. Los programas CGI se localizan dentro de la carpeta donde fue instalado Namo WebEditor en el directorio lib/DBWizard. Si se utilizaron los parámetros predeterminados para la instalación de Namo WebEditor .cgi Una vez que se conoce el nombre del programa CGI. se debe crear una carpeta cgi-bin dentro del directorio donde se encuentra el documento y luego copiar el archivo wed_chart_windows. proporcione la ruta de acceso del programa CGI. Esto puede ser el caso si los derechos de acceso públicos en la carpeta del documento no incluyen el permiso de “ejecución”. el nombre de esa carpeta es cgi-bin. Refiérase a la siguiente tabla para determinar el nombre correcto a utilizar. Una vez que se cambia la especificación de la ruta.cgi. se debe especificar la ruta de acceso al programa CGI dentro de las propiedades del bloque gráfico. puede ser que se requiera almacenar el programa CGI en una carpeta dentro del sitio web.cgi wed_chart_freebsd. sencillamente anexe el nombre del archivo CGI a la ruta de la carpeta CGI a usar. Para construir la ruta. primero se debe conocer el nombre del programa CGI. Si el sistema operativo de su servidor Web es: Windows Linux Solaris Solaris x86 FreeBSD El nombre del programa CGI es: wed_chart_windows. haga lo siguiente: 1 Haga doble clic sobre el bloque gráfico para abrir el diálogo Propiedades del Bloque Gráfico y luego haga clic en la solapa Parámetros del Bloque Gráfico. 3 Haga clic sobre el botón Aceptar.

Creando un bloque de gráfico 239 .Cuando publique un documento que tiene un bloque gráfico. asegúrese también de publicar el programa CGI al directorio adecuado dentro de su sitio web.

7.11.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.1 Ejemplo de un bloque de entrada Mostramos a continuación un bloque de entrada para crear información de facturación a un cliente: 240 Capítulo 7 Creando Documentos basados en Bases de Datos .

2 y luego haga clic sobre el botón Siguiente.3 y luego haga clic sobre el botón Siguiente.2 Pasos para crear un bloque de entrada Para crear un bloque de entrada. 4 Seleccione un origen de los datos tal como se describe en la Sección 7.11. Si desea reemplazar uno o más de los campos de entrada con controles de entrada. Ya se han realizado algunas modificaciones a la disposición de la tabla. Sin embargo. 2 Seleccione el comando Insertar > Base de datos > Bloque de Entrada. 5 Seleccione los campos de la base de datos tal como se describe en la Sección 7. Esto inicia el Asistente de Base de Datos. puede hacerlo en este momento presionando sobre el botón Agregar y seleccionando Menú desplegable o Grupo de botones de opción de la lista. La lista “Estado” y el campo de entrada “CP”han sido movidos de renglones separados al mismo renglón donde se encuentra el campo de entrada “Ciudad”. 7.El mismo bloque tal como se ve en la ventana de Edición: En este ejemplo encontramos siete campos de entrada de cadena. 6 Confirme que la lista de elementos del bloque es la correcta. una lista desplegable y dos grupos de botones de opción. puede ser más fácil agregar los controles de Creando un bloque de entrada 241 . El grupo de botones de opción “Tipo de tarjeta de crédito” y el campo de entrada “Número de tarjeta de crédito” también fueron movidos de su posición original. haga lo siguiente: 1 Cree un nuevo documento o abra uno ya existente.4 y luego haga clic sobre el botón Siguiente. 3 Seleccione un formato de documento dinámico tal como se describe en la Sección 7.

(Vea la Sección 7. 8 Opcionalmente. proporcione una dirección URL o un camino de acceso relativo en URL resultante. Éste es el método usado para enviar la información proporcionada por el visitante en el bloque de entrada a su servidor Web.) Haga clic en el botón Siguiente. 7 Seleccione un método de entrada: Obtener (GET) o Mandar (POST). 242 Capítulo 7 Creando Documentos basados en Bases de Datos . el documento específico será abierto por el navegador. Una vez que se ha completado el Asistente de Base de Datos.entrada una vez que se ha terminado el asistente. 7. Cuando el visitante del sitio haga clic sobre el botón de envío para transmitir la información del bloque. se recibe el mensaje genérico “El proceso de entrada ha sido completado.” 9 Haga clic en el botón Finalizar. en una base de datos. seleccione Mandar (POST) a menos que tenga una razón específica para utilizar Obtener (GET).13 para más instrucciones. Si no se especifica una URL resultante.13: Agregando o eliminado elementos de bloque en la ventana de Edición. Mandar (POST) es el método recomendado cuando la información transmitida será almacenada por el servidor. Puesto que éste es nuestro caso. por ejemplo. puede reemplazar uno o más de los campos de entrada con menús desplegables o grupos de botones de opción.

a excepción de que en lugar de presentar una forma en blanco al visitante. el formulario ya se rellenó con información existente del registro.1 Ejemplo de un bloque de modificación A continuación mostramos un bloque de modificación para cambiar la información de facturación de un cliente: Creando un bloque de modificación 243 .12 Creando un bloque de modificación Un bloque de modificación es utilizado para permitir al visitante editar los registros existentes en una base datos. Es similar a un bloque de entrada.7. 7.12.

Si desea reemplazar uno o más de los campos de entrada con controles de entrada. 5 Seleccione los campos de la base de datos tal como se describe en la Sección 7.3 y luego haga clic sobre el botón Siguiente.12.2 y luego haga clic sobre el botón Siguiente. Éste es el método usado para enviar la información proporcionada por el visitante en el bloque de entrada a su servidor Web. proporcione una cláusula donde (where) para especificar qué registro se despliega en el bloque y luego haga clic sobre el botón Siguiente.13 para más instrucciones.) 7 Confirme que la lista de elementos del bloque es la correcta. puede hacerlo en este momento presionando sobre el botón Agregar y seleccionando Menú desplegable o Grupo de botones de opción de la lista. (Vea la Sección 7. 4 Seleccione un origen de los datos tal como se describe en la Sección 7. 2 Seleccione el comando Insertar > Base de datos > Bloque de modificación. Sin embargo.2 Pasos para crear un bloque de modificación Para crear un bloque de modificación. 3 Seleccione un formato de documento dinámico tal como se describe en la Sección 7. Mandar (POST) es el método recomendado cuando la información 244 Capítulo 7 Creando Documentos basados en Bases de Datos .El mismo bloque tal como se ve en la ventana de Edición: 7.) Haga clic en el botón Siguiente. (Vea abajo para más información. 8 Seleccione un método de entrada: Obtener (GET) o Mandar (POST).4 y luego haga clic sobre el botón Siguiente. Esto inicia el Asistente de Base de Datos. puede ser más fácil agregar los controles de entrada una vez que se ha terminado el asistente. haga lo siguiente: 1 Cree un nuevo documento o abra uno ya existente. 6 En el paso Sentencia de Selección.

se debe especificar una cláusula donde (where) que seleccione únicamente un registro. Si se proporciona una cláusula donde (where) que no seleccione un registro único. el bloque desplegará el primero de ellos y la información de todos los registros coincidentes será reemplazada con la información transmitida. Creando un bloque de modificación 245 .transmitida será almacenada por el servidor.3 en la sección de cómo crear un bloque de detalle. Si no se proporciona. por ejemplo.2 y 7. en una base de datos. Para más información de cómo seleccionar correctamente la cláusula donde (where). proporcione una dirección URL o un camino de acceso relativo en URL resultante. se recibe el mensaje genérico “El proceso de entrada ha sido completado. la información de todos los registros será reemplazada por la información transmitida. Puesto que éste es nuestro caso. Cuando el visitante haga clic sobre el botón de enviar. Los procedimientos para el bloque de modificación son los mismos. el bloque de modificación desplegará el primer registro de la base de datos. 9 Opcionalmente.” 10 Haga clic en el botón Finalizar. Si no se especifica una URL resultante.9. el documento específico será abierto por el navegador. Tal como en el bloque de detalle. vea las secciones 7. seleccione Mandar (POST) a menos que tenga una razón específica para utilizar Obtener (GET). Cuando el visitante del sitio haga clic sobre el botón de envío para transmitir la información del bloque.9.

opcionalmente. El diálogo Propiedades del Campo de salida aparecerá. 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. deberá agregarlo dentro de las propiedades de bloque. Un bloque gráfico sólo puede tener un elemento — el propio gráfico. se pueden agregar.13. 2 Haga clic en la solapa Campos de la Base de datos. (El punto de inserción debe estar dentro del bloque. reemplazar o eliminar estos elementos dentro de la ventana de Edición.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. El diálogo Propiedades del Bloque correspondiente al bloque activo aparecerá. Por ejemplo. una vez que se ha completado el Asistente de Base Datos. Para agregar un campo de salida. Los campos de salida (y. En las siguientes secciones proveemos las instrucciones para agregar cada uno de los tipos de elementos de bloque. lista y detalle. haga lo siguiente: 1 Haga clic con el botón derecho del ratón en cualquier parte dentro del bloque y seleccione Propiedades del Bloque. 246 Capítulo 7 Creando Documentos basados en Bases de Datos . haga lo siguiente: 1 Coloque el punto de inserción en el sitio dentro del bloque donde desea insertar el campo.13 Agregando elementos de bloque en la ventana de Edición Si. no se encuentra satisfecho con el conjunto de elementos de bloque dentro de su bloque. Para agregar un campo de una base de datos. 3 Haga clic en el botón 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 botón Aceptar. Si el campo de la base de datos que desea utilizar no aparece dentro de lista Campo de Base de Datos.7. Es posible agregar también campos de salida a un bloque de modificación donde se desea mostrar el valor de un campo particular de una base de datos sin dejar que el visitante lo pueda modificar. 7. se puede reemplazar un campo de entrada con un menú desplegable o un grupo de botones de opción. En los bloques de tabla. los campos de salida con vínculo) son los constituyentes básicos de los bloques de tabla. No es posible agregar o remover elementos de bloque dentro de un bloque gráfico.) 2 Seleccione el comando Insertar > Base de datos > Campo de salida.

6 Seleccione el comando Insertar > Base de datos > Campo de Salida (Vínculo). por lo tanto. El diálogo Propiedades del Encabezado del Documento aparecerá. Ahora. debe contener una declaración del argumento para que “sepa” qué hacer con él. por ejemplo a uno que contenga un bloque de detalle o modificación. Agregando elementos de bloque en la ventana de Edición 247 . haga clic sobre el botón Aceptar. 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. Un nuevo argumento con el nombre temporal “<Nuevo Arg>” se agregará. también actúa como un vínculo a otro documento. al igual que un campo de salida ordinario. Cuando se utiliza un campo de salida con vínculo para enlazar a un documento de detalle o modificación. 3 Teclee el nombre para el nuevo argumento y presione la tecla <Intro>. Sin embargo. Al hacer clic sobre el campo de salida con vínculo. Haga clic sobre el botón Aceptar.2 Agregando un campo de salida con vínculo Un campo de salida con vínculo. despliega el valor de un campo de una base de datos. El nombre puede ser cualquiera mientras no contenga espacios ni cualquier otro símbolo de puntuación que no sea el carácter de subrayado. 5 Coloque el punto de inserción en la posición del bloque donde desea agregar el campo de salida con vínculo. el vínculo envía al documento un argumento que contiene el identificador único del registro a desplegarse dentro del bloque. 7. El diálogo Campo de Salida (Vínculo) aparecerá. 2 Haga clic en la solapa Parámetros y luego haga clic sobre el botón Agregar. Los pasos necesarios para ajustar un campo de salida con vínculo son los siguientes: 1 En el documento al cual enlazará el campo de salida con vínculo.3 Seleccione el campo de la base de datos deseado dentro de la lista jerárquica del lado izquierdo del diálogo y haga clic sobre el botón Agregar. Al finalizar. 4 Guarde el documento y cambie al documento en el cual quiere agregar el campo de salida con vínculo. haga doble clic en cualquier parte dentro del bloque de detalle o modificación y seleccione Base de datos > Propiedades del Documento en el menú de atajo. El campo seleccionado aparecerá en la lista de los incluidos dentro del lado derecho. un visitante a nuestro sitio puede ver o modificar el registro correspondiente al elemento mostrado en ese campo de salida. El bloque de detalle o modificación. 7 Haga clic en el botón 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 vínculo.13.

3: Creando un vínculo a un bloque de detalle 7. Para agregar un campo de entrada. especifique el Ancho en caracteres y la Longitud máxima (también en caracteres). Solamente los campos de la base datos que correspondan al mismo tipo que el campo de entrada. a cada campo se le asigna un tipo de dato. (El punto de inserción debe estar dentro del bloque.) 2 Seleccione cualquiera de los comandos de campos de entrada dentro del submenú Insertar > Base de datos.”. teclee el nombre del argumento que agregó al otro documento.8 En el recuadro URL. 9 En el recuadro Nombre en Parámetros.) 6 Si está agregando un campo de entrada de números o cadenas. haga lo siguiente: 1 Coloque el punto de inserción en el sitio del bloque de entrada o modificación donde quiere que el campo se agregue. 10 Haga clic en el botón a un lado del recuadro Valor y seleccione el campo de la base de dato cuyo valor será enviado al otro documento. 3 Haga clic en la solapa Parámetros del Campo de Entrada. los nombres de los campos de la base de datos aparecen dentro de paréntesis angulares. aparecerán en este menú.13. tal como Insertar > Base de datos > Campo de Entrada de Números. 4 En la lista Campo destino. 7 Al agregar un campo de entrada de texto. 11 Haga clic sobre el botón Aceptar. por lo que se debe usar el correspondiente campo de entrada. en este ejemplo: Propiedades del Campo de Entrada.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. que corresponden a cuatro tipos de datos: número. seleccione el campo de la base datos que aceptará el valor introducido dentro del campo de entrada.Clientes. proporcione la dirección URL o el camino relativo de acceso al documento con el cual enlazará el campo de salida con vínculo. Hay cuatro tipos de campos de entrada. Los campos de entrada no pueden ser agregados a otros tipos de bloques. (Dentro de lista. El diálogo correspondiente se abrirá. haga clic sobre el botón que se encuentra a un lado del recuadro Valor predeterminado y seleccione el campo que proveerá el valor para campo de entrada. Los campos de entrada junto con los controles de entrada son los elementos principales de los bloques de entrada y modificación. especifique el Ancho en caracteres y la altura del campo en Número de líneas. 248 Capítulo 7 Creando Documentos basados en Bases de Datos . En una base datos. cadena. Por ejemplo.9. precedidos por una letra “f. texto y fecha. 7. <f.Nombre>. 5 Si está agregando un campo de entrada a un bloque de modificación.

El valor de campo oculto es visible para el navegador.13. precedidos por la letra “f. seleccione la pequeña marca amarilla que representaba al campo oculto dentro de la ventana de Edición y utilice el menú Color de Tipografía en la barra de Formato y aplique el color del fondo documento al campo oculto. “mm” para el mes. De manera predeterminada.13. especifique el Formato de fecha. donde 1 = verdadero. haga lo siguiente: 1 Coloque el punto de inserción en la posición dentro del bloque de entrada o modificación donde desea que el campo se inserte. Por ejemplo. Por ejemplo.) 2 Seleccione el comando Insertar > Base de datos > Campo Oculto.5 Agregando un menú desplegable o un grupo de botones de opción Los menús desplegables y grupos de botones de opción — 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 Edición 249 .) 5 Haga clic sobre el botón Aceptar. <f.Clientes. use campos de entrada de números. 7. un campo oculto no es invisible. Para hacer que el campo oculto sea efectivamente invisible. seleccione el campo de la base datos que aceptará el valor del campo oculto. 3 En la lista Campo destino. 7. se puede reemplazar un campo de entrada con un campo oculto para un identificador dentro de una base datos. El diálogo Propiedades del Campo Oculto aparecerá. Para agregar un campo oculto. “mi” para los minutos y “ss” para los segundos.”.8 Si está agregando un campo de entrada de fecha. de forma tal que el visitante del sitio no pueda modificarlo. 4 Haga clic en el botón a un lado del recuadro Valor predeterminado y seleccione el campo de la base datos que proveerá el valor del campo de entrada. “hh” para las horas. (El punto de inserción debe estar dentro del bloque.Nombre>. Para introducir valores en un campo de datos Booleano (“Verdadero/falso” o “Sí/no”). 0 = falso.4 Agregando un campo oculto Un campo oculto es utilizado en un bloque de modificación para insertar un valor dentro del registro de una base datos sin permitir que el visitante del sitio lo cambie. Use “aa” para representar el año. Se puede usar cualquier carácter como separador. “dd” para el día. 9 Haga clic sobre el botón Aceptar.(En la lista solamente aparecen los nombres de los campos de la base datos dentro de paréntesis angulares.

el visitante selecciona el elemento “Visa”. el valor que se introduce al usarlo puede ser distinto del elemento seleccionado por el visitante. en la lista jerárquica de la izquierda. tal como por ejemplo el número 3. Por ejemplo. probablemente desee obtener los elementos del control de entrada de un campo distinto de la base de datos. sino el campo que provee los valores asociados — aún cuando los elementos y sus valores sean idénticos. 5 Opcionalmente proporcione la cláusula donde (where) para especificar qué registros utilizar (deje en blanco para usar todos los registros) y / o la cláusula ordenado por 250 Capítulo 7 Creando Documentos basados en Bases de Datos . haga lo siguiente: 1 Coloque el punto de inserción en el sitio del bloque de entrada o modificación donde quiere que el campo se agregue. (El punto de inserción debe estar dentro del bloque. Si el campo de la base datos a la cual se agregaran los valores es del tipo numérico.) 2 Seleccione el comando Insertar > Base de datos > Menú desplegable o Insertar > Base de datos > Grupo de botones de opción. Los elementos de la lista son provistos por un campo dentro de la base datos (y los valores asociados potencialmente provistos por otro). los valores deben ser números.lista. Esto iniciará una variación del Asistente de Base de Datos para el control de entrada seleccionado. haga clic sobre el botón Siguiente. Una vez terminado. Seleccionar un elemento de un control de entrada da el mismo resultado que escribir el valor dentro de un campo de entrada. Por lo tanto. 3 Seleccione un origen de datos ODBC. seleccione el campo origen de la base de datos para los elementos del control de entrada. Si los elementos y sus valores asociados serán distintos. puede ser cualquier otra cosa. Aunque el valor que se envía a la base de datos puede ser el mismo que el elemento (la palabra “Visa”). sin embargo. no sólo debe especificar el campo de la base de datos que proveerá los elementos del control de entrada. proporcione la ID de usuario y contraseña si es necesario y luego haga clic sobre el botón Siguiente. cuando se agrega un menú desplegable o un grupo de botones de opción. Es su elección si los elementos son los mismos que los valores. en el grupo de botones de opción que se muestra a continuación. pero ofrece la ventaja de limitar aquello que se puede seleccionar de forma tal que el visitante no pueda cometer errores. que contenga palabras en lugar de números. Cuando se usa un menú desplegable o un grupo de botones de opción. Para agregar un menú desplegable o un grupo de botones de opción. la palabra “Visa” no es necesariamente el valor que se almacena en la base datos. 4 En el paso Campo de la Base de Datos. seleccione también el campo origen de los valores y luego haga clic sobre el botón Agregar.

6 En la lista Campo destino. Agregando elementos de bloque en la ventana de Edición 251 . (Éste es usualmente el mismo que el campo destino. 7 En la lista Campo origen para los elementos del menú o Campo origen para las etiquetas del botón de opción — 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. 9 Si está agregando el control de entrada a un bloque de modificación.) 10 Haga clic en el botón Finalizar.(order) para indicar cómo se ordenan los registros. haga clic en el botón 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. 8 En la lista Campo origen para los valores de los elementos o Campo origen para los valores del botón de opción seleccione el campo origen de la base de datos para los valores asociados con los elementos del control de entrada. haga clic sobre el botón Siguiente. seleccione el campo de la base de datos que recibirá el valor seleccionado dentro del control de entrada. Al terminar.

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. se debe crear un nuevo bloque utilizando el asistente.3 Cambiando la sentencia de selección Para cambiar la sentencia de selección de un bloque.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. (Esta solapa es idéntica a la del paso del Asistente de Base de Datos con el mismo nombre. se pueden modificar en cualquier momento al hacer clic con el botón derecho del ratón dentro de un bloque y seleccionar Base de datos > Propiedades del Documento o Base de datos > Propiedades del Bloque en el menú de atajo. Si se requiere cambiar la elección del origen de los datos.14. seleccione Base de datos > Propiedades del Bloque en el menú de atajo y 252 Capítulo 7 Creando Documentos basados en Bases de Datos . haga clic con el botón derecho del ratón en el bloque. Se puede modificar cualquiera de las elecciones realizadas dentro del Asistente de Base de Datos a excepción del origen de los datos. 7.) 7.1 Cambiando el tipo de documento Para cambiar cualquiera de estos ajustes: El formato del documento dinámico El método de conexión de la base de datos Los parámetros del sistema operativo del servidor Haga clic con el botón derecho del ratón y seleccione Base de datos > Propiedades del Documento en el menú de atajo.7.14. haga clic con el botón derecho del ratón en el bloque.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. (Esta solapa es idéntica a la del paso del Asistente de Base de Datos con el mismo nombre. Cambie cualquier parámetro en la solapa Tipo de Documento del diálogo Propiedades del Encabezado del Documento.) 7.14.

(Esta solapa es idéntica a la del paso del Asistente de Base de Datos con el mismo nombre.) Para cambiar los parámetros de la lista en un bloque de tabla o lista. haga clic con el botón derecho del ratón en el bloque.luego haga clic en la solapa Sentencia de Selección.4 Cambiando el método de entrada o los parámetros de la lista Para cambiar el método de entrada de un bloque de entrada o modificación. seleccione Base de datos > Propiedades del Bloque en el menú de atajo y luego haga clic en la solapa Parámetros de la lista.) 7. haga clic con el botón derecho del ratón en el bloque.) Modificando las propiedades basadas en una base de datos 253 .14. seleccione Base de datos > Propiedades del Bloque en el menú de atajo y luego haga clic en la solapa Método de entrada. (Esta solapa es idéntica a la del paso del Asistente de Base de Datos con el mismo nombre. (Esta solapa es idéntica a la del paso del Asistente de Base de Datos con el mismo nombre.

.

Parte Tres Proyectos y Administración de Sitios Web .

.

En él encontramos funciones tales como la verificación automática de vínculos y la búsqueda y reemplazo global. En este capítulo 8. se puede crear un árbol de navegación para el proyecto e incluir una barra de navegación dinámica en sus documentos.Capítulo 8 Trabajando con Proyectos Al mantener los documentos Web dentro de un proyecto tomamos ventaja de las poderosas características del Administrador de Sitio Web incluido con Namo WebEditor. Además de esto.3 Creando un proyecto Administrando los documentos de un proyecto Administrando la navegación del sitio Web 257 .1 8.2 8.

1 Creando un proyecto El proyecto es una colección de documentos web y sus archivos de recursos (imágenes.) que se mantienen en la misma carpeta del disco duro y se gestionan utilizando el Administrador de Sitio Web. tales como búsqueda y reemplazo global. 2 En el diálogo Crear Nuevo Proyecto. el mantener los documentos en un proyecto permite crear un árbol de navegación para el sitio web. Haga clic en el botón Sí. Al utilizar un proyecto se vuelve mucho más sencillo agregar o remover documentos. es una buena idea mantener los documentos y sus archivos de recursos dentro de un proyecto. o se puede crear un proyecto nuevo. 4 Aparecerá un nuevo diálogo donde se le pregunta si quiere habilitar el control de código para el proyecto.1: Introducción al Control de Código Un nuevo proyecto será creado en el directorio especificado y la ventana del Administrador de Sitio Web aparecerá. sino que permite crear barras de navegación dinámicas dentro del documento que cambian de forma automática al agregar. arreglar o cambiar de nombre a un documento. En la parte superior de la ventana encontrará un nuevo icono que representa el proyecto. Además. De otra forma. publicar los documentos a un sitio web y realizar operaciones sobre varios documentos a la vez. 9. puesto que de esa manera se pueden administrar más eficientemente. Si va a usar Microsoft SourceSafe en el proyecto. hojas de estilo.8. (Haga clic en el botón Examinar para seleccionar un directorio.1. verificar vínculos y cambiar el juego de caracteres usados. de un nombre al proyecto y especifique en qué carpeta se guardará. Si está construyendo un sitio Web completo. haga lo siguiente: 1 Use el comando Archivo > Proyecto > Nuevo Proyecto. 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. presione el botón No. haga clic sobre el botón Sí.) 3 Haga clic sobre el botón Aceptar.1: Usando el Asistente de Sitios Web 258 Capítulo 8 Trabajando con Proyectos . Un árbol de navegación no solamente ayuda a visualizar las relaciones entre los documentos de un proyecto. Para crear un nuevo proyecto vacío. etc. Si el directorio especificado no existe. 8. se le preguntará si se crea. remover. junto con su nombre y directorio. vacío.

haga lo siguiente: 1 Cambie al Administrador de Sitio Web. selecciónelos (Mayús-clic o Ctrl-clic para seleccionar documentos múltiples). Para agregar un documento ya existente que no se encuentre registrado dentro del proyecto. 3 Para crear un nuevo documento a nivel superior del proyecto. Para crear un nuevo documento en una carpeta dentro del proyecto. 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.htm.2 Agregando nuevos documentos a un proyecto Una vez que se ha creado un nuevo proyecto. Si proporciona un nuevo nombre.3 Agregando documentos existentes a un proyecto Cuando se crea un nuevo proyecto vacío.) 2 Haga clic en la solapa Proyecto. (Haga clic en el botón Administrador de Sitio Web. Esto hará que los archivos de la carpeta y sus subcarpetas se registren en el proyecto. Los archivos que no han sido registrados dentro del proyecto no pueden ser gestionados por el Administrador de Sitio Web.1. Proporcione de inmediato un nombre y presione la tecla <Intro> o solamente presione la tecla <Intro> para aceptar el nombre propuesto. Si desea registrar solamente algunos de los documentos existentes. cualquier documento que ya existe en la carpeta donde el proyecto se crea no se registra automáticamente en éste.8. aparecerá un diálogo con el mensaje: “El proyecto ha sido modificado. Para agregar un nuevo documento al proyecto. Creando un proyecto 259 . ¿Quiere cambiar los hipervínculos?” Puesto que probablemente aún no tiene vínculos en su nuevo documento. haga clic con el botón derecho del ratón sobre el nombre de la carpeta o su icono. haga clic sobre el botón No. haga clic con el botón derecho del ratón 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. se le pueden agregar documentos usando la solapa Proyecto del Administrador de Sitio Web. haga clic con el botón derecho del ratón 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.1. con el nombre predeterminado de newfile. Un nuevo documento en blanco se agregará al proyecto. o haga clic con el botón derecho del ratón en cualquiera de ellos y seleccione Agregar al Proyecto en el menú de atajo. si no es la ventana que se encuentra al frente. 8.

3. (La carpeta del subproyecto será creada dentro de la del proyecto. haga clic con el botón derecho del ratón sobre el icono del proyecto y seleccione Nuevo > Subproyecto. Para crear una nueva carpeta o subcarpetas dentro de un proyecto. se pueden mantener todos los archivos de imágenes dentro de una carpeta llamada “images”. la única razón para hacer esto es utilizar un árbol de navegación separado para un grupo de documentos dentro del proyecto. Utilice el icono Mi PC o el explorador de Windows para moverlos y luego agregarlos al proyecto como se describió en el párrafo anterior. Si proporciona un nuevo nombre. ¿Quiere cambiar los hipervínculos?” Puesto que la carpeta está vacía. 8. primero deben ser movidos a la carpeta del proyecto. Para quitar un documento del proyecto.4 Creando carpetas en un proyecto Si tiene un gran número de archivos en su proyecto. En el diálogo Crear Subproyecto. Para cambiar el nombre de su proyecto haga clic con el botón derecho del ratón sobre su icono o su nombre y seleccione Propiedades en el menú de atajo. todas las hojas externas de estilo dentro de una carpeta llamada “css” y tener un directorio distinto para cada sección de documentos en un proyecto grande. cambie a la solapa Proyecto del Administrador de Sitio Web. 8. Se agrega una carpeta llamada “newfolder” en la lista de carpetas bajo el proyecto o en el directorio seleccionado. aparecerá un diálogo con el mensaje: “El proyecto ha sido modificado. Generalmente. teclee el nuevo nombre y haga clic sobre el botón Aceptar. En el recuadro Nombre del diálogo Propiedades del archivo. o solamente presione la tecla <Intro> para aceptar el nombre propuesto. haga clic con el botón derecho del ratón sobre él y seleccione Remover del Proyecto. Las carpetas pueden dividirse a su vez en otras carpetas. 260 Capítulo 8 Trabajando con Proyectos . proporcione el nombre de la carpeta donde el subproyecto se almacenará y luego haga clic sobre el botón Aceptar.1. Proporcione de inmediato un nombre y presione la tecla <Intro>.1: Creando un árbol de navegación Para crear un subproyecto dentro del proyecto.5 Creando un subproyecto Es posible crear un subproyecto dentro del proyecto.1. Por ejemplo. haga clic sobre el botón No.Si tiene algunos documentos en carpetas distintas a la cual reside el proyecto.) Un nuevo subproyecto llamado “Nuevo Proyecto” aparecerá dentro del proyecto. haga clic con el botón derecho del ratón 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. es buena idea crear subdirectorios para almacenar grupos de documentos similares relacionados. 8.

mover todos los archivos de una a otra y borrar posteriormente la carpeta vieja. se puede crear una nueva carpeta en la posición deseada.1 Cambiando de nombre o renombrando archivos y carpetas Para cambiar el nombre de un archivo o carpeta en un proyecto. cualquier vínculo de los documentos que pertenezcan al proyecto y que apunten al archivo que se acaba de mover serán actualizados a la nueva ruta de acceso.8. cambie a la solapa Proyecto del Administrador de Sitio Web y arrastre el archivo a la nueva posición. cualquier vínculo en los documentos que pertenezcan al proyecto que apunten al archivo con el nuevo nombre (o cualquier archivo dentro del recién nombrado directorio) serán actualizados a la nueva ruta de acceso. darle el mismo nombre que la vieja. Para copiar el archivo en lugar de moverlo.2 Administrando los documentos de un proyecto 8. haga clic con el botón derecho del ratón sobre él y seleccione Borrar en el menú de atajo. Aparece un diálogo pidiendo la confirmación de la eliminación. mantenga presionada la tecla <Ctrl> mientras arrastra el archivo a su nueva carpeta destino.2. Administrando los documentos de un proyecto 261 . Un diálogo aparece con el mensaje “El proyecto ha sido modificado ¿Quiere cambiar los hipervínculos? Si presiona sobre el botón Sí.2. Para borrar un archivo o carpeta. No es posible mover una carpeta. 3 Teclee el nuevo nombre y presione la tecla <Intro>. Sin embargo. haga lo siguiente: 1 Cambie a la solapa Proyecto del Administrador de Sitio Web. 2 Haga clic con el botón derecho del ratón en el archivo o carpeta que quiere cambiar el nombre y seleccione Cambiar Nombre en el menú de atajo. Aparecerá un diálogo con el mensaje “El proyecto ha sido modificado ¿Quiere cambiar los hipervínculos? Si se presiona sobre el botón Sí. 8.2 Moviendo o copiando documentos dentro de un proyecto Para mover un archivo de una carpeta a otra. Haga clic en el botón Sí para proceder.

se debe realizar una verificación de vínculos de proyecto.) Para poder ver todos los vínculos dentro de un documento de un proyecto. Para cambiar a un documento distinto dentro de la ventana Vínculos. El icono a la mitad de la ventana representa el documento analizado (documento cuyos vínculos se muestran). Los iconos a la derecha representan los vínculos que se encuentran dentro del documento analizado. Si un vínculo dentro del documento analizado está roto. el icono referenciado tendrá una X roja. Los iconos a la izquierda representan los documentos del proyecto que tienen un vínculo hacia el documento analizado. El documento seleccionado será ahora el nuevo documento analizado. A qué documento se refiere el icono es determinado por el documento que se encuentra en ese momento activo dentro de la ventana de Edición. Estos pueden ser archivos dentro del proyecto o direcciones URL de Internet. La primera vez que se cambia a la ventana de Vínculos después de abrir un proyecto. (Si no hay documentos abiertos en la ventana de edición. la ventana Vínculos estará vacía.2. 262 Capítulo 8 Trabajando con Proyectos . Solamente los documentos HTML del proyecto — no los archivos de recursos o documentos dentro de la web — pueden ser analizados.8. Utilice el comando Verificar todos los Vínculos en el menú Herramientas del Administrador de Sitio Web para realizar una comprobación completa. haga doble clic en otro icono de documento. solamente aparece un icono.3 Desplegando los vínculos “de” y “hacia” un documento La solapa Vínculos del Administrador de Sitio Web despliega una vista gráfica de los vínculos que van “desde” y “hacia” cualquier documento del proyecto.

Otros tipos de vínculos.2.) Huérfano Indica que no hay vínculos a este documento existentes en otros documentos del proyecto. Esto no significa que el enlace esté roto o sea inválido. que inicialmente se encuentra encajada en la parte baja de la ventana principal de Namo WebEditor. no son verificados. este modificará todos los vínculos afectados de forma automática.) Vínculo externo Indica que el destino de un vínculo pertenece a un sitio web externo. El resultado de una verificación de vínculos aparece dentro de la ventana Resultados. Si no es su intención utilizar un documento huérfano. tales como FTP y mailto.4 Verificando los vínculos de un proyecto Antes de publicar un proyecto — y periódicamente mientras se trabaja en él — se deben verificar los vínculos dentro de los documentos del proyecto para asegurarse de que son válidos. por ejemplo al utilizar el explorador de Windows. utilice el comando Verificar todos los vínculos o Verificar vínculos de forma incremental en el menú Herramientas del Administrador de Sitio Web. sino que Namo WebEditor no ha verificado el vínculo puesto que no se tiene la opción Verificar vínculos externos al verificar vínculos activada dentro de la solapa Proyectos del diálogo Preferencias. Hay tres tipos de problemas que pueden ser descubiertos en una verificación de vínculos: Vínculo roto Indica que el destino de un vínculo no pudo ser encontrado. La diferencia entre los dos comandos es que el último verifica solamente aquellos vínculos que han sido añadidos o modificados desde la última vez que se realizó una revisión. Administrando los documentos de un proyecto 263 . Los documentos huérfanos no pueden ser visitados desde el exterior puesto que no hay forma de acceder a ellos. Se puede mover la ventana de Resultados a otra posición al arrastrar por sus manijas (la barra doble en su borde derecho). Un vínculo roto también puede ser el resultado de mover o cambiar el nombre a un documento fuera de Namo WebEditor.8. Esto puede ocurrir si se borra un documento pero no se remueve o cambia el vínculo en otros documentos. Para realizar esto. mientras que el primero analiza todos. (Si mueve o cambia el nombre de un documento utilizando el Administrador de Sitios Web de Namo WebEditor. (Nota: Namo WebEditor sólo puede verificar vínculos externos HTTP (Web). se puede borrar con seguridad.

seleccione Reemplazar con y teclee el texto de reemplazo dentro del recuadro o utilice la lista proporcionada para seleccionar de cadenas utilizadas anteriormente. el documento que contiene el texto será abierto en la ventana de Edición. dependiendo de la acción que desee realizar. Para realizar una búsqueda y reemplazo global. Dentro del documento. Buscar Todo. 5 Seleccione Buscar proyecto para realizar la búsqueda dentro del proyecto activo o seleccione Buscar carpeta para buscar dentro de un directorio determinado. Si presiona sobre el botón Buscar Todo o Reemplazar Todo. El diálogo Búsqueda Global aparecerá. Haga doble clic en un elemento huérfano en la ventana de Resultados para abrirlo en la ventana de Edición si es posible. la primera aparición del texto se realza. 8. 2 Seleccione Búsqueda y Reemplazo Global en el menú de Herramientas. teclee el texto a buscar o use la lista proporcionada para seleccionar cadenas utilizadas anteriormente. Si hace doble clic sobre un elemento de la lista de resultados. El documento que tiene el vínculo roto será abierto en la ventana de Edición. en lugar del texto visible dentro de la ventana de edición o en un navegador. 264 Capítulo 8 Trabajando con Proyectos . seleccione las deseadas. haga doble clic sobre él dentro de la ventana de Resultados. seleccione Buscar en Código HTML. el resultado de la búsqueda (o el reemplazo) se muestra en la lista en la parte inferior del diálogo. Si selecciona Buscar carpeta. haga lo siguiente: 1 Cambie al Administrador de Sitio Web.5 Realizando búsqueda y reemplazo global El comando de Búsqueda y Reemplazo Global permite buscar texto específico en todos los documentos del proyecto actual. Reemplazar o Reemplazar Todo. 4 Si desea reemplazar el texto encontrado con otro.2. opcionalmente reemplazando el texto encontrado con otro especificado. El resultado de una acción de reemplazo global no puede deshacerse. 6 En Opciones. Para buscar el código fuente HTML de los documentos. 7 Haga clic en el botón: Buscar Siguiente. 3 En el recuadro Buscar. proporcione la ruta de acceso o haga clic sobre el botón Examinar para localizar y seleccionar una carpeta. Utilice este comando con cuidado. El punto de inserción se colocará justo antes del vínculo para removerlo o arreglarlo.Para examinar un vínculo roto. o en los documentos dentro de una carpeta.

se tiene un documento que contiene texto en chino.) 4 En Destino. Así. aseguramos que el navegador despliegue el documento. 5 Haga clic en el botón Cambiar para aplicar el juego seleccionado de caracteres a los documentos especificados.2. es mucho más conveniente fijar la codificación para todos los documentos del proyecto a la vez. El diálogo Cambiar Codificación aparecerá. Al especificar un lenguaje de codificación ayudamos a que el documento se despliegue correctamente dentro del navegador del visitante al sitio. Administrando los documentos de un proyecto 265 . Para fijar o cambiar el lenguaje de codificación dentro de un proyecto.6 Cambiando el lenguaje de codificación en un proyecto Si su proyecto contiene algún documento con un idioma que usa caracteres no latinos. haga lo siguiente: 1 Cambie al Administrador de Sitio Web. Aunque es posible determinar el idioma de codificación de documentos individuales dentro del diálogo Propiedades del Documento. el documento puede representarse de forma ilegible en aquellos navegadores que utilicen la codificación occidental europea de manera predeterminada. Al especificar el lenguaje correcto de codificación. 3 Seleccione un juego de caracteres de la lista Cambiar codificación a. todo los documentos del proyecto se seleccionan de manera predeterminada. si esto es posible. 2 Seleccione Cambiar Codificación en el menú Herramientas. Para quitar la selección a un documento de la lista. haga clic sobre él mientras mantiene presionada la tecla <Ctrl>. pero si no se fija el lenguaje de codificación al juego de caracteres chinos.8. por ejemplo. Si se selecciona Documentos seleccionados en el proyecto. especifique el rango de los documentos a los cuales se aplicará la nueva codificación. (Seleccione definido por el usuario para dejarlo sin especificar. se debe seleccionar una codificación del lenguaje (juego de caracteres) apropiado al tipo de caracteres utilizados en él.

la barra dinámica de navegación se actualiza de forma automática para reflejar esos cambios. Si existen varias barras dinámicas de navegación en un proyecto. A continuación mostramos un ejemplo del árbol de navegación de un pequeño sitio web del tema “familia”: El propósito principal de crear un árbol de navegación es habilitar el uso de las barras dinámicas de navegación dentro de los documentos del proyecto. Por ejemplo. Los vínculos dentro de la barra dinámica de navegación siempre enlazan a un juego específico de documentos.3 Administrando la navegación del sitio Web Una de las grandes ventajas de utilizar un proyecto es que se puede crear un árbol de navegación para sus documentos.8. 266 Capítulo 8 Trabajando con Proyectos . son eliminados o se reemplazan con otros documentos. determinado por la relación que los documentos guardan dentro de la barra de navegación. Si alguno de los documentos hijos cambian de nombre. consideremos un ejemplo basado en el árbol de navegación de la imagen inferior. hijo o hermano de por lo menos otro. Un árbol de navegación es como un árbol de familia: el árbol define las relaciones entre los documentos del proyecto. Para mostrar este punto. Cada documento es un padre. justo debajo de la página índice. las actualizaciones automáticas ahorran mucho tiempo y esfuerzo comparado con realizar esta acción manualmente. la barra dinámica de navegación de un documento puede contener vínculos a todo los “hijos” de ese documento. Esta barra de navegación podría estar en cualquiera de los documentos del proyecto. La barra dinámica de navegación mostrada contiene vínculos a cada uno de los documentos de primer nivel de árbol.

1 Creando el árbol de navegación En la solapa Estructura del Administrador de Sitio Web es donde se edita el árbol de navegación del proyecto. Si ha creado el proyecto utilizando el Asistente de Sitios Web.3. puesto que “Asuntos de familia” es ahora un hijo de “Nuestra familia”. el proyecto ya contiene un árbol de navegación completo. La imagen inferior muestra cómo se ve en el árbol modificado: Puesto que “Asuntos de familia” ya no se encuentra en el primer nivel del árbol.La imagen inferior muestra una barra de navegación que se encuentra en el documento llamado “Nuestra familia” y que contiene vínculos a los documentos hijos: Ahora movamos al documento titulado “Asuntos de familia” fuera del primer nivel del árbol de navegación y hagámoslo un hijo de “Nuestra familia”. la primera barra de navegación se ve ahora así: Y. la segunda barra de navegación se ve ahora así: 8. tal como el que se muestra en la imagen inferior. Administrando la navegación del sitio Web 267 .

se añaden documentos y se define su relación arreglando los iconos dentro del árbol. haga clic sobre el botón Aceptar. 2 La lista contiene todos los documentos del proyecto. el proyecto contiene un árbol de navegación con sólo un nodo: el propio proyecto. Para agregar uno o más documentos del proyecto a un árbol vacío. Inicialmente todos están seleccionados. Para crear un árbol de navegación. Para agregarlos de inmediato. El diálogo Seleccionar archivo aparecerá. Para agregar uno o más de los documentos existentes como hijos de un documento que ya se encuentra en el árbol. Es buena idea comenzar con sólo la página índice del proyecto.Si creó el proyecto utilizando el comando Nuevo Proyecto. haga lo siguiente: 1 Haga clic con el botón derecho del ratón en el icono del proyecto y seleccione Agregar al árbol de Navegación > Insertar Documento Existente en el menú de atajo. pero haga clic con el botón derecho del 268 Capítulo 8 Trabajando con Proyectos . De otra forma. seleccione los documentos a agregar y haga clic sobre el botón Aceptar. puesto que debe estar sola en la parte superior de árbol (además del propio proyecto). siga las instrucciones anteriores.

Haga clic y arrastre el icono del documento debajo de otro para hacer que el primer documento sea hijo del segundo. tenga en cuenta cómo quiere que la barra dinámica de navegación trabaje en sus documentos. probablemente querrá que la barra de navegación dentro de ese documento tenga un vínculo a cada una de las páginas de detalle del producto. Por ejemplo. “Soporte” y “Preguntas frecuentes”.ratón sobre el icono del que será el documento padre en lugar de en el icono del proyecto. En la imagen siguiente. Mientras está construyendo el árbol de navegación. se está transformando en un hermano de éste. de forma tal que se deben agregar las páginas de detalle como hijas de la página índice de los productos. todos los documentos seleccionados se convierten en hermanos de los otros. no importando su relación previa. Si mueve un documento que es padre de otros. Cuando el icono que se está arrastrando se encuentra en el lugar adecuado. Haga clic sobre el icono de un documento y arrástrelo a un lado de otro documento para hacer que el primer documento sea un hermano del segundo. todos los hijos del primero se moverán junto con él. Cuando se seleccionan y mueven documentos múltiples a una nueva posición. Administrando la navegación del sitio Web 269 . se convierten ahora en hijos de “Descarga”. Se pueden mover más de un documento a la vez seleccionándolos primero antes de arrastrar. Para seleccionar documentos múltiples. el documento “Revisión”. Sólo los documentos que no se encuentran en el árbol aparecerán dentro del diálogo Seleccionar archivo. un pequeño triángulo aparecerá a un lado o debajo del segundo icono. si tiene una página índice para sus productos. en la imagen inferior. Para cambiar las relaciones entre los documentos. que tenía una relación previa padre-hijo. que es un documento hijo de “Noticias”. arrastre los iconos de los documentos a sus nuevas posiciones dentro del árbol. dibuje una caja alrededor de ellos o haga clic en cada uno de ellos mientras mantiene presionada la tecla <Ctrl>. Por ejemplo.

se debe aplicar un tema.3. Para eliminar documentos múltiples.3 Agregando barras de navegación Aún el árbol de navegación que ha sido planificado más cuidadosamente no sirve de nada si los documentos del proyecto no tienen una barra de navegación dinámica para tomar ventaja de ello. 270 Capítulo 8 Trabajando con Proyectos . 2 Seleccione el comando Formato > Cambiar Tema. Si posteriormente cambia de opinión y decide volver a incorporarlo. El diálogo Galería de Temas aparecerá. haga clic con el botón derecho del ratón sobre él y seleccione Remover del Árbol de Navegación en el menú de atajo o selecciónelo y presione la tecla <Supr>.La imagen siguiente muestra las nuevas relaciones: 8.2 Quitando documentos de un árbol de navegación Para quitar un documento del árbol de navegación. 8. Cualquier hijo de los documentos eliminados también se borrará. haga lo siguiente: 1 Abra el documento al cual desea aplicar el tema. si no es que ya se aplicó. Por lo tanto. Las barras de navegación dinámicas forman parte de los Componentes de Tema. selecciónelos todos antes de presionar la tecla <Supr>. Al quitar un documento del árbol de navegación no lo eliminamos. antes de agregar una barra de navegación a un documento. haga clic con el botón derecho del ratón sobre el documento que será el padre y seleccione Agregar al árbol de Navegación > Insertar Documento Existente en el menú de atajo.3. Para aplicar un tema.

Aparecerá un diálogo en el que se le solicita seleccionar el rango de los documentos a los cuales se aplica el tema. estamos listos para agregar una barra de navegación. Para hacerlo siga los siguientes pasos: 1 Coloque el punto de inserción donde quiere agregar la barra de navegación. 2 Seleccione el comando Insertar > Componentes del Tema > Barra de navegación. no será necesario aplicar un tema a los otros documentos antes de agregar la barra de navegación para usarlos. Para obtener una vista previa mayor de un tema. Una vez que se selecciona un rango. Ya que se ha aplicado un tema a un documento. 4 Para elegir el tema seleccionado. haga doble clic sobre él. Las miniaturas de los temas dentro de la categoría se desplegarán. haga clic sobre el botón Aplicar. haga clic sobre el botón Aceptar. Si selecciona Todos los archivos del proyecto. 5 Seleccione un rango. Administrando la navegación del sitio Web 271 .3 Seleccione una categoría del tema en la lista que se encuentra del lado izquierdo. El diálogo Propiedades de la Barra de navegación aparecerá.

El diálogo Propiedades de la Barra de navegación aparecerá.3. Previo/Inicio/Siguiente. Página Padre o Inicio. Para agregar otra barra de navegación repita los pasos anteriores. Los vínculos son pequeñas imágenes con etiquetas con palabras como “Negro”. En la vista previa del Árbol de navegación. haga doble clic sobre ella. Para cambiar cualquiera de los parámetros seleccionados en la creación de una barra de navegación.5: Modificando la apariencia de los botones de una barra de navegación 272 Capítulo 8 Trabajando con Proyectos . 5 En Orientación. especifique si se usan vínculos de texto. los documentos en el conjunto destino seleccionado se encuentran realzados en azul. 1. 6 En Apariencia. Previo/Arriba/Siguiente. 7 Haga clic sobre el botón Aceptar.3 Seleccione conjunto destino de la barra de navegación (el conjunto de documentos a los cuales la barra de navegación se vincula) en la lista Tipo de Barra de Navegación. mientras que el documento activo se encuentra realzado en rojo. Un documento sólo puede tener un número limitado de barras dinámicas de navegación. “Arriba” o “Inicio” y sólo están disponibles si el conjunto seleccionado es Previo/Siguiente. “Siguiente”. botones o iconos. elija la disposición de la barra de navegación. 4 Seleccione Incluir página de inicio si desea incluir la página del índice principal del proyecto dentro del conjunto destino.

2 Introducción al control de código Usando el control de código 273 .Capítulo 9 Colaborando en un Proyecto Si trabaja en un proyecto web como parte de un equipo. En este capítulo 9. querrá tomar ventaja de las características del control de código que proporciona Namo WebEditor para evitar los conflictos entre versiones.1 9. En este capítulo le mostraremos cómo hacer esto.

Cuando se termina de editar el documento.1 Introducción al control de código Si varias personas trabajan sobre el mismo proyecto de un sitio web a la vez. Si un usuario abre una copia local del documento sin "darle salida" no podrá realizar cambios en él Namo WebEditor usa el control de código Microsoft SourceSafe ya instalado en su equipo o en la red. Si desea tomar ventaja de las características de control de código de Namo WebEditor. El Control de Código es una forma efectiva de evitar los problemas que surgen cuando un equipo colabora en el mismo conjunto de documentos. actualizando la copia que se encuentra almacenada ahí. especialmente si más de una persona trabaja sobre el documento. lo que dará como resultado un conflicto cuando el documento sea almacenado. Los usuarios deben "dar salida" a un documento antes de poder editarlo. 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. La idea básica del control de códigos 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. se debe "registrar" una vez más en la base de datos de control de código. pero este método también crea otro problema: puede no ser posible mantener una pista de qué copia del documento es la última versión.9. 274 Capítulo 9 Colaborando en un Proyecto . puede suceder de vez en cuando que dos o más traten de editar el mismo documento al mismo tiempo. debe de instalar primero SourceSafe. lo que realiza una copia del documento en el disco duro local y evita que otros usuarios puedan editar el mismo documento.

3 En el menú Control de Código. Se puede agregar un proyecto de WebEditor a la base de datos de SourceSafe. El diálogo Entrada al Control de Código aparecerá. Haber creado una base datos SourceSafe en el servidor para almacenar su proyecto web. Namo WebEditor interactúa con Microsoft 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. seleccione Conectar al Control de Código. 4 Proporcione su nombre y contraseña SourceSafe. El diálogo Crear Proyecto aparecerá. Instalar un cliente del programa SourceSafe (SourceSafe Explorer) en cada uno de los ordenadores de los usuarios.2 Usando el control de código Para llevar a cabo la característica de control de códigos. dar entrada o salida a documentos y obtener la última versión de un documento. El menú de Control de Código del Administrador de Sitios WEB de Namo WebEditor contiene comandos para trabajar de forma directa con la base de datos de SourceSafe. Usando el control de código 275 .1 Creando un nuevo proyecto SourceSafe Para agregar un Namo WebEditor proyecto a la base de datos de SourceSafe.9. agregar o remover documentos desde el control de códigos. 9. 6 Haga clic sobre el botón Aceptar para entrar a la base de datos de SourceSafe. se requiere tener lo siguiente: Tener el servidor de SourceSafe instalado en un servidor en la red local. haga lo siguiente: 1 Cree un nuevo proyecto de Web. o abra uno ya existente. un programa muy popular de control del código. Para usar las características de control del código de Namo WebEditor. 5 Haga clic en el botón Examinar a un lado del recuadro Base de datos y luego localice y seleccione una base de datos SourceSafe en un servidor de red. También se le deben dar a cada usuario los permisos de acceso a la base de datos de SourceSafe. 7 Haga clic en el botón Nuevo Proyecto. El diálogo Seleccionar el Proyecto del Control de Código aparecerá. 2 Cambie al Administrador de Sitio Web. todo ello desde un menú único.2.

Esto abrirá el diálogo Agregar archivos al Control de Código. El diálogo Agregar archivos al Control de Código aparecerá. haga lo siguiente: 1 Seleccione el comando Control de Código > Agregar al Control de Código en el menú de atajo. Seleccione los que quiere que sean agregados a la base datos de SourceSafe.2. 3 Haga clic sobre el botón Aceptar para agregar el archivo (s) seleccionado a la base de datos del control de código. (Inicialmente todos los archivos encuentran seleccionados.) Opcionalmente. haga lo siguiente: 1 Cambie al Administrador de Sitio Web. No requiere ser el mismo que el utilizado en el proyecto de Namo WebEditor. Si quiere borrar la copia maestra del documento y tiene los derechos de acceso para hacerlo. Para quitar la selección a un archivo. haga clic sobre el mientras mantiene presionada la tecla <Ctrl>.8 En el recuadro Nombre del proyecto. el diálogo Agregar archivos al Control de Código usualmente se activa y le pregunta si quiere agregar los archivos a la base de datos del control de código. seleccione el archivo(s) que quiere eliminar del control de código. Inicialmente todos los archivos se encuentran seleccionados. 10 El panel Lista de archivos muestra todos aquellos del proyecto web activo. 2 En panel de la lista de archivos de la solapa Proyecto.2 Agregando o eliminado archivos del control de código Cuando se agregan nuevos archivos al proyecto bajo el control de código. 276 Capítulo 9 Colaborando en un Proyecto . seleccione el que desea agregar a la base de datos del control de código. proporcione un nombre para el nuevo proyecto SourceSafe. la solapa Proyecto del Administrador de Sitio Web se selecciona de forma automática. 3 Seleccione el comando Control de Código > Eliminar del Control de Código. Si borra la copia local de un documento. teclee un comentario dentro del recuadro Comentario y luego haga clic sobre el botón Aceptar. El diálogo Eliminar del Control de Código aparecerá. Si no aparece y desea agregar los nuevos archivos a la base de datos del control de código. la copia maestra del mismo aún se encuentra dentro de la base de datos del control de código. opcionalmente. Una vez que el diálogo de progreso desaparezca. 2 En la lista de archivos. Aparecerá un diálogo que muestra el progreso de la adición del proyecto a la base de datos del control de código. proporcione una breve descripción del nuevo proyecto y haga clic sobre el botón Aceptar. 9 En el recuadro Comentario. La columna Estado del Control de Código en el panel de la lista de archivos mostrará el estado del registro de todos los archivos del proyecto. 9.

Cuando se le da salida a un archivo. Para quitar la selección de un archivo.3 Dando salida a archivos del control de código Para realizar cambios a un documento bajo el control de código primero se le debe dar salida de su base de datos. Se puede ejecutar desde Namo WebEditor usando el comando Herramientas > Administrador de Sitio > Ejecutar SourceSafe. selecciónelos primero. haga clic sobre el botón No. a menos que el administrador de SourceSafe permita salidas múltiples. 4 En la lista de archivos aparecerán aquellos a los cuales ya se les ha dado salida. haga clic sobre él mientras mantiene presionada la tecla <Ctrl>. archivos múltiples o todos los archivos de un proyecto SourceSafe. El diálogo Dar salida a archivos aparecerá. Cómo 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. otros pueden ver el archivo pero no modificarlo. una copia es creada en su disco duro (reemplazando cualquier copia anterior). Cuando se le da salida a un archivo. Para seleccionar archivos múltiples. 9. haga lo siguiente: 1 Cambie al Administrador de Sitio Web. Si desea dar salida al proyecto completo o a una carpeta dentro del proyecto. Se puede dar salida a un archivo. haga lo siguiente: 1 Ejecute el explorador de SourceSafe. 3 Seleccione el comando Control de Código > Salida. Usando el control de código 277 . En la solapa Proyecto del Administrador de Sitio Web. Un archivo al cual se le ha dado salida no puede asignársele a ninguna otra persona. 2 Entre en SourceSafe y abra su base de datos. Haga clic sobre el botón Sí para borrar los archivos de la base de datos del control de código De otra forma.4 Seleccione los archivos a ser eliminados del control de código y luego haga clic sobre el botón Aceptar. Aparecerá momentáneamente un diálogo de progreso mientras Namo WebEditor da salida a los archivos. un diálogo aparece pidiendo confirmación de su eliminación. Si requiere acceder a un proyecto que otro usuario creó y agregó a la base datos de SourceSafe. seleccione el archivo(s) al cual quiere dar salida. 5 Haga clic sobre el botón Aceptar para dar salida a los archivos.2. mantenga presionada la tecla <Mayús> o <Ctrl> al hacer clic. aparecerán marcas de verificación de rojas dentro del icono SourceSafe en la columna Estado del Control de Código para cada uno de los documentos a los cuales se les dio salida. 5 Si los archivos se encuentran en salida. 2 En la lista de archivos de la solapa Proyecto.

En el diálogo Abrir. Para deshacer una salida. Para editar un documento. cancelando los cambios tanto en la copia maestra del control de código como en su copia local. 6 Cambie a Namo WebEditor y abra el proyecto. 8 En el diálogo Seleccionar Control de Código Proyecto. El archivo o proyecto regresa al control de código en el mismo estado en que estaba cuando salió. Para abrir el proyecto. El proyecto se abrirá dentro de la ventana del Administrador de Sitio Web. creando una si es necesario y luego haga clic sobre el botón Aceptar. Haga clic sobre el botón Aceptar y los archivos se copiarán a su ordenador. 3 Confirme la lista de los archivos a los cuales no se les dará salida y luego haga clic sobre el botón Aceptar. El diálogo Deshacer Salida aparecerá. navegue al directorio donde la copia local del proyecto está almacenada y haga doble clic sobre el archivo del proyecto (el que tiene la extensión . seleccione una carpeta en su disco duro en la cual se almacenará la copia local del proyecto. En el diálogo Obtener.4 Deshaciendo una salida El comando Deshacer Salida cambia el estado del último archivo al que se le dio salida. 7 En el Administrador de Sitio Web. asegúrese de escoger la opción Recursivo si el proyecto tiene subcarpetas. asegúrese de darle salida usando el comando Control de Código > Salida. Ahora está listo para comenzar a trabajar con el proyecto. seleccione el archivo(s) al que se le dio salida. 9. 5 Haga clic con el botón derecho del ratón una vez más en el proyecto SourceSafe y seleccione Obtener última versión en el menú de atajo para descargar los archivos del proyecto a su disco duro.3 Haga clic con el botón derecho del ratón en el proyecto SourceSafe (carpeta) que contiene el proyecto de Namo WebEditor y use Seleccionar Carpeta de Trabajo en el menú de atajo. haga lo siguiente: 1 En la solapa Proyecto del Administrador de Sitio Web.wej). Haga clic sobre el botón Aceptar para continuar.2. 278 Capítulo 9 Colaborando en un Proyecto . use el comando Archivo > Proyecto > Abrir. seleccione el proyecto SourceSafe (carpeta) que contiene al de Namo WebEditor. 4 En el diálogo Seleccionar Carpeta de Trabajo. seleccione el comando Control de Código > Conectar al Control de Código. 2 Seleccione el comando Control de Código > Deshacer Salida.

2. 3 Confirme la lista de los archivos a registrar. seleccione los archivos a registrar. 2 Seleccione el comando Control de Código > Registrar archivos. guardando así los cambios en la base de datos del control de código. seleccione los documentos a actualizar en la solapa Proyecto del Administrador de Sitio Web y use el comando Control de Código > Descargar la última versión. proporcione un Comentario en el recuadro describiendo los cambios realizados a los archivos y luego haga clic sobre el botón Aceptar.6 Actualizando copias locales de archivos bajo el control de código Si desea actualizar las copias locales de sus documentos bajo el control de código con las últimas modificaciones. Para registrar un archivo. 9. Opcionalmente.9. se requiere registrarlos de nuevo.5 Dando entrada a archivos al control de código Una vez que se termina de editar los archivos a los que se dio salida en el control de código.2. haga lo siguiente: 1 En la solapa Proyecto del Administrador de Sitio Web. El diálogo Registrar Archivos aparecerá. Usando el control de código 279 .

.

Otros Temas Preferencias Auto Correción Inserción rápida (Quick Insert) Macros Edición de ecuaciones Importando documentos y sitios Web Importando documentos de Microsoft Word Enviando un documento como correo electrónico (e-mail) Agregando imagenes a la librería de imágenes Lista de atajos de teclado 281 .

.

Tipografía Proporcional Seleccione la tipografía proporcional predeterminada y su tamaño Tipografía ancho fijo Seleccione la tipografía de ancho fijo a utilizar (mono espacio) y su tamaño. Los vínculos activos se despliegan con un recuadro punteado en la mayoría de los navegadores utilizados en Windows. Definido por el Usuario significa que el documento utilizará cualquier codificación definida en el navegador como predeterminada. Los ajustes disponibles en las distintas solapas se explican a continuación. El Predeterminado es azul. 283 . Los ajustes predeterminados de tipografía solamente son utilizados por Namo WebEditor dentro de la ventana de edición. El Predeterminado es violeta. de la lista. la que es utilizada cuando un documento HTML no especifica qué tipografía utilizar. Un vínculo activo es un vínculo que ha sido seleccionado dentro de un navegador utilizando la tecla de tabulación para llegar hasta él. Seleccione el color predeterminado para los vínculos visitados de la lista. Seleccione el color predeterminado para los vínculos activos de la lista.Preferencias Las preferencias y ajustes del programa Namo WebEditor pueden ser cambiadas dentro del diálogo Preferencias. Seleccione el color del fondo del documento predeterminado de la lista. Cada navegador tiene su propia tipografía definida. El Predeterminado es gris claro. El Predeterminado es negro. El código de Internet para la codificación seleccionada aparece en la caja de texto a la derecha de la lista. Solapa Opciones Predeterminadas del Documento Colores Texto Fondo Vínculo Vínculo Visitado Vínculo Activo Seleccione el color del texto predeterminado de la lista. de la lista. Codificación y tipografía Codificación Seleccione la codificación de idioma predeterminada de la lista. al cual se accede usando el comando Herramientas > Preferencias. Seleccione el color predeterminado para los vínculos de la lista. El Predeterminado es rojo.

Información
Autor

Proporcione el nombre predeterminado del autor. Este nombre aparecerá a un lado de Autor tanto en el diálogo Información del Documento como en la solapa General del diálogo Propiedades del Documento para un nuevo documento.

Solapa Preferencias de Edición
General
Bloquea tecla Inserción Deshabilita el cambio al modo de sobre escritura al utilizar la tecla

<Insert>.
Carga documento más reciente al iniciar

Seleccione esta opción para que Namo WebEditor abra de forma automática todos aquellos documentos que se encontraban abiertos la última vez que se salió del programa.
Desplegar tipografía usada en lista de tipografía

Despliega el nombre de los tipos en el menú de tipografía de la barra de herramientas de formato en la forma en que se ven.
Creación Automática de vínculos

Habilita la creación automática de vínculos cuando se escribe una dirección URL dentro de la ventana de Edición. Por ejemplo, si esta opción se encuentra habilitada y se escribe "www.misitio.com" seguido de un espacio o de la tecla <Intro> en la ventana de Edición, Namo WebEditor crea de forma automática un hipervínculo a 'http://www.misitio.com' en la dirección URL.
Directorio de la librería de imágenes

Especifica la ruta de acceso a la librería de imágenes dentro del disco duro. Si se instaló Namo WebEditor de forma normal, no será necesario modificarla. Sin embargo, si se instala una librería de imágenes después de haber instalado Namo WebEditor, puede ser necesario especificar el directorio correcto en este punto. Use el botón para localizar y seleccionar el directorio.
Ortografía
Verificar ortografía al escribir

Verifica la ortografía en el momento de escribir dentro de la ventana de Edición. Las palabras erróneas serán marcadas con una línea roja ondulada que las subraya.

284

Ocultar errores de ortografía

No marca las palabras erróneas con el subrayado rojo. Esta opción solamente está disponible si Verificar ortografía al escribir está habilitado.
Diccionario ortográfico 1, Diccionario ortográfico 2

Especifica los diccionarios ortográficos activos primarios y secundarios. Ambos diccionarios pueden ser utilizados al mismo tiempo, de forma tal que se puede verificar la ortografía de dos idiomas al mismo tiempo. Los lenguajes disponibles son inglés (US), inglés (UK), francés, alemán, danés, holandés, finlandés, italiano, noruego, portugués, portugués (Brasil), español y sueco.
Guardar
Crear copia de seguridad Guarda la última versión del documento de forma automática

cuando se guarda éste. El archivo de copia de seguridad tiene el mismo nombre, pero con la extensión.bak. Para abrir el archivo de copia de seguridad, cambie su extensión a .htm o .html y ábralo como cualquier otro documento.
Auto guardar

Seleccione esta opción para hacer que Namo WebEditor guarde el documento actual de forma periódica. Especifique el intervalo de tiempo en minutos. No dar formato o modificar de ninguna otra forma el código fuente existente al abrir, editar o guardar un archivo HTML que no fue originalmente creado con Namo WebEditor. También se aplica a HTML escrito manualmente en la ventana de HTML. Si esta opción no está seleccionada, al código existente o introducido de forma manual, se le dará formato y será "limpiado" usando las mismas reglas que se aplican al código HTML que Namo WebEditor genera.

Conservar el código fuente HTML existente

Opciones de formato HTML (botón)

Haga clic en este botón para fijar varias opciones de formato para el código HTML generado por Namo WebEditor en el diálogo Opciones de Formato HTML.
Guardar imágenes de ecuaciones y gráficos en

Especifique la ruta de acceso o carpeta en la cual se guardarán las imágenes generadas de forma automática para las ecuaciones y los gráficos. De manera predeterminada, la ruta de acceso apunta al directorio 'images' en la misma carpeta que el documento. Para guardar las imágenes de ecuaciones y gráficos 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 extensión .exe (por ejemplo, Opera). El nombre DDE se proporciona de manera automática 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 botón Examinar para localizar y seleccionar el ejecutable.

Ruta del Programa

Si selecciona Otro como navegador, el nombre DDE es también 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 Edición de Código Fuente
General
Tipografía Fuente Tamaño del tipo Color tipografía Color fondo

Seleccione la tipografía a utilizar en la ventana HTML. Seleccione el tamaño de la tipografía para la ventana HTML. Selecciona el color para la tipografía 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 código fuente
Permitir la coloración del código

Los tipos especiales de texto en la ventana HTML serán 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 Símbolos

Seleccione el color para los valores de atributos (los textos entre comillas que siguen a [attribute]=). Seleccione el color para los códigos que representan a caracteres especiales, tales como &amp; (ampersand), &nbsp; (espacio de no separación), etc. Seleccione el color para los comentarios.

Comentarios

Otras opciones
Mostrar números de línea

Muestra los números de línea en el lado izquierdo de la ventana HTML. Los números de línea son especialmente útiles cuando se intentan descubrir errores dentro de un programa (secuencias de comandos).
Color para los números de las Líneas

Seleccione el color para los números de las líneas.
Color del margen Sangría Automática

Seleccione el color para utilizar en el área del margen que contiene los números de líneas. Coloca una sangría automática a una nueva línea para que comience en la posición inicial de la anterior. Realiza las sangrías utilizando tabulaciones. De otra forma, usa espacios.

Usar tabulaciones para sangría

Ancho tabulación

Especifique la longitud de la tabulación 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 botón 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 automáticamente el documento que se está editando en ese momento dentro de Namo WebEditor.

287

Solapa Guías / rejillas
Rejillas
Color Estilo

Seleccione el color para la rejilla de la lista. Elija entre la opción de línea sólida o punteada. Proporcione el espaciamiento entre las rejillas, en píxeles.

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 opción Ajustar a Rejilla.

Para obtener mejores resultados en el ajuste a la rejilla haga que el espaciamiento sea un múltiplo 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 ajustarán efectivamente a la rejilla.
Guías
Color Estilo

Seleccione el color de las guías de la lista. Elija entre la opción de línea sólida o punteada.

Solapa Proyectos
Opciones de confirmación
Verifica nombre inválido de archivo

Verifica los nombres de archivos inválidos al cambiar el nombre en el Administrador de Sitios web.
Confirma el borrado de archivos

Despliega un diálogo de confirmación al borrar archivos del proyecto.
Corrección de Auto vínculos
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 más reciente al iniciar

Al iniciar Namo WebEditor, abre el proyecto que estaba abierto la última vez al salir del programa (si es que había uno).
Verificar vínculos externos al revisar vínculos

Cuando se verifican los enlaces en un proyecto, también verifica la validez de los enlaces a los documentos Web en otros sitios. Namo WebEditor sólo puede verificar vínculos 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 pestañas en la parte inferior de la ventana del Administrador de Sitios WEB sólo como iconos. De manera predeterminada, la solapa se muestra como iconos con etiquetas de texto. Solapa Internet
Conexión Internet (HTTP)
Usar FTP al guardar directamente al servidor

Esta opción especifica qué protocolo de comunicaciones de Internet será utilizado para guardar un documento directamente al servidor web (haga esto utilizando el botón Guardar a URL dentro del diálogo Guardar como o guardando un documento que se abrió directamente de una dirección 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 automática). 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

importar documentos de la web y guardar documentos directamente al servidor no están disponibles. que residen en el servidor remoto en lugar de su propio ordenador). desde donde se pueden configurar varias opciones de conexión. tales como imágenes. Sólo se requiere utilizar los DLL de Windows si se experimentan problemas con un servidor en particular al utilizar NamoNet. Namo WebEditor no puede conectar a Internet. ciertas funciones. cuando se abre un documento que contiene recursos remotos (recursos. si usa una conexión vía telefónica. desde donde puede configurar varias opciones de conexión. Seleccionar DLL Usar NamoNet. se debe dejar Usar NamoNet.Modo fuera de línea Normalmente.DLL de Windows para las conexiones de Internet. Usar DLL de Internet Explorer (WinInet. Namo WebEditor no intentará descargar estos recursos remotos. el ordenador puede intentar conectar a Internet. Por lo tanto. tales como la publicación. Haga clic sobre el botón Parámetros para abrir el diálogo Propiedades de Internet.DLL. Seleccione esta opción para hacer que Namo WebEditor use WinInet.DLL) Normalmente. Dentro del modo fuera de línea. Haga clic sobre el botón Parámetros para abrir el diálogo Parámetros de NamoNet. Namo WebEditor intenta cargar los recursos del servidor para que puedan ser desplegados en la ventana de cesión. Esto puede ser causa de problemas si la conexión a Internet es intermitente. Si se seleccionó Modo Fuera de Línea. 290 .DLL.DLL Seleccione esta opción para hacer que Namo WebEditor use sus propios DLL (Dynamic Link Library) interconstruidos para toda conexión a Internet.DLL habilitado.

Puesto que los servidores Unix disciernen entre mayúsculas y minúsculas. Este ajuste no se aplica cuando se publica un proyecto. pero algunos de los archivos objeto utilizan mayúsculas o una combinación entre minúsculas y mayúsculas. puesto que se puede utilizar el comando Herramientas > Administración de Sitio Web > Verificar todos los vínculos para verificar los enlaces al publicar. 291 . esta opción puede ser útil cuando todos los vínculos de sus documentos utilizan el nombre de archivos en minúsculas. excepto cuando se publica un proyecto. Extensiones (botón) Haga clic en este botón para editar la lista de las extensiones de los archivos que serán tratadas como archivos de texto cuando se publique.Publicar Convertir nombres de archivos a minúsculas al publicar Seleccione esta opción para permitir que Namo WebEditor publique siempre los archivos utilizando nombres en minúsculas.

Para deshabilitar un elemento. existen dos símbolos especiales disponibles: ‘-’ (guión) y ‘*’ (asterisco).Auto corrección Se puede usar la característica de auto corrección para detectar y corregir de forma automática equivocaciones. El diálogo Información de Auto Corrección aparecerá. teclee la palabra o frase que remplazará a la que se encuentre dentro del recuadro Remplazar. palabras mal escritas. también. Por ejemplo. 292 . haga lo siguiente: 1 Seleccione el comando Auto corrección dentro del menú Herramientas. De manera predeterminada. utilizar auto corrección para insertar de forma rápida frases de uso común sin tener que escribirlas. teclee la palabra o frase que remplazará a lo que se teclee en el recuadro Con. Para agregar o editar entradas de la auto corrección. faltas de ortografía y equivocaciones de escritura. teclee ‘-late’ en Reemplazar y ‘-toso-‘ en Con para reemplazar una palabra que incluye ‘late’ tal como “chocolate” con “chocolatoso”. Inicialmente la lista de auto corrección contiene alrededor 1000 correcciones de los errores más comunes de mayúsculas. si teclea "atravez". la opción de Auto Corrección está habilitada. 5 En el recuadro Con. errores gramaticales así como el uso incorrecto de mayúsculas. 6 Haga clic sobre el botón Aceptar. Por ejemplo. Siempre es posible deshabitarla al seleccionar el comando Auto Corrección dentro del menú Herramientas y poner o quitar la marca de Activar que se encuentra dentro del diálogo Auto Corrección. la Auto corrección puede reemplazarlo con "a través" de manera automática. Por ejemplo. use el mismo símbolo especial que utilizó dentro del recuadro Remplazar. la lista de las palabras que serán corregidas y sus reemplazos aparecen en la parte superior del diálogo.". 2 Dentro del diálogo Auto corrección. Para reemplazar solamente parte de una palabra. se le puede agregar un elemento a la auto corrección que reemplace "ni" con "Namo Interactive Inc. 3 Haga clic en el botón Agregar para añadir un nuevo elemento o seleccione uno ya existente de la lista y haga clic que sobre el botón Modificar para editarlo. 4 En el recuadro Reemplazar. Se puede. Si intenta reemplazar solamente parte de una palabra. La palabra “late” por sí sola no será reemplazada. haga clic sobre la casilla de verificación que se encuentra a un lado del elemento.

Para agregar o editar un elemento de la inserción rápida. 5 Seleccione Texto para proporcionar el texto de reemplazo directamente dentro del diálogo. Sólo se puede proporcionar un texto sin formato dentro de este campo. escriba un atajo ya definido y presione las teclas <Ctrl + =>. Teclee el texto dentro del recuadro provisto. El elemento que acaba de insertar se encontrará dentro de la lista Atajo. 293 . operaciones o párrafos de uso frecuente sin tener que escribirlos cada vez. El diálogo Agregar Inserción Rápida aparecerá. 9 Para utilizar la inserción rápida al “vuelo” (en el momento de escribir). El elemento definido dentro de la Inserción Rápida reemplazará al texto correspondiente. Si se quiere insertar texto con formato usando la inserción rápida.Inserción rápida La Inserción rápida provee una forma rápida de insertar frases. haga lo siguiente: 1 Seleccione Insertar en el menú Herramientas. 6 Seleccione Archivo para especificar un archivo a insertar en el documento cuando se utiliza este elemento de la inserción rápida. 7 Presione el botón Aceptar para regresar al diálogo Inserción Rápida. 2 Haga clic en el botón Agregar en el diálogo Inserción Rápida. 4 Dentro de Elemento a insertar. coloque el texto dentro de un archivo HTML. proporcione el texto que será utilizado (en combinación con las teclas <Ctrl + =>) para identificar al elemento de la Inserción Rápida. 8 Seleccione el elemento deseado de la inserción rápida y presione sobre el botón Insertar para incrustar el elemento en el punto de inserción dentro de la ventana de Edición. Sencillamente se escribe una sola palabra o carácter y luego se usan las teclas <Ctrl + => para reemplazar instantáneamente el atajo con el texto deseado. encontramos dos opciones: Texto y Archivo. 3 En el recuadro Atajo. guarde el archivo y luego use Archivo en lugar de Texto (vea abajo).

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 mayoría de las operaciones en los diálogos se realizan utilizando teclas, los macros pueden hacer mucho más que solamente dar entrada a texto. Los macros no graban los movimientos ni las pulsaciones de los botones del ratón, así que evite usar el ratón cuando se está grabando un macro. Para grabar un macro, haga lo siguiente:
1 Seleccione el comando Herramientas > Macros > Iniciar Grabación o presione las

teclas <Ctrl + Mayús + M>. El apuntador del ratón cambiará a un pequeño icono de un casete de cinta, indicando que se está grabando.
2 Realice la secuencia de teclas que quiere grabar. 3 Para detener la grabación, seleccione Herramientas > Macros > Detener Grabación o

presione las teclas <Ctrl + Mayús + 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 diálogo Macros aparecerá. 2 Haga clic en el botón Agregar. El diálogo Agregar Macro aparecerá. 3 En la caja de texto Nombre del Macro, proporcione un nombre para el macro. 4 Opcionalmente, teclee una breve descripción del macro en el recuadro Descripción. 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 botón Aceptar. En la ventana de Edición, el apuntador del ratón

cambiará a un pequeño icono de un casete de cinta, indicando que se está efectuando una grabación.
8 Realice la secuencia de teclas que quiera grabar. 9 Para detener la grabación, seleccione Herramientas > Macros > Detener Grabación o

presione las teclas <Ctrl + Mayús + 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 diálogo Macros aparecerá. 2 En la lista de macros grabados, seleccione el que quiere reproducir. 3 En Repeticiones, especifique el número de veces que se reproducirá el macro

seleccionado.
4 Haga clic en el botón Ejecutar Macro.

295

Editor de ecuaciones
Al usar el editor de ecuaciones construido de manera interna en Namo WebEditor, se puede crear una fórmula con notación matemática e insertarla en el documento activo, todo de forma visual. Para crear una ecuación matemática, haga lo siguiente:
1 Seleccione el comando Insertar > Ecuación. El diálogo Ecuaciones aparecerá. 2 Cree la ecuación escribiendo los números y las letras que lleva y utilizando los botones

en la parte superior del diálogo para agregar la anotación matemática. La mayoría de los botones son listas que muestran varios símbolos relacionados, seleccione cualquiera de la lista para insertar. El icono de la lupa que se encuentra en el primer renglón de los botones, aumenta o disminuye el tamaño visual de la ecuación.
3 Cuando termine de escribir la ecuación, presione sobre el botón Aceptar.

Una vez que se ha salido del diálogo Ecuación, Namo WebEditor genera una imagen de bits y la coloca en el sitio adecuado dentro del documento actual. Se puede editar la ecuación al hacer doble clic sobre la imagen. A diferencia de otras imágenes, no se puede cambiar el tamaño de una ecuación utilizando las manijas de tamaño que aparecen alrededor de la imagen cuando ésta es seleccionada. Para cambiar el tamaño de una ecuación, haga doble clic sobre ella y utilice el icono del lente de aumento dentro del diálogo Ecuación. Cuando se guarda un documento que contiene una ecuación, una imagen de bits es almacenada como archivo GIF utilizado la siguiente convención para su nombre: [nombre_archivo]_[ext]_eqn[#].gif donde [nombre_archivo] es el nombre del documento, [ext] es la extensión del archivo (usualmente htm o html) y [#] es un número tal como 1, 2, 3, etc. La primera ecuación 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 ecuación 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 imágenes de ecuaciones son almacenados, tecléelo dentro del recuadro Guardar imágenes de ecuaciones y gráficos en de la solapa Preferencias de Edición en el diálogo 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 diálogo Importar de la Web aparecerá.

2 Haga clic en el botón Nuevo para proporcionarle información del sitio a ser importado.

El diálogo Propiedades de Importación aparecerá.
3 Haga clic en la solapa General y teclee la dirección 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 Autentificación y proporcione la información de usuario del sitio,

si es necesario. Haga clic sobre el botón Aceptar para regresar al diálogo Importar
desde la Web.

6 En la lista de la parte superior del diálogo, seleccione el sitio que acaba de agregar y haga

clic sobre el botón Importar. Un diálogo de Estado se mostrará con los datos de la operación de importación.
7 Una vez que la operación importación se ha completado, un mensaje aparece indicando:

“La importación desde la Web se ha completado.” Haga clic sobre el botón Aceptar.
8 Haga clic en el botón Cerrar para salir del diálogo Importar de la Web.

Para importar rápidamente un sólo 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 versión 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 diálogo Abrir, localice y seleccione el documento Word. Si no aparece ningún

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 botón Aceptar.
3 En el diálogo Opciones de importar archivo externo, seleccione las opciones para

indicar a Namo WebEditor cómo se debe manejar la información de formato dentro del documento Word y luego haga clic sobre el botón Aceptar. Las opciones de importación son:
Mantener formato original

Intenta preservar el formato del documento original tanto como sea posible usando etiquetas CSS y <font>. Esta opción importa el documento tan fidedignamente como sea posible, pero el código fuente HTML del documento importado puede ser difícil de editar debido a la gran cantidad de etiquetas que se generan para preservar el formato.
Usar sólo etiquetas <FONT>

Sólo etiquetas del tipo <font> se utilizarán para convertir los códigos de formato del documento original. Las etiquetas del tipo CSS no serán utilizadas. Esta opción sacrifica la igualdad del formato del documento original en favor de crear un código fuente HTML más limpio.
Importar sólo texto

Sólo importa el texto del documento original. Toda la información de formato (excepto tablas, saltos de párrafos y saltos de línea) será descartada. Esta opción crea el código fuente HTML más limpio, pero la mayoría de la información de formato se pierde. Selecciona el uso de etiquetas CSS al importar un documento. códigos de formato del documento original.

Usar propiedades CSS

Usar etiquetas <FONT> Sólo etiquetas del tipo <font> se utilizarán para convertir los

298

Enviando un documento como correo electrónico (e-mail)
Para enviar un documento web como correo electrónico (e-mail), haga lo siguiente:
1 Abra el documento que desea enviar por correo electrónico. 2 Seleccione el comando Archivo > Enviar Correo. Su programa de correo electrónico se

ejecutará y se creará un nuevo mensaje. El documento web se insertará dentro del cuerpo del mensaje.
3 Proporcione la dirección de correo a la cual se envía y el tema antes de proceder a enviar

el mensaje. Namo WebEditor incluye una selección de plantillas diseñadas por profesionales que incluye en ocasiones tales como tarjetas de cumpleaños, felicitaciones de fechas diversas, cartas de agradecimiento y muchas otras especialmente adaptadas para enviar como correo electrónico. Muchas de estas plantillas contienen imágenes animadas. Para usar una plantilla de tarjeta de felicitación, haga lo siguiente:
1 Seleccione el comando Archivo > Nuevo. 2 En el diálogo Nuevo, haga clic en la solapa Tarjeta de felicitación. 3 Seleccione una plantilla para la tarjeta de felicitación. Una vista preliminar de la tarjeta

seleccionada se muestra dentro del recuadro Vista Previa.
4 Haga clic sobre el botón Aceptar. Un nuevo documento será creado utilizando la

plantilla.
5

Escriba el nombre del destinatario, las palabras de felicitación y su nombre dentro del documento. electrónico. No es necesario guardar primero el documento.

6 Use el comando Archivo > Enviar Correo para transmitir el documento como un correo

299

seleccione uno o más archivos de imagen del disco duro y haga clic sobre el botón Abrir. El diálogo Clip Art aparecerá. Para crear una nueva categoría (que viene a ser una subcategoría. 2 Seleccione la categoría de nivel superior en la cual se creará la nueva subcategoría. O proporcione la dirección URL de una imagen en Internet y haga clic sobre el botón Abrir URL Si se tiene una gran cantidad de imágenes que quisiera agregar a la librería de imágenes de Namo WebEditor. con el nombre "Nuevo grupo 1" 4 Haga clic con el botón derecho del ratón sobre el nombre de la nueva categoría y seleccione Renombrar del menú de atajo. 2 Seleccione la categoría a la cual agregar las imágenes y presione sobre el botón Importar Imágenes. 3 En el diálogo Abrir. haga clic sobre el botón Importar Imágenes y seleccione las imágenes deseadas dentro del diálogo Abrir. Sólo se pueden agregar imágenes en formato GIF o JPEG a la librería de imágenes. es buena idea agregar una o más categorías que las contengan. se puede agregar a la librería de imágenes de Namo WebEditor para un acceso fácil. Una nueva categoría será creada bajo el nivel seleccionado. puesto que no se puede agregar a la categoría del nivel superior). Teclee el nombre deseado y presione la tecla <Intro>. siga los siguientes pasos: 1 Abra el diálogo Clip Art (use el comando Insertar > Imagen > Clip Art). 5 Para agregar imágenes a la nueva categoría.Agregando imágenes a la librería de imágenes Si se tiene uno o más archivos de imágenes que se usa de forma frecuente. 300 . siga los siguientes pasos: 1 Use el comando Insertar > Imagen > Clip Art. Para agregar imágenes a la librería de imágenes. 3 Haga clic en el botón Nueva Categoría.

Pegar contenido del portapapeles Cortar selección al portapapeles Agregar selección al portapapeles y suprimir Suprimir línea Deshacer Rehacer Ir a la siguiente celda Ir a la celda anterior Suprimir palabra a la izquierda Rehacer Insertar salto de página Insertar salto de línea Copiar selección 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 Selección extendida al principio de la palabra previa Selección extendida una línea arriba Selección extendida una línea abajo Mayús + Ctrl + Derecha Selección extendida al principio de la siguiente palabra 301 ... Mayús + Arriba Mayús + Abajo Función Seleccionar todo Copiar selección al portapapeles Agregar selección al portapapeles Buscar. Búsqueda y reemplazo global.. Búsqueda y reemplazo. Insertar tabla..Lista de atajos de teclado Atajos de edición de Texto Teclas Ctrl + A Ctrl + C Ctrl + Mayús + C Ctrl + F Ctrl + Mayús + F Ctrl + H Ctrl + R Ctrl + Mayús + T Ctrl + V Ctrl + X Ctrl + Mayús + X Ctrl + Y Ctrl + Z Alt + Z Tab Mayús + Tab Ctrl + Backspace Alt + Backspace Ctrl + Intro Mayús + Intro Ctrl + Insert Mayús + Insert Ctrl + Supr Ctrl + Inicio Ctrl + Fin Ctrl + Re Pág Ctrl + Av Pág Ctrl + Izq. Ctrl + Derecha Mayús + Ctrl + Izq... Búsqueda y reemplazo.....

....) Teclas Inicio Fin Mayús + Inicio Mayús + Fin Ctrl + = F3 F7 F8 Mayús + F8 F9 Ctrl + F7 Mayús + F7 Mayús + F9 Función Ir al principio de la línea Ir al final de la línea Selección extendida al principio de la línea Selección extendida al final de la línea Inserción Rápida (después de teclear la palabra de Inserción Rápida) Buscar otra vez Verificar ortografía Unir listas Dividir listas Crear vínculo.. Auto Corrección. Remover vínculo 302 .Atajos de edición de texto (cont.. Insertar símbolo.

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 viñeta Aplicar estilo normal Propiedades de la Celda...... Alineación Izquierda Propiedades del Marco. 303 . Disminuir sangría Aumentar sangría Pegar formato Copiar formato....Atajos de Formato Teclas Ctrl + Alt + C Ctrl + E Ctrl + Mayús + I Alt + Mayús + I Ctrl + B Ctrl + I Ctrl + J Ctrl + L Ctrl + Alt + L Ctrl + Mayús + 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 Mayús + F2 Ctrl + F6 Mayús + F6 Función Alineación centrada Quitar formato de carácter Propiedades de la Imagen.. Hojas de estilo..... Efectos de la Imagen. Formato del Párrafo... Estilo de Párrafo. Negrilla Itálica Aplicar color de tipografía Formato de Carácter......

Mostrar / ocultar reglas Ver ventana del Administrador de Sitios Web Ver ventana de Resultados Ver esquema del documento Ver ventana de Línea 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 edición visual y edición HTML Vista previa del documento en Internet Explorer Vista previa del documento en Netscape Cerrar documento 304 .Atajos de vista de ventanas Teclas Ctrl + W Alt + Mayús + R Alt + 1 Alt + 2 Alt + 3 Alt + 4 Alt + 5 Alt + Tab Ctrl + Mayús + Tab Alt + Intro F5 Mayús + F5 F6 F11 F12 Ctrl + F4 Función Lista de ventanas...

..... Asistente de Secuencia de Comandos........ Salir del programa Menú Contextual Importar documento de Internet Explorer Importar documento de Netscape Ctrl + Mayús + 0 (cero) Macros...Otros atajos Teclas Ctrl + Mayús + A Ctrl + D Ctrl + G Ctrl + K Ctrl + Q Ctrl + M Ctrl + Mayús + M Ctrl + N Ctrl + Mayús + N Ctrl + O Ctrl + Mayús + O Ctrl + P Alt + P Ctrl + Mayús + P Ctrl + S Alt + S Ctrl + Mayús + S Alt + Mayús + S Ctrl + Mayús + W Alt + Mayús + W Alt + X F1 F4 Ctrl + F1 Ctrl + F2 Alt + F4 Mayús + F10 Mayús + F11 Mayús + F12 Función Insertar capa Guardar documento como... Salir del programa Ayuda Publicar.... Agregar marcador.... Información del documento... Abrir documento en marco. Imprimir conjunto de marcos. 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. Guardar documento Guardar todos los documentos abiertos Guardar todos los marcos Guardar proyecto Administrador de Secuencias de Comandos.. Imprimir. 305 . Configuración de la página. Propiedades del documento..

.

. 206 Atributos de estilo Aplicando atributos de estilo.............. 152 Paso 3 Especificar el título del gráfico ............................. 203........................................................................ 9 Plantillas de Sitios Web ....................... 101 Botón Inteligente Atributos de Relleno de Color ......................................... 8 Tema ...... 132........................................... 178.................... 199............. 179 Eventos ............... 292 B bajorelieve ..... 199............ 40 Barra de navegación de texto..................... 267 Archivos de MS Word. 199............................................................... 199..... 86 Modificando un botón............................. 8.............. 84 Asistente de Gráficos..... 221 Pasos básicos . 88 Seleccionando un botón ....Índice A Abrir URL ................ 158 Paso 1 Seleccionar el tipo de gráfico........ 181 Acoplar ...................................... 221 Bloque de Tabla.................................. 199...................................... 40 Barra de herramientas estándar ...... 218...... 214 Requerimientos para usar el Asistente de Bases de Datos ......................... 223 Parámetros de la Lista.......... 87 Propiedades del fondo.... 213 Cláusula ordenar por (order) ........... 196 Apple .. .................................. 225 Bloque de Entrada .... 149 Agregando líneas de tendencia ..................................................... 88 Propiedades de la Sombra ........ 258 Carpeta... 298 Asistente de Bases de Datos Asistente de Bases de Datos .......... 260....................................................... 19 Barras de navegación gráficas ............................... 18 Barras de navegación Barra de navegación de texto ................................................ 117 Auto Corrección Auto Corrección..................................... 231 Bloque de Lista........... 199........................ 7 ASP................................... 281........................... 178 Propiedades de la acción................. 212 Cláusula donde (where) ........................ 101 Parámetros de los bordes .. 9 Usando el ......................................................... 264 Buscar en el proyecto...... 221 Bloque de Modificación ....................................... 200 Bloque de Detalle ................... 199............. 84 Búsqueda y Reemplazo Global Buscar en código fuente HTML......... 183 Anexando una acción.. 264 307 .................................... 18 Modificando la apariencia de los botones de la barra ...................................... 199................. 214......................... 243 Bloque de Tabla................... 257............................... 240 Bloque de Gráfico...... 11....................... 18 Bloque de Detalle Bloque de Detalle......................... 225 Bloque de Lista Bloque de Lista ...... 19 Modificando la apariencia de los botones de una barra de navegación......... 151 Paso 2 Especificar series y categorías ........ 199..... 266 Creando el árbol de navegación........ 221 Bordes de la Tabla Modificando los bordes de una tabla o celda ............................. 194 Árbol de navegación Árbol de navegación ................................................. 179..... 54 Animaciones Flash o Shockwave ........................ 214.... 39..................... 43 Administrador de Secuencias de Comandos180 Alineación .. 272 Modificar Forma de la Imagen .................. 202 Proporcionando una sentencia de selección Cláusula de unión (join)........................ 154 Asistente de Sitios Web Asistente de Sitios Web ........ 10 Información del sitio Web........................................................... 203 Asistente de Botones Inteligentes .......... 196 Acciones Acciones ......... 71 Barra de herramientas Barra de herramientas de formato .....

........... 165 Imagen............. 126 Moviendo una capa............................ 22 Conjunto de Marcos Origen de los marcos ................................... 203... 40 Entorno de Edición Barra de estado .... 130 Capas:................................................................................ 121 F Formularios 308 .................. 165 Campo oculto ... 22 Botón Inteligente ............................. 129 Manija de la capa....................... 40 Barra de herramientas estándar..... 127 Marca de la etiqueta de la capa ............. 124................................................. 279 Eliminar del Control de Código............. 239 Chili!Soft ASP ...................... 238 Distribución.... 237..................................... 40 Solapa Documentos .. 285 Solapa opciones de edición de código Color de la tipografía . 203............. 127 Capas Múltiples .......... 119 Sangría.......................................................................................................................................................................................................................... 127 Visibilidad .... 172............ 279 Salida .. 54 Estilo Alineación........ 115 Espaciamiento entre Líneas .... 40 Espacios............................................................... 126 Propiedades de la capa........................ 265 Campo de Formulario............... 115 Estilo del Párrafo ............................... 115 Estilo............................................................................................. 106 Documento Guardar ........................................................................... 300 Codificación .......... 173........ 169 Menú desplegable....................................... 175 em113 Entorno de edición Barra de herramientas de formato...... 173...................................... 286 Mostrar números de línea .................. 276 Carpeta de Trabajo ..... 195 Control de Código Agregar archivos al Control de Código ..... 170.............. 125 D Diccionario ortográfico.......................... 238.............................................. 174........ 108................. 22 Titulares. 162 Botón de comando....... 285 Control ActiveX ................. 42 Marcas de Párrafo........ 277 Convertir Texto a Tabla...................................................................................................................................... 40 Ventana de Edición...................................................................... 166 Cuadro combinado ................ 168 Botón de opción....................... 207............... 42 Rejillas de Tabla ........................................... 126 Lista de capas ........ 127 Cambiando el tamaño de una capa.................................... 14...................................................... 206 Clip Art ......... 60 Propiedades del Documento ................... 204 E Edición de código fuente .......... 23 Objeto de un tema....................................................... 138 Vista Previa . 171 Efectos JavaScript ................................ 117.... 216 Capas Capas ......................................................................... 278 Conectando al Control de Código................................................................................................ 105....C Cambiando la codificación ... 287 Ventana HTML Ancho tabulación................................................... 128 Creando una capa.............. 174 Conservar código HTML existente .. 40 Solapa Modo....... 171 Edición HTML Editando código HTML Submenú Salto de línea........................ 166 Campos de salida (vínculo) ................. 275 Descargar la última versión ........ 57 CSS.................................................. 13 DSN DSN ......................... 285 Directorio de inicio............ 42 Marcas Especiales...................... 106 Copiar Formato................. 166 Cajas de texto ..... 42 Espaciamiento de línea ........... 249 Casilla de verificación ........................................... 109 Código HTML Opciones de formato HTML ........................................... 127 Agregando contenido............ 168........................ 130 CGI CGI......................................................................................... 287 Componentes de Temas Barra de Navegación ..... 276 Registrar archivos ......

.............. 119 Borrar Estilo ..................... 192 Líneas de Tiempo............... 124 Huérfano...................................................... 192 H Hojas de Cálculo Actualizar el contenido de la Hoja de Cálculo.......... 87 Efectos de Imagen Ajustando el brillo y el contraste .................................................................... 163 FTP....... 71 Gradiente ............................................. 288 Líneas de Tiempo Anexando Acciones .................. 80 Marcadores Creando y usando marcadores ................................. 70 . 293 Agregar Inserción rápida........... 73 Sombras ............................ 82 Marcadores ............... 147......................................................................................... 74 L Línea sólida .................... 88........... 123 Vincular a una Hoja de estilo externa ....... 41 Marcos Agregando y eliminando marcos Dividir Marcos Horizontalmente....................... 119 Agregar Estilo................ 64 Abrir cada imagen en una nueva ventana 67 Especificar dónde guardar las imágenes . 47........... 54 Guardar ................................................................................................................................................ 127 Encajar ........ 188 Objetos gráficos ............................................ 82 Marcas Mostrar/Ocultar Marcas ........................................... 151 Modificando las opciones de las series ..................... 72 Sombra...... 294 Macros ........................ 44............................. 108.. 66 Giro Efecto de giro ..................................................................................................................................................................................Creando un formulario....... 128 Inserción automática de etiquetas .................................. 294 Reproducir ..... 74 Fijar el Color Transparente ........................................ 191 Repetir ....... 95 Mostrar/Ocultar............................................................................................... 178 Gráficos Iniciando el Asistente de Gráficos ................................... 125 Hojas de estilo externas ..................................................................... 293 Insertando elementos en el formulario.. 147 Hojas de estilo . 147 Importando Hojas de Cálculo 145............ 119 Estilo del Párrafo ..... 62 Formato de imágenes ........................................................................... 47.......................................... 82 Nombre del marcador ............................................................................. 263 M Macros Grabar .................................................................. 41 Todas ....... 58 Cambiando el tamaño de una imagen ...... 44 Texto .......... 80 Dibujar una zona activa rectangular................................................................................ 135 Dividir Marcos Verticalmente................... 28 G Galería de Imágenes .... 70 Filtro de Imagen.............. 61 Copiando una imagen ............... 43 Parámetros de las guías Ajustar ... 206 Imágenes Agregando imágenes .................... 138 Bordes del marco 309 I IIS203............... 294 Mapa de Imagen Crear un mapa de imagen ............. 147 Vincular a la hoja de cálculo original ... 67 Leyendas............................................................................... 171 Inserción rápida ................................. 155 Guías Guías...................... 297 Índice Z.................. 59 Efectos de imagen Sombra.. 190 Renglón de Acciones .................. 163 J JPG ........................................................... 138 Importar desde la Web........... 31.... 80 Zona activa............................ 148 Incrustada en documento HTML .......... 191 Auto inicio ...... 60 Imagen de fondo ................................................................................... 135 Ancho del borde Ocultos ......................... 58 Guardando un documento con imágenes ............... 80 Mapa de Imagen.......... 185 Marcos llave.................... 47..

...... 96 Propiedades del Formulario.............................................................. 275 ........... 95 Mostrar/Ocultar............................ 64 N Nodo....................................... 184 Opciones de despliegue de código... 32 Transmitiendo los archivos al sitio Web.................. 57 Personal Web Server ............. 138 Cambiando el tamaño de los marcos ............. 197 Objetos Multimedia películas QuickTime............................................... 1 O Objetos multimedia Animaciones Flash y Shockwave ................... 111.................................................. 206 310 S Solapa Modo Modo Edición .................................. 58............... 133....... 173 Sangría Automática ..................... 195 Películas QuickTime ....... 135 Vista previa de un conjunto de marcos............ 48 Plug-in ................ 131 Número de marcos.......... 145 Miniaturas ................................................................................................................................. 257...................... 260 Creando un nuevo proyecto ...................... 203.......................................................................Ancho del Borde.................... 197 Proyectos ............................................. 64.................. 40 SourceSafe........................................................... 132 Marco destino ........................... 40 Modo HTML ......................................................... 69 Opciones de importar archivo externo 281.................................................................................................... 35 Información del sitio Web ............... 196 Otros objetos plug-in ......... 195 Sonidos MIDI.......................... 51 Reemplazar Todo.................................................... 103 pixeles.......................................................................................................................... 131 Nombre del marco .......... 184 onMouseOver............................. 135.............. 221 NT .......... 32 Seleccionando los archivos que han cambiado........................................................ 133....................................... 258 Administrando los documentos en un proyecto ................... 203......................................................................... 39...................................... 33 Descargando archivos de su sitio Web ........ 195 PNG................ 287 Opciones de guardar de la galería de imágenes .... 44....... 43 P Pegar Formato ............ 206 R Reemplazar Reemplazar ............................ 138 Guardando un conjunto de marcos ........ 43 PHP ............. 170 Propiedades QuickTime ...................... 259 Creando carpetas en un proyecto ............................. 96 Alineación........................ 258 Publicando......................... 267 Nombre del vínculo............................. 43 Rejilla Parámetros de la rejilla Ajustar .. 53 Plantilla................................................................................ 138 Bordes..... 33 Volviendo a crear un proyecto borrado.................................................................................................................... 287 Propiedades de las Tablas................ 203 onMouseOut........ 203 Personalizando las barras de herramientas ................. 283 Programas externos ................. 111....................... 135 Marcos........................................................ 260...... 133 Microsoft Excel Importando hojas de cálculo................... 278 ODBC..................................................... 127 Encajar .............. 138 Determinando el destino predeterminado de un marco ........... 298 Ordenar.... 27 Conectando con el sitio Web ............................................................................................................................................................................. 137 Nuevo Marco......... 50 Preferencias Opciones del Documento........................ 131 Removiendo marcos ....... 197 Sonidos RealAudio................... 40 Modo vista previa ................. 27. 44 Rejilla .. 35 PWS............... 67.................... 132 Guardar conjunto de marcos como ................. 261 Agregando nuevos documentos a un proyecto .......... 27. 51 Reglas ...... 75 Portapapeles.. 194 Obtener última versión ..... 28 Publicando ................. 96 Tamaño....................................................................... 273...

............ 97..............................................T Tablas Borrar...... 49 Tipografía Decoración........................ 7............ 7..... 95 Convirtiendo entre texto y tablas .... 112 Titular Editando la etiqueta de un titular ............ 30............................................ 92 Cambiando el tamaño de renglones y columnas ..... 21............................................ 103 Tablas hijas........................ 78........... 21 Galería de temas .. 21 Texto Alineación..................... 91 Tablas hijas............... 98 Editando las propiedades de una celda 98 Imagen de fondo ........................................................... 44 Tema Cambiando temas ...................... 79 Hipervínculos.................................................... 45 Tamaño de la tipografía ............ 79 Tipo de vínculo ....... 45 Color del fondo . 31.... 92 Borrando renglones y columnas................................................. 106 Tamaño de la ventana.............................. 90................. 45 Color de la tipografía ......................... 263 Vínculos Crear/Modificar Vínculos ......... 270 Rango de documentos a los cuales aplicar un tema ......................... 80 311 ........ 91 Editando tablas Agregando renglones y columnas ............................... 7.... 45 Valores Predeterminados del Documento 45 Verificando vínculos........... 76 Z zona activa ........... 263 Huérfano .. 291 Vínculo roto.......... 54 Introduciendo y seleccionando texto . 100 Seleccionando partes de una tabla.......... 94 Color de fondo ............................................ 15 V Valores Predeterminados del Documento Autor........................... 263 Verificar todos los vínculos ..................... 45 Color del vínculo .................... 262....... 31............................... 12...... 30.................................... 76 Remover Vínculos ... 263.................................................................. 263 Vínculo externo................................................................ 105 Copiando y pegando partes de una tabla............... 93 Creando una tabla ............ 112 Tipografía Primaria.................................................................................. 30......... 112 Tipografía Secundaria.............................. 91 Tablas y distribución ........................................... 91 Ordenando una tabla..........................

Sign up to vote on this title
UsefulNot useful