You are on page 1of 461

Gua de usuario

Cmo ponerse en contacto con


nosotros
Nuestra oficina principal:

WinSoft International
24 rue Louis Gagnire
38950 St Martin le Vinoux
FRANCIA

N de telfono principal:

+33(0)4 38 02 22 00

Servicio de atencin
al cliente/Soporte tcnico:

support@winsoft-international.com

Fax general:

+33(0)4 38 02 22 11

En lnea
Vistenos en la web en:

http://www.winsoft-international.com/

Internacional
Por favor pngase en contacto con su distribuidor/comerciante
local. Para obtener ms informacin, pngase en contacto con
nosotros en el nmero de telfono proporcionado anteriormente.

La Gua de usuario del sistema de Ayuda y el software descrito se


proporcionan bajo un Acuerdo de licencia de usuario final, que se incluye
con el producto. El acuerdo especifica los usos permitidos y prohibidos.

Marcas registradas

Serif es una marca registrada de Serif (Europe) Ltd.


WebPlus es una marca registrada de Serif (Europe) Ltd.
Todos los nombres de producto de Serif son marcas registradas de Serif
(Europe) Ltd.
Microsoft, Windows y el logotipo de Windows son marcas comerciales
registradas de Microsoft Corporation. Se reconocen todas las otras marcas
comerciales.
Windows Vista y el botn de Inicio de Windows Vista son marcas
comerciales o marcas comerciales registradas de Microsoft Corporation
en Estados Unidos y/o en otros pases.

Copyrights

Digital Images 2008 Hemera Technologies Inc. Reservados todos los


derechos.
Digital Images 2008 Jupiterimages Corporation. Reservados todos los
derechos.
Digital Images 2008 Jupiterimages France SAS. Reservados todos los
derechos.
Content 2008 Jupiterimages Corporation. Reservados todos los derechos.
Portions images 1997-2002 Nova Development Corporation; 1995
Expressions Computer Software; 1996-98 CreatiCom, Inc.; 1996
Cliptoart; 1997 Multimedia Agency Corporation; 1997-98 Seattle
Support Group. Reservados todos los derechos de todas las partes.
Portions graphics import/export technology AccuSoft Corp. &Eastman
Kodak Company& LEAD Technologies, Inc.
THE PROXIMITY HYPHENATION SYSTEM 1989 Proximity
Technology Inc. Reservados todos los derechos.
THE PROXIMITY/COLLINS DATABASE 1990 William Collins Sons
& Co. Ltd.; 1990 Proximity Technology Inc. Reservados todos los
derechos.
THE PROXIMITY/MERRIAM-WEBSTER DATABASE 1990 MerriamWebster Inc.; 1990 Proximity Technology Inc. Reservados todos los
derechos.

The Sentry Spelling-Checker Engine 2000 Wintertree Software Inc.


WGrammar Grammar-Checker Engine 1998 Wintertree Software Inc.
Andrei Stcherbatchenko, Ferdinand Prantl
eBay 1995-2008 eBay Inc. Reservados todos los derechos.
PayPal 1999-2008 PayPal. Reservados todos los derechos.
Roman Cart 2008 Roman Interactive Ltd. Reservados todos los
derechos.
Mal's 1998 to 2003 Mal's e-commerce Ltd. Reservados todos los
derechos.
iTunes 2000 to 2008 Apple Computer, Inc. Reservados todos los
derechos.
YouTube 2008 YouTube, LLC
phpBB 2000, 2002, 2003, 2007 phpBB Group
FontForge 2000,2001,2002,2003,2004,2005,2006,2007,2008 de George
Williams.
Algunas partes de este software estn protegidas con copyright 2008 The
FreeType Project (www.freetype.org). Reservados todos los derechos.
ODF Translator 2006-2008, Clever Age, DIaLOGIKa, Sonata Software
Ltd. Reservados todos los derechos.
Office Binary Translator to OpenXML Copyright 2008-2009,
DIaLOGIKa. Reservados todos los derechos.
Anti-Grain Geometry - Version 2.4
Copyright 2002-2005 Maxim Shemanarev (McSeem)
SlideShowPro Dominey Design Inc. Reservados todos los derechos.
Muestras de imgenes prediseadas de Serif ArtPacks Serif (Europe)
Ltd. & Paul Harris
Muestras de fuentes TrueType de Serif FontPacks Serif (Europe) Ltd.
2011 Serif (Europe) Ltd. Reservados todos los derechos. Ninguna parte
de esta Gua de usuario del sistema de Ayuda puede reproducirse de forma
alguna sin el consentimiento expreso por escrito de Serif (Europe) Ltd.
Serif WebPlus X5 2011 Serif (Europe) Ltd. Reservados todos los
derechos.
Los nombres de empresas y personas utilizados en los ejemplos son
ficticios.

Contenido
1. Bienvenido ............................................... 1
Bienvenido! ................................................................... 3
Principales caractersticas ............................................. 4
Nuevas caractersticas................................................. 16
Instalacin .................................................................... 20

2. Introduccin ........................................... 23
Asistente para inicio ..................................................... 25
Creacin de un sitio con una plantilla de diseo .......... 27
Creacin de un sitio desde cero................................... 31
Apertura de un sitio existente ...................................... 32
Trabajo con ms de un sitio ......................................... 34
Cmo guardar el sitio ................................................... 34

3. Configuracin de sitios y pginas .......... 35


Introduccin a la estructura del sitio y a la navegacin 37
Configuracin de las propiedades del sitio .................. 40
Optimizacin del motor de bsqueda........................... 47
Uso del Administrador de sitios ................................... 55
Introduccin a las pginas y las pginas maestras ...... 57
Adicin, eliminacin y reorganizacin de pginas........ 64
Configuracin de las propiedades de pgina ............... 71
Creacin de pginas HTML ......................................... 76
Visualizacin de pginas ............................................. 77

Contenido

4. Desplazamiento e hipervnculos ............ 83


Adicin de barras de navegacin ................................. 85
Adicin de mens emergentes ..................................... 98
Adicin de botones..................................................... 100
Adicin de hipervnculos y delimitadores ................... 105

5. Adicin de objetos web........................ 111


Adicin de bsquedas de sitio ................................... 113
Uso de la Galera ....................................................... 115
Adicin de Google Maps ............................................ 120
Adicin de anuncios ................................................... 125
Uso de cajas de luz .................................................... 128
Insercin de paneles .................................................. 132
Adicin de zonas activas............................................ 139
Adicin de elementos dinmicos ................................ 143
Opciones de los elementos dinmicos ....................... 143
Adicin de elementos dinmicos emergentes ............ 146

6. Adicin de objetos web dinmicos ...... 151


Asociacin de cdigo HTML ...................................... 153
Adicin de formularios................................................ 161
Fuentes RSS y podcasts............................................ 177
Introduccin al comercio electrnico .......................... 186
Insercin de un objeto de comercio electrnico
(PayPal)........................ ............................................. 189
Uso de la combinacin de bases de datos................. 195
Uso de objetos inteligentes ........................................ 209
Control de acceso ...................................................... 222

Contenido

7. Trabajo con texto ................................. 235


Importacin de texto de un archivo ............................ 237
Introduccin a los marcos de texto ............................ 239
Uso del texto artstico ................................................ 246
Colocacin de texto en un trazado............................. 248
Edicin de texto en la pgina ..................................... 251
Uso de Buscar y reemplazar ...................................... 255

8. Formato de texto .................................. 259


Configuracin de propiedades de texto ..................... 261
Uso de fuentes ........................................................... 261
Uso de estilos de texto............................................... 263
Creacin de una lista con vietas o numerada .......... 267
Insercin de detalles de usuario ................................ 269
Insercin de variables ................................................ 272

9. Trabajo con tablas................................ 275


Creacin de tablas basadas en texto ......................... 277
Insercin de un calendario ......................................... 279

10. Edicin de objetos ................................ 285


Seleccin de un objeto............................................... 287
Seleccin de varios objetos ....................................... 290
Copia, pegado y replicacin de objetos ..................... 292
Movimiento de objetos ............................................... 295
Cambio de tamao de objetos ................................... 295
Rotacin de objetos ................................................... 297
Recorte y combinacin de objetos ............................. 299

Contenido

Unin de contornos de objeto .................................... 304


Cmo actualizar y guardar valores predeterminados . 306

11. Organizacin de objetos ...................... 309


Ordenacin de objetos ............................................... 311
Alineacin y distribucin de objetos ........................... 312
Asociacin de objetos a texto .................................... 313
Creacin de grupos .................................................... 317

12. Imgenes, animacin y multimedia ..... 319


Adicin de marcos de imagen .................................... 321
Importacin de imgenes ........................................... 323
Uso de la barra multimedia ........................................ 328
Configuracin de las opciones de exportacin de
imgenes ................................................................... 333
Importacin de imgenes TWAIN .............................. 339
Aplicacin de filtros de PhotoLab ............................... 340
Uso de Estudio de recorte de imgenes .................... 349
Adicin de animaciones ............................................. 353
Adicin de sonido y vdeo .......................................... 356
Uso de la galera fotogrfica ...................................... 362
Vinculacin de imgenes remotas ............................. 369

13. Lneas, formas y efectos ..................... 371


Dibujo y edicin de lneas .......................................... 373
Configuracin de las propiedades de lnea ................ 377
Dibujo y edicin de formas ......................................... 380
Uso de efectos de filtro 2D ......................................... 384

Contenido

Uso de efectos de filtro 3D ......................................... 389


Uso de estilos de objeto ............................................. 392
Adicin de dimensionalidad (3D instantneo) ............ 394

14. Color, rellenos y transparencia ............ 399


Aplicacin de colores slidos ..................................... 401
Uso de esquemas de color ........................................ 404
Trabajo con rellenos de mapas de bits y gradientes .. 412
Configuracin de transparencia ................................. 417

15. Vista previa y publicacin ..................... 421


Vista previa del sitio ................................................... 423
Publicacin en la web ................................................ 425

16. ndice ................................................... 437

Bienvenido

Bienvenido

Bienvenido

Bienvenido!
Bienvenido a WebPlus X5 de Serif: la forma ms fcil de crear su
negocio, organizacin y hogar en la Web.
Para facilitarle el trabajo, WebPlus incluye una impresionante
seleccin de plantillas de diseo, barras de navegacin de pgina,
contenido creativo de galera y estilos para su uso. En
consecuencia, cualquier usuario podr publicar en la Web con
calidad profesional y fcilmente, tenga o no experiencia. Tambin
podr reutilizar al contenido de texto existente importando
documentos PDF y documentos de editores de texto.
Para sacar el mximo partido a las imgenes de su sitio puede
usar Image Cutout Studio para recortar imgenes y PhotoLab para
ajustes de imgenes y combinaciones de efectos avanzados. Es
que no puede perdrselo!
WebPlus X5 ofrece mucho ms que una publicacin web
"esttica". Su verdadera potencia se pone de manifiesto en el
momento de aadir y gestionar contenido dinmico, como blogs,
foros, sistemas gestin de contenido (CMS), contadores y mucho
ms. Puede incluso utilizar herramientas de comercio electrnico
para obtener la funcionalidad lucrativa de carro de la compra.
Cuando est satisfecho con el sitio de WebPlus, solo tiene que
publicarlo en la Web para compartirlo con compaeros de
negocio, clientes, amigos y familiares por igual.
Para obtener un resumen ms detallado sobre todo lo que puede
ofrecerle WebPlus, consulte Principales caractersticas (pg. 4).

Bienvenido

Va a realizar una actualizacin?


Si ha actualizado desde una versin anterior, esta nueva edicin
de WebPlus incluye un conjunto de nuevas e increbles
caractersticas (pg. 15) que coloca WebPlus por delante de sus
competidores y a un precio reducido. Esperamos que tambin
disfrute de la potencia adicional y de su rendimiento mximo.

Registro
No olvide registrar su nueva copia usando el Asistente de
registro..., en el men Ayuda. De este modo estar siempre al da
en las novedades y las actualizaciones de las caractersticas.

Principales caractersticas
Antes de empezar con WebPlus, le recomendamos que dedique
tiempo a familiarizarse con las capacidades y las caractersticas
principales de WebPlus.
Diseo

Plantillas de diseo temticas


Elija un tema, como rtico o Natural, en el que basar el
sitio. Cada tema proporciona una serie de los tipos de
pginas ms utilizados, elija entre las pginas Acerca de
nosotros, Galera, Productos, Contactos y muchas ms.
Elija varios diseos para las pginas nuevas y luego
simplemente rellene los marcadores de posicin con sus
propias imgenes.

Plantillas de diseo listas para usar


Cree en un instante sitios web adaptados basndose
en un aspecto y un esquema de color seleccionados.
Todas las plantillas de diseo Pro incluyen imgenes
sin derechos de autor para que las pueda utilizar.

Bienvenido

Herramientas de diseo profesionales


Las reglas mviles, lneas de guas y una rejilla de
puntos, como ayudas de diseo, le facilitan la tarea de
colocar objetos con precisin y los ajustan a la gua o la
rejilla. Utilice las guas adhesivas, que son un modo
perfecto de mover (en bloque) todos los objetos
ajustados a las lneas de gua (luego puede mover la
gua y los objetos). Puede alinear y cambiar el tamao
de objetos utilizando las guas dinmicas para ajuste,
sin necesidad de utilizar guas de regla o
transformaciones de objetos precisas.

Control de pginas
Aada y quite pginas con solo unos clics del ratn en
la pestaa Sitio. Arrastre y suelte pginas en la pestaa
para reorganizar la secuencia. Asigne pginas maestras
de varias pginas de un sitio a la vez para ahorrar
tiempo y conseguir una magnfica coherencia en el
diseo, incluso puede asignar mltiples pginas
maestras a una pgina web especfica para obtener un
diseo de pgina ms variado.

Elementos esenciales del sitio web

Barra QuickBuilder para un diseo web fcil


La forma ms sencilla de iniciarse en WebPlus: arrastre
pginas, barras de navegacin, marcos de texto,
imgenes, contenido Flash, galeras fotogrficas,
botones u objetos inteligentes directamente a la pgina
para resultados rpidos sin tener que contar con
conocimientos previos de la interfaz de usuario.

Estructura de sitio sencilla


La pestaa Sitio jerrquica facilita la visin del diseo
general del sitio.

Barras de navegacin
Utilice barras de navegacin inteligentes para navegar
por todas las pginas de sitio; todas las barras se
actualizan automticamente para incluir cualquier

Bienvenido

nueva pgina aadida y pueden adoptar muchos estilos


de diseo diferentes. Tambin puede incluir foros,
blogs y artculos de CMS en submens de la barra de
navegacin que cambian dinmicamente.

Herramienta de bsqueda del sitio


Efecte bsquedas de texto en todo el sitio con la
potente herramienta de bsqueda del sitio.

Optimizacin del motor de bsqueda


Controle cmo los motores de bsqueda indexan su
sitio web. Puede incluir o excluir pginas en la
indexacin usando archivos robot o mapa del sitio de
motores de bsqueda, proteja la confidencialidad
mientras que ofrece a potenciales visitantes de la Web
resultados precisos de bsqueda del sitio.

Comercio electrnico: vender, vender, vender!


WebPlus agiliza y facilita el proceso de poner en venta
artculos en su pgina web gracias a su compatibilidad
incorporada con proveedores de carros de la compra
de comercio electrnico (p. ej., PayPal). Basta con
aadir los formularios de comercio electrnico, los
botones de comercio electrnico o incluso un
hipervnculo de cualquier objeto de WebPlus (texto,
imgenes o formas) para tener acceso al carro de la
compra elegido. Los formularios de comprar ahora,
aadir al carro de compra, donacin y suscripcin
conseguirn dinero con las opciones de compra y la
validacin del formulario. Regstrese en carros de la
compra directamente o adopte cuentas existentes.

Formularios preparados para la Web


Aplique formularios a las pginas web, utilice un
asistente para formularios web y adopte formularios
estndar listos para usar para detalles de contacto,
comentarios de los usuarios, pedir opiniones o
cargar documentos (p. ej., CV) o imgenes. Use los
formularios estndar preestablecidos como
componentes para reducir el tiempo de diseo de los
formularios. Enve los datos del formulario mediante la

Bienvenido

puerta de acceso gratuita para trnsito de formularios a


correo electrnico de Recursos Web Serif (los datos
pasan directamente a su correo cuando se envan) o
someta los datos a generacin de scripts local o remota.
Controle el orden de las pestaas para mejorar la
navegacin del formulario.

Objetos inteligente
Recursos Web Serif, los objetos inteligentes de Serif
que alojan servicios, ofrecen una serie de funciones del
sitio interactivas:

Visores activos: muestran el nmero de personas


que est viendo actualmente un sitio web.

Blogs: aada perfiles personales, vnculos a redes


sociales y utilice retroaccesos para hacer
referencias entre blogs. Cambie el aspecto del blog
con diferentes estilos visuales predefinidos (o use
los suyos propios). Utilice los grupos de editor
para publicar artculos de varios autores (consulte
la pg. 209).

Sistema de gestin de contenido (CMS): permite


que los proveedores de contenido agreguen y
actualicen el contenido web en cualquier lugar, sin
WebPlus y sin la necesidad de volver a publicar el
sitio.

Foro: fomente debates animados basados en hilos


en una ventana de tamao completo. Cree varios
foros y adminstrelos independientemente (modere
discusiones y configure el acceso de inicio de
sesin de los usuarios).

Contador de visitas: aada un contador que


muestra el nmero de visitas en la pgina actual.

Bienvenido

Novedades: para avisos de novedades simples


como actualizaciones del sitio web o prximas
fechas de reuniones del club.

Encuestas: aada una encuesta en lnea para


conocer las opiniones del visitante web.

Reserva de recursos: use la reserva de recursos


basada en calendario para gestionar las reservas de
alojamiento, instalaciones de conferencia y
reuniones, pistas deportivas, etc.

Cuadro de mensajes: aada una ventana de


conversacin activa al sitio web.

Listas de usuarios: proporcione control de acceso


al sitio o a la pgina mediante la gestin grupos de
usuarios por zonas (p. ej., personal). Los visitantes
web pueden registrarse por s mismos mediante el
inicio de sesin de usuarios del sitio (con la
activacin de correo electrnico opcional).

Marcos de documentos activos


Los hipervnculos pueden abrir una pgina en un marco
de documento en otra pgina. Establezca una URL
absoluta para un desplazamiento entre marcos ms
preciso.

Google Maps
Inserte un Google Map directamente en las
"direcciones" de su pgina web. Aada sus propios
marcadores mltiples para sealar varias ubicaciones
como oficinas, almacenes, lugares de inters y eventos.

Genere ingresos con Google Adsense


Aada espacios publicitarios basados en Google en su
sitio web, mientras Google le paga 24/7!

Fuentes RSS: aada fuentes de terceros (o cree la


suya propia)

Bienvenido

Mantenga a sus visitantes web actualizados con las


ltimos noticias de sus sitios web favoritos (BBC News,
CNN, Reuters, FTSE, NASDAQ) con la Herramienta
Lector RSS. Tambin puede convertirse usted mismo
en un delimitador de noticias creando su propia fuente
RSS directamente en su pgina; la Herramienta
Fuente RSS establece fuentes, titulares, resmenes y
vnculos de direcciones URL.

Herramientas de gestin del sitios


Gestione todas las propiedades de la pgina/pgina
maestra, recursos, fuentes, texto, hipervnculos y
delimitadores, todo desde el Administrador de sitios de
WebPlus. Gestione eficazmente una seleccin de
pginas web, cada pgina de forma individual o todas
las pginas. Comprobador del sitio: detecta problemas
de navegacin del sitio, de formato de texto y de
formularios/comercio electrnico y lleve a cabo
correcciones automticas cuando sea posible.

Haga un seguimiento del uso del sitio en cualquier


sitio
Regstrese en Google Analytics para hacer un
seguimiento y monitorizacin exhaustivos de los datos
del visitante del sitio web. Analice los datos en lnea en
cualquier momento con grficos y mapas de fcil
interpretacin.

Imgenes

Importar imgenes
Importe formatos de archivo estndar de uso general,
incluidos todos los formatos RAW de cmaras digitales,
archivos de Photoshop, fotografas HD y metarchivos
Serif (para compartir grficos entre aplicaciones Serif).
Importe varias imgenes y pguelas una a una.

El poder de las imgenes con la barra multimedia


Ya no tendr ms importaciones de imgenes
repetitivas. Tenga a mano el contenido de fotografas en

10

Bienvenido

la barra multimedia: arrastre y suelte la barra


multimedia sobre las imgenes que desea sustituir.
Busque imgenes por su metadatos. Controle el tamao
y la alineacin de las imgenes en el marco.

Sensacionales galeras fotogrficas en lnea


Sorprenda a sus amigos, familiares y colegas con las
asombrosas galeras fotogrficas de SlideShowPro
(Flash), Flash y JavaScript. Los diferentes estilos de la
galera permiten desplazarse por las fotos mediante una
seleccin de miniaturas, adicin de miniaturas,
cuadrculas de foto o pilas de fotos. Aprovchese de la
funcin de cabecera (usando datos de EXIF) y cree y
gestione lbumes.

Rpidos y sencillos Cortes de imgenes


El Estudio de recorte de imgenes hace muy sencillo
el recorte de imgenes colocadas directamente en
WebPlus. Utilice pinceles para descartar fondos
uniformes (cielo, paredes, etc.) o para mantener objetos
de inters (personas, objetos, etc.).

Ajustes de imagen
Aplique ajustes (brillo, contraste, correccin de ojos
rojos y muchas otras cosas) o utilice Editar en
PhotoPlus, que accede al galardonado paquete de
edicin de fotografas de Serif (si est instalado).

PhotoLab para filtros de efectos y ajustes no


destructivos
El potente PhotoLab dispone de una impresionante
seleccin de ajustes editables y efectos creativos y
artsticos (lpiz, acuarela, leo y muchos ms). Utilice
las herramientas integradas Enderezar, Recortar, Ojos
rojos y Retoque de manchas para realizar retoques
fcilmente. Aplique filtros en reas seleccionadas de la
foto utilizando mscaras de pincel. Guarde
combinaciones de ajustes/efectos como favoritos para
utilizarlas en el futuro.

Bienvenido

11

Formato de metarchivos verstil


Importe y exporte metarchivos Serif (SMF), un
formato de imagen propietario con mejoras en el
formato de metarchivos de Windows (WMF). Mejores
definiciones de lnea, relleno y texto que lo hacen ideal
para compartir grficos entre aplicaciones Serif.

Elementos dinmicos emergentes


Cree su propia galera fotogrfica; muestre una versin
ms grande de una imagen al desplazarse por encima de
la miniatura.

Decorativos marcos de imgenes


Puede aplicar impresionantes marcos de imgenes
directamente de la pestaa Galera.

Multimedia

Vdeos de YouTube
Escoja sus vdeos favoritos de YouTube e inclyalos
en su pgina web.

Podcasts
Cree sus propias fuentes de podcast y difunda sus
propios episodios de audios y vdeo con frecuencia y
fcilmente. Los visitantes web pueden suscribirse con
los navegadores web ms populares con un clic a
Google Reader, My Yahoo! e iTunes de Apple.

Creatividad

Herramientas de dibujo
Disee grficos vectoriales impresionantes con las
herramientas de lpiz, pluma y lnea recta, y aada
finales de lneas, como flechas, diamantes y canillas.
Como alternativa, la gama de formas QuickShape
totalmente personalizable permite crear rpidamente
contornos para los diseos, mientras que las opciones
Convertir a curvas, Recortar a la forma y los dibujos
de curvas ofrecen flexibilidad completa para crear

12

Bienvenido

cualquier forma imaginable. Los sobres de


deformaciones de malla aaden perspectiva,
inclinacin y abombamiento a cualquier objeto.

Estilos listos para usar


Elija diversos efectos de filtros, brillos, sombras,
texturas y materiales en la pestaa Estilos. Personalice
los estilos predefinidos o guarde los suyos propios!

Transparencias
Aada transparencias a los fondos, marcos de texto,
tablas, formas y texto para lograr un aspecto realmente
profesional. Al igual que los rellenos de color, puede
aplicar transparencias slidas, de gradientes y de
mapa de bits, e incluso crear transparencias de mapas
de bits a partir de su propia coleccin de imgenes.

Inteligentes esquemas de color


Utilice el Diseador de esquemas de color para cambiar
los colores utilizados en un sitio web y todo mediante
un solo clic. Use esquemas preestablecidos o disee sus
propios esquemas de color personalizados usando las
propagaciones basadas en aceptadas teoras sobre el
color.

Nuevos efectos de filtro 2D/3D


Aada reflejos impresionantes de un objeto, ideal para
ttulos e imgenes de una pgina web. Desenfoque
cualquier objeto o frote ligeramente los bordes de un
color slido o del borde del gradiente alrededor de los
bordes del objeto (trazo con un nuevo relleno de
contorno que aplica relleno de gradiente desde el ancho
del contorno interior hasta el exterior). Los efectos 3D
se amplan con control de transparencia con efectos de
cristal realistas de superficies no
reflectantes/reflectantes y varias luces de colores
independientes que consiguen impresionantes efectos
luminosos. Todos los efectos de filtro se pueden aplicar
en el modo de vista previa o al objeto en la pgina.
Utilice la nueva Herramienta Sombra para el control en
la pgina de sombras.

Bienvenido

13

3D instantneo con transformaciones en pantalla


Transforma objetos 3D in situ con la edicin 3D de una
barra de herramientas de contexto. Aplique efectos de
iluminacin de varios colores (con control direccional),
junto con perfiles de efectos de bisel y torno
personalizados para crear sus propios y exclusivos
contornos. La representacin acelerada por
hardware aumenta el rendimiento del redibujado
(depende del hardware).

Texto

Importar documentos de texto de Word y Open Office


Aada contenido de editores de texto a cualquier marco
de texto sin problemas. Para la importacin no es
necesario que la aplicacin est instalada localmente.
Utilice una serie de conversores de importacin para
optimizar la importacin del texto.

Texto artstico y de marco


Tenga control total sobre el texto con el control de texto
de estilo de autoedicin (DTP) de WebPlus. El texto
artstico se puede usar para aplicar a sus sitio web un
gran impacto; ideal para titular o aadir a un trazado
dibujado. Los marcos de texto HTML le permiten
seguir siendo compatible con HTML con el Ajuste
automtico o el ajuste manual de texto. Todo el texto
tiene funciones de edicin compatibles con los
principales procesadores de texto.

Marcos de texto
Componga texto de historias en marcos de texto y
coloque o redimensione el marco fcilmente para que se
adapte a sus necesidades. Los contornos de ajuste y
recorte independientes implican que tiene ms control
sobre dnde fluye el texto y cmo se muestra. Importe,
pegue y exporte texto en formato Unicode... Disee con
caracteres y fuentes especiales o en idioma extranjero.
Los trazados del texto tambin se benefician del ajuste
de texto inteligente.

14

Bienvenido

Fuentes
Sustituya las fuentes que faltan al abrir proyectos de
terceros. Vea el conjunto de fuentes que tiene instalado
en la pestaa Fuentes, incluidas las que se han asignado
ms recientemente al texto, las fuentes favoritas y las
que se consideran seguras para la web. Pase el ratn por
una de las fuentes de la lista para obtener una vista
previa de la fuente "in situ" del texto seleccionado.
Simplemente haga clic para aplicar la nueva fuente si le
gusta. Intercambie fcilmente todos los ejemplos
seleccionados de una fuente comn por otra fuente de
una sola vez.

Adjuntar y colocar formas e imgenes para el texto


Controle el posicionamiento de formas e imgenes
dentro de marcos de texto creativo o HTML (o en
relacin con ttulos de texto artstico).

Tablas y calendarios
Elija entre una serie de formatos predefinidos o disee
su propia tabla o calendario personalizados. Utilice la
cmoda barra de contexto Tabla para ordenar datos, dar
formato a las celdas y elegir una amplia gama de
funciones para realizar clculos de hojas de clculo
(utilice referencias de celdas absolutas). Los calendarios
se basan en tablas para mejorar la funcionalidad y
admiten actualizaciones de aos, eventos personales en
lnea y das de fiesta.

Buscar y reemplazar
Busque en el texto de la historia palabras y frases,
adems de atributos de texto, fuentes concretas, colores,
caracteres especiales (Unicode), expresiones regulares y
palabras en posiciones especficas de frases.

Combinacin de base de datos


Presente el contenido de la base de datos en su pgina
web de bases de datos (SDB) de Serif, Microsoft
Access (MDB), dBASE, datos de servidor de ODBC y
los formatos conocidos de base de datos, as como
Microsoft Excel, HTML y archivos de texto delimitado.

Bienvenido

15

Las listas de productos, listas de correo, inventarios y


cualquier informacin de base de datos pueden servir a
su audiencia web. Coloque el texto y las imgenes en
reas que se repiten, formularios de comercio
electrnico Aadir al carro de la compra o Comprar
ahora que se repiten o incluso fragmentos HTML.
Cree su propia base de datos fotogrfica (campos de
EXIF) para las combinaciones posteriores.
Publicacin web

Vista previa del trabajo


Pruebe la nueva pgina web o todo el sitio entero en
una serie de diferentes navegadores web instalados.

Publicar el sitio
Publique en una carpeta local o cargue directamente a
su ISP mediante a FTP; cargue cualquier pgina nueva
o modificada progresivamente Utilice la publicacin
rpida para cargar y ver un pgina actualmente
mostrada, ideal para probar pginas individuales a
medida que crea el sitio web.

16

Bienvenido

Nuevas caractersticas

Button Studio (consulte la pg. 102)


Cree sus propios botones personalizados para sus
barras de navegacin en Button Studio, un entorno
especfico para un diseo enfocado en el botn. Todas
las herramientas clave de WebPlus estn a mano para
editar el estado de cada botn (p. ej., Normal, Abajo,
Desplazar), junto con el control de escala del botn
inteligente. Tambin puede utilizar los botones como
objetos independientes o incluso convertir a una barra
de navegacin con un solo clic.

Nuevas barras de navegacin (consulte la pg. 83)


Tmese su tiempo para explorar las nuevas y
sorprendentes barras de navegacin inteligentes, que
incluyen distintos tipos: Bloque, Grfico, Voz,
Pestaa, Estndar y Tradicional. Los valores
preestablecidos de botones, separadores y fondo para la
barra y los mens emergentes se pueden personalizar o
crear desde cero en el nuevo Button Studio y Design
Studio, ofrecindole el control absoluto sobre el diseo.

Mens emergentes grficos (consulte la pg. 98)


Con la estructura del sitio (o personalizada), cree un
men de navegacin emergente que se muestre a
partir de cualquier objeto de WebPlus (botn, objeto de
la galera, QuickShape o imagen).

Paneles (consulte la pg. 132)


Cree paneles como contenedores para mostrar ms
informacin, sugerencias tiles, accesos directos,
barras de navegacin convertidas, formularios
Compra ahora de PayPal o cualquier objeto que
desee. Opcionalmente puede hacer flotar los paneles
que permanecen anclados en la ventana del navegador
para que se visualicen permanentemente (incluso
cuando se desplaza por la pgina). Con las acciones
puede conectar un panel oculto a cualquier objeto para

Bienvenido

17

que se muestre al desplazarse sobre ese objeto con el


botn o al hacer clic sobre l (ideal para botones,
objetos de galera, imgenes). Tambin puede utilizar
las acciones para mensajes de alertas emergentes o
imprimir mediante los botones ubicados en la pgina.

Mini Carts de PayPal (consulte la pg. 187)


Configure una ventana flotante de carro de la compra de
comercio electrnico que aparezca a medida que se
aadan artculos y que luego se minimiza para estar
siempre a mano. Es ideal para poder realizar un
seguimiento de las compras.

Google Map mejorados (consulte la pg. 120)


Identifique ubicaciones precisas con fotografas con
Google Street View, directamente desde cualquier
marcador del mapa donde se haga clic. Google Map
admiten ahora un nmero ilimitado de marcadores de
mapas.

Facilidad de uso

Indicacin al pasar el ratn de la seleccin (consulte


la pg. 285)
Para diseos de pgina web con varios objetos ms
complejos, los objetos "brillan" al pasar el ratn por
ellos para indicar que estn seleccionados.

Seleccin lazo (consulte la pg. 285)


La Herramienta lazo selecciona ms fcilmente
objetos especficos en diseos complicados.
Simplemente arrastre el ratn alrededor del objeto de
"destino" para incluirlo en la seleccin.

Objetos de pgina maestra independientes (consulte la


pg. 62)
Para disponer de ms libertad de diseo, promueva
objetos de pgina maestra en su pgina, para
separarlos y que estn disponibles para editarlos de
manera independiente. Como ayuda visual, los objetos

18

Bienvenido

de pgina maestra ahora se pueden distinguir de los


objetos de pgina gracias a diferentes colores del
cuadro delimitador; los objetos de varias pginas
maestras tambin se pueden distinguir el uno del otro.

Detalles del usuario empresarial por sitio (consulte la


pg. 271)
Cree impactantes agrupaciones de detalles del usuario
empresarial, como Conjuntos empresariales; aplique
un conjunto empresarial a cada sitio. Ideal para los
desarrolladores web de WebPlus que buscan
flexibilidad de diseo en mltiples sitios.

Variables definidas por el usuario (consulte la pg. 272)


Configure sus propias variables para actualizar
automticamente trminos comunes que se repiten en el
sitio web. Es ideal para actualizar nombres de
productos, precios, versiones de productos y variantes
de idiomas al mismo tiempo.

Ver objetos por pgina (Consulte la Ayuda de


WebPlus para obtener ms informacin)
Ideal para mostrar objetos en la pgina/pgina
maestra/rea de pegado, la pestaa Objetos tambin le
permite ubicar objetos, reordenar y adjuntar pginas
maestras en diseos complejos de pgina.

Creatividad

Gradientes, rellenos de mapa de bits y transparencia en


contornos (consulte la pg. 371)
Consiga ser an ms creativo con sus contornos de
objetos. Aplique transparencias y, rellenos lineales,
elpticos, cnicos y de mapa de bits alrededor de las
sombras y los marcos de texto para conseguir
atractivos diseos.

Impresionantes y modernos esquemas de color (consulte la


pg. 404)
Experimente con una impresionante seleccin de

Bienvenido

19

esquemas, que influyen en el humor, capaces transformar


el aspecto del sitio en un solo clic. Ideal para actualizar
sitios basados en las plantillas de diseo temticas. El
Diseador de esquemas de color tambin ofrece ahora
un Selector de color que le permite personalizar el
esquema basndose en un color del rea de trabajo
seleccionado.
Imgenes

Imgenes mediante cajas de luz (consulte la pg. 128)

Haga clic en las miniaturas de la imagen para mostrar


imgenes maximizadas en una caja de luz emergente,
que tambin es ideal para hacer flotar marcos de inicio de
sesin, formularios o pginas web para ahorrar un espacio
valioso. Todas las cajas de luz flotan sobre la pgina para
ofrecer un efecto imponente, con una caracterstica
opcional de presentacin de diapositivas, subtitulacin
y estilo.

Importar grficos vectoriales escalables (consulte la

pg. 323)
Aada logotipos, botones y otros grficos vectoriales a la
pgina usando el moderno formato para navegador SVG
(incluye SVG comprimidos).

Importe documentos de Microsoft Word 2010 (consulte la


pg. 235)
Para documentos de Word 2007, ahora puede importar
documentos de Word 2010 directamente a marcos de
texto.

Importe configuraciones de usuario personalizadas al

realizar la actualizacin
Va a actualizar la aplicacin desde WebPlus X4?
Conserve el contenido de su galera personalizada, los
estilos de objeto, las preferencias, los diccionarios de
usuario, los atajos del teclado, los perfiles PDF y
muchas ms cosas desde WebPlus X5.

20

Bienvenido

La Ayuda de WebPlus enumera las mejoras de


otros productos de menor importancia en versiones
anteriores. Consulte el tema Nuevas caractersticas
en la Ayuda para obtener ms informacin.

Instalacin
Requisitos del sistema
Mnimo:

PC basado en Windows con unidad de DVD y ratn

Sistema operativo Microsoft Windows XP (32 bits),


Windows Vista o Windows 7

512 MB RAM

336 MB de espacio de disco duro

Resolucin de monitor de 1024 x 768

Internet Explorer 5.5 (6.0 o superior para usar los


objetos inteligentes)

Al editar sitios grandes y/o complejos, se requerirn recursos de


disco y de memoria adicionales.
Opcional:

Impresora compatible con Windows

Cmara digital y/o escner compatible con TWAIN

Tarjeta grfica con aceleracin 3D, con DirectX 9 (o


superior) o compatibilidad con OpenGL

Bienvenido

.NET 2.0 para filtros de importacin de texto (Word


2007/2010 + OpenOffice) (instalado de forma
predeterminada)

Se necesita una cuenta y conexin a Internet para la


publicacin web y el acceso a recursos en lnea

21

Instalacin por primera vez


Para instalar WebPlus, simplemente inserte el DVD del programa
WebPlus X5 en la unidad de DVD. La funcin de ejecucin
automtica iniciar automticamente el proceso de instalacin.
Simplemente conteste a las preguntas de la pantalla para instalar
el programa.

Reinstalacin
Para reinstalar el software o cambiar la instalacin ms adelante,
seleccione Configuracin/Panel de control en el men Inicio de
Windows y despus haga clic en el icono Agregar o quitar
programas. Asegrese de que el DVD del programa WebPlus X5
est insertado en la unidad de DVD, haga clic en el botn
Instalar y despus siga las instrucciones en pantalla.

22

Bienvenido

Introduccin

24

Introduccin

Introduccin

25

Asistente para inicio


Al iniciar el programa, el Asistente para inicio se muestra y ofrece
diferentes rutas para WebPlus:

Las opciones son descriptivas, y la creacin del sitio se puede


hacer desde cero o a partir de una plantilla de diseo suministrada.
Los sitios guardados anteriormente se pueden abrir o las pginas
web que no sean de WebPlus se pueden importar al sitio desde un
archivo o una URL.

Iniciar nuevo sitio, para crear un nuevo sitio desde cero.

Utilizar plantilla de diseo, para crear un sitio


instantneo a partir de una plantilla prediseada.

Ms, para obtener acceso a una variedad de recursos


libres y plantillas de diseo (para comprar).

26

Introduccin

Abrir, para acceder a los ltimos sitios abiertos.


Desplcese sobre cada entrada para obtener una vista
previa rpida.

rea Aprender, para acceder a tutoriales, informacin


de asistencia, etc.

Use el men desplegable Elegir un rea de trabajo para


seleccionar el aspecto del rea de trabajo, es decir, la posicin de
las pestaas de Studio, el tamao de las pestaas y el estado de
mostrar u ocultar pestaas).
Cuando haga clic en diferentes perfiles en el men, en
el rea de trabajo se ver una vista previa de cada
diseo de pestaa sucesivamente.
El Asistente para inicio se muestra de manera predeterminada al
iniciar WebPlus. Puede desactivarlo mediante la opcin No volver
a mostrar este asistente en la pantalla Asistente para inicio o
activarlo de nuevo mediante la casilla Usar Asistente para el
inicio en Herramientas>Opciones... (use la opcin de men
Opciones>General).

Introduccin

27

Creacin de un sitio con una plantilla


de diseo
WebPlus viene completo con una amplia gama de plantillas de
diseo categorizadas que le permiten crear ms rpido todo tipo de
sitios web.
Cada plantilla proporciona:

Diseo complementario: diseo profesional con alto


impacto visual.

Esquemas: elija un esquema de color para aplicar un


aspecto especfico.

Seleccin de pginas: seleccione alguna o todas las


pginas de la plantilla (p. ej., Inicio, Productos, Acerca
de nosotros, etc.) para basar su nuevo sitio.

Hay dos tipos de plantillas de diseo: diseo de temas, donde


puede seleccionar sus propias imgenes, y plantillas Pro listas
para usar que ya estn pobladas con imgenes.

28

Introduccin

Diseo de temas
Proporcionan una
serie de temas (p.
ej., garabato) en
los que puede
basar el sitio;
obtendr
marcadores de
posicin de
imagen en lugar
de imgenes
reales. Aada sus
propias imgenes
a marcadores de
posicin y
personalice el
texto de marcador
de posicin; a
continuacin,
publique.
Plantillas Pro
listas para usar
Son plantillas
categorizadas que
contienen
imgenes sin
derechos de autor
que pueden
adoptar para
completar
rpidamente su
sitio web
completo. Solo
necesita
personalizar el
texto de marcador
de posicin y, a
continuacin,
publicar.

Introduccin

29

Para crear un sitio con una plantilla de diseo:


1.

Arranque WebPlus, o elija el Asistente para inicio del


men Archivo para mostrar el Asistente para inicio.

2.

Seleccione Utilizar plantilla de diseo.

3.

En el cuadro de dilogo, seleccione un diseo de tema o


un diseo de plantilla Pro del panel principal.

Diseos de temas

Plantillas de diseo Pro

30

Introduccin

Las plantillas Pro se agrupan en categoras basadas en el tema;


use la barra de desplazamiento o contraiga una categora para
mostrar ms opciones (haga clic en el botn , situado junto
al nombre de la categora). El panel derecho se actualiza para
mostrar las miniaturas de las pginas disponibles de la
plantilla.

4. En el panel derecho, decida qu


pginas desea que formen parte del
sitio. Active o desmarque debajo
de cada pgina para seleccionar, o
haga clic en Seleccionar todo para
seleccionar todas las pginas (haga
clic en Anular toda la seleccin
para borrar la seleccin actual).
5. Seleccione un Esquema de color
de la lista desplegable en la parte
superior del cuadro de dilogo (los
tres primeros esquemas estn
especficamente diseados para la
plantilla elegida). Las miniaturas se
actualizan para reflejar el aspecto
de la nueva pgina. Si desea ver
ms de cerca, use los botones
Acercar/Alejar o el control
deslizante de zoom en la parte
inferior del cuadro de dilogo.

6. Haga clic en Abrir.

Introduccin

31

El sitio se abre en la primera pgina (Inicio), con la pestaa Sitio


de Studio a la derecha, que muestra las distintas pginas que
comprenden el sitio en el rbol de estructura del sitio.

Notas
Las categoras de las plantillas, aparte de las plantillas
Pro de WebPlus X5, le permiten obtener acceso a las
dems plantillas que se pueden adquirir de Serif.
Dado que cada plantilla tiene un esquema de color,
puede intercambiar el esquema subyacente para
cambiar los colores del sitio en cualquier momento.
Puede guardar cualquier sitio de WebPlus como un
archivo de plantilla (*.wpx) que se usar como base
para otros sitios. Consulte Cmo guardar plantillas
propias en la Ayuda de WebPlus.

Creacin de un sitio desde cero


Si bien las plantillas de diseo pueden simplificar las elecciones
de diseo, es igual de fcil empezar desde cero con un sitio nuevo
en blanco.
Para iniciar un nuevo sitio desde cero con el Asistente
para inicio:

Iniciar WebPlus.
- o bien Nuevo sitio en la barra de
Haga clic en
herramientas Estndar.

Seleccione Crear>Iniciar sitio nuevo.

32

Introduccin

El nuevo sitio se abre con una pgina en blanco, utilizando las


propiedades de pgina predeterminadas.
Si hace clic en
Cancelar, en el Asistente para
inicio, obtendr el mismo resultado.
Para iniciar un nuevo sitio durante la sesin de
WebPlus:

Seleccione Nuevo del men Archivo.

Para ayudarle a crear rpidamente un sitio desde cero, WebPlus


cuenta con la Barra QuickBuilder. La pestaa ofrece los objetos y
las caractersticas que ms se suelen utilizar y que puede introducir
en la pgina web con el mtodo de arrastrar y soltar, lo que evita el
tener que entender desde un principio la gama de barras de
herramientas de WebPlus.

Apertura de un sitio existente


Puede abrir un sitio existente de WebPlus en el Asistente para
inicio, mediante la barra de herramientas Estndar o mediante el
men Archivo. Tambin puede importar pginas web de sitios
web HTML existentes mediante el men Archivo. (Consulte la
Ayuda de WebPlus para obtener ms informacin.)
Para abrir un sitio existente de WebPlus (Asistente para
inicio):
1.

En el Asistente para inicio, revise los sitios en la seccin


Abrir. El ltimo sitio que se abri se mostrar en la parte
superior de la lista. Para consultar una vista previa en
miniatura de cualquier sitio antes de abrirlo, desplcese
por el nombre en la lista.

2.

Haga clic en el nombre del archivo para abrirlo.

Introduccin

33

Si no se ha abierto el sitio recientemente, haga clic


en Examinar

para desplazarse hasta l.

Para abrir sitios existentes de WebPlus (durante la


sesin de WebPlus):
Abrir en la barra de herramientas

1.

Haga clic en
Estndar.

2.

En el cuadro de dilogo Abrir, seleccione la carpeta y el


nombre de archivo. Para seleccionar varios sitios, pulse
Mays y haga clic para seleccionar varios archivos
contiguos o pulse Ctrl y haga clic para seleccionar
archivos distantes entre s.

3.

Haga clic en el botn Abrir.

Para abrir el sitio mediante el mtodo de arrastrar y


soltar:

En el Explorador de Windows, arrastre y suelte la


miniatura de vista previa del sitio en cualquier parte del
rea de trabajo de WebPlus.

Para volver a la versin guardada de un sitio abierto:

Seleccione Revertir del men Archivo.

Sustitucin de fuente
WebPlus admite la sustitucin de fuentes automtica cuando se
abre un sitio de WebPlus que tenga fuentes que no estn
almacenadas en el equipo. El cuadro de dilogo que se muestra
tambin permite reemplazar manualmente una fuente que falta si es
necesario. Consulte la Ayuda de WebPlus para obtener ms
informacin.

34

Introduccin

Trabajo con ms de un sitio


Si tiene varios sitios web abiertos al mismo tiempo, puede saltar de
uno a otro fcilmente de diferentes formas.
Haga clic en una pestaa
Ventana en la parte superior del
rea de trabajo para activarla (p.
ej., w456.wpp).

Alternativamente, puede
seleccionar el nombre de un sitio
que est abierto actualmente en
el men Ventana. Los sitios web
sin guardar se indican con un
asterisco; el sitio actualmente
activo se muestra con una marca
de verificacin. En el ejemplo
contiguo, el sitio w456.wpp est
activo y no se ha guardado.

Cmo guardar el sitio


Para guardar el trabajo:

Haga clic en
Estndar.

Para guardar los cambios con un nombre diferente,


seleccione Guardar como en el men Archivo.

Guardar en la barra de herramientas

Un sitio sin guardar incluir un asterisco despus del


nombre en cualquiera de las pestaas de la ventana
o en el men Ventana.

Configuracin de sitios y
pginas

36

Configuracin de sitios y pginas

Configuracin de sitios y pginas

37

Introduccin a la estructura del sitio y


a la navegacin
A diferencia de una publicacin impresa, un sitio web no depende
de una secuencia lineal de la pgina. Para disear un sitio, tiene
ms sentido pensar en el sitio en trminos espaciales, con una
estructura similar a la de un museo que exploran personas. En
general, puede asumir que los visitantes entrarn a travs de la
puerta principal (Pgina principal); pero hacia dnde se dirijan
despus depender de los vnculos que haya proporcionado. Estos
caminos de navegacin son como los pasillos que conectan las
distintas salas del museo. Usted decide, como arquitecto, si desea
desarrollar una organizacin prctica de pginas y vnculos para
que los visitantes puedan encontrar su camino fcilmente, sin
perderse.
En WebPlus, puede usar el rbol de estructura del sitio para
proyectar visualmente la estructura de su sitio y despus aadir
barras de navegacin, que se adaptarn de forma dinmica a la
estructura que ha definido.

Estructura del sitio


A diferencia del museo de nuestra analoga, la estructura de un
sitio web no tiene nada que ver con el diseo fsico o con el lugar
donde se almacenan las pginas. Por el contrario, se trata de un
mtodo lgico de organizar el contenido en el sitio, de modo que
sea ms fcil para los visitantes desplazarse por l. Uno de los
principios de ordenacin ms tiles, que WebPlus respalda
completamente, es una estructura de rbol invertido que empieza
por la pgina principal y se va ramificando hacia las dems
pginas. Para el visitante que navega en el sitio, esta organizacin
muestra el contenido de una forma familiar, jerrquica,
estructurada en secciones y niveles.

Una seccin es una categora de contenido, por ejemplo,


Galera, Productos o Contacto. Las distintas
secciones principales se muestran normalmente en la

38

Configuracin de sitios y pginas

pgina principal del sitio en una barra de navegacin.


Idealmente, cada pgina del sitio pertenece a una seccin
concreta. A menos que solo haya una pgina en una
seccin determinada, la seccin tiene su propia pgina
principal, que normalmente sirve como men para las
pginas secundarias.

El nivel es el nmero de pasos (es decir, saltos) que


separan una pgina dada de la pgina principal. La
pgina principal residir siempre en el nivel 1,
normalmente junto con pginas de men de la seccin
principal. Esto permite que las barras de navegacin
funcionen fcil y automticamente. Las pginas un paso
por debajo de las pginas de men de seccin residen
en el nivel 2 y suelen considerarse pginas secundarias
de la pgina principal. Por ejemplo, una pgina
principal de Productos puede tener dos pginas
secundarias denominadas Producto1 y Producto2.

En WebPlus, el rbol de estructura del sitio (en la pestaa Sitio)


proporciona una ayuda visual que permite organizar el contenido
en el sitio en secciones y niveles. A continuacin se muestra la
misma estructura como aparecera en el rbol de estructura del sitio
de WebPlus:

Configuracin de sitios y pginas

39

El rbol de estructura del sitio facilita la visualizacin de las


relaciones entre las pginas y disea el sitio de forma que tenga
sentido para el contenido que ofrece. Por supuesto, un sitio web es
realmente una red interconectada de pginas y la estructura de
rbol no evita que instale vnculos entre dos pginas. Pero si
muestra los caminos principales dentro del sitio: arriba, abajo y
laterales. El diseo lgico de secciones/niveles facilita la
navegacin por el sitio y WebPlus simplifica la creacin de barras
de navegacin que reflejan la estructura del sitio y guan a los
visitantes en dichos caminos principales.
A tal fin, WebPlus tambin admite pginas HTML y vnculos
fuera del sitio que se pueden insertar en la estructura del sitio
como cualquier otra pgina. Los iconos de pgina para ambos
tienen un diseo ligeramente diferente del de una pgina web
estndar para indicar que se basa solo en cdigo HTML (Consulte
la Ayuda de WebPlus para obtener ms informacin) o que seala
a una ubicacin fuera de sitio web.

Navegacin
En WebPlus, aadir desplazamiento entre sus pginas web es fcil
con barras de navegacin, cada una programada previamente para
comprender la estructura del sitio, facilitando el diseo de un sitio
cuya navegacin sea sencilla. Simplemente tiene que seleccionar
una de las barras de herramientas Objetos web y WebPlus hace el
resto.
Por ejemplo, aqu se incluye una barra de navegacin que hemos
seleccionado para el sitio mostrado en el rbol principal anterior.
Los botones proporcionan vnculos a la pgina principal y las
pginas de men de seccin (todas en el nivel 1) y mens
emergentes que enlazan a pginas secundarias (nivel 2 en este
caso).

40

Configuracin de sitios y pginas

Para obtener ms informacin, consulte Adicin de barras de


navegacin en la pg. 83.

Configuracin de las propiedades del


sitio
Las propiedades del sitio permiten que la configuracin realizada
se aplique en todo el sitio. Hablando en trminos generales, decida
la configuracin de las propiedades del sitio al planificar el sitio;
una vez definida, normalmente no necesita editar la configuracin
(aunque puede hacerlo en cualquier momento).
Algunas propiedades del sitio, como la configuracin de aspecto de
pgina y de optimizacin de motores de bsqueda, tambin se
reflejan en pginas individuales (mediante Propiedades de la
pgina; consulte la pg. 71). Esto le permite invalidar o
complementar las propiedades del sitio globales,
respectivamente, y aplicar la configuracin local a pginas
especficas.
Para ver o cambiar la configuracin de propiedades del
sitio:

Seleccione Propiedades del sitio en el men Archivo.


El cuadro de dilogo Propiedades del sitio aparecer, con
cada opcin de men mostrada reflejando un aspecto de
las propiedades del sitio.

Configuracin de sitios y pginas

Opcin de men

41

Propiedad

Pgina
Alineacin de la pgina predeterminada
(predeterminado) Permite establecer una alineacin horizontal
predeterminada de la pgina (Izquierda o
Centrado).
Tamao de pgina predeterminado
La configuracin de ancho y alto predeterminada
determina las dimensiones de nuevas pginas web
estndar o pginas maestras.
Aspecto de la pgina
Establece los colores de esquema o sin esquema en
todo el sitio para los hipervnculos, el color de
pgina y el color de fondo.
Nomenclatura de Extensin de archivo de pgina predeterminada
La extensin predeterminada para pginas
archivo
publicadas es .HTML. Algunos servidores web
requieren el uso de una extensin diferente.
Avisar de caracteres en maysculas en los
nombres de archivo
Al crear nuevas pginas, se avisar al usuario si se
utilizan caracteres en maysculas al crear el nombr
de archivo de la pgina.
Nombre de archivos de recursos
Controla el formato de los nombres de archivo de
recursos para permitir la carga correcta en ISP que
imponen restricciones de nombre del archivo.
Publicar

Direccin URL del sitio


Define la direccin URL completa. Esto es un
requisito para la optimizacin del motor de
bsqueda con los mapas del sitio o las fuentes
RSS.

42

Configuracin de sitios y pginas

Cuenta de servidor FTP


Establece la cuenta de servidor FTP
predeterminada utilizada para la publicacin
web.
Configuracin de cuenta de servidor FTP
Muestra la configuracin de la cuenta FTP
predeterminada.
Grficos

Opciones globales de exportacin de imagen


Aplican formato predeterminado, remuestreo,
nombres, optimizacin, texto como curvas y
ancho/alto mximo para las imgenes vinculadas

Salida HTML

Salida HTML y Configuracin


predeterminada de Id. de HTML
Controlan la salida de las pginas web
seleccionando diferentes mtodos de
codificacin y controlando los Id. de HTML
que se generan.
Cabecera de pgina
Aade los detalles de autor y los detalles de
copyright a encabezados de pgina de su sitio.

Caractersticas Objetos inteligentes


Invalida el blog, foro o colores CMS con colores
sin esquema seleccionados o colores de esquema
actual del sitio.
Caractersticas Objetos inteligentes
Aplica el esquema de color actual del sitio a los
objetos inteligentes como blogs, foros y CMS.
Caja de luz

Configuracin general
Establece la configuracin de cajas de luz en tod
el sitio. Se puede configurar el borde, el color de
borde, el color/opacidad del contenido y la
configuracin de visualizacin.

Configuracin de sitios y pginas

43

Configuracin de cabecera
Establece la fuente de cabecera, la posicin, el
tamao, el color/opacidad de la fuente y el
color de fondo del texto.
Configuracin de fondo
Establece el color y la opacidad del fondo.
Vista previa de caja de luz
Haga clic en Previsualizar caja de luz para
comprobar la configuracin de caja de luz que
acaba de crear.
Icono de favoritos

Mostrar un icono de favoritos...


Establece un archivo de icono (un grfico) para
el sitio que se mostrar cuando un visitante web
incluya su sitio web en los marcadores.

Buscar

Descriptores de motores de bsqueda


Incluye informacin descriptiva opcional y
palabras clave para su sitio.

Motor de bsqueda Mapas del sitio y robots


informa a los motores de bsqueda o a los
robots si pueden arrastrar, analizar e indexarlas
pginas web en su sitio. Un archivo del mapa
del sitio incluye las pginas web que se van a
indexar, mientras que una meta-etiqueta robots
(o un archivo robots.txt) controla las pginas
que se excluirn de la indexacin.
Resumen

Propiedades y estadsticas

Vea y cambie la informacin para el sitio actual.

44

Configuracin de sitios y pginas

Configuracin de tamao de pgina y


alineacin
Los valores predeterminados de propiedades del sitio para Ancho y
Alto determinan las dimensiones de cualquier pgina nueva o
pgina maestra. Un valor predeterminado de propiedades del sitio
para la alineacin (izquierda o centrado) determina cmo el
contenido de la pgina se alinea en un navegador.
Una de las primeras acciones que puede querer hacer, al crear un
nuevo sitio desde cero, es comprobar las dimensiones
predeterminadas y ajustarlas en caso de necesidad. Puede ajustar la
configuracin de dimensin en cualquier momento pero, como
norma general, realice los cambios antes de que haya avanzado
demasiado en la presentacin de elementos de pgina.
En general, utilice una valor de Ancho que se ajuste a un monitor
estndar (750 pxeles son generalmente seguros) y no obligue a los
usuarios a desplazarse horizontalmente.
Para la dimensin y la alineacin de la pgina, puede invalidar la
configuracin del sitio para una pgina determinada, como se
describe en Configuracin de las propiedades de pgina en la
pg. 71.
Para establecer la configuracin de dimensin de
pgina en todo el sitio:

En la opcin de men Pgina del cuadro de dilogo,


seleccione diferentes valores de Ancho y/o Alto para
aplicarlos a las pginas.

Tambin puede cambiar la configuracin de alineacin de la


pgina predeterminada como una propiedad del sitio.

Configuracin de sitios y pginas

45

Para establecer la configuracin de la alineacin de la


pgina en todo el sitio:

En la opcin de men Pgina del cuadro de dilogo,


seleccione "Izquierda" o "Centrado" en el men
desplegable Alineacin de la pgina predeterminada.

Configuracin de aspecto de la pgina


Mediante las propiedades del sitio se puede controlar globalmente
el color de hipervnculos, el color de pgina, el color de fondo y la
imagen de fondo. Esto significa que todas las pginas web que ha
creado adoptarn esa configuracin, aunque dispone de la opcin
de invalidar la configuracin de la pgina y del fondo por pgina.
Consulte Configuracin de las propiedades de pgina en la
pg. 1.
De forma predeterminada, los sitios basados en una plantilla o
creados desde cero utilizan colores de esquema para los colores de
los hipervnculos y de la pgina. Estos colores pertenecen al
esquema de color actual del sitio pero puede cambiar a otro
esquema o cambiar los colores individuales en cualquier momento.
Consulte Uso de esquemas de color en la pg. 404.
Para configurar los colores de hipervnculos, pginas y
fondos:
1.

En la opcin de men Pgina del cuadro de dilogo, en


la seccin Aspecto de la pgina, haga clic en la flecha
hacia abajo para seleccionar el color que desea cambiar.

2.

Seleccione un color distinto de la lista desplegable, que


muestre colores de esquema numerados y otros colores.
Seleccione Ms colores... para elegir de un cuadro de
dilogo Selector de color.

3.

Haga clic en Aceptar.

46

Configuracin de sitios y pginas

Para definir una imagen de fondo:


1.

En la seccin Aspecto de la pgina, haga clic en Imagen


de fondo

2.

Active Usar imagen de fondo, localice y seleccione la


imagen desde el cuadro de dilogo Importar imagen.
Haga clic en Abrir.

3.

Utilice Opciones de exportacin para decidir si


la imagen se convertir en la exportacin o se
conservar tal cual.

Si est activada, la opcin Se desplaza con la


pgina desplaza el fondo de la imagen
independientemente del contenido de la pgina en la
ventana del explorador; si est desactivada, el fondo
no puede desplazarse por el contenido de la pgina.

El men desplegable Repetir controla cmo se


repite su imagen en el fondo (Horizontal, Vertical o
En mosaico). La opcin Ninguno coloca slo una
imagen.

El men desplegable Posicin define la posicin de


la imagen (por ejemplo, Arriba centro). Para repetir
fondos de imgenes, la imagen se repite desde esta
posicin inicial. Tambin puede especificar una
posicin en Personalizado..., que define la posicin
de la imagen en relacin a su esquina superior
izquierda.

Haga clic en Aceptar.


Si usa un fondo de imagen con regiones
transparentes, el color de fondo sigue activo y se
ver a travs de l; en caso contrario, la imagen
cubrir el color de fondo.

Configuracin de sitios y pginas

47

Si hace que el color de la pgina sea transparente,


el fondo de la imagen aparece y hace que los
lmites de la pgina sean invisibles (el contenido
sigue restringido a las dimensiones de la pgina).
Para obtener ms informacin sobre otras pestaas de
configuracin, consulte la Ayuda de WebPlus.

Optimizacin del motor de bsqueda


La indexacin implica la coleccin de informacin automtica
sobre las pginas web en motores de bsqueda como Google,
Yahoo, etc. Al recopilar esta informacin en el motor de bsqueda,
los usuarios de motores de bsqueda pueden utilizar esta
informacin indexada para obtener resultados de bsqueda rpidos
y precisos del sitio que coincidan con los criterios de bsqueda
incorporados por el usuario.
De forma predeterminada, el contenido de cada pgina web
publicada (especialmente el texto de ttulo) se indexar. Sin
embargo, en un mundo de mil millones de pginas web en Internet
que se indexan constantemente, los desarrolladores web pueden
optimizar este proceso de indexacin para que las pginas de un
sitio aparezcan en las primeras posiciones de la bsqueda de
resultados de un usuario.
La optimizacin de pginas web para motores de bsqueda se
puede realizar de varias formas:

Titulacin de pginas: Se pueden crear ttulos de


pginas adems de los nombres de pgina. Esto permite
que los resultados de bsqueda apunten a las pginas con
un ttulo ms til en lugar de solo al nombre de pgina.
Por ejemplo, en resultados de bsqueda, una pgina
principal estadounidense de pjaros puede indicar
pgina principal de pjaros estadounidenses en vez

48

Configuracin de sitios y pginas

solo en principal seguida de la descripcin de la


pgina. Consulte Configuracin de pgina, ttulo y
nombres de archivo.

Etiquetas meta de descripcin y palabras clave: Para las


pginas de sitio y/o individuales, se puede aadir texto
descriptivo al sitio/pgina que se incluir en cualquier
resultado de bsqueda coincidente asociado al
sitio/pgina. Las palabras clave permiten una mejor
correspondencia entre el texto especificado de motores
de bsqueda (como puede especificar en Google) y las
palabras clave que ha asociado al sitio o pgina. Adems,
una meta-etiqueta robots tambin le permite
incluir/excluir el sitio o las pginas en la indexacin;
tambin se puede evitar examinar los hipervnculos a
otras pginas (buscando por araas).

Texto ALT de imagen: El texto alternativo, utilizado en


lugar de una imagen que no se puede mostrar, se puede
explotar por los robots de motores de bsqueda. Consulte
Configuracin de las opciones de exportacin de
imgenes.

Texto de ttulo de hipervnculo: El texto descriptivo de


acompaamiento (p. ej., consulte nuestra gama de
nuevos productos) que se muestra al pasar el ratn por
un destino de hipervnculo tambin puede explotarse por
los robots de motores de bsqueda. Consulte Adicin de
hipervnculos y delimitadores.

Robots: Las pginas (o carpetas) se pueden excluir de la


indexacin de motores de bsqueda utilizando un archivo
de robots. Esto funciona de forma equivalente a la metaetiqueta robots pero utiliza un archivo de texto
(robots.txt) para dar instrucciones a los robots o las
araas sobre lo que no se debe indexar. El archivo
simplemente enumera las referencias excluidas del sitio
de pgina/carpeta.

Configuracin de sitios y pginas

49

Mapas del sitio: El concepto contrario de robots; las


pginas se pueden incluir para ayudar y optimizar el
arrastre/la indexacin inteligente. Las referencias de
pginas de sitio se almacenan en un archivo dedicado del
mapa del sitio (sitemap.xml).

Tanto si utiliza meta etiquetas, robots o mapas del sitio de forma


independiente o en combinacin, WebPlus hace sencilla la
configuracin. Como esa configuracin se puede establecer o
modificar para todo el sitio (Propiedades del sitio; opcin de
men de motores de bsqueda) cualquier pgina de creacin
reciente adoptar la configuracin de motores de bsqueda del
sitio. Si cambia la configuracin del sitio, todas las pginas web se
actualizarn automticamente conforme a la nueva configuracin.
No obstante, puede anular la configuracin del sitio en una pgina
web especfica (Propiedades de la pgina; opcin de men de
motores de bsqueda) en cualquier momento. La anulacin de la
pgina significa que los cambios siguientes a la configuracin del
sitio se omitirn siempre para estas pginas.

Uso de ttulos, descripciones y etiquetas


Aunque es opcional, si desea aumentar la probabilidad de que su
sitio web "destaque" en los principales servicios de bsqueda web,
debe optimizar sus ttulos de pgina e introducir descripciones y
etiquetas apropiadas. Los servicios de bsqueda mantienen
catlogos de pginas web, a menudo compilados mediante el uso
de "buscadores" u otros programas que merodean por la Web
recopilando datos de los sitios y su contenido. Al incluir ttulos
descriptivos, descripciones y etiquetas, ayudar a estos motores a
procesar la informacin de su sitio. Puede introducir ttulos,
descripciones y etiquetas para el sitio en conjunto y/o para pginas
individuales. Por ejemplo, para un sitio ornitolgico sencillo puede
tener los detalles siguientes, reflejando el contenido del sitio o
pgina.

50

Configuracin de sitios y pginas

Propiedades
del sitio

Propiedades de la
pgina

Ttulo

N/D

Pjaros estadounidenses:
Galera de garcetas y de garzas

Descripcin

Este sitio web


exclusivo de
galera
fotogrfica
muestra la
belleza y la
diversidad de la
fauna avcola
norteamericana.

stas son las especies


ms grandes de pjaros
encontrados en los
pantanos de agua dulce,
lagunas costeras e
incluso a lo largo de las
costas.

Palabras
clave

Pjaros,
Amrica,
Audubon

Garceta de ganado, garza


azul, garza verde

Para introducir descriptores de motores de bsqueda:


1.

(Para el sitio) Seleccione Propiedades del sitio en el


men Archivo.
O bien:
(Para una pgina) Haga clic con el botn secundario en la
pgina en el rea de trabajo (o pestaa Sitio) y elija
Propiedades de la pgina... (o seleccione el elemento
del men Editar).

2.

Haga clic en la opcin de men Buscar del cuadro de


dilogo.

3.

En la ventana superior, escriba una breve descripcin de


su sitio. Aunque la descripcin puede tener cualquier
longitud, las primeras diez palabras aproximadamente
son las ms importantes.

4.

En la ventana siguiente, introduzca un nmero de


palabras clave (separadas por comas) que crea que

Configuracin de sitios y pginas

51

pueden clasificar bien su sitio/pgina. Pngase en el


lugar de un posible visitante. Qu palabras clave
introducira si est buscando exactamente lo que su sitio
o pgina ofrece?
5.

Defina un cdigo de idioma del men desplegable para


identificar el uso de idioma. Los motores de bsqueda de
Internet de la mayora de usuarios permitirn bsquedas
especficas de un idioma para pginas web, as que su
sitio se mostrar en los resultados de bsqueda segn la
configuracin del cdigo de idioma.

Exclusin de pginas de la indexacin (metaetiquetas robots)


Una meta-etiqueta robots se puede usar para controlar cmo los
robots de motores de bsqueda acceden al sitio o la pgina. El sitio
entero (y las pginas) se puede configurar para indexarse o no, para
seguir o no hipervnculos de pgina o cualquier otra combinacin.
La configuracin de todo el sitio se realiza activando Indexar
pginas en este sitio y Seguir vnculos desde las pginas o
mediante anulaciones con las propiedades de pgina especficas.
Para activar la generacin de meta-etiquetas robots:
1.

(Para el sitio) Seleccione Propiedades del sitio en el


men Archivo.
O bien:
(Para una pgina) Haga clic con el botn secundario en la
pgina en el rea de trabajo o pestaa Sitio, y elija
Propiedades de la pgina... (o seleccione el elemento
del men Editar).

2.

Seleccione la opcin de men de motor de bsqueda y


active la opcin Crear meta-etiquetas robots (para una
pgina que necesitar invalidar la configuracin en todo
el sitio).

3.

(Para el sitio) Use las dos subopciones para permitir o


evitar que los motores de bsqueda indexen el sitio

52

Configuracin de sitios y pginas

entero (active/desactive la opcin Indexar pginas en


este sitio) o para permitir o evitar la indexacin de todas
las pginas vinculadas desde una pgina indexada
(active/desactive la opcin Seguir vnculos desde las
pginas).
O bien:
(Para la pgina) Asegrese de que la opcin Invalidar
opciones del motor de bsqueda del sitio est activada
y, a continuacin, active Crear meta-etiquetas robots y
active/desactive las subopciones equivalentes para la
pgina concreta.

Exclusin de pginas de la indexacin


(archivo de robots)
El objetivo de este mtodo es el mismo que el uso de una metaetiqueta robots, pero en este caso se crea un archivo robots.txt y no
se incluye ninguna meta-etiqueta robots en las pginas web. El
archivo robots.txt se almacena en la carpeta raz del sitio web y se
puede ver en cualquier editor de texto para comprobar las pginas
y carpetas excluidas.
Para activar un archivo robots.txt:
1.

Seleccione Propiedades del sitio en el men Archivo.

2.

En la opcin de men de motores de bsqueda, active


Crear archivo de robots del motor de bsqueda.

3.

(Para el sitio) Para permitir o evitar que los motores de


bsqueda indexen el sitio entero (active/desactive la
opcin Indexar pginas en este sitio).
O bien:
(Para una pgina) Desde las propiedades de la pgina,
para evitar que los motores de bsqueda indexen la
pgina, asegrese de que la opcin Invalidar opciones
del motor de bsqueda del sitio est activada y, a
continuacin, desactive la opcin Indexar esta pgina.

Configuracin de sitios y pginas

53

Inclusin de pginas en la indexacin


Hasta ahora hemos considerado sobre todo los mtodos de
exclusin de pginas web de la indexacin. Sin estos controles, las
pginas web se indexarn descubriendo los hipervnculos de la
pgina y desplazndose sobre ellos, recopilando palabras clave,
descripciones y texto de la pgina para indexarse. No obstante, este
proceso puede no ser eficaz ya que puede haber un nmero
reducido de hipervnculos entre pginas presentes en su sitio. Por
tanto, un archivo del mapa del sitio de motores de bsqueda
(sitemap.xml) se puede crear para actuar como bsqueda local para
que los buscadores empiecen investigando su sitio. El archivo
enumera simplemente las pginas del sitio que haya decidido que
se pueden indexar. El archivo tambin indica a los motores de
bsqueda cuando se han modificado pginas, informa cuando el
motor de bsqueda debe comprobar la pgina y cmo se relacionan
las pginas importantes unas con otras.
Simplemente como el archivo de robots, la configuracin de las
propiedades del sitio y de la pgina crea el archivo del mapa del
sitio (que se publica con su sitio); el archivo se almacena en la
carpeta web raz (quizs junto a un archivo robots.txt).
Un requisito de usar mapas de sitio de motores de
bsqueda es la necesidad de declarar una URL
absoluta. Esto permite indexar la direccin URL
adecuada (p. ej., www.helloworld.com), lo que
permite vincular a los usuarios de motores de
bsqueda con su sitio a travs de los resultados de
bsqueda.
Para activar mapas de sitio de motores de bsqueda:
1.

Seleccione Propiedades del sitio en el men Archivo.

2.

En la opcin de men de motores de bsqueda, active la


opcin Crear el archivo del mapa del sitio del motor
de bsqueda.

54

Configuracin de sitios y pginas

3.

(Opcional) Cuando se activa la opcin anterior, se puede


cambiar el nombre del archivo predeterminado
sitemap.xml. Haga clic en el botn Cambiar... y
modifquelo en consecuencia.

4.

(Para el sitio) Para rellenar el archivo del mapa del sitio


con una lista de todas las pginas web del sitio (para la
pgina mejorada descubrimiento), la opcin Indexar
pginas en este sitio est activada. Desactive la opcin
para crear un archivo sitemap.xml vaco.
O bien:
(Para una pgina) Desde las propiedades de la pgina,
para aadir la pgina al archivo del mapa del sitio,
asegrese de que las opciones Invalidar opciones del
motor de bsqueda del sitio e Indexar esta pgina
estn activadas. Esto supone que el sitio en conjunto no
se ha mostrado en el archivo sitemap.xml.

5.

Active/desactive la configuracin del mapa del sitio, por


ejemplo:

Fecha y hora de la ltima modificacin de la pgina.

Frecuencia de cambio de pgina (defina el men


desplegable por horas, das, semanas, meses, aos o
nunca): Esto sugiere al motor de bsqueda con qu
frecuencia la pgina es probable que cambie. El
motor de bsqueda decidir con qu frecuencia
indexar la pgina en base a esta configuracin.

Grado de la prioridad de la pgina: 0,0 (el ms bajo)


a 1,0 (el ms alto). Establece la prioridad de la
pgina en relacin con las otras pginas web en las
que los motores de bsqueda las indexarn con ms
probabilidad. El valor predeterminado puede
definirse en las propiedades del sitio con
anulaciones de pginas especficas que establezcan
una prioridad mayor o menor que el valor
predeterminado.

Configuracin de sitios y pginas

55

Uso del Administrador de sitios


El Administrador de sitios de WebPlus ofrece una completa gama
de informacin de todo el sitio disponible desde un nico cuadro
de dilogo de mens. La herramienta le permite ver las
propiedades de la pgina/pgina maestra y seleccionar
herramientas de administracin para ver y editar hipervnculos,
recursos, textos, fuentes y mucho ms.
Entre las potentes funciones del Administrador de sitios se
incluyen:

La capacidad de controlar el mbito y de administrar una


pgina individual, una seleccin de pginas o todas las
pginas del sitio por igual.

Las columnas se pueden ordenar de modo ascendente o


descendente, con lo que se proporciona una forma rpida
de reorganizar la informacin.

Buscar y reemplazar. Si est disponible, esta es una


excelente manera de aplicar cambios de textos en todas
las pginas web a la vez.

Aunque la mayora de las herramientas de administracin ofrecen


ventajas en algn punto del desarrollo del sitio, la gestin de
recursos y texto, as como el uso del Comprobador de sitio,
resultan imprescindibles para comprobar el sitio justo antes de la
publicacin web.
Para iniciar el Administrador de sitios:

Haga clic en
Administrador de sitios en la lnea de
sugerencias, en la parte inferior del rea de trabajo (o en
la barra de herramientas de contexto Pginas).

Un resumen rpido indica lo que cada funcin de administracin


puede hacer.

56

Configuracin de sitios y pginas

Tipo de
administracin

Le permite

Propiedades de la
pgina/pgina
maestra

Incluir pginas en la navegacin, adjuntar


pginas maestras, definir la alineacin y el
tamao de las pginas, cambiar el nombre
de pginas, establecer un fondo, aadir
sonidos, optimizar las pginas para los
motores de bsqueda y aplicar
redirecciones, transiciones, o control de
acceso.

Propiedades de la
pgina HTML

Ver y editar nombres de pginas HTML,


nombres de archivos (y rutas), incluir
pginas en la navegacin (con control de
separador), abrir en marco.

Hipervnculo

Ver y modificar los hipervnculos, saltar a


hipervnculos en la pgina, buscar y
reemplazar vnculos de destino.

Delimitador

Ver y modificar la ubicacin y el nombre


del delimitador, incluir pginas en la
navegacin (con control de separador),
saltar a delimitadores.

Recurso

Ver imgenes, archivos multimedia,


archivos vinculados, recursos de cdigo
HTML, secuencias o applets en el sitio.
Saltar a cada recurso de la pgina,
intercambiar entre estados de imagen
vinculado/incrustado, sustituir o volver a
muestrear imgenes.

E-Comercio

Ver los objetos de comercio electrnico


en pginas de todo el sitio.

Texto

Ver y modificar texto (en WritePlus),


nombrar historias, cambiar el formato de

Configuracin de sitios y pginas

texto, aplicar estilos, convertir marcos


creativos y tablas a texto compatible con
HTML.
Fuente

Ver fuentes y su disponibilidad, saltar


fuentes en la pgina y sustituir fuentes.

Archivo

Mostrar la estructura del sitio con


nombres de archivo de pgina en lugar de
nombres de pgina. Aadir archivos al
sitio. Cambiar el nombre a archivos y
mover las ubicaciones de archivos.

Comprobador
de sitio

Mostrar los problemas habituales de


diseo detectados en el sitio.

Introduccin a las pginas y las


pginas maestras
Mirando pginas individuales desde un punto de vista de diseo,
cada pgina de WebPlus tiene una pgina principal y una
pgina maestra de fondo.

57

58

Configuracin de sitios y pginas

Las pginas maestras constituyen una forma flexible de


almacenar elementos de fondo que desea incluir en ms de una
pgina, como, por ejemplo, un logotipo, un fondo, un encabezado o
pie de pgina, un diseo de borde o una barra de navegacin. El
concepto clave aqu es que una pgina maestra especfica se
comparte normalmente por varias pginas, como se indica a
continuacin. Colocando un elemento de diseo en una pgina
maestra y, a continuacin, estableciendo que varias pginas usen la
misma pgina maestra, se asegura de que todas las pginas
incorporan ese elemento. Evidentemente, cada pgina puede tener
sus propios elementos.

La pestaa Sitio de Studio incluye una seccin superior Pginas


maestras que contiene sus pginas maestras y una seccin inferior
Estructura del sitio en la ventana Pginas que contiene sus pginas
estndar. Cada pgina mostrada en la ventana indica la pgina
maestra utilizada para esa pgina.
Para diseos de pgina ms variados en todo el sitio, puede crear
ms de una pgina maestra (consulte Adicin, eliminacin y
reorganizacin de pginas en la pg. 64). Una vez que tiene
varias pginas maestras, se pueden asociar a pginas distintas o
en combinacin en la misma pgina.

Configuracin de sitios y pginas

59

Asociacin de pginas maestras diferentes


De forma predeterminada, las pginas creadas en nuevos sitios
tienen una pgina maestra (maestra A) automticamente asociada.
No obstante, si desea usar otra pgina maestra, puede asociarla a la
pgina en lugar de la pgina maestra original.
Para asociar una pgina maestra diferente a una pgina:
1.

En la pestaa Sitio, haga clic con el botn secundario en


la pgina y seleccione Propiedades de la pgina...

2.

En la opcin de men Fondo del cuadro de dilogo,


desactive la pgina maestra original y, a continuacin,
active la pgina maestra que desee usar.

3.

Haga clic en Aceptar.

Para desvincular una pgina maestra:

Desactive la entrada en el cuadro de dilogo Propiedades


de la pgina (opcin de men Fondo).
La desactivacin de todas las pginas maestras
significa que la pgina usar el aspecto del sitio
(Propiedades del sitio).

Asociacin de varias pginas maestras


WebPlus le permite aplicar varias pginas maestras a la pgina web
seleccionada actualmente para diseos especficos de pgina ms
complejos. Esto tambin permite organizar el orden de pginas
maestras unas respecto a otras y en relacin con el contenido de la
pgina en s misma.
Por ejemplo, supongamos que dispone de dos diseos en dos
pginas maestras distintas: Maestra A y Maestra B. En
Propiedades de la pgina, puede colocar Maestra B, que contiene

60

Configuracin de sitios y pginas

el texto de IPSUM, delante de la pgina seleccionada, con Maestra


A utilizada como fondo de pgina.

Para asociar varias pginas maestras a una pgina web:


1.

En la pestaa Sitio, haga clic con el botn secundario en


la pgina y seleccione Propiedades de la pgina...

2.

En la opcin de men Fondo del cuadro de dilogo,


active varias pginas maestra.

3.

Haga clic en Aceptar. La pgina usar ahora elementos


de pgina de todas las pginas maestras.

Configuracin de sitios y pginas

61

En Estructura del sitio de la pestaa Sitio se muestra una pgina


web con un signo ms si se asocian varias pginas maestras (en
lugar de A, B, C, etc.).

El cuadro de dilogo anterior tambin


le permite controlar el orden en el que
el contenido de la pgina y de la pgina
maestra se muestra en la pgina. De
forma similar a las capas en un
programa de edicin, los objetos de la
entrada superior de la lista del cuadro
de dilogo se mostrarn delante de los
objetos de las pginas maestras
inferiores. Las pginas maestras
tambin se pueden reorganizar entre
ellas. Las pginas maestras aadidas
recientemente se aaden a la parte
inferior de la pila, de manera que se
mostrarn detrs del resto de
contenido.
En el ejemplo contiguo, Maestra B est
encima del resto de contenido.
Para cambiar el orden del contenido de la pgina y
pginas maestras:

Seleccione la entrada de la pgina en el cuadro de


dilogo Propiedades de la pgina (opcin de men
Fondo) y haga clic en el botn Arriba o Abajo.
O bien:

Mueva una pgina arrastrando el nombre a una nueva


posicin de la lista.
O bien:

62

Configuracin de sitios y pginas

En la pestaa Objetos, seleccione una pgina y, a


continuacin, reorganice las pginas maestras
arrastrndolas.

Edicin de objetos de la pgina maestra


Si est trabajando con pginas que tienen pginas maestras
asociadas, los objetos de pgina maestra contribuirn a su diseo
de pgina. Estos objetos se pueden editar fcil y rpidamente desde
la pgina usando una barra de control en el objeto seleccionado.

Para editar un objeto de pgina maestra:


1.

En la pgina web, seleccione el objeto de pgina maestra


para mostrar la barra de control.

2.

Editar en pgina maestra. La pgina


Haga clic en
maestra aparece para poder ser editada.

Habr veces en las que quiera hacer que un objeto de la pgina


maestra usado en una pgina sea independiente de su pgina
maestra. Estos objetos se pueden hacer editables promovindolos
desde la pgina maestra a la pgina web, de modo que el objeto
original de la pgina maestra sea sustituido por una copia que s se
pueda editar libremente.
Para promover un objeto de pgina maestra:
1.

En la pgina web, seleccione el objeto de pgina maestra


para mostrar la barra de control debajo del objeto.

Configuracin de sitios y pginas

2.

63

Haga clic en
Promover desde pgina maestra. As
se hace una copia del objeto original, que podr ser
entonces editado independientemente, sin afectar a la
pgina maestra.
Todas las dems pginas que utilicen la pgina
maestra permanecern inalteradas.

Si cambia de opinin en algn momento, puede volver a asociar el


objeto a la pgina maestra, dejando la pgina como estaba
originalmente.
Para volver a asociar un objeto:
1.

En la pgina estndar, seleccione el objeto


promocionado, para mostrar la barra de control debajo
del objeto.

2.

Haga clic en

Revertir a pgina maestra.

64

Configuracin de sitios y pginas

Adicin, eliminacin y reorganizacin


de pginas
Con la pestaa Sitio de
Studio, podr:

Aadir pginas estndar o


pginas HTML.
Eliminar pginas.
Aadir una o varias
pginas maestras.

Utilizar el mtodo de

arrastrar y soltar para


reorganizar pginas dentro de
la estructura del sitio.

Aadir pginas de

plantillas de diseo instaladas.

Aadir vnculos fuera del


sitio.

Establecer una pgina para


que sea la pgina principal.
Utilice la ventana superior Pginas maestras de la pestaa Sitio
para acceder a las pginas maestras y la ventana Pginas (rbol de
estructura del sitio central de la pestaa) para acceder a las pginas.

Configuracin de sitios y pginas

65

Adicin de pginas
Para aadir una nueva pgina en blanco:
1.

En la ventana Pginas (rbol de estructura del sitio) de la


pestaa Sitio de Studio, seleccione la pgina tras la cual
desea aadir la nueva pgina.

2.

Haga clic en la flecha hacia abajo en el botn Aadir


, que est justo sobre la ventana Pginas de la
pestaa Sitio. En el men desplegable, seleccione Nueva
pgina en blanco.

3.

En el cuadro de dilogo Propiedades de pgina,


especifique las opciones para la nueva pgina a partir de
cada una de las opciones de men (consulte
Configuracin de las propiedades de pgina en la
pg. 71).

4.

Haga clic en Aceptar.

Una nueva pgina aparecer en la ubicacin especificada en la


estructura del sitio. La pgina utiliza las Propiedades del sitio
(p. 40) para las dimensiones. Siempre puede mover la pgina a una
posicin o nivel diferente o cambiar a una pgina maestra diferente
(consulte Reorganizacin de pginas o Asignacin de pginas
maestras en la pg. 59 y 59).
Las nuevas pginas creadas usarn las propiedades
del sitio actualmente establecidas (men Archivo),
como el tamao y la alineacin de pgina
predeterminados, a menos que haya sobrescrito las
propiedades del sitio en el cuadro de dilogo
Propiedades de la pgina.

66

Configuracin de sitios y pginas

La pgina en blanco tambin se puede basar en


una pgina maestra, por ejemplo, si el sitio se cre a
partir de una plantilla y, por tanto, incluye el
contenido de la pgina definido por la pgina
maestra de la pgina en blanco.

Adicin de pginas maestras


Para aadir una nueva pgina maestra:
1.

En la pestaa Sitio de Studio, haga clic en el botn


Pginas maestras para expandir la ventana Pgina
maestra.

2.

Haga clic en el botn Aadir


ventana Pginas maestras.

, situado sobre la

Una nueva pgina maestra aparecer en la ventana Pginas


maestras de la pestaa Sitio.
Para reasignar las pginas a determinadas pginas
maestras, consulte Introduccin a las pginas y las
pginas maestras en la pg. 57.

Eliminacin de pginas
Para eliminar una pgina o una pgina maestra:
1.

En la pestaa Sitio de Studio, seleccione la pgina (o la


pgina maestra) que desee eliminar y haga clic en su
entrada.

2.

Haga clic en el botn Quitar


, situado sobre la
ventana adecuada para eliminar la pgina.

Configuracin de sitios y pginas

67

Cuando se elimina una pgina, tiene la opcin de


quitar cualquier vnculo del sitio que apunte a esta
o de redireccionar los hipervnculos a otra pgina
especificada (los hipervnculos a delimitadores en la
pgina eliminada se pueden eliminar de forma
opcional).

Adicin de pginas HTML


Las pginas HTML se pueden aadir a cualquier estructura del
sitio de la pestaa Sitio. Dichas pginas se pueden incluir en la
navegacin como las pginas estndar.
Para aadir una pgina HTML:
1.

En la ventana Pginas (rbol de estructura del sitio) de la


pestaa Sitio de Studio, seleccione la pgina tras la cual
desea aadir la nueva pgina.

2.

Haga clic en la flecha hacia abajo del botn Aadir


, situado justo encima de la ventana Pginas. En
el men desplegable, seleccione Nueva pgina HTML

Una nueva pgina HTML se aade a la pestaa Sitio. Consulte


Creacin de pginas HTML (p. 76) para obtener ms
informacin.

Reorganizacin de pginas
Adems de usar el rbol de estructura del sitio para aadir o
eliminar pginas, puede utilizarlo para reorganizar pginas cuando
sea necesario. Gracias a la estructura de elementos
primarios/secundarios la reorganizacin de pginas es un proceso
intuitivo tanto si usa el mtodo de arrastras y soltar como si emplea
los botones adecuados. Puede mover una pgina:

A otra posicin secuencial diferente (hacia arriba o hacia


abajo) en el mismo nivel de la estructura.

68

Configuracin de sitios y pginas

A un nivel superior (elemento principal).

A un nivel inferior (elemento secundario).

Para mover una pgina:


1.

Vaya a la pestaa Sitio de Studio.

2.

Haga clic para seleccionar la pgina en el rbol de


estructura del sitio.

3.

(Mediante el mtodo de arrastrar y soltar) Arrastre la


entrada de la pgina hacia arriba o hacia abajo y
colquela en una nueva posicin en el rbol. Observe la
informacin del cursor sobre la nueva posicin con
respecto a la de la pgina que est justo debajo del
cursor:
mueve la pgina al mismo nivel que la pgina de
destino resaltada y a continuacin de esta.
convierte la pgina en un elemento secundario de
la pgina que est debajo de la pgina de destino
resaltada.

Adicin de pginas de plantillas


Aunque aadir pginas estndar le permite iniciar el diseo de
pgina desde cero, la creacin de pginas puede ser ms sencilla si
adopta pginas listas para usar de las plantillas WebPlus
instaladas. Para mantener el diseo original de la pgina, cualquier
pgina maestra asociada con la pgina agregada se importar con
la pgina.
Para aadir una nueva pgina a partir de una plantilla:
1.

En la ventana Pginas (rbol de estructura del sitio) de la


pestaa Sitio de Studio, seleccione la pgina tras la cual
desea aadir la nueva pgina.

Configuracin de sitios y pginas

2.

69

Haga clic en la flecha hacia abajo del botn Aadir


, situado justo encima de la ventana Pginas. En
el men desplegable seleccione Nueva pgina de
plantilla....

3.

En el cuadro de dilogo Aadir nueva pgina de la


plantilla seleccione una plantilla del panel izquierdo y
active la pgina que desea aadir (active ms pginas
para que se incluyan si es necesario).

4.

WebPlus le permite controlar si una pgina maestra


asociada se copia con la pgina. Seleccione del men
desplegable de la parte superior izquierda una de las
siguientes opciones:

5.

Copiar pgina maestra. Para copiar siempre la


pgina maestra en el sitio.

Comparar y copiar pgina maestra. Comprueba


si la pgina maestra ya existe en el sitio y, si no est
presente, la copia a continuacin.

No hay pgina maestra. La pgina maestra de la


pgina nunca se copia en el sitio.

Haga clic en el botn Abrir. Las pginas se aaden a la


pestaa Sitio.

Adicin de vnculos fuera del sitio


Tambin puede aadir un vnculo fuera de sitio a la estructura del
sitio. Normalmente, puede ser una pgina o un recurso
independiente del sitio que desee incluir en la estructura de
navegacin del sitio. El vnculo fuera del sitio aparecer en el rbol
de estructura del sitio y en las barras de navegacin, para que
pueda manipularlo como si se tratara de una pgina en su sitio.

70

Configuracin de sitios y pginas

Para aadir un vnculo fuera del sitio:


1.

En la ventana Pginas (rbol de estructura del sitio) de la


pestaa Sitio de Studio, seleccione la pgina tras la cual
desea aadir la nueva pgina.

2.

Haga clic en la flecha hacia abajo del botn Aadir


, situado justo encima de la ventana Pginas. En
el men desplegable, seleccione Nuevo vnculo fuera
del sitio....

3.

En el cuadro de dilogo, escriba un Nombre del men


para identificar el vnculo fuera del sitio en el rbol de
estructura del sitio (el equivalente del nombre de la
pgina).

4.

Haga clic para seleccionar el tipo de destino del vnculo e


introduzca el destino del hipervnculo fuera del sitio
especfico (consulte Seleccin de un hipervnculo de
destino en la pg. 1) y la ventana en la que desea que
aparezca el destino. Mantenga activada la opcin Incluir
en la navegacin si el vnculo debe aparecer en la
navegacin de todo el sitio.

5.

Active las opciones Antes o Despus para aplicar


lneas separadoras horizontales sobre/debajo de la
pgina como un elemento de submen en las barras
de navegacin.

Aada una descripcin para aadir informacin de


texto adicional relacionada con la pgina en el
elemento del submen de la barra.

Haga clic en Aceptar.

Configuracin de sitios y pginas

71

Configuracin de la pgina principal


Para hacer que una pgina web sea la pgina principal:

Haga clic con el botn secundario del ratn en una


pgina estndar en la pestaa Sitio y, a continuacin,
seleccione Establecer como pgina principal

Configuracin de las propiedades de


pgina
Su sitio de WebPlus tiene su propio marco general, que consta del
sitio en s mismo; una o ms pginas maestras; y de varias
pginas individuales. Cada aspecto del marco tiene diferentes
valores de propiedades que contribuyen al aspecto y el
comportamiento del sitio cuando se publica. Tanto si empieza con
una plantilla de WebPlus o desde cero, puede elegir si ceirse a la
configuracin de propiedad predeterminada o modificarla segn
sus necesidades.
Las propiedades de la pgina de pginas individuales se pueden ver
mediante la pestaa Sitio, haciendo clic con el botn secundario en
la pgina activa del rea de trabajo o mediante el Administrador
de sitios. El Administrador de sitios proporciona un mtodo ms
potente para no slo ver sino tambin editar las propiedades de
varias pginas al mismo tiempo, simplemente compruebe las
pginas elegidas y modifique una o ms propiedades de la pgina.
Todas las pginas activadas adoptarn la nueva configuracin.
Para ver la configuracin de propiedades de pgina
maestra:

Haga clic en el botn


Administrador de pginas
maestras sobre la ventana Pginas maestras en la
pestaa Sitio Aparecer Administrador de pginas
maestras.

72

Configuracin de sitios y pginas

Para ver la configuracin de propiedades de pgina web


normal:

Haga clic con el botn secundario en la pgina en el rea


de trabajo y elija Propiedades de la pgina....

Aparecer el cuadro de dilogo Propiedades de la pgina.


Nombre
de la
pestaa

Propiedad

Navegacin Pgina, ttulo y nombre de archivo


(predetermi Cada pgina tiene un nombre de pgina
visible o un nombre de archivo que se
nado)
muestra en el rbol de estructura del sitio de la
pestaa Sitio. Puede modificar el nombre de la
pgina, as como elegir un ttulo diferente.
Incluir en la navegacin
De forma predeterminada, todas las pginas se
incluye en barras de navegacin. Utilice esta
opcin para excluir la pgina de la navegacin.

Separadores y descripcin
Si se incluye en la navegacin, active Antes o
Despus para aplicar lneas separadoras entre
las opciones de men de barra de navegacin y
las opciones de elemento emergente. Un cuadro
de descripcin aade informacin de texto
adicional relacionada con la pgina en el
elemento del submen de la barra.
Marco de documento activo
Las pginas se pueden abrir en un marco del
documento activo si el marco se ha creado
previamente.

Configuracin de sitios y pginas

73

Ubicacin
Esta opcin coloca la nueva pgina
antes, despus o como un elemento
secundario de la pgina que elija en la
lista desplegable.
Esta opcin se muestra nicamente si
aade una pgina.
Aspecto

Ancho y Alto
Establece las dimensiones de la pgina
para pginas individuales/pginas
maestras, anulando las dimensiones
de Tamao de pgina
predeterminado (en
Archivo>Propiedades de sitio)
utilizadas cuando se cre la pgina.
Tambin puede arrastrar el borde
derecho o inferior de la pgina para
cambiar el ancho o alto de la pgina,
respectivamente.
Alineacin de la pgina
La alineacin determina cmo aparecer el
contenido de la pgina en un navegador. Utilice
la configuracin de alineacin de la pgina
predeterminada del sitio (Usar configuracin
del sitio) o seleccione Izquierda o Centrado
para invalidarla.
Seleccin
Elija un color que distinga de forma exclusiva
los objetos colocados en esta pgina de los de
una pgina maestra asociada. El color se
muestra al desplazar el ratn y en el contorno

74

Configuracin de sitios y pginas

del objeto seleccionado.


Copiar
Duplica los elementos de diseo de
una pgina web existente a la nueva
pgina. Active Copiar objetos de la
pgina y seleccione la pgina en la
lista activada. El contenido HTML
adjunto se puede copiar
opcionalmente.
Esta opcin se muestra nicamente si
aade una pgina.
Fondo

Pginas maestras
Controla las pginas maestras que se asocian a
la pgina. Active para asociar una pgina
maestra, desactive para desvincularla o arrastre
(o utilice los botones arriba/abajo) para
reorganizar el orden de la pgina maestra.
Fondo
La lista desplegable proporciona varias formas
de mostrar el fondo de la pgina.

Usar aspecto del sitio: Utiliza en


todo el sitio el aspecto de fondo como
se establece en
Archivo>Propiedades del
sitio>Pgina.

Usar fondo de pgina maestra:


Utiliza la configuracin de fondo de
una pgina maestra asociada. Esta
configuracin habr invalidado el
aspecto de fondo del sitio (arriba).

Usar fondo personalizado: Utiliza

Configuracin de sitios y pginas

un Color en pgina, Color de fondo


o Imagen de fondo slo para la
pgina actual. Si la opcin Usar
fondo personalizado est
seleccionado, las opciones estarn
disponibles.
Buscar

Etiquetas de bsqueda
Incluye descripciones de etiquetas y palabras
clave opcionales de pginas individuales, que
invalidan la configuracin de motores de
bsqueda del sitio.

Motor de
bsqueda

Mapas del sitio y robots


Informa a los motores de bsqueda o a los
robots si pueden arrastrar, analizar e indexar la
pgina actual. Un archivo del mapa del sitio
incluye la pgina actual en la indexacin
mientras que una meta-etiqueta robots (o un
archivo robots.txt) excluye la pgina. Esta
configuracin invalida la configuracin de
motores de bsqueda del sitio.

Seguridad
de la
pgina

Seguridad de la pgina
Aplica control de acceso a sus pginas web
asignando la pgina a un grupo de usuarios
(con objeto inteligente de la lista de usuarios
de Recursos Web Serif).

Redirigir

Redirigir a
Despus de un intervalo de tiempo
configurable, una pgina web se redirige a un
nuevo destino de hipervnculo (otra pgina,
imagen, correo electrnico, etc.).

Efectos

Transiciones de entrada/salida de la pgina


Las transiciones de entrada y salida de la

75

76

Configuracin de sitios y pginas

pgina se pueden aplicar durante la navegacin


de una pgina web a otra.
Usar archivo de sonido
Seleccione un sonido de fondo que se cargar y
reproducir automticamente cuando una
pgina especfica se muestra por primera vez.

Creacin de pginas HTML


El cdigo HTML es el cdigo subyacente etiquetado que el
navegador de Internet del visitante del sitio web lee, interpreta y
utiliza para aplicar formato a la pgina segn las etiquetas usadas.
El cdigo y las etiquetas utilizadas son las instrucciones segn las
cuales se aplica formato a una pgina y, como tal, es vital que el
cdigo est correctamente estructurado y se ajuste a las
convenciones de HTML.
WebPlus admite el desarrollo de pginas web en HTML. Puede
aadir pginas en la ventana Estructura del sitio de la pestaa Sitio;
se muestra un icono distintivo en la pgina HTML.

Las pginas HTML de la pestaa Sitio se pueden controlar de


forma similar a las pginas normales; es decir, puede
arrastrar/soltar, cambiar el nombre, obtener una vista previa,
insertar vnculos de fuera del sitio, estimar el tiempo de carga o
incluir la pgina en la navegacin. Sin embargo, las pginas HTML
no tienen asociadas pginas maestras. Adems, al hacer doble clic
en un icono de la pgina HTML se iniciar la ventana Origen para
la edicin de HTML (en lugar de la pantalla WYSIWYG de una
pgina estndar). En la ventana Origen ver algunas etiquetas
HTML bsicas que, si tiene experiencia como desarrollador
HTML, le resultarn muy familiares.

Configuracin de sitios y pginas

No hay vista WYSIWYG cuando trabaja con cdigo


fuente HTML directamente.
En este punto, es necesario editar la estructura HTML de la
"plantilla". Normalmente, el texto se insertar (escribiendo o
pegando) entre las etiquetas de apertura y de cierre

Visualizacin de pginas
El rea de trabajo de WebPlus consta de un rea de "pgina"
rodeada de un rea de "pegado".

77

78

Configuracin de sitios y pginas

El rea de pgina (A) es donde se colocan el texto, los grficos y


otros elementos que desea que aparezcan en el sitio web final. El
rea de pegado (B) es donde normalmente se conservan elementos
que se estn preparando para colocarse en el rea de pgina o estn
pendientes de hacerlo. Cuando publique el sitio desde el sitio de
WebPlus, se mostrar cualquier elemento que solape el rea de
pgina, pero no se mostrar ningn elemento que se encuentre
completamente en el rea de pegado. El rea de pegado la
comparten todas las pginas y las pginas maestras, y resulta muy
til para copiar y mover objetos entre las pginas.
Para mover o copiar un objeto de una pgina a otra
mediante el rea de pegado:

3.

1.

Arrastre el objeto de la pgina de origen al rea de


pegado (mantenga pulsada la tecla Ctrl para copiar).

2.

Muestre la pgina de destino (consulte Cambio entre las


pginas ms abajo).
Arrastre (o pulse Ctrl y arrastre para copiar) el objeto del
rea de pegado a la pgina de destino.

Configuracin de sitios y pginas

79

Con WebPlus resulta fcil ver exactamente en qu se est


trabajando, ya que se puede elegir entre una vista amplia de una
pgina completa o un primer plano de una pequea regin. Por
ejemplo, puede utilizar las barras de desplazamiento de la parte
derecha e inferior de la ventana principal para mover la pgina y el
rea de pegado en relacin con la ventana principal. La vista se
centra automticamente conforme se arrastran los objetos al borde
de la pantalla.
La barra de herramientas Vista en la parte superior de la pantalla
proporciona la Herramienta Mano
como mtodo
alternativo para desplazarse por la pantalla, adems de un nmero
de botones que le permiten acercar o alejar la imagen para poder
examinar y/o editar la pgina en diferentes niveles de detalle.

Cambio entre las pginas


WebPlus proporciona una serie de mtodos para acceder
rpidamente a la parte del sitio en la que necesita trabajar. La
pestaa Sitio de Studio proporciona un "panel de control" central
que incluye el rbol de estructura del sitio, que describe la
jerarqua de las pginas del sitio (Consulte la Ayuda de WebPlus
para obtener ms informacin), e iconos para pginas maestras
del sitio.
Diferencias en seleccionar y visualizar una pgina: Un solo clic
en una entrada de pgina o de pgina maestra solo selecciona la
pgina. Para ver realmente la pgina o la pgina maestra asociada
tendr que hacer doble clic en una entrada.
Una entrada de color
naranja (con el
nombre de la pgina
en negrita) indica la
pgina seleccionada.
El icono de ojo indica
la pgina visualizada
actualmente, que

80

Configuracin de sitios y pginas

puede editar en el rea


de trabajo. En este
ejemplo se muestra
que la pgina se est
visualizando en ese
momento adems de
estar seleccionada.
Un icono resaltado de
la pgina maestra en
la ventana superior de
la pestaa Sitio indica
la pgina maestra
seleccionada.
Un icono de ojo en el
icono de la pgina
maestra indica la
pgina visualizada en
esos momentos. En
este ejemplo se
muestra una pgina
maestra visualizada y
seleccionada al
mismo tiempo.
Para ver una pgina o pgina maestra especfica:
Se pueden utilizar varios mtodos para ver una pgina:

En la Lnea de sugerencias, use los botones de


.
navegacin de pgina de la lnea de sugerencia
O bien
Haga clic en la entrada de la pgina o pgina maestra en
la lista Localizador de pgina.

Configuracin de sitios y pginas

81

En la pestaa Sitio de Studio, haga doble clic en la


entrada de la pgina (o la pgina maestra) que desea ver.
La ventana Estructura del sitio de la pestaa incluye un
rbol con entradas para las pginas del sitio mientras que,
en la ventana Pginas maestras, las pginas maestras se
muestran nicamente como miniaturas. Puede que tenga
que hacer clic en el botn Pginas maestras> para
mostrar la ventana de pginas maestras.

Haga clic en el botn Estructura del sitio


en la
Lnea de sugerencias o en la ventana Pgina de la pestaa
Sitio. Seleccione la entrada de la pgina en el rbol del
cuadro de dilogo (haga doble clic en las entradas del
rbol si es necesario para expandir cada rama). A
continuacin haga clic en el botn Ver pgina.

Para las pginas maestras:

En la pestaa Sitio de Studio, haga clic en el


botn Pginas maestras> para mostrar una ventana de la
pgina maestra. Se mostrarn uno o ms iconos de
pgina maestra.

Haga doble clic en el icono de la pgina maestra que


desea ver.

82

Configuracin de sitios y pginas

Para cambiar de la pgina actual a la pgina maestra:

Haga clic en el botn Pgina/Pgina maestra


la Lnea de sugerencias.

en

Si hay varias pginas maestras asociadas a una


pgina, slo se podr cambiar a la primera pgina
maestra.
Como acceso directo para ver la pgina principal del
sitio, puede:

Hacer clic en el botn Pgina principal


Lnea de sugerencias.

en la

Desplazamiento e
hipervnculos

84

Desplazamiento e hipervnculos

Desplazamiento e hipervnculos

85

Adicin de barras de navegacin


En WebPlus, las barras de navegacin se programan para
comprender la estructura del sitio, con lo que se facilita el diseo
de un sitio en el que la navegacin resulta sencilla.
Las barras de navegacin facilitan el movimiento entre diferentes
secciones y niveles de un sitio (consulte la pg. 35), proporcionan
vnculos a la pgina principal y a otras pginas de secciones de
niveles superiores, mientras que los vnculos de mens emergentes
llevan a pginas secundarias dentro de cada seccin.
Puede instalar fcilmente barras de navegacin en cualquier nivel
del sitio, reconfigurarlas para que estn vinculadas a una parte del
sitio, cambiar el aspecto de la barra de navegacin y excluir
pginas especficas de la navegacin si es necesario.

Niveles y estructura del sitio


Puede repasar Introduccin a la estructura del sitio y a la
navegacin (pg. 35) para recordar cmo se basa la estructura del
sitio en secciones y capas.
Cuando se define una barra de navegacin, puede elegir el nivel de
pgina que se mostrar en la barra de navegacin. Se trata de una
especie de puntero de las partes del sitio a las que se deben crear
vnculos, en relacin con la pgina de la barra de navegacin.
Puede especificar Nivel superior, Mismo nivel, Nivel
infantil, Anterior/Siguiente, etc.
Para ayudarle a comprender esta relacin entre las pginas y estos
niveles referenciados, se ofrece una indicacin visual cuando est
creando la barra de navegacin (en cada miniatura de tipo de
navegacin). Los rectngulos en verde muestran el nivel de pgina
que se debe utilizar y el punto negro (), la pgina en la que se
ubica la barra de navegacin.

86

Desplazamiento e hipervnculos

Nivel
superior

Mismo
nivel

Nivel
infantil

Anterior
y Siguiente

Los diseos de iconos son ejemplos y no


representan la estructura actual del sitio.
Como las barras de navegacin entienden la estructura del sitio,
se actualizan dinmicamente si las pginas se mueven a diferentes
niveles.

Creacin de barras de navegacin


Las barras de navegacin se pueden aadir a cualquier pgina, pero
se suelen aadir a la pgina maestra, ya que esto evita el tener que
pegar el mismo elemento en varias pginas. Una barra de
navegacin en una pgina maestra se comporta como si estuviera
en cada una de las pginas, y sigue el concepto de que sus botones
y mens estn relacionados con el lugar en el que cada pgina se
encuentra en la estructura general del sitio.
Cuando se aade una barra de navegacin puede elegir cmo
aparecer la navegacin en la pgina; para ello, seleccione:

Tipo: el diseo intrnseco de la barra de navegacin (p.


ej., bloque, dilogo, tradicional).

Tipo de navegacin: la estructura del sitio o


personalizada en la que se basa la barra de navegacin.

Aspecto: el diseo de los botones, separadores y del


fondo de la barra de navegacin. Se pueden utilizar
diseos preestablecidos o personalizados.

Desplazamiento e hipervnculos

87

Mens emergentes: el diseo de los botones,


separadores y del fondo de los mens emergentes que
muestra la barra de navegacin (si se utilizan pginas
secundarias en la estructura del sitio).

Para aadir una barra de navegacin:


1.

Seleccione la pgina (o la pgina maestra).

2.

En el elemento flotante Navegacin


de la barra
de herramientas Objetos web, haga clic en Insertar
barra de navegacin

3.

En la pestaa Tipo del cuadro de dilogo, busque los


tipos de barra de navegacin en la lista desplegable Tipo
y ample las opciones de men si es necesario. Use las
flechas del teclado para buscar ms rpidamente.
En la ventana de vista previa adyacente, desplcese por
las opciones del men para revisar el aspecto de los
mens emergentes.

4.

Seleccione el tipo elegido, p. ej. Bloque 2.

5.

En la pestaa Tipo de navegacin elija si desea basar la


barra de navegacin directamente en la estructura del
sitio (active Segn la estructura del sitio).
O bien:
Personalice las opciones de la barra de navegacin
(active Personalizado; consulte Personalizacin de las
barras de navegacin en la pg. 89).
Si elige la estructura del sitio, podr:

Seleccionar los botones que se deben incluir en la


barra de navegacin: Nivel superior, Nivel
parental, Mismo nivel, etc.

88

Desplazamiento e hipervnculos

6.

En funcin de la seleccin principal, optar por


incluir una pgina secundaria, delimitadores, una
pgina principal, una pgina primaria, ocultar
vnculos de la pgina actual o desactivar
vnculos.

Habilitar una opcin de Nomenclatura de vnculos


relativos si usa vnculos relativos como Inicio,
Arriba, Anterior y Siguiente. Con la opcin Usar
nombres fijos activada, se muestran los nombres
relativos, p. ej., Siguiente; la opcin Usar
nombres de pgina muestra el nombre de pgina
real, tal y como est definido en las propiedades de
la pgina. Puede hacer clic en Personalizar para
editar un nombre de vnculo relativo.

Establecer la opcin Marco / ventana de destino


para cambiar el lugar en el que se abrir la pgina
nueva. Elija de entre Misma ventana (la opcin
ms comn), Nueva ventana (til para las pginas
de fuera del sitio), Parte superior de la ventana
actual, Marco primario, Ventana con nombre y
Marco del documento.

(Opcional) En la pestaa Aspecto, podr seleccionar


diferentes diseos para los botones, separadores o el
fondo, si es necesario. Estos se mostrarn en la barra de
navegacin principal. Para seleccionar diseos, puede:

Elegir un elemento flotante preestablecido, haciendo


clic en la flecha hacia abajo de la miniatura del
botn, por ejemplo, para botones preestablecidos.
O bien:

Hacer clic en Editar


para crear sus propios
diseos personalizados, basados en el botn
actualmente seleccionado. Podr cambiar la fuente,
el tamao y el color del texto, adems de los fondos

Desplazamiento e hipervnculos

89

de varios estados de botones Consulte la Ayuda de


WebPlus para obtener ms informacin.
7.

(Opcional) En la pestaa Mens emergentes elija los


diseos al igual que con la pestaa Aspecto, pero que
estn relacionados con las pginas "secundarias" de la
estructura del sitio.

8.

Haga clic en Aceptar. La barra de navegacin aparecer


en la pgina.

La barra de navegacin tienen un esquema de color,


lo que permite controlar an ms el aspecto de la barra.
Consulte Uso de esquemas de color en la pg. 404.
Para editar una barra de navegacin:
1.

Haga doble clic en la barra de navegacin.


O bien:
Seleccione Editar barra de navegacin...
O bien:

Haga clic con el botn secundario en la barra y


seleccione Editar barra de navegacin....
2.

Se puede cambiar la configuracin de cada pestaa .

Personalizacin de la estructura de la barra de


navegacin
De manera predeterminada, la estructura de la barra de navegacin
se basa en la estructura del sitio. Si desea reorganizar el orden o la
jerarqua de los elementos de la barra de navegacin para que sea
diferente a la estructura del sitio, WebPlus le permite personalizar
cualquier barra de navegacin mediante la creacin de un rbol de
navegacin personalizado. Puede aadir, editar o eliminar
elementos que tendrn acceso a varios tipos de destinos de vnculos

90

Desplazamiento e hipervnculos

(consulte Adicin de hipervnculo y delimitadores en la


pg. 105), al igual que en la Estructura del sitio de la pestaa Sitio.
Una vez que est trabajando con un rbol de
navegacin personalizado, la barra de navegacin ya
no se actualizar automticamente cuando se
aadan pginas nuevas al sitio. Si desea que esto
siga siendo as, deber basar la barra en la
estructura del sitio.
Para personalizar una barra de navegacin
seleccionada:
1.

Haga doble clic en la barra de navegacin.

2.

En la pestaa Tipo de navegacin, active la opcin


Personalizado.

3.

Reorganice el orden de los elementos de la barra de


navegacin mediante el mtodo de arrastrar y soltar (o
utilice los botones Subir, Bajar, Crear elemento
secundario o Crear elemento primario).

4.

Haga en Aadir vnculo para aadir un nuevo vnculo al


final del rbol de navegacin personalizado,
normalmente para aadir una pgina que ha agregado al
sitio. Al elemento se le asigna un destino de vnculo, un
marco o una ventana de destino y un ttulo en el cuadro
de dilogo que se muestra. Haga clic en Aceptar.

5.

Haga clic en Aceptar de nuevo. La barra de navegacin


utiliza ahora el rbol de navegacin personalizado para
mostrar las opciones de men.

Haga clic en Restablecer para que el rbol de navegacin vuelva a


la estructura del sitio o en Eliminar todo para quitar todas las
entradas del rbol personalizado.
El rbol de navegacin personalizado tambin se puede guardar en
el sitio, para utilizarlo en otras barras de navegacin.

Desplazamiento e hipervnculos

91

Para guardar la barra de navegacin personalizada:

Haga clic en Valores predeterminados y, a


continuacin, seleccione Guardar en el elemento
flotante.

Introduzca un nombre para el rbol de navegacin


personalizado (p. ej., arbolnavperson-1).

Haga clic en Aceptar. El rbol se guarda en el sitio.

Ms adelante, para otras barras de navegacin puede recuperar el


rbol guardado, mediante Valores predeterminados (elemento
flotante Cargar).

Modificacin de botones, separadores y


fondos
Cuando se crea o modifica una barra de navegacin, puede que
quiera conservar el mismo tipo de navegacin y estructura de la
barra o personalizar los botones, separadores y el fondo que
componen la barra de navegacin.
Se pueden crear nuevas barras a partir de cualquier
barra de navegacin existente en el sitio. Solo tiene que
elegir primero una barra de navegacin. Esto puede
ayudarle a conseguir el aspecto deseado ms
rpidamente.
Para visualizar la configuracin del botn, el separador
y el fondo:

En la pestaa Aspecto puede cambiar o personalizar los


botones, separadores y el fondo seleccionando el
elemento de la barra de navegacin de un cuadro de
seleccin.
Las opciones del cuadro de dilogo cambian en funcin
del elemento de la barra de navegacin que se seleccione.

92

Desplazamiento e hipervnculos

Para cambiar los botones de la barra de navegacin (por


otro botn preestablecido):
1.

Haga clic en la flecha desplegable de la miniatura


Sencillo para mostrar el elemento flotante Valores
preestablecidos.

2.

Seleccione un botn de una categora (estas coinciden


con las categoras de Tipo de la barra de navegacin).

3.

(Opcional) Ajuste las opciones Separacin y


Alineacin). Las opciones horizontales afectan a los
botones mostrados horizontalmente en la barra de
navegacin y viceversa.

4.

Haga clic en Aceptar.


Los botones personalizados se pueden crear desde
cero en Button Studio de WebPlus. (Consulte
Creacin de botones personalizados en la
pg. 102).

Para cambiar los separadores de la barra de navegacin


(por otro valor preestablecido):
1.

Haga clic en la flecha desplegable de la miniatura


Separador para mostrar el elemento flotante Valores
preestablecidos.

2.

Seleccione un separador de una categora.

3.

(Opcional) Ajuste las opciones de escala y cree los


separadores.

4.

Haga clic en Aceptar.

Desplazamiento e hipervnculos

93

Los separadores personalizados se pueden crear


desde cero en Design Studio de WebPlus. (Consulte
Creacin de botones personalizados en la
pg. 102).
Para cambiar el fondo de la barra de navegacin (por
otro valor preestablecido):
1.

Haga clic en la flecha desplegable de la miniatura Fondo


para mostrar el elemento flotante Valores
preestablecidos.

2.

Seleccione un fondo de una categora.

3.

(Opcional) Ajuste el relleno y otras opciones que se


adecuen a su diseo.

4.

Haga clic en Aceptar.

Modificacin de mens emergentes


Los mens emergentes son una parte integrante de las barras de
navegacin que se basan en estructuras del sitio que emplean
pginas secundarias. Aparecen solo si se desplaza el ratn sobre
los botones de la barra de navegacin y desaparecen al alejarse del
botn.

94

Desplazamiento e hipervnculos

Al igual que los botones, los mens emergentes son


totalmente configurables. Una diferencia es que se pueden
configurar como Mens emergentes de texto y Mens
emergentes grficos. El tipo de barra de navegacin (bloque,
resaltado, dilogo, etc.) puede utilizar cualquier tipo de men
emergente, dependiendo del diseo.
Para mostrar la configuracin de un men emergente:
1.

En la pestaa Mens emergentes, puede personalizar el


elemento emergente seleccionando un tipo de men.
Active Mens emergentes de texto o Mens
emergentes grficos. La ltima opcin implementa
objetos de botones para componer los mens.

2.

Seleccione una opcin del men. Las opciones del


cuadro de dilogo cambian segn la opcin seleccionada.

3.

Edite los cuadros de valores, las listas desplegables, los


botones de opcin y las casillas de verificacin
correspondientes para que se adecuen al diseo del men
emergente. La configuracin de la opcin Mens
emergentes grficos para los botones, separadores y el
fondo comparten la misma configuracin que la de los
botones.

Visualizacin de los separadores


Para cualquier pgina, vnculo fuera del sitio o delimitador
incluido en la navegacin y que aparece en la barra de navegacin
(o en los mens emergentes) puede controlar la visualizacin de los
separadores entre cada opcin de men.

Desplazamiento e hipervnculos

95

Para controlar la visualizacin de separadores en la


barra de navegacin:
1.

En el cuadro de dilogo Configuracin de la barra de


navegacin, seleccione la pestaa Aspecto y, a
continuacin, la opcin Separadores.

2.

Active la opcin Insertar separador cuando lo


especifique el rbol de navegacin.

3.

Haga clic en Aceptar.

4.

En la pestaa Sitio, haga clic con el botn secundario del


ratn en la pgina/vnculo fuera del sitio y elija
Propiedades de la pgina....

5.

En la opcin del men Navegacin, active Antes o


Despus para aplicar una lnea separadora sobre/debajo
del elemento del men emergente de la pgina.

6.

Haga clic en Aceptar.

Los delimitadores de objeto tienen opciones


equivalentes al separador, cuando se hace clic con el
botn secundario en un objeto y se selecciona
Delimitador.
Para controlar la visualizacin de separadores en los
mens emergentes:
1.

En el cuadro de dilogo Configuracin de la barra de


navegacin, seleccione la pestaa Mens emergentes.

Para los Mens emergentes de texto (active el


botn de opcin), seleccione Lneas y bordes y, a
continuacin, active Insertar separador cuando lo
especifique el rbol de navegacin.
O bien:

96

Desplazamiento e hipervnculos

Para los Mens emergentes grficos (active el


botn de opcin), seleccione Separadores y active la
opcin anterior.

2.

Haga clic en Aceptar.

3.

Repita los anteriores pasos del 4 al 6.

Cmo guardar las opciones de la barra de


navegacin
Si ha personalizado los botones de la barra de navegacin, los
separadores, el fondo y el men emergente puede guardar esa
configuracin combinada en una sola ubicacin mediante el botn
Valores predeterminados. Esta funcin resulta til para aplicar el
mismo aspecto de barra de navegacin a otras barras de navegacin
que cree en el sitio.

Inclusin/exclusin de pginas en la
navegacin
De forma predeterminada, todas las pginas se incluyen en la
navegacin; es decir, se pueden vincular mediante barras de
navegacin. Puede excluir determinadas pginas (excepto la
pgina principal) para que las barras de navegacin las omitan. Por
ejemplo, supongamos que tiene una seccin de referencia o de
pginas archivadas que no desea que los visitantes exploren. Si se
excluye la pgina primaria de esa seccin se eliminar de la barra
de navegacin. Tenga en cuenta que el excluir la pgina de la
navegacin no la elimina del sitio; la pgina seguir apareciendo en
el rbol de estructura del sitio y an podr instalar hipervnculos
en ella, simplemente no aparecer en la barra de navegacin.
Para excluir una pgina de la navegacin:

En la pestaa Sitio de Studio, haga clic con el botn


secundario del ratn en el rbol de estructura del sitio y
elija Propiedades de la pgina. Desactive la opcin
Incluir en la navegacin.

Desplazamiento e hipervnculos

97

Las pginas incluidas muestran una marca


en la
entrada de la pgina en el rbol de estructura del sitio de
la pestaa Sitio. Cuando se excluyen entradas de pgina,
estas aparecen desactivadas y sin la marca.

Uso de barras de navegacin dinmicas


Hasta ahora, hemos asumido que las barras de navegacin se basan
en la estructura del sitio y muestran pginas estticas como
elementos de men. Sin embargo, para obtener barras de
navegacin ms dinmicas, puede rellenar los submenes de la
barra de navegacin con un foro en continuo cambio, CMS y
ttulos de artculos de blog (solo hay que hacer clic en un ttulo
para ver el artculo correspondiente).
Supongamos que ya utiliza un vnculo fuera del sitio que conecte
al foro, al CMS y al blog y que el vnculo fuera del sitio se incluye
en la navegacin.
Para crear una barra de navegacin dinmica:

Haga clic con el botn secundario del ratn en el vnculo


fuera del sitio en la pestaa Sitio y haga clic en
Propiedades del vnculo fuera del sitio....

En el cuadro de dilogo Vnculo fuera del sitio, cambie


el men desplegable de la seccin Informacin del objeto
inteligente para aadir artculos de fuente (es decir, de
ttulos de artculos publicados) como elementos
secundarios al submen de la barra.
Se puede hacer clic en cada ttulo de artculo, con lo que
se abre el artculo asociado en una ventana, que suele ser
una ventana aparte.

98

Desplazamiento e hipervnculos

Conversin en paneles
Puede convertir la barra de navegacin en un panel (p. 132), y
beneficiarse de una colocacin ms libre de los botones de la barra
de navegacin (dentro del rea del panel) y de la opcin de
mantener las barras de navegacin siempre visibles.
Para convertir una barra de navegacin en un panel:
1.

Seleccione la barra de navegacin.

2.

Seleccione Convertir en panel


herramientas de contexto.

en la barra de

Para obtener ms informacin sobre los paneles, consulte Adicin


de paneles en la pg. 132.

Adicin de mens emergentes


Los mens emergentes constituyen una parte integrante de las
barras de navegacin de mltiples niveles (p. 83), que se
muestran como mens que presentan solamente un botn al
desplazarse con el ratn por encima. Los elementos de mens
emergentes representan las pginas secundarias en los niveles
inferiores del sitio.
En WebPlus, tambin puede aadir mens emergentes a cualquier
objeto (una forma de QuickShape, imagen, un elemento de la
galera, pero lo ms normal es que sea un botn). El men es
bsicamente el mismo que los que se incluyen en las barras de
navegacin. Como las barras de navegacin, los elementos de
mens emergentes que se muestran se pueden configurar, de forma
que adopten la estructura del sitio completa (o parte de esta) o su
propia estructura personalizada.

Desplazamiento e hipervnculos

99

Los mens emergentes resultan


especialmente tiles cuando se
quiere mostrar un conjunto de
vnculos de navegacin
limitados, y quizs
relacionados, como un conjunto
de productos.
Se dispone de un completo
control sobre qu nivel del sitio
desea mostrar en el elemento de
men emergente. En el ejemplo
que se ilustra, el men
emergente se basa en pginas
secundarias que pertenecen a
una pgina principal de los
productos (que probablemente
alojar el botn y el men
emergente.)
Para crear un men emergente:
1.

Seleccione un objeto al que adjuntar el men emergente.

2.

Seleccione Men emergente... del men Insertar.


O bien:
Haga clic con el botn secundario del ratn en un objeto
y seleccione Men emergente....

3.

En la pestaa Tipo de navegacin del cuadro de dilogo,


active la opcin Mostrar como men emergente... para
hacer que los vnculos de navegacin estn asociados con
el objeto.

4.

Active Segn la estructura del sitio o Personalizado


para utilizar los vnculos de navegacin del sitio como
parte del men o para basar el men emergente en su
propia estructura personalizada (p. 89),
respectivamente.

100 Desplazamiento e hipervnculos


5.

En la pestaa Aspecto del men del cuadro de dilogo,


seleccione Mens emergentes de texto o Mens
emergentes grficos. La ltima opcin implementa
objetos de botones para componer los mens.

6.

Seleccione una opcin de men del cuadro, despus edite


los cuadros de entrada, las listas desplegables, los
botones de opcin y las casillas de verificacin para que
se ajusten al diseo de su men emergente. La
configuracin de la opcin Mens emergentes grficos
para los botones, separadores y el fondo comparten la
misma configuracin que la de los botones.
Todas las opciones se describen detalladamente en
Cambiar mens emergentes en la p. 93.

7.

Haga clic en Aceptar.

Adicin de botones
Los botones son una parte
integrante de las barras de
navegacin de WebPlus
(consulte la pg. 83) pero
tambin se pueden aadir
como objetos a la pgina web,
ya sea como un vnculo a un
destino de hipervnculo o
mostrando un men
emergente.
En WebPlus, los botones se
pueden basar en un diseo
preestablecido o pueden
crearse desde cero en Button
Studio. Es muy comn elegir
uno preestablecido y despus
personalizarlo para que se
ajuste a sus necesidades.

Desplazamiento e hipervnculos 101

Independientemente de la
opcin que elija, podr editar la
etiqueta de texto para que se
ajuste a la funcin del botn
fcilmente.
Para aadir un botn preestablecido:
1.

En el elemento flotante Navegacin


de la barra
de herramientas Objetos web, haga clic en Insertar
botn

2.

En el cuadro de dilogo Editar botn, haga clic en el


cuadro de vista previa de botn.

3.

Seleccione un tipo de botn preestablecido del elemento


flotante. El cuadro de vista previa se actualiza con el
diseo de botn elegido.

4.

Especifique la Etiqueta del botn para identificar el


botn, como Inicio, Imgenes, Ayuda, etc.

5.

Seleccione una Accin que se invocar cuando se haga


clic en el botn.

El hipervnculo dirigir al usuario a un destino (p.


ej., una pgina de Internet, una pgina del sitio, un
archivo) mediante un hipervnculo (consulte la
pg. 105). Haga clic en Editar para elegir el tipo de
destino, el destino y la ventana de destino.

La opcin Enviar formulario crea un botn Enviar


usado para enviar datos del formulario. La etiqueta
del botn se sobrescribe siempre para que sea
Enviar (pero puede modificarla de nuevo). La
accin del botn se invoca realmente cuando el
botn se coloca en un formulario.

102 Desplazamiento e hipervnculos

La opcin Restablecer formulario crea un botn


Restablecer, utilizado en los formularios para borrar
los datos introducidos en los campos de formulario.
Los botones Enviar y Restablecer se colocan
normalmente uno junto al otro.

La opcin Secuencia de comando personalizada le


permite escribir su propio cdigo JavaScript en el
cuadro de entrada (no necesita incluir las etiquetas ).

6.

(Opcional) Active Deshabilitado para hacer que el


control est inactivo a menos que se active por un script.

7.

(Opcional) Active Botn inicialmente en estado Abajo


para que el botn aparezca como si ya se hubiera hecho
clic en l (a diferencia de estar en estado Normal).

8.

Haga clic en Aceptar.

9.

Site el cursor en la posicin del cursor seleccionada en


la que desee colocar el botn.

10. Para insertar el botn con el tamao predeterminado,


simplemente haga clic con el ratn.
O bien:
Para definir el tamao del botn, arrastre una regin y
suelte el botn del ratn.
Para editar un botn:

Haga doble clic en un botn y modifquelo como se ha


descrito anteriormente.

Creacin de botones personalizados


Si desea seguir modificando el botn preestablecido seleccionado
(o trabajar desde cero) puede usar Button Studio, un entorno de
diseo de botones integrado de WebPlus. Le permitir concentrarse
en el diseo del botn sin la distraccin de otros objetos de la
pgina, es decir, el diseo se muestra aislado.

Desplazamiento e hipervnculos 103

Button Studio le permite modificar el aspecto personalizado del


botn en cada uno de los estados del botn, es decir inicialmente
en el estado Normal, cuando est Abajo y en el estado Desplazar.
Button Studio est equipado con una Pestaa cmo
interactiva que le ayudar al crear su botn
personalizado. La pestaa incluye informacin adicional
sobre la edicin de diferentes estados del botn y el uso
de guas y opciones de ampliacin para controlar los
elementos del botn que se amplan o mantienen como
est.
Para crear un botn personalizado:
1.

(Opcional) En el cuadro de dilogo Botn, seleccione un


botn preestablecido en el que puede basar el nuevo
botn.

2.

En el mismo cuadro de dilogo, haga clic en el botn


Editar
. Button Studio se inicia con el botn
ampliado para que lo ajuste al rea de trabajo.

104 Desplazamiento e hipervnculos


3.

En el estado Normal (consulte la pestaa Estados del


botn), utilice las herramientas y pestaas estndar de
WebPlus para personalizar el diseo del botn a su gusto.

4.

En la pestaa Estados del botn, en la parte inferior del


rea de trabajo, repita para cada estado (seleccione
Abajo, Desplazar, Deshabilitado, etc.) para editar el
botn en cada estado.
Las opciones Men a la derecha y Men Abajo son
nicamente para los mens emergentes.

5.

Haga clic en Confirmar cambios en la barra de


herramientas principal para salir. El botn modificado se
actualiza y se devuelve a su posicin original.

Cmo puedo editar mi texto? Button Studio se centra


en el diseo del botn en lugar del etiquetado. Para
editar la etiqueta, haga doble clic en el botn de la
pgina y modifquela de nuevo en la opcin Etiqueta
del botn del cuadro de dilogo.
Una vez que ha aadido el botn a la pgina, todava puede utilizar
Button Studio para editar el diseo en cualquier momento.
Para editar el diseo del botn:

Seleccione Editar diseo de botn


herramientas de contexto.

de la barra de

Conversin a una barra de navegacin


Puede convertir el botn a una barra de navegacin (p. 83) en
cualquier momento, con lo que tendr las caractersticas inherentes
de todas las barras de navegacin, es decir, presentar la estructura
del sitio (o una estructura personalizada).

Desplazamiento e hipervnculos 105

Para convertir un botn en una barra de navegacin:


1.

Seleccione el botn.

2.

En la barra de herramientas de contexto, seleccione


Convertir en barra de navegacin

Adicin de hipervnculos y
delimitadores
La creacin de un hipervnculo para un objeto, como un cuadro,
algo de texto o una imagen significa que un visitante del sitio web
puede hacer clic en el objeto para activar un evento. Lo ms comn
es que el evento consista en saltar a uno de los siguientes
elementos:

Pgina del sitio

Pgina de Internet (en cualquier parte de la Web)

Ventana para escribir un correo electrnico

Archivo del disco local o de la red

Delimitador (un destino designado en una pgina web)

Objeto inteligente (especficamente un foro, un blog o


CMS en Recursos Web Serif)

Fuente RSS o podcast

Carro de la compra

Elemento de navegacin

Datos del usuario

106 Desplazamiento e hipervnculos

Imagen

Los hipervnculos bien diseados son un aspecto importante de la


estructura del sitio. Ayudan a los visitantes a desplazarse a travs
del sitio y sirven como un importante adjunto a las relaciones
lgicas de la pgina, como se muestra en el rbol de estructura del
sitio. (Pero no pase por alto el ahorro de tiempo que supone el uso
de las barras de navegacin.)
Puede gestionar todos los hipervnculos y
delimitadores del sitio mediante el Administrador de
sitios, al que se puede acceder desde la barra de
herramientas de contexto Predeterminada o la lnea de
sugerencias.
Para aadir un hipervnculo:
1.

Utilice la Herramienta puntero para seleccionar un


objeto nico o agrupado o resaltar el rea de texto en la
que se crear el hipervnculo.

2.

Seleccione Hipervnculo
Hipervnculo
Herramientas.

del elemento flotante

de la barra de herramientas

El cuadro de dilogo Hipervnculos se muestra.


3.

Haga clic para seleccionar el tipo de destino del vnculo,


es decir, Pgina del sitio, Pgina de Internet, Objeto
inteligente, etc.

4.

En funcin del tipo de vnculo, seleccione las opciones


especficas al tipo en el panel de la derecha como el
destino de hipervnculo.

5.

Se pueden elegir varias ventanas o marcos de destino en


funcin de cmo desea que se muestre el destino del

Desplazamiento e hipervnculos 107

vnculo. Los tipos (junto con los resultados esperados)


son:

Misma ventana: el destino del vnculo se muestra


en la misma ventana en la que se hace clic en el
hipervnculo.

Nueva ventana: se utiliza una nueva ventana para


mostrar el destino. Las propiedades (dimensiones,
posicin y aspecto) se pueden definir mediante el
botn Configuracin (active antes Usar cdigo
emergente de JavaScript). La ventana original
permanecer abierta.

Parte superior de la ventana actual: el destino del


vnculo se muestra en la ventana de nivel superior.
Se usa para los hipervnculos creados en un marco o
en una pgina (o para los marcos dentro de marcos).

Marco primario: el destino del vnculo se muestra


en el marco primario o en la ventana primaria del
marco en el que se hace clic en el hipervnculo. Se
usa para los hipervnculos creados en un marco o en
una pgina (o para los marcos dentro de marcos).
(Consulte la Ayuda de WebPlus.)

Ventana con nombre: una ventana personalizada


se puede definir introduciendo un nombre nuevo de
ventana en el men desplegable de la derecha. Las
propiedades se pueden definir al igual que en Nueva
ventana, que se ha tratado anteriormente. Tambin
puede adoptar una ventana con nombre existente en
el mismo men desplegable.

Marco del documento: el destino del vnculo se


muestra en un marco creado previamente (usando la
Herramienta de documento con marco). El Id. de
HTML (p. ej., ifrm_1) de cualquier marco existente
se selecciona en el men desplegable de la derecha.
(Consulte la Ayuda de WebPlus.)

108 Desplazamiento e hipervnculos


Si est apuntando un marco del documento activo,
seleccione el marco activo de la lista desplegable
Abrir en marco de documento activo. Si no se
muestra en la lista, deber establecer el marco para
que est activo, haciendo doble clic en el marco y
activando Marco de documento activo.

Caja de luz: el destino del vnculo se muestra en


una caja de luz emergente superpuesta en la pgina
web. Haga clic en Opciones de caja de luz para
ofrecer opcionalmente un pie de imagen, cambiar
las dimensiones de la caja de luz o incluirla como
parte de una presentacin de diapositivas. Consulte
Uso de la caja de luz en la pg. 128.

6.

Seleccione otras propiedades como nombre del ttulo (se


muestra como texto cuando se pasa el ratn por encima y
describe el destino del hipervnculo) y una clave de
acceso directo.

7.

Utilice la lista desplegable Estilo para elegir el formato


del hipervnculo de texto (si se crea un hipervnculo en el
texto). Los colores normal, seguido, activo y dinmico se
definen segn varios criterios de formato en la lista
desplegable.

8.

Haga clic en Aceptar.

Para modificar o quitar un hipervnculo:


1.

Utilice la Herramienta de puntero para seleccionar el


objeto o haga clic en un punto de insercin dentro del
texto vinculado. (No es necesario arrastrar a un rea
hipervinculada de texto.)

2.

Haga clic en el botn Hipervnculo


del elemento
flotante Hipervnculo de la barra de herramientas
Herramientas.

Desplazamiento e hipervnculos 109

El cuadro de dilogo Hipervnculos aparecer y mostrar el destino


actual del vnculo. Si el vnculo se encuentra en texto, todo el
vnculo de texto se resalta.

Para modificar el hipervnculo, seleccione un nuevo tipo


de destino de vnculo, un nuevo destino o nuevas
opciones.

Para quitar el hipervnculo, haga clic en Sin


hipervnculo.

Para ver o editar los hipervnculos existentes:

Elija Administrador de sitios>Administracin de


hipervnculos en el men Herramientas para ver y
quitar hipervnculos o cambiarles el nombre.

Insercin de un delimitador
Un delimitador es una ubicacin especfica en una pgina que
puede servir como destino de un hipervnculo. Es invisible al
visitante de la pgina web y por lo general marca un punto dentro
de algn texto (como el inicio de una seccin particular) o una
imagen en algn punto de la pgina. Los delimitadores son tiles si
tiene suficiente contenido para que se pueda dividir en secciones,
pero no tanto como para necesitar colocarlo en pginas separadas.
Permiten al lector saltar a contenido relacionado sin salir de la
pgina actual. Asimismo, si se mantiene a los visitantes web en la
misma pgina es menos probable que se "pierdan" mientras
navegan por la informacin del sitio.
Para insertar un delimitador:
1.

Utilice la Herramienta de puntero para seleccionar el


objeto de destino o haga clic en un punto de insercin
dentro del texto de destino.

110 Desplazamiento e hipervnculos


2.

Haga clic en el botn Delimitador

del elemento

flotante Hipervnculo
de la barra de
herramientas Herramientas.
O bien:
Elija Delimitador del men del botn derecho Insertar.
3.

En el cuadro de dilogo, escriba un nombre para el


delimitador.

4.

(Opcional) Active la opcin Incluir delimitador en


navegacin para que se pueda acceder al delimitador
(por lo general un objeto seleccionado) mediante una
barra de navegacin en lugar de un hipervnculo.
Tendr que marcar primero Incluir delimitadores en la
barra de navegacin. D un ttulo al delimitador.

5.

Active las opciones Antes o Despus para aplicar


lneas separadoras horizontales sobre/debajo del
delimitador como un elemento de submen en las
barras de navegacin.

Aada una descripcin para aadir informacin de


texto adicional relacionada con la pgina en el
elemento del submen de la barra.

Haga clic en Aceptar.

Para ver o editar los delimitadores existentes:

Elija Administrador de sitios>Administrador de


delimitadores en el men Herramientas para ver,
quitar o cambiar el nombre de un delimitador asociado a
un objeto determinado. Tambin puede incluir el
delimitador en la navegacin de la pgina.

Adicin de
objetos web

112 Adicin de objetos web

Adicin de objetos web 113

Adicin de bsquedas de sitio


WebPlus utiliza un servicio potente de bsqueda que combina los
trminos de bsqueda de los usuarios con el texto que aparece en el
sitio en texto artstico, marcos de texto o tablas. Esto facilita la
recuperacin del contenido de cualquier pgina web alojada.
La funcin de bsqueda funciona con la Herramienta Bsqueda
de sitio y Herramienta Resultados de bsqueda del sitio, ambas
alojadas en el elemento flotante de bsqueda de la barra de
herramientas Objetos web. Cada herramienta se utilizar para
crear objetos que funcionan en combinacin.

Objeto de resultados de bsqueda del sitio: crea una ventana


en la que se muestran los resultados de bsqueda.
Normalmente, se coloca y se clasifica en su propia pgina, y
no aparece en la estructura de navegacin del sitio.
Normalmente, colocar la casilla de resultados de bsqueda
antes de aadir el objeto de bsqueda de sitio.

- Objeto de bsqueda de sitio: el cuadro de texto en el que


los usuarios escriben la palabra o la frase que desean
buscar. Este cuadro de texto normalmente se aade a una

114 Adicin de objetos web


pgina maestra y aparece en todas las pginas del sitio.
Por ejemplo, el trmino de bsqueda anterior vitae puede
recuperar resultados de bsqueda que muestren pginas web que
contiene el trmino de bsqueda. El usuario hace clic en el botn
Buscar para iniciar cualquier bsqueda.

Los resultados de bsqueda muestran un encabezado de nombre de


pgina con hipervnculo adems del texto de pgina web asociado
como referencia. Simplemente haga clic en el hipervnculo para
acceder a la pgina web.
Para aadir Resultados de bsqueda en el sitio:
1.

Haga clic en la Herramienta de Resultados de


bsqueda del sitio
en el elemento flotante de
bsqueda de la barra de herramientas Objetos web.

2.

Mueva el cursor
a una posicin elegida y, a
continuacin, haga clic y arrstrelo para colocar la
ventana de resultados de bsqueda.

Adicin de objetos web 115

Para aadir el objeto de bsqueda de sitio:


1.

Haga clic en la Herramienta Bsqueda del sitio


en el elemento flotante de bsqueda de la barra de
herramientas Objetos web.

2.

En la pgina web o la pgina maestra, mueva el cursor


a una posicin elegida y haga clic para colocar el
objeto de bsqueda de sitio. El objeto de bsqueda
aparecer en la pgina.

Aada el objeto de bsqueda a la parte superior de la


pgina maestra para permitir el acceso a la funcin de
bsqueda en todo el sitio.
La bsqueda del sitio es intil sin algunos medios para mostrar los
resultados de bsqueda al usuario. Es posible con el objeto
Resultados de bsqueda en el sitio que, como el objeto de
bsqueda de sitio, se puede colocar en una pgina web moviendo el
cursor. No obstante, el objeto normalmente cambia el tamao a
pgina completa antes de la posicin (necesita mostrar varios
resultados de pgina web de forma consecutiva).
Mantenga los resultados de bsqueda en una pgina
separada, quizs nueva, que tambin puede tener su
propio aspecto (haga doble clic en el objeto para editar
el aspecto de la pgina).

Uso de la Galera
La pestaa Galera incluye contenido creativo diseado, que se
puede utilizar con el mtodo de arrastrar y soltar, que
proporcionar al sitio web un aspecto moderno. Hay disponible una
amplia gama de categoras, como por ejemplo:

Marcos de fotografas

116 Adicin de objetos web

Distintivos y pegatinas

Botones de E-Comercio

Indicadores

Banners Flash

Conjunto de iconos e iconos

Notas

Smbols rpidos

La pestaa tambin sirve para almacenar sus propios objetos de


diseo que le gustara reutilizar en el mismo sitio web o en uno
diferente. Cuando haya copiado un diseo a la galera, estar
disponible para cualquier sitio, solo tiene que abrir la galera.

Adicin de objetos web 117

La Galera (ms arriba) consta de dos partes: una lista desplegable


superior de Categoras (A) y una ventana inferior de Diseos (B)
que muestra una lista de miniaturas que representan los diseos de
la categora seleccionada.
Para ver su Galera:
1.

Haga clic en la pestaa Galera de Studio.

2.

Seleccione una categora del men desplegable.


Los elementos de la primera subcategora se muestran de
forma predeterminada.

118 Adicin de objetos web


Para utilizar un diseo de la Galera:

Haga clic en su miniatura en la categora de diseo y


arrstrela a la pgina. La Galera conserva una copia del
diseo hasta que la elimine expresamente.

Algunos artculos de la galera son editables y, por


tanto, se pueden utilizar como punto de partida para
diseos propios.

Almacenar diseos propios


La pestaa Galera tambin puede almacenar sus propios diseos
personalizados en la categora de diseo lista para usar Mis
diseos: la categora est disponible en cualquier sitio de WebPlus.

Cuando instala por primera vez WebPlus, la galera


de Mis diseos estar vaca, lista para recibir diseos
personalizados.

Adicin de objetos web 119

Para mover o copiar un objeto a la categora Mis


diseos:
1.

Seleccione la categora Mis diseos de la lista


desplegable Categoras.

2.

Arrastre el objeto de la pgina y colquelo en la ventana


Diseos.

3.

En el cuadro de dilogo, introduzca un nombre para el


diseo y seleccione Aceptar. Aparecer una miniatura
del diseo en la ventana Diseo.

Pulse la tecla Ctrl antes de comenzar a arrastras para


copiar en lugar de mover el diseo.
Para cambiar el nombre de un diseo o eliminarlo:

Haga clic en el botn de la lista


en la esquina inferior
derecha de una miniatura (se muestra al desplazarse por
encima) y seleccinelo en el men.

Para clasificar ms adelante sus diseos, puede aadir


subcategoras a Mis Diseos o crear una nueva categora
personalizada en lugar de Mis Diseos.
Una vez que estn creadas, las subcategoras y categoras
principales se pueden eliminar o se les puede cambiar el nombre.
Para aadir, eliminar o cambiar el nombre de
subcategoras personalizadas:

Para aadir, seleccione una categora y haga clic en


Aadir subcategora... en el botn Men de pestaa
de la pestaa.

120 Adicin de objetos web

Para eliminar o cambiar el nombre, seleccione el botn


de la lista desplegable
subcategora.

de la barra de ttulo de la

Si aade una subcategora, necesitar nombrarla en un cuadro de


dilogo. Para cambiarle el nombre o eliminarla, solo tiene que
seleccionar la subcategora antes de seleccionar la opcin.
Para aadir, eliminar o cambiar el nombre de categoras
personalizadas:
1.

Con la pestaa Galera seleccionada, haga clic en el


botn Men de pestaa
y seleccione Aadir
categora..., Quitar categora o Cambiar nombre de la
categora... del men de elemento flotante.

2.

Utilice el cuadro de dilogo para introducir y confirmar


su cambio.
Tambin se perdern todos los diseos de una
categora eliminada.

Adicin de Google Maps


Utilice Google Maps incrustados en su pgina web si desea
asegurarse de que los clientes pueden buscar sus oficinas, los
asistentes pueden encontrar esa reunin especial (o evento) o
identificar las ubicaciones de inters especial. Al incrustar en una
pgina web "Direcciones", podr aadir el mapa y escribir
direcciones adicionales al sitio como corresponda.

Adicin de objetos web 121

Cada mapa permite colocar marcadores en el mapa para


identificar cada ubicacin. Cada marcador puede ser emergente al
hacer clic en uno de los siguientes elementos:

Un cuadro de llamada que ofrece texto sin formato (p.


ej., una direccin postal o web).

Un cuadro de la llamada que ofrece texto en formato


HTML.

Una ventana de StreetView.

Para aadir un Google Map:


1.

en el elemento
Haga clic en Insertar Google Map
flotante Multimedia de la barra de herramientas Objetos
web.

122 Adicin de objetos web


2.

En el cuadro de dilogo Google Map, escriba el cdigo


postal o la direccin en el campo Buscar una ubicacin
y, a continuacin, haga clic en Buscar. Como se est
utilizando el geolocalizador de Google, WebPlus
detectar su regin y mostrar preferentemente las
direcciones locales.

3.

Navegue por el mapa utilizando los controles de


panormica y de zoom: arrastre el cursor de mano para
hacer una panormica y el control deslizante y los
botones para aumentar o alejar. Si tiene un ratn con una
rueda de desplazamiento, asegrese de que la opcin
Habilitar zoom con rueda de desplazamiento del
ratn est activada para un control ptimo del zoom.

4.

(Opcional) De la lista desplegable Control de


navegacin seleccione Completo (para panormica,
botones de zoom y control deslizante de zoom),
Compacto (solamente para los botones de zoom) o
Ninguno (para ocultar todos los controles de
navegacin).

5.

(Opcional) De la lista desplegable Control del tipo de


mapa seleccione Barra (para mostrar las opciones de
satlite y el mapa en disposicin vertical), Men
desplegable (para los modos Mapa, Satlite y Terreno) o
Ninguno (ocultar los controles de tipo de mapa).

6.

Haga clic en Aceptar.

7.

Ver el puntero del ratn cambiar al cursor


Pegar. Las acciones que realice a continuacin
determinarn el tamao y la colocacin iniciales del
mapa.
Para insertar el mapa con el tamao predeterminado,
simplemente haga clic con el ratn.

Adicin de objetos web 123

O bien:
Para establecer el tamao del mapa para que se ajuste
mejor a su diseo de pgina, arrastre a una regin y
suelte el botn del ratn.

El icono Street View


se puede arrastrar al
mapa para mostrar la ubicacin del cursor en el
modo Street View. Haga clic en
para salir de la
ventana Street View. Si no desea que esta
caracterstica est disponible para los visitantes web,
desactive Mostrar control de calle en el cuadro de
dilogo.

Adicin de marcadores

Puede aadir un nmero ilimitado de marcadores rojos a


su Google Map. Cada marcador puede mostrar ms informacin
cuando el ratn se desplaza por encima y se hace clic con l.
Para aadir un marcador:
1.

En el cuadro de dilogo Google Map, haga clic en


Aadir.

2.

Site el cursor
sobre la ubicacin elegida y, a
continuacin, haga clic.

3.

En el cuadro de dilogo Marcador de Google Map,


introduzca un nombre para el marcador. Esta
informacin aparece cuando se desplaza el ratn por
encima y puede ser el nombre de una empresa o de un
sitio.

124 Adicin de objetos web


4.

Asigne una Accin de clic al marcador, es decir, lo que


se muestra al hacer clic en el botn. Elija una de estas
opciones:

Etiqueta predeterminada: el texto se escribe en el


cuadro Etiqueta. en la publicacin, un clic muestra
el texto sin formato en el cuadro de la llamada.

Tratar etiqueta como script: el texto se introduce


con etiquetas HTML en el cuadro Etiqueta. En la
publicacin, un clic abre un cuadro de llamada con
formato HTML.

Street View: En la publicacin, una ventana


maximizada con una vista de la calle se muestra del
mapa. Haga clic en
Street View.

5.

para salir de la ventana

Haga clic en Aceptar. El marcador aparece en la vista


previa del mapa en verde (para indicar que est
seleccionado). Repita el proceso para cada marcador uno
por uno.

En algn momento, es posible que quiera editar, buscar, mover o


eliminar un marcador en su Google Map.
Para editar los marcadores de Google Map:

Haga doble clic en el Google Map de la pgina.

En el cuadro de dilogo, seleccione un marcador de la


lista desplegable Marcadores de mapa y, a
continuacin:

Para editar la etiqueta del marcador, haga clic en


Editar y modifique el texto en el cuadro Etiqueta.

Adicin de objetos web 125

Para mover el marcador, haga clic en Mover; a


continuacin coloque de nuevo el cursor
mapa.

en el

Para eliminar el marcador, haga clic en Quitar.

Para registrar la configuracin de Street View:


1.

Con la accin de clic establecida como Street View,


utilice los controles de zoom y panormica para
establecer la vista; as se establece la direccin
(Encabezado), el ngulo (Tono) y el aumento (Zoom).

2.

Haga clic en Grabar vista.

Adicin de anuncios
Google Adsense es un servicio gratuito de Google que le permite
colocar espacio publicitario en sus pginas web. Los visitantes de
las pginas vern anuncios relacionados con el tipo de contenido de
su sitio. El visitante se beneficia de oportunidades de compras
personalizadas y de fcil acceso mientras que usted, como
desarrollador web, gana dinero para compensar los costes de
alojamiento o para hacerse rico rpidamente!
Para aadir publicidad, los desarrolladores web deben contar con
una cuenta aprobada de Google Adsense
(www.google.com/adsense), en la que podrn elegir el tipo y el
formato de anuncios que se mostrarn; cada anuncio se denomina
unidad. Puede copiar y pegar un fragmento de cdigo generado
por unidad del sitio web de Google Adsense y pegarlo en el
cuadro de dilogo Anuncio de Google Adsense de WebPlus.
Los tipos de anuncios incluyen la unidad de anuncio bsico, de
imagen, de enlace y de vdeo. Los formatos varan segn el tipo de
unidad, pero van desde el anuncio superior (728x90 pxeles), el
banner (468x60 pxeles), el medio titular (234x60 pxeles), el
botn (125x125 pxeles) hasta distintos tamaos de rascacielos,
cuadrados y rectangulares.

126 Adicin de objetos web


Google Adsense tambin ofrece exhaustivos informes de uso,
gestin de cuentas, un filtro y recursos de asistencia. Para obtener
ms informacin, visite www.google.com/adsense.
Para abrir una sesin de Google Adsense:

Visite www.google.com/adsense para registrarse o


iniciar sesin en Google Adsense. Haga clic en el botn
Registrarse ahora si es un nuevo usuario o simplemente
inicie sesin usando sus detalles de usuario; a los nuevos
usuarios se les solicitar que introduzcan la direccin
URL de su sitio y el idioma y que acepten los trminos y
condiciones de Google.
Cuando se registre, tendr que esperar a que Google
compruebe que el sitio web se considera adecuado.
Google le enviar la respuesta por correo
electrnico. Si es correcto, puede a crear y gestionar
los anuncios.
El proceso de registro analizar el sitio web y
ofrecer anuncios adecuados al contenido de su sitio
web.

Para crear y gestionar anuncios:


1.

Inicie sesin en Google Adsense.

2.

En Configuracin de Adsense, seleccione Adsense


para contenido y siga al asistente para seleccionar una
unidad de anuncio, su formato, estilo de esquina y un
canal de seguimiento.

3.

Copie el fragmento de cdigo de la unidad de Adsense


generado que se proporciona para la unidad del anuncio.
Tendr que pegarlo en WebPlus.

Adicin de objetos web 127

Para insertar anuncios en el sitio web:


1.

Seleccione la pgina web (o pgina maestra) en la que


desea colocar un anuncio.

2.

Haga clic en Insertar un anuncio de Google Adsense


en el elemento flotante E-Comercio de la barra de
herramientas Objetos web.

3.

Pegue el fragmento de cdigo copiado previamente para


la unidad haciendo clic en Pegar desde el portapapeles.
El cdigo aparecer en el cuadro de dilogo y no lo
podr modificar.

4.

Haga clic en Aceptar.

5.

Ver que el puntero del ratn cambia al cursor Pegar


. Site el cursor donde desee colocar el anuncio y
haga clic en para insertar un anuncio con su tamao
original. No se puede cambiar el tamao del anuncio.

Para editar un anuncio:


1.

Cambie el formato y el color de la unidad del anuncio en


Configuracin de Adsense en el sitio web de Google
Adsense y copie el fragmento de cdigo.

2.

Haga doble clic en el anuncio en la pgina.

3.

Pegue el fragmento de cdigo en el cuadro de texto


haciendo clic en Pegar desde el portapapeles.

4.

Haga clic en Aceptar.

128 Adicin de objetos web

Uso de cajas de luz


Las cajas de luz son una forma sencilla de mostrar versiones
emergentes de mayor tamao de imgenes a partir de miniaturas
que ha aadido al sitio web. Si ha utilizado la funcin de galera
fotogrfica, ya habr tratado este concepto antes. Una gran ventaja
de las cajas de luz es que las imgenes ms grandes se pueden
mostrar a demanda y se superponen a la pgina web despus de
una animacin de deslizamiento.

WebPlus tambin ofrece una funcin sencilla de presentacin de


diapositivas (p. 129) para mostrar una presentacin de imgenes
en la misma pgina web.
Para crear una caja de luz para una imagen en la pgina
web:
1.

Seleccione la imagen (preferiblemente una miniatura).

Adicin de objetos web 129

2.

Cree un hipervnculo a la imagen (haga clic en


Hipervnculo... en el men Insertar; consulte la
p. 105.).

3.

Seleccione Imagen en el men, seleccionando una


ventana de destino de la lista desplegable Tipo de caja de
luz.

4.

(Opcional) Haga clic en Opciones de caja de luz... para


aadir un pie de imagen a la imagen en la caja de luz
usando el cuadro Leyenda.

5.

Haga clic en Aceptar.

Para limitar el tamao de la pantalla de esta imagen de caja de


luz vinculada, WebPlus reduce las imgenes con un tamao
excesivo a un ancho y alto mximos (800 x 660 pxeles
predeterminados), conservando siempre su relacin de aspecto. Las
imgenes con dimensiones originales inferiores a estas
dimensiones mximas se dejan sin cambios. El ancho y alto
mximos se pueden modificar. (Consulte Configuracin de
propiedades del sitio en la p. 40.)
Para crear una caja de luz en una imagen local:

Como anteriormente, pero seleccione la opcin Archivo


en lugar de Imagen.

Tambin tiene la opcin de incrustar o vincular la imagen; de


cualquier forma, la imagen se muestra siempre usando las
dimensiones originales de la imagen.

Presentacin de diapositivas de caja de luz


Se pueden crear sencillas presentaciones de diapositivas de caja
de luz, que se basan en las imgenes ya colocadas en la misma
pgina web. La caja de luz mostrar los controles para desplazarse
por la presentacin de diapositivas.

130 Adicin de objetos web


Para crear una presentacin de diapositivas de caja de
luz:
1.

Cree una caja de luz para una imagen en la pgina web


(como anteriormente):

2.

En el cuadro de dilogo Hipervnculos, haga clic en


Opciones de caja de luz....

3.

En el cuadro de dilogo Opciones de caja de luz,


introduzca un nombre para la presentacin de
diapositivas en la lista desplegable Presentacin de
diapositivas. Esto se usar para que otras imgenes se
aadan a esta presentacin de diapositivas. Haga clic en
Aceptar.

4.

Repita para la imagen siguiente en la misma pgina. El


nombre previamente creado para la presentacin de
diapositivas se mostrar para otras imgenes. Seleccione
el nombre de la presentacin de diapositivas que se desea
incluir.

5.

(Opcional) Introduzca el texto de cabecera.

6.

Haga clic en Aceptar.


Las presentaciones de diapositivas de caja de luz se
aplican nicamente a las imgenes de la misma
pgina. Si las imgenes se aaden a una
presentacin de diapositivas de varias pginas, se
crear una nueva presentacin de diapositivas para
cada pgina.

Cajas de luz a cualquier destino de


hipervnculo
Las cajas de luz no solo se limitan a la visualizacin de imgenes.
Como una caja de luz es en realidad un tipo de ventana, cualquier
destino de hipervnculo se puede mostrar en ella, que

Adicin de objetos web 131

normalmente es una pgina del sitio (p. ej., un formulario o una


pgina de inicio de sesin), una pgina de Internet, un blog, un foro
o una fuente RSS. Tambin puede ver un archivo de Word, PUF o
cualquier otro tipo de archivo (usando la opcin Archivo) en la
caja de luz.
Para crear una caja de luz a cualquier destino de
hipervnculo:
1.

Seleccione un objeto (imagen, botn o cualquier otro


objeto).

2.

(Cree un hipervnculo a la imagen (haga clic en


Hipervnculo... en el men Insertar o haga clic con el
botn secundario del ratn).

3.

Asegrese de que la ventana de destino de la lista


desplegable Tipo est establecido a Caja de luz.

4.

(Opcional) Haga clic en Opciones de caja de luz... para


establecer las dimensiones de Ancho y Alto de la caja de
luz.

Configuracin de las propiedades globales de


caja de luz
Como con la mayora de la configuracin de WebPlus, puede
personalizar la configuracin de caja de luz para el sitio actual. La
configuracin se pueden ajustar para los controles generales de la
caja de luz (incluido el tipo de borde), los controles de cabecera
(fuente, tamao de fuente, color de la fuente, opacidad) y el fondo
(color y opacidad).
Para editar las propiedades de la caja de luz para su
sitio:
1.

En Archivo>Propiedades del sitio..., seleccione la


opcin de men Caja de luz.

132 Adicin de objetos web


2.

Editar la configuracin en las secciones General,


Leyenda y Configuracin de fondo.

3.

(Opcional) Obtenga una vista previa del sitio en el botn


Previsualizar caja de luz..., ajuste la configuracin
entre las vistas previas.

Cajas de luz de la galera fotogrfica


Puede crear galeras fotogrficas de estilo de caja de luz (consulte
la p. 362) si est utilizando una galera fotogrfica JavaScript
Photo Gallery; hay disponible un estilo de galera especficamente
para las cajas de luz.

Si elige este estilo, puede establecer la configuracin de caja de luz


que invalidar la configuracin global de las propiedades del
sitio.

Insercin de paneles
Los paneles son cuadros rectangulares de informacin
superpuestos en el sitio web. Contienen texto o grficos, o ambos.
La capacidad de superponer paneles significa que puede aumentar
la cantidad de informacin disponible para el visitante web sin
editar el contenido subyacente de la pgina web.
Los paneles se pueden crear para que se muestren solo cuando sea
necesario, al hacer clic o al pasar sobre los botones, objetos de la
galera o imgenes. Tambin se pueden crear para que se
muestren de forma permanente, ideal para las barras de navegacin
que nunca desaparecen al desplazarse por la ventana.

Adicin de objetos web 133

Los paneles son verstiles y se pueden usar para mostrar:

Eventos mostrados

Informacin de ventas

Formularios de comprar ahora de PayPal

Consejos y trucos tiles

Informacin de acceso rpido como detalles de contacto


y atajos del teclado

Navegacin siempre activada" (Consulte la Ayuda de


WebPlus para obtener ms informacin)

Ampliador de la imagen

Para ayudarle a crear paneles profesionales, WebPlus proporciona


una impresionante seleccin de fondos modernos en los que basar
su panel. Tambin puede personalizar la opcin de fondo o crear
un fondo del panel desde cero en Design Studio de WebPlus
(consulte la p. 137).

Insercin del panel


Para insertar un panel:
1.

En el elemento flotante Navegacin


de la barra
de herramientas Objetos web, haga clic en Insertar
panel

2.

(Opcional) En el cuadro de dilogo, proporcione un Id.


de HTML para el panel. Se puede quedar as, ya que el
Id. siempre se nico.

134 Adicin de objetos web


3.

En el cuadro de dilogo, haga clic en el cuadro de vista


previa del panel.

4.

Seleccione un tipo de panel preestablecido del elemento


flotante. El cuadro de vista previa se actualiza con el
diseo del panel elegido.

5.

(Opcional) Arrastre el control deslizante de


Transparencia para establecer la transparencia con la
que aparecer el panel con respecto al fondo. Tendr que
obtener una vista previa de la pgina para ver los
cambios.

6.

Active la opcin Alinear panel con ventana del


navegador para hacer que el panel siempre est
disponible y fijo en una posicin cuando el visitante web
se desplace por el sitio web. Establezca una Alineacin
horizontal y Alineacin vertical para controlar la
colocacin del panel.

7.

(Opcional) Active la opcin El panel est oculto


inicialmente para que el panel se oculte al salir del
cuadro de dilogo. Normalmente, esto se puede dejar sin
marcar para poder disear primero el panel.

8.

Haga clic en Aceptar.

9.

Site el cursor donde desee colocar la esquina superior


izquierda del panel.

10. Para insertar el panel con el tamao predeterminado,


simplemente haga clic con el ratn.
O bien:
Para definir el tamao del panel, arrastre una regin y
suelte el botn del ratn.
Los paneles pueden moverse y redimensionarse, al
igual que cualquier objeto que cree en WebPlus.

Adicin de objetos web 135

Para editar un panel:

Haga doble clic en el panel y modifquelo como se ha


descrito anteriormente.

Adicin de contenido al panel


Debe tratar el panel como un componente vaco que se puede
desarrollar usando las herramientas y caractersticas estndar de
WebPlus. Al crear objetos dentro del rea del panel, estas
pertenecen al panel. Esto se extiende a los objetos como marcos de
texto, texto artstico, tablas, QuickShapes e imgenes. Arrastrando
la zona de alrededor del panel se movern los objetos asociados.

Mostrar/ocultar el panel
Por qu que podra querer ocultar el panel una vez que lo ha
diseado? El potencial de los paneles incluye la capacidad de
ocultarse y volver a mostrarse como resultado de pasar el ratn por
el objeto de una pgina o hacer clic en l. Esto significa que los
botones, las imgenes y los objetos de la galera pueden revelar
informacin ms detallada solo cuando sea necesario.
Para permitir que esto ocurra, el objeto
tiene que activarse, es decir, se realiza
una accin en respuesta al
desplazamiento o clic del ratn.

Esto se hace asignando una accin (Consulte la Ayuda de WebPlus


para obtener ms informacin) y un panel ya creado al objeto al
mismo tiempo.
Para asignar una accin y un panel:
1.

Haga clic con el botn secundario en el objeto y


seleccione Acciones....

136 Adicin de objetos web


2.

En el cuadro de dilogo, haga clic en Aadir... y


seleccione Visibilidad del elemento flotante.

3.

Seleccione el panel de la lista desplegable de Id. del


panel y, a continuacin, seleccione un evento de la lista
desplegable Evento. El evento se refiere al
comportamiento que se produce cuando se lleva a cabo
una accin (es decir, cuando se hace clic en un objeto
dinmico).

4.

(Opcional) De forma predeterminada, se aplica una


animacin difuminada del panel, con la velocidad de la
difuminacin controlable, pero se puede desactivar el
efecto de la animacin desactivando Difuminar.

5.

Haga clic en Aceptar.

Finalmente, el panel puede ocultarse con un solo clic cuando haya


acabado de disearlo.
Para ocultar un panel seleccionado:

En la barra de herramientas de contexto, seleccione


Ocultar panel

El panel se sustituye con un icono de panel oculto. El


panel sigue ah y se puede volver a mostrar de nuevo si se
desactiva el botn Ocultar panel (haciendo clic). La opcin de
ocultar panel es igual que la opcin El panel est oculto
inicialmente.
Cuando se publique la pgina, un elemento dinmico de objeto de
pgina mostrar el panel.

Adicin de objetos web 137

Creacin de fondos personalizados del panel


Si desea seguir modificando el fondo preestablecido seleccionado
(o trabajar desde cero) puede usar Design Studio, un entorno de
diseo de fondo parecido a Button Studio. Le permitir
concentrarse en el diseo del fondo sin distracciones de otros
objetos de la pgina, es decir, el diseo se muestra aislado y
centrado en la pgina.

Para crear un fondo personalizado:

1.

(Opcional) En el cuadro de dilogo Propiedades del


panel, seleccione una opcin preestablecida en la que
basar el nuevo fondo.

2.

En el mismo cuadro de dilogo, haga clic en el botn


Editar
. Design Studio se inicia con el fondo
aumentado para que se ajuste el rea de trabajo.

138 Adicin de objetos web


3.

Mediante el uso de herramientas y pestaas estndar de


WebPlus, personalice el fondo a su gusto, usando la
pestaa Cmo para disear interactivamente el fondo.

4.

Haga clic en Confirmar cambios en la barra de


herramientas principal para salir. El fondo modificado se
actualiza y se devuelve a su posicin original.

Design Studio le permite


selectivamente evitar que los objetos de paneles
aumenten o se estrechen. Los elementos flotantes de
escala horizontal y vertical de la barra de Studio
ofrecen un control absoluto del objeto. Consulte la
pestaa Cmo para obtener ms informacin.

Insercin de separadores
En lugar de disear los separadores a medida que disea la barra
de navegacin personalizada (p. 91), puede crear separadores
independientemente de las barras de navegacin. Los separadores
se utilizan sobre todo entre los botones de los paneles previamente
convertidos a partir de una barra de navegacin.
Para insertar un separador:
1.

En el elemento flotante Navegacin


de la barra
de herramientas Objetos web, haga clic en Insertar
separador

2.

En el cuadro de dilogo, haga clic en el cuadro bicolor


para mostrar un conjunto de elementos flotantes con
valores preestablecidos.

3.

Seleccione un separador preestablecido.

4.

Haga clic en Aceptar.

Adicin de objetos web 139

Para crear un separador personalizado:


1.

En el cuadro de dilogo anterior, haga clic en Editar.

2.

En Design Studio (vase ms arriba), use las


herramientas y pestaas estndar de WebPlus para
personalizar el separador a su gusto, usando la pestaa
Cmo para disear interactivamente el separador.

Adicin de zonas activas


Las zonas activas son una regin de hipervnculo transparente en
una pgina web. Las zonas activas, que normalmente estn
colocadas en la parte superior de los grficos, activas actan como
"botones" que responden cuando se hace clic en un navegador web.
Son especialmente tiles si desea que el visitante pueda hacer clic
en distintas partes de una imagen. Puede dibujar y editar zonas
activas a mano, o crearlas para que coincidan con una forma o rea
existente.
Para dibujar una zona activa:
1.

Haga clic en el botn Insertar zona activa


barra de herramientas Objetos web.

2.

Haga clic y arrastre para dibujar una regin de zona


activa rectangular. El cuadro de dilogo Hipervnculos se
muestra.

3.

Haga clic para seleccionar el tipo de destino del vnculo


y escriba el destino de hipervnculo especfico (consulte
Seleccin de un hipervnculo de destino en la pg. 1).

4.

Haga clic en Aceptar. Un rea de zona activa aparecer


en la pgina.

en la

140 Adicin de objetos web

Para que una zona activa coincida con una forma


existente:
1.

Dibuje la zona activa como se ha descrito anteriormente


y cree la forma segn lo descrito en Dibujo y edicin de
formas en la pg. 380.

2.

Seleccione ambos objetos y seleccione Ajustar zona


activa a la forma del men Herramientas. El rea de
zona activa coincide con el contorno de la forma. En la
publicacin, solo la forma responde a un desplazamiento
con el cursor.

Adicin de objetos web 141

La zona activa y la forma an estarn separadas,


para que pueda eliminar fcilmente la forma si ya no
la necesita despus de haberla utilizado como
plantilla para generar una zona activa de una forma
deseada.
Para modificar un hipervnculo de zona activa:

Con la Herramienta Puntero, haga doble clic en la zona


activa.

El cuadro de dilogo Hipervnculos aparecer y mostrar el destino


actual del vnculo de la zona activa.

Para modificar el hipervnculo, seleccione un nuevo tipo


de destino y/o destino.

Para quitar el hipervnculo, cambie el destino del vnculo


a Sin hipervnculo.

Edicin de zonas activas


Puede moverse y cambiar el tamao de las zonas activas en la
pgina, al igual que con otros objetos. Las zonas activas
seleccionadas tienen un cuadro delimitador externo y un contorno
interior, que sirven para varios fines.

142 Adicin de objetos web


Para mover o cambiar el tamao de una zona activa:

Haga clic para seleccionar la zona activa y, a


continuacin:

Para mover, haga clic y arrastre desde el centro o


desde el cuadro delimitador de la zona activa. Para
limitar la zona activa a movimientos verticales u
horizontales, mantenga pulsada la tecla Mays
mientras arrastra.

Para cambiar el tamao, haga clic y arrastre sobre


los manejadores externos (cuadro delimitador).

Al editar el contorno interior, puede convertir zonas activas


rectangulares en formas libres que coincidan ms con las partes del
grfico subyacente que desee que est activo. Para modificar el
contorno, primero mueva el puntero del ratn sobre el contorno
interior de la zona activa hasta que el cursor cambie para indicar si
est sobre un nodo o una lnea.

Para crear un nodo adicional en una zona activa:

Haga clic en cualquier lugar del contorno de la zona


activa cuando vea el cursor
. Arrastre el nuevo
nodo a la posicin para editar el contorno de la zona
activa.

Adicin de objetos web 143

Para cambiar la forma del contorno de una zona activa:

Haga clic y arrastre un nodo cuando vea el cursor

Adicin de elementos dinmicos


El trmino elemento dinmico se refiere a una interaccin entre el
ratn y una imagen. Por ejemplo, puede apuntar con el ratn a una
imagen, y ver cmo cambia al instante a una imagen diferente (ms
abajo). Una imagen cuyo aspecto cambia en respuesta a un evento
del ratn se denomina grfico dinmico. Los eventos del ratn son
normalmente el desplazamiento con el ratn o la pulsacin del
botn del ratn: el estado del grfico cambia como respuesta a
estos eventos del ratn, pasando a otra variante de la imagen
original.
Puede importar directamente grficos dinmicos creados en Serif
DrawPlus. (Consulte la Ayuda de WebPlus para obtener ms
informacin.)

Opciones de los elementos dinmicos


La adicin de elementos dinmicos es bsicamente decidir qu
estado quiere definir y, a continuacin, especificar una variante de
la imagen para cada estado elegido. WebPlus proporciona varias
opciones:

144 Adicin de objetos web

El estado Normales

el estado "en
reposo" de la
imagen antes
de cualquier
estado
dinmico, y
est siempre
definido.

El estado Sobre

se activa con el
paso del ratn:
cuando el
puntero del ratn
se encuentra
directamente
sobre la imagen.

El estado Abajo

se activa haciendo
clic con el ratn y
manteniendo el
botn pulsado
mientras est
sobre la imagen.

Otro estado, Abajo+Sobre (no ilustrado), implica un movimiento


del ratn cuando la imagen ya est abajo, es decir, despus de que
se haga clic en l.
Tambin puede especificar un evento de hipervnculo (por
ejemplo, pasar a una pgina web de destino), que se activar si el
usuario suelta el botn del ratn mientras est en estado Abajo.
Tambin puede agrupar botones en una pgina para que funcionen
juntos, y solo un botn en el grupo puede estar en el estado "abajo"
cada vez.

Adicin de objetos web 145

Para crear un grfico dinmico:


1.

En un programa de edicin de imgenes adecuado, cree


las imgenes de origen variantes para cada estado que va
a definir. (Consulte "Creacin de imgenes variables" a
continuacin.)

2.

Haga clic en Insertar elemento dinmico


en el
elemento flotante Imagen de la barra de herramientas
Objetos estndar.

3.

Especifique qu estados dinmicos (vase ms arriba)


desea activar para cada imagen; para ello, active las
casillas de verificacin correspondientes en el cuadro de
dilogo Grfico dinmico. Para cada uno, use el botn
Examinar para localizar la imagen de origen
correspondiente y especifique las Opciones de
exportacin para esa imagen (consulte Configuracin de
opciones de exportacin de imgenes en la pg. 333).

4.

Active la opcin Insertar archivos en el sitio si desea


incorporar la imagen en el sitio.

5.

Seleccione Normal o Abajo como el estado dinmico


inicial del botn.

6.

(Opcional) Haga clic en Establecer... para definir un


objetivo de hipervnculo para el botn.

7.

Seleccione Botn de opcin si desea crear un vnculo a


todos los botones (en una determinada pgina) que
tengan esta opcin activada para que slo uno de ellos
pueda estar en el estado "abajo" cada vez.

8.

Haga clic en Aceptar.

WebPlus muestra la imagen asignada al estado Normal. Es una


buena idea obtener una vista previa de la pgina y comprobar
cada imagen dinmica; a continuacin, vuelva a WebPlus y repase
lo que sea necesario. Cuando se obtiene la vista previa o se publica

146 Adicin de objetos web


el sitio, WebPlus se encarga de exportar un archivo de imagen para
cada estado de elemento dinmico, y el archivo HTML para la
pgina publicada incorpora el cdigo de JavaScript para capturar el
evento del elemento dinmico.
Para editar un grfico dinmico:
1.

Haga clic con el botn secundario del ratn (o doble clic)


en el grfico dinmico y elija Editar dinmico....

2.

Haga las nuevas selecciones segn sea necesario y haga


clic en Aceptar.

Creacin de imgenes variables


Para cada objeto con al menos un estado dinmico activado, deber
proporcionar una imagen de origen. Las sutiles diferencias entre la
imagen "normal" y las "variantes" son las que hacen que el objeto
parezca cambiar de un estado a otro. Por ejemplo, si ha activado el
estado "Sobre" para un objeto, debe incluir una imagen variante
que pueda mostrar la pgina web cuando se pase el ratn por
encima del botn.

Adicin de elementos dinmicos


emergentes
El uso ms comn de los elementos emergentes dinmicos en
WebPlus es desplazarse sobre la miniatura de una imagen para
mostrar una representacin ms grande, a menudo junto a la
miniatura. La funcin es muy sencilla de usar y funciona del
mismo modo que la Galera fotogrfica ms avanzada. Los
elementos dinmicos emergentes tienen solo dos estados (normal y
desplazamiento) y muestran la misma imagen o una diferente ms
grande en el estado de desplazar; compare esto con los elementos
dinmicos de WebPlus que tienen hasta cuatro estados y
nicamente funcionan con imgenes iguales de distinto tamao.

Adicin de objetos web 147

WebPlus le permite elegir la posicin y el tamao del elemento


emergente en relacin con la miniatura sobre la que se realiza la
accin de desplazar; incluso la miniatura se puede seleccionar y
redimensionar en cualquier momento.
Si es necesario que los elementos emergentes tengan leyenda, se
puede hacer que estos aparezcan junto a la imagen del estado
Sobre. El texto de la leyenda pueden adoptar diferentes atributos
como fuente, negrita o cursiva, tamao o color.
Para crear un elemento dinmico emergente:
1.

Haga clic en el botn Elemento dinmico emergente


en el elemento flotante Imagen de la barra de
herramientas Objetos estndar.

2.

En el cuadro de dilogo, para la imagen del elemento


dinmico Normal haga clic en el botn Examinar... y
localice y seleccione la imagen. Haga clic en Abrir.....

148 Adicin de objetos web


3.

Para la imagen Sobre se utiliza de forma predeterminada


la imagen Normal previamente elegida (normalmente
para las miniaturas de fotografa). No obstante, puede
utilizar Examinar... para utilizar una imagen diferente.

4.

(Opcional) Para crear un hipervnculo de la imagen


Normal, haga clic en el botn Establecer... e introduzca
una direccin URL. El usuario salta al destino del
hipervnculo haciendo clic en la imagen.

5.

(Opcional) Para cualquier imagen, especifique las


Opciones de exportacin... para esa imagen (consulte
Configuracin de las opciones de exportacin de
imgenes en la p. 333).).

6.

(Opcional) Active la opcin Insertar archivos de


imagen en el sitio si desea incorporar la imagen en el
sitio.

Para que los elementos dinmicos emergentes funcionen


correctamente, necesita colocar las imgenes Normal y Sobre en la
pgina. La colocacin se realiza desde un cuadro de dilogo
especfico, donde cada imagen de estado se puede mover y
redimensionar arrastrando (o determinando las valores absolutos de
pxeles). Cada imagen adopta borde de color: verde para el estado
Normal y azul para el estado Sobre.
Para colocar las imgenes dinmicas:
7.

En el cuadro de dilogo Grfico dinmico, haga clic en el


botn Establecer posicin de elemento dinmico... de
la parte inferior del cuadro de dilogo.

8.

En el cuadro de dilogo, seleccione una imagen. La lista


desplegable indica el estado actual de la seleccin, es
decir:

Seleccin Normal: se selecciona una imagen


Normal y se muestra un borde verde.

Adicin de objetos web 149

Seleccin Sobre: se selecciona una imagen Sobre


que muestra un borde azul.

Seleccin de leyenda: se selecciona el texto de la


leyenda mostrando un borde rojo (se mostrar solo
si la leyenda est activada).

Si no seleccin una imagen, la lista desplegable muestra Sin


seleccin.
9.

Puede colocar las selecciones arrastrando o


redimensionando las selecciones desde los controladores
de las esquinas (la relacin de aspecto se mantiene
siempre al arrastrar). Tambin puede introducir
exactamente los valores de Izquierda, Derecha, Ancho
y Alto en los cuadros de entrada para un posicionamiento
ms preciso. Las flechas hacia abajo del cuadro ofrecen
una lista desplegable que muestra los tres ltimos valores
utilizados para Normal, Sobre y Leyenda (desde la parte
superior a la inferior); esto le permite alinear las
imgenes de forma exacta.

10. (Opcional) Active la opcin Posicin con respecto a la


imagen normal para mantener la posicin de la imagen
Sobre en relacin a la imagen Normal (cuando la imagen
Normal se redimensiona).
11. (Opcional) Desactive la opcin Mantener relacin de
aspecto para permitir que el cambio de tamao de las
imgenes Normal y Sobre sea proporcional. Tiene que
utilizar los cuadros de entrada (sin arrastrar) para que se
afecte al cambio de tamao sin restricciones.
12. Haga clic en Aceptar. La imagen Normal se mostrar en
la pgina, pero la imagen Sobre solo aparecer como
emergente al obtener una vista previa o al publicar.
Aadiendo imgenes de estado Normal adicionales como
elementos dinmicos emergentes separados en el sitio web puede
crear una galera inteligente emergente de imgenes, donde cada

150 Adicin de objetos web


imagen Normal sea parte de una secuencia de miniaturas en las que
se puede hacer clic.
Para editar un elemento dinmico emergente:

Haga doble clic en la imagen Normal en la pgina, para


mostrar el cuadro de dilogo Grfico dinmico.
Modifique los ajustes segn sea necesario.

Para aadir leyendas a imgenes de estado Sobre:


1.

En el cuadro de dilogo Grfico dinmico, active


Mostrar leyenda con Sobre imagen.

2.

Escriba el texto de la leyenda en el cuadro de entrada


Leyenda.

3.

Establezca los atributos del texto de la leyenda usando


las listas desplegables Fuente y Tamao y las casillas de
verificacin Negrita y Cursiva. Para aplicar color al
texto, utilice la galera desplegable Color del texto.

4.

Active Aplicar color de fondo para poder seleccionar un


color de la galera desplegable adyacente.

5.

Haga clic en Aceptar.

El texto de la leyenda solo est relacionado con la imagen Sobre,


as que para colocar el texto junto a la imagen Sobre tendr que
hacer doble clic en la imagen Normal en la pgina. En el cuadro de
dilogo, haga clic en el botn Establecer posicin de elemento
dinmico... y cambia la posicin del texto (como lo hara para las
imgenes Normal y Sobre). Todo el texto seleccionado de la
leyenda se muestra con un borde rojo durante la vista previa.

Adicin de objetos Web


dinmicos

152 Adicin de objetos web dinmicos

Adicin de objetos web dinmicos 153

Asociacin de cdigo HTML


En WebPlus, puede crear pginas en HTML (consulte Creacin de
pginas HTML en la pg. 76). No obstante, WebPlus tambin
permite adjuntar cdigo a los objetos de WebPlus (p. ej., en marcos
o celdas de tabla) y a las pginas, para ampliar las funciones de los
objetos (o la pgina), hacindolos ms inteligentes e interactivos.
El objeto o la pgina pueden generar dinmicamente contenido o
hacer que su aspecto se altere dentro del rea como resultado del
contenido de scripts incrustados.
No se puede modificar el cdigo HTML en s mismo (no hay
ninguna ventaja real en ello), pero algunas reas concretas del
cdigo mostrado se pueden editar para que se pueda aadir cdigo
adicional; es decir, los marcadores claramente identificables (texto
rodeado por un resaltado blanco) aparecern en la ventana de la
pestaa Origen.

154 Adicin de objetos web dinmicos


Estos son solo algunos de los marcadores editables presentes en el
cdigo fuente de un objeto, pgina o fragmento HTML (de hecho
existen marcadores con nombres ligeramente diferentes en funcin
del tipo de elemento). Por ejemplo, el ltimo marcador mostrado
en la lista anterior es nico al cdigo fuente de una pgina y no
aparecer para un objeto o un fragmento HTML.
Cualquier cdigo se puede insertar mediante el mtodo de cortar y
pegar en cualquiera de las posiciones de los marcadores, pero por
lo general puede incluir distintivos, cdigo HTML o scripts
concretos, p. ej. JavaScript. Esto se puede usar para influir en el
comportamiento dinmico sobre un objeto, que no sera posible sin
la funcin de la creacin de scripts, p. ej. un controlador de "hacer
clic en un imagen.

Adicin de HTML
WebPlus tambin permite ver el cdigo fuente de una pgina,
con lo que se puede aadir cdigo HTML adicional a la pgina.
Usando este mtodo, puede incluir fragmentos copiados de otra
pgina web o quizs escritos por usted mismo.
Tambin puede importar texto HTML con formato de un
navegador o programa de correo electrnico mediante el
Portapapeles (por ejemplo con los comandos Seleccionar todo y
Copiar del navegador), a travs del comando Archivo>Pegado
especial... de WebPlus.
Antes de importar el cdigo HTML, WebPlus le permite colocar
una ventana de fragmento de cdigo HTML en la pgina. Puesto
que no podr ver el efecto de HTML hasta que obtenga una vista
previa del sitio, tenga cuidado de colocar la ventana
correctamente. Querr comprobar definitivamente su pgina web
en un navegador. Si existe algn problema, compruebe el cdigo
introducido con minuciosidad y colquelo en la pgina de WebPlus
(cambie el tamao si es necesario). Si tiene algunos conocimientos
de HTML, examine el cdigo fuente en un editor de texto como el
Bloc de notas o use el modo para ver el cdigo fuente del
navegador.

Adicin de objetos web dinmicos 155

Para aadir un fragmento de cdigo HTML a una pgina:


1.

Copie el cdigo HTML del cdigo fuente original al


Portapapeles.

2.

Haga clic en el botn Insertar cdigo HTML


la barra de herramientas Objetos web.

3.

Haga clic en la pgina o en el rea de pegado para crear


una nueva ventana de fragmento de cdigo HTML con
un tamao predeterminado, o arrastre para crear una
ventana con otro tamao.

4.

En el cuadro de dilogo, utilice el botn Pegar en


cabecera o Pegar en cuerpo para insertar el texto del
portapapeles en el encabezado del archivo o en el cuerpo.
O bien:
Utilice la ventana de cdigo por la que se puede
desplazar. Introduzca uno o varios fragmentos de cdigo
HTML en el campo correspondiente.

5.

(Opcional) Si el cdigo pide archivos externos, use el


botn Aadir... para ubicarlos. Haga clic en el botn de
Hacer vnculo si desea conservar los archivos separados
del sitio.

6.

Haga clic en Aceptar para cerrar el cuadro de dilogo. El


cdigo aparecer en la pgina en la ventana de fragmento
de cdigo HTML.

en

Adicin de JavaScript
Para crear una amplia variedad de cdigo JavaScript, busque
fragmentos de javascript en el motor de bsqueda que prefiera.
Encontrar muchsimos sitios que ofrezcan fragmentos de cdigo
gratuitos. La mayor parte de estos sitios indicarn claramente lo
que JavaScript har por usted. Adems, por lo general tambin le
permiten seleccionar el cdigo de JavaScript y copiarlo para
pegarlo en una ventana de fragmento HTML, en una ventana de

156 Adicin de objetos web dinmicos


cdigo fuente de un objeto o una pgina, en la celda de una tabla
HTML o directamente en la pgina.
Veamos cmo aadir JavaScript (obtenido o escrito por usted
mismo si tiene experiencia en programacin con JavaScript).
Como ejemplo, compare los dos fragmentos de cdigo de ejemplo
a continuacin. Un fragmento de cdigo de JavaScript muy
sencillo se aade a la ventana Origen, que presentar la fecha
actual en el sitio web. La primera seccin del cdigo utiliza el
ltimo marcador de la anterior lista () y la segunda, el aspecto del
cdigo despus de que un script haya sustituido al marcador.

Cdigo que muestra el marcador

Adicin de objetos web dinmicos 157

Cdigo despus de aadir JavaScript


Este ejemplo muestra dnde se coloca el cdigo sencillo en una
ventana Origen.
Para adjuntar cdigo a un fragmento HTML o a un
objeto:
1.

Seleccione un fragmento HTML o un objeto existente.

2.

En el men Formato, seleccione Adjuntar HTML....


O bien:
Haga clic con el botn secundario del ratn en el objeto y
seleccione la misma opcin.

158 Adicin de objetos web dinmicos


3.

En el cuadro de dilogo, desplcese por la ventana


Origen para buscar los marcadores editables. El
marcador que elija depende de lo que desee lograr.

4.

Seleccione todo el marcador y pegue el HTML, el script


o cualquier otra cadena de texto que sustituya al texto de
marcador de posicin.
O bien:
Seleccione todo el marcador y escriba directamente en la
ubicacin del marcador (de nuevo, sustituyendo el texto
de marcador de posicin).

5.

Haga clic en el botn Aceptar para volver a la vista de


pgina normal.
Puede utilizar los distintivos para aadir variables
al HTML. Se usa para el desplazamiento de la ruta
de navegacin que se actualizar dinmicamente si
aade, quita o modifica pginas dentro del sitio.

Para creacin de scripts ms complejos, puede que sea necesario


aadir archivos auxiliares (grficos, archivos de texto, etc.) que el
script insertado pueda utilizar (pueden insertarse o vincularse).
Esto significa que los archivos se pueden conservar tanto en el sitio
(incrustados) o que se hace referencia a ellos externamente
mediante un vnculo (como un hipervnculo). Tenga en cuenta el
tamao final del sitio al insertar varias imgenes.
Para aadir archivos auxiliares:
1.

Haga clic en el botn Aadir....

2.

En el cuadro de dilogo Abrir, desplcese a un o varios


archivos y seleccinelos (use Ctrl-clic y Mays-clic
para seleccionar archivos de forma no-contigua o
contigua, respectivamente). Haga clic en Abrir.

3.

Los archivos se muestran en la lista Archivos y se


incrustarn en el sitio de forma predeterminada. Si elige
no Insertar los archivos (para que su sitio sea ms

Adicin de objetos web dinmicos 159

pequeo), seleccione cada archivo y haga clic en el botn


Hacer vnculo.
4.

Haga clic en Aceptar.

En cualquier momento, puede Aadir, Eliminar y cambiar las


Opciones de exportacin de cualquier archivo.
Para adjuntar cdigo a una pgina:
1.

Haga clic en Adjuntar HTML


herramientas Estndar.

2.

En el cuadro de dilogo, desplcese por la ventana para


buscar los marcadores editables. El marcador que elija
depende de lo que desee lograr.

3.

Seleccione todo el marcador y pegue el HTML, el script


o cualquier otra cadena de texto que sustituya al texto de
marcador de posicin.
O bien:
Seleccione todo el marcador y escriba directamente en la
ubicacin del marcador (de nuevo, sustituyendo el texto
de marcador de posicin).

4.

Para volver a la vista de pgina normal, haga clic en la


pestaa del proyecto en la parte superior de la ventana
Origen.

en la barra de

Uso de identificadores
A los objetos, las columnas de texto, las filas de la tabla y las
celdas de la tabla siempre se les asigna un Id. de HTML
alfanumrico nico, por ejemplo, un Id. de qs_1, qs_2", etc. se
crear para un nuevo QuickShape. Estos Id. pueden escribirse
durante la exportacin para permitir las referencias mediante
lenguajes de script en el sitio publicado. De forma predeterminada,
no se escriben en la exportacin para todos los objetos (de forma
global), sino que se pueden exportar por objetos.

160 Adicin de objetos web dinmicos


Para escribir (exportar) un Id. (por objeto):
1.

Haga clic con el botn secundario del ratn en un objeto


y seleccione Id....

2.

En el cuadro de dilogo, en la lista desplegable Id. de


escritura para este objeto, seleccione S.
Si se selecciona Usar config. predeterm. del sitio
significa que est activada la configuracin de las
propiedades del sitio; "S" o "No" significa que el Id.
de objeto se escribe en la exportacin o no se
escribe con independencia de la configuracin
predeterminada del sitio.

Para escribir (exportar) los Id (de forma global):

En Archivo>Propiedades del sitio (opcin de men


Salida HTML), active las casillas de verificacin
apropiadas para el objeto, la columna de texto, la fila de
la tabla o la celda.

Si el objeto se copia en la misma pgina o en otro


sitio web, el nmero de Id. se reemplazar por un
nuevo nmero de Id.
Si necesita definir un nombre personalizado para el Id., puede
hacerlo mediante el cuadro de dilogo Editar Id. de objeto.

Adicin de objetos web dinmicos 161

Para modificar el nombre del Id. de un objeto:


1.

Haga clic con el botn secundario del ratn en un objeto


y seleccione Id....

2.

En el cuadro de dilogo, edite el valor del Id. de HTML.

Distintivos
WebPlus ofrece una gama de distintivos de anotacin de HTML
agrupados que se pueden adjuntar a pginas, objetos o fragmentos
de HTML. Se sustituyen por los valores apropiados "reales"
cuando se exportan a un archivo o se obtiene la vista previa de la
pgina.
La adicin de distintivos es un caso sencillo de insercin de una
cadena de smbolos mediante el mtodo de copiar y pegar o
escribiendo directamente en las posiciones de marcadores en
cualquier cdigo fuente HTML.
En la Ayuda de WebPlus se ofrece una lista completa de distintivos
(busque distintivos en el ndice).

Adicin de formularios
Los formularios basados en web permiten recopilar, de forma
eficiente y moderna, informacin sobre las personas que visitan su
sitio web. La idea de cumplimentacin de los formularios web es
muy similar a la de los formularios de papel convencionales, pero
con la ventaja de aprovechar Internet como un potente canal de
informacin. Entre los tipos ms frecuentes de formulario se
encuentran los de solicitud, los de comentarios y los libros de
visitas.
Los datos de los formularios pueden recopilarse de distintas
formas: por correo electrnico, en un archivo de script local o
remoto o a travs de Recursos Web Serif.

162 Adicin de objetos web dinmicos

Estructura del formulario


Los componentes de un formulario son una combinacin de texto,
grficos y controles de formulario. Los controles de formulario
actan de forma inteligente, ya que recopilan datos del visitante
web y se pueden aadir, mover y modificar del mismo modo que
los objetos ya conocidos de WebPlus, como son los grficos y las
tablas. Un control puede ser un botn, un cuadro de opcin, un rea
de texto, un cuadro combinado, una casilla de verificacin, un
botn de opcin, un objeto CAPTCHA o un explorador de
archivos. Un formulario normal, como puede ser un formulario de
envo de comentarios por correo electrnico, est compuesto de
una combinacin de algunos de estos controles.
Desde la perspectiva del visitante web, la informacin se escribe en
cuadros de texto o se selecciona en casillas de verificacin, botones
de opcin o cuadros desplegables. La informacin que se escriba
puede ser numrica, textual o una combinacin de ambos tipos, en
funcin del tipo de campo. El orden de pestaas en el que deben
rellenarse los campos puede configurarse, al igual que la
validacin de los datos de entrada (consulte la Ayuda de WebPlus
para obtener ms informacin sobre el orden de pestaas y la
validacin).
Cada campo posee su propio conjunto de propiedades en relacin
con su aspecto, sus valores, la validacin, los clculos o la accin
que se espera del campo.
La funcionalidad de un formulario se activa cuando se publique el
sitio web (por supuesto an puede obtener una vista previa de
formularios de WebPlus, consulte Vista previa del sitio en la
pg. 421). Cuando un visitante web introduce datos en un
formulario o selecciona una opcin de un formulario, los datos se
mandan a un destino elegido cuando se enva el formulario.
Se puede utilizar JavaScript para activar la interactividad en los
formularios web. Ofrece la posibilidad de aplicar formato, validar,
calcular y realizar acciones; todas ellas, funciones clave en el
desarrollo de formularios web.

Adicin de objetos web dinmicos 163

Dnde se envan los datos?


Tras finalizar el envo, los datos de los formularios se pueden
mandar a uno de los siguientes destinos:

una direccin de correo electrnico (del desarrollador


web)

un archivo de script (almacenado de forma local o


remota), que puede escribir texto en un archivo de texto
o en una base de datos de un servidor

Recursos Web Serif, para el trnsito de datos de


formulario al correo electrnico (a travs de Serif)

Como es habitual en la administracin de formularios web, es


posible definir el tipo de codificacin, la ventana/marcos de destino
y los mtodos de envo (POST o GET).

Creacin de formularios
Existen varias formas de crear formularios: puede crear un
formulario predefinido estndar, listo para usar (opuesto),
seleccionar uno a uno los controles de formulario o crear un
formulario desde cero; para los dos primeros mtodos se utiliza un
Asistente para formularios de fcil utilizacin.
Existen formularios estndar para formularios de informacin de
contacto, comentarios del usuario, envo de CV, opinin y
direccin.
Para crear un formulario estndar:
1.

Haga clic en el Asistente para formularios


, en el
elemento flotante Formulario de la barra de herramientas
Objetos web.

164 Adicin de objetos web dinmicos


2.

En el cuadro de dilogo, haga clic en el icono Usar y


adaptar un formulario estndar y, a continuacin, en
Siguiente>.

3.

En la lista de formularios, seleccione un tipo de


formulario mientras usa el panel de vista preliminar
inferior.

4.

Haga clic en Siguiente>.

5.

En la siguiente pantalla, puede elegir entre aadir,


modificar y eliminar controles.

Para aadir, haga clic en un botn del cuadro


Agregar.

Para modificar un objeto estndar, seleccione un


control existente en la ventana y elija Editar
control.... Para ms informacin, consulte Edicin
de controles de formulario en la pg. 170.

Para eliminar un objeto estndar, seleccione un


control existente en la ventana y elija Eliminar (o
presione la tecla Supr).

Para reorganizar el orden del control, utilice los


botones Subir

y Bajar

6.

Despus de hacer clic en Siguiente, elija el destino de los


datos del formulario haciendo clic en un botn de
destino. Seleccione Finalizar para completar el asistente.

7.

Para insertar el formulario con un tamao


predeterminado, coloque el cursor en el lugar del
formulario y haga clic.

Si lo que busca es libertad de diseo, WebPlus ofrece un


formulario en blanco y objetos de formulario desde los que puede

Adicin de objetos web dinmicos 165

disear el formulario desde cero. Puede aadir controles de


formulario u objetos de formulario estndar, o ambos. Consulte la
Ayuda de WebPlus para obtener ms informacin.
Para crear un formulario personalizado (a travs del
Asistente para formularios):
1.

, en el
Haga clic en el Asistente para formularios
elemento flotante Formulario de la barra de herramientas
Objetos web.

2.

En el cuadro de dilogo, haga clic en el icono Crear un


nuevo formulario con el Asistente y, a continuacin, en
Siguiente>.

3.

En la siguiente pantalla, debe aadir los controles de


formulario que compondrn el formulario. En el cuadro
Agregar:

Para un control de formulario listo para usar, haga


clic en el botn Predefinido y elija el control de
formulario que haya seleccionado. Debe hacer clic
dos veces en el nuevo control, en la ventana, para
dar un nombre al control.
O bien:

1.

Haga clic en uno de los dems controles de formulario


que desea crear desde cero. Consulte Controles de
formulario en la pg. 166 para obtener una descripcin
de cada opcin.

2.

En el cuatro de dilogo, utilice el nombre interno del


control (para identificarlo de forma exclusiva) o edtelo e
introduzca una etiqueta para que acompae a dicho
control (se muestra en pantalla). Tambin puede editar el
control usando el botn Editar control. La edicin de un
control permite hacer uso de la validacin, controlar la
longitud del formulario y definir otros atributos de
control. Para ms informacin, consulte Edicin de
controles de formulario (Consulte la Ayuda de

166 Adicin de objetos web dinmicos


WebPlus para obtener ms informacin). Si ha editado
un valor, haga clic en Aceptar.
4.

Repita el procedimiento anterior con cada control de


formulario que elija, segn sea necesario. Aparecern (en
el orden en que fueron creados) en la ventana superior.
Antes de continuar, debe aadir un control de formulario
de envo a su formulario. Este paso es crucial para poder
hacer llegar los datos a su destino. Haga clic en el botn
Enviar para aadir automticamente el botn al
formulario. Es normal acompaar esto con un botn
Restablecer, que se usa para borrar campos del
formulario de datos que an no se han enviado. Haga clic
en Siguiente>.

5.

En el siguiente cuadro de dilogo, elija el destino de los


datos del formulario haciendo clic en un botn de destino
para correo electrnico, archivo de script (local o
remoto) o Recursos Web Serif y un nombre para definir
todo el formulario. (Consulte Envo de formularios en
la pg. 171).

6.

Seleccione Finalizar para completar el asistente.

7.

Para insertar el formulario con un tamao


predeterminado, coloque el cursor de posicin del
formulario en la parte de la pgina donde desea que
aparezca y, a continuacin, simplemente haga clic.

Controles de formulario
Cada control de formulario es un objeto "inteligente" distinto de
otros objetos de WebPlus. Son inteligentes porque pueden
almacenar informacin introducida por los visitantes y transmitirla
a una ubicacin central durante el envo del formulario. Los
controles pueden moverse, al igual que ocurre con el resto de
objetos, pero no se les puede aplicar colores ni transparencia, como
tampoco ajustar los bordes ni cambiar de tamao.

Adicin de objetos web dinmicos 167

En el Asistente para formularios o directamente en el elemento


flotante Formulario de la barra de herramientas Objetos web tiene
disponibles distintos controles de formulario. El proceso comienza
por asignar un nombre interno exclusivo para cada campo y, a
continuacin, definir distintas propiedades; cada control de
formulario tiene su propio conjunto, que puede modificarse.
Icono de
control de
formulario

Nombre
de control
de
formulario

Botn del
formulario

Cundo utilizarlo?

Se usa al especificar una


accin que puede
activarse mediante un clic
en el botn. Se pueden
crear una amplia variedad
de botones con diseos y
funciones distintos.
En el Asistente para
formularios dispone de
los botones Enviar y
Restablecer. Estos
botones sirven para
enviar el formulario y
borrar todos sus datos,
respectivamente.

Cuadro de edicin

Se usa para introducir texto de


una sola lnea, nmeros o una
mezcla de ambos. Un buen
ejemplo de uso seran los
apellidos de alguien.

168 Adicin de objetos web dinmicos


rea de texto

Cuadro
combinado

Se usa para aadir texto de varias


lneas, nmeros o una mezcla de
ambos. Suelen utilizarse para
introducer informacin, sea
textual o numrica; por ejemplo,
una encuesta, receta o una lista
de cifras.
Para la seleccin de entre una
lista de elementos en un
men desplegable en el que,
de forma predeterminada,
solo puede seleccionarse un
elemento; por ejemplo, un
cuadro combinado para elegir
el sexo.
Los cuadros combinados
tambin permiten una lista
desplazable de elementos; de
forma opcional, admiten la
seleccin mltiple.
Puede hacer clic mientras
presiona la tecla Mays para
agrupar distintos elementos.
Cuando est diseando
cuadros combinados de
seleccin mltiple, arrastre la
parte superior o inferior del
cuadro combinado para
permitir que se muestren
varios elementos de forma
predeterminada.

Adicin de objetos web dinmicos 169

Casilla

Es ideal cuando desea que se


muestren varios elementos uno
junto a otro. Una buena
alternativa al cuadro
combinado, si el espacio lo
permite. El visitante web del
formulario hace clic una vez
para activar o desactivar la
casilla; por ejemplo,

Le gustara que
se le notificaran los
prximos eventos?
Botn de opcin

Bueno para la seleccin de un


nico elemento exclusivo de
un subconjunto agrupado de
opciones. Por ejemplo, puede
utilizar un conjunto de botones
de opcin para obtener
informacin sobre el sexo del
visitante web.

Navegador de
archivos

Utilice el explorador de
archivos para permitir a los
visitantes web cargar un
archivo desde sus equipos. El
visitante no tiene ms que
desplazarse a travs de un
botn Examinar... y
seleccionar el archivo local
que prefiera. Algunos
ejemplos son la carga de
imgenes, CV, planos e
instrucciones

170 Adicin de objetos web dinmicos


CAPTCHA

Se utiliza como
comprobacin de seguridad
para protegerse frente al
envo de spam. El control
de formulario ofrece una
cadena de texto aleatorio
para que el visitante web la
reproduzca en un cuadro de
texto. Si la comprobacin
se realiza con xito, se
inicia el envo del
formulario, lo que solo
puede hacerse a travs de
Recursos Web Serif.

Si este control no
figura en su formulario,
siempre se inicia una
comprobacin de
puerta CAPTCHA
(p. 171). Si utiliza este
control de formulario,
no se usar la
comprobacin de
puerta CAPTCHA.

Edicin de controles de formulario


Cada tipo de control de formulario (botones, campo de texto, etc.)
tiene distintas caractersticas y, por lo tanto, distintos valores para
editar. Los valores pueden cambiarse durante la creacin del
formulario o ms adelante, una vez que el control se ha aadido al
formulario.

Adicin de objetos web dinmicos 171

El botn Editar control... del Asistente para formularios permite


modificar el control durante la creacin del formulario. Si lo
prefiere, puede editar el control ms tarde, haciendo clic con el
botn secundario en dicho control, en la pgina web, y eligiendo la
opcin Editar correspondiente; por ejemplo, Editar Cuadro de
texto.

Envo de formularios
Todos los formularios tienen algo en comn: deben enviarse para
que los datos se puedan recopilar. Para ello, puede crear un botn
Enviar sin ayuda o, lo que suele ser ms habitual, usar el botn
que ya est preparado en el Asistente para formularios. Este botn
debe figurar en el formulario y suele usarse con un botn
Restablecer para borrar los datos de todos los controles de
formulario.
El envo de datos del formulario es posible a travs de varios
mtodos.

Sin accin

Una
direccin
de correo
electrnico

Los datos del formulario no se envan. Esta


opcin es til si desea deshabilitar
temporalmente la recopilacin de datos o si no
ha configurado an la creacin de scripts o los
Recursos Web Serif. Ms adelante, podr editar
el formulario (haga clic con el botn secundario
y, a continuacin, elija Editar propiedades del
formulario...) y seleccionar un mtodo de envo
vlido.
Utilice esta opcin para omitir los mtodos
habituales de envo POST/GET. Al pulsar el
botn Enviar, se inicia el programa de correo
electrnico predeterminado del visitante web.
Los datos del formulario (transmitidos en una
sola cadena) se aaden al cuerpo del mensaje de
correo electrnico y quedan listos para ser
enviados al destino de correo electrnico
configurado. Resulta especialmente til si no
hay creacin de scripts local o remota en vigor.

172 Adicin de objetos web dinmicos

Se trata de un mtodo de envo no


protegido, ya que no se cifra ninguna
informacin privada o confidencial.
Para configurar directamente el correo
electrnico:
1.

Con el icono activado, aada un


Nombre del formulario.

2.

Introduzca la Direccin de correo


electrnico de destino (o seleccione
una direccin de correo electrnico ya
conocida en el men desplegable).

Esta opcin est pensada para desarrolladores


web con experiencia en la creacin de scripts.
Un archivo
de
secuencia
de
comandos
de mi
unidad de
disco duro

Para configurar un archivo de script


local:
1.

Con el icono Archivo de script


habilitado, aada un Nombre de
formulario.

2.

Desplcese hasta el archivo de script


local, que suele ser un archivo .php,
.js, .cfm, .cgi, .pl, .dll o .exe, con el
botn Examinar....

3.

Active la opcin Insertar archivo


para incluir el script en el sitio. Si la
deja sin activar, el archivo de script no
estar conectado al sitio (las
actualizaciones realizadas en el script
no podrn verse en el sitio).

4.

Opcionalmente, el botn Opciones de


exportacin... permite definir un

Adicin de objetos web dinmicos 173

nombre de archivo web y una carpeta


para el script.
5.

Una
secuencia
de
comandos
remota

Elija un mtodo de envo, tipo de


codificacin, ventana/marco de
destino y conjunto de caracteres.

Utilice esta opcin si su ISP no le permite


ejecutar sus propios scripts en el espacio web.
En lugar de ello, es posible que su ISP ofrezca
un archivo de script bsico que puede vincularse
desde su pgina web. Por lo general, este script
enviar los datos del formulario a su direccin
de correo electrnico (ya configurada con el
ISP).
Para configurar un archivo de script
remoto:

Recursos
Web Serif

1.

Con el icono Script remoto


habilitado, aada un Nombre de
formulario.

2.

Indique una URL que seale


directamente a un archivo de script.

3.

Elija un mtodo de envo, tipo de


codificacin, ventana/marco de
destino y conjunto de caracteres.

No todo el mundo dispone del acceso necesario


(o incluso de la voluntad) para ejecutar su
propio servidor web. Por ello, y como
alternativa, puede usar los Recursos Web Serif
(consulte la pg. 209). Se trata de un servicio
gratuito de puerta de acceso de la Web al correo
electrnico que transmite sus valiosos datos de
formularios a travs de Serif y los enva a su
direccin de correo electrnico personal. El
servicio requiere que tenga primero unas

174 Adicin de objetos web dinmicos


credenciales de inicio de sesin de Recursos
Web Serif (por motivos de seguridad), que le
permitirn crear, editar y eliminar sus propios
destinos de correo electrnico; es lo que se
conoce como destinos de correo electrnico del
formulario.
Para configurar Recursos Web Serif:
1.

Con el icono Recursos Web Serif


habilitado, aada un Nombre de
formulario.

2.

Haga clic en el botn Seleccionar


(inicie sesin en Recursos Web Serif
si no lo ha hecho ya).

3.

En el cuadro de dilogo, introduzca


los detalles de la direccin de destino:

Introduzca una direccin de correo


electrnico en el cuadro Direccin de
correo electrnico.

Introduzca un Asunto personalizado, la


cadena de lnea de asunto que ver en el
mensaje del visitante web; por ejemplo,
Envo de correo electrnico desde
Rainbow_WWW: Detalles de contacto.

Aada un Mensaje de confirmacin


que se mostrar ante el visitante web
una vez que haga clic en el botn
Enviar.

En el campo Idioma, defina el idioma


en el que se enviar el mensaje de
confirmacin.

Adicin de objetos web dinmicos 175

Mediante la creacin de un control


de formulario del cuadro de edicin
solamente para las direcciones de
correo electrnico tambin puede
enviar correos electrnicos de
confirmacin directamente el
visitante web. Tendr que
asegurarse de que SWR: enviar
correo electrnico de
confirmacin est activada en las
propiedades del cuadro de edicin.
Se realizar una comprobacin
anti-spam si se aade un control de
formulario CAPTCHA al formulario;
si no se aade, se realiza una
comprobacin en la puerta
CAPTCHA.
Active Responderme en el cuadro
de dilogo anterior para que el
campo Responder a del correo
electrnico de confirmacin se
establezca como el correo
electrnico del desarrollador web.
Esto permite que el visitante se
pueda poner en contacto con el
desarrollador web directamente por
correo electrnico.
4.

Haga clic en Aadir nuevo. La


entrada de correo electrnico se crea y
se aade a la lista Destinos de correo
electrnico disponibles. Observar
que la entrada se clasifica como No
confirmado. Antes de que comience
el servicio, recibir un mensaje de
correo electrnico de confirmacin en
su direccin de correo electrnico. Al
hacer clic en el vnculo, el servicio se

176 Adicin de objetos web dinmicos


activar y la entrada cambiar a
Confirmado.
5.

(Opcional) Repita el procedimiento


anterior para aadir ms destinos de
correo electrnico y, a continuacin,
seleccione una entrada de correo
electrnico para activarla.

6.

Haga clic en Aceptar a salir.

El visitante web recibir una pgina de


confirmacin bsica generada por Recursos
Web Serif para confirmar la recepcin correcta
de los datos del formulario. Puede crear y
asignar su propia pgina web de confirmacin
para que se utilice en lugar de esta pgina
bsica. Su propia pgina es como cualquier otra
pgina web, as que puede aadir su propia
informacin y disear la pgina con el mismo
estilo y aspecto que el resto del sitio.
Para aadir su propia pgina de
confirmacin:
1.

Haga clic en el formulario (debe


enviar los datos mediante Recursos
Web Serif) y elija Editar
propiedades del formulario.

2.

Cambie a la pestaa Campos ocultos,


haga clic en el botn Aadir... y
aada la palabra redirect" (redirigir)
al campo Nombre y la URL de
destino con el prefijo http:// (es decir,
la direccin web de su propia pgina
de confirmacin) en el campo Valor.

3.

Haga clic en Aceptar. La nueva


pgina web se mostrar al enviar el
formulario siguiente.

Adicin de objetos web dinmicos 177

No se almacenar ningn tipo de datos


personales en los servidores web de
Serif. Todos los datos del formulario se
redirigen en tiempo real.
Puerta CAPTCHA
Para proteger de correo electrnico no deseado,
Recursos Web Serif utiliza una puerta
CAPTCHA si no ha aadido un control de
formulario CAPTCHA directamente al
formulario (consulte Controles de formulario
en la pg. 166). Al enviar el formulario, se
activa una comprobacin de seguridad que
ofrece una cadena de texto aleatorio que el
visitante web debe reproducir en un cuadro de
texto.

Si se pasa la comprobacin, se inicia el envo


del formulario.

Fuentes RSS y podcasts


Las fuentes RSS (Really Simple Syndication, sindicacin
realmente sencilla) son secuencias de noticias e informacin en
continuo cambio que son muy populares en sitios web rpidos. La
popularidad de fuentes RSS es evidente si usa servicios de noticias
basados en Internet regularmente. Ver las fuentes RSS indicadas
en sitios web por un smbolo ; al hacer clic en el smbolo el
usuario puede suscribirse manual o automticamente a esa fuente
RSS mediante un lector RSS.

178 Adicin de objetos web dinmicos


Los podcasts son fuentes de sindicacin como las fuentes RSS
pero proporcionan opciones ligeramente diferentes que reflejan el
uso de un podcast de medios digitales, como archivos de sonido y
vdeo. En pocas palabras, las fuentes RSS publicarn artculos,
mientras que los podcasts difundirn la informacin como
episodios.
En WebPlus, puede crear sus propias fuentes RSS o podcasts que
puede publicar y actualizar con frecuencia. Bsicamente, se
convierte en el editor (en lugar del lector) de uno o ms servicios
de informacin que contienen titulares, resmenes del sitio o sus
propios artculos. Para los podcasts, difunde clips multimedia como
episodios.
Los ejemplos siguientes muestran un podcast de una escuela
ficticia que se actualiza constantemente con vnculos a los medios
(sonido y vdeo) en los que puede hacerse clic.
Las fuentes RSS y podcasts se pueden configurar de forma muy
similar en WebPlus. De hecho, el proceso para crear su propia
fuente RSS o podcast utiliza la misma Herramienta Fuente RSS
dentro de WebPlus.
Si desea volver a utilizar las fuentes RSS o los podcasts de terceros
y agregarlos a su propia pgina web, se puede incrustar un lector
en su pgina web con la Herramienta Fuente RSS.

Creacin de fuentes RSS o podcasts


La Herramienta Fuente RSS le permite crear una o varias fuentes
RSS o podcasts a los que los visitantes web pueden suscribirse a
travs de su lector de fuentes independiente, navegadores web o
Apple iTunes. Al crear una fuente, se pueden aplicar una serie de
opciones de configuracin que se relacionen con el ttulo de
fuente/descripciones, las imgenes asociadas, la informacin de
copyright, las categoras, las palabras clave, etc.

Adicin de objetos web dinmicos 179

Para insertar una fuente RSS o un podcast:


1.

Haga clic en el botn


Herramienta Fuente RSS en
el elemento flotante RSS de la barra de herramientas
Objetos web.

2.

Haga clic en el botn Aadir fuente RSS o Aadir


podcast para crear una nueva fuente RSS o entrada de
podcast. Un nuevo nombre de fuente denominado Nuevo
RSS Feed o Nuevo PodCast aparecer en el men
izquierdo. Con la entrada seleccionada, ver una lista de
configuracin para la nueva entrada que puede modificar
haciendo clic en la columna Valor. Las listas
desplegables, los cuadros de dilogo o los cuadros de
texto le permiten aadir, seleccionar o modificar los
valores para la fuente:

3.

Haga clic en Aceptar.

4.

Para colocar la fuente en la pgina, coloque el cursor


y haga clic en el ratn. Aparecer un botn
o
en la posicin del cursor (para una fuente RSS o
un podcast, respectivamente).

Para la suscripcin automtica mediante un clic de


podcasts, etiquete su smbolo de podcast indicando a
qu aplicacin se har la suscripcin.
Para cambiar la fuente por otra:

Una vez que existe una fuente RSS o un podcast, haga


doble clic en la fuente de la pgina para redirigir el botn
a otra fuente. Solo tiene que seleccionar una entrada
diferente y hacer clic en Aceptar.
Para los podcasts, el cuadro de dilogo tambin puede
automticamente suscribir el podcast a la aplicacin del

180 Adicin de objetos web dinmicos


visitante Google Reader, My Yahoo! o iTunes.
Seleccione a partir de la lista desplegable Abrir podcast
con. Si no, para la suscripcin manual de fuentes RSS o
podcasts, se utiliza la opcin Estndar RSS.
Una vez que se crea la fuente RSS o el podcast, se pueden aadir
artculos o episodios (respectivamente) a la fuente y despus
publicarlos. Una vez actualizado, tendr que volver a publicar su
pgina web (consulte Publicacin en la Web en la pg. 425).
Para aadir o actualizar artculos o episodios:
1.

Haga clic en el botn


Herramienta Fuente RSS de
la barra de herramientas de WebPlus Objetos web.

2.

En el cuadro de dilogo Fuente RSS, asegrese de que se


ha seleccionado la fuente correcta, despus haga clic en
el botn Administrador de fuentes RSS.

3.

En la derecha del cuadro de dilogo, haga clic en el


botn Aadir artculo o Aadir episodio. As se crea
una nueva entrada, titulada provisionalmente Nuevo
artculo (para una fuente RSS) o Nuevo episodio (para
podcast) en la fuente seleccionada.

4.

Edite el artculo/episodio y la configuracin (vase ms


arriba). Las listas desplegables, los cuadros de dilogo o
los cuadros de texto le permiten aadir, seleccionar o
modificar los valores para la fuente.

5.

Haga clic en Aceptar y, a continuacin, vuelva a hacer


clic en Aceptar.
Si est difundiendo los archivos multimedia
almacenados localmente, se le solicitar que defina
la URL del sitio (consulte la pg. 1) durante la
publicacin. As los visitantes pueden acceder a los
archivos locales.

Adicin de objetos web dinmicos 181

Envo de fuentes de podcast


Para podcasts a travs de iTunes, como difusor tendr que haber
enviado su podcast a iTunes. La fuente de podcast tiene que
revisarse por el personal de iTunes para comprobar si hay
problemas tcnicos, credenciales de inicio de sesin aceptables,
uso inapropiado de idioma explcito, material ofensivo y uso
incorrecto de material de copyright. Este paso significa que si la
fuente se aprueba, los usuarios de iTunes podrn suscribirse a su
fuente de podcast.
Para enviar una fuente de podcast a iTunes:
1.

Inicie iTunes.

2.

Haga clic en Podcasts en la seccin BIBLIOTECA.

3.

Seleccione el directorio de podcast en la parte inferior


del rea de trabajo de iTunes.

4.

En el cuadro ENLACES DE PODCASTS en la parte


superior derecha de la pantalla, haga clic en Enviar un
podcast.

5.

En la siguiente pantalla, pegue su URL de fuente en el


cuadro URL del feed de podcast. Su URL de fuente ser
una URL con un nombre de archivo xml (p. ej.,
rss_1.xml) al final.

6.

Haga clic en Continuar.

Suscripcin
Suscripcin a fuentes RSS y podcasts
Los visitantes web pueden suscribirse a estas fuentes por una
variedad de mtodos.

182 Adicin de objetos web dinmicos


Tipo de
suscripcin
Manual

Mtodo

El visitante web simplemente hace clic en un


smbolo de diagnstico que indica el tipo de fuente,
es decir:
Para fuentes RSS
Su fuente RSS o podcast publicado
proporciona un botn de suscripcin en el que
se puede hacer clic.
Esto le permite aadir la fuente a los favoritos
del navegador.
O bien:
Para podcasts
Haga clic para aadir su podcast a su pgina
principal de iGoogle o Google Reader.
Para iTunes, una vez que un difusor ha
enviado la fuente a iTunes y se ha aprobado,
el visitante web puede suscribirse al podcast
del siguiente modo:
1.

Inicie iTunes.

2.

Haga clic en Suscribirse a un


podcast del men Avanzado.

3.

Pegue la URL de la fuente en el


cuadro de entrada del cuadro de
dilogo, haga clic en Aceptar. El
podcast aparecer como entrada en
la ventana. La direccin URL
puede obtenerse haciendo clic en
el smbolo del podcast y copiando
la direccin URL resultante en la

Adicin de objetos web dinmicos 183

ventana de navegador.
Automtica
(podcasts
solamente)

(o
El visitante web hace clic en el icono
el hipervnculo asociado). El podcast y el
lector estn definidos explcitamente, as que
la suscripcin es automtica. Para ello, se
debe hacer doble clic en el podcast de la
pgina y seleccionar una opcin de la lista
desplegable Abrir podcast con.

En lugar de un botn directo, se puede crear un


hipervnculo (consulte la pg. 1) desde cualquier lugar
del sitio que vincule directamente a la nueva fuente. Se
utiliza un tipo de destino de vnculo especial
denominado Fuente RSS.

Inclusin de fuentes de terceros


En lugar de crear su propia fuente RSS o podcast, es posible que
desee incluir una fuente RSS de otro sitio web en su propio sitio
web.
La adicin del lector de fuentes RSS a su pgina le suscribe
automticamente a la fuente RSS o podcast elegido. Hay otras
formas de suscribirse a fuentes RSS o podcasts a travs de los
navegadores web e iTunes, pero aqu nos centraremos en cmo
incluir la fuente en su pgina y hacer que automticamente reciba
artculos o episodios.

184 Adicin de objetos web dinmicos


A continuacin se muestra un ejemplo de una fuente de noticias
RSS de Reuters aadida a una pgina web de WebPlus:

Para incluir una fuente RSS o un podcast en la pgina:


1.

Localice una fuente RSS disponible en pginas web de


noticias y servicios de informacin populares. Busque
uno de los siguientes smbolos distintivos, p. ej.

Adicin de objetos web dinmicos 185

2.

Copie la URL de fuente en el portapapeles haciendo clic


con el botn secundario en el smbolo (o hipervnculo) y
seleccionando Copiar acceso directo (Internet
Explorer), Copiar la ruta del enlace (Mozilla Firefox) o
Copiar direccin de enlace (Google Chrome).

3.

Haga clic en el botn


Herramienta de lector RSS
en elemento flotante RSS de la barra de herramientas
Objetos web.

4.

En el cuadro de dilogo, pegue la URL de fuente en el


campo URL de fuente RSS.

5.

(Opcional) Seleccione un color, fuente, tamao de fuente


o estilo de fuente distintos para el ttulo, el titular o el
color del resumen de la fuente.

6.

(Opcional) Establezca la zona horaria local para el sitio


en la lista desplegable Zona horaria.

7.

(Opcional) Cambie Formato de fecha (MM/DD o


DD/MM) para la fecha publicada del artculo que se
muestra en el encabezado de artculo.

8.

Haga clic en Aceptar.

9.

Se mostrar un cursor
. Para insertar la fuente en
una ventana de tamao predeterminado, simplemente
haga clic con el ratn.
O bien:
Por lo general, defina el tamao de la ventana de la
fuente, arrastre una regin y suelte el botn del ratn.

La ventana de la fuente se rellena de un color melocotn con la


URL mostrada; tendr que publicar la pgina para ver la nueva
fuente actual. Recuerde que el contenido se actualizar
automticamente al actualizar la fuente en el sitio web original.

186 Adicin de objetos web dinmicos


Para los podcasts, cuando el visitante web ve la fuente, cada
episodio se puede reproducir haciendo clic en los vnculos de
sonido, que normalmente sealan a un archivo MP3. Una vez
descargado y guardado, el archivo se puede reproducir en un
reproductor predeterminado ya definido (p. ej., Reproductor
Windows Media).

Introduccin al comercio electrnico


El comercio electrnico implica la compra y venta de bienes en
Internet. Hoy en da es difcil escapar a las compras en lnea en
cualquier sesin de Internet; seguramente ha utilizado algn tipo de
compra por Internet en cualquier momento, al adquirir libros, CD,
vacaciones, etc. Todos los sitios que admiten este tipo de actividad
de comercio electrnico utilizan por lo general un sistema de carro
de la compra y otro de procesamiento de pago. Un carro de la
compra es una cesta virtual (piense en una cesta de supermercado)
que almacena sus artculos seleccionados y se utiliza con el sistema
de procesamiento de pago (que sera como la caja del
supermercado).
Para las empresas importantes, la tecnologa del carro de la compra
se desarrolla internamente (el procesamiento del pago se realiza
quizs por otra empresa). Para las empresas u organizaciones ms
pequeas, el carro de la compra normalmente es una solucin de
terceros, debido a las limitaciones de gastos/recursos. Se pueden
utilizar muchos proveedores de carro de la compra; todos se basan
en cuentas y estn equipados para aceptar tarjetas de crdito en
lugar de usar un mtodo tradicional de pago (p. ej., por telfono).
Cmo se adapta WebPlus a todo esto? En primer lugar, WebPlus
le permite elegir uno de varios proveedores de carro de la compra
especialmente seleccionados, y en segundo lugar, le permite
conectarse con el proveedor de carro de la compra mediante un
formulario o vnculo en la pgina de WebPlus. Los formularios
permiten definir opciones de compra (colores, cantidad), as como
calcular impuestos, gasto de envo, grandes cantidades, etc. Gracias
a los vnculos se puede comprar fcilmente con un solo clic sin
opciones de compra. Las caractersticas son especficas del
proveedor y por tanto varan ampliamente.

Adicin de objetos web dinmicos 187

Configuracin de su proveedor de carro de la


compra
Se pueden configurar diferentes proveedores de carro de la compra
en WebPlus. Son los ms utilizados y puede que ya haya probado
algunos, como PayPal, como cliente de eBay. El proceso de
configuracin le gua al propio sitio del proveedor, donde podr
registrarse como usuario.
Utilice el sitio web del proveedor para obtener ms
informacin sobre las caractersticas nicas del carro
de la compra.
Para configurar un proveedor de carro de la compra:
1.

Haga clic en el botn Configurar E-Comercio


el elemento flotante E-Comercio de la barra de
herramientas Objetos web.

2.

En el cuadro de dilogo Configuracin de E-Comercio,


tiene dos opciones en funcin de si es un usuario
existente o un nuevo usuario de uno de los proveedores
de carro de la compra; es decir:

3.

en

Si es un nuevo usuario, seleccione un proveedor de


carro de la compra activando el botn de opcin y, a
continuacin, haga clic en el botn Registrarse
ahora. El sitio web del proveedor aparece en una
nueva ventana del navegador, donde puede
registrarse con el proveedor de carro de la compra.

Si es usuario existente, active el botn situado junto


al proveedor elegido y haga clic en Siguiente. Esta
opcin establece simplemente el proveedor
predeterminado para su sitio (en lugar de configurar
una cuenta del proveedor).

El cuadro de dilogo es especfico del proveedor y puede


mostrar varias opciones. Por ejemplo, si elige PayPal

188 Adicin de objetos web dinmicos


puede definir (con un cuadro de dilogo) una direccin
de correo electrnico para recibir los pagos, los gastos de
manipulacin del carro y utilizar una herramienta de
prueba de Sandbox para probar el carro de la compra
antes de que se utilice de verdad. Haga clic en
Siguiente>.
Para la prueba de Sandbox, haga clic en el botn Ms
informacin para configurar un inicio de sesin
separado de Sandbox adems del inicio de sesin
activo de PayPal.
4.

(Opcional; solamente PayPal) En el cuadro de dilogo,


active Usar el Minicart de PayPal para mostrar un carro
emergente (como una superposicin) que aparece cuando
los productos se aaden al carro (despus, el carro se
minimiza en la esquina superior izquierda de la ventana
del navegador mientras sigue habiendo artculos en el
carro antes de proceder al pago).

Tambin puede configurar, mediante el cuadro de dilogo, la


posicin del Minicart en la ventana del navegador y editar o
eliminar el texto predeterminado mostrado en el Minicart.
5.

Haga clic en el botn Finalizar para completar la


configuracin del carro de la compra.

Adicin de objetos web dinmicos 189

Cuando haya configurado el carro de la compra, necesitar


Insertar un objeto de E-Comercio.

Insercin de un objeto de comercio


electrnico (PayPal)
La creacin de los objetos de comercio electrnico dentro de
WebPlus se basa en un asistente. Un objeto de comercio
electrnico se puede aadir a la pgina web como un formulario o
vnculo (es decir, un botn sencillo) mediante una serie de cuadros
de dilogo. El utilizar formularios o vnculos depende de las
caractersticas de los artculos que tiene pensado vender y de cmo
desea vender los productos.
Por ejemplo, si es importador
puede crear un botn de
comercio electrnico (como
un vnculo Comprar ahora).
Esta opcin hara una
suposicin sobre la posible
transaccin, es decir, la
cantidad, el tamao, el estilo y
el color son fijos.

Esto es porque los vnculos son solo un botn y no pueden alojar


las opciones de compra interactivas que se necesitaran para las
compras ms complejas. El clic de un comprador comprar una
oferta de un producto estndar, nada ms. Resulta til en algunas
situaciones, pero en otras est opcin completamente inadecuada.
Las compras ms tpicas utilizan formularios de comercio
electrnico que proporcionan opciones de compra interactivas,
como cantidad, tamao, etc.
Para los escenarios de comercio electrnico, donde se ponen
muchos artculos a la venta, es posible guardar los artculos para la
venta en una base de datos de Serif (SDB) estructurada

190 Adicin de objetos web dinmicos


especialmente para su uso con comercio electrnico. Si se aaden
formularios (o reas) que se repiten a la pgina, los artculos de la
base de datos se pueden mostrar despus de la combinacin de la
base de datos y se ponen a la venta. Consulte Uso de la
combinacin de bases de datos con comercio electrnico en la
Ayuda de WebPlus.
El cuadro de dilogo que se muestra cuando se aade un objeto de
comercio electrnico depender por completo del proveedor del
carro de la compra actualmente activado (consulte Configuracin
de su proveedor de carro de la compra en la p. 187).
Los procedimientos siguientes asumen que PayPal
est configurado como el carro de la compra.
Para insertar un objeto de comercio electrnico
1.

Haga clic en el botn Insertar un objeto de EComercio


en el elemento flotante E-Comercio de
la barra de herramientas Objetos web.

2.

En el cuadro de dilogo Aadir objeto de PayPal, elija


la direccin de correo electrnico que va a recibir la
informacin del pago. WebPlus asumir que se utiliza la
direccin de correo electrnico establecida durante la
configuracin del carro de la compra. Tambin puede
desactivar la casilla Usar la cuenta predeterminada del
sitio y establezca una direccin de correo electrnico
diferente para invalidar el valor predeterminado del sitio.

3.

Seleccione un tipo de objeto del marco del formulario de


PayPal. Seleccione un botn de opcin de "Formulario"
si desea crear un formulario de comercio electrnico
que contendr opciones de compra (p. ej., color o
cantidad). Si el producto a la venta no tiene opciones de
compra, puede utilizar un objeto Vnculo (es decir,
crear un Botn de comercio electrnico en el que se
puede hacer clic). Las opciones de formularios y reas
que se repiten permiten aadir artculos de una base de

Adicin de objetos web dinmicos 191

datos en lugar de definirlos explcitamente en un cuadro


de dilogo Detalles del artculo (consulte Uso de la
combinacin de bases de datos con comercio electrnico
en la Ayuda de WebPlus). Haga clic en Siguiente>.
(Opcional) Si un formulario o un botn no es lo que
busca, active la ltima opcin en lugar de pegar cdigo
en un cuadro de dilogo posterior. Este sera cdigo
generado para sitios web de PayPal (despus del inicio
de sesin, mire en Servicios de vendedor). Haga clic en
Siguiente> para salir del asistente y pegar el fragmento
de cdigo HTML en la pgina.
4.

En el cuadro de dilogo siguiente, defina un botn para


su uso. Se puede activar un botn de texto estndar
(cuando se active, introduzca una cadena de texto) o un
botn de imagen estndar (cuando se active, seleccione
de una gran variedad de valores preestablecidos en la
ventana desplazable). Algunas imgenes admiten
adiciones automticas.

Haga clic en Siguiente>.


5.

La identificacin, precio, impuestos e informacin del


peso del artculo se pueden definir en el cuadro de
dilogo Detalles del artculo. Las opciones que hay que
seleccionar son:

Nombre del artculo: el nombre del elemento que


se vende. Mostrado en el formulario y en el carro de
la compra.

192 Adicin de objetos web dinmicos

Permitir que los clientes especifiquen el nombre


del artculo: active para cambiar el nombre del
elemento anterior por un cuadro en el que el
visitante web pueda introducir su propio nombre del
elemento (tambin til para especificar los detalles
de la donacin).

Id. del artculo: aada una cadena fcilmente


identificable para hacer un seguimiento del artculo
con PayPal.

Moneda: establezca la moneda en la que se


realizar la transaccin.

Precio: el precio del artculo. Se muestra en la


pantalla de forma predeterminada.

Permitir que el cliente especifique el importe:


active para cambiar el precio anterior por un cuadro
en el que el visitante web pueda indicar su propio
precio. Utilcelo con formularios de donaciones,
donde el cliente establece el importe.

Invalidar la configuracin de impuestos...: active


para invalidar la configuracin de impuestos del
perfil del proveedor para el artculo. Si est
activado, especifique una tasa fiscal nica para el
artculo, p. ej. 0% para donaciones a organizaciones
de caridad exentas de impuestos.

Peso: establezca un peso si est utilizando el envo


basado en peso (solamente en EE.UU.), definido en
el perfil de PayPal. Normalmente, las libras (lb) se
utilizan como unidad de medida, pero tambin se
pueden establecer kilogramos (kg) si es necesario.

Elija de la configuracin anterior y haga clic en


Siguiente>.
Si est utilizando la combinacin de base de datos de

Adicin de objetos web dinmicos 193

comercio electrnico, el cuadro de dilogo Detalles del


artculo le permite elegir una base de datos de comercio
electrnico para su uso con el proveedor elegido.
Recuerde establecer la moneda en la que desea realizar
la transaccin.
6.

7.

Solamente para los formularios de comercio electrnico


se muestran los dos cuadros de dilogo siguientes:

El cuadro de dilogo Descripcin del artculo le


permite incluir opcionalmente una imagen (p. ej.,
obtener una vista previa del artculo que est a la
venta) y una descripcin larga y corta que se
mostrar en el formulario. Haga clic en Siguiente>.

El cuadro de dilogo Opciones de artculos le


permite crear cuadros de edicin, cuadros
combinados, botones de opcin y nombres fijos (se
pueden seleccionar hasta 10 opciones por
formulario en PayPal; solo una opcin que cambia
con el precio) segn sea necesario; puede realizar el
diseo desde cero o utilizar campos de opciones
previamente guardados. Haga clic en Siguiente>.
No se mostrar para formularios que se repiten.

En el cuadro de dilogo Detalles del artculo, establezca


una cantidad predeterminada en el cuadro de entrada o
active la casilla para dejar que el usuario especifique una
cantidad en el momento de finalizar la transicin (no se
mostrar para los formularios que se repiten).
O bien:
Active la opcin Aadir cuadro de edicin para que el
cliente pueda definir la cantidad que pedir.
Para el envo y manipulacin asociados con el pedido,
introduzca una cantidad para Manejo, Envo y Gastos
de envo adicionales.
Si se deja en blanco, se utilizar el perfil predeterminado
de PayPal. No se mostrar para formularios que se
repiten. Haga clic en Siguiente>.

194 Adicin de objetos web dinmicos


8.

En el cuadro de dilogo Informacin adicional del


cliente, elija preguntar al cliente una direccin, no
preguntar o exigir al cliente que introduzca una
direccin. Opcionalmente, haga una pregunta del cliente
en el cuadro de texto. Haga clic en Siguiente>.

9.

El cuadro de dialogo Pginas de pago ofrece algunas


opciones de pago, como:

Introducir el nombre del estilo de pgina de pago (si


se configur por adelantado mediante el inicio de
sesin de PayPal).

Definir un idioma para la pgina de inicio de sesin


de PayPal. Seleccionar de la lista desplegable.

Cambiar el nombre del botn Continuar en la


Pgina de pago correcto.

Si es necesario, defina las Pginas de pago correcto


o Pginas de pago cancelado. Escriba la direccin
URL de la pgina o seleccione una entrada de la
lista desplegable.

10. nicamente para los formularios de comercio


electrnico, seleccione un diseo del formulario del
cuadro de dilogo Diseo del formulario. Varias
opciones de casillas de verificacin le permiten controlar
lo que se muestra en el diseo del formulario. Puede
desactivar el precio, y si se utilizan formularios de reas
que se repiten, puede ocultar/mostrar la imagen de texto,
descripciones cortas/largas, opciones fijas y un cuadro de
edicin ficticio de cantidad. Se puede cambiar el formato
de los formularios con la casilla de verificacin Volver a
cambiar el formato ahora.
11. Haga clic en Finalizar.

Adicin de objetos web dinmicos 195

12.

Para insertar el formulario o el botn, coloque el


cursor donde desea que aparezca en la pgina y, a
continuacin, haga clic en l.

Para editar un botn o formulario de comercio


electrnico:
1.

Haga doble clic en el formulario o el botn.

2.

Edite la configuracin de comercio electrnico pantalla


por pantalla en el cuadro de dilogo que se muestra.

Para convertir a un formulario estndar:

Haga clic con el botn secundario del ratn en el


formulario existente de comercio electrnico y elija
Convertir a formulario.

Uso de la combinacin de bases de


datos
La combinacin de base de datos consiste en extraer el contenido
de datos de una base de datos existente (base de datos Serif SDB,
Microsoft Access, dBASE), HTML, archivo de Excel, ODBC o un
archivo de texto delimitado y en presentar la informacin, por
ejemplo, en un rea que se repite o un fragmento HTML. El
contenido, conocido como origen de datos puede ser una lista de
correo, lista personal, lista de productos, un inventario o una lista
de ventas. De hecho, es cualquier informacin que se pueda
guardar.

196 Adicin de objetos web dinmicos

Al igual que con el texto, es posible incluso combinar datos de


imgenes (por ejemplo, una biblioteca de fotografas digitales) en
campos nicos o, incluso, crear automticamente un diseo de
cuadrcula para imgenes y texto adecuado para los catlogos o
lbumes de fotografa. WebPlus incluso puede automticamente
crear una base de datos fotogrfica, una base de datos sencilla
usando el formato SDB (base de datos Serif), para imgenes en una
carpeta. Puede combinar imgenes en un solo campo o, incluso,
generar automticamente un diseo que se repite en cuadrcula,
apropiado para catlogos o lbumes de fotografa.

Adicin de objetos web dinmicos 197

Introduccin
Para sus necesidades bsicas de combinacin de bases de datos,
WebPlus proporciona su propio formato de archivo base de datos
de Serif. Los "archivos SDB", como se conocen porque utilizan la
extensin *.SDB, son ideales para almacenar datos de texto sin
formato, usados normalmente para listas de productos, pero
tambin se pueden utilizar para otras tareas. Puede crear una lista
creando un nuevo archivo SDB y luego rellenar los huecos. Una
ventaja de usar el formato de base de datos de Serif es que puede
editar sus datos (incluso aadir campos e informacin nuevos)
directamente en WebPlus. Por supuesto, los orgenes de datos ms
complejos tienen sus propias ventajas y WebPlus tambin puede
combinar datos externos desde una serie de formatos diferentes.
Puede importar archivos de texto sin formato (como, el texto
exportado de un programa de correo electrnico), as como tablas
de pginas web HTML, archivos de bases de datos de programas
como Access, Outlook, Excel... e, incluso, servidores ODBC en
vivo.
Sea cual sea su origen de datos, una vez que usted lo ha elegido en
WebPlus puede editar la lista de combinacin (los datos reales
que se combinarn), especificando qu registros se incluirn o
excluirn y aplicar funciones avanzadas de filtro/ordenacin para
perfeccionar los datos. Tendr que insertar campos de marcador
de posicin en un rea que se repite en la pgina web; los datos se
combinarn en dichas reas que se repiten. Al instante, podr
combinar de manera que cada rea que se repite se vuelva a
generar varias veces dentro de un nuevo sitio con los datos de
cada registro que aparecern uno por uno.
Como caractersticas de combinacin ms avanzadas, puede usar
los delimitadores de combinacin a hipervnculo entre las pginas
de resumen y principal para cada registro. Adems, los campos de
combinacin se pueden insertar en ttulos de la pgina generados
para permitir la navegacin entre las listas de resumen/pginas
principales. Consulte Combinacin de base de datos avanzada.
En el comercio electrnico se puede usar la combinacin de base
de datos con una base de datos Serif de comercio electrnico y los
formularios que se repiten Comprar ahora o Aadir al carro de

198 Adicin de objetos web dinmicos


compra. Las reas que se repiten tambin pueden usarse pero los
formularios de comercio electrnico proporcionan transacciones
directamente con su proveedor de carro de la compra (p. ej.,
PayPal, Mal's, etc.) en la forma de los botones Comprar
ahora/Aadir al carro de la compra. (Consulte la Ayuda de
WebPlus para obtener ms informacin)

Creacin de un origen de datos


Puede crear un nuevo archivo de base de datos de Serif (*.sdb)
fcilmente en WebPlus. Esta base de datos, una vez que est
rellenada, se puede usar como origen de datos que puede combinar
en el sitio web.
Para crear un nuevo archivo de base de datos de Serif
(*.sdb:
1.

Seleccione Crear nueva base de datos


de la barra
de herramientas Combinacin de base de datos (activar
primero)..

2.

Con las base de datos de Serif (*.sdb) que se muestran


en la lista Guardar como tipo, desplcese a una carpeta
y escriba un nombre para el nuevo archivo y haga clic en
Guardar.

3.

En el cuadro de dilogo Personalizar la base de datos,


haga clic en el botn Insertar....

4.

En el cuadro de dilogo, cree cada campo que componga


la nueva base de datos proporcionando un nombre de
campo y haciendo clic en Aceptar uno por uno.

5.

Los campos se muestran en el cuadro de dilogo


Personalizar base de datos:

Para eliminar un campo, seleccione el nombre de


campo y haga clic en Eliminar.

Adicin de objetos web dinmicos 199

Para cambiar el nombre de un campo, seleccione el


nombre de campo y haga clic en Cambiar
nombre.

Para cambiar el orden de los campos dentro de la


lista, seleccione el nombre del campo y haga clic en
Subir o Bajar.

6.

Haga clic en Aceptar.

7.

El cuadro de dilogo Editar base de datos se abre y


muestra el primer registro con seis campos a la vista.
Desplcese hacia abajo para ver ms campos, si se han
creado. Como es una nueva base de datos, los campos
estarn en blanco; puede comenzar a incorporar
informacin ahora (es decir, aadir un registro), o esperar
ms adelante. Para incorporar informacin, solo tiene
que escribir en un campo. Para crear un nuevo registro,
haga clic en Aadir; repita para cada registro y cuando
haya acabado haga clic en Aceptar.

Haga clic en Aceptar para cerrar el cuadro de dilogo Combinar


lista y volver al sitio.
WebPlus le permite crear su propia base de datos
fotogrfica para mostrar arte digital; los datos EXIF
tambin se guardan. Consulte la Ayuda de WebPlus
para obtener ms informacin.

Insercin de reas que se repiten para los


datos
Para que el esquema funcione correctamente necesitar incluir el
contenido del origen de datos en una pgina web. WebPlus le
permite crear rpidamente un diseo que se repite que organiza
los campos de marcadores de posicin, generando un nuevo sitio
con tantas pginas como necesite y rellenando los campos con el
texto o las imgenes de un origen de datos especificado. Puede

200 Adicin de objetos web dinmicos


crear cualquier nmero de orgenes de datos, pero solo puede tener
uno abierto a la vez por rea que se repite.
Cada rea que se repite tiene su propio origen de datos;
solo un rea que se repite puede ocupar cada pgina
web.
Un diseo que se repite comienza con un rea que se repite,
bsicamente una misma celda cuyo tamao de unidad determina
cuntos registros de base de datos se pueden disponer por toda la
pgina. Dentro del rea que se repite, puede colocar cualquier
elemento, por ejemplo:

Uno o ms campos de texto con datos extrados del


mismo registro.

Uno o ms campos de imgenes en los que se pueden


combinar imgenes de un registro de datos concreto para
que aparezcan.

Otros objetos como texto artstico, QuickShapes...


cualquier cosa!

Usted se concentra en crear el rea que se repite y colocar los


campos (u otros elementos) y WebPlus se encarga de repetirlas en
un diseo de cuadrcula de repeticin y de combinar el texto o las
imgenes del origen de datos en un sitio nuevo. Cada rea de
repeticin se vuelve a generar varias veces dentro del nuevo
sitio, con datos de un registro diferente apareciendo cada vez.
Para crear un diseo que se repite:
1.

Elija cualquier origen de datos adecuado.

2.

Haga clic en el botn Insertar rea que se repite


en la barra de herramientas Combinacin de base de
datos (activar en primer lugar).

Adicin de objetos web dinmicos 201

3.

En el cuadro de dilogo Elegir base de datos de


combinacin, haga clic en Examinar... para seleccionar
un origen de datos, haga clic en Abrir y, a continuacin,
en Aceptar. Tambin puede crear una nueva base de
datos en este punto, haciendo clic en Nuevo (Consulte
Creacin de un origen de datos ms arriba).

4.

El cuadro de dilogo Configuracin de mosaico del


rea que se repite aparecer, mostrando un diseo de
pgina que inicialmente consiste en una cuadrcula de
1x4 mosaicos: un rea que se repite a lo largo de la
pgina y cuatro hacia abajo. La regin de vista previa de
la izquierda refleja la configuracin actual del cuadro de
dilogo.

5.

Puede establecer propiedades exactas para el rea que se


repite (la unidad bsica) en el cuadro de dilogo o, bien,
puede cerrar el cuadro de dilogo y, directamente,
arrastrar para establecer el tamao y la forma del rea. O
puede utilizar un mtodo combinado reabriendo el
cuadro de dilogo tantas veces como sea necesario.

Usando el cuadro de dilogo, especifique el diseo


de la cuadrcula con el nmero de reas que se
repiten que desee que aparezcan a lo ancho y a lo
largo. Otras opciones que puede modificar son la
posicin Izquierda y Arriba de la pgina, el
Ancho y Alto del rea que se repite y los intervalos
opcionales en horizontal y vertical entre las reas
que se repiten. Active la opcin Ampliar pgina
para que se ajuste a todos los mosaicos para
obtener todos los registros mostrados en una sola
pgina (recomendada especialmente para listas de
resumen de una lnea); la opcin de diseo hacia
abajo se omite.

En la pgina, puede arrastrar el objeto de rea que


se repite para moverlo o arrastrar el controlador para
cambiarle el tamao.

202 Adicin de objetos web dinmicos


Cuando se guarda un sitio, WebPlus recuerda el origen de datos
actual y lo abrir de nuevo de fondo automticamente la
siguiente vez que abra la pgina web; por tanto, mientras utilice el
mismo origen, no tendr que volver a abrirlo.
Para editar un diseo que se repite existente:
1.

Con el rea que se repite seleccionada, haga clic en


Diseo de rea que se repite
herramientas de contexto.

2.

de la barra de

Aparecer el cuadro de dilogo Configuracin de


mosaico del rea que se repite, que le permite modificar
el diseo del rea que se repite.

Apertura de un origen de datos diferente


Adems de crear un archivo de base de datos de Serif, WebPlus
tambin le permite abrir un archivo distinto ya existente en la base
de datos de Serif u otro origen de datos externo como archivo de
texto sin formato (separados por comas o de ancho fijo), otras
bases de datos, hoja de clculo y mucho ms. Puede editar,
seleccionar, filtrar y/o ordenar los datos reales que se van a
combinar.
Para abrir un origen de datos diferente:
1.

Con el rea que se repite seleccionada, haga clic en


Editar base de datos
de contexto.

2.

en la barra de herramientas

En el cuadro de dilogo, haga clic en el botn


Examinar... y en la flecha hacia abajo en la lista
desplegable de formato de archivo junto a la lista
desplegable Nombre de archivo, seleccione el tipo de
origen de datos que desea abrir, y haga clic en Abrir.

Adicin de objetos web dinmicos 203

Siga las instrucciones que d WebPlus en funcin del


tipo de origen de datos que seleccione. Por ejemplo:

Si el origen de datos incluye ms de una tabla: Se


le solicitar que especifique la tabla para la
importacin.

Si ha seleccionado un archivo de texto (.TXT,


.CSV, .TAB, .ASC) con origen de datos en formato
delimitado o de ancho fijo: WebPlus abre un cuadro
de dilogo Formato de datos, con una vista previa
de los datos de archivo seleccionado.

En la primera pantalla, especifique Delimitado


o Ancho fijo. Si el primer registro de datos
enumera ttulos de varias columnas, active La
primera lnea contiene cabeceras de
columna. Si el archivo de origen utiliza
Calificador de texto (por ejemplo, unas
comillas para rodear campos de texto como
Apartamento 3, n 14 C/ Hopalong que
pueden contener comas y que se podra
interpretar como varios campos), seleccione el
carcter correspondiente en la lista.

Haga clic en Siguiente. El aspecto de la


pantalla siguiente depende de si ha
especificado un archivo delimitado o de ancho
fijo. Puede especificar el delimitador o
comprobar (y corregir, en caso necesario) los
saltos usados para separar los campos de datos.
Compruebe con minuciosidad que la vista
previa de los datos es correcta y haga clic en
Finalizar.
Nota: Si necesita cambiar el formato de los
datos una vez que se ha cerrado el asistente,
vuelva a abrir el archivo de origen y repase el
cuadro de dilogo Formato de datos,
cambiando la configuracin si es necesario.

204 Adicin de objetos web dinmicos


3.

Una vez que haya completado cualquier paso intermedio,


el cuadro de dilogo Elegir base de datos de combinacin
aparece. Si hace clic en el botn Editar... se abre el
cuadro de dilogo Combinar lista, presentando los datos
en formato de columna/fila, donde puede seleccionar,
filtrar u organizar los datos reales que se combinarn.
Puede realizar todos los cambios que necesite ahora o
ms adelante.

4.

Haga clic en Aceptar para cerrar el cuadro de dilogo


Combinar lista y volver a la pgina web. El origen de
datos que acaba de abrir contina siendo un origen de
datos activo.

Edicin de archivos de base de datos de Serif


Cada registro del archivo de base de datos de Serif (*.sdb) contiene
20 campos estndar. Para los datos guardados en formato SDB,
puede usar el cuadro de dilogo Editar base de datos para crear o
eliminar registros, incorporar informacin, buscar un texto
concreto o revisar el orden de los campos, incluso aadir campos y
datos nuevos.
Otros archivos de base de datos no editables.
Para editar un archivo de base de datos Serif (*.sdb):
1.

Con el rea que se repite seleccionada, haga clic en


Editar base de datos
de contexto.

en la barra de herramientas

2.

En el cuadro de dilogo, haga clic en el botn Editar....


(Si el botn est deshabilitado significa que el origen de
datos actual no es un archivo SDB.)

3.

Se abre el cuadro de dilogo Combinar lista, presentando


los datos en formato de columna/fila, donde puede editar,
seleccionar, filtrar u organizar los datos reales que se
combinarn. Puede realizar todos los cambios que

Adicin de objetos web dinmicos 205

necesite ahora o ms adelante. Haga clic en el botn


Editar....
4.

El primer registro de base de datos actual aparecer, con


seis campos en la vista (desplcese hacia abajo para ver
otros campos). Utilice el cuadro de dilogo Editar base
de datos para editar los datos.

Para incorporar informacin, solo tiene que escribir


en un campo. Cada campo se limita a un mximo de
255 caracteres.

Para crear un nuevo registro, haga clic en Aadir.

Utilice los botones de flecha para desplazarse entre


los registros o escriba un nmero de registro y pulse
Intro.

Para eliminar el registro en curso, haga clic en


Eliminar. Si hace clic en Eliminar en el primer
registro, se borra la informacin, pero el formulario
de registro sigue permaneciendo.

Para encontrar apariciones de texto especfico, haga


clic en Buscar y especifique el Campo que desee
buscar. La lista de registro muestra el texto que
aparece en dicho campo en toda la base de datos.
Haga doble clic en una entrada (o seleccinela y
haga clic en Aceptar), para ver ese registro en
concreto.

Para personalizar los campos de base de datos, haga


clic en Personalizar.... En el cuadro de dilogo,
haga clic en Insertar... para crear un campo nuevo
o seleccione un campo y haga clic en Eliminar para
quitar uno. Para cambiar un campo, seleccinelo y
haga clic en Cambiar nombre. Tambin puede
hacer clic en Subir o Bajar para cambiar el orden
de los campos de la lista.

206 Adicin de objetos web dinmicos


5.

Para actualizar la lista y salir del cuadro de dilogo, haga


clic en Aceptar.
Si cierra el cuadro de dilogo Editar base de datos
no se cierra el archivo de base de datos; contina
siendo un origen de datos activo con fines de
combinacin de base de datos. No obstante, los
cambios que ha realizado se guardan en el disco en
este momento.

Insercin de marcadores de posicin para sus


datos
Para combinar la informacin de un origen de datos estructurado
en una pgina web, necesitar insertar campos de marcadores de
posicin en el rea que se repite creada (vase ms arriba) para
que WebPlus sepa qu datos de campos debe utilizar. Realmente,
existen dos tipos de marcadores de posicin. Los campos de texto
obviamente tratan la informacin basada en texto como datos de la
lista de direcciones; los campos de imagen agregarn imgenes
recuperadas de los nombres de ruta de archivos guardados en la
base de datos.
Para insertar un marcador de posicin de campo de
texto o de imagen:
1.

Con el rea que se repite seleccionada, haga clic en el


botn Insertar campo de texto
de imagen
contexto.

o Insertar campo

en la barra de herramientas de

Se abrir un cuadro de dilogo, mostrando una lista de


campos (texto o imagen) en el origen de datos
actualmente seleccionado.
2.

En la lista de desplazamiento del cuadro de dilogo, haga


doble clic en el campo para insertar (o seleccinelo y
haga clic en Insertar).

Adicin de objetos web dinmicos 207

3.

El campo aparecer en la pgina web. El cuadro de


dilogo permanece abierto, de modo que puede insertar
nuevos campos si los necesita.

4.

Arrastre cada campo para ponerlo exactamente en el rea


que se repite (cambie el tamao si es necesario). Existe
un breve "momento de bloqueo (donde el Ajuste est
activado o desactivado) en el que el campo se acopla al
rea de repeticin. El contenido del campo queda
sombreado y, a partir de ese momento, al arrastrar el
objeto de rea que se repite, tambin se arrastra el
contenido.
En los campos de imagen, para configurar las
propiedades de presentacin, como el tamao y la
alineacin de la imagen dentro del campo de imagen,
haga clic con el botn secundario y seleccione
Propiedades del marco.... Normalmente, la opcin
Escala para el ajuste mnimo funciona mejor para los
campos de imagen. Tambin puede cambiar el tamao
del marco arrastrando los controladores.

5.

Para cerrar el cuadro de dilogo, haga clic en Cerrar.

Seleccin, filtrado y ordenacin de listas


combinadas
Sea cual sea el tipo de origen de datos que est utilizando, siempre
puede ver los datos actuales en formato de filas y columnas, con la
opcin de personalizacin combinar lista (los datos que se
combinarn), incluyendo o excluyendo registros concretos. Puede
hacerlo "manualmente" o preferiblemente aplicando eficientes
opciones de filtrado y ordenacin, las cuales permiten incluir solo
algunos registros, u organizar registros en orden, segn el
contenido de ciertos campos. Por ejemplo, con una base de datos
de lista de direcciones o de contacto puede ordenar por cdigo
postal y luego por apellidos.

208 Adicin de objetos web dinmicos


Para editar la lista de combinacin actual:
1.

Con el rea que se repite seleccionada, haga clic en


Editar base de datos
de contexto.

en la barra de herramientas

2.

Utilice el botn Editar... para acceder al cuadro de


dilogo Combinar lista de combinacin.

3.

Especifique qu registros se incluirn o excluirn


(activando/desactivando) y aplique las funciones
avanzadas de filtro/ordenacin (con el botn Filtro)
para perfeccionar los datos.

4.

Haga clic en Aceptar.

Combinacin y publicacin
Una vez que tiene seleccionado qu registros va a combinar (su
lista de combinacin) y ha introducido todos los marcadores de
posicin necesarios, como se indica ms arriba, ya est listo para
combinar el contenido de la base de datos con un sitio temporal y,
despus, publicarlo.
Para combinar con un nuevo sitio:
1.

Haga clic en Combinar con nuevo sitio


barra de herramientas de contexto.

2.

Entonces, WebPlus genera un sitio nuevo en una ventana


aparte, replicando el rea bsica que se repite tantas
veces como registros haya en los datos. El diseo utiliza
la organizacin en cuadrcula que haya especificado, en
la que cada celda incluye los datos de un solo registro,
siguiendo el orden de los registros de la lista de
combinacin. WebPlus inserta pginas nuevas segn se
vayan necesitando para incluir todos los registros.
Observe que el rea que se repite ya no est presente,
sino que se ha convertido en un diseo de cuadrcula que

en la

Adicin de objetos web dinmicos 209

utiliza los datos combinados, en vez de los campos de


marcadores de posicin.
Si necesita ajustar las propiedades de visualizacin,
como el tamao y la alineacin de la imagen para
cualquier marco de imagen individual, haga clic con el
botn secundario del ratn en el cuadro y elija
Propiedades del marco....
El sitio original permanece abierto en su propia ventana. No olvide
guardarlo por si necesita repetir el proceso de combinacin con
otro conjunto de datos. Si no est satisfecho con el sitio resultante,
vuelva al original, realice cambios y repita el proceso de
combinacin.
Para publicar el sitio:
Con el activo combinado del sitio actualmente activo, elija
Publicar sitio> en el men Archivo y seleccionePublicar en la
Web.
De forma predeterminada, la combinacin ocurrir
automticamente antes de comenzar la publicacin. Si
no desea combinar cada vez, desactive Combinar
antes de publicar en el cuadro de dilogo Publicar en
la Web.

Uso de objetos inteligentes


Para las modernas caractersticas web interactivas (contadores,
foros, blogs, reserva de recursos, etc.), WebPlus emplea objetos
inteligentes de servidor colocados en la pgina. Los objetos
inteligentes almacenan los datos recopilados del visitante de la web
en un espacio propio del servidor seguro Serif. Estos objetos estn
disponibles en Recursos Web Serif, un servicio seguro en lnea
que, adems de crear e insertar objetos inteligentes, permite
almacenar y administrar datos de objetos una vez que el sitio se ha
publicado y est activo.

210 Adicin de objetos web dinmicos


A continuacin, veremos cada uno de los objetos inteligentes que
encontrar en Recursos Web y lo que puede hacer con ellos.
Nombre

Utilizar el
Se utiliza para mostrar cuntas personas estn
viendo actualmente la pgina web.

Vista
activa
Un blog funciona como un diario personal en la
pgina web que recoge sus propios artculos,
publicados en un editor de texto fcil de utilizar.
Los visitantes de la pgina web pueden comentar
los artculos. Con los blogs puede:

Blog

Aadir su propio perfil personal.

Aadir vnculos de marcadores sociales.

Utilizar los retroaccesos de artculos para


referencias cruzadas entre blogs; recibir
retroaccesos.

Utilizar las etiquetas para clasificar los


artculos y facilitar as el acceso a los
usuarios.

Permitir a los usuarios suscribirse a los


artculos (artculos/comentarios ms
recientes) a travs de lectores de fuente RSS.

Activar la proteccin anti-spam CAPTCHA.

Aplicar estilos visuales (tema) a su blog.

Usar Editor de grupos para publicar artculos


de varios autores (consulte la pg. 232).

Adicin de objetos web dinmicos 211

Aade un foro de discusin basado en un hilo al


sitio, opcionalmente en una ventana de tamao
completo. Con los foros puede:

Foro

Aadir, en distintas categoras (p. ej.,


automovilismo), varios subforos (clsicos,
descapotables, personalizados, etc.).

Establecer control de acceso para


usuarios y moderadores (consulte la
pg. 222).

Definir la privacidad del foro como


pblica o privada.

Aplicar un tema (estilo) al objeto total


de foro.

Crear, editar y asignar rangos de


usuario.

Definir permisos de usuario.

Los usuarios pueden ver una serie de temas,


publicaciones y la ltima publicacin enviada y,
por supuesto, publicar contenido en el foro.

Contador
de visitas

Noticias

Constituye una forma sencilla de contar el


nmero de visitas de la pgina actual (se puede
restablecer si es necesario). Pueden adoptarse
estilos diferentes.
Aade una ventana de noticias a una pgina. El
objeto es compatible con la edicin de RTF, as
como con los estilos de prrafos, hipervnculos,
archivos multimedia introducidos e incluso
edicin de cdigo fuente HTML.

212 Adicin de objetos web dinmicos


Inicia una encuesta en lnea para conocer las
opiniones de los visitantes de la pgina web.
Encuesta

Sistema de
gestin de
contenidos
(CMS)

Permite que el desarrollador web agregue


contenido a las pginas web de forma remota,
sin acceder ni publicar a travs de WebPlus. El
contenido se organiza en artculos, que se
pueden clasificar, crear, modificar, eliminar y
agrupar en categoras. Los visitantes del sitio
pueden comentar y evaluar cualquier artculo.
Se pueden dar al CMS sus propios colores.

Reserva
de
recursos

Cuadro de
mensajes

Lista de
usuarios

Ofrece la reserva en lnea de habitaciones de


hotel, salas de reuniones, salones de ensayo,
entradas para el teatro, etc. Se pueden hacer
reservas por horas o por das, reservas
recurrentes y reservas con varios precios para
distintos grupos de edades.
Acta como una ventana de conversacin
interactiva parecida a Windows Messenger.
Permite que los visitantes de la web hablen entre
ellos.
El objeto inteligente de lista de usuario funciona
en dos modos (cada modo se puede seleccionar
mediante un cuadro de dilogo emergente):

Modo de lista de correo: los


visitantes al sitio web se pueden
suscribir a boletines, confirmaciones
de fiestas, solicitud de informacin,
etc. Las listas se pueden controlar de
forma manual o mediante
autosuscripciones.

Adicin de objetos web dinmicos 213

Modo de control de acceso: controla


la accesibilidad a pginas, foros, blogs
y CMS mediante el uso de grupos de
usuarios. Consulte Control de acceso
en la pg. 222 para obtener ms
informacin.

Activar la proteccin anti-spam


CAPTCHA durante el registro de
un usuario.

Crear grupos de usuarios (con las


opciones de inicio de sesin del
usuario, inicio de sesin
automtico y conexin a objetos
inteligentes).

Aadir, eliminar, suspender o


prohibir usuarios.

Como los objetos inteligentes se guardan en los


Recursos Web Serif, puede utilizar los botones de ayuda
que acompaan a cada objeto inteligente (a medida que
los crea y administra) para obtener informacin ms
detallada.
Por motivos de seguridad, los objetos solo estn disponibles
mediante el inicio de sesin de Recursos Web Serif, adonde se
puede acceder desde WebPlus. Si no dispone de un nombre de
usuario y contrasea vlidos debe crear antes una cuenta de
Recursos Web.

Si Serif ya dispone de su direccin de correo electrnico


(quizs ya se haya registrado o lo haya hecho
anteriormente), se le harn una serie de preguntas para
completar el registro de la cuenta.

214 Adicin de objetos web dinmicos

Si es nuevo en Serif y no se ha registrado deber


completar todos los pasos de seguridad, segn sea
necesario. En las pantallas de inicio de sesin se ofrecen
todas las instrucciones.

Para crear una cuenta de Recursos Web Serif:


1.

Haga clic en el botn


Herramienta objeto
inteligente, en la barra de herramientas Objetos web.

2.

En el cuadro de dilogo de inicio de sesin, haga clic en


el enlace Crear cuenta, situado bajo las casillas de inicio
de sesin.

3.

En el siguiente cuadro de dilogo, introduzca su


direccin de correo electrnico, el nombre de pantalla y
una contrasea dos veces. Deber leer y estar de acuerdo
con los trminos y condiciones de uso de Serif (mediante
una casilla de verificacin).

4.

Haga clic en el botn Iniciar sesin.

5.

Aparece otro cuadro de dilogo en el que se le pedirn


datos personales y que cuenta con unas casillas de
verificacin que puede activar si desea recibir boletines
de la comunidad de Serif, ofertas de Serif u otras ofertas
de terceros.

6.

Se le enviar un correo electrnico de confirmacin a su


direccin de correo electrnico. Haga clic en el enlace
del correo electrnico para iniciar sesin en Recursos
Web Serif (vuelva a hacer de nuevo clic en Herramienta
objeto inteligente).

Para borrar la informacin de la cuenta:

Vaya a Herramientas>Opciones y haga clic en Borrar


detalles de la cuenta, que aparece en la opcin de men
Opciones>General. As se borrar la informacin de

Adicin de objetos web dinmicos 215

inicio de sesin almacenada, para que no vuelva a


funcionar el inicio de sesin automtico de Recursos
Web Serif. Ser necesario introducir la informacin la
prxima vez, as que deber recordar la contrasea.
Para acceder a Recursos Web:
1.

Herramienta objeto
Haga clic en el botn
inteligente, en la barra de herramientas Objetos web.

2.

En el inicio de sesin, introduzca el nombre de usuario y


la contrasea. Active la casilla Recordar detalles de la
cuenta para acceder a Recursos Web directamente en un
futuro (saltndose la pantalla de inicio de sesin).

3.

Haga clic en el botn Iniciar sesin. Aparecer el cuadro


de dilogo Objetos inteligentes.

Cuando haya creado la cuenta, puede comprobar la


informacin de la misma desde el cuadro de dilogo
Objetos inteligentes, haciendo clic en el botn Mi
cuenta.

Creacin de objetos inteligentes


Un objeto inteligente es un trmino general que hace referencia a
los elementos que se utilizan en una pgina, como se ha tratado
anteriormente. Los objetos inteligentes no se aaden directamente
a la pgina desde los Recursos Web Serif, sino que se agregan
primero a su propia biblioteca de objetos (la biblioteca le permite
administrar y editar cada objeto) y, a continuacin, se pueden
aadir a la pgina web inmediatamente o ms tarde.
Algunos objetos inteligentes estn condicionados por
otros objetos inteligentes que tienen que crearse
primero. Un ejemplo es el objeto inteligente Foro,
que necesita que antes se haya creado el objeto
inteligente Lista de usuarios.

216 Adicin de objetos web dinmicos


Los objetos inteligentes se pueden organizar en perfiles
categorizados. Estos resultan tiles si se estn administrando varios
sitios web, en los que los objetos inteligentes se pueden agrupar en
un perfil por sitio.
Para crear un perfil de objeto inteligente:
1.

En el cuadro de dilogo principal Objetos inteligentes,


haga clic en el botn Administrar perfiles, en la parte
inferior del panel Mi biblioteca de objetos inteligentes.

2.

Haga clic en Nuevo perfil y, a continuacin, introduzca


un Nombre nuevo en el cuadro de texto.

3.

Haga clic en Guardar y, a continuacin, haga clic en


Salir.

El perfil se aade a la parte superior del panel Mi biblioteca de


objetos inteligentes. A continuacin, puede aadir objetos
inteligentes al nuevo perfil mediante el mtodo de arrastrar y
soltar.
Para aadir un objeto a la biblioteca:
1.

En el cuadro de dilogo principal Objetos inteligentes,


haga clic en el botn Nuevo....

2.

En el cuadro de dilogo Crear objeto inteligente, utilice


la barra de desplazamiento para desplazarse por la lista y
seleccione un objeto inteligente.

3.

(Opcional) Para que el objeto inteligente trabaje en un


idioma diferente al ingls, seleccione en el men
desplegable Idioma.

4.

Seleccione Aceptar. En funcin del tipo de objeto


seleccionado, aparecer un cuadro de dilogo Crear que
muestra opciones especficas al objeto inteligente.

5.

En el cuadro de dilogo:

Adicin de objetos web dinmicos 217

6.

Introduzca su propio Nombre para el objeto.

(Opcional) Seleccione un perfil del men


desplegable si se ha creado previamente.

(Opcional) Aada una cadena Filtrar fuera del


sitio (el acceso al objeto se limitar al dominio
introducido y evitar que la URL se copie).

(Opcional) Cambie la configuracin especfica del


objeto, p. ej., para algunos objetos tambin puede
definir el ttulo, los colores (para el cuerpo, el texto
y el borde) y el grosor del borde si es necesario.

Haga clic en Crear.

El objeto denominado aparecer en una lista en el panel izquierdo


Mi biblioteca de objetos inteligentes. A continuacin, se muestra
un ejemplo de una seleccin de Objetos inteligentes, algunos estn
agrupados en un perfil personalizado denominado Objetos WWW
arco iris.

218 Adicin de objetos web dinmicos


Todos los objetos inteligentes se pueden aadir a la pgina, pero
algunos tipos de objetos inteligentes (como los foros o blogs) no se
aaden a una pgina web, sino que acceden directamente a
Recursos Web Serif (mediante enlaces fuera del sitio o
hipervnculos; consulte la pg. 105 o 105, respectivamente). La
principal ventaja es que no existe ninguna limitacin si se tiene el
objeto inteligente contenido dentro de las dimensiones de la pgina
(lo que evita el desplazamiento por la ventana).
Para aadir un objeto inteligente a la pgina web:
1.

En el cuadro de dilogo Objetos inteligentes, seleccione


el objeto que desea del panel izquierdo y haga clic en el
botn Insertar.

2.

Para insertar el objeto con un tamao


predeterminado, coloque el cursor en la parte de la
pgina donde desea que aparezca el objeto y, a
continuacin, simplemente haga clic.

Automticamente aparece una vista previa del objeto inteligente en


la pgina, con lo que sabr cmo se ver el objeto inteligente
publicado.

Edicin de objetos inteligentes


Despus de crear un objeto inteligente, este se puede modificar en
Mi biblioteca de objetos inteligentes o directamente en la pgina.
Lo normal es que desee modificar los ajustes generales de
apariencia del objeto, cambiar una pregunta de la encuesta o
restablecer el contador de visitas a cero.
La modificacin de un objeto solo afecta al objeto en s y no altera
los datos recopilados.
Las opciones del dilogo de modificacin y creacin de objetos
inteligentes son idnticas.

Adicin de objetos web dinmicos 219

Para editar un objeto inteligente en la biblioteca:

En el cuadro de dilogo Objetos inteligentes, haga clic en


el botn Editar... de la parte inferior del panel Mi
biblioteca de objetos inteligentes.

Para editar un objeto inteligente en la pgina:

Haga doble clic en el objeto para abrir el cuadro de


dilogo Editar del objeto.
Si edita un objeto en la pgina web, el cambio
tambin se refleja en la biblioteca de objetos y
viceversa.

Aplicacin de colores a los objetos inteligentes


Puede realizar cambios en los colores, en concreto en el blog, foro
o CMS a medida que los edita o administra. Cada tipo de objeto
inteligente tiene sus propios ajustes de colores, es decir:
Objeto
inteligente

Cmo configurar los colores

Blog

Lista desplegable Estilo visual del cuadro de


dilogo Editar - Nuevo blog.

Foro

Lista desplegable Temas de foro del cuadro de


dilogo Administrar - Mi Foro.

CMS

Botones Ttulo, Cuerpo e Info del cuadro de


dilogo Editar - Nuevo CMS.

Adems de estos ajustes de colores, puede invalidar los colores del


texto y los hipervnculos de los objetos inteligentes para que
coincidan con los colores del texto y de los hipervnculos del sitio.
Con ello, los objetos inteligentes encajarn a la perfeccin en el
aspecto del sitio. Cuando se utiliza la funcin de invalidar, se usan

220 Adicin de objetos web dinmicos


de forma predeterminada los colores del texto y de los
hipervnculos del esquema actual del sitio.
Para invalidar los colores de los hipervnculos y del
texto de los objetos inteligentes:
1.

En el men Archivo seleccione Propiedades del sitio.

2.

En el cuadro de dilogo, seleccione Caractersticas.

3.

Active la opcin Invalidar colores de objetos


inteligentes.

Si se dejan las listas desplegables Texto e Hipervnculos sin


modificar, se utilizarn los colores del esquema definido
actualmente
(indicado por nmeros). Sin embargo, puede seleccionar colores de
otro esquema o de ningn esquema.

Administracin de objetos inteligentes


Mientras que la edicin de objetos inteligentes afecta a la forma en
la que funcionan los objetos, la administracin de objetos
inteligentes se puede utilizar para administrar los datos recopilados
de los objetos cuando se publica la pgina web. Algunos objetos
inteligentes, como los contadores de visitas, no necesitan
administrarse, ya que se incrementan en cada visita web (aunque
tambin se puede restablecer). Sin embargo, hay otros objetos
inteligentes ms complejos como el foro, blog, la reserva de
recursos, la lista de usuarios, la encuesta y el cuadro de mensajes
que almacenan datos recopilados de los visitantes, como
comentarios de artculos, direcciones de correo electrnico,
resultados de encuestas y registros de los mensajes de
conversacin.
El objeto inteligente de CMS se puede gestionar solo
mediante un navegador web, utilizando la URL
www.serifwebresources.com.

Adicin de objetos web dinmicos 221

Para administrar editar un objeto inteligente desde la


biblioteca:

En el cuadro de dilogo Objetos inteligentes, haga clic en


el botn Administrar de la parte inferior del panel Mi
biblioteca de objetos inteligentes. Las opciones de
administracin son diferentes para cada tipo de objeto
inteligente.

Consulte la ayuda de WebPlus para ver una descripcin general de


las funciones de administracin.
Para administrar directamente objetos inteligentes en
Internet:

Inicie sesin en www.serifwebresources.com para


controlar todos los objetos inteligentes
independientemente del sitio de WebPlus. Utilice el
inicio de sesin de Recursos Web habitual, al igual que
anteriormente.

Eliminar objetos inteligentes


Para eliminar un objeto de una biblioteca:

Seleccione la entrada del objeto en el panel Mi biblioteca


de objetos inteligentes y haga clic en el botn Eliminar.
Aparecer un mensaje de confirmacin.

Esto provocar que las pginas web cargadas que incluyan el


objeto muestren un espacio vaco hasta que el objeto se elimine de
la pgina web correspondiente de WebPlus y la pgina web se
vuelva a cargar de nuevo.
Para eliminar un objeto de la pgina:

Seleccione el objeto y pulse el botn Eliminar.

222 Adicin de objetos web dinmicos

Control de acceso
El control de acceso permite aplicar seguridad al sitio, ya sea para
restringir el acceso a determinadas pginas o para controlar el
acceso de los usuarios a foros y otras caractersticas de los recursos
Web Serif.

Para la seguridad de la pgina: iniciar sesin en una o


varias pginas protegidas por contrasea o a travs de un
cuadro de inicio de sesin incluido en la pgina. Por lo
general, se utiliza en sitios web personales o de pequeas
empresas; puede permitir el acceso ilimitado a la mayor
parte del sitio, con un pequeo conjunto de pginas
accesibles solo a visitantes web seleccionados. Por
ejemplo, puede hacer que una pgina de galera
fotogrfica de su familia sea "privada", pero compartirla
con sus familiares (mediante control por contrasea). La
informacin de inicio de sesin se almacena en un grupo
de usuarios asociado a la pgina que contiene una lista de
los usuarios asociados; la adicin de usuarios se realiza
bien de forma manual, por parte del administrador web, o
bien mediante suscripcin por parte de los propios
nuevos usuarios.

Para la seguridad de objetos inteligentes: proporciona


control de acceso para foros, blogs y CMS (consulte la
pg. 232).

Foros: para la administracin de usuarios y la


moderacin de grupos.

Blogs: para aadir y eliminar artculos a travs de un


grupo de editores.

CMS: para administrar los artculos del CMS.


El control de acceso se puede ejercer a travs de Recursos Web
Serif mediante el uso de un objeto inteligente de lista de usuarios,
que se puede crear para administrar usuarios y grupos de usuarios y
el modo en que estos inician sesin.

Adicin de objetos web dinmicos 223

A modo de recordatorio breve, Recursos Web Serif


es un servicio en lnea seguro alojado por Serif en el
que se almacenan de forma segura objetos
inteligentes (consulte la pg. 209) y todos los
datos generados. Puede administrar su objeto
inteligente de lista de usuarios, al igual que cualquier
otro objeto inteligente, desde WebPlus o a travs de
www.serifwebresources.com, en cualquier
momento.
El correcto establecimiento del control de acceso en su sitio web
depende de los siguientes pasos.

Configuracin del objeto inteligente de lista de


usuarios

Adicin de usuarios (manual o mediante registro)

Habilitacin del control de acceso

Adicin de un cuadro de inicio de sesin

Control de usuario avanzado

Configuracin del objeto inteligente de lista


de usuarios
En primer lugar, debe crear un objeto inteligente de lista de
usuarios y, a continuacin, crear uno o varios grupos conectados a
ese objeto inteligente. Por lo general, solo necesitar un objeto
inteligente por sitio; a continuacin, puede utilizar cada uno de los
grupos para controlar el acceso a determinadas pginas o recursos
de objetos inteligentes.

224 Adicin de objetos web dinmicos


Para crear un objeto inteligente de lista de usuarios:
1.

Haga clic en el botn Herramienta objeto inteligente


, en la barra de herramientas Objetos web.

2.

Inicie sesin en Recursos Web Serif (Consulte Uso de


objetos inteligentes; p. 209). Se da por hecho que ya
dispone de un inicio de sesin vlido; de lo contrario,
tendr que registrarse.

3.

En el cuadro de dilogo, seleccione el botn Nuevo..., en


la parte inferior del panel Mi biblioteca de objetos
inteligentes.

4.

En el cuadro de dilogo, utilice la barra de


desplazamiento para moverse por la lista de objetos
inteligentes y, a continuacin, seleccione Lista de
usuarios y haga clic en Aceptar.

5.

En el cuadro de dilogo que aparecer, seleccione


Control de acceso.

6.

En el cuadro de dilogo, d un nombre al objeto


inteligente, gurdelo en un perfil y modifique los colores
y fuentes del ttulo, texto/etiquetas, botones o borde.

7.

Haga clic en Crear. El nuevo objeto inteligente


aparecer en la biblioteca de objetos inteligentes.

8.

Haga clic en Salir para salir de Recursos Web Serif.

Una vez que haya creado el objeto inteligente, podr crear grupos
de usuarios y asociarlos a l mediante la caracterstica Administrar.
Para controlar el registro de usuarios y la seguridad:
1.

Haga clic en el botn Herramienta objeto inteligente


, en la barra de herramientas Objetos web.

Adicin de objetos web dinmicos 225

2.

Con el objeto inteligente de lista de usuarios


seleccionado, en el panel Mi biblioteca de objetos
inteligentes, haga clic en el botn Administrar para que
aparezca el cuadro de dilogo Usuarios.

3.

Para activar el registro de usuarios en el objeto


inteligente, active la opcin Permitir registro en la lista
de usuarios. Esto permite que aparezca un vnculo
Regstrese en el cuadro de inicio de sesin.

4.

Para aumentar la seguridad en el registro de usuarios,


active la opcin Habilitar CAPTCHA. CAPTCHA es
una tcnica anti-spam en la que se muestra texto
arbitrario generado por el servidor; el visitante web debe
escribir el texto, que seguidamente se validar.

5.

Escriba una URL de redireccionamiento en el cuadro


Redirigir tras iniciar sesin si desea dirigir al usuario a
una pgina web determinada una vez que inicie sesin
correctamente.

6.

Haga clic en Actualizar.

Para crear un grupo de usuarios:


1.

En el cuadro de dilogo, haga clic en Grupos, en el


men superior.

2.

En el cuadro de dilogo Crear nuevo grupo, escriba un


Nombre de grupo, que debe reflejar cul es el uso al que
est destinado el grupo; por ejemplo, "Accesofotos".

3.

Haga clic en el botn Crear grupo, compruebe la


configuracin del cuadro de dilogo y haga clic en
Hecho. El grupo se aadir al men desplegable Grupo.

226 Adicin de objetos web dinmicos


Para administrar un grupo de usuarios:

Seleccione el nombre del grupo en el men desplegable


Grupo y, a continuacin, haga clic en Administrar
grupo.

En el cuadro de dilogo, puede cambiar el nombre del grupo y ver


el nmero de usuarios del grupo. Puede realizar cambios haciendo
clic en el botn Actualizar grupo o borrarlo mediante el botn
Eliminar grupo.

Adicin de usuarios (manual o mediante


registro)
adicin de
usuarios
manualmente

Por lo general, la adicin manual de usuarios


es adecuada para entornos controlados, como
pequeas empresas, organizaciones o clubs,
en los que los usuarios son "conocidos".
Por cada grupo de usuarios que se crea, se
puede aadir un grupo de usuarios a cada
grupo de forma manual o bien mediante la
importacin desde un archivo de texto
delimitado por comas por parte del
administrador web.
Es posible utilizar un inicio de sesin de
usuario (el mismo para todos los usuarios) o
crear uno por cada usuario, lo que permite
controlar ms el acceso (por ejemplo, para
listas de miembros).

registro de
usuarios

A la inversa, el registro de usuarios est


pensado para un acceso ms pblico, en el
que no resulta prctico controlar a los
usuarios; as, el usuario puede registrarse y, a
continuacin, iniciar sesin mediante sus
credenciales. El administrador web sigue
teniendo la opcin de administrar estos
usuarios dentro de sus grupos a travs del

Adicin de objetos web dinmicos 227

objeto inteligente de lista de usuarios.


Para emplear este mtodo, es necesario
colocar en la pgina un cuadro de inicio de
sesin en pantalla (por lo general, una pgina
maestra).
Puede aadir ms de un usuario al mismo grupo de
usuarios. El mismo usuario puede pertenecer a
varios grupos de usuarios.
Para aadir un usuario manualmente:
1.

Haga clic en el botn Herramienta objeto inteligente


, en la barra de herramientas Objetos web.

2.

Con el objeto inteligente de lista de usuarios


seleccionado en el panel Mi biblioteca de objetos
inteligentes, haga clic en el botn Administrar del
objeto para que aparezca el cuadro de dilogo Usuarios.

3.

En la seccin Agregar nuevo usuario, situada en la


parte inferior del cuadro de dilogo, introduzca la
direccin de correo electrnico del usuario en el cuadro
Correo electrnico.

Con la opcin Requiere activacin activada, se enviar

228 Adicin de objetos web dinmicos


por correo electrnico al usuario un vnculo junto con
una contrasea generada automticamente. Si est
desactivada, solo se enviar una contrasea generada
automticamente.
Con la opcin Enviar a usuario activada, se enviar un
mensaje de correo electrnico al usuario; si no est
activada, no se enviar dicho mensaje, aunque s se
aadir el usuario. La contrasea debe comunicarse al
usuario a travs de otro medio (por telfono o de forma
verbal).
4.

Haga clic en el botn Aadir usuario. El usuario se


aade a la lista de usuarios, en la seccin Usuarios.

5.

Para asignar usuarios a un grupo, haga clic en Grupos,


en el men superior.

6.

Seleccione el grupo en la lista desplegable Grupo y, a


continuacin, aada el usuario seleccionado en el cuadro
Usuarios al cuadro Grupo haciendo clic en el botn
Agregar (si va a aadir a todos los usuarios, haga clic en
Aadir todos). A partir de ese momento, el usuario
pertenecer al grupo de usuarios. Para eliminar usuarios,
utilice el botn Quitar (o Quitar todo) del grupo.

Si esta caracterstica est configurada, puede hacer que los usuarios


se registren a s mismos, lo que evita la necesidad de tener que
aadir y administrar manualmente cada usuario tal y como se
describe ms arriba. Esto se hace a travs de Recursos Web Serif.
Para habilitar el registro de usuarios:
Para emplear este mtodo, es necesario aadir un
cuadro de inicio de sesin a la pgina maestra.
Los nuevos visitantes del sitio pueden registrarse
para convertirse en usuarios registrados (haciendo
clic en el vnculo Regstrese, en el cuadro de inicio
de sesin).

Adicin de objetos web dinmicos 229

1.

Haga clic en el botn Herramienta objeto inteligente


, en la barra de herramientas Objetos web.

2.

Con el objeto inteligente de lista de usuarios


seleccionado en el panel Mi biblioteca de objetos
inteligentes, haga clic en el botn Administrar del
objeto para que aparezca el cuadro de dilogo Usuarios.

3.

Haga clic en Grupos, en el men superior.

4.

En el cuadro de dilogo, seleccione un grupo existente en


la lista desplegable Grupo y, a continuacin, haga clic
en Administrar grupo.

5.

Active la opcin Agregar nuevos usuarios cuando se


registren y los detalles de inicio de sesin del usuario se
aadirn al grupo de usuarios durante el registro. Cuando
esta opcin est activada, el proceso de inicio de sesin
permite el acceso a todos los grupos que tengan
habilitado el registro; de lo contrario, las pginas
restringidas estarn protegidas.

6.

Haga clic en Actualizar grupo y, a continuacin, en


Hecho.
Si est creando un grupo nuevo, no olvide hacer clic
en Agregar nuevos usuarios cuando se
registren, en la seccin Crear nuevo grupo.
Haga clic con el botn secundario en un cuadro de
inicio de sesin en la pgina y seleccione
Administrar objeto inteligente.
Cuando los usuarios se registran a travs de un
cuadro de inicio de sesin en pantalla, aparecen en
todos los grupos de usuarios que tengan habilitada
la opcin de registro de usuarios (Consulte la Ayuda
de WebPlus para obtener ms informacin).

230 Adicin de objetos web dinmicos

Habilitacin del control de acceso


Para habilitar el control de acceso en la pgina web:
1.

Con la pgina web visible, haga clic en Seguridad de la


pgina
, en la barra de herramientas de contexto
Predeterminado.

2.

Active la opcin Proteger pgina con contrasea para


habilitar el control de acceso. Observar que el botn
Cambiar / Administrar pasa a estar activo. Haga clic en
este botn para mostrar los grupos de usuarios que hay
actualmente disponibles (en negrita) y el objeto
inteligente de lista de usuarios al que pertenecen.

3.

En el cuadro de dilogo Grupos de usuarios, seleccione


el grupo de usuarios, por ejemplo, Accesofotos, y, a
continuacin, haga clic en Aceptar. En la pestaa
Seguridad de pgina de la pgina debe aparecer que la
pgina est protegida mediante contrasea y que el grupo
de usuarios est asignado.

4.

Haga clic en Aceptar y, a continuacin, otra vez en


Aceptar para salir de los cuadros de dilogo.
Podr ver que, en la pestaa Sitio, la pgina
contiene un smbolo de llave
, que indica que la
seguridad de la pgina est activada.

Adicin de objetos web dinmicos 231

Adicin de un cuadro de inicio de sesin


WebPlus permite aadir un cuadro
de entrada de inicio/cierre de
sesin a una pgina del sitio web.
Esto significa que un visitante web
registrado puede obtener acceso a
las pginas restringidas iniciando
sesin en el sitio.
El cuadro de inicio de sesin es,
en realidad, una representacin
visual del objeto inteligente de
lista de usuarios; aparece en la
pgina al igual que todos los
dems objetos existentes de
Recursos Web Serif.
Los usuarios pueden agregarse
manualmente en Recursos Web
Serif o a travs del registro de los
propios usuarios.
Aada el cuadro de inicio de sesin a la pgina
maestra del sitio. A continuacin, todas las pginas
web que utilicen la pgina maestra ofrecern al
usuario la oportunidad de iniciar sesin en el sitio
web.
Para aadir un cuadro de inicio de sesin de usuario:
1.

Siga el procedimiento que figura en Habilitacin del


control de acceso (consulte la pg. 230) pero, en lugar
de salir del cuadro de dilogo, elija una pgina en la que
colocar el cuadro de inicio de sesin y, a continuacin,
haga clic en el botn Insertar.

232 Adicin de objetos web dinmicos


2.

Coloque el cursor de Pegar


donde desee situar el
cuadro de inicio de sesin de usuario y, a continuacin,
haga clic para insertar el objeto con un tamao
predeterminado.

3.

Habilite el registro por parte de los propios usuarios tal y


como se describe ms arriba (Consulte la Ayuda de
WebPlus para obtener ms informacin).

Control de usuario avanzado


Ciertas caractersticas adicionales permiten importar/exportar,
suspender y prohibir/admitir usuarios dentro de los grupos de
usuarios. Un usuario prohibido lo es de forma global (se le impide
el acceso a todos los grupos de usuarios).
Es posible eliminar o suspender temporalmente a cualquier usuario
por infringir las normas del sitio (por ejemplo, por publicar
contenido difamatorio en un foro pblico). La prxima vez que el
usuario trate de iniciar sesin, aparecer un mensaje que indica que
la cuenta se ha suspendido.
Si se necesitan tomar medidas ms drsticas, es posible prohibir a
la direccin IP de un usuario acceder a los objetos de Recursos
Web Serif (por ejemplo, foros, etc.). Como ltimo recurso, es
posible prohibir el acceso del ISP u organizacin a la que
pertenezca el titular de la direccin de correo electrnico. Por lo
general, esta ltima opcin no se recomienda, pero puede resultar
necesaria para impedir malas prcticas institucionales, como el
envo de spam profesional.
Consulte la Ayuda de WebPlus para obtener ms informacin.

Adicin de objetos web dinmicos 233

Control de acceso con foros, blogs y CMS


Para configurar el control de acceso a foros:
1.

Seleccione el objeto inteligente de lista de usuarios que


ya se cre para el control de acceso al crear un foro.
WebPlus crear automticamente un grupo de usuarios
para permitir el registro por parte de los propios usuarios
y el inicio de sesin. El visitante a los foros tendr que
hacer clic en el vnculo de registro e iniciar sesin.

2.

Para configurar un grupo de moderadores de un foro,


debe crear un grupo de moderadores, aadir los
moderadores manualmente, administrar el foro y
elegir el grupo en el men desplegable Moderado por
grupo.

Para configurar el control de acceso a blogs o CMS:

Debe crear un grupo de editores, aadir los editores


manualmente y, a continuacin, hacer una de estas dos
cosas:

Para los blogs, hacer clic en Administrar y elegir el


grupo en el men desplegable Grupo de editores.
O bien
Para CMS, hacer clic en Administrar y elegir los
permisos cuando se le dirija a
www.serifwebresources.com. Aparece el mismo men
que en el caso anterior.

234 Adicin de objetos web dinmicos

Trabajo con texto

236 Trabajo con texto

Trabajo con texto 237

Importacin de texto de un archivo


La importacin de texto de un archivo de procesador de texto es un
mtodo rpido para generar contenido de texto en el sitio (pero
tambin puede crear una historia con WritePlus). Si utiliza su
procesador de texto actual (como Microsoft Word) para crear
archivos de texto para su sitio, puede importar cualquier nmero de
archivos a un sitio.
Adems del formato de WritePlus (.stt), se puede importar una
variedad de formatos de texto y procesadores de texto populares,
como, por ejemplo:
Texto ANSI

.txt

Microsoft
Word
2007/2010

.docx/.dotx

Microsoft
Word
2000/2003

.doc/.dot

MS Works

.wps

Texto Open
Office

.odt

Formato de
texto
enriquecido

.rtf

Wordperfect

.wpd

Write

.wri

Para los formatos de Microsoft Word creados en cualquier sistema


operativo de Windows no necesita tener Microsoft Word instalado

238 Trabajo con texto


localmente. Esto significa que puede reutilizar el contenido de
texto de terceros en WebPlus sin la aplicacin compatible.
WebPlus importar el texto a un nuevo marco de texto creativo
(admite ajustar texto en marcos) o a un marco HTML o de texto
creativo seleccionado (los marcos HTML no admiten ajustar el
texto) que ya exista en el sitio web. Consulte Introduccin a los
marcos de texto en la pg. 241 para obtener ms informacin.
WebPlus mantendr el formato del texto de
procesador de texto importado. No obstante, si est
utilizando el procesador de texto para crear textos
especficamente para WebPlus, ahorrar tiempo
escribiendo como solo texto y aplicando el formato
posteriormente en WebPlus.
Las tablas no pueden importarse.
Para importar texto de un archivo:
1.

(Opcional) Si usa un marco de texto vaco existente,


seleccione el marco. Si inserta texto en un marco de texto
rellenado, haga clic para crear un punto de insercin (o
seleccione la parte del texto que desee sustituir).

2.

Seleccione Archivo de texto... en el men Insertar.

3.

En el cuadro de dilogo Abrir, seleccione el formato de


archivo de origen que se importar y localice el archivo.

4.

Quite la marca de seleccin de la casilla Conservar


formato para conservar los estilos de formato del
archivo original. Quite la marca de seleccin de la casilla
para descartar esta informacin. En cualquier caso,
WebPlus mantendr las propiedades bsicas de los
caracteres, como cursiva, negrita, subrayada, y las
propiedades del prrafo, como la alineacin (izquierda,
centro, derecha, justificada).

Trabajo con texto 239

5.

Haga clic en Abrir.

6.

El texto ser importado en el objeto de texto


preseleccionado o un marco de texto nuevo. Para los
marcos de texto HTML, puede optar por su marco. Para
resolver esto, consulte Control del texto del marco con
desbordamiento en la pg. 243.
Para los Marcos creativos, si no cabe todo el texto
importado en el marco de texto activo, se le preguntar
en un cuadro de dilogo si desea crear marcos
adicionales para alojar el texto con desbordamiento (haga
clic en S) o si desea colocar el texto con desbordamiento
en un rea con desbordamiento oculta (haga clic en No).

Introduccin a los marcos de texto


Normalmente, el texto en WebPlus entra en marcos de texto
HTML, que funcionan igual de bien que los contenedores de
palabras nicas o prrafos y artculos independientes. Tambin
puede usar texto artstico para el texto independiente con efectos
especiales o texto de una tabla (consulte Creacin de tablas
basadas en texto en la pg. 275) para mostrar filas y columnas.

Qu es un marco de texto?
Un marco de texto es realmente una minipgina, que contiene el
texto del marco en uno o varios prrafos que se ajustan al marco.
En WebPlus, el texto de un marco se llama una historia.

Cuando selecciona un marco ver el cuadro delimitador,


indicado por una lnea de borde junto con controladores
de esquina y borde, y (si hizo clic con la herramienta
Puntero) un punto de insercin intermitente en el texto
del marco. En este modo, puede editar el texto con la
herramienta Puntero. (Para obtener ms informacin,
consulte el tema Editar texto en la pgina en la
pg. 251.)

240 Trabajo con texto

Cuando se mueve un marco de texto, su texto de historia


se mueve con l.

Cuando redimensiona un marco de texto, su texto de


historia se reajusta a las nuevas dimensiones.

Creacin de marcos HTML


Aada marcos a una pgina al igual que con cualquier otro objeto.
Puede seleccionar, mover y redimensionar cualquier marco, pero
no puede editar la forma bsica. (Consulte la pg. 295, 295 y 295,
respectivamente.)
Para crear un marco:
1.

Haga clic en el botn Herramienta de marco de texto


HTML
del elemento flotante Marcos de texto en
la barra de herramientas Objetos estndar.

2.

Haga clic en la pgina o en el rea de pegado para crear


un marco nuevo con un tamao predeterminado.
- o bien Arrastre para atribuir al marco de texto las dimensiones
que desee.

Para eliminar un marco:

Seleccione el marco y pulse la tecla Eliminar. (Si existe


un punto de seleccin en el texto, pulse Eliminar para
quitar los caracteres despus del cursor.)

Cmo colocar texto en un marco


Puede colocar el texto en un marco en una de varias formas. El
texto se convertir al cdigo compatible con HTML.
Editor de
historia

Con un marco seleccionado, haga clic en

Trabajo con texto 241

WritePlus:

WritePlus
en la barra de herramientas
de contexto Marco.

Importacin
de texto:

Haga clic con el botn secundario en un


marco y seleccione Insertar>Archivo de
texto.... (atajo de teclado Ctrl+T) para
importar el texto.

Escritura en
el marco:

Seleccione la Herramienta Puntero, a


continuacin haga clic para crear un punto
de insercin en el que escribir en un marco o
editar el texto existente.
(Consulte Edicin de texto en la pgina en
la pg. 251.)

Pegado a
travs del
Portapapeles:

En un punto de insercin en el texto pulse


Ctrl+V.

Arrastrar y
colocar:

Seleccione el texto (p. ej., en un archivo de


procesador de texto) y arrstrelo a la pgina
de WebPlus.
Si lo coloca en un marco seleccionado, el
texto se pega alineado despus del texto
existente. De lo contrario, se crea un nuevo
marco para el texto.

Configuracin y diseo del marco


El diseo del marco controla la manera en la que el texto se ajusta
al marco. Cuando se selecciona el marco y se definen valores para
mrgenes, los mrgenes del marco aparecen como lneas de
guiones grises. Estas guas determinan cmo se ajusta el texto en el
marco proporcionando un relleno entre el texto y borde del marco.
El texto no se ajustar fuera de los mrgenes del marco.

242 Trabajo con texto

Para crear mrgenes del marco:

Seleccione el objeto del marco, arrastre las lneas de


margen de la columna para ajustar los lmites de la
columna.

(1)

(2)

(3)

La ilustracin anterior muestra cmo el cursor cambia cuando pasa


sobre la casilla de limitacin (1), cmo el margen del marco se
puede ajustar tras arrastrar hacia adentro (2) y cmo el margen del
marco superior se puede mover tras arrastrar hacia abajo (3).

Trabajo con texto 243

Para permitir que los mrgenes del marco se


establezcan, asegrese de que el marco est
seleccionado (y no el texto del marco). El cuadro debe
mostrar un cuadro delimitador slido.
Para colocar el margen de forma precisa, puede crear
opcionalmente mrgenes de marco mediante el cuadro de dilogo,
definiendo los mrgenes del marco izquierdo, derecho, superior o
inferior.
Para crear mrgenes de marco mediante el cuadro de
dilogo:
1.

Seleccione el marco HTML y, a continuacin, en la barra


de herramientas de contexto Marco, haga clic en
Configuracin del marco

2.

En el cuadro de dilogo, puede definir mrgenes de


marco estableciendo los valores Izquierda, Derecha,
Superior e Inferior.

Controlar el texto de marco con


desbordamiento
Ajustar el texto de la historia de forma precisa en marcos de texto
es parte del arte de disear sitios web. Si existe demasiado texto de
la historia para ajustar dentro del marco de texto, WebPlus lo
almacena en una rea de desbordamiento oculta (pero no
perdida) en la parte inferior del marco.
El botn Desbordamiento de texto
muestra del marco con
desbordamiento para indicar este texto oculto, as que es
importante asegurarse de volver a mostrar el texto, porque si no la
historia quedar truncada.

244 Trabajo con texto


Para ello, dispone de varias opciones:

Redimensione fsicamente el marco de texto si tiene


espacio. Consulte Cambio de tamao de objetos en la
pg. 295.

Considere el reescribir la historia, para que sea ms


concisa.

Cambie el tamao del texto, como se describe a


continuacin.

Para cambiar el tamao del marco de texto una vez que los marcos
se han redimensionados y colocados, hay varias herramientas
disponibles en la barra de herramientas de contexto Marco.
El elemento flotante Cambio de tamao de texto
ofrece tres herramientas para controlar de qu manera
se escala el texto del marco en el marco. Se trata de
operaciones "puntuales" (en comparacin con las
opciones "continuas" de Ajuste automtico que se
muestran ms abajo).
Ajustar texto
Haga clic en esta opcin para escalar el tamao del texto de la
historia de manera que se ajuste exactamente al marco
disponible; si se aade ms texto al marco, el texto se
desbordar. Puede utilizar esta opcin en un primer momento
para calibrar cmo se ajusta la historia, o bien cuando est
terminando para aplicar el toque final. La opcin Ajustar
texto primero aplica pequeos cambios en el tamao del
punto; despus, pequeos cambios en el interlineado y, a
continuacin, ajusta el valor del espacio inferior del prrafo
hasta que el texto se ajusta.
Ampliar texto
Haga clic en esta opcin para aumentar el tamao del texto de
la historia un incremento (aprox. 2%).

Trabajo con texto 245

Reducir texto
Haga clic en esta opcin para reducir el tamao del
texto de la historia en un incremento.
El texto de la historia de cada marco puede adoptar su propia
configuracin ajuste automtico individual del siguiente modo:
El elemento flotante Opciones de ajuste automtico
ofrece tres opciones que actan de manera continua en
el texto de la historia del marco seleccionado.
Sin ajuste automtico
Se trata del modo de operacin normal en el que, si se
selecciona, el texto no se escalar automticamente en
el marco de texto seleccionado.
Reducir texto al desbordarse
Si se selecciona esta opcin, el texto adicional aadido
al marco seleccionado reducir el texto del marco para
evitar que se desborde.
Ajuste automtico
Si se selecciona esta opcin, el marco se escalar
siempre automticamente ajustando el tamao del texto
(en comparacin con Ajustar texto que ajusta el texto
una vez, con cualquier texto adicional que provoque el
desbordamiento del texto).
Para los marcos creativos, se muestra el botn Vnculo del ltimo
marco de la secuencia

en desbordamiento; aparece un botn

junto al botn Vnculo. Puede reducir la


Flujo automtico
historia o ampliar el espacio aadiendo uno o dos marcos
adicionales a la secuencia. Al hacer clic en el botn Flujo

246 Trabajo con texto


automtico, se aaden automticamente los marcos y las pginas
adicionales que sean necesarios.

Uso del texto artstico


El texto artstico es un texto independiente que se escribe
directamente en una pgina. Resulta especialmente til para
titulares, citas y otros textos para fines especiales. Se le puede
aplicar formato fcilmente con las herramientas estndar de texto.

Para crear texto artstico:


1.

Seleccione Herramienta de texto artstico


en el
elemento flotante Texto de la barra de herramientas
Objetos estndar.

2.

Haga clic en cualquier lugar de la pgina para crear un


punto de insercin usando un tamao de punto
predeterminado o arrastre para especificar un tamao
concreto como se muestra aqu.

3.

Establezca las propiedades iniciales de texto (fuente,


estilo, etc.) que necesite antes de comenzar a escribir,
usando la barra de herramientas de contexto Texto, el
men Texto o haciendo clic con el botn secundario
(seleccionando Formato de texto>).

Trabajo con texto 247

4.

Escriba directamente en la pgina para crear el texto


artstico.

Cuando haya creado un objeto de texto artstico, podr seleccionar,


mover, eliminar y copiarlo, as como cambiarle el tamao,
exactamente igual que hara con un marco de texto. Se pueden
aplicar colores slidos, rellenos de gradiente/de mapa de bits y
transparencia.
Para cambiar el tamao o las proporciones de un objeto
de texto artstico:

Arrastre los controladores de esquina del objeto para


cambiar el tamao sin alterar las proporciones del objeto.

Para cambiar el tamao libremente, mantenga pulsada la


tecla Mays mientras arrastra.

Para editar texto artstico:

Arrastre para seleccionar un parte del texto, creando una


seleccin azul.

Tambin puede hacer doble clic para seleccionar una


palabra.
Ahora podr escribir texto nuevo, aplicar formatos a

248 Trabajo con texto


caracteres y formatos, editar el texto en WritePlus,
aplicar opciones de revisin, etc.

Colocacin de texto en un trazado


El texto artstico de lneas rectas "normal" no es, para nada,
"normal", pero puede ampliar sus posibilidades creativas
recorriendo un trazado curvo.

El objeto resultante tiene todas las propiedades del texto artstico y,


adems, su trazado es una curva Bzier que puede editar con la
herramienta Puntero, con la misma facilidad que cualquier otra
lnea. Asimismo, el texto en un trazado se puede editar de algunas
formas exclusivas, como se describe a continuacin.
Para aplicar un trazado curvo predeterminado al texto:
1.

Cree un objeto de texto artstico.

2.

Con el texto seleccionado, haga clic en el elemento


flotante del trazado
en la barra de herramientas
de contexto Texto y elija un trazado preestablecido.

El texto ahora fluye a lo largo del trazado especificado, p. ej., para


Trazado - Crculo superior.

Trabajo con texto 249

Para aadir texto artstico a lo largo de una lnea o de


una forma existente:
1.

Cree lneas a mano alzada, rectas o curvas (consulte


Dibujo y edicin de lneas en la pg. 371) o una forma
(consulte Dibujo y edicin de formas en la pg. 380).

2.

Seleccione la herramienta
Texto artstico en el
elemento flotante Texto de la barra de herramientas
Herramientas.

3.

Acerque el cursor a la lnea. Cuando el cursor cambie


para incluir una curva, haga clic con el ratn en el lugar
en el que desee que empiece el texto.

4.

Empiece a escribir en el punto de insercin. El texto


fluye a lo largo de la lnea, que se ha convertido en un
trazado.

Para adaptar el texto existente a una lnea o forma:


1.

Cree un objeto de texto artstico.

2.

Cree una lnea a mano alzada, recta, curva o una forma.

3.

Seleccione ambos objetos. En el men Herramientas,


seleccione Ajustar texto a la curva. El texto ahora fluye
a lo largo del trazado especificado.

250 Trabajo con texto


Para crear el texto y el trazado al mismo tiempo:
1.

Seleccione una de las herramientas de Texto de trazado


del elemento flotante Texto:
La Herramienta de texto de trazado a mano alzada
permite dibujar una lnea curva con libertad.
La Herramienta de texto de trazado recto
sirve para dibujar una lnea recta.
La Herramienta de texto de trazado curvo
permite unir una serie de segmentos de lnea(que pueden
ser curvos o rectos) usando clics deratn para "conectar
puntos".

2.

Cree una lnea en la pgina. La lnea aparecer como un


trazado con un punto de insercin en el extremo inicial
(en los trazados curvos podr escribir directamente en
cualquier parte del trazado, pulsar Esc o hacer doble clic
para obtener el punto de insercin al principio del
trazado).

3.

Empiece a escribir en el punto de insercin. El texto


fluye a lo largo del trazado.

Para eliminar el trazado del texto:


1.

Seleccione el objeto de texto de trazado.

2.

Trazado - Ninguno en el
Haga clic en el botn
elemento flotante del trazado de la barra de herramientas
de contexto Texto.

Trabajo con texto 251

El texto contina como un objeto de texto artstico de lnea recta; el


trazado se quita permanentemente.

Edicin de texto en la pgina


Puede usar la Herramienta Puntero para editar el texto del marco,
el texto de la tabla o el texto artstico directamente. En la pgina,
puede seleccionar e introducir texto, definir sangras de prrafo y
tabulaciones, cambiar propiedades del texto, aplicar estilos de texto
y utilizar la herramienta Buscar y reemplazar (consulte la
pg. 255). Para editar historias ms largas y para utilizar opciones
ms avanzadas, seleccione WritePlus (Editar historia en el
men Editar).

Seleccin e introduccin de texto


La seleccin de texto del marco, texto artstico y texto de tabla
sigue los convenios de las herramientas de procesamiento de texto
ms modernas. El rea de la seleccin est sombreada en color azul
semitransparente para que la edicin sea ms clara.

Haga doble, triple o cudruple clic para seleccionar una palabra, un


prrafo o todo el texto, respectivamente. Tambin puede hacer clic
y pulsar Ctrl o arrastrar el ratn para seleccionar palabras no
adyacentes, y la tecla Mays para rangos de texto.
Para editar texto en la pgina:
1.

Seleccione la Herramienta Puntero y luego haga clic en


el objeto de texto (o arrstrelo). Un punto de insercin
estndar aparecer en la posicin del clic (vase a
continuacin).

252 Trabajo con texto


O bien:
Seleccione una sola palabra, un prrafo o parte del texto.
2.

Escriba para insertar el nuevo texto o para sobrescribir el


texto seleccionado, respectivamente.

Para iniciar un nuevo prrafo:

Pulse Intro.

Para iniciar una nueva una lnea dentro del mismo


prrafo (utilizando un "salto de lnea" o un "salto de
lnea suave"):

Pulse Mays+Intro.

Para que el texto se ajuste a la siguiente columna (Salto


de columna) o marco (Salto de marco):

Texto de marco creativo nicamente: pulse


Ctrl+Intro o Alt+Intro, respectivamente, o elija los
artculos en el submen de Insertar>Salto.

Para cambiar entre el modo de insercin y el modo de


sobrescritura:

Pulse la tecla Insert.

Para repetir una accin de texto:

Elija Repetir del men Editar o presione Ctrl+Y.

Trabajo con texto 253

Por ejemplo, si tiene nuevo formato aplicado a un prrafo, puede


hacer clic en otro prrafo y utilizar el comando Repetir para
aplicar el mismo formato ah.
Para mostrar caracteres especiales:

En el men Ver, seleccione Caracteres especiales (para


marcas de prrafos y saltos; vase a continuacin) o
Espacios (Mostrar caracteres especiales, adems de
espacios indivisibles y espacios normales de "relleno").

Copia, pegado y movimiento de texto


Puede copiar y pegar fcilmente texto utilizando comandos
estndar; tambin puede arrastrar y soltar texto.
Si no coloca un punto de insercin, el texto se puede
pegar directamente en un nuevo marco de texto.

Establecimiento de sangras de prrafo


Cuando se selecciona un objeto de texto, los marcadores de la regla
horizontal indican la sangra izquierda, la sangra de la primera
lnea y la sangra derecha del prrafo actual. Puede ajustar los
marcadores para establecer sangras de prrafo o utilizar un cuadro
de dilogo.

254 Trabajo con texto

(A); Sangra izquierda; (B) Sangra de primera lnea; (C) Sangra


derecha.

La sangra izquierda se establece en relacin con el


margen izquierdo del objeto.

La sangra de primera lnea se establece en relacin con


la sangra izquierda.

La sangra derecha se establece en relacin con el


margen derecho del objeto.

Para obtener ms informacin sobre el establecimiento de


mrgenes de marco, consulte Configuracin y diseo del marco
en la pg. 241.
Para establecer las sangras del prrafo actual:

Arrastre el marcador de la regla apropiado.


O bien:
Para sangras rpidas izquierdas, seleccione el botn
Aumentar nivel
o Reducir nivel
para
reducir o aumentar la sangra respectivamente. La

Trabajo con texto 255

sangra est a la distancia de tabulacin predeterminada


que se haya establecido.
O bien:
Para ajustar la configuracin de sangra mediante un
cuadro de dilogo, seleccione Prrafo del men Texto.
En el cuadro Sangra, puede introducir valores para la
sangra izquierda, derecha, primera lnea o francesa.

Trabajo con texto Unicode


WebPlus admite por completo Unicode, lo que hace posible
incorporar caracteres extranjeros o smbolos especiales.

Para pegar texto Unicode desde el portapapeles en la


pgina, utilice Editar>Pegado especial... y luego
seleccione "Texto Unicode sin formato".

Inserte los caracteres Unicode directamente en el texto


escribiendo el valor hexadecimal de Unicode y pulsando
Alt+X. La operacin del teclado de Alt+X intercambia el
carcter mostrado (por ejemplo, @) por su equivalente en
valor hexadecimal (por ejemplo, U+0040).

Para exportar texto en formato de Unicode, utilice


WritePlus.

Uso de Buscar y reemplazar


Puede buscar texto del sitio de una variedad extraordinariamente
amplia de elementos: no solo palabras o partes de palabras, sino
tambin una cantidad ingente de atributos de caracteres y de
prrafo como fuentes, estilos, alineacin, vietas y numeracin,
fuentes que faltan, letras capitales, incluso grficos alineados y
mucho ms. Mediante el cuadro de dilogo Buscar y reemplazar
(que permanece abierto sin interrumpir el trabajo hasta que haga
clic en el botn Cerrar) puede reemplazar globalmente todas las
instancias o una por una.

256 Trabajo con texto


Para utilizar Buscar y reemplazar:
1.

Seleccione Buscar y reemplazar... en el men Editar.

2.

En el cuadro de dilogo, escriba el texto que desea


buscar en el cuadro Buscar y el texto con el que lo va a
reemplazar (si lo desea) en el cuadro Reemplazar. Haga
clic en las flechas abajo para ver los elementos recientes.
Haga clic en uno de los botones del cuadro para usar los
mens flotantes para seleccionar formatos o caracteres
especiales, o definir una expresin regular (para buscar
utilizando comodines).

3.

Seleccione el intervalo en el que va a buscar: Historia


actual (solo el objeto de texto o la historia actualmente
seleccionado), o Todas las historias (todo el texto) o
Seleccin actual (solamente se utiliza con la funcin
Reemplazar todo, para el texto actualmente
seleccionado).

4.

Seleccione Slo palabras completas para buscar


secuencias de caracteres coincidentes que tengan
espacios en blancos (espacios, tabulaciones, etc.) o
puntuacin a ambos extremos o que sean el inicio/fin de
un prrafo. Seleccione Coincidir maysculas y
minsculas para las bsquedas en las que se distinga
entre maysculas y minsculas. Seleccione Expresin
regular para tratar los contenidos del cuadro Buscar
como una expresin, en lugar de como una cadena literal.

5.

Haga clic en Buscar siguiente para localizar la siguiente


instancia del texto de Buscar.
O bien:
Haga clic en Seleccionar todo para resaltar
simultneamente todas las instancias del texto
coincidente en el sitio.

6.

Haga clic en Reemplazar si quiere sustituir la cadena de


bsqueda por otro texto. Tambin puede hacer clic en
Buscar siguiente otra vez para saltar a la siguiente
cadena coincidente. Contine usando la opcin

Trabajo con texto 257

Reemplazar segn sea necesario hasta que alcance el


final del sitio.
O bien:
Haga clic en Reemplazar todo para reemplazar todas las
instancias del texto de Buscar con el texto de sustitucin
al mismo tiempo. WebPlus avisa cundo se termina la
bsqueda.
7.

Haga clic en Cerrar para cerrar el cuadro de dilogo


Buscar y reemplazar.

258 Trabajo con texto

Formato de texto

260 Formato de texto

Formato de texto 261

Configuracin de propiedades de texto


WebPlus le proporciona un alto grado de control sobre los puntos
finos de diseo tipogrfico, si est trabajando con texto de marco,
texto de tabla o texto artstico.
Para aplicar un formato de texto bsico:
1.

Seleccione el texto.

2.

Use los botones de la barra de herramientas de contexto


Texto para cambiar el estilo de texto, el tipo de fuente, el
tamao de punto, los atributos, la alineacin del prrafo o
el nivel.

Para borrar el formato local (restaurar las propiedades


de texto simples o predeterminadas):

Seleccione una parte del texto que tenga formato local.

Seleccione Ctrl + barra espaciadora en el teclado.

Uso de fuentes
Uno de los mtodos ms drsticos para cambiar el aspecto de su
sitio es cambiar las fuentes utilizadas en su texto artstico, texto de
marco o texto de tabla. La aplicacin de varias fuentes a un
carcter o a un prrafo entero puede comunicar mensajes muy
diferentes a sus futuros lectores.

262 Formato de texto


En WebPlus la
asignacin de fuentes es
muy sencilla y se puede
realizar desde la pestaa
Fuentes, la barra de
herramientas de
contexto Texto o en el
cuadro de dilogo
Carcter (haciendo clic
con el botn secundario
o desde el men Texto).

La pestaa Fuentes se oculta automticamente de manera


predeterminada, pero se puede ver haciendo clic en el botn de
flecha a la izquierda del rea de trabajo. Es posible que tambin
necesite hacer clic en la etiqueta Fuentes para mostrar la pestaa
Fuentes.
Las fuentes seguras para la Web son un subconjunto de fuentes
especialmente seleccionado y configurable que proporcionan
mejores coincidencias de la fuente con el sitio (durante diseo) y
con los ordenadores de los visitantes web (durante la exploracin).
Durante la publicacin, solo se hace referencia a las fuentes

Formato de texto 263

seguras para la Web (y no se rasterizan) ya que se asume que estn


disponibles en el equipo del visitante web.
Hablando en trminos generales, es aconsejable conservar la lista
estndar de fuentes seguras para la Web de la pestaa Fuentes, a
menos que pueda estar seguro del uso de la fuente en su pblico de
destino. Estas fuentes se agrupan en la categora Segura para la
Web de la pestaa (una categora equivalente existe en el men
desplegable fuente de la barra de herramientas de contexto Texto).

Uso de estilos de texto


Con WebPlus se pueden utilizar estilos de texto con nombre
(predefinidos o definidos por el usuario), que se pueden aplicar a
texto de marco, texto de tabla o texto artstico. Un estilo de texto
es un conjunto de atributos de caracteres y/o prrafos guardados
como un grupo. Cuando se aplica un estilo al texto, se aplica el
grupo entero de atributos en solo un paso. Por ejemplo, se pueden
usar estilos de prrafo con nombre para elementos de diseo
concretos, como "Ttulo 1", "Cita" o "Cuerpo", y estilos de
caracteres para transmitir un significado, como "nfasis", "Cdigo"
o "Referencia sutil".
Los estilos se pueden aplicar a los caracteres o prrafos usando
bien la barra de herramientas de contexto Texto o la pestaa Estilos
de texto. Los estilos de prrafo y de carcter se pueden administrar
desde la Paleta de estilos de texto.
La pestaa Estilos de texto le permite adems crear nuevos estilos
desde cero, crear estilos con nombre a partir de propiedades de
texto existentes y cambiar un estilo por otro en todo el sitio con
una sola operacin. Es posible previsualizar cualquier estilo de
cualquier prrafo seleccionado directamente en la pgina. Consulte
la ayuda de WebPlus para obtener ms informacin sobre estas
caractersticas.

264 Formato de texto

Estilos de prrafo y de carcter


Un estilo de prrafo es una especificacin completa del aspecto de
un prrafo, donde se incluyen todos sus atributos de fuente y de
formato de prrafo. En WebPlus, todos los prrafos tienen asociado
un estilo de prrafo.
Tipo de texto

Estilo de
prrafo
utilizado

Basado en

Marco (HTML o
creativo)

Cuerpo

Normal

Artstico

Cuerpo artstico

Normal

Tabla o Calendario

Cuerpo de tabla

Normal

Un estilo de caracteres incluye nicamente atributos de fuente


(nombre, tamao de punto, negrita, cursiva, etc.) y se aplica a nivel
de carcter, es decir, a una gama de caracteres seleccionados, y no
a todo un prrafo.

Trabajo con estilos con nombre


El estilo con nombre del texto seleccionado actualmente se muestra
en la pestaa Estilos de texto o el cuadro desplegable de Estilos en
la barra de herramientas de contexto Texto. Podra aparecer un
estilo de caracteres (si lo hay aplicado localmente). En caso
contrario, indica el estilo de prrafo.
Para aplicar un estilo con nombre:
1.

Usando la Herramienta Puntero, haga clic en un prrafo


(si se va a aplicar un estilo de prrafo) o seleccione una
parte del texto (si se va a aplicar un estilo de caracteres).

2.

Abra la pestaa Estilos de texto y seleccione un estilo en


la lista de estilos.

Formato de texto 265

O bien:
En la barra de herramientas de contexto Texto, haga clic
en flecha para expandir la lista desplegable de Estilos y
seleccionar un nombre de estilo.
La pestaa Estilo del texto resalta el estilo de prrafo o de
caracteres aplicado al texto que est seleccionado.
Como al mismo texto se puede aplicar tanto el formato de prrafo,
como de caracteres, todo el formato del texto actual se muestra en
el cuadro Formato actual de la pestaa.
Para modificar el estilo existente:
1.

En la pestaa de Estilos de texto:

Haga clic con el botn secundario en el estilo de


caracteres o prrafo que desee modificar y, a
continuacin, seleccione Modificar .
O bien:

Con un estilo seleccionado, seleccione el botn


Administrar estilos de la pestaa Estilos de texto
y, a continuacin, seleccione el botn Modificar....

2.

En el cuadro de dilogo Estilo del texto, defina (o


cambie) el nombre de estilo, estilo de base y cualquier
atributo de caracteres o prrafo, tabulaciones, vietas y
letras capitales que desee incluir en la definicin de
estilo.

3.

Haga clic en Aceptar para aceptar las propiedades de


estilo o Cancelar para salir sin guardar los cambios.

4.

Haga clic en Aplicar para actualizar el texto o en Cerrar


para mantener el estilo en el sitio para usos posteriores.

Alternativamente, seleccione Paleta de estilos de texto... en el


men Texto para modificar estilos y para cambiar valores
predeterminados de texto (consulte la pg. 306).

266 Formato de texto


Para eliminar uno o ms de estilos de texto:

Haga clic con el botn secundario en un estilo de texto y


seleccione Eliminar ....

En el cuadro de dilogo, haga clic en Quitar. Para


eliminar varios estilos, marque primero los nombres de
los estilos. Para quitar todos los estilos o los que no se
utilizan, use los botones correspondientes.
Tenga cuidado al eliminar estilos. Todos los estilos
basados en un estilo "principal" marcado tambin
se marcarn para ser eliminados.

Cambio de estilos comunes


Cambiar un estilo de caracteres o de prrafo por otro es muy
sencillo para una sola seleccin de texto. Sin embargo, en WebPlus
es igual de fcil cambiar un estilo por otro mediante la seleccin de
varias instancias del estilo y la eleccin de un estilo alternativo.
Esto intercambia los estilos en todos los prrafos y en historias
completas al mismo tiempo.
Para seleccionar (y cambiar) un estilo en todo un sitio:
1.

Haga clic con el botn secundario en un estilo mostrado


en la pestaa Estilos de texto.

2.

Si el estilo se utiliza en su sitio, ver un mensaje


"Seleccionar todas las instancias de n " (n es el nmero
de veces que se utiliza el estilo).
Si no existen apariciones del estilo, la opcin aparecer
atenuada.

3.

Haga clic en la etiqueta del mensaje. El texto formateado


con el estilo seleccionado se muestra resaltado.

Formato de texto 267

4.

Desplcese sobre los nombres de estilo de la lista de


estilos. Haga clic en un estilo seleccionado para aplicarlo
al texto seleccionado.

Creacin de una lista con vietas o


numerada
Para cualquier marco de texto se pueden aplicar vietas y
numeracin a las listas y a los prrafos por igual. Las vietas
resultan especialmente tiles para mostrar elementos de inters sin
ningn orden de preferencia especfico y las listas numeradas para
mostrar procedimientos paso a paso (con nmeros o letras).
WebPlus le permite aplicar el estilo de lista al texto normal (como
formato local) o a estilos de texto por igual.
No obstante, si est utilizando Marcos de texto creativo puede
adoptar vietas bsicas o complejas o listas numeradas, ya sea
seleccionando valores preestablecidos (vase a continuacin) o
creando su propio estilo de lista personalizado (esto le permite
seleccionar sus propios formatos de smbolos, nmeros y letras).
Despus, tiene la opcin de sustituir un valor preestablecido
existente por el suyo propio basado en el estilo de lista
personalizado.

Lista con vietas

Lista numerada

Para crear una lista con vietas o numerada simple:


1.

Seleccione uno o varios prrafos.


O bien:
Haga clic en el texto de un prrafo.

268 Formato de texto


2.

Seleccione Lista con vietas

o Lista numerada

de la barra de herramientas de contexto Texto.


El estilo de la lista usado es el primer valor preestablecido
mostrado en el cuadro de dilogo Vietas y numeracin descrito a
continuacin.
Para crear una lista con vietas o numerada (usando los
valores preestablecidos):
1.

Seleccione uno o varios prrafos.


O bien:
Haga clic en el texto de un prrafo.

2.

Seleccione Vietas y numeracin... en el men Texto.

3.

En el cuadro de dilogo Estilo de texto, puede hacer lo


siguiente:

4.

Para el texto en cuadros de texto HTML, haga clic


en un icono preestablecido en el cuadro de dilogo.
O bien:

Para el texto en marcos de texto creativo, seleccione


Vieta o Nmero en el men desplegable Estilo y,
a continuacin, seleccione uno de los formatos
preestablecidos mostrados de forma
predeterminada.
O bien:

Para una lista personalizada, seleccione la opcin y


haga clic en el botn Detalles para editar las
opciones personalizadas.

Haga clic en Aceptar para aplicar el formato de la lista.

Cada vez que inserta un retorno, una nueva lnea comenzar con el
smbolo o el nmero especificado. Adems, si escribe dos retornos

Formato de texto 269

seguidos (pulsando Intro dos veces) se cancelan las vietas o los


nmero y se reanuda el formato de prrafo regular.
Desactive el formato de la lista haciendo clic de nuevo
en los botones
o
de contexto Texto.

de la barra de herramientas

WebPlus tambin le permite asignar vietas y nmeros a los


estilos. (Consulte la Ayuda de WebPlus.)

Insercin de detalles de usuario


Ahora puede aprovecharse del cuadro de dilogo Detalles del
usuario para guardar informacin del usuario que se utiliza con
frecuencia para que no tenga que seguir escribindola (piense la
frecuencia con la que un nmero de telfono mvil o una direccin
de correo electrnico pueden cambiar con el tiempo). El cuadro de
dilogo le permite revisar todos los Detalles del usuario de un
vistazo, y actualiza los campos en todo el sitio web directamente.
Para gestionar los Detalles del usuario en sitios de varias de
empresas, WebPlus admite diferentes conjuntos empresariales (es
decir, conjuntos de detalles del usuario guardados) que puede
aplicar por sitio web.
Estos campos necesitan estar presentes en las pginas del sitio
antes de las actualizaciones y pueden insertarse manualmente
mediante Insertar>Informacin>Detalles del usuario. Observe
que muchas plantillas de diseo tienen ya estos campos de detalles
del usuario presentes, por ejemplo, en las pginas de contacto.
Tambin puede usar este cuadro de dilogo Detalles del usuario
para definir las variables globales y especficas del sitio que se
usan en todos los sitios de WebPlus o solo en el sitio actual,
respectivamente. (Consulte Insercin de variables en la p. 272.)

270 Formato de texto


Para aadir, editar o cambiar los Detalles del usuario:
1.

Haga clic en Definir detalles del usuario


en la barra
de herramientas de contexto Predeterminado (quite la
seleccin de los objetos que desea ver).

2.

Para los detalles del usuario empresarial, introduzca la


nueva informacin en la pestaa Conjuntos
empresariales. Asegrese de que la lista desplegable
Seleccionar conjunto est establecida como
Predeterminado si solamente va a utilizar sobre todo un
conjunto de detalles empresariales. La lista desplegable
le permite seleccionar otro conjunto de detalles de
usuario empresarial diferente, si se cre. (Consulte
Creacin de conjuntos empresariales en la p. 271.)

3.

Para los detalles particulares del usuario, use la pestaa


Domicilio. Estos campos son diferentes que los definidos
en la pestaa Conjuntos empresariales.

4.
Una pestaa Calendarios aparecer si hay un
calendario en su sitio. Esto le permite cambiar el ao y
mostrar/ocultar los das festivos y los eventos
personales.

Insercin y actualizacin de los detalles del


usuario
Tambin puede insertar uno o ms campos de Detalles del usuario
en el sitio en cualquier momento.
Para insertar un campo en Detalles del usuario:
1.

Seleccione la Herramienta Puntero y haga clic en el texto


para marcar un punto de insercin.

Formato de texto 271

2.

Seleccione Informacin en el men Insertar y, a


continuacin, seleccione Detalles del usuario... en el
submen.

3.

Seleccione una entrada de Detalles del usuario y,


opcionalmente, cualquier Prefijo o Sufijo para incluir
los detalles del usuario, por ejemplo, Nombre.

4.

Haga clic en Aceptar.

Para los sitios existentes, los campos (una vez editados) se pueden
actualizar haciendo clic en un botn.
Para actualizar campos:

Escriba la informacin nueva en el cuadro de dilogo


Detalles del usuario (en Herramientas>Definir detalles
del usuario...).

Haga clic en el botn Actualizar para actualizar de forma


automtica los campos que se hayan modificado y que
estn actualmente en el sitio. Este campo permanecer
vinculado a Detalles del usuario hasta que se elimine.

Creacin de conjuntos empresariales


Si est desarrollando ms de un sitio empresarial, puede almacenar
y asignar diferentes conjuntos de detalles empresariales del usuario
para cada sitio. Piense en un conjunto empresarial como en un
perfil, que almacena un conjunto exclusivo de detalles del usuario
con un nombre elegido.
Para crear un conjunto empresarial:
1.

En el cuadro de dilogo Detalles del usuario (pestaa


Conjuntos empresariales), haga clic en Nuevo.

2.

Escriba un nuevo nombre del conjunto empresarial y


haga clic en Aceptar. El nuevo conjunto aparece activo
en la lista desplegable Seleccionar conjunto.

272 Formato de texto


3.

Escriba la informacin en el cuadro de dilogo Detalles


del usuario y haga clic en Actualizar.

Cuando haya creado un conjunto empresarial y los haya aplicado al


sitio, la configuracin se almacenar con el sitio.
Los conjuntos empresariales le permiten establecer
diferentes detalles del usuario para cada sitio web
que haya creado.
Para cambiar a un conjunto empresarial diferente:

Seleccione otro conjunto de la lista desplegable


Seleccionar conjunto y haga clic en Actualizar.

Para cambiar o eliminar un conjunto empresarial:


1.

Elija el conjunto empresarial de la lista desplegable


Seleccionar conjunto.

2.

Seleccione Cambiar nombre o Eliminar.

Insercin de variables
Si tiene un texto que se repite a lo largo de todo su sitio y que
quiere reemplazar por otro texto, puede usar variables. Por lo
general, esta funcin se emplea para cambiar un nombre de
producto o versin y, de este modo, poder actualizar fcilmente el
sitio cada vez que cambien las versiones de producto. Los campos
de variable cambian automticamente para actualizarse con los
valores nuevos.
Las variables se utilizan del mismo modo para los detalles de
usuario (vase la pg. 269). Se pueden aadir e insertar como si
fueran campos de detalles de usuario y actualizar desde el mismo
cuadro de dilogo Detalles del usuario.

Formato de texto 273

La variable se puede almacenar dentro del sitio o hacerla global


para otros sitios. La ltima opcin es recomendable para los
nombres de producto, puesto que hay muchas posibilidades de que
se vuelvan a utilizar globalmente en una empresa.
Para aadir, editar o eliminar variables:
1.

Haga clic en Definir detalles del usuario


en la
barra de herramientas de contexto Predeterminado (quite
la seleccin de los objetos que desea ver).

2.

Seleccione la pestaa Global o Sitio si desea que la


variable aadida est disponible para todos los sitios o
solamente para el sitio respectivamente.

3.

Desde una de las pestaas, haga clic en el botn Aadir.

4.

En la lista de variables, escriba sobre el nombre de la


variable creada y asgnele una cadena de texto nica que
sirva para identificarla fcilmente.

5.

Haga clic en la columna adyacente a la nueva Variable y


escriba el valor de la variable, es decir, el texto que
aparecer en la pgina.

6.

Aada las variables que necesite, bien a la pestaa Sitio o


bien a Global.

7.

Haga clic en Actualizar.

274 Formato de texto


Una vez que haya decidido qu variables utilizar, puede
insertarlas como campos en lugar de escribir texto "esttico".
Puede aprovechar las variables, a menos que estn insertadas en su
sitio.
Para insertar un campo de variable:
1.

Haga clic en el texto para crear un punto de insercin (o


seleccionar texto).

2.

Seleccione Informacin en el men Insertar y, a


continuacin, seleccione Variable en el submen.

3.

En la lista desplegable del cuadro de dilogo, seleccione


su variable donde la haya guardado en Detalles de
usuario (Global o Sitio).

4.

Seleccione una entrada de variable y, opcionalmente,


cualquier texto de Prefijo o Sufijo que desee incluir en
la variable:

5.

Haga clic en Aceptar.

Cuando comience a cambiar la variable, todo lo que necesita es


editar y actualizar el valor de la variable. Los campos de variable
de todo el sitio se actualizan con los nuevos valores.
Para actualizar variables:
1.

Haga clic en Definir detalles del usuario


en la
barra de herramientas de contexto Predeterminado (quite
la seleccin de los objetos que desea ver).

2.

Edite la variable existente con un valor nuevo.

3.

Haga clic en Actualizar.

Trabajo con
tablas

276 Trabajo con tablas

Trabajo con tablas 277

Creacin de tablas basadas en texto


Las tablas son ideales para presentar texto y datos en diversos
formatos personalizables de fila y columna, con capacidades de
hojas de clculo integradas.

Cada celda de una tabla se comporta como un minimarco. Al igual


que los marcos de texto puede variar las propiedades de prrafo
y caracteres, aplicar estilos de texto, insertar imgenes en lnea,
aplicar rellenos de color de texto y utilizar opciones de revisin
como el corrector ortogrfico revisor. Algunas caractersticas
nicas incluyen algunas funciones nicas de formato de nmero y
de insercin de frmulas.
Se pueden aplicar dos tipos de tabla a la pgina de WebPlus: la
tabla HTML y la tabla creativa. El tipo de tabla ms utilizado en
WebPlus es la tabla HTML, ya que es compatible con HTML, con
lo que asegura buenos resultados de publicacin en todos los
navegadores de Internet.

278 Trabajo con tablas


No obstante, las tablas creativas se pueden usar en lugar de las
tablas HTML para obtener caractersticas adicionales de la tabla
como la rotacin de tabla, gradiente/rellenos de mapa de bits,
transparencia de texto, efectos de filtro, Instant3D y efectos de
deformacin.

Creacin de tablas
En lugar de empezar desde cero, WebPlus ofrece una seleccin de
formatos de tabla predefinidos (plantillas) que pueden usarse.
Basta con seleccionar una y rellenar las celdas con contenido.
WebPlus le permite:

Editar el formato predefinido antes de aadir una nueva


tabla a la pgina.

Crear sus propios formatos personalizados sin crear una


tabla. Consulte Creacin de formatos de tabla
personalizados en la Ayuda de WebPlus.

Editar las tablas existentes para adaptarlas a un formato


diferente (predefinido o personalizado).

Para crear una tabla:


1.

En la barra de herramientas Objetos estndar (elemento


), seleccione Herramienta de

flotante Tabla
tabla HTML
2.

Haga clic en la pgina o en el rea de pegado, o arrastre


para establecer las dimensiones de la tabla. El cuadro de
dilogo Crear tabla se abre con una seleccin de
formatos de tabla preestablecidos mostrados en la
ventana Formato.

Trabajo con tablas 279

3.

Recorra la lista para obtener ver los diseos y seleccione


uno. Para empezar con una tabla sin formato, seleccione
(Predeterminado).

4.

(Opcional) Haga clic en Editar si desea personalizar ms


el formato elegido.

5.

Establezca el Tamao de tabla. Es el nmero de filas y


columnas que componen el diseo de la tabla.

6.

Haga clic en Aceptar. La nueva tabla aparecer en la


pgina.

Para editar la estructura y el contenido de las celdas de las tablas,


consulte Manipulacin de tablas en la Ayuda de WebPlus.

Insercin de un calendario
El Asistente para calendarios le ayuda a disear calendarios de
vista de meses para usarlos en el sitio web.

El calendario se crea en una tabla basada en texto escalable para


poder editar el texto usando las herramientas de texto estndar. Las
propiedades de un calendario seleccionado son similares a las de
una tabla y se pueden modificar exactamente del mismo modo
(consulte Manipulacin de tablas).

280 Trabajo con tablas


Para insertar un calendario:
1.

Haga clic en el elemento flotante Tabla


en la
barra de herramientas Objetos estndar y elija Insertar
calendario

2.

Haga clic en la pgina o arrastre hacia fuera para darle al


calendario el tamao deseado.

3.

En el Asistente para calendarios que se muestra, defina


las opciones para su calendario, como, por ejemplo, la
configuracin del ao y mes, el estilo de calendario
(cuadrado o en formato de una o varias columnas), en
qu da se inicia la semana, espacio para notas, opciones
de visualizacin, cambio a eventos personales o
vacaciones y el formato del calendario.
Para que se visualicen los das festivos de su pas,
marque Agregar das de fiesta en el asistente y
seleccione una Regin en el men desplegable
correspondiente. Para aadir eventos personales, active la
opcin Agregar eventos personales.

4.

Haga clic en Finalizar para completar el asistente.


Si tiene previsto utilizar el calendario en aos
siguientes, tiene que actualizar el ajuste Ao en
Herramientas>Definir detalles del usuario.

Para ver y editar las propiedades de un calendario


concreto:
1.

Haga clic en el botn Editar calendario en la barra de


herramientas de contexto Calendario.

2.

Elija una pestaa adecuada (fecha, estilo, eventos, etc.) y


realice sus modificaciones; a continuacin haga clic en
Aceptar.

Trabajo con tablas 281

Si hace clic con el botn secundario (con la opcin Calendario


seleccionada) tambin puede seleccionar, insertar, distribuir,
eliminar y ajustar el ancho o alto de las filas (o columna), as como
el ajuste automtico del contenido de la celda, pero tenga cuidado
de no daar el formato de la tabla.

Adicin de das de fiesta


Al crear un calendario, se pueden definir los das de fiesta
correspondientes al pas en el que reside. Los das de fiesta se
mostrarn en el calendario automticamente si se selecciona
Agregar das de fiesta en Propiedades del calendario.
Para activar los das festivos:
1.

Seleccione el cuadro delimitador del calendario y haga


clic en Editar calendario
herramientas de contexto.

en la barra de

2.

En la pestaa Eventos, seleccione Agregar das de


fiesta.

3.

(Opcional) Cambie a la configuracin de das de fiesta de


otro pas distinto utilizando la lista desplegable Regin.

4.

Haga clic en Aceptar.

Para mostrar los das festivos:


1.

Seleccione la casilla que delimita el calendario.

2.

Haga clic en Eventos de calendario en la barra de


herramientas de contexto.

3.

Permitir la opcin Mostrar das de fiesta.

282 Trabajo con tablas

Adicin de eventos personales


Puede complementar su listado de das de fiesta (por ejemplo, la
Semana Santa) con eventos personales, como cumpleaos,
aniversarios y vencimiento de facturas (desafortunadamente!) para
que se visualicen en el calendario. Para ello, utilice el botn
Eventos de calendario en la barra de herramientas de contexto del
calendario seleccionado. Los eventos se muestran automticamente
en el calendario en la fecha elegida.
Para agregar un evento:
1.

Seleccione la casilla que delimita el calendario.

2.

Haga clic en Eventos de calendario


herramientas de contexto.

3.

(Opcional) Haga clic en Mostrar eventos por fecha para


aadir, modificar o eliminar eventos de calendario
mediante un diseo tradicional. Deje sin marcar para
indicar una lista de Fecha/Evento fila por fila.

4.

Haga clic en

5.

En el cuadro de dilogo, escriba, utilice las flechas hacia


arriba/abajo o haga clic en el botn Examinar
para
seleccionar una fecha.

6.

Escriba el texto de eventos en el cuadro de entrada de


texto; este se muestra en el calendario en la fecha
elegida.

7.

Si el evento es un cumpleaos u otro evento anual,


seleccione El evento se repite anualmente.

8.

Haga clic en Aceptar. El evento aparecer en la lista de


eventos en la fecha elegida.

en la barra de

Nuevo evento.

Trabajo con tablas 283

9.

Cuando haya acabado de aadir eventos, haga clic en el


botn Guardar.
Utilice los botones de Editar evento
Eliminar evento
evento existente.

para modificar o eliminar un

284 Trabajo con tablas

10

Edicin de
objetos

286 Edicin de objetos

Edicin de objetos 287

Seleccin de un objeto
Antes de que pueda cambiar cualquier objeto, necesitar
resaltarlo usando una de las herramientas siguientes de elemento
flotante Seleccin de la barra de herramientas Herramientas:
Herramienta Puntero
Haga clic para utilizar la Herramienta Puntero para
seleccionar, mover, copiar, cambiar el tamao o girar objetos.
Herramienta Lazo
Haga clic para utilizar la Herramienta Lazo para dibujar un
rea de forma libre en la que se seleccionar cualquier objeto.
Herramienta Rotar
Haga clic para utilizar la Herramienta Rotar para girar un
objeto alrededor de un origen de giro (normalmente centrado).
Consulte Rotacin de objetos en la pg. 297.
Antes de cualquier seleccin, los objetos de WebPlus mostrarn un
subrayado de sostener seleccin "resplandeciente" alrededor del
objeto. En una agrupacin compleja de objetos, esto indica qu
objeto se seleccionar.

288 Edicin de objetos


Para seleccionar un objeto:

Haga clic en el objeto mediante una de las herramientas


mostradas arriba, para mostrar un cuadro delimitador
alrededor del objeto.

Si se solapan elementos, utilice la tecla Alt mientras


hace clic varias veces hasta que se seleccione el artculo
deseado.
Para seleccionar un objeto con la Herramienta Lazo:
1.

Seleccione la Herramienta Lazo

2.

Dibuje un lazo alrededor de los objetos que desea


seleccionar. Un rea sombreada de lazo se crea alrededor
del objeto.

Edicin de objetos 289

3.

Suelte el botn del ratn. Todos los objetos dentro del


rea de lazo se seleccionan.

Para seleccionar un objeto de texto con la Herramienta


Puntero:

Al hacer clic en un objeto de texto (texto artstico o


marco de texto) con la Herramienta Puntero, se
selecciona el objeto y tambin se coloca el cursor
intermitente de seleccin de texto dentro del texto del
objeto. En este modo, puede editar el texto (consulte la
pg. 251).

290 Edicin de objetos

Haga doble, triple, o cudruple clic para seleccionar una


palabra, un prrafo o todo el texto.

Para seleccionar solo el marco de texto, haga clic en el


cuadro delimitador del marco.

Al hacer clic en un grupo selecciona el objeto agrupado.


Pulse Ctrl y haga clic para seleccionar un objeto
individual dentro de un grupo.

Seleccin de objetos a travs de la pestaa


Objetos
Para seleccionar un objeto:
1.

En la pestaa Objetos, seleccione la pgina en la que


estn colocados los objetos.

2.

Expanda la entrada de pgina haciendo clic en Expandir


, mostrando objetos en la pgina.

3.

Seleccione el objeto.
Puede utilizar Ctrl + clic y Mays + clic para
seleccionar varias entradas de objeto no adyacentes o
adyacentes.

Seleccin de varios objetos


La seleccin de ms de un objeto al mismo tiempo (creando una
seleccin mltiple) permite:

Colocar o cambiar el tamao de todos los objetos al


mismo tiempo.

Crear un objeto de grupo de la seleccin mltiple, que


se podr tratar como un solo objeto, con la opcin de

Edicin de objetos 291

restaurar los objetos individuales ms adelante. Consulte


Creacin de grupos en la pg. 317.
Para crear una seleccin mltiple:

Arrastre un cuadro de recuadro alrededor de los


objetos que desea seleccionar.

Alternativamente, mantenga pulsada la tecla Mays y haga clic en


cada objeto por turnos o use Herramienta Lazo (pg. 285) para
dibujar alrededor de objetos para resaltarlos.
El ltimo objeto seleccionado se muestra con el
cuadro delimitador ms oscuro si se compara con
otros objetos seleccionados.
Para aadir o quitar objetos de una seleccin mltiple:

Mantenga pulsada la tecla Mays y haga clic en el objeto


que desea aadir o quitar.

Para no seleccionar todos los objetos de una seleccin


mltiple:

Haga clic en una regin en blanco del rea de trabajo.

292 Edicin de objetos


Para seleccionar todos los objetos de la pgina (o la
pgina maestra):

Elija Seleccionar todo en el men Editar (o pulse


Ctrl+A).

Copia, pegado y replicacin de objetos


Adems de usar el portapapeles Windows para copiar y pegar
objetos, puede duplicar los objetos fcilmente usando el mtodo de
arrastrar y soltar y replicar mltiples copias de cualquier objeto en
formaciones precisas. Tambin puede transferir el formato de un
objeto a otro, con la opcin de seleccionar atributos especficos
para que se incluyan cuando se pegue el formato.
Para copiar un objeto (o una seleccin mltiple) al
portapapeles de Windows:

Haga clic en Copiar


Estndar.

en la barra de herramientas

Si est utilizando otra aplicacin de Windows, puede copiar y


pegar normalmente objetos con el Portapapeles.
Para pegar un objeto del portapapeles:

Haga clic en Pegar


Estndar.

en la barra de herramientas

El comando estndar Pegar inserta el objeto en el punto de


insercin o (para un objeto separado) en el centro de la pgina.
Para insertar un objeto separado en la misma ubicacin de la
pgina que el artculo copiado, use el comando Pegar en el mismo
lugar.

Edicin de objetos 293

Para elegir entre formatos del portapapeles alternativos:

Elija Pegado especial del men Editar.

Para duplicar un objeto:


1.

Seleccione el objeto y pulse la tecla Ctrl.

2.

a una
Arrastre el objeto mediante el botn Mover
nueva ubicacin en la pgina y suelte el botn del ratn.

3.

Para limitar la posicin de la copia (de forma horizontal


o vertical), mantenga pulsada la tecla Mays mientras
arrastra. Un duplicado del objeto aparece en la nueva
ubicacin.

Replicacin de objetos
Duplicar un objeto consiste en crear una nica copia a la vez. El
comando Replicar permite crear varias copias en un nico paso,
con un control preciso sobre la forma en la que las copias se
organizan, ya sea como una serie lineal o una cuadrcula. Puede
incluir una o ms transformaciones para generar un conjunto
interesante de objetos girados o con tamaos diferentes. Es
fantstico para repetir fondos o para obtener montajes con una
alineacin perfecta de una imagen o de un objeto.

294 Edicin de objetos


Para replicar un objeto:
1.

Seleccione el objeto que se replicar y seleccione


Replicar... del men Editar. El cuadro de dilogo
Replicar aparecer, con un rea de vista previa a la
derecha.

2.

Para organizar las copias en una lnea recta, seleccione


Crear lnea. Para una organizacin en cuadrcula X-porY, seleccione Crear cuadrcula.

3.

Especifique la longitud de la lnea (el nmero de


objetos, incluido el original) en la organizacin o el
tamao de la cuadrcula. Observe que puede usar la
configuracin de la longitud de la lnea para incluir un
nmero impar de objetos en una cuadrcula.

4.

Establezca el espaciado entre objetos como


Desplazamiento (medido entre las esquinas superiores
izquierdas de objetos sucesivos) o Intervalo (entre las
esquinas inferior derecha y superior izquierda). Puede
especificar el espaciado horizontal y/o vertical y/o la
rotacin angular. Para establecer un intervalo horizontal
o vertical especfico, active la opcin Absoluto;
desactive la casilla para especificar el intervalo como un
porcentaje de las dimensiones original del objeto.

5.

Haga clic en Aceptar.

El resultado es una seleccin mltiple. Haga clic en el botn


Grupo
si desea mantener los objetos separados vinculados
para manipulaciones adicionales.

Pegado del formato de un objeto


Cuando haya copiado un objeto al portapapeles, puede usar Pegar
formato (men Editar) para aplicar los atributos de formato a otro
objeto seleccionado. De nuevo, en el men Editar, Pegar formato
personalizado abre un cuadro de dilogo de control maestro que
permite seleccionar o desactivar atributos especficos para que se

Edicin de objetos 295

incluyan cuando se pega el formato. Consulte Cmo guardar


estilos de objetos en la pg. 394 para obtener ms informacin
sobre el cuadro de dilogo.

Movimiento de objetos
Para mover un objeto (incluida una seleccin mltiple):

Arrastre el objeto seleccionado usando su botn Mover


. Cuando vea el cursor de movimiento puede
empezar a arrastrar.

Para establecer las posiciones horizontal y vertical


exactas use la pestaa Transformar.
Para limitar el movimiento de un objeto a la posicin
horizontal o vertical:

Seleccione el objeto y utilice las flechas del teclado


(arriba, abajo, izquierda, derecha).

Cambio de tamao de objetos


WebPlus proporciona varios mtodos para cambiar el tamao de
lneas, formas, texto artstico, marcos de texto y tablas. Lo ms
sencillo es hacer clic y arrastrar: consulte la lnea de sugerencias
para los consejos contextuales y los accesos directos.

296 Edicin de objetos


Para cambiar el tamao de un objeto (en general):
1.

Seleccione el objeto.

2.

Haga clic en uno de los controladores de objeto y


arrstrelo a una nueva posicin mientras mantiene
pulsado el botn izquierdo del ratn.

Al arrastrar desde un controlador del borde, se cambia el tamao en


una dimensin, moviendo ese borde. Al arrastrar desde un
controlador de esquina, se cambia el tamao en dos dimensiones,
moviendo dos bordes.
Para cambiar el tamao libremente:

Arrastre desde un controlador de esquina (o final de


lnea).

Para restringir una forma, objeto de marco u objeto de


tabla al cambiar el tamao:

Mantenga pulsada la tecla Mays y arrastre desde un


controlador de esquina (o final de lnea).

Para las formas, tiene el efecto de conservar un cuadrado como


cuadrado, un crculo como crculo, etc.

Edicin de objetos 297

Para las imgenes, las dimensiones se restringen al


arrastrar un controlador de esquina. Utilice Mays y
arrastre para cambiar el tamao libremente de una
imagen.

Rotacin de objetos
Puede girar uno o varios objetos, como son imgenes, objetos de
texto y grupos, usando el controlador de giro del objeto o la
herramienta Rotar.
Para girar un objeto seleccionado (usando el
controlador de giro):

Haga clic y arrastre el controlador de giro que se


extiende desde el cuadro de seleccin (use la tecla
Mays mientras arrastra para girar con intervalos de
15).

298 Edicin de objetos


Para girar un objeto (usando la herramienta Rotar):
1.

Desde la barra de herramientas Herramientas en el


elemento flotante Seleccin
herramienta

, seleccione la

Rotar.

2.

Haga clic para seleccionar el objeto, desplcese sobre


uno de los bordes o controladores de esquina hasta que
vea el cursor de giro.

3.

Mantenga pulsado el botn del ratn y arrastre el cursor


en la direccin en la que desee girar el objeto y suelte
(use la tecla Mays para girar con intervalos de 15).

Para deshacer el giro (y restaurar la orientacin


original):

Haga doble clic en el objeto.

Para restaurar la posicin girada, vuelva a hacer doble


clic.

Para cambiar el origen de giro:


1.

herramienta Rotar y haga clic para


Seleccione la
seleccionar el objeto.

2.

Aleje el origen de giro


de su posicin original en el
centro del objeto y llvelo a cualquier posicin de la
pgina. El origen tambin puede moverse fuera del
objeto, ideal para girar objetos agrupados alrededor del
punto central.

3.

Arrastre el controlador de giro hasta un nuevo ngulo de


giro y el objeto girar sobre el nuevo origen.

Edicin de objetos 299

Para restablecer el origen de giro, solo tiene que hacer doble clic en
l.
Para girar un objeto 90 grados hacia la izquierda o la
derecha:

Seleccione el objeto y seleccione Rotar a la izquierda o


Rotar a la derecha en el men Organizar.

Recorte y combinacin de objetos


Recortar significa enmascarar (ocultar) partes de un objeto, por
ejemplo para mejorar la composicin o para crear un efecto
especial. El objeto subyacente permanece intacto. Son posibles dos
tipos de recorte: recorte cuadrado o recorte irregular.

Recorte cuadrado

Recorte irregular

La combinacin comienza con ms de un objeto; sin embargo, se


crea un objeto compuesto especial con uno o ms "orificios" en el
interior donde los objetos del componente se rellenan solapndose
mutuamente. Resulta de utilidad para crear efectos de lpiz o
mscara.

300 Edicin de objetos


Para recortar utilizando el contorno original del objeto:
1.

Seleccione el objeto y seleccione Herramienta Recorte


cuadrado
del elemento flotante Efectos de la
barra de herramientas Herramientas.

2.

Arrastre uno de los manejadores de bordes o esquinas


hacia adentro para recortar sin restricciones. Pulse la
tecla Mays mientras arrastra para recortar sin
restricciones (se mantiene la relacin de aspecto).

Para escalar el objeto dentro del contorno del recorte,


pulse Ctrl y arrastre hacia arriba o hacia abajo.
Para recortar modificando el contorno del objeto:

Seleccione el objeto y seleccione Herramienta de


recorte irregular
del elemento flotante Efectos de
la barra de herramientas Herramientas. La barra de
herramientas de contexto Curva aparecer, lo que le
permite controlar los nodos mostrados y los segmentos
conectados que definen el contorno de recorte del objeto.
Consulte Edicin de lneas en la pg. 377.

Para mover un nodo (punto de control) en el que vea


el cursor

, arrastre el nodo.

Para mover un segmento de lnea (entre dos


nodos) adonde se pueda ver el cursor , arrastre el
segmento.

Edicin de objetos 301

Para colocar un objeto recortado un objeto dentro del


contorno de recorte:

Con cualquier herramienta de recorte seleccionada, haga


clic en el objeto y arrastre su centro (cuando vea el
cursor de la mano).

Para ajustar la pluma del contorno de recorte:

Con cualquier herramienta de recorte seleccionada, haga


clic en el objeto.

En la barra de herramientas de contexto Recortar, defina


un valor de Pluma con las flechas arriba/abajo, el control
deslizante o mediante entrada directa. El ajuste de pluma
se aplica fuera del contorno de recorte mediante el punto
de ajuste definido.

Para deshacer el recorte (restaurar la visibilidad


completa):

Haga clic en el botn Quitar recorte en la barra de


herramientas de contexto Recortar.

Recortar a una forma


El comando Recortar a la forma funciona con exactamente dos
objetos seleccionados. Uno o ambos objetos pueden ser un objeto
de grupo. El objeto inferior (el que est detrs del otro) queda
recortado al contorno del objeto superior, dejando una forma
equivalente a la regin solapada.

302 Edicin de objetos

Para recortar a una forma:


1.

Coloque el objeto de "recorte" delante del objeto que se


va a recortar con el men Organizar o la barra de
herramientas Organizar segn sea necesario. En la
ilustracin anterior, una forma de QuickShape (globo de
pensamiento rpido) est frente a una imagen de
vacaciones.

2.

Con ambos objetos seleccionados (o agrupados), elija


Recortar a la forma en el men Herramientas.

Combinacin de lneas y formas


La combinacin de curvas es un modo de crear un objeto
compuesto de dos o ms lneas o formas dibujadas. Al igual que
con el recorte a forma, el objeto de delante recorta los objetos de
detrs, en este caso dejando uno o varios "agujeros" en los que los
objetos de componente se solapan. Al igual que con la agrupacin,
puede aplicar el formato (como lnea o relleno) al objeto
combinado y continuar editando nodos individuales y segmentos
con la Herramienta Puntero. A diferencia de estos otros mtodos,
un objeto combinado toma de forma permanente las propiedades
de lnea y relleno del objeto delantero. La combinacin es
reversible, pero los objetos de componentes conservan las
propiedades de relleno y lnea del objeto combinado.
La combinacin es un mtodo rpido de crear un recorte de
mscara o de plantilla:

Edicin de objetos 303

QuickShapes

Convertir a
curvas

Combinar
curvas

Sombra
paralela
aadida

Para combinar dos o varias lneas seleccionadas o


formas dibujadas:
1.

Dibuje dos lneas o QuickShapes.

2.

Coloque el objeto de "recorte" delante del objeto que se


va a recortar con el men Organizar o la barra de
herramientas Organizar segn sea necesario.

3.

Seleccione cada objeto y seleccione


Herramientas>Convertir a>Curvas.

4.

Seleccione ambos objetos.

5.

Elija Combinar curvas desde el men Organizar.

Para restaurar las formas originales de un objeto


combinado:

Seleccione el objeto combinado y seleccione Dividir


curvas del men Organizar.

304 Edicin de objetos

Unin de contornos de objeto


WebPlus incluye algunas herramientas potentes para crear nuevas
formas a partir de formas solapadas existentes. Con los comandos
aadir, restar, cruzar o excluir, puede generar un nuevo objeto
permanente (con un contorno nuevo) partiendo de cualquier objeto
seleccionado. El objeto unido se puede seguir editando mediante el
ajuste de los nodos de la nueva forma.
Para unir contornos:
1.

Seleccione objetos.

2.

Seleccione una opcin de trazos en el submen Unir


trazos del men Organizar.

Aadir

Crea un objeto nuevo que es igual a


la suma de dos objetos cualesquiera
seleccionados.

Los objetos no pueden estar


solapados.

Restar

Anula el solapamiento entre el objeto


de arriba y el de abajo. El objeto del
botn tambin se elimina.

Edicin de objetos 305

Resulta til como mtodo rpido para


truncar formas e imgenes con otro
objeto.

Compruebe que los objetos estn


efectivamente solapados!

Cruzar

Conserva el solapamiento y desecha


el resto.

Excluir

Combina dos o ms objetos en un


objeto compuesto, con un "agujero"
transparente en el que se solapan las
regiones rellenas.

306 Edicin de objetos

Cmo actualizar y guardar valores


predeterminados
Los valores predeterminados de los objetos son el conjunto de
configuraciones de propiedades que WebPlus tiene guardado para
aplicarlo a los objetos que se crean, por ejemplo:

lneas y formas (color de lnea y de relleno, sombreado,


patrn, transparencia, etc.)

marcos (mrgenes, columnas, etc.)

texto (fuente, tamao, color, alineacin, etc.). Lo valores


predeterminados se guardan aparte para texto artstico,
formas, marcos y texto de tabla.

Puede cambiar fcilmente los valores predeterminados de cualquier


tipo de objeto mediante el comando Actualizar valores
predeterminados del objeto o el cuadro de dilogo Paleta de
estilos de texto.
Los valores predeterminados son siempre locales, es decir, los
cambios en los valores predeterminados se aplican al sitio actual y
se guardan automticamente con este para que tengan efecto la
siguiente vez que se abra el sitio. Sin embargo, puede usar en
cualquier momento el comando Guardar valores
predeterminados para registrar los valores predeterminados como
globales y, entonces, tendrn efecto en todos los sitios que cree en
adelante.
Para establecer los valores predeterminados locales
para un determinado tipo de objeto:
1.

Cree un nico objeto de muestra y ajuste las propiedades


como desee o, si lo prefiere, utilice un objeto existente
que ya tenga las propiedades correctas. (Para los
grficos, puede utilizar una lnea, una forma o un
rectngulo; todos comparten el mismo conjunto de
valores predeterminados.)

Edicin de objetos 307

2.

Seleccione el objeto en el que se basarn los nuevos


valores predeterminados y seleccione Actualizar valores
predeterminados del objeto en el men Formato.

O, para los colores de lnea y relleno, incluidos los estilos de lnea:


1.

Sin el objeto seleccionado, seleccione el color de lnea


y/o relleno deseado de la pestaa Color o Muestrario
(consulte Aplicacin de colores slidos en la pg. 399).
Utilice la pestaa Lnea para establecer un grosor de
lnea, estilo y forma de esquina predeterminados.

2.

Dibuje el objeto en la pgina, que adoptar


automticamente los colores y estilos recin definidos
como predeterminados.

Para ver y cambiar las propiedades de texto


predeterminadas:
1.

Seleccione Paleta de estilo de texto... en el men Texto.

2.

Haga clic en Texto predeterminado y, a continuacin,


de la lista expandida de tipos de texto, seleccione una
opcin, como, por ejemplo, Texto artstico.

3.

Haga clic en Modificar... para ver las opciones de


configuracin actuales para el tipo de texto seleccionado.

4.

Utilice el cuadro de dilogo Estilo del texto para


modificar las propiedades de carcter, prrafo y
vieta/lista.

Para guardar todas las opciones de configuracin actual


como globales:
1.

Seleccione Guardar valores predeterminados... en el


men Herramientas.

308 Edicin de objetos


2.

3.

En el cuadro de dilogo, marque las opciones para


actualizar las opciones predeterminadas que desee
globalmente:

Valores predeterminados de documento y objeto


guarda la configuracin actual del sitio (tamao de
pgina, orientacin) y del objeto (opciones de la
barra de herramientas de contexto).

Estilos de texto guarda los estilos de texto actuales


en la Paleta de estilos de texto.

Estilos de objeto: guarda los estilos definidos por el


usuario de la pestaa Estilos.

Formatos de tabla y calendario guarda los


formatos personalizados que se hayan guardado en
el cuadro de dilogo Formatos de tabla.

Haga clic en Guardar para confirmar que desea que los


nuevos sitios utilicen los valores predeterminados de
objeto seleccionados globalmente.

11

Organizacin de
objetos

310 Organizacin de objetos

Organizacin de objetos 311

Ordenacin de objetos
A medida que los objetos se van creando, se apilan en el orden en
el que se han creado, de atrs hacia delante, con cada nuevo objeto
delante de los dems. En cualquier momento, puede cambiar el
orden de apilamiento, que afecta a cmo aparecen los objetos por
la pgina.
Para cambiar la posicin de un objeto un paso hacia
delante o hacia atrs:

Haga clic en Avanzar uno

o Retroceder uno

en la barra de herramientas Organizar,


respectivamente.
Para cambiar la posicin del objeto seleccionado en la
parte inferior o superior de la pila:

Haga clic en Enviar al fondo

o en Traer al frente

en la barra de herramientas Organizar,


respectivamente.
Si est trabajando con organizaciones complejas de objetos, con lo
que quizs necesite ms control al reordenar, puede usar la pestaa
objetos.
Para cambiar las posiciones de objetos a travs de la
pestaa Objeto:
1.

En la pestaa Objetos, seleccione la pgina en la que


estn colocados los objetos.

2.

Expanda la entrada de pgina haciendo clic en Expandir


, mostrando objetos en la pgina.

312 Organizacin de objetos


3.

Seleccione y arrastre el objeto a una nueva posicin en la


lista de objetos.
Puede utilizar Ctrl + clic y Mays + clic para
seleccionar varias entradas de objeto no adyacentes o
adyacentes.

El objeto en la posicin ms alta en la lista es el que


est ms arriba en el orden de objetos.

Alineacin y distribucin de objetos


La alineacin implica tomar un grupo de objetos seleccionados y
alinearlos todos en una operacin por sus bordes superior, inferior,
izquierdo o derecho. Tambin puede distribuir objetos, de forma
que los objetos (como una seleccin mltiple) se propaguen de
manera uniforme (opcionalmente a intervalos espaciados).
La alineacin o la distribucin se pueden producir entre los objetos
ms alejados de su pgina (seleccin actual), los mrgenes de la
pgina o el borde de la pgina.
La alineacin con el ltimo objeto seleccionado le permite elegir
un objeto especfico en una seleccin mltiple desde la cual alinear
otros objetos.
Para alinear los bordes de dos o ms objetos en una
seleccin:
1.

Con la herramienta Puntero, presione Mays en todos


los objetos que desea alinear o dibuje un recuadro
alrededor de ellos para crear una seleccin mltiple.

2.

Seleccione la pestaa Alinear.

3.

Seleccione una opcin para alineacin horizontal o


vertical. Seleccione Arriba, Abajo, Izquierda,
Derecha, Centrar en horizontal o Centrar en vertical.

Organizacin de objetos 313

Para distribuir dos o varios objetos a lo largo una


seleccin:

Seleccione Espaciado uniforme a lo largo

Espaciar uniformemente hacia abajo


para
expandir los objetos seleccionados de manera uniforme
entre los objetos ms alejados de la seleccin actual
(horizontalmente o verticalmente, respectivamente) o
mediante una medida establecida (seleccione Espaciado
y defina un valor en cualquier unidad de medida).
En lugar de trabajar con el rea de seleccin actual, puede alinear o
distribuir los mrgenes de pgina (si estn definidos) o el borde de
pgina.
Para alinear/distribuir objetos a los mrgenes o bordes
de la pgina:
Para un control de alineacin ms avanzado, puede alinear varios
objetos en relacin con el ltimo objeto seleccionado (seleccione
los objetos seguidos con la tecla Mays pulsada) usando la opcin
de la lista desplegable Relativo a ltimo seleccionado.
El ltimo objeto seleccionado se muestra con el
cuadro delimitador ms oscuro si se compara con
otros objetos seleccionados.

Asociacin de objetos a texto


WebPlus le permite colocar formas, imgenes u objetos de la
galera en relacin con el texto del sitio (texto artstico o de marco)
en una de dos formas:

314 Organizacin de objetos

Flotar con el texto. Esta opcin es ideal para imgenes y


formas, etc.

Una forma adjunta


a texto artstico como ttulos

Una imagen dentro


de un marco de texto

Posicionar en lnea como carcter. El objeto adjunto se


coloca como un carcter en el texto y se alinea
verticalmente en relacin con el texto que lo rodea.

Un objeto de la galera
adjunto
a un ttulo de texto artstico

Un objeto de la galera de
laDiversin colocado en
lnea dentro de un marco de
texto

La ventaja de ambos mtodos, es que el objeto adjunto con el texto


se mueve como el texto. Para texto del marco especialmente,
cuando el reflujo de texto se aade como nuevo contenido al
marco, el objeto adjunto se mueve con el texto.

Organizacin de objetos 315

Para adjuntar un objeto a texto:


1.

Site el objeto sobre o cerca del texto artstico o el texto


de marco al que se adjuntar.

2.

Seleccione Adjuntar al texto... del men Organizar.

3.

En el cuadro de dilogo, elija una opcin de posicin:

Para un objeto flotando:


1.

Active Flotar con el texto. Esta es la opcin de


posicionamiento predeterminada.

2.

Defina la opcin de Posicin en texto para que el objeto


se ubique en relacin al texto artstico o texto del marco.
Seleccione Izquierda o Derecha o establezca un valor
Sangra de como sangra izquierda por un valor de
pxeles establecido.

3.

Una vez que est posicionado, puede especificar la


Distancia del texto: el margen entre el contorno del
objeto y el texto adyacente.

4.

Haga clic en Aceptar.


Una vez que est adjunto, el objeto
muestra un botn Adjuntar al texto bajo el
objeto. Haga clic para editar las propiedades.
El Punto de adicin
es una ubicacin
especfica en el texto artstico o texto de
marco desde la cual se colocar el objeto.
Arrastre a una posicin diferente en el texto
para mover el punto de adicin y el objeto
simultneamente.

316 Organizacin de objetos


O, para un objeto alineado:
1.

Active Posicionar en lnea como carcter.

2.

Para establecer la alineacin vertical del objeto con


respecto al texto adyacente, seleccione la opcin Alinear
con el texto. El texto no fluir alrededor del objeto
adjunto.

3.

(Opcional) Especifique un valor de Desplazamiento de


para establecer el porcentaje que el objeto se desplazar
verticalmente en relacin con su altura.

4.

(Opcional) Active Escalar a para escalar el objeto a un


porcentaje del tamao del punto del texto adyacente.
Esto conserva el mismo tamao relativo si el tamao de
texto cambia. 100% escalar con exactitud al tamao del
punto actual.

5.

Una vez que est posicionado, puede especificar la


Distancia del texto: el margen entre el contorno del
objeto y el texto adyacente.

4.

(Opcional) Active Usar esta configuracin al pegar


para actualizar los valores predeterminados de alineacin
y flotacin. Cualquier objeto siguiente que se pegue
adoptar la configuracin guardada cuando se activ la
opcin.

5.

Haga clic en Aceptar. El objeto se muestra en lnea con


el texto y muestra un icono Adjuntar al texto

Para ver las propiedades del objeto adjunto:


1.

Seleccione un objeto adjunto.

2.

Haga clic en Adjuntar al texto


el objeto.

, que aparece bajo

Organizacin de objetos 317

Aparecer el cuadro de dilogo Propiedades del objeto adjunto.


Las opciones son diferentes en funcin de la opcin de
posicionamiento activada.
Si desea cambiar la posicin de un punto de adicin, puede
arrastrarlo en su marco de texto. El arrastrar a un rea fuera del
texto artstico o de marco, desconectar el objeto adjunto. Tambin
puede desconectar el punto de adicin a travs del cuadro de
dilogo Propiedades del objeto adjunto.
Para desconectar un objeto adjunto:

En el cuadro de dilogo Propiedades del objeto adjunto,


active Desasociar del texto.

Creacin de grupos
Puede fcilmente convertir una seleccin mltiple en un objeto de
grupo. Cuando se agrupan objetos, puede colocar, redimensionar
o rotar todos los objetos al mismo tiempo.
Para crear un grupo de una seleccin mltiple:

Haga clic en
el botn

318 Organizacin de objetos


Para desagrupar (hacer que un grupo vuelva a ser una
seleccin mltiple):

Haga clic en el
. El
botn
grupo vuelve a
ser una seleccin
mltiple.

Simplemente con hacer clic en cualquier miembro de un grupo se


selecciona el objeto de grupo. En general cualquier operacin que
se realice en un grupo seleccionado afecta a cada miembro del
grupo. No obstante, los objetos que comprenden un grupo
permanecen intactos y tambin se puede seleccionar y editar un
objeto individual en un grupo.
Para seleccionar un objeto individual en un grupo:

Ctrl-clic en el objeto.

12

Imgenes, animacin y
multimedia

320 Imgenes, animacin y multimedia

Imgenes, animacin y multimedia 321

Adicin de marcos de imagen

Un marco de imagen es un contenedor con forma dent


coloca la imagen, al igual que los marcos de imagen de
casa.
En WebPlus, puede usar dos tipos de marcos de imagen:

Marcos de imagen con borde en la pestaa


Galera.
O bien:

Marcos de imagen sin borde de la barra de


herramientas Herramientas.
WebPlus le permite importar o arrastrar una imagen directamente
al marco mediante la barra Multimedia. Los marcos de imagen
vacos se muestran como marcadores con forma de sobre. En
cualquier momento puede reemplazar la imagen del interior del
marco.

322 Imgenes, animacin y multimedia


Todos los marcos de imagen que
contengan una imagen mostrarn la
barra de herramientas Marco de
fotografa en el marco. Esto permite
obtener panormicas y giros (90 grados
en el sentido opuesto a las agujas del
reloj), acercar, alejar y reemplazar los
controles de imagen).
Para aadir un marco de fotografas con borde:
1.

En la pestaa Galera, seleccione Marcos de fotografas


en la lista desplegable.

2.

Desplcese hasta la categora secundaria que elija (por


ejemplo, Metlico, Natural, etc.).

3.

Arrastre la miniatura del diseo del marco a la pgina.

Para aadir un marco de fotografas sin borde:


1.

Si desea obtener un marco cuadrado vaco, seleccione


Imagen>Marco vaco... en el men Insertar.

2.

El puntero del ratn cambia al cursor del Pegar


imagen. Las acciones que realice a continuacin
determinarn el tamao y la colocacin iniciales del
marco de la imagen.

Imgenes, animacin y multimedia 323

3.

Para insertar el marco con el tamao predeterminado,


simplemente haga clic con el ratn.
O bien:
Para definir el tamao del marco, arrastre una regin y
suelte el botn del ratn.

Para aadir una imagen a un marco:

En el lbum que se est mostrando de la barra


Multimedia, arrastre y suelte una fotografa
directamente en el marco de la imagen.
O bien:
justo debajo
Haga clic en Reemplazar imagen
del marco seleccionado y encuentre y seleccione una
imagen. Haga clic en Abrir.

La imagen se aadir al marco mediante las propiedades


predeterminadas de Marco de imagen. Es decir, se escalar para el
ajuste mximo y se mantendr en todo momento la relacin de
aspecto. Sin embargo, puede alterar el tamao, la orientacin y la
posicin de la imagen con respecto al marco .

Importacin de imgenes
Existen varias formas de traer una imagen a WebPlus. Puede
arrastrar un archivo de una carpeta externa de Windows
directamente a la pgina, arrastrar una miniatura de la barra
multimedia de WebPlus (consulte la pg. 328), pegar del rea de
pegado o importar una imagen como un archivo mediante un
cuadro de dilogo.

Las imgenes separadas flotan libremente en la pgina,


mientras que las imgenes alineadas se incorporan al
flujo del texto en un objeto de texto.

Las imgenes incrustadas se convierten en parte del


sitio de WebPlus, mientras que la vinculacin coloca
una copia de la referencia de la imagen en la pgina y
conserva una conexin el archivo original. Cada mtodo

324 Imgenes, animacin y multimedia


tiene sus pros y sus contras (consulte Diferencias entre
incrustar y vincular en la pg. 327).
WebPlus le permite colocar la imagen en la pgina en el tamao
original. Se deshar el recorte de la imagen de forma
predeterminada pero tendr la opcin de recortar la imagen y
ajustar las propiedades del marco de la imagen con respecto al
posicionamiento y a la escala de la dentro del marco.
Para aadir una imagen de la barra multimedia:

Arrastre una miniatura de la imagen a la pgina de los


lbumes actualmente mostrados en la barra multimedia
de WebPlus (expanda la barra multimedia de la parte
inferior del rea de trabajo). Tambin puede arrastrar
sobre una imagen existente para sustituirla.

Para importar una imagen de un archivo:


1.

(Opcional) Si desea colocar la imagen alineada, haga clic


en un punto de insercin en un objeto de texto. Para una
imagen separada, asegrese de que los objetos de texto
no estn seleccionados.

2.

En la ventana principal:

Haga clic en el botn Importar imagen...


el elemento flotante Imagen

en

3.

Utilice el cuadro de dilogo Importar imagen para


seleccionar el archivo de imagen que desea abrir.

4.

Seleccione Insertar imagen o Vincular imagen.


Consulte Diferencias entre incrustar y vincular en la
pg. 327.

5.

Haga clic en Abrir.

Imgenes, animacin y multimedia 325

Si hay un punto de insercin de texto en la ventana


principal, la imagen se ubicar dentro del texto y se
acoplar en el punto de insercin.

Si se ha abierto una imagen con la barra QuickBuilder, la


imagen se mostrar automticamente en la pgina.

De lo contrario, el puntero del ratn cambiar al cursor


Pegar imagen
. Las acciones que realice a
continuacin determinarn el tamao y la colocacin
iniciales de la imagen separada.

Para insertar la imagen con su tamao de pxeles


original, haga clic con el ratn.
O bien:
Para definir el tamao de la imagen insertada,
arrastre una regin y suelte el botn del ratn.
Utilice la tecla Mays para una ubicacin sin
limitaciones (la operacin normal es mantener la
relacin de aspecto de la imagen).

Para pegar mltiples imgenes, seleccione varias


imgenes del cuadro de dilogo Abrir y, a continuacin,
pegue cada imagen una por una en la pgina (por clics
consecutivos).

Sustitucin de imgenes
La opcin de sustituir imagen le permite cambiar una imagen en
cualquier momento, y es especialmente til cuando desea
conservar la posicin y las dimensiones de una imagen en la pgina
pero desea actualizar la propia imagen. Se puede utilizar en
cualquier imagen (recortado o sin recortar).

326 Imgenes, animacin y multimedia


Para sustituir una imagen:

Haga clic en el botn Reemplazar imagen


justo
debajo de la imagen seleccionada y encuentre y
seleccione una imagen. Haga clic en Abrir.

Para sustituir una imagen mediante la barra multimedia:

Arrastre una miniatura de la imagen a la imagen


existente de los lbumes actualmente mostrados en la
barra multimedia de WebPlus (expanda primero la
barra multimedia de la parte inferior del rea de trabajo).

Ajuste de imgenes recortadas


WebPlus proporciona opciones adicionales para trabajar con
imgenes recortadas, que son tanto las imgenes que ha recortado
con las herramientas de recorte (barra de herramientas
Herramientas) como las imgenes que se pueden sustituir que ya
estn presentes en las plantillas de diseo. Por ejemplo, puede
hacer zoom para ajustar la parte de la imagen que se muestra en el
interior de su marco o puede cambiar la forma en la que la imagen
est escalada y alineada ajustando sus propiedades de marco.
Cuando seleccione una imagen recortada con la herramienta
Puntero, aparece una barra de control debajo de la imagen que
proporciona opciones de panormica, rotacin, zoom para acercar,
zoom para alejar y sustitucin de imgenes.

Para reposicionar una imagen recortada dentro de su


marco, haga clic en
arrastre en la imagen.

y, a continuacin, haga clic y

Para rotar la imagen en pasos de 90 grados contrarios al


sentido horario, haga clic en el botn

Imgenes, animacin y multimedia 327

Para acercar o alejar la imagen, haga clic en una de las


herramientas de zoom

Para sustituir una imagen, haga clic en


;a
continuacin, examine para buscar la nueva imagen y
haga clic en Abrir.

Para editar las propiedades del marco:


1.

Haga clic en una imagen recortada y elija Propiedades


del marco.
O bien:
Seleccione la imagen y elija Propiedades del marco en
la barra de herramientas de contexto Imagen.

2.

En el cuadro de dilogo, puede escalar al


mximo/mnimo, Expandir para ajustar o usar el
tamao de la imagen original (Sin escala).

3.

Para cambiar la alineacin vertical de la imagen en el


marco, seleccione Superior, Centro o Inferior.

4.

Para la alineacin horizontal, seleccione Izquierda,


Centro o Derecha.
Si selecciona una imagen sin recortar solo hay un
botn Reemplazar imagen.

Diferencias entre incrustar y vincular


Incrustar significa que la imagen en WebPlus es ahora distinta del
archivo original. Incrustar genera un archivo de WebPlus ms
grande y si necesita modificar una imagen incrustada, tendr que
reimportarla despus de editarla. No obstante, es lo ms
recomendable si el tamao del archivo no es un problema y los
grficos son finales.

328 Imgenes, animacin y multimedia


Vincular inserta una copia del archivo de la imagen en el sitio de
WebPlus, vinculada al archivo real de modo que los cambios que
realice posteriormente en la aplicacin nativa se reflejarn
automticamente en WebPlus. Vincular es un mtodo de evitar
aumentar el tamao del sitio, pues limita el tamao del archivo. Por
otro lado, necesitar gestionar externamente los archivos
vinculados con sumo cuidado, por ejemplo, asegurndose de
incluirlos todos si mueve el archivo de WebPlus a otra unidad.
Cualquiera de las dos opciones no afectan al sitio
web publicado, solamente al sitio de WebPlus.

Uso de la barra multimedia


La barra multimedia acta como cesta que contiene las fotos que
se pueden incluir en su sitio. Su principal uso es contribuir al
proceso de diseo mejorando la eficiencia (evita tener que importar
fotografas una a una) y comodidad (las fotos siempre estn a
mano). Sobre todo para sitios web con fotografas, quizs basados
en plantillas de diseo de WebPlus, la barra multimedia
constituye una valiosa herramienta para arrastrar fotografas
directamente a imgenes indeseadas para reemplazarlas.

Imgenes, animacin y multimedia 329

La barra multimedia se puede usar como rea de almacenamiento


temporal antes de colocar las fotografas en el sitio o puede usarse
para crear lbumes de fotos ms permanentes desde los que puede
recuperar las fotos almacenadas en cualquier momento. De forma
predeterminada, las fotografas se aaden a un lbum temporal,
pero recuerde hacer clic en el botn Nuevo lbum si desea guardar
el lbum para utilizarlo ms tarde. Cada vez que se inicia WebPlus
simplemente tiene que cargar el lbum guardado (o cualquier otro
lbum guardado) o trabajar con un lbum temporal, la eleccin es
suya!
Puede importar un nmero ilimitado de fotografas por archivo o
por carpetas enteras y decidir si las fotografas se insertan o
vinculan en el sitio antes de colocar las fotos en la pgina.
Para grandes colecciones de fotos, se puede buscar en los lbumes
las fotografas por nombre de archivo y metadatos EXIF, IPTC o
XMP; incluso puede editar metadatos XMP desde WebPlus.

330 Imgenes, animacin y multimedia


El lbum actualmente cargado que se muestra en su
barra multimedia permanecer visible
independientemente del sitio que tenga abierto.
Las miniaturas se pueden arrastrar de la barra multimedia
directamente a una imagen existente en la pgina, sustituyndola
con este proceso. Tambin puede aadir una imagen como nueva,
colocndola en su tamao original.
Para ver la barra multimedia:

Si no se muestra, haga clic en el controlador


la parte inferior del rea de trabajo.

de

Para aadir fotografas a un lbum temporal:


1.

Con la barra multimedia visible y un lbum temporal


cargado, haga clic en el rea de trabajo de la barra
multimedia para abrir el cuadro de dilogo Importar
imagen.

2.

En el cuadro de dilogo, desplcese a una carpeta y


seleccione las fotos para la importacin.

3.

Haga clic en Abrir. Las fotografas se mostrarn como


miniaturas en el rea de trabajo de la barra multimedia.

A menos que lo guarde, el lbum temporal y su


contenido de fotos no se guardarn cuando cierre
WebPlus.
Puede arrastrar uno o ms archivos de cualquier carpeta
de Windows directamente en la ventana de la barra
multimedia. Si hace clic en la imagen en la barra
multimedia y seleccione Ubicar en navegador se
abrir la carpeta de fotos en el Explorador de Windows,
ideal para arrastrar y soltar o solo para la gestin
general de archivos.

Imgenes, animacin y multimedia 331

Para guardar un lbum temporal en un lbum con


nombre:
1.

Haga clic en la flecha hacia abajo en el botn Aadir a


. En el men, seleccione Nuevo lbum.

2.

En el cuadro de dilogo Nuevo lbum, en el cuadro


Nombre de lbum, escriba un nombre para identificar
su lbum en el futuro.

3.

(Opcional) Para cualquier fotografa puede editar el


estado de incrustado/vinculado antes de colocarla en la
pgina; haga clic en la configuracin de ubicacin de una
fotografa y utilice el men desplegable de la
configuracin para cambiarla. Tambin puede cambiar
esa configuracin mientras arrastra/suelta en la pgina.

4.

Haga clic en Aceptar.

Para incluir las fotografas de un lbum temporal en un lbum


guardado, haga clic en el botn Aadir a y seleccione un lbum
con nombre en el men.
Creacin de un lbum con nombre:
1.

Haga clic en el botn Nuevo lbum

2.

En el cuadro de dilogo, en el cuadro Nuevo lbum,


escriba un nombre para identificar el lbum en el futuro.

3.

Haga clic en el botn Agregar imagen


carpeta

4.

de la barra.

o Agregar

En el cuadro de dilogo, desplcese a una fotografa o


carpeta y haga clic en Abrir.

332 Imgenes, animacin y multimedia


5.

El cuadro de dilogo Nuevo lbum indica los archivos


que se van a incluir. Opcionalmente, se puede modificar
la opcin de posicin de incrustado/vnculo haciendo clic
en la configuracin de cada fotografa y seleccionando en
el men desplegable.

6.

Para eliminar una fotografa, seleccione una fotografa y


haga clic en el botn Quitar imagen

7.

Haga clic en Aceptar.

Para cargar un lbum guardado:

Seleccione el nombre de un lbum guardado en el men


desplegable superior derecha de la barra. Las fotografas
del lbum se mostrarn en el rea de trabajo de la barra
multimedia.

Los lbumes guardados se pueden seleccionar como se ha indicado


y, a continuacin, modificar mediante el botn Administrar
(solo mostrado para los lbumes guardados). Puede aadir
fotografas y carpetas, eliminar fotografas y modificar el estado de
incrustado/vinculado.
Para eliminar un lbum:

Seleccione el nombre de un lbum existente en el men


desplegable superior derecho y haga clic en Eliminar
lbum

Para ordenar los resultados de un lbum:

En el cuadro de bsqueda Ordenar por, elija Nombre de


archivo, Clasificacin o Fecha tomada para reorganizar
las fotos segn la opcin que elija.

Imgenes, animacin y multimedia 333

Adicin de fotografas a una pgina


Para aadir una fotografa a una pgina:
1.

Abra el lbum temporal de la barra multimedia o cargue


un lbum guardado desde el men desplegable superior
derecha.

2.

Arrastre la miniatura de fotos de un lbum a la pgina y


suelte el botn del ratn.

Configuracin de las opciones de


exportacin de imgenes
Cuando publica el sitio, WebPlus aplica una configuracin global
especfica para determinar cmo se convierte cada imagen (ya sea
dibujada, pegada o importada) en un mapa de bits distinto
mostrado en la pgina web.
Aqu se incluye un resumen rpido de la configuracin de
conversin tal y como se definen inicialmente para la publicacin
web:

Cada imagen referenciada se exporta como archivo


independiente.

Cualquier imagen que se inserte como GIF, JPEG o PNG


se exporta como el archivo original, usando su nombre
de archivo original.

Los metarchivos insertados y todos los dems grficos se


vuelven a generar como imgenes PNG.

Esta configuracin se puede modificar, pero antes de hacerlo,


deber revisar la "lgica" que WebPlus aplica a la publicacin de
grficos web. En primer lugar, WebPlus tiene un formato
predeterminado al que se convierten todos los grficos al
exportarlos. Aunque se pueden hacer excepciones a esta regla

334 Imgenes, animacin y multimedia


especificando que ciertos tipos de imgenes deben conservarse
como su archivo original. Inicialmente, PNG es el formato
predeterminado, pero con anulaciones definidas para GIF y JPEG.
Por eso, usando la configuracin inicial de arriba, las imgenes
PNG se conservan tal cual, mientras que el resto de los grficos se
convierten a PNG.
Puede comprobar y cambiar estas opciones en el cuadro de dilogo
Propiedades del sitio (men Archivo). La configuracin es global
y se aplica a todos los grficos del sitio, pero tambin aqu se
pueden hacer excepciones, en este caso, para grficos individuales.
Para ello, en un grfico seleccionado puede:

Utilizar Opciones de exportacin... (men Formato) o


Administrador de exportaciones de imgenes (men
Herramientas) para definir el formato de exportacin de
imgenes particulares caso por caso.
O bien:
Convertir algunas imgenes a un formato especfico de
antemano utilizando Herramientas>Convertir en
imagen.

Esta combinacin de configuraciones global y local ofrecen un


control casi total (si se molesta en ejercerlo) sobre cmo se vierten
los grficos a las pginas web. Miremos primero cmo funciona la
configuracin global.
Para establecer las opciones globales de la exportacin
para los grficos web:
1.

Seleccione Propiedades del sitio... en el men Archivo


y seleccione la opcin de men Grficos.

2.

En la seccin Formato de archivo de exportacin,


seleccione un formato que desee exportar. Este ser el
formato predeterminado al que se convertirn todos los
grficos al exportarlos, a menos que se definan
anulaciones. Para JPG, puede establecer un valor de
compresin. Para PNG, las opciones Usar
transparencia PNG y Usar modificacin de
compatibilidad permiten la transparencia PNG y

Imgenes, animacin y multimedia 335

generan correctamente transparencia alfa PNG (en


Internet Explorer 5.5 y 6.0), respectivamente.
3.

En la seccin Remuestreo, seleccione un mtodo de


remuestreo para proporcionar a las imgenes de
cualquier formato calidad ptima, buena, ms ntida o
ms suavizada; cuanto mayor sea la calidad, ms lenta
ser la exportacin. Mejor calidad utiliza supermuestreo
para garantizar el detalle ms fino de grficos
exportados. Active la opcin No volver a muestrear
imgenes... para evitar volver a muestrear imgenes
cuando el tamao de la imagen exportada se aproxima al
tamao original.

4.

Para exportar nombres de archivos grficos originales, en


la seccin Nomenclatura active Usar nombres
originales de archivos de imagen. Los grficos se
almacenan en la raz del sitio web publicado.

5.

En la seccin Optimizacin, mantenga activada la


opcin Combinar imgenes solapadas en un solo
archivo para que WebPlus analice el sitio y (si el
resultado fuera un archivo ms pequeo) produzca
grficos solapados como un nico grfico. Esta opcin
ser til o no dependiendo de cada diseo particular. En
lugar de usar este mtodo global, podra usar
Herramientas>Convertir en imagen en casos
concretos.

6.

En la seccin Texto, puede activar la opcin Dibujar


texto como curvas suaves para hacer que el texto que se
exporta como grfico tenga una apariencia ms suave. Es
ideal para el texto artstico ntido.

7.

En la seccin Imgenes con hipervnculo, establezca un


ancho o un alto mximo al exportar imgenes. Esto evita
que las imgenes se muestren en las dimensiones de la
imagen original innecesariamente grandes. Resulta til
para crear un hipervnculo a una imagen mayor.

336 Imgenes, animacin y multimedia

Configuracin de opciones de exportacin,


ttulo y texto alternativo para grficos
individuales
Administrador de exportaciones de imgenes es un asistente que
le permite establecer el formato de archivo de exportacin para
grficos individuales en el sitio o para objetos como texto girado
que se convertirn en imgenes en la exportacin. Este valor local
definido imagen por imagen invalida la configuracin global
(como se establece en Archivo>Propiedades del sitio) que
WebPlus utiliza para determinar el formato de exportacin. Puede
utilizar el asistente para comprobar una sola imagen seleccionada,
la pgina actual, o el sitio entero. Cada imagen puede guardarla de
diferentes formas. Puede:

Elegir un formato especfico (GIF, JPEG o PNG) para


exportar (o simplemente recurrir a la configuracin
predeterminada del sitio). Para JPEG, puede elegir un
nivel de compresin.
O bien:

Guardar el archivo en una ruta y nombre de archivo


seleccionados en la exportacin. Puede que desee aadir
nombres descriptivos ms significativos a las imgenes
de exportacin (especialmente til cuando se realiza el
mantenimiento del sitio web) en lugar de exportar las
imgenes con nombres de imagen generados
automticamente.

Jzguelo con sus propios ojos. Su opcin ms probable es


mantener activada la opcin Usar la configuracin
predeterminada del sitio para que todas las imgenes empiecen
por ah. Con la configuracin global original, las imgenes GIF,
JPEG y PNG se exportarn como sus archivos originales, mientras
que las dems, entre las que se incluyen QuickShapes y las formas
cerradas, se publicarn como PNG. A continuacin, previsualice el
sitio y determine si desea variar la configuracin global o probar
un formato diferente de salida para imgenes especficas.

Imgenes, animacin y multimedia 337

Incluso si no cambia ninguna configuracin de formato, puede


establecer un ttulo de imagen que normalmente aparecer como
informacin sobre herramienta cuando se pase el ratn por encima
de la imagen en un navegador. Tambin puede introducir texto
alternativo (manual o automticamente) por razones de
accesibilidad.
Para establecer el formato, el ttulo y/o el texto
alternativo de exportacin:
1.

Si ha activado una nica imagen, puede seleccionarla


primero y elegir Opciones de exportacin desde el
men Formato o haga clic con el botn secundario.
O bien:
Para revisar las opciones de exportacin web para las
imgenes del sitio, seleccione Administrador de
exportaciones de imgenes desde el men
Herramientas.

2.

(Slo si est utilizando Administrador de exportacin de


imagen) Seleccione si est marcando un objeto
seleccionado, una pgina actual o un sitio entero en el
asistente y haga clic en Continuar. El asistente recorre
todos los grficos del intervalo especificado y los
muestra uno por uno junto con el cuadro de dilogo
Opciones de exportacin de imagen.

3.

En la seccin Guardar imagen como del cuadro de


dilogo, puede habilitar una de las siguientes opciones:

Guardar con un formato y nombre elegidos por


WebPlus. El formato del grfico es el que est
definido en las propiedades del sitio (Grficos;
Formato predeterminado); el nombre se genera
automticamente, p. ej., wp479d0ea6.

Guardar en este formato con un nombre elegido


por WebPlus.
Haga clic en un botn de opcin GIF, JPEG o PNG
para especificar el formato de exportacin para el
grfico actual. Habilite Usar la configuracin

338 Imgenes, animacin y multimedia


predeterminada del sitio si el formato
predeterminado del sitio se va a mantener pero
WebPlus le va a asignar un nombre
automticamente. Si selecciona JPEG, elija una
calidad de compresin del men desplegable
Compresin.

Guardar en la ruta y con el nombre que elija.


Haga clic en el botn Elegir archivo... El cuadro de
dilogo mostrado le permite exportar con el nombre
de archivo de imagen original (habilite Usar
nombre predeterminado) o elegir un nuevo
nombre de imagen (habilite el botn Elegir nombre
e introduzca un nuevo nombre de archivo). En
cualquiera de los mtodos, puede desplazarse a la
carpeta en la que desee guardar la imagen
exportada. El formato de archivo utilizado ser el
establecido en la configuracin predeterminada del
sitio. An puede invalidar la configuracin
predeterminada del sitio modificando la extensin
del archivo en el campo Elegir nombre, p. ej., .gif a
.png.

4.

Active la opcin Excluir esta imagen de la


optimizacin... si no desea combinar la imagen con una
imagen exportada si se solapa con otra imagen de su
sitio.

5.

(Opcional) Elija uno de los distintos mtodos de


remuestreo. WebPlus puede volver a muestrear cuando
sea necesario y el archivo siempre se volver a muestrear
(p. ej., cuando se cambie el tamao de una imagen JPG)
o nunca se volver a muestrear (se usar la imagen
original). Active el botn de opcin correspondiente
segn sea necesario. El cambio de formato siempre
volver a muestrear. El remuestreo puede usar la calidad
definida en Propiedades del sitio (arriba) o una calidad
especfica (ptima, buena, ms ntida o ms suavizada)
para el grfico.

Imgenes, animacin y multimedia 339

6.

Para introducir un ttulo para un grfico, vea la pestaa


ALT y TITLE e introduzca el texto correspondiente. Se
mostrar al desplazarse sobre una imagen exportada.

7.

En la misma pestaa, asigne una cadena de texto ALT a


la imagen para la accesibilidad web. El lector de pantalla
lee la cadena al desplazarse por encima. Puede asignar
texto introducindolo en el cuadro de entrada o puede
activar Usar texto ALT predeterminado. Por ltimo, se
exporta la imagen como se indica a continuacin:

8.

Si las imgenes son decorativas (no contienen texto)


no tienen ningn texto ALT.
O bien:

Si la imagen es un grfico en el que se puede hacer


clic, como un botn etiquetado (p. ej., Atrs,
Adelante, etc.), se coge el texto de la imagen
automticamente, exportado como texto ALT (es
decir, Atrs, Adelante) y se muestra a un lector de
pantalla. Si se especifica un grfico de ttulo, el
texto del ttulo se utiliza como texto ALT.

Haga clic en Aceptar.

Importacin de imgenes TWAIN


Si su escner o cmara digital proporciona asistencia tcnica de
TWAIN, puede buscar imgenes directamente en WebPlus usando
el estndar TWAIN o guardar la imagen escaneada y despus
importarla a WebPlus.
Para configurar su dispositivo TWAIN para importar:

Consulte las instrucciones de funcionamiento en la


documentacin suministrada con el escner.

340 Imgenes, animacin y multimedia


Para importar una imagen escaneada:

Seleccione Imagen en el men Insertar y, a


continuacin, seleccione TWAIN y Adquirir... en los
submens para abrir un cuadro de dilogo donde
seleccionar un archivo.

Si tiene instalados ms de un dispositivo compatible con TWAIN,


quizs necesite seleccionar desde dnde desea escanear.
Para seleccionar un origen TWAIN diferente para
escanear:
1.

Seleccione Imagen en el men Insertar y, a


continuacin, seleccione TWAIN y Seleccionar
origen... en el submen.

2.

Identifique el dispositivo que desea usar como origen


TWAIN.

Aplicacin de filtros de PhotoLab


Los filtros se pueden aplicar y administrar en PhotoLab, un
potente estudio que permite aplicar a las imgenes filtros con
ajustes y efectos, tanto individualmente como en combinacin, es
decir: todo aplicado y previsualizado al instante. PhotoLab ofrece
las siguientes caractersticas fundamentales:

Filtros de ajustes
Aplique filtros de tono, color, lente y enfoque.

Filtros de efectos
Aplique efectos de distorsin, desenfoque, estilsticos, de
ruido, representacin, artsticos y muchos ms.

Filtros de retoque
Aplique correccin de ojos rojos, retoque de manchas,
enderezamiento y recorte.

Imgenes, animacin y multimedia 341

Funcionamiento no destructivo
Todos los filtros se aplican sin que la imagen original se
vea afectada y se pueden modificar en cualquier
momento ms adelante.

Eficaces combinaciones de filtros


Se pueden crear combinaciones de filtros de ajuste,
retoque y efectos mezclados para flujos de trabajo que se
pueden guardar.

Enmascaramiento selectivo
Los filtros se aplican a las regiones seleccionadas
utilizando mscaras.

Guardar y administrar favoritos


Guarde las combinaciones de filtros en una prctica
pestaa Favoritos.

Controles de visualizacin
Compare las vistas previas de antes y despus, con los
controles de pantalla doble y dividida. Utilice el control
para vista panormica y zoom para desplazarse por la
imagen.

Controles de bloqueo
Proteja los filtros aplicados de un posible cambio
accidental y, a continuacin, aplquelos a otras imgenes
de la seleccin si lo desea.

PhotoLab incluye pestaas de filtros, una barra de herramientas


principal y una pila de filtros aplicados alrededor de un rea de
trabajo central.

(A) barra de herramientas principal, (B) rea de trabajo principal,


(C) pila de filtros, (D) pestaas de filtros, (E) pestaa Imgenes

342 Imgenes, animacin y multimedia


Para iniciar PhotoLab:

1.

Seleccione la imagen a la que desee aplicar el filtro.

2.

Haga clic en PhotoLab


en la barra de
herramientas de contexto Imagen.

Utilizacin de la pestaa Imgenes


Las imgenes presentes en el sitio web se mostrarn en la pestaa
Imgenes (parte superior) si se expande la pestaa. Esta pestaa se
muestra de forma predeterminada en PhotoLab, pero se puede
en la parte inferior del
ocultar al hacer clic en el botn
rea de trabajo.

Imgenes, animacin y multimedia 343

Para buscar imgenes del sitio:


1.

Haga clic en el botn Filtro ubicado en la pestaa


Imgenes.

2.

Seleccione y defina el tamao mnimo y mximo de la


imagen, si es necesario.

3.

Seleccione o anule la seleccin de RGB, CMYK y Escala


de grises para que se muestren solo imgenes en esos
modos de color.

4.

Haga clic en Aceptar.

La pestaa Imgenes solo muestra las imgenes que cumplen con


los criterios establecidos anteriormente.
Con la pestaa Imgenes abierta, podr seleccionar y
editar todas las imgenes sin tener que salir de
PhotoLab.

344 Imgenes, animacin y multimedia

Aplicacin de un filtro
Los filtros se almacenan en
las pestaas Favoritos,
Ajustes y Efectos de
PhotoLab, las cuales agrupan
los filtros de manera lgica
por categoras (p. ej.,
Correccin rpida agrupa los
filtros que se usan con ms
frecuencia para una
correccin en pocos pasos).
La pestaa Favoritos incluye
algunos de los filtros que se
utilizan con ms frecuencia
(individuales o en
combinacin). Estos se
pueden complementar con
filtros definidos por el propio
usuario.
Para aplicar un filtro con realizacin de pruebas:
1.

Haga clic en una miniatura del filtro.

2.

En el momento en que se selecciona un filtro, este se


aade provisionalmente a la Zona de prueba donde
podr experimentar con libertad, utilizando su propia
configuracin para ese filtro. La imagen se actualiza
automticamente para mostrar una vista previa de la
configuracin nueva.

3.

Ajuste los controles deslizantes (o introduzca valores de


entrada) hasta que el filtro se adapte a sus necesidades.
Algunos filtros incluyen casillas de verificacin, mens
desplegables y controles adicionales (p. ej. configuracin
avanzada).

Imgenes, animacin y multimedia 345

Cuando se selecciona un filtro nuevo, este reemplaza


siempre el filtro actual.
Todos los filtros pueden deshabilitarse, restablecerse o eliminarse
provisionalmente de la zona de prueba.
Para
deshabilitar
un filtro:

Haga clic en
y a continuacin en
volver a habilitarlo.

Para
restablecer
un filtro:

Haga clic en
. Las modificaciones
realizadas en la configuracin volvern a los
valores predeterminados del filtro.

Para
eliminar un
filtro:

Haga clic en

para

Una vez que est seguro de que desea conservar el filtro, deber
confirmarlo en su pila de filtros.
Para confirmar un filtro:

Haga clic en Confirmar


para aceptar los cambios.
De este modo, el filtro se aadir a la pila de Filtros
ubicada ms a la derecha, en la cual se pueden aadir y
acumular filtros adicionales utilizando el mismo mtodo.
Los ajustes de aplican de manera que el filtro
aadido ms recientemente aparece siempre en la
parte inferior de la lista y se aplica a la ltima
imagen (despus de los dems filtros que estn por
encima de l).

346 Imgenes, animacin y multimedia


Para cambiar el orden de los filtros:

Arrastre el filtro y sultelo en cualquier posicin de la


pila. Una lnea de puntos indica la nueva posicin en la
que se ubicar la entrada cuando se suelte el ratn.

Retoque
PhotoLab ofrece algunas tiles herramientas de retoque en la barra
de herramientas principal, las cuales se suelen utilizar para corregir
las fotografas antes de aplicar la correccin de color y los efectos.

Enmascaramiento selectivo
En vez de aplicar un filtro para cambiar de manera uniforme el
aspecto de la imagen, se pueden cambiar slo las regiones
seleccionadas. PhotoLab permite enmascarar reas de imagen
pintando reas que se vern afectadas por los filtros o que
simplemente no se modificarn.

Imgenes, animacin y multimedia 347

Para aplicar una mscara:


1.

En el men desplegable Mscara


Nueva mscara.

2.

En el panel de Configuracin de la herramienta,

, seleccione

seleccione la herramienta Agregar regin


poder enmascarar regiones pintando.
3.

para

Ajuste la configuracin para adecuarse a sus necesidades,


sobre todo, ajustando el tamao del pincel para pintar las
regiones ms grandes o ms complejas.
Cambie el men desplegable Modo de Seleccionar a
Proteger con el fin de evitar que se enmascaren las
regiones pintadas (es decir, la opcin inversa a
Agregar regin).

4.

Pinte las regiones utilizando el cursor en pantalla (en


verde para aadir; y en rojo para proteger).
Si no ha sido tan preciso al pintar como le gustara,
puede hacer clic en Quitar regiones
y, a
continuacin, pintar por encima de las regiones pintadas
por error.

5.

Haga clic en Aceptar


enmascaramiento.

para guardar los cambios de

El botn de mscara cambia a amarillo cuando se aplica


la mscara (es decir,

).

348 Imgenes, animacin y multimedia


Para editar una mscara:

Haga clic en la flecha hacia abajo del botn


, elija
el nombre de la mscara y seleccione Editar mscara.

Cmo guardar favoritos


Si existe alguna configuracin de
filtro especfica (o combinacin de
filtros) que desee conservar para
utilizarla en un futuro, puede
guardarla fcilmente como favorito.
PhotoLab almacena todos sus
favoritos juntos en la pestaa
Favoritos. Incluso puede crear sus
propias categoras (p. ej. Mis ajustes)
dentro de la pestaa.

Para guardar filtro(s) como un favorito nuevo:

Haga clic en Guardar filtro

En el cuadro de dilogo, indique un nombre para el


favorito y elija una categora en la que guardar el filtro.
(Haga clic en

para crear una categora nueva.)

Si desea administrar con ms detalle sus favoritos en categoras


definidas por el usuario, haga clic en la opcin del Men de
pestaa

Imgenes, animacin y multimedia 349

Uso de Estudio de recorte de imgenes


Estudio de recorte de imgenes ofrece una potente solucin
integrada para cortar objetos y separarlos de su fondo. En funcin
de la composicin de las imgenes, puede separar el sujeto de
inters de su fondo, bien conservando el sujeto de inters
(normalmente gente, objetos, etc.) o quitando un fondo sencillo y
uniforme (como el cielo o un fondo de estudio). En ambos casos, la
imagen resultante "recortada" crea una imagen atractiva para su
sitio.

Para iniciar Estudio de recorte de imgenes:


1.

Seleccione la imagen que desea recortar.

2.

Seleccione Estudio de recorte de imgenes


en la
barra de herramientas de contexto Imagen que se
muestra. Se inicia Estudio de recorte de imgenes.

350 Imgenes, animacin y multimedia

Elija un resultado
Es esencial que elija un tipo de resultado antes de seleccionar las
reas que desea conservar o descartar. Antes de la seleccin, se
puede elegir como tipo de salida un mapa de bits con bordes alfa o,
bien, de vectores recortados. La decisin depende, en realidad, de
la imagen, particularmente del grado de definicin de los bordes de
la imagen.
Acerque la imagen para examinar los bordes porque eso
puede influir en el tipo de salida que elija.
Echemos un vistazo a los tipos de salida y veamos en qu se
diferencian.
Tipo de
salida

Descripcin y uso

Mapa de
bits con
borde alfa

Se usa cuando se recortan objetos


con bordes mal definidos. La
transparencia y la fusin de pxeles
se usan en el borde del contorno
para crear resultados profesionales
con interferencias insignificantes de
los colores del fondo. El trmino
"alfa" hace referencia al canal de
transparencia alfa de las imgenes
de 32 bits.

Mapa de
bits con
vectores
recortados

Se usa en bordes ms definidos. Se


crea una imagen recortada con
contorno de corte que despus se
podr manipular con las
herramientas de recorte. Tambin
puede aplicar el efecto de pluma al
borde de la imagen, pero no quitar
el color del fondo.

Imgenes, animacin y multimedia 351

Para crear un mapa de bits de bordes alfa:


1.

Seleccione Mapa de bits con borde alfa en el men


desplegable Tipo de salida.

2.

(Opcional) Arrastre el control deslizante Ancho para


establecer el grado de fusin "alfa" que se aplicar dentro
del borde de recorte.

3.

(Opcional) Ajuste el control deslizante Desenfoque para


suavizar el borde de recorte.

Para crear un mapa de bits de vector recortado:


1.

Seleccione Mapa de bits con vectores recortados del


men desplegable Tipo de salida.

2.

(Opcional) Arrastre el control deslizante Pluma para


aplicar un borde suave o borroso dentro del borde de
recorte.

3.

(Opcional) Arrastre el control deslizante Suavidad para


allanar el borde de recorte.

4.

(Opcional) El control deslizante Inflar acta como un


desplazamiento positivo o negativo respecto al borde de
recorte.

Tendr que hacer clic en Vista previa


para
comprobar los ajustes de configuracin de salida cada
vez.

Seleccin de las reas que se mantendrn o


descartarn
Las reas de la imagen se "pintan" con un par de pinceles para
conservar y descartar. Las herramientas se llaman Mantener la
herramienta Pincel y Descartar la herramienta Pincel y se
pueden utilizar independientemente o, por lo general, combinados.

352 Imgenes, animacin y multimedia


Cuando se usa una de estas herramientas, el pincel pinta un rea
interna del contorno que se considera que se mantendr o
descartar (segn el tipo de pincel). Se funde un nmero
configurable de pxeles adyacentes al rea de contorno.
Para contribuir a la operacin de seleccin, se ofrecen
varios modos de visualizacin disponibles para
mostrar la seleccin.
Los botones Mostrar original, Mostrar coloreado y
Mostrar transparente muestran respectivamente la
imagen con:

Color
de
fondo

solo las reas de seleccin

varios tonos coloreados que ayudan en las


operaciones de seleccin complejas

reas de transparencia en cuadros bicolores


marcadas para su eliminacin.

Para el modo Mostrar transparente, se puede


establecer un Color de fondo (en la parte inferior de
Studio) que pueda ayudar a diferenciar las reas que
se van a conservar, de las que se van a descartar.

Para seleccionar las reas de la imagen que se van a


conservar y descartar:
1.

En Estudio de recorte de imgenes, haga clic en


Mantener pincel
o Descartar pincel
la izquierda del rea de trabajo de Studio.

2.

(Opcional) Elija el Tamao de pincel adecuado para el


rea en el que se est trabajando.

Imgenes, animacin y multimedia 353

3.

(Opcional) Establezca un valor de Tolerancia de


crecimiento para ampliar automticamente el rea
seleccionada bajo el cursor (detectando colores similares
a los que hay dentro de la seleccin actual). Cuando
mayor sea el valor, ms aumentar el rea seleccionada.
Anule la seleccin de la opcin para desactivar la
funcin.

4.

Usando el cursor circular, haga clic y arrastre por todo el


rea que desee conservar o eliminar (dependiendo de si
ha seleccionado la herramienta Pincel Conservar o Pincel
Descartar). Se puede hacer clic repetidamente y arrastrar
hasta crear el rea de seleccin.
El botn Deshacer

vuelve a la ltima seleccin.

Para ajustar la seleccin, puede alternar los pinceles


Conservar y Descartar manteniendo pulsada
temporalmente la tecla Alt.
5.

Si est generando un mapa de bits con borde alfa, puede


perfeccionar el rea que desee conservar/eliminar dentro
de Estudio de recorte de la imagen (solo despus de
haber obtenido una vista previa). Las imgenes de
vectores recortados se pueden recortar usando las
herramientas de recorte estndar de WebPlus fuera de
Studio.

6.

Haga clic en Aceptar

para crear un recorte.

Adicin de animaciones
WebPlus le permite aadir varios tipos de efectos de animacin
llamativos a cualquier pgina web: marquesinas animadas,

354 Imgenes, animacin y multimedia


animaciones GIF (consulte la Ayuda de WebPlus Help) y
archivos Flash (SWF). Para cualquiera de los efectos de
animacin, puede obtener una vista previa de la animacin o
personalizar el efecto. Una vez colocadas en el sitio, las
animaciones aparecern estticas, pero cobrarn vida una vez
exportado el sitio y despus de que un visitante visualice la pgina
en un navegador web.

Recuadros animados
Los recuadros animados son una excelente manera de aadir
movimiento horizontal a un titular o eslogan.
Para crear una marquesina animada:

Haga clic en el botn Insertar marquesina animada


del elemento flotante Multimedia.

Para editar una marquesina animada ya definida:

Haga doble clic en el recuadro. El cuadro de dilogo


Insertar marquesina animada vuelve a aparecer, con los
ajustes actuales.

Archivos Flash
Un archivo Flash (*.swf) es una pelcula visible que utiliza el
formato de Flash Player. (Flash es un programa basado en
vectores diseado para crear y mostrar pequeos archivos en la
Web.) Los archivos Flash se pueden aadir a la pgina (como una
imagen) y se reproducirn en la vista de pgina sin necesidad de
obtener una vista previa en el navegador (o en la ventana de vista
previa de WebPlus). Puede cortarlos, copiarlos, moverlos y
cambiarles el tamao, al igual que con los dems grficos.
Para ver algunos archivos de Flash en accin, la Pestaa Galera
ofrece una gran coleccin de titulares Flash (cada uno con los
parmetros de Flash preasignados ya definidos) que puede adoptar

Imgenes, animacin y multimedia 355

fcilmente. Estos titulares estn diseados para que pueda


personalizar su aspecto (es decir, el texto, las imgenes y los
colores de esquema) sin necesidad de tener experiencia previa en
Flash.
Para insertar un archivo Flash:
1.

del
Haga clic en el botn Insertar archivo Flash
elemento flotante Multimedia de la barra de herramientas
Objetos web.

2.

Utilice el cuadro de dilogo para seleccionar el archivo


Flash que desea abrir (haga clic en Examinar... y
seleccione el archivo SWF). Haga clic en Opciones de
exportacin para definir de forma opcional un nombre o
ubicacin de archivo diferente. Para conservar la
animacin aparte del archivo de WebPlus (usando
vnculos al archivo de origen), desactive la opcin
Insertar archivo en el sitio.

3.

(Opcional) En la ventana Parmetros, haga clic en el


botn Aadir... (o Editar) para aadir (o editar) los
parmetros, como las parejas nombre/valor.

4.

(Opcional) En la ventana Archivos adicionales cree una


biblioteca de archivos (p. ej., imgenes) que se utilizarn
para componer la pelcula Flash. Considrela una
biblioteca local en la que los archivos auxiliares se
pueden obtener y se puede hacer referencia a ellos
fcilmente. Haga clic en el botn Aadir... para
desplazarse hasta los archivos seleccionados que desea
aadir (o utilice Ctrl+clic o Mays+clic para una
seleccin de archivos contiguos o no contiguos de
archivos, respectivamente).

5.

(Opcional) El cuadro Mostrar controla cmo se presenta


la pelcula Flash en la pgina de WebPlus. Experimente
con las opciones para ver diferentes opciones de bucles,
transparencia, alineacin, escala y calidad.

356 Imgenes, animacin y multimedia


6.

Haga clic en Aceptar.

7.

Ver el cursor Pegar imagen


. Haga clic para
insertar el archivo con un tamao predeterminado o
arrastre para establecer un rea de tamao personalizado.

Para editar un titular Flash:

Adicin de sonido y vdeo


WebPlus le permite mejorar sus pginas web con archivos de
sonido y vdeo en distintos formatos estndar, incluidos los
archivos multimedia que no son de transmisin y los que s son
de transmisin. Adems, WebPlus le permite incluir vdeos de
terceros alojados en www.youtube.com.

Sonido

Hay dos opciones de reproduccin de sonido: el sonido


de fondo, cuando un sonido se carga y se reproduce
automticamente cuando una pgina se abre por primera
vez en el navegador web del visitante, y el sonido
vinculado, que se activa con un clic del ratn (por
ejemplo, en un icono o en un objeto con hipervnculo).
Los formatos de audio compatibles son AIFF, AU, MIDI
(.mid, .midi), MP3, RealAudio (.ra, .ram) y WAV.

Vdeo

El vdeo vinculado funciona como el sonido vinculado.


Los formatos de vdeo compatibles son AVI, QuickTime
(.mov, .qt), MPEG (.mpg, .mpeg, .mpe, .mpv) y
RealVideo (.ram, .rv). (Los archivos que no sean de
transmisin deben descargarse en su totalidad en el
ordenador del usuario antes de que empiecen a
reproducirse; los archivos de transmisin requieren un
reproductor especial que almacene en bfer los datos

Imgenes, animacin y multimedia 357

entrantes y pueda empezar a reproducir antes de que el


clip se haya descargado por completo.)

Los vdeos de YouTube que ya estn publicados en


Internet se pueden incluir en el sitio web. Los propios
vdeos no se insertan en el sitio; sino que solo se inserta
el Id. nico del vdeo de YouTube en la pgina cuando se
coloca el vdeo de YouTube en ella (se crea un vnculo
de su pgina web a www.youtube.com). Esto le permite
aadir contenido multimedia a las pginas mientras evita
la carga de vdeos grandes como parte del sitio.

Tanto con el sonido de fondo como con el sonido vinculado (o


vdeo), tendr la opcin de incrustar el archivo de origen en el
sitio, en lugar de conservarlo aparte (recuerde que los vdeos de
YouTube no se pueden insertar en su sitio). Aunque al insertar un
archivo se aumenta el tamao del sitio, esta es la opcin
predeterminada, ya que no querr preocuparse ms de la separacin
de archivos o de la posibilidad de que uno de ellos se elimine por
error. Al publicar el sitio, WebPlus se encarga de exportar y copiar
tanto los archivos insertados como los no insertados.
Para aadir sonido de fondo a una pgina:
1.

Haga clic con el botn secundario en la pgina en el rea


de trabajo y elija Propiedades de la pgina...

358 Imgenes, animacin y multimedia


2.

En la pestaa Efectos, active la opcin Usar el archivo


de sonido; a continuacin, en el cuadro de dilogo Abrir,
desplcese hasta el archivo de sonido que desea aadir.
Cuando el archivo est seleccionado, haga clic en
Aceptar.

3.

Si no desea insertar el archivo, desactive la opcin


Insertar archivo de sonido en el sitio.

4.

Para que el sonido se reproduzca en bucle continuo,


seleccione Repetir sonido. De lo contrario, se
reproducir slo una vez.

5.

(Opcional) Establezca Opciones de exportacin... para


definir un nombre de archivo exportado y la ubicacin
fsica. (Consulte Configuracin de las opciones de
exportacin de imgenes en la pg. 333.)

6.

Haga clic en Aceptar.

El archivo de sonido se descargar y se reproducir cuando la


pgina web se muestre en un navegador.
La principal pregunta es cmo desea que el visitante pueda activar
la reproduccin de un determinado archivo multimedia. WebPlus
ofrece las mismas opciones bsicas para ambos tipos de archivos
multimedia:

Desde un objeto (o zona activa) con hipervnculo:


comience con un objeto existente en el sitio y, a partir de
l, cree un hipervnculo al archivo multimedia, o use
una zona activa sobre una imagen.

A partir de la vista previa de una miniatura de vdeo:


se hace clic en una miniatura de vdeo incrustada que
comienza la reproduccin de vdeo (solo vdeos de
YouTube).

Desde un icono: WebPlus proporciona un icono


previnculado al archivo multimedia. A continuacin,
coloque el icono en su pgina.

Imgenes, animacin y multimedia 359

Desde una imagen: seleccione un archivo de imagen


externo, que WebPlus importa y vincula despus al
archivo multimedia.

Alineado: El "reproductor" multimedia estar visible en


la pgina web publicada (en lugar de aparecer despus de
que el usuario haga clic en un vnculo, icono o imagen).
En WebPlus, ver el marcador en la pgina en la que
aparecer el reproductor.

Con las primeras dos opciones, el archivo multimedia sigue siendo


externo y no se puede insertar en el sitio. Las opciones de la 3 a la
5 le dan la oportunidad de insertar el archivo multimedia.
Para aadir sonido o vdeo vinculados a un objeto o una
zona activa:
1.

Seleccione el objeto o zona activa y seleccione


Hipervnculo
Herramientas.

de la barra de herramientas

2.

En el cuadro de dilogo, seleccione Archivo para crear


un hipervnculo a un archivo de sonido del disco duro.

3.

Haga clic en Examinar, busque el archivo multimedia,


seleccinelo y haga clic en Abrir.

4.

Si no desea insertar el archivo, desactive la opcin


Insertar archivo de vdeo en el sitio.

5.

(Opcional) Establezca Opciones de exportacin... para


definir un nombre de archivo exportado y la ubicacin
fsica. (Consulte Configuracin de las opciones de
exportacin de imgenes en la pg. 333.)

6.

Se pueden elegir varias ventanas o marcos de destino en


funcin de cmo desea que se muestre el destino del
vnculo. (Consulte Adicin de hipervnculos y
delimitadores en la pg. 105.)

360 Imgenes, animacin y multimedia


7.

Haga clic en Aceptar.

Para insertar un vdeo de YouTube:


1.

Abra el sitio web www.youtube.com en el navegador y


seleccione el vdeo de YouTube al que desea crear el
vnculo.

2.

Copie la direccin URL para el vdeo (o incruste el


cdigo). Este contiene un Id. alfanumrico, p. ej.
ySnp4YXU6JQ, que identifica el clip de vdeo de forma
nica.

3.

Haga clic en el botn Insertar vdeo de YouTube


en el elemento flotante Multimedia de la barra de
herramientas Objetos web.

4.

En el cuadro de dilogo, pegue la direccin URL del


vdeo en el cuadro de entrada.

5.

(Opcional) Active/desactive los cuadros para


activar/desactivar lo siguiente;

Reproduccin automtica
Reproduce automticamente el vdeo cuando la
pgina se ha cargado.

Bucle
Reproduce el vdeo continuamente.

Mostrar informacin del vdeo


Muestra el ttulo y la clasificacin de estrellas del
vdeo.

Permitir modo de pantalla completa


Aade un botn a la ventana del vdeo para que el
usuario pueda optar por ver el vdeo en modo de
pantalla completa.

Imgenes, animacin y multimedia 361

Incluir vdeos relacionados


(Si la opcin Bucle est activada, la funcin Incluir
vdeos relacionados se desactiva automticamente.
Si desea activar esta funcin, necesitar desactivar
la casilla de verificacin Bucle.) Al final del vdeo,
se muestran los vdeos recomendados que estn
relacionados con el contenido del vdeo que
actualmente se reproduce en su pgina. Tambin se
muestra una barra de bsqueda para que los usuarios
puedan buscar y reproducir otros vdeos de
YouTube en el sitio.

Reproducir en HD
Reproduce el vdeo en alta definicin, si el vdeo se
ha creado para la reproduccin en alta definicin.

Mostrar borde
Aade un borde alrededor de la ventana de vdeo.
Haga clic en los dos botones para acceder a las
paletas desplegables y seleccionar hasta dos colores.

6.

Haga clic en Aceptar. Site el cursor Pegar


donde desee que se site la esquina superior izquierda
del vdeo.

7.

Para insertar el vdeo con el tamao predeterminado,


simplemente haga clic con el ratn.
O bien:
Para definir el tamao del vdeo insertado, arrastre el
cursor y suelte el botn del ratn. Se puede cambiar el
tamao del vdeo sin restricciones, pero puede mantener
la relacin de aspecto del vdeo pulsando la tecla Mays
a medida que arrastra.

Algunos sitios web pueden requerir que los vdeos de YouTube se


intercambien por otros de forma ocasional o regular. Por ejemplo,
el sitio puede alojar los 10 vdeos ms populares o vdeos sobre
temas que cambian continuamente. En cualquier caso, WebPlus
puede reemplazar los vdeos sin que afecte a su posicin.

362 Imgenes, animacin y multimedia


Para cambiar el vdeo de YouTube por otro, haga doble clic en un
vdeo de YouTube existente. En el cuadro de dilogo, pegue una
URL de vdeo previamente copiada en el cuadro de entrada.
Para crear un vnculo desde un icono, imagen o
reproductor en lnea:
1.

Haga clic en el botn Insertar clip de sonido

en el elemento flotante
Insertar clip de vdeo
Multimedia de la barra de herramientas Objetos web.
2.

Desplcese para buscar el nombre de archivo


multimedia.

3.

Si no desea insertar el archivo, desactive la opcin


Insertar archivo de vdeo en el sitio.

4.

Seleccione una opcin de visualizacin de vnculos


(icono, en lnea o imagen).

5.

Haga clic en Aceptar para cerrar el cuadro de dilogo y,


a continuacin, haga clic (o haga clic y arrastre) con el
cursor para colocar el icono, la imagen o el marcador en
la pgina.

Uso de la galera fotogrfica


La propagacin simultnea del uso de cmaras digitales y de
servicios de banda ancha ha creado una oportunidad fantstica para
publicar colecciones de fotos en pginas web. Hay multitud de
razones para hacerlo, pero las ms comunes incluyen:

Alojar fotografas familiares para que quienes se


encuentren a distancia las puedan ver.

Ocasiones especiales (fiestas, Navidad, reuniones,


vacaciones).

Imgenes, animacin y multimedia 363

Colecciones catalogadas (p. ej., de animales, de sellos,


etc.).

En WebPlus puede aadir una galera fotogrfica basada en


Flash, o en JavaScript, a cualquier pgina web. Al hacer uso del
potencial de Flash tambin puede adoptar algunos estilos de
galeras llamativos, que proporcionan distintas formas de
desplazarse por las fotos. Las galeras fotogrficas le permiten
desplazarse mediante una barra de control superior o inferior,
dependiendo del estilo de la galera, usando:

elementos
dinmicos de
miniaturas
(opuestos)

miniaturas
verticales

cuadrculas
de fotos

pilas de fotos

cajas de luz

Las fotografas se pueden importar por archivo o carpeta o desde


un dispositivo TWAIN (cmara digital/escner). De forma
predeterminada, las fotos grandes importadas en la galera se
redimensionan automticamente y se exportan en la resolucin
mxima de 720 x 540 pxeles. Si las fotos son ms pequeas que
720 x 540 pxeles, permanecern sin cambios.
Durante la importacin, tendr la opcin de gestionar varias fotos
seleccionadas a la vez.

Reordene las fotos en el orden de visualizacin que


prefiera.

364 Imgenes, animacin y multimedia

Realice una edicin a granel. Podr aadir pies de


imagen, girar* y ajustar el brillo y el contraste.

Asigne etiquetas Exif y cree pies de imagen


personalizados.

Crear y gestione lbumes de fotos.

*Es posible girar automticamente las fotografas de cmaras


digitales, de forma horizontal a vertical (si la cmara lo admite).

Creacin de la galera
La galera fotogrfica se insertar en la pgina, como una
fotografa individual, despus de obtener sus fotos del archivo, la
carpeta, la cmara o el escner.
Todas las fotos aparecen como archivos JPG,
independientemente del tipo de foto original y de la
configuracin en Archivo>Propiedades del
sitio>Grficos.
Para insertar una galera fotogrfica:
1.

Haga clic en el botn Insertar galera fotogrfica


en el elemento flotante Imagen de la barra de
herramientas Objetos estndar.

2.

(Opcional) Haga clic en Avanzado para cambiar la


configuracin predeterminada de tamao y calidad de las
fotos. El tamao predeterminado de fotos es la resolucin
mxima en la que se exportan las imgenes.

3.

Seleccione el tipo de galera fotogrfica que desea usar:

Galera fotogrfica profesional de Flash


(los visitantes al sitio requerirn Flash 9 y superior.)

Imgenes, animacin y multimedia 365

4.

Galera fotogrfica de Flash


(los visitantes al sitio requerirn Flash 8 y superior.)

Galera fotogrfica de JavaScript Photo Gallery

Haga clic en Siguiente. En el cuadro de dilogo, elija si:

Agregar archivos individuales


Haga clic en el botn Aadir archivos para
desplazarse y seleccionar los archivos de fotos que
desea abrir. Pulse Ctrl y haga clic o Mays y haga
clic para seleccionar varios sitios o varios archivos
contiguos o distantes entre s. Utilice la ventana de
Vista previa para buscar fotografas a medida que
las aada a su seleccin actual.
O bien:

Aadir todas las fotos de una carpeta


Haga clic en el botn Aadir carpeta para
desplazarse a una carpeta y seleccionarla para
aadir el contenido.
O bien:

Aadir de una cmara digital o escner


Haga clic en el botn Aadir TWAIN. Si es
necesario, seleccione el origen TWAIN antes del
proceso de adquisicin mediante Seleccionar
origen... en el men desplegable. Tambin puede
especificar una carpeta en la que guardar
fotografas, despus de haberlas adquirido mediante
Establecer carpeta de exportacin... del men
desplegable. Haga clic en Adquirir... para obtener
las fotos.

Para eliminar una o todas las miniaturas, seleccione


y haga clic en el botn Eliminar.

366 Imgenes, animacin y multimedia


Las fotografas se muestran como miniaturas en el cuadro de
dilogo Galera fotogrfica.
5.

(Opcional) Seleccione una o varias miniaturas de la


galera para manipularlas.

Para ajustar el orden de las fotos, use los botones


Arriba
y Abajo
cuadro de dilogo.
O bien:

de la parte inferior del

Haga clic en Mover a posicin


un nmero de posicin.

e introduzca

Para rotar en intervalos de 90 en el sentido de las


.
agujas del reloj, haga clic en el botn Rotar
O bien:
Haga clic en la columna Rotar a la derecha y
seleccione un incremento de rotacin de la lista
desplegable.

Para aadir un pie de imagen, haga clic en la


columna Leyenda y escriba texto, nmeros y
caracteres.

Para crear pies de imagen de etiquetas Exif, IPTC y


XMP, haga clic en Cabeceras de formato
.
Seleccione un tipo de etiqueta de la lista desplegable
y despus haga clic en Agregar etiqueta. Una vista
previa se mostrar en el cuadro Vista previa de
cabeceras. Seleccione dnde aadir los pies de
imagen: Aadir al principio de la cabecera,
Aadir al final de la cabecera o Sobrescribir
cabecera. Haga clic en Aceptar.

Para encontrar y reemplazar pies de imagen, haga


. (Consulte el tema
clic en Encontrar cabecera
Uso de buscar y reemplazar en la p. 255.)

Imgenes, animacin y multimedia 367

Para ajustar el Brillo y el Contraste, haga clic en


las columnas respectivas e introduzca valores entre
0 y 100.

Para sustituir una fotogrfica, haga clic con el botn


secundario del ratn en la foto seleccionada y haga
clic en Sustituir imagen.

(Solamente Galera fotogrfica profesional de


Flash) Para organizar las fotografas en lbumes,
haga clic en Editar lbumes
. Seleccione la
casilla Activar lbumes en galera y seleccione el
nmero de lbumes que desea usar, hasta un
mximo de 24. D a sus lbumes un Ttulo,
Descripcin y asigne opcionalmente Msica de
fondo para reproducir mientras el lbum se ejecuta
en la galera. Haga clic en Aceptar.

(Solamente Galera fotogrfica profesional de


Flash) Para aadir hipervnculos a las fotos, haga
clic en Editar hipervnculo
. En el cuadro de
dilogo, seleccione un Tipo de hipervnculo; puede
no establecer ninguno hipervnculo, establecer un
hipervnculo a la imagen original o un hipervnculo
a otro destino de vnculo (p. ej., pgina del sitio o
pgina de Internet). Para la ltima opcin tiene que
hacer doble clic en el texto Sin vnculo para elegir el
destino del vnculo.

6.

Para incluir las fotos seleccionadas dentro del sitio,


active la opcin Insertar imgenes. De forma
predeterminada, las fotografas se conservan aparte del
archivo de WebPlus (usando un vnculo al archivo de
origen).

7.

Haga clic en Siguiente.

8.

Seleccione un estilo de galera del panel Estilo de


galera de la parte superior del cuadro de dilogo. Cada
tipo ofrece un estilo diferente para desplazarse por las

368 Imgenes, animacin y multimedia


fotos. Pruebe cada uno de ellos hasta que encuentre uno
que le guste en la ventana Vista previa. Observar una
barra de control en cada estilo que permite que el usuario
se desplace por las fotos despus de la publicacin.
9.

(Opcional) Para el estilo seleccionado, use el panel a la


derecha para editar varias opciones de la galera (como la
msica de color de fondo, el color de fuente, la
reproduccin automtica, etc.). Algunas opciones son
especficas de un estilo de galera, como
habilitar/desactivar los elementos dinmicos de
miniaturas, el nmero de miniaturas mostradas, las
fotografas por pila, el destino de hipervnculo, etc. La
opcin de desenfocar controla la cantidad de desenfoque
entre fotos. La reproduccin automtica iniciar
automticamente la visualizacin de fotos en un intervalo
de tiempo definido, pero configurable, (en segundos). De
lo contrario, la barra de control que se muestra en la
galera fotogrfica despus de la publicacin puede
iniciar la reproduccin de fotos.

10. Haga clic en Finalizar.

11.

Para insertar la galera con un tamao


predeterminado, coloque el cursor mostrado en la parte
de la pgina donde desea que aparezca la galera y, a
continuacin, simplemente haga clic.
O bien:
Para definir el tamao de la galera insertada, arrastre una
regin y suelte el botn del ratn.

Edicin de la galera fotogrfica


Una vez agregada a la pgina web, la galera fotogrfica se puede
modificar. Las fotografas se pueden aadir, eliminar, rotar,
subtitular o ajustar utilizando la configuracin de brillo y contraste.
Tambin puede cambiar el estilo de la galera existente por otro,
cambiar los hipervnculo de fotos, la msica de fondo, el color de

Imgenes, animacin y multimedia 369

texto del pie de imagen y establecer que la galera se reproduzca


automticamente (las fotografas se pasarn automticamente).
Si tiene varias galeras en el sitio, puede gestionar los
hipervnculos previamente definidos en la opcin de
hipervnculo en el Administrador de sitios. Elija Imagen
de galera en el men desplegable Tipo.
Para editar una galera fotogrfica:
1.

Seleccione una galera ya presente en el sitio web.

2.

Haga doble clic en la galera.


Se mostrar el cuadro de dilogo Galera fotogrfica. Las
opciones disponibles son las mismas que las que estaban
disponibles cuando se cre la galera.

3.

Para editar un atributo en todas las fotos


simultneamente, seleccione todas las fotos usando la
casilla de verificacin de la parte superior de la columna
de la imagen y, despus, realice los cambios con las
opciones en la parte inferior de la lista de fotos.

Despus de colocar una galera, en la pgina se puede arrastrar una


esquina del objeto de la galera para cambiar el tamao. Utilice la
tecla Ctrl mientras arrastra para mantener la relacin de aspecto.

Vinculacin de imgenes remotas


Se puede conectar con cualquier imagen disponible actualmente en
Internet. No obstante, para evitar la violacin de derechos de autor
es aconsejable utilizar imgenes de un servicio de hospedaje fiable
de imgenes. Por supuesto, puede vincular de forma activa a otras
imgenes (de un sitio de amigo o de colega) donde las
repercusiones legales no supongan un problema, sino que
simplemente por educacin se pida permiso.

370 Imgenes, animacin y multimedia


Para insertar una imagen remota:
1.

Vaya a Insertar>Imagen>Vnculo remoto....

2.

En el cuadro de dilogo, introduzca la URL absoluta para


la imagen.

3.

Haga clic en Aceptar.

4.

Ver el puntero del ratn cambiar al cursor Pegar


imagen
. Las acciones que realice a continuacin
determinarn el tamao y la colocacin iniciales de la
imagen.

5.

Para insertar la imagen con el tamao predeterminado,


simplemente haga clic con el ratn.
O bien:
Para definir el tamao de la imagen insertada, arrastre
una regin y suelte el botn del ratn.

13

Lneas, formas y
efectos

372 Lneas, formas y efectos

Lneas, formas y efectos 373

Dibujo y edicin de lneas


WebPlus contiene las herramientas Lpiz, Lnea recta y Pluma
para dibujar a mano alzada, lneas rectas y lneas curvas,
respectivamente.
La Herramienta de lpiz
le
permite esbozar lneas curvas y formas
a mano alzada.

La Herramienta de lnea recta


est para dibujar lneas rectas, reglas en
la parte superior y/o inferior de la
pgina o lneas horizontales para
separar secciones o para destacar
ttulos.

La Herramienta Pluma
permite
unir una serie de segmentos de lnea
(que pueden ser curvos o rectos)
usando clics de ratn para "conectar
puntos".

374 Lneas, formas y efectos


Todas las lneas curvas se pueden cerrar (uniendo
los extremos) para crear una forma personalizada
(consulte Dibujo y edicin de formas en la
pg. 380 para obtener ms detalles).

Dibujo de lneas
Para dibujar una lnea a mano alzada (con la
Herramienta de lpiz):
1.

Haga clic en la Herramienta Pluma


del elemento
flotante Lnea de la barra de herramientas de Objetos
estndar.

2.

Haga clic donde desee que comience la lnea y mantenga


pulsado el botn del ratn mientras dibuja. La lnea
aparecer inmediatamente y seguir los movimientos del
ratn.

3.

Al llegar al final de la lnea, suelte el botn del ratn. La


lnea se suavizar automticamente utilizando un nmero
mnimo de nodos.

4.

Para extender la lnea, coloque el cursor sobre uno de sus


nodos rojos de los extremos. El cursor cambia para
incluir el smbolo ms. Haga clic sobre el nodo y
arrstrelo para aadir un nuevo segmento de lnea.

Para dibujar una lnea recta (con de la Herramienta de


lnea recta):
1.

Haga clic en la Herramienta de lnea recta


del
elemento flotante Lnea de la barra de herramientas de
Objetos estndar.

2.

Haga clic en la pgina en la que desea que empiece la


lnea y arrstrela al punto final. La lnea aparecer
inmediatamente.

Lneas, formas y efectos 375

Para limitar el ngulo de la lnea recta a incrementos


de 15 grados, mantenga pulsada la tecla Mays
mientras arrastra. (Se trata de una forma sencilla de
crear lneas verticales u horizontales exactas).
3.

Para extender la lnea, coloque el cursor sobre uno de sus


nodos rojos de los extremos. El cursor cambia para
incluir el smbolo ms. Haga clic sobre el nodo y
arrstrelo para aadir un nuevo segmento de lnea.

Para dibujar uno o ms segmentos de lnea (con la


Herramienta Pluma):
1.

del elemento
Haga clic en la Herramienta Pluma
flotante Lnea de la barra de herramientas de Objetos
estndar. En la barra de herramientas de contexto Curva,
hay tres botones que permiten seleccionar qu tipo de
segmento dibujar:

Un segmento recto
es
simplemente una lnea recta que
conecta dos nodos.
(Acceso directo: Pulse 1)
Un segmento Bzier es
curvado, y muestra manejadores
de control para un ajuste ms
preciso.
(Acceso directo: Pulse 2)

376 Lneas, formas y efectos

Los segmentos
inteligentes aparecen sin
controladores visibles y utilizan
el ajuste automtico de curvas
para conectar cada nodo. Son
especialmente tiles para
realizar trazos alrededor de
objetos e imgenes curvos.
(Acceso directo: Pulse 3)
2.

Seleccione un tipo de segmento y luego haga clic en el


lugar en el que desea que comience la lnea.

Para un segmento recto, haga clic de nuevo (o


arrastre) para crear un nodo nuevo en el lugar en el
que desea que acabe el segmento. Haga clic en
Mays para alinear el segmento en intervalos de
15 grados (es til para uniones rpidas en ngulo
recto).

Para un segmento Bzier, haga clic de nuevo para


crear un nodo nuevo y arrastre un controlador
desde l. Los controladores funcionan como
imanes para dar forma a la curva. La distancias
entre los controladores determina la profundidad
del nuevo segmento de lnea curva resultante.
Haga clic de nuevo donde desea que termine el
segmento y aparecer un segmento curvo. El
segmento acabado se puede seleccionar.

Para un segmento inteligente, haga clic de nuevo


para crear un nuevo nodo. El segmento aparecer
como una curva suavizada y bien ajustada (sin
controladores visibles) entre el nuevo nodo y el
nodo anterior. Antes de soltar el botn del ratn,
puede arrastrarlo para flexionar la lnea como si
se tratara de un trozo de alambre. Si el nodo de

Lneas, formas y efectos 377

esquina anterior de la lnea es tambin inteligente,


la flexibilidad tambin se extiende al segmento
anterior. Puede hacer clic y luego pulsar Mays
para crear un nuevo nodo que se alinee a
intervalos de 15 grados con el nodo anterior.
3.

Para extender una lnea existente, repita el paso 2 para


cada nuevo segmento. Cada segmento puede ser de un
tipo diferente.

4.

Para finalizar la lnea, pulse la tecla Esc, haga doble clic


o seleccione otra herramienta.

Edicin de lneas
Utilice la Herramienta Puntero conjuntamente con la barra de
herramientas de contexto Curva para ajustar las lneas despus de
dibujarlas. Las tcnicas son las mismas para editar un objeto de
lnea diferente o el contorno de una forma cerrada.
Cuando se selecciona, cada tipo de lnea posee unos nodos
cuadrados que se pueden utilizar para cambiar la forma de las
lneas.
Consulte la Ayuda de WebPlus para obtener informacin sobre la
edicin de lneas.

Configuracin de las propiedades de


lnea
Todas las lneas, incluidas las que contienen formas, poseen
numerosas propiedades, como el color, grosor, escala, extremo
(final), unin (esquina) y alineacin del trazo. Estas propiedades se
pueden variar en cualquier lnea a mano alzada, recta o curva, del
mismo modo que el contorno de una forma. Los marcos de texto,
las imgenes, las tablas y los objetos de texto artstico tambin
tienen propiedades de lnea.

378 Lneas, formas y efectos


En WebPlus, puede controlar la posicin del trazo (es decir, el
grosor de la lnea) en relacin con el trazado del objeto, es decir, la
lnea que define los lmites del objeto.
Para cambiar las propiedades de lnea de un objeto
seleccionado:

Use la pestaa Muestrarios para cambiar el color


y/o la sombra de la lnea. Otra opcin es utilizar la
pestaa Color para aplicar un color al objeto
seleccionado de un mezclador de color.
La lnea y el relleno del objeto pueden tomar un color
slido o de degradado, as como mapas de bits y
efectos de transparencia.

Use la pestaa Lnea, barra de herramientas de contexto


(que se muestra cuando la lnea est seleccionada) o el
cuadro de dilogo Lnea y borde para cambiar el grosor,
el tipo y otras propiedades de la lnea. Seleccione un
grosor de lnea y utilice los cuadros desplegables para
elegir el tipo de lnea.

En la pestaa Lnea, la barra de herramientas de contexto o el


cuadro de dilogo Lnea y borde, el men desplegable de estilos
proporciona los siguientes estilos: Ninguno, Sencillo, Caligrfico
y varios estilos de lnea con Guiones y Dobles, como puede ver a
continuacin.

Existen varios mtodos ms para personalizar las lneas:

Lneas, formas y efectos 379

Para lneas de puntos/guiones, seleccione uno


de los cinco estilos de lneas (vase ms arriba).
O bien:
(solo pestaa y cuadro de dilogo) Arrastre el
control deslizante Patrn de guiones para
establecer la longitud total del patrn (el
nmero de casillas a la izquierda del control
deslizante) y la longitud del guin (el nmero
de esas casillas que son negras).
Los siguientes dibujos muestran lneas con
longitudes de guiones de (1) 4 y 2, y (2) 5 y 4:

Para obtener lneas dobles, seleccione uno de


los cuatro estilos de lnea Dobles (vase ms
arriba).
(Solo pestaa) Para lneas caligrficas de grosor
variable (dibujadas como con una pluma de
punta cuadrada con un ngulo concreto),
seleccione el estilo de lnea caligrfica (al lado)
en el men desplegable, a continuacin use el
cuadro ngulo caligrfico para definir el
ngulo que forma la punta de la pluma, como se
muestra en los ejemplos a continuacin.

380 Lneas, formas y efectos


Tambin puede variar el Extremo y la Unin (esquina) donde se
cruzan las dos lneas.
El cuadro de dilogo Lnea y borde proporciona todas las
propiedades de lnea incluidas las opciones de la seleccin de
bordes, el sombreado/tono, escala final de la lnea, ms bordes
decorativos basados en fotos para las fotos que enmarcan.
Para acceder a todas las propiedades de la lnea:

Haga clic en el botn


Lnea/Borde en el elemento
flotante de relleno de la barra de herramientas
Herramientas.
En el cuadro de dilogo, la pestaa Lnea permite ajustar
todas las propiedades de lnea (detalladas arriba)
mientras que la pestaa Borde proporciona los bordes
basados en fotos.

Dibujo y edicin de formas


Las formas QuickShapes son objetos prediseados de formas muy
diversas que se pueden aadir de forma instantnea a la pgina.

Lneas, formas y efectos 381

Una vez que haya dibujado una forma de QuickShape, puede


recuperar su forma original mediante controladores, adems de
ajustar sus propiedades, como por ejemplo, aplicando colores
slidos/gradientes, mapas de bits (incluidas sus propias imgenes
de mapa de bits) y efectos de transparencias al contorno y
relleno de ambos objetos.
Otro mtodo para crear una forma consiste en dibujar una lnea (o
una serie de segmentos de lneas) y luego conectar sus nodos
iniciales y finales para crear una forma cerrada.

QuickShapes
El elemento flotante QuickShape
de la barra de herramientas
Objetos estndar contiene una
amplia variedad de formas de uso
general, incluidos marcos, valos,
flechas, polgonos, estrellas, cubos
y cilindros.

Una vez agregada a la pgina, tambin puede usar la barra de


herramientas de contexto de QuickShape situada sobre el rea de
trabajo para ajustar el grosor de la lnea de QuickShape, el color,
estilo, etc.
Para crear una forma de QuickShape:
1.

Haga clic en el elemento flotante QuickShape


de
la barra de herramientas Objetos estndar y seleccione
una forma.

2.

Haga clic en la pgina para crear una forma nueva de un


tamao predeterminado.
O bien:

382 Lneas, formas y efectos


Arrastre a lo largo de la pgina para ajustar el tamao de
la forma. Cuando la forma sea del tamao adecuado,
suelte el botn del ratn.
Para dibujar una forma restringida (como un crculo):

Mantenga pulsada la tecla Mays a medida que arrastra


el ratn.

Todas las formas de QuickShapes se pueden colocar,


redimensionar, girar y rellenar. Y, lo que es ms, puede
cambiarlas utilizando controladores de deslizamiento ajustables
alrededor de la forma de QuickShape. Cada forma cambia de un
modo lgico para poder modificar su aspecto exacto.
Para ajustar el aspecto de una forma de QuickShape:
1.

Haga clic en la forma de QuickShape para que aparezcan


uno o ms controladores de desplazamiento alrededor de
la forma. No son los mismos que los controladores de
seleccin internos. Cada forma de QuickShape tiene
controladores diferentes que tienen funciones distintas.

2.

Para cambiar el aspecto de una forma de QuickShape,


arrastre sus controladores.

Lneas, formas y efectos 383

Formas cerradas
En cuanto dibuje o seleccione una lnea, ver aparecer sus nodos.
Los nodos indican los puntos finales de cada segmento de la lnea.
Las curvas a mano alzada suelen tener muchos nodos; los
segmentos de lneas rectas o curvas slo tienen dos. Puede crear
una forma dibujando una lnea hasta su punto de inicio.

Para convertir una lnea seleccionada en una forma:

Seleccione la lnea con la Herramienta Puntero y haga


clic en el botn Cerrar curva
herramientas de contexto Curva.

en la barra de

Tambin se puede hacer lo contrario, es decir, abrir una forma para


aadirle uno o ms segmentos de lnea.
Para abrir una lnea o una forma:
1.

Con la Herramienta Puntero, seleccione el nodo donde


desea romper la forma.

2.

Haga clic en el botn


Romper curva de la barra de
herramientas de contexto Curva. La lnea se dividir en
dos lneas. La forma se convertir en una lnea, con el
nodo seleccionado dividido en dos nodos, uno a cada
extremo de la nueva lnea.

384 Lneas, formas y efectos


3.

Ahora puede usar la Herramienta Puntero para cambiar la


forma de la lnea como sea preciso.

Edicin de formas

Utilice el control deslizante del grosor de la pestaa


Lnea para cambiar el grosor o el tipo de borde de la
forma. Para cambiar el estilo de lnea (punteado, de
guiones, etc.), haga clic en la lista desplegable del medio
para aplicarlo.

Utilice la pestaa Color o la pestaa Muestrarios para


cambiar el color de la lnea o del relleno de la forma
(slidos, gradiente o mapa de bits). Para obtener ms
informacin, consulte Aplicacin de colores slidos o
Trabajo con gradiente o mapa de bits.

Utilice la pestaa de Transparencia para aplicar un


efecto de gradiente o de transparencia de mapa de bits.
Para obtener ms informacin, consulte Trabajo con
transparencias.

Uso de efectos de filtro 2D


WebPlus ofrece una variedad de efectos de filtro que se pueden
usar para transformar cualquier objeto. Los efectos de filtro "3D"
permiten crear la impresin de una superficie texturada y se
describen en otra seccin (vase la pg. 389). En sta, nos
centraremos exclusivamente en los efectos de filtro 2D. Los
ejemplos siguientes muestran cada efecto de filtro 2D aplicado a la
letra "A".

Lneas, formas y efectos 385

Sombra
paralela

Sombra
interior

Resplandor
externo

Resplandor
interior

Bisel interno

Bisel externo

Relieve

Relieve de
almohada

Desenfoque
gaussiano

Desenfoque de
zoom

Desenfoque
radial

Desenfoque de
movimiento

Relleno de
color

Pluma

Contorno

Reflejo

386 Lneas, formas y efectos


La pestaa Estilos de
Studio ofrece una
variedad de efectos de
filtro 2D listos para usar.
Cada una de las
diferentes categoras
ofrece una galera
repleta de efectos
predefinidos, como
sombras, biseles,
reflejos, desenfoques,
etc. Cada categora
ofrece sutiles
variaciones del efecto.
Haga clic en cualquier
miniatura para aplicar el
efecto al objeto
seleccionado.

Para el control absoluto sobre los efectos de filtro 2D, puede usar
Efectos de filtro.
Para aplicar los efectos de filtro 2D:
1.

Seleccione un objeto y haga clic en el botn Efectos de


del elemento flotante Efectos de la barra de
filtro
herramientas Herramientas.

2.

Para aplicar un efecto especfico, marque la casilla


correspondiente en la lista de la izquierda.

3.

Para ajustar las propiedades de un efecto especfico,


seleccione el nombre y vare los controles del cuadro de
dilogo. Ajuste los controles deslizantes para escribir
valores especficos y variar as el efecto combinado.
(Tambin puede seleccionar un control deslizante y

Lneas, formas y efectos 387

utilizar las flechas del teclado.) Las opciones varan


segn el efecto.
4.

Haga clic en Aceptar para aplicar el efecto al objeto


seleccionado o Cancelar para salir sin guardar los
cambios.

Creacin de reflejos
Una forma sencilla de aadir un destello creativo a su pgina es
aplicar un reflejo vertical a un objeto seleccionado. El efecto
resulta especialmente llamativo si se aplica a imgenes, pero
tambin resulta estupendo en texto artstico, como ttulos de pgina
o titulares. Una combinacin de opciones de configuracin puede
controlar el alto, la opacidad, el desplazamiento y el desenfoque
del reflejo.

Creacin de contornos
WebPlus permite crear un contorno coloreado alrededor de objetos,
especialmente texto y formas (como un efecto de filtro). Para
cualquier contorno, puede establecer el ancho del contorno, el
relleno de color, la transparencia y el modo de fusin. El contorno
tambin puede adoptar un relleno de gradiente, un relleno de
permetro nico (el relleno se extiende del borde interno al
externo de un ancho del contorno) o un relleno de patrn y tambin
puede situarse dentro, fuera o estar centrado en el borde del objeto.

388 Lneas, formas y efectos


Como con todos los efectos, puede activar y desactivar el efecto de
contorno. Podr aplicar una combinacin de efectos de filtro 2D o
3D junto con el contorno, marcando otras opciones en el cuadro de
dilogo Efectos de filtro.

Uso de la herramienta Sombra


Las sombras son magnficas para aadir estilo y dimensin a un
trabajo, particularmente a las imgenes, los objetos de texto y las
formas. Para ayudarle a crearlas rpida y fcilmente, WebPlus
ofrece la Herramienta Sombra en el elemento flotante Efectos de
la barra de herramientas Herramienta. La herramienta ofrece
control libre del efecto de sombra con lo que se pueden crear
sombras bsicas o basadas en bordes sesgadas para cualquier
objeto de WebPlus.

Sombras bsicas (izquierda) y sesgadas (derecha) aplicadas a


una forma cuadrada QuickShape.
El color, opacidad, desenfoque y escala/distancia de una sombra se
puede ajustar utilizando nodos controlables directamente en la
pgina (o mediante una barra de herramientas de contexto Sombra
de apoyo). Los nodos se pueden arrastrar hacia adentro o hacia
afuera desde el origen de la sombra para modificar el desenfoque y
la opacidad de la sombra. Para un color distinto, seleccione el nodo
Color y, a continuacin, elija un nuevo color de la pestaa Color o
Muestrarios. Dependiendo de si se requiere una sombra bsica o
sesgada, el origen puede existir en el centro (en la imagen
siguiente) o en el borde un objeto, respectivamente.

Lneas, formas y efectos 389

(A) Desenfoque, (B) Origen de la sombra, (C) Opacidad, (D)


Color, (E) Escala
Cuando haya creado una sombra, tambin puede ajustarla a sus
necesidades usando el cuadro de dilogo Efectos de filtro.

Uso de efectos de filtro 3D


Los efectos de filtro 3D van un punto ms all que los efectos de
filtro 2D (como las sombras, los brillos, los biselados y los
relieves) para crear la impresin de una superficie texturada en el
objeto. Puede usar el cuadro de dilogo Efectos de filtro para
aplicar uno o ms efectos al mismo objeto. Recuerde que ninguno
de estos efectos 3D "har" nada en un objeto sin relleno. La
diferencia solo se aprecia en los objetos con relleno.

La pestaa Estilos de Estudio es un buen lugar para comenzar a


experimentar con los efectos 3D Cada una de sus numerosas
categoras ofrece una galera repleta de efectos 2D y 3D
predefinidos y combinados, que usan diferentes configuraciones.

390 Lneas, formas y efectos


All encontrar una
variedad de opciones
predefinidas de superficies
y texturas 3D en diferentes
categoras (Valores
preestablecidos Predeterminado, Valores
preestablecidos - Diversin,
Valores preestablecidos Materiales y Textura). La
categora Valores
preestablecidos Materiales proporciona
efectos realistas como
Vidrio, Metlico, Madera,
etc. Haga clic en cualquier
miniatura para aplicarlo al
objeto seleccionado. Si el
objeto tiene color para
comenzar, ver los
resultados al instante.
Otra opcin es personalizar una opcin preestablecida de la
pestaa Estilos o aplicar uno o ms efectos especficos desde cero,
usando Efectos de filtro.
Para aplicar los efectos de filtro 3D:
1.

Haga clic en Efectos de filtro


en el elemento
flotante Efectos de la barra de herramientas
Herramientas.

2.

Marque la casilla Efectos 3D de la izquierda. La casilla


Iluminacin 3D est seleccionada de manera
predeterminada.

Lneas, formas y efectos 391

3.

Ajuste el control deslizante del "control maestro" aqu


para variar las propiedades generales de cualquier efecto
3D que seleccione.

Desenfoque especifica la cantidad de suavizado que


se aplica. Cuanto ms grande sea el tamao del rea
desenfocada, mayor ser la sensacin de espacio y
ms graduales sern los cambios en altura.

Profundidad especifica el grado de los cambios en


la profundidad.

El botn
suele estar pulsado, lo que vincula los
dos controles deslizantes para suavizar los cambios
marcados en Profundidad con el parmetro
Desenfoque. Para ajustar los controles deslizantes
independientemente, haga clic en el botn para
sacarlo.

4. (Opcional) Si lo necesita, expanda el panel de vista previa


haciendo clic en el botn Mostrar/Ocultar vista previa
. Cuando se expande, los efectos se aplican nicamente
en la ventana de vista previa. Cuando el panel est contrado
(vuelva a hacer clic en el botn), los efectos de filtro se
aplican directamente al objeto en la pgina. Esta ltima
opcin permite trabajar en los efectos aisladamente, sin que
interfieran otros objetos de pgina en el ajuste de los efectos.
Use los botones del zoom o un porcentaje de aumento para las
tareas ms minuciosas.
5. Active un efecto 3D en la lista Efectos 3D y experimente con
la configuracin disponible.

392 Lneas, formas y efectos

Uso de estilos de objeto


La ventaja que suponen los estilos de objeto para su labor de
diseo es comparable a la de los estilos de texto y los esquemas
de color. Una vez que encuentre una serie de atributos que le
gusten (propiedades como el color de lnea, el relleno, los bordes,
etc.), podr guardarla como un estilo con nombre. WebPlus
recuerda qu objetos utilizan ese estilo y el estilo se incluye en la
pestaa Estilos para que pueda seguir aplicndolo a objetos
nuevos.

La pestaa Estilos contiene varias galeras de estilos prediseados


que puede aplicar a cualquier objeto o personalizar a su gusto. Hay
galeras en las
categoras
de efectos, como
Desenfoques,
3D, Borde,
Ajustes,
Sombras,
Materiales (por
ejemplo,
metales), etc. y
cada categora
posee sus
propias
subcategoras.

Lneas, formas y efectos 393

Para aplicar un estilo de objeto a uno o ms objetos:


1.

Abra la pestaa Estilos.

2.

Expanda la lista desplegable y seleccione una categora


de estilo con nombre (p. ej., Desenfoques) y, a
continuacin, elija una subcategora desplazndose por la
ventana inferior.

3.

Previsualice en la ventana los estilos disponibles como


miniaturas (de manera predeterminada se muestran en
forma de dientes).

4.

Haga clic en una miniatura de estilo para aplicarlo a los


objetos seleccionados.

5.

Abra la pestaa Estilos.

6.

Expanda la lista desplegable y seleccione una categora


de estilo con nombre (p. ej., Desenfoques) y, a
continuacin, elija una subcategora desplazndose por la
ventana inferior.

7.

Previsualice en la ventana los estilos disponibles como


miniaturas (de manera predeterminada se muestran en
forma de dientes).

8.

Haga clic en una miniatura de estilo para aplicarlo a los


objetos seleccionados.

Para eliminar un estilo de objeto de una galera:

Haga clic con el botn secundario en la miniatura y


seleccione Eliminar.

Para anular la vinculacin a un objeto desde la


definicin de su estilo:

Haga clic con el botn secundario en el objeto y


seleccione Formato>Estilo de objeto>Desvincular.

394 Lneas, formas y efectos

Cmo guardar estilos de objeto


Para crear un nuevo estilo de objeto en los atributos de
un objeto existente:

Haga clic con el botn secundario en el objeto y


seleccione Formato>Estilo de objeto>Crear.

Para guardar los estilos de objeto de un sitio


globalmente:
1.

Seleccione Guardar valores predeterminados... en el


men Herramientas.

2.

En el cuadro de dilogo, active Estilos de objeto y, a


continuacin, haga clic en Guardar.

Adicin de dimensionalidad (3D


instantneo)
Mediante la funcin 3D instantneo, puede transformar de manera
sencilla formas planas (mostradas) y texto en objetos
tridimensionales.
WebPlus le permite controlar ajustes de efectos 3D, como:

Biselado: utilice distintos valores preestablecidos


tallados y redondos o cree uno propio mediante un editor
de perfil de biselado personalizado.

Lneas, formas y efectos 395

Iluminacin: se puede colocar un mximo de ocho luces


editables y coloreadas por separado con el fin de
producir marcados efectos luminosos.

Efectos de torno: cree objetos con contorno (por


ejemplo, un corcho de botella) con el editor de perfil de
torno personalizado y el control de extrusin.

Textura: controle el modo de obtencin de texturas en


objetos con rellenos no slidos.

Visualizar: gire el objeto en tres dimensiones.

Material: controla el efecto de la iluminacin sobre las


superficies del objeto (especialmente indicado para texto
artstico en 3D).

Una prctica y accesible barra de herramientas de contexto 3D


situada encima de su espacio de trabajo le permite configurar los
ajustes mencionados anteriormente. Cada uno de ellos contribuye a
crear el efecto 3D en el objeto seleccionado. Para el control del
objeto en la pgina, puede transformar en 3D con un crculo rojo
de rbita, que acta como eje desde el que puede girar alrededor de
sus ejes X, Y y Z en relacin a su pgina. Busque el cursor que
cambia cuando pase por la trama o los nodos de los crculos rojos.

Giro X

Giro Y

Giro Z

Giro X e Y

Transforme los ejes de objetos 3D en lugar de los


ejes de las pginas manteniendo pulsada la tecla
Ctrl mientras realiza la transformacin.

396 Lneas, formas y efectos


Tambin puede ajustar el ngulo y la elevacin de cada luz
activa en la pgina arrastrando el puntero de luz a una posicin
que simule una fuente de luz.
Tras cualquier transformacin, el objeto de base
subyacente sigue siendo editable.
Para aadir dimensionalidad:
1.

Seleccione un objeto y haga clic en el botn 3D


instantneo
del elemento flotante Efectos de la
barra de herramientas Herramientas. El objeto adopta
inmediatamente las caractersticas 3D con un crculo rojo
de rbita mostrado en el primer plano del objeto.

2.

Haga clic en una categora de efecto 3D del primer men


desplegable de la barra de herramientas de contexto de
3D; las opciones de la barra cambian de forma dinmica
de acuerdo con la categora seleccionada. Consulte la
Ayuda de WebPlus para obtener ms informacin.

Haga clic en Restablecer valores predeterminados


en la barra de herramientas de contexto para revertir el
objeto a su transformacin inicial.
Para desactivar los efectos 3D:

Haga clic en el botn Quitar 3D en la barra de


herramientas de contexto. Puede hacer clic siempre en el
botn 3D instantneo de la barra de herramientas
Herramienta en cualquier momento posterior para
restaurar el efecto.

Para editar las propiedades de base de un objeto 3D:

Seleccione el objeto 3D y, a continuacin, haga clic en el


botn Editar objeto base en la esquina inferior derecha
del objeto 3D.

Lneas, formas y efectos 397

Se mostrar la forma original del objeto, lo que permite la


manipulacin de sus controles de seleccin para cambiar el tamao
y la rotacin.

398 Lneas, formas y efectos

14

Color, rellenos y
transparencia

400 Color, rellenos y transparencia

Color, rellenos y transparencia 401

Aplicacin de colores slidos


Puede usar
la pestaa
de Color, la
pestaa
Muestrarios
o un cuadro
de dilogo
para aplicar
colores
slidos a un
objeto.

Los botones de muestrario de las pestaas proporcionan varias


formas de aplicar colores slidos a objetos de varias clases:

Puede aplicar colores slidos al relleno o a la lnea de


un objeto. Como puede esperar, QuickShapes y las
formas cerradas (consulte Dibujo y edicin de formas
en la pg. 380) tienen propiedades de lnea y de
relleno.

El texto trazado a mano o las lneas curvadas pueden


llevar colores de lnea y tambin un color de relleno
para crear formas cerradas directamente de la lnea.

402 Color, rellenos y transparencia

Los objetos de texto artstico y de marco creativo


seleccionados pueden tener un color de relleno de
fondo, lnea y de texto. El color de texto es el relleno
del texto, el relleno de fondo es el rea inmediatamente
detrs de texto. El texto del marco de HTML solo lleva
color de relleno de fondo y de texto.

Los marcos de texto (se muestran) y las celdas de la


tabla pueden tener un relleno de fondo independiente
de los caracteres que contienen.

Para aplicar un color slido a travs de la pestaa Color:


1.

Seleccione los objetos o resalte el intervalo de texto.

2.

Haga clic en la pestaa Color y seleccione uno de los


distintos modos de color (RGB, CMYK, HSL o Escala
de grises) del men desplegable.

3.

Haga clic en el botn Relleno

, Lnea

Texto
en la parte superior de la pestaa para
determinar dnde se aplica el color. El color del
subrayado refleja el color del objeto seleccionado. Para
el texto de marco seleccionado, el relleno ser el color de
texto de fondo (pero no el color de fondo del marco).
4.

Seleccione un color del espectro de color o los controles


deslizantes en funcin del modo de color seleccionado.

Puede utilizar la herramienta Selector de colores


para definir el color. Despus de seleccionar la
herramienta, haga clic en cualquier punto del rea de

Color, rellenos y transparencia 403

trabajo para "seleccionar" el color que hay debajo del


cursor.
En modo de color RGB, puede usar la codificacin
policromtica hexadecimal mediante la seleccin del
botn Men de pestaa

de la pestaa Color.

Para aplicar un color slido a travs de la pestaa


Muestrarios:
1.

Seleccione los objetos o resalte el intervalo de texto.

2.

Haga clic en la pestaa Muestrarios.

3.

Haga clic en el botn Relleno

, Lnea

en la parte superior de la pestaa para


Texto
determinar dnde se aplica el color.
4.

Seleccione un muestrario de color de la


Paleta del sitio (los colores que ms se utilizan y
aquellos previamente aplicados al sitio) o la Paleta
estndar (RGB estndar o valores preestablecidos de la
paleta temtica, como colores seguros para la Web).

De forma alternativa, use Formato>Rellenar... para aplicar color


mediante un cuadro de dilogo.
Para cambiar una sombra o un tono de color slido
(luz):
1.

Seleccione el objeto y defina el botn de relleno, lnea o


texto en la pestaa Color.

2.

En el men desplegable de modo Color, seleccione


Teir.

404 Color, rellenos y transparencia


3.

Arrastre el control deslizante de sombra/tono a la


izquierda o a la derecha para oscurecer o aclarar el color
de inicio, respectivamente. Tambin puede indicar un
valor de porcentaje en la casilla (si introduce 0 en el
cuadro de entrada, vuelve al color original).

El tono de objeto tambin se puede aplicar mediante la pestaa


Muestrarios; ajuste Tono
deslizante o la entrada directa.

mediante el control

WebPlus aade colores automticamente a la Paleta del sitio


en la pestaa Muestrarios.
Para cambiar la paleta actual:

Haga clic en el botn Paleta


para ver y para
adoptar colores de RGB estndar, seguros para la Web o
de una seleccin de paletas temticas. Los colores se
pueden aadir, editar o eliminar de la Paleta del sitio,
pero no de otras paletas.

Uso de esquemas de color


WebPlus proporciona una impresionante seleccin de esquemas
de color que puede seleccionarse al crear un sitio con una plantilla
de diseo o desde cero. Si elige un sitio basado en plantilla, la
seleccin de un esquema de color establecer el aspecto del sitio en
cuanto a color, ya que todas las plantillas ya estn
esquematizadas. Al seleccionar cada esquema cambian
drsticamente los colores de elementos de pgina en el diseo de
pgina con un solo clic.

Color, rellenos y transparencia 405

Esquema de color: (A) Coral, (B) Smoothie y (C) Predeterminado.


Cuando crea inicialmente el sitio a partir de una plantilla puede
seleccionar uno de los tres esquemas de color diseados
especficamente para ese diseo de plantilla o simplemente utilizar
cualquiera de los esquemas de color global. Consulte Creacin de
un sitio con una plantilla de diseo en la pg. 26.

Creacin de esquemas desde cero


Los sitio web creados desde cero pueden utilizar globalmente
cualquier esquema de color, pero inicialmente tendr que asignar
un color de esquema a los objetos (consulte la pg. 410), puesto
que se crean para realizar trabajos de esquematizacin de colores.
Esto permitir cambios drsticos de color, si cambia los esquemas
posteriormente.

406 Color, rellenos y transparencia

Cmo funcionan los esquemas de color

Los esquemas de color de WebPlus funcionan como el sistema de


pintura por nmeros, donde a los elementos de pgina de un diseo
se les asignan colores de esquema especficos por nmero.
Estos colores se almacenan en muestrarios de botes de
pintura,numerados de 1 a 12, alojados en la pestaa
Muestrarios.Esquema de color Smoothie
Estos muestrarios representan el esquema de color del sitio. Aqu
puede asignar colores de esquema a los elementos de pgina para
hacerlos esquematizados (este proceso se hace ya con plantillas).
El cambio a un esquema de color diferente genera un aspecto
completamente distinto respecto al color.
Qu ha sucedido con los nmeros 4 y 6 a 9 contiguos? No se han
necesitado en el diseo de pgina y, por lo tanto, no se han
asignado.

Color, rellenos y transparencia 407

Puede utilizar una plantilla


de diseos de tema para
obtener una idea sobre
cmo los colores de
esquema se podra asignar a
diferentes elementos de
pgina de su sitio. La tabla
contigua indica cmo se
asignan los elementos de
pgina a los colores del
muestrario (del esquema
denominado Smoothie).
Intente
intercambiar los
diferentes
esquemas usando
el archivo de
muestra
Esquemas Muestra
disponible
inicialmente en el
Asistente para
inicio de WebPlus
o el men
Archivo. Cargue
el archivo e
intercambie los
esquemas de
color mediante
Diseador de
esquemas de
color.

408 Color, rellenos y transparencia

Hipervnculos, colores de pgina y fondos


esquematizados
Cualquiera de los 12 colores de esquema tambin se puede usar
para hipervnculos, color en pgina, y fondo del sitio para su
sitio.
Para los hipervnculos especficamente los estados de hipervnculo
normal, seguido, activo y dinmico se esquematizan de forma
predeterminada. Todos adoptan el mismo color de esquema 10
como se muestra anteriormente, pero si asigna diferentes colores de
esquema en Propiedades del sitio (pg. 45) puede cambiar el color
del hipervnculo a distintos tipos de interactividad (clic,
desplazarse por encima, etc.).
Los colores en pgina no se esquematizan de forma
predeterminada, pero se pueden asignar a un esquema de color en
las propiedades del sitio en cualquier momento. Por el contrario,
los fondos del sitio se esquematizan para colorearla el muestrario 1
de forma predeterminada, pero se pueden cambiar por otro color de
esquema en cualquier momento.
Para obtener ms informacin sobre la configuracin del color de
la pgina y color de fondo del sitio, consulte Configuracin de
aspecto de la pgina en la pg. 45.

Otras formas del uso de colores de esquema


A los estilos de texto, como otros objetos, se les pueden asignar
colores de esquema. Esta funcin resulta especialmente til si
desea que los encabezados adopten un aspecto similar. Por
supuesto, puede cambiar el esquema en cualquier momento
actualizando todos los colores de encabezado inmediatamente.
Tambin se pueden aplicar diferentes colores de esquema a los
hipervnculos de estilos de texto en todo el sitio. Esto puede ser til
si desea distinguir los colores de hipervnculos utilizados en los
encabezados (p. ej. Encabezado 1, Encabezado 2) de los utilizados
en el texto del cuerpo.

Color, rellenos y transparencia 409

Consulte Configuracin de propiedades de texto y Uso de estilos


de texto en la pg. 263 y pg. 263.

Seleccin de esquemas de color


Para seleccionar un esquema de color preestablecido:
1.

Haga clic en Diseador de esquemas de color


en
la barra de herramientas de contexto Predeterminado.
O bien:
Abra la pestaa Muestrarios, para mostrar el esquema
de color actual, p. ej.

Haga clic en el botn

410 Color, rellenos y transparencia


2.

En la pestaa Esquemas de color del cuadro de dilogo, haga


doble clic en otro ejemplo de esquema de color de la lista (o
seleccione y haga clic en Cargar), a continuacin, haga clic
en Aceptar.

Todas las regiones del sitio a las que se ha asignado uno de


los doce nmeros del esquema de color se actualizarn con el
color correspondiente en el esquema nuevo.
Cada sitio solo puede tener activo un esquema de color al mismo
tiempo; este se denomina esquema de color del sitio y se muestra
siempre en la pestaa Muestrarios. Cuando se guarda un sitio, el
esquema de color actual se guarda junto con el sitio.
Diseador de esquemas de color tambin permite
editar colores de esquema e incluso crear sus propios
esquemas de color personalizados.

Aplicacin de colores de esquema a los


objetos
Si crea objetos nuevos en un sitio de plantilla web o inicia un sitio
desde cero, cmo puede extender un esquema de color a los objetos
nuevos? Aunque necesitar dedicar algo de tiempo a determinar
qu combinaciones de color quedan mejor, la mecnica del proceso
es sencilla. Todo lo que necesita hacer es asignar uno de los
nmeros de color de esquema a la lnea y/o el relleno de un objeto.
Para asignar un color de esquema a un objeto:
1.

Seleccione el objeto y seleccione un botn Relleno


, Lnea
o Texto
en la parte superior de la
pestaa Muestrarios en funcin del efecto deseado.

Color, rellenos y transparencia 411

2.

En la parte inferior de la pestaa Muestrarios, haga clic


en un color de esquema que desee aplicar al relleno, la
lnea y el texto (tambin puede arrastrar el color).

Si el relleno de un objeto utiliza un color de esquema, la muestra


correspondiente de la pestaa Muestrarios aparecer resaltada
siempre que se seleccione el objeto.

Modificacin de esquemas de color


Si ha probado diferentes esquemas de color pero no ha encontrado
uno que sea adecuado, puede modificar cualquiera de los colores
de un esquema existente.
Para modificar un esquema de color:
1.

en
Haga clic en Diseador de esquemas de color
la barra de herramientas de contexto Predeterminado.

2.

En la pestaa Esquemas de color, seleccione el esquema


que desea modificar (haga doble clic en un esquema o
seleccione y haga clic en Cargar).

3.

En el cuadro de dilogo, cada uno de los nmeros de


color de esquema tiene su propio men desplegable, que
muestra los colores disponibles en la paleta de WebPlus.
Haga clic en la flecha desplegable
del color de
esquema y seleccione un color del men (o haga clic en
Ms colores... para ver una variedad de ms colores).
El esquema se actualiza con el color nuevo. Repita esto
para modificar otros colores de esquema.

4.

Para aplicar el esquema al sitio actual, haga clic en


Aceptar. El esquema de color del sitio se actualiza.

412 Color, rellenos y transparencia


Los esquemas que se han modificado se guardan
con el sitio, aunque los esquemas de color
personalizados tambin se pueden guardar
globalmente, de modo que el conjunto completo de
esquemas est siempre disponible para los sitios
nuevos.
Para crear un nuevo esquema con nombre basado
en estos colores, haga clic en Guardar como. De
forma alternativa, utilice Guardar para sobrescribir
el esquema existente.
Para un diseo ms avanzado de esquema de color con
combinaciones de color sugeridas, consulte la Ayuda de WebPlus.

Trabajo con rellenos de mapas de bits


y gradientes
Los rellenos de gradiente proporcionan una gradacin o un
espectro de colores que se extienden entre dos o ms puntos de un
objeto. Un relleno de gradiente tiene un trazado editable con nodos
que marcan el origen de cada uno de estos colores clave. Un
relleno de mapa de bits utiliza un mapa de bits con nombre (que
suele ser un material, un patrn o una imagen de fondo) para
rellenar un objeto.

Lineal

Elptico

Cnico

Mapa de
bits

Color, rellenos y transparencia 413

Puede aplicar un relleno de gradiente o de mapa de bits


preestablecido desde la pestaa Muestrarios al relleno o contorno
de forma o de marco de texto; texto artstico tambin puede
tomar un relleno de gradiente o un relleno de mapa de bits (para el
texto, el contorno, y el fondo).

El texto de marco creativo y de tabla creativa


tambin puede utilizar rellenos de gradiente o de
mapa de bits (para el texto, el contorno y el fondo),
junto con bordes y fondos individuales de celda de
tabla creativa.
La aplicacin de diferentes efectos de transparencia
(mediante la pestaa Transparencia) no altera la
configuracin de relleno del objeto como tal, pero
puede modificar notablemente el aspecto real del
relleno.

414 Color, rellenos y transparencia

Aplicacin de un relleno de gradiente o mapa


de bits
Existen varias formas de aplicar un relleno de gradiente o de mapa
de bits: mediante la pestaa Muestrarios, la herramienta Relleno, o
un cuadro de dilogo.
La forma ms sencilla de aplicar un relleno de gradiente o de mapa
de bits es utilizar una miniatura de la amplia gama de muestrarios
incluidos en las paletas Gradiente o Mapa de bits. La herramienta
Relleno y un cuadro de dilogo de relleno son mtodos alternativos
para crear rellenos de gradiente (se describen en la Ayuda de
WebPlus).
Para aplicar un relleno de gradiente o mapa de bits
usando la pestaa Muestrarios:
1.

Haga clic en la pestaa Muestrarios y asegrese de que


o Lnea
estn seleccionados (para
Relleno
el relleno o contorno de un objeto, respectivamente).
Observe que el color del subrayado refleja el color del
objeto seleccionado.

2.

Para rellenos de gradiente


, seleccione Lineal,
Elptico o Cnico como tipo de gradiente en el men
desplegable del botn Gradiente.
O bien
, seleccione una
Para rellenos de mapa de bits
categora del men desplegable del botn Mapa de bits.

3.

Seleccione el objeto y, a continuacin, haga clic en el


muestrario de la galera adecuada para el relleno que
desea aplicar.
O bien:
Para los rellenos solo, arrastre desde la muestra de la
galera hasta cualquier objeto y suelte el botn del ratn.

Color, rellenos y transparencia 415

4.

Si fuera necesario, ajuste el Tono del relleno en la parte


inferior de la pestaa con el control deslizante de la
pestaa o establezca un valor porcentual en el cuadro de
entrada.

Para aplicar un relleno de gradiente con la herramienta


Relleno:
1.

Seleccione un objeto.

2.

Haga clic en el botn Herramienta Relleno


en el
elemento flotante de relleno de la barra de herramienta
Herramientas.

3.

Haga clic y arrastre en el objeto para definir el trazado de


relleno. El objeto adopta un relleno lineal sencillo, que
va degradando desde el color actual del objeto hasta el
color blanco monocromtico, p. ej.,

Si el objeto ya es blanco (o no tiene relleno), se degrada


desde el blanco hasta el negro.

416 Color, rellenos y transparencia

Edicin del trazado de relleno


Cuando se selecciona un objeto que admite relleno, la
herramienta Relleno se encuentra disponible (de lo contrario
aparece desactivada). Si el objeto utiliza un relleno de gradiente,
ver el trazado de relleno mostrado como una lnea cuando se ha
seleccionado la herramienta Relleno. Los nodos marcan donde
empieza y termina el espectro entre cada color clave. Ajustando las
posiciones de los nodos se determina la propagacin real de los
colores entre nodos. Tambin puede editar un relleno de gradiente
si aade, elimina o cambia los colores clave.

Relleno lineal basado en


colores clave

Objeto rellenado que muestra


trazado de relleno (B)

(A)
Para ajustar el trazado de relleno de gradiente en un
objeto seleccionado:
1.

Muestre la pestaa Muestrarios y asegrese de que


Relleno
o Lnea
estn seleccionados (para
un relleno o contorno del objeto, respectivamente).

Color, rellenos y transparencia 417

2.

Haga clic en el botn Herramienta Relleno


en el
elemento flotante de relleno de la barra de herramienta
Herramientas. El trazado de relleno se muestra en el
relleno o el contorno del objeto.

3.

Utilice la Herramienta Relleno para arrastrar los nodos


de trazado de inicio y final o haga clic en el objeto para
crear un nuevo nodo de inicio y arrastre un nuevo trazado
de relleno. El gradiente comienza en el nodo de inicio y
termina en el nodo final.

Cada tipo de relleno de gradiente tiene un trazado caracterstico.


Por ejemplo, los rellenos lineales tienen trazados de una sola lnea,
mientras que los rellenos radiales tienen un trazado de dos lneas,
por lo que puede ajustar la extensin del relleno en dos direcciones
partiendo del centro. Si el objeto utiliza un relleno de mapa de
bits, ver el trazado de relleno mostrado como dos lneas unidas en
un punto central. Los nodos marcan el centro y los bordes del
relleno.

Configuracin de transparencia
Los efectos de transparencia son magnficos para resaltar, colorear
y sombrear, y simular un realismo "representado". Estos efectos
pueden marcar una diferencia fundamental entre ilustraciones
aburridas e imgenes con profundidad y chispa. WebPlus es
completamente compatible con la transparencia variable y permite
aplicar transparencias slidas, de gradiente o de mapa de bits con
facilidad.
Por ejemplo, en la siguiente ilustracin, las mariposas tienen una
transparencia slida (100% opaca), una transparencia de gradiente
(100% a 0% opaca) y una transparencia slida (50% opaca) de
izquierda a derecha.

418 Color, rellenos y transparencia

Las transparencias funcionan de forma muy similar a los rellenos


que utilizan "tinta invisible", en lugar de color. Cuanto ms
transparente sea un punto concreto, ms "invisible" ser el punto y
ms se ver el objeto de debajo. Igual que un relleno de gradiente
puede variar de claro a oscuro, la transparencia puede variar de
ms a menos, es decir, de transparente a opaca, como en la
ilustracin:

A - Transparencia de lnea, B - Trazo, C - Efecto en objetos


Los tipos de transparencia disponibles en la pestaa Transparencia
son los siguientes:

Color, rellenos y transparencia 419

La transparencia slida distribuye la transparencia


uniformemente.

Las transparencias de gradiente incluyen efectos


lineales, elpticos y cnicos y oscilan entre el
transparente absoluto y el opaco.

Las transparencias de mapas de bits incluyen mapas de


texturas clasificados por tipos en la pestaa de
Muestrario de mapas de bits.

Aplicacin de transparencias
Puede aplicar transparencia de gradiente o mapa de bits desde la
pestaa Transparencia al relleno o al contorno de una forma o
marco de texto; el texto artstico tambin puede utilizar los
mismos efectos de transparencia (para el texto, el contorno y el
fondo).
Para aplicar transparencias mediante la pestaa
Transparencia:
1.

Con el objeto seleccionado, muestre la pestaa


Transparencia y asegrese de que ha seleccionado
Relleno o
Lnea (para el relleno o el contorno de
un objeto, respectivamente).

2.

Para la transparencia slida, seleccione el botn


Slido y elija una miniatura en la galera de
transparencias slidas. Las miniaturas ms ligeras
representan ms transparencia (expresadas como un
porcentaje de Opacidad).
O bien:
Para la transparencia de gradiente, seleccione el botn
Gradiente y elija la miniatura correspondiente.

420 Color, rellenos y transparencia


O bien:
Para la transparencia de mapa de bits, seleccione el botn
Mapa de bits y elija una miniatura de un
intervalo de categoras.
3.

La transparencia se aplicar al relleno o al contorno del


objeto.

Alternativamente, arrastre la miniatura deseada de la galera a un


objeto y suelte el botn del ratn.
Para aplicar la transparencia de gradiente con la
herramienta Transparencia:
1.

Seleccione el objeto y establezca la muestra de relleno o


lnea en la pestaa Transparencia como anteriormente.

2.

Haga clic en el botn


Herramienta Transparencia
en el elemento flotante Transparencia de la barra de
herramientas Herramientas.
O bien:
Seleccione Formato>Transparencia....

3.

Arrastre el cursor por el objeto y suelte el botn del


ratn. El objeto adopta una transparencia lineal sencilla y
degradada desde el 100% al 0% de opacidad
(completamente transparente).

Configuracin de la transparencia
predeterminada
La transparencia predeterminada es la transparencia que se
aplicar al siguiente objeto nuevo que se cree. Los valores
predeterminados locales solo afectan a los objetos del sitio actual.
Para ms informacin sobre la configuracin de los valores
predeterminados en WebPlus, consulte Cmo actualizar y
guardar valores predeterminados en la pg. 306.

15

Vista previa y
publicacin

422 Vista previa y publicacin

Vista previa y publicacin 423

Vista previa del sitio


La vista previa del sitio en un navegador web es un paso esencial
antes de publicarlo en la Web. Es la nica forma de ver cmo se
mostrar el sitio a un visitante. Puede obtener la vista previa de
una pgina o un sitio en cualquier momento, en WebPlus (usando
una ventana interna basada en el navegador Internet Explorer) o
aparte utilizando cualquier navegador instalado en el sistema.
Para obtener una vista previa del sitio:
1.

Haga clic en la flecha hacia abajo del botn Vista


previa
Estndar.

2.

del sitio en la barra de herramientas

Seleccione una opcin del submen:

Vista previa en la ventana (acceso directo Alt+P)


abre el sitio en una nueva ventana interna de
WebPlus con su propia pestaa para alternar
cmodamente.
Para obtener una vista previa en una ventana, puede
usar la barra de herramientas de contexto Vista
previa para controlar la ventana de vista previa.
Haga clic en los botones de la barra de herramientas
para desplazarse hacia Atrs y hacia Adelante, para
Actualizar o para Cerrar vista previa y vuelva a
mostrar la pgina con una de las distintas
resoluciones de pantalla estndar o personalizadas
(todas desde un men desplegable).

Elija Vista previa de la pgina... o Vista previa


del sitio... para utilizar un navegador externo. Los
nombres reflejarn qu navegadores hay
actualmente instalados. Por ejemplo, una entrada
podra ser "Obtener vista previa de la pgina en
Internet Explorer." Si tiene ms de un navegador

424 Vista previa y publicacin


instalado, puede seleccionar qu navegador (o
navegadores) deben mostrarse en el submen. La
pgina o el sitio se exporta a una carpeta temporal y
se muestra en el navegador especificado.
Para personalizar la lista de navegadores en el
submen:
1.

Elija Vista previa del sitio del men Archivo (o del


elemento flotante Vista previa del sitio de la barra de
herramientas Estndar) y seleccione Lista de vistas
previas del navegador... del submen.
El cuadro de dilogo presenta una lista de navegadores
registrados en el sistema. El submen Vista previa de
WebPlus los enumerar en el orden en que se muestran
aqu.

2.

3.

Utilice el cuadro de dilogo para realizar los cambios que


sean necesarios:

Haga clic en Detectar automticamente para


actualizar la lista automticamente, o bien haga clic
en Aadir para mostrar un cuadro de dilogo que le
deje buscar un navegador especfico para aadirlo a
la lista.

Para eliminar una entrada de la lista, seleccinela y


haga clic en Quitar.

Puede reorganizar la lista seleccionando una entrada


y haciendo clic en Subir o Bajar.

Para cambiar el nombre de la entrada en el submen


o su ruta, seleccione la entrada y haga clic en
Editar. Por ejemplo, puede cambiar Internet
Explorer para que aparezca simplemente como
IE7.

Haga clic en Aceptar para confirmar los cambios.

Vista previa y publicacin 425

Es recomendable instalar varios de los navegadores


ms comunes para probar cmo aparecer su sitio
en otro sistema.
WebPlus le permite ver el tiempo de descarga estimado
para cada pgina del sitio y ofrece informacin como el nmero de
archivos en cada pgina y el tamao total de los archivos. Esto se
realiza mediante el elemento flotante Vista previa del sitio de la
barra de herramientas Estndar.

Publicacin en la web
Publicar en la Web supone cargar el sitio en su proveedor de
hospedaje web, convirtiendo el sitio en un sitio web activo, que
puede ver todo el mundo. Puede especificar que se publiquen todas
las pginas web o, si actualiza el sitio, slo las pginas cambiadas
desde la ltima publicacin.
Antes de publicar en la Web, hay que comprobar si hay posibles
problemas; para ello hay que ejecutar el Comprobador del sitio
(Herramientas>Administrador de sitios>Comprobador de
sitio...).
Recuerde que puede publicar en una carpeta del disco
en cualquier momento, lo que le permite probar el sitio
web sin conexin (y localmente) antes de publicar en la
Web. Consulte la Ayuda de WebPlus para obtener ms
informacin.
Para publicar el sitio en la web:
1.

Seleccione Propiedades del sitio Web... en el men


Archivo y haga doble clic en la configuracin de
exportacin, particularmente las que se ven desde la
opcin de men Grficos.

426 Vista previa y publicacin


2.

Haga clic en el botn Publicar sitio


en la barra
de herramientas Estndar (o elija Publicar sitio del
men Archivo y seleccione en el submen Publicar en
la Web...).

Si no ha configurado la informacin de la cuenta FTP, necesitar


configurar como mnimo una cuenta antes de poder continuar; esto
se recuerda para la siguiente publicacin en la Web.
3.

Haga clic en el botn Cuentas... para mostrar el cuadro


de dilogo Cargar en el servidor.

4.

Haga clic en Aadir....

5.

En el cuadro de dilogo Detalles de la cuenta,


introduzca:

El Nombre de cuenta. Puede ser cualquier nombre


que elija. Lo usar para identificar esta cuenta de
WebPlus (en caso de que tenga ms de una).

La Direccin FTP del hospedaje web ser una


direccin URL especfica que empieza por ftp://
como se proporciona por su proveedor de servicios.

Nmero de puerto. Excepto que lo especifique su


proveedor, lo puede dejar como 21.

Deje el cuadro Carpeta en blanco, a menos que su


proveedor lo especifique de otra manera o si desea
publicar en una subcarpeta especfica del directorio
raz.

Tambin necesitar un Nombre de usuario y


Contrasea, preasignado por el proveedor. Lo ms
probable es que se correspondan a la configuracin
de inicio de sesin de correo electrnico. Asegrese
de escribir la contrasea exactamente como se le ha
proporcionado, escribiendo correctamente las

Vista previa y publicacin 427

maysculas y minsculas, o el servidor de


hospedaje no la reconocer.

Active la opcin Guardar contrasea para guardar


la contrasea en el equipo, si no desea volver a
escribirla con cada carga.

Modo pasivo. Djelo activado a menos que tenga


problemas de conexin FTP (compruebe con el
ISP). Los ISP pueden operar los modos de
funcionamiento pasivo o activo de la FTP.

URL del sitio web. Establezca la direccin URL


del sitio. Esto le permite ver el sitio web desde un
cuadro de dilogo despus de la carga del FTP.

En el cuadro Avanzado, puede activar


opcionalmente FTP Seguro mediante la carga
utilizando uno o dos protocolos de cifrado: TLS 1.0
y SSL 3.0. Active Conexin cifrada y elija el
Protocolo. Tendr que confirmar con el ISP si el
cifrado (y qu protocolo) se admite, est implcito o
es de cualquier otro modo. La opcin SSL implcito
hace que el servidor FTP de ISP se cifre en el
contacto inicial con el puerto predeterminado 990 o
un puerto personalizado (edite el nmero de puerto).

Haga clic en Aceptar para cerrar los detalles de la


cuenta.

Tambin puede usar el cuadro de dilogo Cargar el servidor en este


punto para Aadir... otra cuenta y Copiar..., Editar o Eliminar
una cuenta seleccionada del men desplegable. Es una buena idea
probar la cuenta nueva o modificada haciendo clic en el botn
Probar. Si la prueba es correcta, aparecer un cuadro de dilogo
que indique que se ha establecido una conexin.
Si aade cuentas adicionales tendr que seleccionar qu
cuenta utilizar de la lista desplegable en el cuadro
Cuenta FTP.

428 Vista previa y publicacin


Puede elegir guardar los detalles de la cuenta FTP en el equipo (los
detalles de la cuenta se guardarn en WebPlus y no se perdern,
incluso despus de Ctrl-Ejecutar) o en el sitio actual.
6.

Si ha configurado como mnimo una cuenta y ha hecho


clic en el botn Cargar..., el cuadro de dilogo Publicar
en la Web aparecer con el ltimo nombre de cuenta
utilizado mostrado en el men desplegable y la
configuracin en los cuadros siguientes. El men
desplegable le permite cambiar a otra cuenta. Seleccione
la cuenta que desea usar (si tiene ms de una).

7.

Si el sitio est utilizando una base de datos, la opcin


Combinar antes de publicar se marca. Borre esta
opcin solo si no desea combinar cambios (la opcin se
desactiva si no se detecta ninguna base de
datos/cambios). Para obtener ms informacin sobre
bases de datos, consulte Uso de la combinacin de
bases de datos en la Ayuda de WebPlus.

8.

Para un mayor control durante la publicacin, asegrese


de que la casilla de verificacin Carga desatendida est
desactivada. Esto le permitir revisar los cambios que
ocurrirn en el sitio web publicado antes de que sean
efectivos. Tambin le dar la opcin de cancelar la carga
si detecta un problema. (Consulte Operacin
automtica en la p. 431 para obtener ms informacin
sobre esta caracterstica.)

9.

Elija las pginas que desee cargar; active pginas


especficas en la ventana o active Publicar todas las
pginas. Utilice los botones Alternar seleccin,
Alternar rama y Seleccionar todo para facilitar la
seleccin de la pgina.

10. Para proteger el sitio de WebPlus, active la opcin Crear


copia de seguridad de documento en el servidor
remoto. Si el sitio est sin guardar, se le pedir
guardarlo.

Vista previa y publicacin 429

11. Haga clic en Aceptar. WebPlus busca una conexin a


Internet y, a continuacin:
12. Si es la primera vez que se carga contenido, los archivos
seleccionados se cargarn directamente.
O bien:
Si carga a un sitio existente, se muestra un cuadro de
dilogo Cargando archivos que presenta la accin de
archivo local (si los archivos se aadirn [Aadir], si
sustituirn el archivo activo [Reemplazar] o si no se
actualizarn [Dejar]).
En el cuadro de dilogo, active la opcin Eliminar
archivos remotos sin usar si desea que WebPlus quite
cualquier grfico y archivos de pgina sin utilizar.
Seleccione el botn Actualizacin incremental o Carga
completa. Seleccione la ltima opcin para cargar
nicamente los archivos que hayan sido modificados
desde la ltima carga. Cuando se realiza una
actualizacin incremental, puede hacer que WebPlus
compruebe si faltan archivos marcando el cuadro de
opcin. No obstante, como esto puede ralentizar
dramticamente la carga, esta opcin est desactivada de
forma predeterminada.
Ver un mensaje cuando todos los archivos se hayan
copiado correctamente. Haga clic en Cerrar.
13. En el men desplegable del cuadro de dilogo de
publicacin del sitio web, seleccione el navegador en el
que desea ver el sitio activo y haga clic Ver esta URL.
Ya podr ver su sitio en vivo.
Si cambia el nombre a los archivos o los elimina y, a continuacin,
vuelve a publicar una o varias pginas en la Web, los archivos
anteriores no se eliminan automticamente as que deber
eliminarlos manualmente mediante Publicar sitio>Mantener sitio
web... en el men Archivo. No obstante, si vuelva a publicar todo

430 Vista previa y publicacin


el sitio en la Web automticamente (usando la operacin
automtica), puede elegir eliminar cualquier archivo no utilizado;
active la casilla de verificacin de Eliminar archivos no
utilizados.

Controlar la informacin de la cuenta FTP


WebPlus le ofrece la opcin de guardar los detalles de la cuenta
FTP en el equipo o en el sitio actual, o ambos. La informacin de
la cuenta se conserva en el equipo de forma predeterminada, pero
al guardar los detalles de su sitio puede transferir el sitio en otro
equipo sin perder los detalles de su cuenta y, despus, volver a
publicar desde ah.
Los detalles de la contrasea nunca se almacenan
en los sitios por razones de seguridad.
Una opcin adicional permite exportar todos los detalles de la
cuenta FTP (incluso las contraseas) en un equipo diferente.
Para guardar los detalles de la cuenta FTP en el sitio:
1.

En el cuadro de dilogo Publicar en la Web haga clic en


Cuentas....

2.

En la seccin de Guardar detalles de la cuenta FTP del


cuadro de dilogo, active la opcin En el sitio actual.

3.

Haga clic en Cargar.

Cuando el sitio se abre en otro equipo, los detalles seguirn estando


guardados en el sitio. Puede marcar la opcin En este equipo para
guardar los detalles de su cuenta en el equipo, as como en el sitio.
Para exportar todos los detalles de la cuenta FTP:
1.

En el cuadro de dilogo Publicar en la Web haga clic en


Cuentas....

Vista previa y publicacin 431

2.

En la seccin Cuenta de FTP del cuadro de dilogo, haga


clic en Exportar todo.

3.

Elija una ubicacin y un nombre para el archivo del


registro (.reg) y haga clic en Guardar.

4.

Transfiera el archivo .reg a un equipo distinto y haga


doble clic en el archivo.
Las cuentas existentes de la FTP en el equipo de
destino se sobrescribirn.

Operacin automtica
Si tiene un sitio web muy grande, puede que quiera usar la funcin
de operacin automticamente. El proceso real es prcticamente el
mismo que en la publicacin en la Web, pero le permite cargar el
sitio sin tener que hacer clic en Aceptar cada vez que aparezca
un cuadro de dilogo. Esta funcin resulta especialmente til si
est actualizando un sitio que contiene una base de datos grande
con imgenes.
1.

Active Carga desatendida. Esto tambin activa las


opciones siguientes:

Active la opcin Usar carga incremental para


sustituir nicamente los archivos modificados desde
la ltima actualizacin (si ya ha publicado
anteriormente el sitio web en la misma carpeta
FTP). Esta opcin constituye un mtodo eficaz de
carga, pues hay que transferir menos archivos.
Con esta opcin activada tambin puede seleccionar
Comprobar archivos remotos para ordenarle a
WebPlus que compruebe manualmente cada archivo
antes de reemplazarlo. Esto reduce la velocidad de
carga en comparacin al funcionamiento normal
pero es un mtodo ms completo de publicacin.

432 Vista previa y publicacin

Active la opcin Eliminar archivos no utilizados


para quitar los archivos de la carpeta FTP que no
son necesarios para el sitio web que est publicando
(p. ej., esto es relevante cuando se carga un sitio
web totalmente diferente en la carpeta de FTP).

2.

Elija las pginas que desee cargar; active pginas


especficas en la ventana o active Publicar todas las
pginas. Utilice los botones Alternar seleccin,
Alternar rama y Seleccionar todo para facilitar la
seleccin de la pgina.

3.

Para proteger el sitio, active la opcin Crear copia de


seguridad de documento en el servidor remoto. Si el
sitio est sin guardar, se le pedir guardarlo.

4.

Haga clic en Aceptar para iniciar el proceso de carga.


(Ahora se puede tomar un caf)

5.

Cuando la carga est completa, el cuadro de dilogo


Cargando archivos permanecer en pantalla hasta que
haga clic en Cerrar.

6.

En el men desplegable del cuadro de dilogo de


publicacin del sitio web, seleccione el navegador en el
que desea ver el sitio activo y haga clic Ver esta URL.
Ya podr ver su sitio en vivo.

Visualizacin del sitio publicado


Una vez que haya publicado el sitio, tendr la opcin de Ver el
sitio en lnea

en el men desplegable Vista previa del sitio

en la barra de herramientas Estndar. Esto muestra el sitio


en su estado publicado ms reciente en el navegador web
predeterminado. La primera vez que se utiliza la opcin de ver el
sitio en lnea, aparece un cuadro de dilogo que pregunta por la
URL predeterminada del sitio. Esto se puede solucionar ms tarde
con el cuadro de dilogo Propiedades del sitio....

Vista previa y publicacin 433

Es importante recordar que los cambios realizados desde la ltima


publicacin no se reflejarn. Para ver los cambios sin publicar, use
el botn Vista previa del sitio
del sitio web en la p. 421).

. (Consulte Vista previa

Publicacin rpida
La publicacin rpida le permite cargar rpidamente y ver la
pgina mostrada actualmente. Resulta til para probar "en directo"
las pginas individuales a medida que crea el sitio web. Para que la
publicacin rpida funcione, primero debe configurar los detalles
de su cuenta en el cuadro de dilogo Configuracin de publicacin
rpida.
Para configurar la publicacin rpida:
1.

Haga clic en el elemento flotante Publicar sitio


en la barra de herramientas Estndar y despus haga clic
en Configuracin de publicacin rpida.
O bien:
Haga clic en Archivo>Publicar sitio>Configuracin de
publicacin rpida....

2.

En el cuadro de dilogo:

Introduzca los detalles de la URL del sitio que desea


publicar, seleccione una opcin de la lista
desplegable.

Seleccione el navegador en el que desea ver la


pgina una vez se haya publicado.

Seleccione la cuenta de FTP que desea usar en el


men desplegable. Para actualizar la configuracin
de la cuenta, o aadir una nueva cuenta, haga clic en
Administrar cuentas.

434 Vista previa y publicacin


Es una buena idea probar la cuenta nueva o modificada
haciendo clic en el botn Probar. Si la prueba es correcta,
aparecer un cuadro de dilogo que indique que se ha
establecido una conexin.
3.

Haga clic en Aceptar.

Para una publicacin rpida en la Web:

Haga clic en el elemento flotante Publicar sitio


en la barra de herramientas Estndar y despus haga clic
en Publicacin rpida en la Web.
O bien:
Haga clic en Archivo>Publicar sitio>Publicacin
rpida en la Web.
Si intenta utilizar la publicacin rpida sin configurar
antes la cuenta, el cuadro de dilogo Configuracin
de publicacin rpida se abrir automticamente
para que lo haga.

El cuadro de dilogo Cargando archivos aparece brevemente


antes de que la pgina se muestre en el navegador elegido.

Creacin de archivos PDF


WebPlus le permite publicar todo el sitio como un PDF y exporta
la estructura del sitio como marcadores en los que se puede hacer
clic en el documento PDF.
La publicacin como PDF es muy til para los
estudiantes que tienen que enviar sus sitios en
formato de documento a examinadores.

Vista previa y publicacin 435

1.

Haga clic en el elemento flotante Publicar sitio


en la barra de herramientas Estndar y seleccione
Exportar sitio como PDF...
.
O bien:

Haga clic en Archivo>Publicar sitio>Exportar sitio como


PDF....
2.

En el cuadro de dilogo Publicar en PDF asigne un


Nombre de archivo, localice la carpeta en la que desea
guardar el PDF y haga clic en Guardar.

El PDF se genera y, si tiene un lector de PDF adecuado


instalado en el sistema, automticamente se abrir para que lo
pueda ver.
Si hay problemas durante la generacin del PDF, se
mostrar una lista de incidencias.

436 Vista previa y publicacin

16

ndice

438 ndice

16

2
2D, 384
efectos de filtro, 384
3
3D, 389
3D instantneo, 394
efectos de filtro, 389
3D instantneo, 394
A
accesibilidad, 333
texto alternativo
(imgenes) para, 333
actualizar, 3
adhesivos, 115
Administrador de
delimitadores, 55
Administrador de eventos de
calendario, 279
Administrador de
exportaciones de
imgenes, 333
Administrador de fuentes,
55
Administrador de fuentes
RSS, 177
Administrador de
hipervnculos, 55
Administrador de recursos,
55
Administrador de sitios, 55
Administrador de texto, 55
Adsense, 125
Ajustar texto a la curva, 248
ajuste (de imgenes), 340

PhotoLab, 340
Ajuste automtico, 243
alineacin, 71, 261
de la pgina, 71
de prrafo, 261
alineacin de objetos, 312
almacenamiento de un sitio,
34
Animaciones GIF, 353
anti-spam (CAPTCHA),
171, 220
anuncios, 125
apertura de un sitio
existente, 32
archivos
administracin, 55
nombres/extensiones, 71
archivos de procesador de
texto, 237
archivos de sonido, 356
Archivos SWF, 353
Asistente para calendarios,
279
Asistente para inicio, 25
asociacin, 313
HTML a objetos, 153
HTML a pgina, 153
objetos a texto, 313
asociacin de pginas
maestras, 59
B
Barra de herramientas Vista,
77
barras de navegacin, 37, 85
aspecto, 91

440 ndice
botones, 91, 100
cambio de texto de botn,
88
como paneles, 98
conversin en paneles, 98
crear, 86
dinmico, 97
exclusin de pginas, 96
fondos, 91
guardar, 96
mens emergentes, 93
personalizar, 89
separadores, 94
y estructura del sitio, 37
Bienvenido, 3
Blog (objeto inteligente),
209
acceso, a travs de
vnculos fuera del sitio,
69
bordes, 380
Borrar formato, 261
botones, 85, 100
convertir en barra de
navegacin, 104
crear personalizado, 102
Botones de comercio
electrnico, 115
botones/comercio
electrnico, 115
Buscar y reemplazar, 55,
255
bsqueda en sitios web, 113
ButtonStudio, 102

C
cach, 425
cajas de luz, 128
configuracin, 131
creacin de
hipervnculos, 105
calendarios, 279
das de fiesta para, 281
eventos para, 282
cmaras digitales, 339
como origen TWAIN,
339
CAPTCHA (anti-spam),
171, 220
caracteres, 263
estilos, 263
caractersticas, 4, 16
nuevo, 16
principal, 4
carro de la compra, 186
cintas, 115
citas, 115
codificacin, 71
cdigo de color
hexadecimal, 401
color, 401
en pgina, 45
global, 45
esquemas, 404
fondo, 45
global, 45
hipervnculo, 45
global, 45
relleno de gradiente, 412
relleno slido, 401
teir, 403

ndice 441

color en la pgina, 45
global, 45
colores slidos, 401
Comando Aadir relleno a
Studio, 412
Comando Avanzar uno, 311
Comando Enviar al fondo,
311
Comando Reemplazar
imagen, 323
Comando Replicar, 292
Comando Retroceder uno,
311
Comando Traer al frente,
311
combinacin (bases de
datos), 195
combinacin de bases de
datos, 195
reas que se repiten, 199
creacin de un origen de
datos en, 198
comercio electrnico, 186
adicin de formularios y
botones (PayPal), 189
creacin de hipervnculo
con carro de la compra,
105
minicart, 186
comparacin entre incrustar
y vincular imgenes, 323
comparacin entre vincular
e incrustar (imgenes),
323
conjuntos empresariales
(detalles del usuario), 271
Contador de visitas (objeto
inteligente), 209

contadores, 209
activa, 218
Visor activo, 218
contornos, 304
unir, 304
control de acceso, 209, 222
Control deslizante de
sombra/tono, 403
copia y pegado de objetos,
292
creacin de vnculos
activos, 369
crditos, 4
Cuadro de mensajes (objeto
inteligente), 209
D
delimitadores, 105
descriptores de motores de
bsqueda, 47
Design Studio, 137
Detalles de la cuenta (FTP),
425
detalles de usuario, 269
actualizacin, 270
conjuntos empresariales,
271
insertar, 270
dimensionalidad (3D
instantneo), 394
dimensiones, 40, 71
en todo el sitio, 40
especfico de pgina, 71
diseos de temas, 27
distintivos, 161
duplicacin de objetos, 292

442 ndice
E
efecto bisel, 384
efecto de contorno, 387
efecto de reflejo, 387
efecto de resplandor, 384
efecto de sombra, 384
efecto relieve, 384
efectos, 384, 389
bisel (3D instantneo),
394
contorno, 387
Filtro 2D, 384
Filtro 3D, 389
reflejo, 387
sombra, 388
torno (3D instantneo),
394
efectos (imgenes), 340
PhotoLab, 340
efectos de animacin, 353
efectos de filtro, 384, 389
efectos especiales, 384, 389
elementos dinmicos, 143
emergente, 146
elementos dinmicos
emergentes, 146
eliminacin de
pginas/pginas maestras,
64
Encuesta (objeto
inteligente), 209
envo (de formularios), 171
espaciado entre letras, 261
esquemas (color), 404
fondo, 45
modificacin, 411

para hipervnculos, 408


esquemas de color, 404
asignar, 410
modificacin, 411
valores preestablecidos,
409
estilos, 261, 263, 392
fuente, 261
objeto, 392
texto (vase tambin, 263
estilos con nombre, 263
para texto (vase
tambin, 263
estilos de objeto, 392
estilos de texto, 263
estructura del sitio, 55, 85
manipulacin de pginas,
64
vnculos fuera del sitio,
69
y navegacin, 37, 85
Estudio de recorte de
imgenes, 349
Etiquetas de encabezado
HTML, 47
eventos (calendario), 282
F
festivo (das), 281
filtros, 340
Flash, 353, 362
pelculas, 353
titulares, 115
fondo, 40, 71
color, 45
global, 45

ndice 443

esquematizado, 408
imagen, 46
sonido, 356
formas, 380
ajustar texto a, 248
cambiar tamao, 295
degradados/rellenos de
mapa de bits, 412
dibujo y edicin, 380
rellenos slidos, 401
transparencia, 417
formato de texto, 261
Pegar formato, 294
formularios, 161
controles, 166
crear, 163
envo de datos, 171
confirmacin, 173
Foros (objeto inteligente),
209
acceso, a travs de
vnculos fuera del sitio,
69
Fotografa HD, 323
FTP, 425
detalles de la cuenta, 425
migracin, 430
Fuente (cmara/escner)
TWAIN, 339
fuente de prrafo
predeterminada, 263
fuentes, 261
configurar, 261
Segura para la web, 261
Fuentes RSS, 177
adicin de artculos, 180

crear, 178
suscripcin a terceros,
181
Fuentes TrueType, 261
G
Galera fotogrfica, 362
giro de objetos, 297
Google AdSense, 125
Google Maps, 120
gradiente, 412, 417
rellenos de color, 412
transparencia, 417
grficos (vase, 323
grupos, 317
crear, 290, 317
usuario (control de
acceso), 225
grupos de usuarios (control
de acceso), 225
registro, 228, 231
H
Herramienta
Bsqueda de sitio, 113
Fuente RSS, 177
Lpiz, 373
Lector RSS, 183
Lnea recta, 373
Marco creativo, 239
Marco de texto HTML,
239
Objeto inteligente, 209
Pluma, 373
Recorte cuadrado, 299
Recorte irregular, 299

444 ndice
Rellenar, 412
Resultados de bsqueda
en el sitio, 113
Rotar, 297
Sombra, 388
Tabla HTML, 277
Texto artstico, 246
Transparencia, 417
Herramienta de bsqueda
del sitio, 113
Herramienta de marco de
texto HTML, 239
Herramienta de recorte
irregular, 299
Herramienta de tabla de
texto HTML, 277
Herramienta de texto
artstico, 246, 248
Herramienta de texto de
trazado a mano alzada,
248
Herramienta de texto de
trazado curvo, 248
Herramienta de texto de
trazado recto, 248
Herramienta Fuente RSS,
177
Herramienta Lpiz, 373
Herramienta Lazo, 287
Herramienta Lector RSS,
183
Herramienta Lnea recta,
373
Herramienta Objeto
inteligente, 209
Herramienta Pluma, 373
Herramienta Puntero, 287

Herramienta Recorte
cuadrado, 299
Herramienta Relleno, 412
Herramienta Resultados de
bsqueda del sitio, 113
Herramienta Rotar, 297
Herramienta Sombra, 388
Herramienta Transparencia,
417
herramientas de revisin
Administrador de sitios,
55
hipervnculos, 105
a cajas de luz, 128
a ventana/marco de
destino, 105
colores (global), 45
hospedaje web, 25
HTML, 76
adicin de cdigo a
pginas web, 153
asociacin de cdigo
como fragmentos, 153
creacin de pginas, 76
ID, 159
I
iconos, 115
iconos gestuales, 115
iluminacin (3D), 394
imgenes, 323
Barra multimedia, 328
colorear, 401
como fondos, 46
correccin, 340
efectos para, 340

ndice 445

emergente, 146
importar, 323
opciones de exportacin,
333
optimizacin, 333
recorte, 349
remuestreo, 334
sustitucin, 323
texto alternativo, 333
vinculacin de objetos
remotos, 369
imgenes alineadas, 323
imgenes de tipo dibujo
importar, 323
imgenes de tipo pintura,
323
importar, 323
imgenes entramadas, 323
imgenes escaneadas, 339
importar, 339
Imgenes GIF, 323
Imgenes JPEG, 323
Imgenes PNG, 323
imgenes remotas,
vinculacin, 369
Imgenes SMF, 323
Imgenes TIFF, 323
imgenes vectoriales, 323
importar, 323
Imgenes WMF, 323
importar, 323
Archivos de Excel, 277
estilos, 263
imgenes de tipo pintura
y dibujo, 323
Imgenes TWAIN, 339

texto, 237
Incluye en navegacin, 96
Indicadores, 115
insignias, 115
iTunes, 177
envo de podcasts, 181
suscripcin, 181
J
JavaScript, 155
L
lneas, 373, 377
ajustar texto a, 248
cambiar tamao, 295
configurar propiedades,
377
dibujo y edicin, 373
Lista de usuarios (objeto
inteligente), 209, 222
listas, 267
con vietas, 267
numerado, 267
listas con vietas, 267
listas de correo, 209
listas numeradas, 267
Localizador de pgina, 77
M
Mal's (carro de la compra),
186
mapa de bits, 412
rellenos, 412
transparencia, 417
mapa del sitio (motor de
bsqueda), 47

446 ndice
mapa del sitio (navegacin),
85
mapas (Google), 120
mapas de bits (vase, 323
marcos (imagen), 321
marcos (texto), 239
ajustar texto a, 243
configuracin, 241
configurar propiedades
predeterminadas, 306
control de
desbordamiento, 243
crear, 240
mrgenes, 243
marcos de imagen, 115, 321
mrgenes (marcos de texto
HTML), 243
marquesinas animadas, 353
mens emergentes, 98
metarchivos, 323
importar, 323
Minicart, 186
motores de bsqueda, 47
mapas del sitio, 53
meta-etiquetas robots, 51
robots.txt, 52
N
navegar, 37
Noticias (objeto inteligente),
209
Novedades, 16
nuevas caractersticas, 16
O
objetos, 312

alinear, 312
asociacin de cdigo, 153
cambiar tamao, 295
combinar, 302
copia, pegado y
replicacin, 292
distribuir, 312
girar, 297
mover, 295
ordenar, 311
recortar, 299
seleccionar individual,
287
seleccionar ms de uno,
290
unir, 304
valores predeterminados,
306
Objetos inteligentes, 209
administracin, 220
aplicacin de colores,
219
crear, 215
explicacin, 214
perfiles, 215
obtencin de vista previa del
sitio, 423
opciones de exportacin
(imgenes), 333
opciones de la vista de
zoom, 77
origen de la pgina, 153
P
pgina principal, 37, 77
de cambiar, 71

ndice 447

pginas, 57
aadir y eliminar, 64
asociacin de cdigo, 153
clonacin, 64
color de fondo, 45
color en la pgina, 45
global, 45
configuracin del
tamao, 71
exclusin de navegacin,
96
optimizacin, para
motores de bsqueda,
47
principal y secundario,
37, 64, 85
propiedades, 55, 71
reorganizacin, 64
seguridad, 222
seleccin y visualizacin,
77
sonido de fondo, 356
Pginas HTML
aadir, 64
pginas maestras, 57, 71
aadir, 64
asociacin, 59
varias, 59
de quitar, 64
objetos, 62
propiedades, 55, 71
varias, 59
pginas
principales/secundarias,
37, 64, 85
Pginas web y sitios, 32

Paleta de estilos de texto,


263
paneles, 132
crear personalizado, 137
desde barras de
navegacin, 98
prrafos, 261
alineacin, 261
estilos de texto, 263
formato, 261
PayPal, 189
adicin de formularios y
botones, 189
configuracin, 187
creacin de hipervnculo
con carro de la compra,
105
Minicart, 187
PDF, 434
pegado de objetos, 292
Pegar en el mismo lugar,
292
Pegar formato, 294
Pegar formato
personalizado, 294
Pelculas Shockwave Flash,
353
perfiles, 25
rea de trabajo, 25
Objeto inteligente, 215
perfiles de rea de trabajo,
25
Pestaa Carcter, 261
Pestaa Galera (Studio),
115
Pestaa Sitio (Studio), 37,
57, 64, 77, 85

448 ndice
Pestaa Transformar
(Studio), 295
Pestaa Transparencia
(Studio), 417
Pestaas de la ventana, 34
PhotoLab, 340
plantilla (diseo), 27
creacin de sitio, 27
plantilla de diseo, 27
podcasts, 177
adicin de episodios, 180
crear, 178
envo mediante iTunes,
181
suscripcin, 181
Portapapeles, 292
copia y pegado desde o
en, 292
principales caractersticas, 4
propiedades de lnea y de
relleno, 377, 380
propiedades del sitio, 40
Proveedor de servicios de
Internet (ISP), 425
Publicacin rpida, 433
configuracin, 433
publicar, 425
a web, 425
en PDF, 434
Publicacin rpida, 433
Q
QuickShapes, 380
R
radial, 412, 417

rellenos, 412
transparencia, 417
Recortar a la forma, 301
recorte (imgenes), 349
recorte de objetos, 299
registro (control de acceso),
228, 231
rellenos, 401, 412
gradiente, 412
mapa de bits, 412
slido, 401
rellenos lineales, 412
remuestreo, 334
robots, 47
uso de meta-etiquetas
robots, 51
uso de robots.txt, 52
RomanCart (carro de la
compra), 186
S
sangras, 253
seleccin de un objeto, 287
seleccin de varios objetos,
290
separadores, 91, 94
Serif
hospedaje web, 25
Recursos web, 161, 209
borrado de detalles de
cuenta, 214
inicio de sesin, 214
Smbolos rpidos, 115
sitios, 31, 32
abrir existente, 32
comenzar desde cero, 31

ndice 449

sonido, 356
adicin a pgina, 356
creacin de hipervnculo
con archivo, 105
T
tablas, 277
introduccin, 277
tamao, 295
de imgenes, 323
de la pgina, 71
de objetos, 295
tamao de punto, 261
teir, 403
texto, 239, 246, 248, 251,
261
ajustar a marcos, 243
artstico (independiente),
246
asociacin de objetos,
313
botn de barra de
navegacin, 88
cambiar tamao, 295
cambio de color o
sombreado, 401
como curvas, 333
configurar propiedades
predeterminadas, 306
desbordamiento (en
marcos), 243
editar en la pgina, 251
efectos especiales, 384,
389
en un trazado, 248
establecer sangras, 253
formato, 261

importar desde archivo,


237, 263
marco, 239
adicin, 240
HTML, 239
mrgenes, 243
uso de rellenos de
gradiente y de mapa de
bits, 412
vietas y numeracin,
267
texto alternativo (imgenes),
333
texto artstico, 246
conversin en curvas,
333
en un trazado, 248
texto de la historia, 239
flujo en la secuencia del
marco, 239
texto de trazado, 248
texto del marco, 239
tipo de fuente, 261
transparencia, 417
transparencia lineal, 417
U
unin de trazos, 304
URL absolutas, 105
usuarios (control de acceso),
226
prohibicin de acceso,
226
suspensin, 226

450 ndice
V
valores predeterminados,
306
actualizacin, 306
almacenamiento global,
306
variables, 272
varias selecciones, 290
varias ventanas, 34
ver opciones, 77
vdeo, 356
adicin de YouTube, 356
aadir, 356
creacin de hipervnculo
con archivo, 105

Vdeo de YouTube, 356


vnculos fuera del sitio, 69
Visores activos (objeto
inteligente), 209
vista previa en el navegador,
423
volver a la versin
guardada, 32
W
WebArt, 328
Z
zonas activas, 139

You might also like