2

Copyright
Esta documentación está protegida por ley. Quedan reservados todos los derechos
especialmente los de duplicación, circulación y traducción.

Ninguna parte de esta publicación puede reproducirse a través de fotocopias,

microfilm o cualquier otro procedimiento, así como tampoco transferirse a un idioma
utilizable por máquina alguna, especialmente equipos de procesamiento de datos, sin
la aprobación por escrito del propietario de los derechos de autor.

Quedan reservados todos los copyrights.

Otros nombres de productos mencionados son marca registrada de su respectivo

fabricante. Queda reservado el derecho a introducir cambios al contenido, así como
modificaciones al programa.

Copyright © Xara Group Ltd., 1994 - 2014. All rights reserved.

Xara es una marca registrada de Xara Group Ltd.
Xara Group Ltd. es una compañía afiliada de MAGIX AG.
MAGIX es una marca registrada de MAGIX AG.

Los otros nombres de productos pueden ser marcas registradas de sus

correspondientes fabricantes.

www.magix.es
 Copyright 3

Indice
Copyright 2

Asistencia técnica 13

Introducción 15
¿Qué es MAGIX Web Designer 10 Premium? 15
¿Por qué Web Designer es tan especial? 15
Una página web en 6 pasos 16
¿Cuáles son las novedades de MAGIX Web Designer 10 Premium? 17
Ayuda 21

Primeros pasos 23
Diseño del programa 23
Objetos en la página 26
Diseño web basado en objetos 27
La herramienta de selección 28
Creación de una página Web 30
Vista previa de tu página web 30
Uso de plantillas, cliparts y widgets 32
Galería de diseños 34
Catálogo de contenido online 35
Colores de la página web 36
Fondos de página web 39
Fotos 40
Texto 44
Tamaño de página 48
Guardar tu trabajo. Creación de una página Web 48
Objetos extensibles 49
Barra de herramientas de página Web 50
Grupos 51
Objetos repetidos 52
Enlaces, botones y barras de navegación 53
Tus propios iconos en las pestañas de los navegadores (favicon) 55
Herramientas de dibujo 56
Menús con clic derecho 64
Capas, MouseOver (rollover) y elementos emergentes 65
Creación de botones, banners y otros gráficos web 70
Publicar la página web 72
4

Manejo de documento 74
Iniciar un nuevo documento 74
Abrir un documento existente 74
La ventana de MAGIX Web Designer 10 Premium 75
Abrir una segunda ventana 79
Cambiar el valor de zoom 80
Desplazar el documento dentro de la ventana 81
Cambiar el tamaño de página 82
Páginas múltiples en el documento 82
Guardar el documento 85
Directorios de compatibilidad 86
Cerrar el documento 87
Copias de seguridad automáticas 88
Cuadrícula en pantalla 91
Reglas 91
Calidad de imagen 93
La tecla de restricción 93
Galerías 94
Deshacer y rehacer 102

Trabajar con objetos 103

La herramienta de selección 103
Mover objetos 106
Eliminar objetos del documento 110
Duplicar y clonar 111
Mover objetos hacia adelante o hacia atrás 112
Girar utilizando el ratón 112
Cambio del tamaño de objetos (escalar) 114
Voltear objetos 116
Extender o reducir objetos 116
Inclinar objetos 117
La herramienta de moldes 118
Ajuste 122
Difuminación (Feathering) 126
Objetos guía y líneas guía 126
Resumen de shortcuts del teclado numérico 128
Agrupar y desagrupar objetos 128
Grupos suaves (soft groups, en inglés) 130
Alineación 131

www.magix.es
 Copyright 5

Copiar estilos - pegar atributos 134

Nombrar objetos 135
Objetos repetidos 137
Pies de página y objetos que se amplían con la página. 140

Dibujar una linea o forma 143

La herramienta de dibujo libre y pincel 143
Editar líneas/formas con la herramienta de dibujo libre y pincel 146
La herramienta de líneas rectas y flechas 150
La herramienta de edición de formas 151
Extender la línea. 153
Finalizar la línea 154
Añadir un nuevo punto de control 154
Seleccionar múltiples puntos de control 155
Eliminar puntos 155
Mover puntos de control - Herramienta de edición de formas 156
Suavizar una línea 157
Restringir la línea 157
Convertir una línea recta en una curva (y viceversa) 158
Cambiar curvas 158
Unir líneas 160
Cambiar el ancho de línea (grosor) 161
Galería de líneas 161

Manejo de formas 165

Herramientas de dibujo y forma 165
Crear rectángulos y cuadrados 165
Crear círculos y elipses 166
Smartshapes 167
Edición de smartshapes 167
Crear polígonos y estrellas 168
Combinar formas 171
Convertir a formas editables 173

Trabajar con colores 174

La línea de colores 174
Aplicar colores de relleno y línea con arrastrar y soltar 176
Editar el color de un objeto 177
El editor de color 178
Colores locales y colores originales 180
Esquemas de colores originales 181
6

Creación de tus propios esquemas de colores 181

Creación de nuevos colores con nombre 182
Reemplazar colores 183
Editar colores con nombre 184
Colores normales, tintes, tonalidades y colores vinculados 187
Creación de un tinte, una tonalidad o un color vinculado 188

Trabajar con textos 190

Introducción 190
Terminología 191
La herramienta de texto 191
Menú de fuente 193
Fuentes de Google 195
Texto simple 197
Texto en una columna 198
Áreas de texto 199
Texto siguiendo una curva 203
Editar texto 204
Corrector de ortografía 206
Buscar y reemplazar 207
Cómo sincronizar el texto empleando Grupos suaves 208
Tabulaciones, márgenes y sangrías 208
Texto alrededor de objetos 212
Gráficos anclados 214
Gráficos incrustados 217
Estilos de texto 217
Aplicar estilos de texto 222
Enlaces de texto 226
Texto dentro de grupos para páginas web 226
Copiar estilos de texto 227
Copiar / Pegar texto con formato (RTF) 228
Visualizar fuentes utilizadas 228
Incrustación de fuentes en el documento 228
Incrustación de fuentes en un sitio web 229
Compatibilidad entre el navegador y el texto 229

La herramienta de relleno 231

Crear un relleno de color con gradación 231
Tipos de relleno 231
Barra de información de herramienta de relleno 233

www.magix.es
 Copyright 7

Rellenos lisos 235

Rellenos lineales 235
Rellenos circulares 236
Rellenos elípticos 237
Rellenos de mapa de bits 237
Relleno fractal 240
Gradaciones de color de varios niveles 241
La galería de rellenos 242

Transparencia 244
Aplicar transparencia plana 245
Aplicar transparencia con gradación 245
Transparencia con gradación de varios niveles 245
Tipos de transparencia 246
Optimizar 249
Perfil 251
Mapas de bits 251
Control deslizante / resolución 251
Aplicar transparencia a varios objetos 252

Sombras 253
La herramienta de sombra 253
Aplicar una sombra 253
Cambiar el color de sombra o el efecto de relleno 255
Eliminar una sombra 256
Aplicar una sombra a varios objetos 256
Selección de objetos con ayuda de la herramienta de sombras 256
Copiar sombras a otros objetos 257

Biseles 258
La herramienta de bisel 258
Aplicar un bisel 258
Aplicar un bisel a varios objetos 258
Modificar un bisel 259
Eliminar un bisel 262

Máscaras 263
Crear una máscara 263
La herramienta de máscaras 263
Editar máscara. 264
Máscaras suaves 265
8

Operaciones que utilizan la máscara 265

Copiar formas a la capa de máscara 267

Diálogo de propiedades web 268

Pestaña Enlace 269
Pestaña Página web 275
Pestaña Página 278
Pestaña Imagen 281
Pestaña Mouse-over 286
Pestaña Marcador de lugar 287
Pestaña Publicar 291
Pestaña Analytics 293

Diseño web adaptativo 294

Acerca de RWD 294
Variantes múltiples 295
Crear páginas web RWD desde las plantillas 296
Crear sitios web RWD desde sitios existentes 296
Compartir a través de variantes 297
Variantes y objetos repetidos 298
Variantes y barras de navegación 298
Variantes y fondos 299
Publicación de variantes 299

Supersites 300
Sobre las Supersites 300
Habilitar Supersites 300

Fondos de página web 303

Fondos de plantilla y cambio de color de fondo 305
Fondos fijos no desplazables 305
Usar fotos como fondo. 306
Desplazamiento de la parte superior de la página 306
Capas de fondos de página o de tablero de dibujo 307
Fondos avanzados 308

Publicar página web 310

Publicar en MAGIX Mundo Online (MOW) 310
Publicar en un alojamiento web alternativo 312
Guardar perfiles 315
Incluir página web en la galería de usuarios 316
Publicación rápida (solo archivos modificados) 316
www.magix.es
 Copyright 9

Guardar la configuración de publicación en el documento 316

Publicación de documentos web 317

Documentos web y PDF 317

Trabajar con fotos 318

Introducción 318
Imágenes de alta resolución 318
Objetos de fotos 319
Grupos de foto 320
Importación de fotos 321
Copias de memoria cero 323
La galería de mapa de bits 324
Archivos JPEG integrados 327
Calidad de visualización de fotos 328
Guardar y exportar fotos 329
Atributos de la edición de fotos 331
Editar el contorno de las fotos 331
Recortar fotos 332
Recortar fotos con una máscara 332
Herramienta Capturar pantalla 333
Colorear fotos 335
Cambiar el tamaño, rotar y reposicionar la foto dentro de su propio marco 335
Enderezar horizonte 337
Ver una foto ampliada en su tamaño completo 338
Darle el tamaño completo a una foto 338
Optimización de fotos y mapas de bits 338
Convertir objetos o dibujos a mapas de bits 341
Documentos fotográficos 342
Edición de archivos de fotos 343

La herramienta de fotos 344

Introducción 344
Utilización de la herramienta de fotos 344
Funciones comunes para fotos 345
Herramienta de optimización 346
Herramienta de corte 349
Notas para la herramienta de foto 352
La herramienta de ojos rojos 353
Efectos en tiempo real 355
Cambio de tamaño teniendo en cuenta el contenido 358
10

Creación de panorámicas 363

Herramienta de extrusión 3D 366

Extrudir una forma 366
Barra de información de Herramienta de extrusión 367
Texturas y fotos 370
Extrudir texto 370
Copiar atributos de una extrusión 3D 371
Insertar sombras detrás del objeto 371

Barras de navegación 372

Usar de barras de navegación de plantillas 372
Diálogo Propiedades de la barra de navegación 373
Barra de navegación del sitio 375
Barras de navegación de botón único 377
Botones y menús 378
Actualización de la barra de navegación en todas las páginas 382
Edición en el lienzo 382
Cambio de la fuente de los botones de la barra de navegación 382
Importación e inserción de barras de navegación 383
Creación de barras de navegación propias 383

Presentaciones como páginas web 385

Sobre las presentaciones 385
Pasos y capas 385
La barra de herramientas "Presentación" 387
Creación de una presentación 387
Manejo de los pasos de presentación 391
Agregado de nuevas páginas de presentación 392
Creación de listas con números y viñetas 392
Eliminar páginas de presentación 393
Enlaces al paso siguiente/anterior 393
Aplicación de transiciones a pasos de presentaciones 393
Aplicación de transiciones a páginas de presentaciones 394
Información de presentación avanzada 395
Sesiones remotas de presentación 395

Widgets de sitios web 398

Widgets y marcadores de posición - todo automático 398
Widgets de la galería de diseños 399
Agregado de archivos de películas y animaciones 402

www.magix.es
 Copyright 11

Widgets de otros sitios de widgets 404

Cambio de tamaño de widgets 405
Inserción manual de marcadores de posición para widgets 406

Galería de páginas y capas 407

La galería de páginas y capas 407
Páginas 410
Capas 410
Operaciones de capa 413
Capas especiales 415
Ocultar capas 416
Modo Solo 416
Bloquear capas 416
Mostrar todo y desbloquear todo 417
Mover objetos entre capas 417

Animaciones en Flash 418

Introducción 418
Principios básicos 421
Tu primera animación 422
Exportación de un archivo Flash 423
Exportación de animaciones como AVI 425
La galería de frames de animación 426
Fotos 428
Duración de frames para películas Flash y pasos intermedios 430
Recortar y cortar 431
Velocidad de la animación 432
Fluidez de la animación (smoothness) 433
Rotación 433
Grupos 435
¿Qué funciones de MAGIX Web Designer 10 Premium son compatibles con
Flash? 435
El color se transforma — el color de la animación cambia 438
Transparencia 438
URL en Flash 439
Funciones de Flash avanzadas 439
Resumen de animación de MAGIX Web Designer 10 Premium Flash 441
Crear GIF animados 442
Propiedades de GIF animados 443

Importación y exportación 446

12

Indicaciones generales sobre la exportación e importación 446

Web Designer y HTML5 446
Importar y exportar formatos de archivo compatibles 447
Importación de archivos 449
Exportación de archivos 453
Resumen del diálogo de exportación GIF, PNG y JPEG 456

Imprimiendo 462
Mostrar bordes de impresión 462
Seleccionar y configurar una impresora 462
El diálogo de impresión 463
Opciones de impresión: Pestaña Salida 465
Opciones de impresión: Pestaña Diseño de la impresión 467

Personalización de Web Designer 469

Cambio del documento de plantilla en blanco 469
Opciones del menú "Herramientas" 469
Pestaña General 470
Pestaña Cuadrícula y regla 474
Pestaña Ratón 475
Pestaña Tamaño de página 477
Pestaña Copias de seguridad 478
Pestaña efectos y plug-ins 478
Barras de control 479

Menús y shortcuts de teclado 483

Introducción 483
Menú Archivo 483
Menú Edición 488
Menú Arreglo 491
Menú Insertar 494
Menú Herramientas 495
Menú Compartir 497
Menú Ventana 498
Menú Ayuda 501
Shortcuts de teclado 503

Si aún tienes preguntas... 509

Ayuda del programa (breve) 509
Manual en PDF 509

Index 510
www.magix.es
 Asistencia técnica 13

Asistencia técnica
Estimado usuario de MAGIX:

Nuestro objetivo es ofrecerte en todo momento una ayuda rápida, cómoda y

resolutiva. Por ello ponemos a tu disposición una amplia oferta de servicios:
• Asistencia web ilimitada:
Como cliente MAGIX registrado, dispones de asistencia web ilimitada a través
del portal de servicios de MAGIX de diseño sencillo support.magix.net. Aquí
tienes acceso a un asistente de ayuda inteligente, preguntas frecuentes, parches
e informes de experiencias de usuarios que se actualizan continuamente.
La única condición es que registres el producto en www.magix.es.
• La plataforma de intercambio multimedia como punto de ayuda:
Como cliente MAGIX puedes acceder a la Multimedia Community
www.magix.info de forma gratuita e ilimitada. La plataforma de intercambio
multimedia reúne a más de 120.000 miembros y ofrece la oportunidad de hacer
preguntas acerca de los productos MAGIX o buscar preguntas para temas
específicos a través de la función de búsqueda. Además de preguntas y
respuestas, encontrarás un glosario, vídeos de ejemplo (tutoriales) y un foro de
debate. Los numerosos expertos que encontrarás en www.magix.info te
garantizan respuestas rápidas, incluso en pocos minutos.
• Asistencia por correo electrónico para productos MAGIX:
Para cada nuevo producto de MAGIX, recibirás a partir de la fecha de compra y
de forma automática, 12 meses de soporte técnico gratuito vía e-mail.
Asistencia Premium por correo electrónico:
Para asistencia especial o para asistencia técnica sobre problemas de hardware
de productos no relacionados con MAGIX, puedes optar por un servicio de
asistencia por e-mail Premium. Para ello, accede a http://support.magix.net en
la página de asistencia de MAGIX y haz clic tras el iniciar sesión en el "Adquirir
código de acceso". El servicio abarca un caso de un problema específico hasta
que este se resuelva y no se limita a un solo e-mail.

Ten en cuenta: para poder utilizar la asistencia por e-mail Premium y la asistencia
por e-mail gratuita para productos mediante Internet, debes tener registrado tu
programa MAGIX con tu número de serie. El número de serie de tu producto se
encuentra en la cubierta del CD o en la parte interior de la caja del DVD.

• Servicio telefónico de atención al cliente:

Aparte de los numerosos servicios gratuitos podrás utilizar el servicio de pago
de atención telefónica al cliente.

Un resumen de los números de teléfono de la asistencia técnica lo puedes encontrar

aquí:

http://support.magix.net
14

Correo: MAGIX Development Support

01194 Dresden
Alemania

Por favor, ten preparada la siguiente documentación al realizar tu llamada:

• ¿Cuál es el programa MAGIX (versión) que estás utilizando?
• ¿Qué sistema operativo utilizas?
• ¿Cuál es el nombre y resolución de la tarjeta gráfica?
• ¿Cuál es el nombre de la tarjeta de sonido? ¿O estás utilizando el sistema de
sonido integrado de tu ordenador?
• Para software de vídeo: ¿cuál es el nombre de la tarjeta de vídeo o tarjeta
Firewire?
• ¿Cuál es el tamaño de la memoria RAM?
• ¿Qué versión de DirectX tienes instalada?

MAGIX Ventas

Número de teléfono: +34 911 875 676

MAGIX Ventas está disponible los días laborales para las consultas y problemas
siguientes:
• Pedidos
• Asistencia de producto (antes de la compra)
• Pedidos de actualizaciones
• Devoluciones

www.magix.es
 Introducción 15

Introducción
Es evidente que la gran mayoría de páginas web tienen una naturaleza gráfica. La
presentación de tu página web es muy importante. Tú deseas una página web con
una imagen competente y profesional. Para crear tu página, creemos que no es
necesario usar gran cantidad de herramientas, tanto para la edición gráfica como para
HTML. Creemos que debes tener libertad total para incluir cualquier tipo de texto,
gráfico o foto en cualquier lugar de la página.

La creación de páginas web debería ser como la creación de archivos PDF: no

deberías tener la necesidad de saber qué pasa 'bajo el capó'. En el caso de los archivos
PDF, no debes editarlos directamente. Tampoco deberías tener la necesidad de saber
sobre HTML al crear tu página web.

¿Qué es MAGIX Web Designer 10 Premium?

MAGIX Web Designer 10 Premium es una solución completa para el diseño de
páginas web. Te ofrece la libertad de elegir si deseas realizar el diseño de tu página
web desde cero o si deseas personalizar cualquiera de las numerosas plantillas del
programa a tu gusto. Gracias a los años de experiencia con la tecnología "Xtreme",
también es posible crear animaciones Flash, editar fotos, y optimizar o cambiar los
esquemas de color de las páginas web con sólo unos clics. También puedes obtener
una vista previa de tu página web y subir tu proyecto directamente desde MAGIX
Web Designer 10 Premium a un servidor FTP para pasar de la creación a la
publicación en pocos segundos. Gracias a las funciones prácticas, como la inserción
de objetos de marcador de posición, tu sitio web obtendrá rápidamente un aspecto
profesional y único al mismo tiempo.

¿Por qué Web Designer es tan especial?

Web Designer es único porque es la única herramienta de diseño web de forma libre
que permite una verdadera libertad al diseñar una página web cuyo resultado es lo
que ves. En otras palabras, puedes posicionar el texto, gráficos y fotos en cualquier
lugar de la página, configurar cualquier tamaño, ángulo, superposición, transparencia,
etc. y Web Designer producirá una página HTML precisa que funcionará
perfectamente.

Web Designer puede hacer cosas que se consideran casi imposibles con otros
software de autoría web, como hacer fluir el texto alrededor de fotos o formas
irregulares. Incluye herramientas avanzadas de vectores gráficos para que puedas
dibujar lo que desees: desde formas simples hasta logos y gráficos complejos.
También cuenta con optimización automática de gráficos (no sólo produce imágenes
de resolución optimizada, sino que también detecta los elementos que se repiten en
toda la página web, lo que produce páginas más rápidas y más optimizadas).
16

Es compatible con capas CSS con características avanzadas, como transparencia

(incluyendo transparencia con gradación), efectos mouse-over y más. Crea páginas
web HTML totalmente compatibles con los exploradores, las plataformas y XHTML.

Además, Web Designer es probablemente la herramienta de autoría web más fácil de

aprender.

Web Designer está pensado para diseñadores gráficos que no quieren aprender
HTML ni lenguajes de scripting. Para diseñadores gráficos, es la herramienta
prototipo para páginas web rápidas perfecta.

También está pensado para principiantes que simplemente quieren disponer de la

forma más fácil de crear páginas web de aspecto profesional.

Web Designer no incluye herramientas de programación, edición de scripts ni una

"vista HTML". Nuestra filosofía de diseño es la siguiente: no necesitas saber el
lenguaje de programación de PDF para crear un PDF. Por lo tanto, tampoco debes
conocer nada acerca de HTML o Javascript para poder crear páginas web geniales.

Una página web en 6 pasos

Para quienes no tienen mucha paciencia (la mayoría de nosotros), se pueden
descubrir las ventajas principales de Web Designer, siguiendo sencillamente las
instrucciones en el documento inicial que se abre cuando comienzas a usar Web
Designer. Se trata tanto de una introducción básica como de una página web real con
la que puedes experimentar. También puedes encontrar este documento de ejemplo
en la galería de diseños.

Haz clic en botón, abre la categoría INTRODUCCIÓN y haz doble clic en el primer
documento.
Aquí puedes averiguar como cambiar los colores de la página web, corregir el texto,
arrastrar y soltar fotos, mover objetos alrededor de la página y más.

Deshacer
Recuerda que puedes deshacer cualquier cambio, utilizando el botón de
deshacer o Ctrl+Z. Si mantienes pulsado el botón puedes deshacer todas las
acciones hasta el comienzo.

www.magix.es
 Introducción 17

¿Cuáles son las novedades de MAGIX Web

Designer 10 Premium?
Si ya tienes Web Designer 9 (o una versión anterior), encontrarás numerosas nuevas
características y contenidos en Web Designer 10. Sabemos que muchos clientes
Premium no necesitan revisar la función Diseño Web adaptativo, pero avanza hasta la
vista general de las otras nuevas funciones y contenidos y encontrarás muchas otras
novedades que te permitirán ahorrar tiempo y hacer que tu sitio destaque entre los
demás.

Autoría y publicación web

Función de diseño web adaptativo (RWD por sus siglas en inglés):
solo para Web Designer Premium.
Dado que cada vez es más popular realizar búsquedas en navegadores a través de los
móviles y tabletas, es necesario crear sitios diseñados a la medida de las necesidades
de sus usuarios. Hasta ahora la solución implicaba crear múltiples páginas y un buen
conocimiento de Javascript. Web Designer 10 presenta una solución RWD que te
permite crear un único archivo que contenga variantes de tu página en anchos
diferentes para que tu sitio web responda de forma dinámica al tamaño de pantalla
del visor, presentando el diseño más apropiado para su dispositivo. Y como es de
esperar en Web Designer, no tienes que hacer ningún tipo de codificación.

En otras palabras, puedes crear múltiples variantes (p. ej. escritorio, tableta, teléfono)
con contenido compartido (textos, fotos, gráficos) pero con la capacidad de adaptar
libremente el diseño de las variantes para ajustarse al tamaño del dispositivo. Puedes
controlar totalmente el diseño de las variantes, lo que asegura un resultado de calidad
para móviles y tabletas. Web Designer exporta un único archivo HTML que puede
cambiar de forma dinámica de un diseño a otro dependiendo del tamaño de la
pantalla del visor.

Variantes de temas normales y de móvil

18

Smartshapes
Una manera increíblemente rápida de crear y editar algunas de las formas requeridas
más comunes (por ejemplo, globos de diálogo, flechas o segmentos de gráfico de
tarta) con resultados de alta calidad garantizados. Si no tienes tiempo (o la habilidad)
para dominar las herramientas de dibujo, ya no necesitas recurrir a clipart. Aquí hay
algunos ejemplos de la librería smartshapes (disponibles por Internet, por lo que se
añadirán más formas hasta finales de año) que se pueden personalizar fácilmente:

Ejemplo de "burbuja de diálogo" smartshape. Edita la forma, el tamaño, el texto, la dirección, el

ángulo, la curva de la punta, el color, etc. simplemente arrastrando el control deslizante por la
forma.

Variaciones de uno de los diseños de flecha de smartshape. Tan solo arrastra para ajustar el
ángulo, la duración, la curva y el grosor. Así de fácil

Supersites de página única (solo en Web Designer Premium)

Si tienes una página pequeña o muy concentrada y estás esforzándote por hacerla
destacar entre las demás, te va a encantar nuestro nuevo concepto de páginas únicas
trucadas.

En lugar de presentar tu sitio web como una web de páginas separadas al modo
tradicional (en el que hay que hacer clic en un enlace para navegar de una página a
otra) ahora tienes la opción de presentar el sitio web completo como un único
documento con desplazamiento rápido (horizontal o vertical) usando el

www.magix.es
 Introducción 19

desplazamiento o deslizando el dedo por la pantalla para navegar. O puedes presentar

páginas de una en una al modo tradicional pero con una de las nuevas transiciones de
página animadas supersuaves (ver abajo) que se activan con el desplazamiento,
deslizando el dedo por la pantalla o con clics.

Las posibilidades son infinitas y los ejemplos incluyen promociones de eventos,

portafolios, reclamos para nuevos productos, captadores de fondos, tutoriales breves
o currículums. Es estupendo para aquellos sitios únicos (una fuente, una plantilla, un
coche a la venta...) y puede ser una opción más atractiva a la vista e interactiva que un
documento PDF (ver el ejemplo en el menú). Sea cual sea tu aplicación, esta función
es perfectamente apropiada para todos aquellos usuarios que navegan ahora con
tabletas (siendo aun así totalmente compatible con navegadores normales).

Menú Insertar nuevo

Un nuevo menú Insertar de alta calidad que mejora considerablemente la facilidad
con la que puedes insertar elementos clave en tu documento (p. ej. insertar nuevas
páginas o insertar números de página) incluidas algunas opciones nuevas, por
ejemplo, "Insertar imagen de cámara".

Nuevas transiciones de páginas para presentaciones y páginas web

(solo en versión Premium)
V10 ofrece mejoras de efectos de transición de página significativas que incluyen
efectos en 3D, con aceleración de hardware, superfluidas y totalmente libres de
parpadeos. Son ideales para presentaciones, pero también pueden usarse con
grandes resultados en Supersites.

Esta captura de pantalla muestra una

transición media de una a otra. En este
caso la página está haciendo una rotación
en 3D, una página se introduce desde la
derecha mientras la otra sale por la
izquierda.

Hay muchos tipos de transiciones

animadas entre las que puedes elegir.

Adaptar tamaño
En lugar de diseñar páginas web de presentación para tamaños de pantalla
específicos, las páginas ajustan su tamaño de forma automática e inteligente para
adaptarse a cualquier tamaño de navegador (o puedes configurarlas para pantalla
completa). Ten en cuenta que también puedes usarlo para páginas web, pues puede
ser una buena opción cuando, como en el caso de las presentaciones, son sitios
pequeños con páginas cortas (podría estar bien con una superficie Supersite, por
20

ejemplo, de forma que cada página adaptaría su tamaño de forma automática para
adaptarse al tamaño de la ventana del navegador).

Páginas con protección por contraseña de MAGIX Online World

Si publicas tu sitio web a través de MAGIX Online World (el alojamiento MOW
gratuito está incluido en todas las versiones de Web Designer) ahora puedes proteger
fácilmente con contraseña esa página. Incluye todas las funciones para gestionar tu
lista de autorización.

Alojamiento "M" en MAGIX Mundo Online gratuito incluido (solo

versión Premium)
Si has adquirido Web Designer Premium, tienes la opción de alojamiento "M" en
MAGIX Mundo Online gratuito incluida por un año (por valor de 1,99 euros al mes).
Esto incluye alojamiento web gratuito de 2GB, un nombre de dominio gratuito (p. ej.
tunombre.com, .co.uk o .es, etc.) y una dirección de e-mail asociada con base en la
web que se puede asociar al nombre del dominio (5 buzones de correo diferentes).
Los usuarios de Premium V9 ahora obtienen un vale que les permite prolongar su
paquete de alojamiento gratuito M un año.

Contenido
Catálogo de contenido online
La extensión online de la galería de diseños te ofrece navegación y búsqueda de
contenido mejoradas.

www.magix.es
 Introducción 21

Nuevas plantillas
Web Designer Premium se ha ampliado con 10 nuevos y modernos temas generales
de páginas web (normalmente a la venta en paquetes web de 10 € cada uno, por lo
que ahorras 100 €) con más de 16 diseños, incluidas las nuevas variantes para
móviles. Web Designer también se amplía con 5 nuevos temas generales de página
web.

Nuevos widgets
• Nuevos widget de barra de desplazamiento de foto usuales (solo para Premium)
• Nuevos widget para redes sociales: logotipo de Instagram, snapwidgets de
Instagram (inserta tus fotos Instagram en una página web como una galería de
fotos) logotipos de Pinterest y Linkedln.

Otras pequeñas mejoras

• Rotación automática de fotos al importar: puede que hayas notado últimamente
que tus fotos rotaban de forma aleatoria cuando las importabas desde algunos
dispositivos nuevos. Web Designer lleva a cabo una detección y rotación
automática cuando es necesario para evitar este inconveniente.
• Importación mejorada de archivos Word y PDF: se ha optimizado la importación
de archivos Word. El filtro de importación de archivos PDF se ha reemplazado
con uno nuevo con el que obtendrás mejores resultados.
• Otros cambios de presentación (solo para Premium): las nuevas transiciones de
página representan una gran mejora para las presentaciones, pero también hay
algunos otras pequeñas mejoras de uso en el proceso de creación y vista de
pasos, además de dos nuevas plantillas "vacías" de relación de aspecto (pantalla
panorámica 16x10 y tradicional 4:3).

Ayuda
Si necesitas ayuda para el manejo de este programa, a continuación encontrarás
información que puede serte útil:
• Ayuda de programa: selecciona "AYUDA DE MAGIX WEB DESIGNER 10 PREMIUM"
del menú "AYUDA" para abrir la ayuda de Web Designer, que contiene cientos de
páginas de información.
• Barra de estado: intenta leer el texto de la barra de estado en el extremo inferior
de la ventana principal de MAGIX Web Designer 10 Premium. Siempre ofrece
una descripción de las acciones actuales y de sus efectos (incluso durante los
arrastres), lo que resulta ideal para aprender a usar las herramientas de MAGIX
Web Designer 10 Premium. También cuando colocas el cursor sobre los botones
y los controles, el programa te informa sobre lo que hacen. Para más detalles,
consulta la barra de estado.
• Consejos para herramientas (tooltips) (en la página 22): si colocas el cursor del
ratón sobre un botón o control por un momento, aparecerá un mensaje
informándote de su función.
• Menús: si deseas saber cuál es la función de un menú, selecciónalo y pulsa "F1".
22

• Cajas de diálogo: si quieres saber lo que hace una caja de diálogo o cómo usarla,
haz clic en AYUDA.
• Vídeos: usa la opción del menú "AYUDA" > "PELÍCULAS ".

Información de documento
"ARCHIVO" > "INFORMACIÓN DE DOCUMENTO" muestra información sobre el
documento seleccionado como el tamaño o cualquier fuente utilizados. Esta es una
buena forma de comprobar si te falta alguna fuente necesaria que pudiera impedir
que el documento se visualice correctamente.

Cualquier texto que introduzcas en el campo de comentario se guardará como parte

del archivo. Este comentario se mostrará siempre que abras el diálogo de información
de documento.

Consejos de herramientas
Cuando te desplazas sobre un botón, el
consejo de herramienta te informa la
función de ese botón.

Acerca de Web Designer

Escoge AYUDA > ACERCA DE MAGIX WEB DESIGNER 10 PREMIUM . Esto te mostrará
información general sobre el programa. Si contactas con la asistencia técnica de Xara,
es posible que se te solicite esta información.

www.magix.es
 Primeros pasos 23

Primeros pasos
Esta sección te ofrece una idea general de las funciones principales de Web Designer.
Las secciones siguientes te darán más detalles sobre cada una de las herramientas.

Diseño del programa

Barra de información: cambia con cada herramienta

Barra de herramientas de la página web
Zoom
Galería de diseños (barra de galerías)
Galería de páginas y capas (barra de galerías)
Herramienta de selección
Herramienta de edición de fotos
Herramientas de dibujo
Herramienta de texto
Herramienta de sombra
Pestañas para todos los documentos abiertos: el icono identifica
el tipo de documento.
Línea de color
24

Nota: todas las barras de información de Web Designer han mejorado la

renderización de texto para facilitar la visualización, siempre que tengas habilitado el
texto ClearType en el panel de control de Windows.

En la barra superior hay cuatro botones relacionados con las funciones de la página
web. Tres de estas opciones tienen barras desplegables que se muestran cuando
colocas el cursor del ratón sobre ellas y te ofrecen más funciones.

Exportar y previsualizar la página web

Propiedades del enlace
Opciones de página web
Exportar

Coloca el cursor sobre cada botón de la barra desplegable para obtener un consejo de
herramienta con la descripción del botón.

Hay dos maneras de crear una página web. Se puede comenzar con una plantilla
diseñada previamente y personalizarla con tus propios textos, fotos y esquema de
colores. O se puede crear una página web desde cero, colocando todos los elementos
requeridos, texto, gráficos y fotos en el lugar que quieras.

Nota: por defecto, cuando Web Designer abre un documento nuevo, muestra solo
una página. Para ver todas las páginas en tu documento de página web, haz clic
derecho en una página y selecciona VISTA DE PÁGINA MÚLTIPLE . Ahora puedes
desplazarte de arriba a abajo por la ventana de Web Designer para ver todas las
páginas en el documento.

Zoom y desplazamiento de la página

Estas funciones comunes se hacen de manera sencilla:
• Para ampliar o alejar con el zoom, mantén "Ctrl" pulsado y utiliza la rueda del
ratón
• Para desplazar la página, presiona la rueda del ratón y muévelo (la rueda
también funciona como un botón)

www.magix.es
 Primeros pasos 25

• Para desplazarte por la página usa la rueda del ratón (o las barras de
desplazamiento, claro)

Los documentos web se visualizan por defecto en

modo de página única y los documentos de
impresión en modo de vista multipágina. Cambia
de modo de visualización haciendo clic derecho
en la página o tablero de dibujo y seleccionando o
desactivando VISTA MULTIPÁGINA del menú
desplegable. A la izquierda se muestra un ejemplo
de vista multipágina.

Puedes arrastrar y soltar elementos entre páginas.

Cuando haces cambios de color de tema en todo
el documento, puede verse como los cambios
afectan a todas las páginas.

La página actual está marcada con corchetes en

las cuatro esquinas.

En este ejemplo puedes ver algunos elementos que se han emplazado en el área del
tablero de dibujo junto a las páginas. El área del tablero de dibujo es útil como lugar
para mantener temporalmente gráficos de trabajo, fotos u otros objetos. Estos objetos
no son exportados como parte de tu página web, a menos que los sitúes en la capa
especial del fondo del tablero de dibujo. En este caso se exportan, ya que se asume
que quieres que formen parte del fondo de tu página web.

Barras desplegables
Algunas herramientas de la barra de herramientas principal están agrupadas en un
solo icono. Estos iconos cuentan con un pequeño triángulo indicador en la esquina
inferior derecha y, cuando pasas el cursor del ratón por estos iconos, aparece una
barra desplegable. La barra contiene otros iconos de herramientas que pertenecen a
dicho grupo. Simplemente, mueve el cursor del ratón hasta una de las opciones para
ver un consejo de herramienta y luego selecciona la herramienta que quieras usar.

Si seleccionas una herramienta modal de una barra desplegable, esta herramienta se

convierte en la herramienta principal para ese grupo. Ahora verás ese icono señalado
en la barra de herramientas principal.

También hay algunas barras desplegables en la barra de herramientas de la parte

superior de la ventana. Estas se utilizan para agrupar operaciones relacionadas en un
solo icono. Esto las hace accesibles y no ocupan demasiado espacio en la barra.

Consulta el capítulo Personalización en el manual en pdf para más información sobre

las barras desplegables.
26

Objetos en la página
Si personalizas una plantilla o creas tus propios gráficos desde cero, puedes girar,
redimensionar y posicionar cualquier cosa que desees en la página. Puedes
redimensionar la página fácilmente al tamaño que quieras y añadir nuevas páginas
web a tu gusto. Ciertas características, como el cambio de esquemas de colores,
funcionan a través de todas las páginas simultáneamente.

Estos son los tipos de elementos de página básicos:

• Texto: al usar la HERRAMIENTA DE TEXTO puedes crear todo tipo de títulos y
columnas de texto e incluso bloques de texto que fluyen de un bloque a otro.
También puedes crear listas con viñetas o numeradas. La barra de información
de la HERRAMIENTA DE TEXTO proporciona controles de fuente, tamaño,
espaciado de línea y más. Puedes redimensionar el texto usando la
HERRAMIENTA DE SELECCIÓN o seleccionando el texto de la manera normal y
escogiendo un punto o tamaños de píxeles alternativos. También puedes incluso
girar el texto desde cualquier ángulo, y usando CONTORNEAR TEXTO (haz clic
derecho en un objeto para ver esta opción) puedes hacer fluir el texto
automáticamente alrededor de objetos (p. ej. fotos) en la página.
• Gráficos: cualquier tipo de logo, título y la mayoría de los botones que aparecen
en tu página web son gráficos. Web Designer es un programa de gráficos
vectoriales, lo que significa que puedes corregir la forma, girar y redimensionar
tus objetos gráficos sin pérdida de calidad (a diferencia de herramientas de
edición y retoque fotográfico como Photoshop). Y aunque no hay ningún
estándar de gráficos vectoriales para páginas web (para web todos los gráficos
tienen que ser formatos JPG, GIF o PNG) Web Designer crea automáticamente
el formato y resolución adecuados. Por ejemplo, si quieres crear un panel de
color para colocar detrás tu texto, lo harías dibujando un rectángulo o el objeto
de rectángulo con esquinas redondeadas en la página, y colocándolo detrás del
texto. Cuando exportas tu página web, se convierte automáticamente en una
imagen gráfica PNG con la resolución adecuada.
• Fotos: hay pocas páginas web que no contengan algún tipo de foto. MAGIX
Web Designer 10 Premium tiene una gran gama de herramientas de retoque de
fotografías. Puedes arrastrar y soltar fotos directamente desde tu cámara o
desde la ventana del explorador de archivos, girarlas, optimizarlas, recortarlas, y
Web Designer genera automáticamente la resolución de imagen JPG adecuada.
Sustituir fotos existentes en plantillas es tan fácil como arrastrar y soltar, y
puedes cambiar sencillamente el tamaño y el ángulo de las fotos "dentro" de su
marco. Puedes crear fácilmente fotos en miniatura sobre las que puedes hacer
clic para que se abra una versión ampliada y puedes incluir opcionalmente
controles de galería que permiten a los visitantes navegar por tus fotos o ver un
pase de fotos automático.
• Marcadores de posición: estos son objetos gráficos en la página que
representan el tamaño y la posición de "widgets" dinámicos como animaciones
flash, películas o formas. Al exportar tu sitio, el gráfico del marcador de posición
es reemplazado por el código requerido para hacer que el widget funcione de

www.magix.es
 Primeros pasos 27

modo que el widget aparece en la misma posición en tu página. Consulta el

capítulo Widgets de página web (en la página 398) en el manual en pdf para
más detalles.

Diseño web basado en objetos

Todo los tipos de elementos descritos más arriba se refieren generalmente a objetos.

Uno de los beneficios particulares de Web Designer es la libertad total para

posicionar cualquier objeto en cualquier lugar de la página, que luego se respetará con
exactitud en la página web final.

La HERRAMIENTA DE SELECCIÓN puede ser utilizada para seleccionar cualquier

objeto en la página y para mover (simplemente arrástralo), redimensionar o
rotar los objetos.

Puedes ajustar el orden de las capas (es decir , si un objeto aparece al frente o detrás
de otro/s en la página), haciendo clic derecho y seleccionando ARREGLO o utilizando
las opciones del menú ARREGLO. Con la HERRAMIENTA DE SELECCIÓN puedes
redimensionar objetos estirándolos desde las esquinas. Puedes rotar cualquier objeto
arrastrando desde dentro de los controles deslizantes de las esquinas. Y aunque las
páginas web no admiten textos rotados, Web Designer sabe cómo crear
automáticamente la imagen gráfica apropiada para que la página se vea siempre bien.

Para agregar texto a tu página, selecciona la HERRAMIENTA DE TEXTO y haz clic

en cualquier lugar de la página y empieza a escribir el texto.

También puedes crear columnas de texto, pulsando y arrastrando horizontalmente la

HERRAMIENTA DE TEXTO , o arrastrando diagonalmente las áreas de texto. Ve a la
sección de texto (en la página 217) en el manual en pdf para más detalles y al capítulo
Manejo de texto (en la página 190) para una información detallada acerca de las
funciones de texto de MAGIX Web Designer 10 Premium.

Puedes usar herramientas de dibujo para crear rectángulos normales

o con esquinas redondeadas, círculos y elipses, y cualquier tipo de
forma que desees, utilizando la HERRAMIENTA DE EDICIÓN DE FORMA .
Ve a la sección herramientas de dibujo (en la página 56) en el
manual en pdf para más detalles.

Orden de los objetos

Todos los objetos en la página están colocados uno encima del otro. El objeto que se
ha dibujado o creado en último lugar está siempre arriba del todo, es decir delante de
cualquier otro. Puedes ajustar la posición de colocación con clic derecho y
seleccionando ARREGLO o usando las opciones del MENÚ ARREGLO .
28

Por ejemplo, cuando dibujas un nuevo rectángulo siempre aparece para cubrir todos
los objetos que estén detrás. Con clic derecho y seleccionando ARREGLO o
presionando Ctrl+B (o el menú ARREGLO > LLEVAR ATRÁS) el objeto se mueve detrás
de todo lo demás. De modo similar, Ctrl+F trae cualquier objeto seleccionado hacia
delante, quedando delante de todo lo demás.

Hay una complicación añadida: las capas. Todos los objetos se recopilan en capas con
nombres y cada capa puede activarse o desactivarse para mostrar u ocultar todo en
esa capa. Consulta la sección de capas (en la página 65) en el manual en pdf para
más detalles.

La GALERÍA DE PÁGINAS Y CAPAS te permite ver fácilmente y ajustar el orden de

apilamiento de los objetos y capas. Los objetos se muestran en orden de adelante
hacia atrás en la galería. Lee el capítulo Galería de páginas y capas (en la página 407)
en el manual en pdf para más información.

La herramienta de selección
Esta herramienta es de uso general y te permite seleccionar, mover,
redimensionar y girar todos los objetos en tu página web.

Puedes hacer todas estas cosas simplemente estirando los objetos en la página, o con
los controles deslizantes de selección alrededor del objeto, o puedes introducir
valores numéricos precisos. El objeto seleccionado con 4 u 8 controles deslizantes en
su exterior y la barra de estado, en la parte inferior de la pantalla, también te indica
qué objeto ha sido seleccionado

Arrastra desde cualquier esquina de los controles deslizante para redimensionar un

objeto. Arrastra desde dentro de los controles deslizantes (ver a la izquierda) para
girar. Los rectángulos y rectángulos con esquinas redondeadas tienen ocho controles
deslizantes para poder arrastrarlos y redimensionarlos. Otros objetos, como grupos,
bloques de texto o fotos, poseen sólo 4 controles y no pueden ser estirados (porque
se deformarían).

www.magix.es
 Primeros pasos 29

Desplazar objetos
Las teclas de flechas pueden ser utilizadas para desplazar los objetos seleccionados
píxel a píxel. Si mantienes pulsada a la vez la tecla Shift, los objetos se desplazan de
10 en 10 píxeles.

Girar objetos
Hay dos modos de hacer girar un objeto. O bien, haciendo clic otra vez sobre el
objeto para que los controles de selección cambien a controles de rotación, con los
que podrás estirar o hacer girar el objeto. O, cuando se ven los controles de esquinas,
moviendo el cursor de ratón dentro de los controles de esquinas hasta que veas que
el cursor cambia a un indicador de rotación , entonces también podrás arrastrar para
hacer girar el objeto seleccionado.

También puedes rotar casi todo en Web Designer, incluyendo fotos, títulos, bloques
de texto, y simplemente funcionará. Debido a que los navegadores web no pueden
mostrar texto en ángulo, Web Designer convertirá automáticamente cualquier texto
rotado en un gráfico.

Barra de información
Cuando un objeto es seleccionado, la barra de información en la parte superior de tu
documento muestra todos los controles relevantes para la herramienta actual. Esta
barra cambia según la herramienta seleccionada. Esta es la barra de información de la
herramienta de selección:

La barra de información justo encima de tu documento, te muestra los controles para la

herramienta seleccionada.

Puedes introducir valores numéricos en cualquier campo, p. ej. para reducir el tamaño
de un objeto un 20%, puedes introducir 80% en el campo del ancho (que es un
tamaño porcentual). Con el candado pequeño determinas si los cambios de ancho y
alto se cambian a la vez.

Copiar objetos
Puedes utilizar las típicas opciones de "EDITAR" > "COPIAR" ("Ctrl + C") y "EDITAR" >
"PEGAR" ("Ctrl + V") o hacer clic derecho en un objeto y seleccionar COPIAR , aunque
una forma muy rápida de copiar un elemento es, simplemente, arrastrarlo con el
botón derecho del ratón.

También puedes copiar y pegar una página en cualquier parte del documento desde el
documento actual o en otro documento: ver Copiar y pegar (en la página 84) páginas.
30

Creación de una página Web

Hay dos modos de crear una nueva página web. Se puede comenzar con una plantilla
prediseñada y luego personalizarla con textos, fotos y combinación de colores. O
creando una página web desde el principio, colocando todos los elementos
requeridos, texto, gráficos, fotos y marcadores de posición en el lugar que quieras de
la página.

Los marcadores de posición son objetos gráficos en la página que serán sustituidos en
la página web final por una serie de elementos de página web como animaciones
Flash, vídeos de YouTube, mapas interactivos, fragmentos de HTML y widgets de
todo tipo. Lee las secciones posteriores en el correspondiente capítulo del manual en
pdf para más información acerca de los marcadores de posición.

Vista previa de tu página web

Cuando creas tu página web en Web Designer los documentos con los que trabajas
muestran una vista previa exacta estática, pero para comprobar el comportamiento
de los popups, efectos MouseOver y Flash, es necesario utilizar la vista previa de
navegador.

Existen dos opciones de vista previa en la barra de herramientas web.

VISTA PREVIA DE PÁGINA : exporta y muestra la vista previa de la página

actual únicamente. Esta opción es útil si cuentas con un sitio muy
grande que demora mucho en exportarse en su totalidad. De esta
forma, puedes ajustar rápidamente la vista previa de la página en la que
estás trabajando, sin tener que exportar el resto del sitio.
VISTA PREVIA DE PÁGINA WEB : exporta todas las páginas de tu sitio y
luego muestra la ventana de vista previa. Así, todas las páginas y
enlaces de tu sitio deberían funcionar.

Los botones de navegación en la barra superior de la ventana de vista previa te

permite avanzar o retroceder, como en un navegador web, y el botón de Inicio
permite regresar a la página en la que comenzaste la vista previa.

VISTA PREVIA DE PÁGINA : exporta y muestra la vista previa de la página actual

únicamente. Esta opción es útil si cuentas con un sitio muy grande que demora
mucho en exportarse en su totalidad. De esta forma, puedes ajustar rápidamente la
vista previa de la página en la que estás trabajando, sin tener que exportar el resto del
sitio.

www.magix.es
 Primeros pasos 31

Puedes ver tu sitio web en modo de pantalla completa haciendo clic en el

botón de VER PANTALLA COMPLETA en la parte superior derecha de la ventana
de vista previa ("Esc" para salir o "F11" para entrar y salir del modo de pantalla
completa). Cuando se cierra la ventana de vista previa y la siguiente se vuelve
a abrir, Web Designer muestra el último modo elegido para la ventana, es
decir, la pantalla normal, maximizada o completa.

Si no has exportado tu sitio todavía, estas vistas previas se exportan a una carpeta
temporal en tu PC. Una vez que lo hayas exportado, la misma ubicación de
exportación se utilizará siempre que hagas una vista previa, es decir, que el sitio
exportado se actualiza constantemente.

Selecciona tu navegador de vista previa

A pesar de que esta vista previa interna utiliza una versión simplificada del navegador
Internet Explorer por defecto, puedes elegir uno de los cinco tipos de navegadores
más populares para ver tu página en la ventana de vista previa.

Para una vista previa de tu sitio web en tu navegador web favorito, haz clic en uno de
los siguientes navegadores de la barra en la parte superior de la ventana de vista
previa:

Nota: estos botones solo están habilitados si tienes instalados los navegadores en tu
PC.

Vista previa de tu página o su sitio web en Google Chrome.

Vista previa de tu página o su sitio web en Mozilla Firefox.

Vista previa de tu página o su sitio web en Internet Explorer.

Vista previa de tu página o su sitio web en Opera.

Vista previa de tu página o su sitio web en Safari.

Al hacer clic en uno de los botones de arriba, se abre el navegador en la página que
estás viendo actualmente en la ventana de vista previa.

Si deseas ver tus páginas en un navegador que no sea de este tipo, puedes hacer clic
derecho sobre el archivo. htm y seleccionar ABRIR CON... , o simplemente puedes
arrastrar y soltar el archivo en una ventana del navegador abierta. Una vez exportado,
cada vez que pulses el botón de vista previa, la exportación se actualizará también, y
entonces solo será necesario pulsar el botón de Actualizar en tu navegador (o
presionar F5).
32

Uso de plantillas, cliparts y widgets

Abre la GALERÍA DE DISEÑOS con un clic en la pestaña GALERÍA DE DISEÑOS de
la barra de galerías (o con "ARCHIVO" > "NUEVO DE LA GALERÍA DE DISEÑOS" ).

Aquí se muestran carpetas temáticas que contienen colecciones de diseños de

páginas web y archivos gráficos asociados con cada tema específico. Busca en TEMAS
PARA PLANTILLAS DE PÁGINAS WEB (GENERAL) para encontrar todas los diseños de
plantillas disponibles para configurar rápidamente una página web de calidad. En
TEMAS PARA PLANTILLAS DE PÁGINAS WEB (ESPECIAL PARA EMPRESAS) , encontrarás
páginas web completas ya diseñadas para tipos específicos de empresas, lo que hace
incluso más rápido el tener online la página web de una empresa.

Cada tema de página web tiene una serie de diseños alternativos y útiles elementos
para tu página. Cada uno contiene a su vez una plantilla de página web completa y
varios esquemas de colores. Puedes cambiar todo tu sitio a un esquema de color
completamente distinto con solo arrastrar y soltar el esquema desde la galería hasta
la página o con un doble clic.

En ELEMENTOS DE PÁGINA Y WIDGETS encontrarás una amplia variedad de gráficos y

widgets que puedes añadir a tu página, desde botones, barras de navegación y
paneles de texto a formas, soluciones de comercio electrónico y pases de fotos. Tan
solo arrastra y suelta cualquiera de ellos desde la galería sobre tu página web.

Si estás conectado a Internet, la galería de diseños se actualiza automáticamente para

mostrarte las últimas plantillas y novedades disponibles.

Agregar nuevas páginas a tu página web

Puedes arrastrar cualquier diseño de plantilla desde la GALERÍA DE DISEÑOS en tu
página. Si se trata de una plantilla de página, se añadirá una nueva página a tu sitio
web, pero se te preguntará primero si quieres que los cambios de colores coincidan. Si
arrastras un elemento de clipart como un botón, un encabezado o un objeto de foto,
esto se agregará a la página en el lugar en donde lo sueltes y nuevamente se te
preguntará si quieres que los colores coincidan.

Para añadir una nueva página del mismo diseño, la forma más sencilla es hacer
clic derecho en la página y seleccionar DUPLICAR PÁGINA ACTUAL o utilizar el
botón DUPLICAR PÁGINA ACTUAL en la barra de herramientas estándar.

Esto replica la página actual abajo. Luego puedes eliminar o editar los elementos
según lo desees. Esto tiene la ventaja de que mantendrá la misma estructura de
navegación.

O puedes copiar y pegar una página existente en el mismo o en otro documento. Haz
clic en una parte en blanco de la página y selecciona COPIAR PÁGINA. Haz clic

www.magix.es
 Primeros pasos 33

derecho en una página del documento de destino y selecciona PEGAR > PÁGINA (o
pulsa "Ctrl + V").

La página en el portapapeles se añadirá inmediatamente como una nueva página

después de la página actual. La página pegada adopta el tamaño de página del
documento en el que es pegada (siempre y cuando esté activada la opción TODAS LAS
PÁGINAS IGUALES EN EL DOCUMENTO bajo ARCHIVO > OPCIONES DE PÁGINA ). También
se pegarán las capas de la página y los atributos y todos los objetos en la página.

Puedes agregar una nueva página en blanco, haciendo clic derecho y

seleccionando NUEVA PÁGINA o utilizar el botón INSERTAR PÁGINA EN BLANCO
en la barra del menú desplegable de la página.
Puedes eliminar páginas haciendo clic derecho y seleccionando ELIMINAR
PÁGINA ACTUAL o haciendo clic en el botón ELIMINAR PÁGINA ACTUAL en la
barra del menú desplegable de la página.

Integración de películas, Flash y otros widgets

Puedes incrustar fácilmente películas, archivos de audio MP3, animaciones flash, GIF
animados, PDF, galerías de fotos y widgets de diapositivas y tipos ilimitados de
widgets interactivos en tu página web creada con MAGIX Web Designer 10 Premium.
Consulta el capítulo de Widgets de página web para más detalles.

Puedes crear tus propias animaciones Flash y GIF con MAGIX Web Designer 10
Premium. Consulta el capítulo Animaciones.

Clipart flash
MAGIX Web Designer 10 Premium incluye la posibilidad de crear animaciones flash
desde cero (ver la sección Animaciones flash (en la página 418) en el manual en
PDF), pero también incluye una variedad de plantillas de flash que puedes
personalizar. Las plantillas flash no se pueden arrastrar hacia la página directamente,
deben abrirse como un documento de animación separado que puedes personalizar
como quieras y luego puedes guardar el archivo Flash (.swf) en tu disco local. Luego,
utiliza "ARCHIVO" > "IMPORTAR" o arrastra y suelta el archivo .swf en tu página web.

Se generará automáticamente una imagen de marcador de posición y se colocará en

tu página. Haz una vista previa de tu página para ver la animación Flash en
funcionamiento. Como alternativa, puedes crear tu propio marcador de posición (p.
ej., un rectángulo) y luego utilizar la pestaña MARCADOR DE POSICIÓN del diálogo
PROPIEDADES WEB para asociarlo con tu archivo Flash.
34

Galería de diseños
Esta galería contiene plantillas de diseño profesional de páginas y sitios web
completos, así como de elementos individuales de cliparts que puedes utilizar para tu
diseño.

Para abrir esta galería:

• Haz clic en la pestaña GALERÍA DE DISEÑOS en la barra de galerías.
• O selecciona "HERRAMIENTAS" > "GALERÍAS" > "GALERÍA DE DISEÑOS".

Consulta MANEJO DE DOCUMENTOS (en la página 94) para más información sobre
como usar las galerías. Si te encuentras en línea cuando abres la galería, comenzarán
a descargarse automáticamente diseños y widgets de los servidores de Web
Designer, que aparecerán de inmediato en la galería. Visita regularmente la galería
para ver los últimos widgets y plantillas gratis disponibles. Para abrir una plantilla
como un nuevo documento, haz doble clic. Para importar una plantilla en un
documento abierto, arrástrala y suéltala sobre le diseño. Las plantillas de página se
www.magix.es
 Primeros pasos 35

agregan como nuevas páginas al documento actual cuando lo haces. Otras plantillas y
widgets se agregan a la página actual. Muchas de las carpetas de la galería en
ELEMENTOS DE PÁGINA Y WIDGETS contienen "widgets", tal como lo indican sus
nombres de carpeta. Estos son mucho más que simples gráficos estáticos. Consulta el
capítulo WIDGETS DE PÁGINA WEB para más información.

Catálogo de contenido online

El catálogo de contenido online es esencialmente una versión "nube" de la galería de
diseños. Es decir, todo el contenido está almacenado online y como tal requiere que
estés conectado a Internet. Además de tener la librería de la galería de smartshapes,
temas de páginas web, plantillas de diseño y widgets almacenados en tu PC como
parte de Web Designer, también puedes acceder a todo el contenido a través del
catálogo de contenido, que ofrece una forma fácil e intuitiva para buscar todo el
contenido.

Cuando importas una pieza de contenido desde el catálogo de contenido se descarga

en tu PC y permanece disponible cuando no estás conectado. Para abrir el catálogo de
contenido
• Haz clic en "ARCHIVO" > "NUEVO DEL CATÁLOGO DE CONTENIDO"
(Shift+Ctrl+Alt+K)
• haz clic en "INSERTAR" > "DESDE EL CATÁLOGO DE CONTENIDO" para insertar y
descargar una pieza de contenido desde el catálogo.

Catálogo de contenido online

36

El catálogo es una ventana redimensionable: arrastra los bordes o la esquina inferior

derecha para cambiar el tamaño. Se obtiene un popup de vista previa cuando pasas
por las categorías de contenido a la izquierda: haz clic para seleccionar y esa categoría
se expandirá y se mostrará en el lado derecho. Para las categorías que tienen muchos
elementos hay un control de página en el extremo superior derecho que te permite
ojear las páginas de contenido siguientes y posteriores.

Cuando se usa la versión de prueba gratuita, los elementos que se muestran en azul
en la lista de contenido de la izquierda se pueden usar durante el periodo de prueba
de forma gratuita. Todos los elementos que se muestran están disponibles de forma
inmediata y gratuita una vez que compras y activas el programa.

Colores de la página web

Todas las plantillas utilizan un pequeño conjunto de colores originales y varias
sombras de estos colores originales. La forma más fácil de cambiar el color de tu sitio
es utilizar uno de los esquemas de color alternativos que se suministran con cada
tema web en la GALERÍA DE DISEÑOS. Simplemente arrastra un esquema hasta la
página para cambiar el color de todo el sitio o haz doble clic en él.

O puedes editar cada uno de los colores originales individuales personalmente. Estos
se denominan "colores con nombre" y aparecen en la parte izquierda de la línea de
colores a lo largo de la parte inferior de la ventana.

Contorno actual y color de relleno

Editor de color
Pipeta para seleccionar colores
Patch "Sin color".
Colores "originales" con nombre y colores vinculado
Paleta fija de colores estándar
Barra de estado . Muestra lo que se ha seleccionado y brinda consejos
Mantén el cursor sobre un color para ver su nombre

Simplemente haz clic en cualquier color con nombre y selecciona la opción de edición
(si mantienes el cursor del ratón sobre el color verás el nombre del consejo de
herramienta).

www.magix.es
 Primeros pasos 37

Cuando edites el color puedes arrastrar la pipeta para escoger colores de la

pantalla, incluso de otras ventanas abiertas
Selecciona el color a editar: Color de relleno/color de línea del objeto
seleccionado o cualquier color con nombre (original)
Haz clic en la etiqueta para crear un color con nombre
Haz clic para mostrar los controles de color ampliados
Color anterior
Color actual
Arrastra hacia aquí para seleccionar cualquier tonalidad del tono seleccionado
Arrastra hacia aquí para seleccionar cualquier tono

El editor de color suministra una forma fácil de elegir cualquier color. Haz clic en los
controles ampliados para introducir los valores RGB.

Observa que cuando cambias un color original de esta forma, todas las tonalidades
relacionadas utilizadas a lo largo del documento también cambiarán.

Colorear formas
Puedes rellenar con un color cualquier forma dibujada, arrastra el color desde la LÍNEA
DE COLOR y suéltalo en la forma o selecciona primero el objeto y luego haciendo clic
en la línea de colores y escogiendo "ESTABLECER COLOR DE RELLENO".

De forma alternativa haz clic en el pequeño icono de editor de color (o presiona

Ctrl+E) para visualizar el editor de color donde puedes ajustar cualquier color
que desees.
38

Puedes asignar un relleno de color con gradación a un objeto dibujado utilizando la

herramienta de relleno (en la página 231).

Importación de clipart con color

Cuando importas un gráfico de clipart arrastrándolo desde la GALERÍA DE DISEÑOS , al
utilizar la opción "ARCHIVO" > "IMPORTAR" , o arrastrando un archivo .web o .xar hasta
la página, por lo general se te preguntará si deseas vincular los colores. Si seleccionas
NO IGUALAR , entonces cualquier color con nombre utilizado en este gráfico será
añadido a la línea de colores. Haciendo clic en cualquier color de la línea de color, te
dará la opción de editarlo.

También puedes cambiar los colores o cualquier objeto multicolor seleccionándolo y

haciendo clic sobre un color de la línea de color. Aparecerá un diálogo que te muestra
el conjunto de colores usados actualmente en este objeto: tan solo haz clic sobre el
que quieres cambiar. También puedes abrir el editor de color. La lista de colores en la
parte superior incluye el mismo conjunto de colores: elige el que quieres editar.

Colorear fotos
Si intentas colorear una foto, se convierte en una foto de "colores completos". Por
ejemplo, para convertir una foto en una foto en blanco y negro, simplemente
selecciónala de la forma usual y haz clic en el rombo blanco al final de la línea de
color. Puedes definir que el color claro sean dos colores cualquiera, no solo blanco y
negro.

Nota: Si la foto está dentro de un grupo, como muchos de los objetos de foto están
dentro de las plantillas o de los clipart, entonces tienes que seleccionar primero el
interior de la foto. Puedes hacer esto pulsando la tecla Ctrl y haciendo clic en el
objeto con la herramienta de selección. Otra forma de seleccionar directamente la
foto es hacer clic en la foto con la HERRAMIENTA DE FOTO .

www.magix.es
 Primeros pasos 39

Fondos de página web

La mayoría de diseños de página en la GALERÍA DE DISEÑOS tienen dos tipos de fondo.
Un fondo de tablero de dibujo amplio que se extiende a lo largo del fondo de toda la
ventana del navegador cuando exportas tu página. Sobre él está el fondo de página
con todos los otros elementos que constituyen la página web.

Color de fondo del tablero de dibujo o del navegador

Color del fondo de página

Puedes cambiar fácilmente el color del TABLERO DE DIBUJO o del FONDO DE PÁGINA
arrastrando y soltando un color de la LÍNEA DE COLORES o incluso usando el EDITOR DE
COLORES .

Cuando creas un nuevo documento en blanco ("ARCHIVO" > "NUEVO" ) la página es

transparente (sin color) por defecto, por lo que tan solo verás el color del tablero de
dibujo tras ella, que es blanco por defecto. También verás un contorno guía
rectangular suave que muestra los límites de la página sobre el tablero de dibujo.

Además, hay una gran variedad de texturas de fondo prediseñadas en la GALERÍA DE

DISEÑOS . Tan solo arrastra y suelta un color hasta el área del tablero de dibujo para
usarlas.

Consulta Fondos de página web (en la página 302) para más información.
40

Fotos
Puedes sustituir cualquier foto arrastrándola desde tu explorador de Windows y
soltándola sobre cualquier foto de Web Designer. Si la sueltas sobre el fondo,
entonces se importa y se posiciona en la página donde la soltaste. Todas las fotos
importadas se muestran con 500 píxeles, pero por supuesto puedes ajustar cualquier
tamaño de la forma usual con la herramienta de selección.

Arrastra y suelta tu foto sobre cualquier foto existente para sustituirla. Arrastra hacia el fondo
para importarla como una foto nueva.

Si la foto que importas es muy grande, se te preguntará si quieres importar una

versión reducida. Esto es recomendable, para más información lee la sección
resolución de fotos a continuación.

Cuando sustituyes una foto existente, la herramienta de relleno se

selecciona y se muestran dos flechas de rellenos en ángulo recto sobre la
foto.
Esto es así porque la foto en realidad es un relleno dentro de una forma. Puedes tirar
de la imagen para cambiar su posición o estirar de las puntas de las flechas de relleno
para cambiar el tamaño y girar la imagen dentro del contorno de la forma.

www.magix.es
 Primeros pasos 41

Arrastra sobre la foto para cambiar su posición dentro del marco. Estira de la punta de las
flechas para cambiar el tamaño y girar.

Sustitución de múltiples fotos

Algunas plantillas de la GALERÍA DE DISEÑOS , especialmente los estilos de los álbumes
de fotos, pueden tener varias fotos que desees sustituir en un solo paso. Selecciona
los múltiples archivos de fotos en el explorador de archivos de Windows (Ctrl+Clic
para añadir más archivos a la selección o Shift+Clic para seleccionar una serie de
archivos). Luego arrastra y suelta los archivos hasta la página de MAGIX Web
Designer 10 Premium para que las fotos se reemplacen una a una desde el principio
de la página hacia abajo. Eso facilita llenar una página de un álbum de fotos con tus
propias fotos.

Si arrastras más fotos de las que caben en la página actual, MAGIX Web Designer 10
Premium explorará las páginas siguientes en el documento para ver si puede
acomodar algunas o todas las fotos restantes. Si esto todavía no alcanza para colocar
todas tus fotos, MAGIX Web Designer 10 Premium duplicará la página actual todas
las veces que sea necesario para posicionar todas las fotos.

Este potente mecanismo significa que puedes crear una página web con un álbum de
fotos de varias páginas, si cargas una plantilla de la galería de diseños y luego
arrastras tus fotos.

Importación de fotos grandes

Al importar fotos de alta resolución (cualquiera de más de 1920 píxeles,
independiente del alto o ancho) en un documento web, MAGIX Web Designer 10
Premium ajusta la foto automáticamente al tamaño de la pantalla HD sin preguntar si
quieres importar una versión con una resolución menor. Para un documento web, aun
con el tamaño reducido, debería haber más que resolución suficiente en tus fotos para
resultados de alta calidad en tu página web, por lo que raramente es necesario
importar imágenes de cámaras digitales con su resolución completa para usar en la
web.
42

Sin embargo, si importas una foto grande a un documento de impresión o con

animación, MAGIX Web Designer 10 Premium te pregunta si quieres importar una
versión de menor resolución de tus fotos. Si el documento va a incluir muchas fotos,
sería conveniente elegir la opción de menor resolución. De lo contrario, si contiene
fotos de gran tamaño, el tamaño del archivo de diseño será mucho más grande de lo
que debería ser (porque contiene una copia de cada una de tus fotos). La memoria
requerida al editar y exportar el documento serán también mayor de lo necesario.

La herramienta de fotos
La herramienta de foto suministra una gran variedad de formas de optimizar y
recortar cualquier foto.

Para cortar una foto, simplemente arrastra a lo largo de la foto mientras te

encuentras en la HERRAMIENTA DE OPTIMIZACIÓN DE FOTOS . Puedes ajustar los
bordes de corte estirando de los controles deslizantes de corte alrededor del
exterior de la foto.
O utiliza la HERRAMIENTA DE CORTE para más control sobre los recortes.

Consulta el apartado Trabajar con fotos para más información detallada sobre cómo
MAGIX Web Designer 10 Premium maneja fotos y el apartado en Herramienta de
foto para averiguar cómo utilizar la herramienta de foto.

Fotos en miniatura con popup

Puedes crear muy fácilmente pequeñas miniaturas de fotos (simplemente cambia el
tamaño para que sean muy pequeñas), para que cuando se haga clic sobre las
mismas se muestre una versión más ampliada. Cambia el tamaño de tu foto, tal como
lo haces con la HERRAMIENTA DE SELECCIÓN .

Selecciona la pequeña miniatura de foto y selecciona la opción "FOTO

EMERGENTE " en la pestaña ENLACE del diálogo Propiedades web (haz clic en el
BOTÓN ENLACE en la BARRA DE HERRAMIENTAS DE WEB ).

www.magix.es
 Primeros pasos 43

Haz clic en el botón CONFIGURACIÓN junto a la opción de foto emergente para

cambiar a la PESTAÑA IMAGEN del DIÁLOGO DE PROPIEDADES WEB.
44

Allí podrás determinar cómo aparecerá tu popup. Una opción te permite colocar un
título sobre cada foto emergente. Configura el título para cada foto en el campo
TÍTULO . De forma opcional, puede mostrarse un subtítulo debajo de cada foto
emergente. Simplemente, configura la CAPTURA DE IMAGEN para la miniatura en el
mismo diálogo. Consulta la sección foto emergente del capítulo Diálogo de
propiedades web para detalles completos de las opciones disponibles.

En Internet Explorer, la captura de imagen se mostrará en un consejo de herramienta

emergente al pasar el ratón sobre la imagen. Para mostrar un texto diferente, como
"Haz clic para ampliar" cuando mueves el cursor sobre la miniatura de imagen, ve a la
pestaña MOUSEOVER y cambia "MUESTRA TEXTO DE POPUP " por "HAZ CLIC PARA
AMPLIAR ".

Texto
Puedes editar el texto seleccionando HERRAMIENTA DE TEXTO y haciendo clic en el
texto.

Dispones de todas las opciones de procesamiento comunes de Word y puedes pegar

textos desde el portapapeles. Con doble clic se seleccionará una palabra, con triple
clic se seleccionará una línea entera (lo que puede ser útil para seleccionar todo el
texto en un botón). Como es habitual, la barra de información provee una amplia
variedad de controles para esta herramienta. Como alternativa, puedes hacer clic
dentro del texto y escoger PROPIEDADES AVANZADAS DE TEXTO .

El menú de fuente presenta una lista de fuentes y está separado en cuatro secciones.
El apartado superior muestra las fuentes ya usadas en el documento, el segundo
muestra las fuentes compatibles con la web, el tercero muestra las fuentes Google
disponibles y, finalmente, el apartado inferior muestra todas las fuentes instaladas en
tu PC.

www.magix.es
 Primeros pasos 45

Popup de tamaño de fuente en tiempo real

Fuentes usadas en el documento actual
Fuentes compatibles con la web
Fuentes de Google
Todas las fuentes instaladas
Variantes de estilo disponibles para la fuente seleccionada. No todas las fuentes
tienen variantes

La opción "añadir" en la sección de fuentes de Google te permite examinar, descargar

e instalar desde cientos de fuentes de acceso libre que puedes usar en tu página web.
46

El menú de fuentes ofrece la selección de fuentes en tiempo real. Mientras vas

recorriendo el menú, el texto seleccionado cambia de fuente, proporcionando una
vista previa de como se verá la fuente en el documento.

Tamaño de fuente
El campo de tamaño de fuente muestra el tamaño de fuente en píxeles, dado que éste
es el método más confiable para ajustar el tamaño del texto para utilizarlo en el
navegador. Pero puedes introducir cualquier texto en puntos (o cualquier otra unidad
para el caso) introduciendo un valor con pt detrás del mismo (significa "punto"), por
ejemplo 72pt ó 1 y esto se convertirá al tamaño de píxeles correcto.

Usar fuentes en tu página web

Las fuentes de la sección de fuentes seguras se pueden usar sin problemas en las
páginas web, ya que la gran mayoría de los equipos y otros dispositivos dispondrán de
estas fuentes. También puedes usar cualquiera de los cientos de fuentes de Google
porque se descargarán automáticamente a través del navegador web cuando alguien
visite tu página. Puedes usar otras fuentes que hayas instalado y tenerlas incrustadas
automáticamente en tu página, siempre que la licencia de la fuente lo permita:
consulta el capítulo "Manejo de texto" para más detalles.

Si conviertes cualquier objeto de texto en un gráfico puedes usar cualquier fuente.

Consulta la sección de grupos (en la página 51) abajo para más detalles.

Crear nuevos objetos de texto nuevos

Existen tres objetos de texto: una única línea de texto, una columna de texto o un área
de texto rectangular. Para crear una simple línea de texto, selecciona la herramienta
de texto y luego puedes hacer clic en cualquier parte del fondo para comenzar a
teclear. Para crear una columna, haz clic y arrastra horizontalmente en el fondo y
luego comienza a teclear. Puedes ajustar el tamaño de la columna en cualquier
momento. Para crear un área de texto, haz clic y arrastra diagonalmente. Puedes
ajustar el ancho y la altura de un área de texto.

Texto girado
De forma usual (únicamente para una herramienta de autoría web), puedes girar
cualquier objeto de texto, incluso columnas de texto, utilizando la función de giro
usual de la herramienta de selección. Pero debido a que los navegadores web no son
compatibles con texto girado nativo, Web Designer convierte cualquier texto girado
en un gráfico cuando la página es exportada como página web.

Lista con viñetas y numeradas

Utiliza los botones de las listas con viñetas y numeradas de la barra de información de
la HERRAMIENTA DE TEXTO para ingresar rápidamente listas con viñetas o numeradas.
Puedes hacer clic derecho sobre una lista numerada y escoger PROPIEDADES DE LA
www.magix.es
 Primeros pasos 47

LISTA… del menú contextual para cambiar el orden del esquema de números en tu
lista. También puedes usar cualquier gráfico como viñeta o número de tu lista.
Consulta el capítulo Herramienta de texto (en la página 190) para más información.

Sombras suaves, texto relleno de color, texto transparente

Puedes aplicar cualquiera de estos efectos utilizando las herramientas apropiadas. Por
ejemplo, si arrastras sobre algún texto en la herramienta de relleno, obtendrás un
color con gradación, o si arrastras con la herramienta de sombra, obtendrás una
sombra ligera.

En todos estos casos, Web Designer convertirá el texto automáticamente en un

gráfico en tu página web exportada.

Contornear texto alrededor de objetos

Si haces clic con el botón derecho del ratón en un objeto como una foto y seleccionas
la opción de menú "CONTORNEAR TEXTO (en la página 212)", puedes hacer que el
texto fluya alrededor del objeto que está encima del texto.

Muchos de los objetos, como fotos, paneles laterales, botones y encabezados

utilizados en plantillas desde la GALERÍA DE DISEÑOS se contornean automáticamente,
es decir, el texto siempre fluye alrededor de estos objetos cuando los arrastras cerca.

El contorneo de objetos solo se aplica al texto que está detrás del objeto, así que
tendrás que "llevar hacia adelante" el objeto para que el contorneo funcione (Ctrl +F).
Como alternativa, si solo quieres que el texto fluya alrededor de un objeto en una
capa individual, puedes hacer que el texto debajo de esta capa no se contornee (útil
para capas popup dentro de una página web). Consulta Propiedades de capa (en la
página 413). Todas las operaciones de la HERRAMIENTA DE TEXTO son en tiempo real:
el texto se reformatea y refluye según vas ajustando el ancho de la comuna o vas
moviendo los objetos contorneados.

Nota: ahora también puedes hacer que el texto fluya alrededor de Objetos ancla (en
la página 47).

Objetos ancla
Si deseas que un objeto gráfico aparezca junto a una parte particular de un bloque de
texto, puedes anclar el objeto junto al texto para que se mueva junto con él.

Haz clic sobre el objeto y selecciona ANCLAR AL TEXTO . En la HERRAMIENTA DE

SELECCIÓN , haz clic y arrastra el símbolo del ancla que aparece en la parte superior
izquierda del objeto hasta la ubicación del texto en donde quieres fijar el objeto.
Ahora, si editas o mueves el texto, el objeto anclado se moverá junto con el punto
anclado.
48

Corrector de ortografía
En la barra de información de la herramienta de texto hay un botón que
selecciona las opciones del corrector ortográfico y el idioma. Si seleccionas
"Revisar ortografía mientras se escribe", también marcará todas las palabras
que no reconoce subrayándolas en rojo intermitente. Haz clic con el botón
derecho en cualquier palabra marcada para obtener sugerencias.

Tamaño de página
Las páginas de la GALERÍA DE DISEÑOS están diseñadas para tener un ancho
compatible con la mayoría de las pantallas. No se recomienda crear páginas más
anchas, incluso si tu PC dispone de una pantalla más amplia. La experiencia
demuestra que la mayoría de usuarios prefieren tener un ancho de página fijo. Sin
embargo, puedes ajustar el tamaño de página que quieras.

Puedes configurar cualquier tamaño de página que quieras seleccionando TAMAÑO DE

PÁGINA del DIÁLOGO DE OPCIONES (haz clic derecho y selecciona OPCIONES DE
PÁGINA , u OPCIONES DE PÁGINA del menú ARCHIVO ). No se recomienda crear un
ancho de página que supere los 990 píxeles, ya que este es el ancho máximo para
gran parte de las pantallas (1024 menos una pequeña cantidad por la barra
desplazable). Un ancho de página más común tiene por lo general unos 800 píxeles.

Puedes ajustar directamente la altura y el ancho de tu página arrastrando el margen

inferior o derecho de la página. Ve a la HERRAMIENTA DE SELECCIÓN y mueve el cursor
sobre el borde inferior de la página y este cambiará para indicarte que ahora puedes
arrastrar para reducir o ampliar el tamaño de la página según se requiera.

Guardar tu trabajo. Creación de una página Web

Utiliza las opciones de menú GUARDAR o GUARDAR COMO para guardar tu trabajo en
progreso. Esto guarda un archivo con la extensión .web que es el formato de archivo
nativo para Web Designer (esto no es una página web). Se recomienda que guardes
tu trabajo regularmente según avances. Si quieres editar o actualizar tu página en el
futuro, debes guardar un archivo .web de esta forma y hacerlo en actualizaciones
futuras.

También te recomendamos trabajar con la función de copias de seguridad

automáticas activada. Esta opción se controla desde la pestaña Copias de seguridad
del diálogo HERRAMIENTAS > OPCIONES . Cuando está activada esta opción, se realiza
una copia de seguridad de tu documento abierto de forma regular. Aquí puedes
escoger la forma en que debe comportarse el programa al cerrarlo. Puedes hacer que

www.magix.es
 Primeros pasos 49

te pregunte si quieres guardar o eliminar un documento modificado o hacer que todos

los documentos se guarden automáticamente en la ubicación de copias de seguridad
y se restauren la próxima vez que inicies.

Para guardar tu sitio web, que son las páginas HTML y archivos asociados para
publicar en la Web, utiliza la opción Exportar página web o haz clic en este
botón en la barra superior.

Esto guarda un archivo .htm por cada página y una carpeta que contiene todos los
archivos que componen la página web.

Al exportar un sitio web, todas las páginas se exportan juntas y cada página sin
nombre recibe la finalización _1, _2 tras el nombre que ingresas durante la exportación.
La carpeta _FILES contiene todos los gráficos y otros archivos que van a formar tu sitio
web. Puedes nombrar cada página de forma individual si lo deseas, con la pestaña
PÁGINA del diálogo PROPIEDADES WEB o con la Galería de páginas y capas (en la
página 407).

El nombre por defecto que se le dará a tu sitio web es index.htm porque éste es el
nombre usual de la primera página de un sitio web. Puedes ver previamente el sitio
web en cualquier navegador web, si arrastras el archivo index.htm (o cualquier .htm)
desde el Explorador de Windows hasta una ventana del navegador.

Copias de seguridad automáticas

La pestaña Copias de seguridad del diálogo HERRAMIENTAS > OPCIONES te permite
activar y desactivar la función de copias de seguridad automáticas. Esta función
guarda una copia de todos los documentos abiertos modificados en intervalos
regulares. También puedes escoger si se te debe advertir que no has guardado
documentos al cerrar el programa o si debe guardarse una copia de seguridad de
todos estos documentos y restaurarse la próxima vez que inicies el programa.

Consulta el capítulo Manejo de documentos (en la página 88) para más detalles
acerca de estas funciones.

Objetos extensibles
Muchos de los objetos gráficos, como los botones extensibles y los paneles de texto
pueden ajustar automáticamente su tamaño dependiendo del tamaño o la longitud
de texto. La mayoría de grupos de plantillas y todos los botones en la carpeta de
"ELEMENTOS DE PÁGINA Y WIDGETS" > "BOTONES" de la GALERÍA DE DISEÑOS , tienen
ambas versiones, fija y extensible. Se recomienda que si se configura un conjunto de
botones de navegación (por lo general una colección vertical u horizontal de enlaces o
botones) se use un ancho fijo para que sean todos del mismo tamaño.
50

De manera similar, en muchos de los paneles laterales o de texto en las plantillas, y a

veces en el área de texto principal, se puede ajustar también el alto y en ocasiones el
ancho. En el caso de los paneles de texto, puedes ajustar el ancho de la columna con
la HERRAMIENTA DE TEXTO arrastrando el borde izquierdo o derecho del indicador de
columna.

Nota: puedes crear nuevos componentes de extensión utilizando Xara Designer Pro.

Barra de herramientas de página Web

La BARRA DE HERRAMIENTA DE PÁGINAS WEB en la parte superior de MAGIX Web
Designer 10 Premium suministra un práctico acceso a las principales funciones web
que utilizarás regularmente.

Vista previa
Enlace
Opciones de página web
Exportar

Coloca el cursor del ratón sobre cada botón de la barra desplegable para obtener un consejo de
herramienta con la descripción del botón.

www.magix.es
 Primeros pasos 51

Grupos
Puedes agrupar cualquier selección de objetos en la página. Los grupos actúan casi
como un objeto individual, ya que puedes arrastrarlos por la página, cambiar su
tamaño y rotarlos como si fueran un solo objeto. Muchos de los elementos de los
diseños de plantilla de la GALERÍA DE DISEÑOS , como los botones, paneles de texto y
objetos de fotos, son elementos agrupados.

Por ejemplo, puedes dibujar un simple botón desde cero dibujando un rectángulo con
la HERRAMIENTA DE RECTÁNGULO y colocando una etiqueta de texto encima con la
HERRAMIENTA DE TEXTO . Estos son objetos separados y puedes moverlos de forma
independiente en la HERRAMIENTA DE SELECCIÓN . Pero si seleccionas ambos en la
HERRAMIENTA DE SELECCIÓN (también puedes arrastrar para incluir ambos o presionar
"Shift" y hacer clic sobre otros objetos adicionales) y haces clic derecho y seleccionas
GRUPO (o pulsas "Ctrl + G" o usas el menú "ORDENAR" > "GRUPO" ), se convertirán en
un objeto agrupado (Pista: la línea de estado que se encuentra debajo siempre te
informa de lo que está seleccionado). Ahora si arrastras, cambias el tamaño o giras
este objeto, todas las partes de este grupo se mueven y transforman como si fueran
un único objeto.

Importante: los objetos agrupados están generalmente convertidos en un único

gráfico cuando exportas tu página web.

Al desagrupar (haz clic derecho y selecciona DESAGRUPAR o pulsa "Ctrl + U"), puedes
acceder a todas las partes del grupo de forma individual. Como alternativa puedes
editar elementos directamente dentro de un grupo. Por ejemplo, si utilizas la
HERRAMIENTA DE TEXTO para editar el texto o la herramienta de foto para editar una
foto, un clic seleccionará automáticamente el elemento dentro del grupo.

Cambia o edita cualquiera de los colores por separado usados dentro de un grupo
seleccionándolos y haciendo clic en un color o línea de color, o abriendo el editor de
color. Consulta el apartado sobre cambio de colores para más información.

Convertir texto en un gráfico

Como se mencionaba arriba, solo un número limitado de fuentes están disponibles en
navegadores web. Si quieres utilizar una fuente diferente en un botón o,
digamos, como un encabezado, puedes hacerlo asegurándote de que se ha convertido
a un gráfico, y todo lo que necesitas es agrupar el objeto para que esto ocurra
automáticamente. Todavía puedes editar el texto dentro del grupo, pero los grupos se
convierten automáticamente en gráficos cuando se exporta la página web.
52

Por lo tanto, todo lo que tienes que hacer para incluir una fuente como esta es
agrupar. No es necesario que esté agrupada con otro, puede agruparse consigo
misma si seleccionas GRUPO del menú ARREGLO o presionas "Ctrl+G".

Nota técnica: al exportar estos grupos como imágenes en una página web, cualquier
texto del grupo se utiliza como texto alternativo de HTML en la imagen (salvo que
fijes explícitamente otro texto alternativo para el grupo). Esto significa que los
motores de búsqueda pueden indexar el texto y que las herramientas utilizadas por
las personas con problemas en la visión también reconocerán y leerán este texto, a
pesar de que el texto no aparece directamente en la página web. Si no quieres que el
texto alternativo se utilice de esta forma, puedes ignorarlo si fijas otro texto
alternativo para el grupo en la pestaña Imagen en Herramientas > Propiedades web.

Grupos suaves (soft groups)

Hay otro tipo de grupo denominado "Grupo suave" que es un conjunto de objetos
conectados de una forma más suelta . Consulta el capítulo Manejo de objetos para
más información.

Grupos anclados
Cuando aplicas anclaje a un objeto respecto al texto, se coloca dentro de un grupo
anclado. Consulta Gráficos anclados (en la página 214) para más información sobre
los objetos anclados.

Grupos de repetición
Cuando haces que un objeto se repita, se coloca dentro de un grupo de repetición.
Consulta Objetos repetidos (en la página 137) en el capítulo Manejo de objetos para
más detalles.

Objetos repetidos
En tu documento o página web es muy común que ciertos elementos se repitan en
todas las páginas como, por ejemplo, los botones de navegación, los encabezados o
los logotipos. MAGIX Web Designer 10 Premium te ofrece la posibilidad de repetir
cualquier elemento en el mismo lugar de las páginas del sitio. Cuando actualices una
de las copias, todos los cambios se reflejarán automáticamente en todas las páginas.

Consulta la sección Objetos repetidos (en la página 137) en el capítulo Manejo de

objetos para más detalles.

www.magix.es
 Primeros pasos 53

Enlaces, botones y barras de navegación

Puedes añadir un enlace web a cualquier objeto, un botón, un gráfico o algún texto.

Selecciona el objeto y simplemente haz clic en el icono en la barra superior para

introducir la dirección web que quieres enlazar.

Introduce la dirección web que quieras para enlazar en el campo.

La pestaña ENLACE del diálogo de enlace te permite controlar lo que ocurre si haces
clic en el objeto vinculado en la página. Puedes saltar a cualquier otra página web
(puedes seleccionar rápidamente un enlace a cualquier otra página dentro de tu
página web con el menú ENLAZAR A) y puedes decidir si quieres que se abra así la
página en una ventana separada. También puedes enlazar a cualquier capa emergente
si ya las has creado.
54

Por lo tanto, para definir uno de tus botones como enlace, simplemente
selecciónalo (haz clic en el mismo en la HERRAMIENTA DE SELECCIÓN ), haz clic
en el icono e introduce la dirección web o selecciona una de las páginas de la
lista desplegable y haz clic en APLICAR . Ya has terminado.

Cuando hayas creado un enlace a un objeto puedes cambiar rápidamente su

funcionamiento con tan solo hacer clic sobre el mismo. Aparecerá un popup con los
detalles y opciones para Cambiar o Eliminar el enlace.

Cambiar texto de botón

Es muy simple en la HERRAMIENTA DE TEXTO, haz clic en el texto del botón y edítalo.

Consejo: si haces triple clic en el texto del botón, seleccionar toda la línea de texto
para un reemplazo más sencillo al tipear.

Botones MouseOver (rollover)

Te habrás dado cuenta de que la mayoría de botones se resaltan cuando mueves el
cursor del ratón por encima de los mismos en tu navegador. Esto se llama un
MouseOver o, algunas veces, efecto rollover. Es completamente automático para la
mayoría de botones utilizados en las plantillas o para la sección de botones de la
GALERÍA DE DISEÑOS . Pero también puedes crear tus propios botones MouseOver:
consulta la sección "Capas" más abajo.

Añadir nuevos botones

En la GALERÍA DE DISEÑOS cada tema tiene una colección de gráficos de botones que
puedes arrastrar hacia la página. Por lo general hay dos tipos de botones. Los
llamados botones extensibles se alargarán para adaptar el botón de etiqueta de texto.

Además, en ELEMENTOS DE PÁGINA Y WIDGETS , hay una categoría que contiene un

conjunto de diseños de botones generales que se pueden agregar a tu página de la
misma forma.

O puedes copiar cualquier botón ya existente. Puedes copiar y pegar, aunque un

shortcut más rápido es arrastrar con el botón derecho del ratón apretado. (Este es un
shortcut general para copiar cualquier objeto). Ahora puedes editar el texto y
enlazarlo como desees.

www.magix.es
 Primeros pasos 55

Consejo: si mantienes presionada la tecla "Ctrl" mientras arrastras, la operación de

arrastre será perfectamente horizontal o vertical, facilitando en gran medida la
creación de una línea o una columna de botones.

Barras de botones (barras de navegación)

La mayoría de páginas web, y la mayoría de los diseños de plantillas que

suministramos, tienen una fila o una columna de botones para navegar en la página
web o en otros lugares. Esto se llama barra de navegación y MAGIX Web Designer 10
Premium incluye una compatibilidad especial para estas barras. Para editar una barra
de navegación, haz doble clic sobre ella o clic derecho y escoge EDITAR BARRA DE
NAVEGACIÓN del menú contextual. Se abrirá el diálogo de barra de navegación. Allí
podrás cambiar los nombres de los botones, enlaces y consejos de herramientas,
agregar y eliminar botones, cambiar el orden y hasta agregar menús y submenús.

Al hacer doble clic sobre el campo de URL, se abrirá el diálogo Enlace que es el mismo
diálogo que se utiliza para fijar enlaces en objetos normales, tal como se ha descrito
anteriormente en este capítulo y en detalle en el capítulo del diálogo de propiedades
web. Puesto que no puedes aplicar un efecto de transición a un enlace de una barra de
navegación, los controles de transición de enlace están desactivados.

En el diálogo de propiedades de la barra de navegación también puedes activar la

opción BARRA DE NAVEGACIÓN DEL SITIO. Esto hace que la barra aparezca
automáticamente en las nuevas páginas que agregas a tu sitio y los botones/enlaces
agregados a la barra también se añaden a cada página nueva. Sin embargo, no puedes
editar tu barra en el lienzo si esta opción está activada, solo puedes hacerlo mediante
este diálogo.

Para actualizar una barra de navegación en todas las páginas (si no es una barra de
navegación del sitio) haz clic y escoge REPETIR EN TODAS LAS PÁGINAS . Esto hará que
la barra de botones se convierta en un objeto y lo copiará de la página actual a todas
las otras en la misma ubicación.

Lee el capítulo Barras de navegación (en la página 372) para toda la información
detallada sobre barras de navegación.

Tus propios iconos en las pestañas de los

navegadores (favicon)
Es posible que quieras que tu propio icono personalizado, por ejemplo, un logo,
aparezca en las pestañas de tu página web cuando se muestran en un navegador.
56

Web Designer te permite hacerlo si aplicas el nombre "favicon" a tu icono de pestaña

personalizado.

Para crear un "favicon", arrastra o dibuja la imagen que quieres usar en tu página web.
La imagen puede tener cualquier tamaño, puesto que se ajustará automáticamente al
tamaño correcto al mostrarse en un navegador.

Haz clic en el objeto y luego en el botón "Nombres" a la derecha de la barra

de información de la HERRAMIENTA DE SELECCIÓN .

En el diálogo "Nombres", escribe "favicon", en el campo APLICAR NOMBRES , luego haz

clic en AGREGAR y finalmente en CERRAR .

Haz una vista previa de tu página web en tu navegador preferido. La forma más fácil
de hacerlo, es hacer clic en uno de los iconos de vista previa y en la ventana de vista
previa de MAGIX Web Designer 10 Premium, para luego escoger uno de los
navegadores web en la parte superior derecha de la ventana de vista previa.

Tu página web se mostrará con el icono personalizado, tal como se muestra en el

ejemplo más abajo.

Puedes utilizar un solo favicon por página web. Publica tu página web y visualízala
para ver tu favicon.

Herramientas de dibujo
Web Designer te ofrece todas las herramientas gráficas
que necesitas para crear cualquier objeto gráfico en tu
página, así como una variedad de elementos gráficos
previamente diseñados en la GALERÍA DE DISEÑOS . Existen
varias herramientas de dibujo básicas que te permiten
crear rectángulos, elipses, polígonos regulares, estrellas o
cualquier forma que desees.

Web Designer suministra herramientas de dibujo vectoriales lo que significa que

puedes cambiar el tamaño, editar la forma y cambiar el color sin perder calidad.
Puedes ampliar para ver el detalle más ínfimo y todas las ediciones pueden
deshacerse.

www.magix.es
 Primeros pasos 57

Atributos actuales (estilos)

Un "atributo" es una característica de un objeto que puedes modificar en MAGIX
Web Designer 10 Premium. Por ejemplo, los atributos de una forma incluyen su color,
el ancho del contorno y su color de contorno.

Tal como se menciona anteriormente, puedes cambiar los atributos de un objeto

después de haberlo dibujado, si lo seleccionas y luego cambias su color de relleno, el
ancho de la línea o cualquiera de sus atributos. Pero MAGIX Web Designer 10
Premium también realiza un seguimiento de los atributos "actuales" que son aquellos
que se aplican a objetos nuevos cuando se crean.

Configuración manual de los atributos actuales

Si, por ejemplo, quieres que el próximo rectángulo que dibujes sea rojo, asegúrate de
que nada esté seleccionado (pulsa Esc o haz clic en una parte vacía de una página) y
luego haz clic sobre el color rojo en la línea de colores. Has fijado que el color de
relleno actual sea rojo. Ahora, cuando dibujes una nueva forma, su relleno será rojo.
Puedes fijar otros atributos de la misma manera, siempre fijándote que no haya nada
seleccionado antes de escoger el valor del atributo.

Configuración automática de atributos

Por defecto, MAGIX Web Designer 10 Premium actualiza automáticamente los
atributos para que coincidan con los del último objeto que has dibujado o
seleccionado. Entonces si, por ejemplo, haz dibujado un rectángulo y lo has hecho
verde, la próxima forma que dibujes será también verde. Si tienes un rectángulo azul
en tu diseño y deseas dibujar otro igual, entonces selecciona primero ese rectángulo
azul (esto hace que los atributos sean los actuales) y, entonces, la próxima forma que
dibujes también será azul. Entonces, al hacer clic sobre un objeto, fijas todos los
atributos actuales para que coincidan con ese objeto.

Esto te permite utilizar los objetos existentes como una "paleta" de los estilos
disponibles. Haz clic sobre un objeto para seleccionarlo y luego dibuja objetos nuevos
con este estilo.

Puedes desactivar este comportamiento en la PESTAÑA GENERAL (en la página 470)

del diálogo HERRAMIENTAS > OPCIONES . Selecciona la opción PREGUNTAR ANTES DE
APLICAR EL ATRIBUTO ACTUAL . Ahora, Web Designer te preguntará antes de cambiar
los atributos actuales a aquellos que has utilizado recientemente.

Grupos de atributo
Muchos diseños consisten en una combinación de formas cerradas con relleno y
formas abiertas (líneas en que los puntos de inicio y fin no coinciden). En general, no
se desea utilizar los atributos de una forma abierta para una cerrada, ni viceversa. Por
lo tanto, los atributos para las formas abiertas y cerradas se conservan separados y se
conocen como grupos de atributos. Fijar los valores de un grupo no afecta al otro
58

grupo. Entonces, por ejemplo, si seleccionas un rectángulo con relleno sin contorno
no cambiará el ancho de línea actual a cero para las formas abiertas.

Por los mismos motivos, los atributos de texto forman un tercer grupo de atributos. El
grupo de atributos de texto solamente se fija cuando seleccionas objetos de texto o
cuando fijas los atributos de forma manual mientras te encuentras en la herramienta
de texto.

Atributos exentos
Algunos atributos no se fijan como actuales de forma automática, aún cuando la
opción "Dar a nuevos objetos los atributos más recientes" esté activada. Esto es
porque algunos atributos pueden causar problemas si se convierten en actuales.

Por ejemplo, si has aplicado una difuminación de 10 píxeles a un objeto grande (para
hacer los bordes menos nítidos) y luego dibujas una forma de 10 píxeles de tamaño,
entonces la nueva forma sería invisible si el atributo de difuminación estuviera fijado.

Otros atributos pueden afectar la forma en que los diseños se exportan, o aumentar
significativamente el tiempo de renderización de ese diseño, por lo que no deberían
aplicarse de no ser necesario.

Los ejemplos de los atributos que se copian automáticamente:

• Colores de relleno, estilos de relleno, ancho de línea, color de línea, estilo de
línea, estilo de unión de línea, estilo de extremo de línea, puntas/extremos de
flechas, fuente de texto, tamaño de fuente de texto, márgenes de texto.

Los ejemplos de los atributos que no se copian automáticamente:

• Difuminación, transparencia, sombras, biselado, 3D.

Restauración de atributos actuales

Puedes restablecer los grupos de atributos actuales, si pulsas ESC cuando ningún
objeto esté seleccionado. Si hay objetos seleccionados, pulsar ESC quitará la
selección, así que pulsa nuevamente la tecla ESC para restaurar los atributos a su
valor por defecto.

Herramienta de formas
El EDITOR DE FORMAS te permite crear imágenes detalladas basadas en
vectores y editar también el contorno de cualquier forma.

Para formas predeterminadas como rectángulos o elipses, si quieres editar el

contorno de tus formas de caracteres de texto, debes convertir primero el objeto en
una forma editable. Puedes hacerlo si utilizas el shortcut "Ctrl + 1". Después puedes
usar el EDITOR DE FORMAS para realizar diversas ediciones de vectores avanzadas.
Consulta la sección de referencia (en la página 151) para más información acerca del
uso de esta poderosa herramienta.
www.magix.es
 Primeros pasos 59

La herramienta de líneas rectas y flechas

La HERRAMIENTA DE LÍNEAS RECTAS te facilita el dibujo de líneas rectas de un
solo segmento y el agregado de extremos de flechas.

Simplemente haz clic y arrastra sobre la página para dibujar una línea recta. Puedes
hacer clic sobre una línea existente para seleccionarla y, una vez seleccionada, puedes
hacer clic y arrastrar de cualquier extremo para moverlo.

Agregar extremos de flechas con la herramienta de líneas

rectas
La barra de información tiene dos listas desplegables a la izquierda, que te permiten
escoger un extremo de punta para cada extremo de la línea seleccionada.

Punta de flecha
Extremo posterior de la flecha
Tamaño del extremo de la flecha
Trayectoria invertida

La barra deslizante de la barra de información te permite cambiar el tamaño de los

extremos de flecha de la línea seleccionada actualmente. O puedes introducir un valor
de porcentaje al campo de texto del tamaño a la derecha de la barra deslizante. Por
defecto, los extremos de línea se crean con un ancho 6 veces mayor que el ancho de
la línea, y esto se toma como el tamaño 100%, como indica la barra deslizante de
tamaño. Si haces la línea más ancha, el ancho del extremo de la flecha también se
actualizará. Por lo tanto, introduce un valor menor que 100% para reducir el tamaño
de los extremos de la flecha o mayor que 100% para aumentarlo. A pesar de que la
barra deslizante solo llega a un máximo de 800%, puedes entrar porcentajes mayores
en el campo de texto.

Trayectoria invertida
Presiona el botón Trayectoria invertida de la barra de información para
intercambiar la punta y el final de la flecha de la línea seleccionada.

Agregar más segmentos de línea

Las líneas creadas con la HERRAMIENTA DE LÍNEAS RECTAS son, por supuesto,
completamente compatibles con las otras herramientas de dibujo. Entonces, si
quieres agregar más segmentos a una línea, curvarla o tal vez convertirla en una
forma cerrada, utiliza el EDITOR DE FORMAS .
60

Herramienta de rectángulo
Para dibujar un rectángulo, selecciona la HERRAMIENTA RECTÁNGULO y
arrástrala por la página. Verás una forma con relleno sólido a medida que
arrastras por la página, que te indicará el color de relleno y de línea, y los
bordes de la forma que estás dibujando.
Haz clic sobre "esquinas curvas" en la barra de información para crear un
rectángulo redondeado, o arrastra el control deslizante de la esquina curva para
ajustar el redondeo.

Arrastra desde cualquier esquina de los controles deslizantes para redimensionar un objeto.

Arrastra y suelta un color desde la Línea de colores a tu forma para cambiarle el

color. Consulta Colorear formas (en la página 37). Con la HERRAMIENTA DE SELECCIÓN
puedes arrastrarla, girarla y cambiar su tamaño según lo desees. Consulta
herramienta de selección (en la página 28). Puedes colocar este rectángulo detrás de
los otros objetos como imagen de fondo si pulsas Ctrl+B para "Al fondo". Como
alternativa, si se encuentra frente a los demás objetos (Ctrl+F), puedes hacer clic
derecho y seleccionar CONTORNEAR TEXTO para hacer que el texto de la página fluya
alrededor de la parte externa de esta forma (otra herramienta de autoría web de Web
Designer).

Herramienta de relleno
Puedes agregar fácilmente un relleno de color con gradación a una forma
usando esta herramienta. Selecciona la herramienta y simplemente arrastra
al objeto.
La flecha de relleno puede ser ajustada arrastrando las puntas para cambiar la
dirección, el ángulo o la extensión de la graduación.

Rectángulo redondeado con relleno con gradación

www.magix.es
 Primeros pasos 61

Nota: si arrastras la herramienta de relleno sobre un objeto agrupado como un panel

de texto, el relleno afecta a todo el grupo. Para evitarlo, debes seleccionar solo el
objeto que desees rellenar. Puedes hacerlo de distintas maneras. Un solo clic con la
herramienta de relleno seleccionará únicamente ese objeto, así como un clic en la
herramienta de selección con la tecla Ctrl presionada (esto es conocido como
"selección interna", ya que selecciona un objeto dentro del grupo). Cuando lo
arrastres rellenará solo el objeto seleccionado.

Para editar el principio o el color del relleno, arrastra y suelta un color desde la línea de
colores a la forma, o puedes seleccionar el final de la flecha de relleno en la
herramienta de relleno y utilizar el Editor de color (Ctrl + E).

Puedes crear un relleno de gradación de varios niveles haciendo que se vea la flecha
de relleno (selecciónala con la herramienta de relleno), luego arrastra un color de la
línea de colores y suéltalo cuidadosamente en la línea de flecha, donde quieras
agregar el nuevo color. Ahora puedes arrastrar este punto de relleno seleccionar
Ctrl+E para ajustar el color utilizando el Editor de color. Existen distintos estilos de
relleno, por ejemplo, este es un círculo con un relleno circular.

La sombra es otra elipse con un relleno de color de gradación y difuminado (ver abajo)

Herramienta de transparencia

Los navegadores más modernos con compatibles con efectos de transparencias

avanzados, como lo hace Web Designer. Puedes ajustar la transparencia de cualquier
gráfico o foto para hacerlo transparente. Pruébalo en tu ejemplo rectángulo.
Simplemente selecciona la herramienta de transparencia y ajusta la barra deslizante
larga en la barra de información.

Más que eso, Web Designer es compatible con la transparencia con gradación.
Funciona de forma similar al relleno de color con gradación. En la herramienta de
transparencia, simplemente arrastra a través de tu forma y puedes ver que la
transparencia desaparece. Puedes ajustar el grado de transparencia de cada
terminación de la flecha de relleno haciendo clic en la terminación de la flecha o
ajustando la barra deslizante de transparencia.

Haz un vista previa y verás que también funciona en tu navegador.

62

Difuminación
Éste es un término gráfico para armonizar las esquinas de los objetos. Web Designer
proporciona un control de difuminación que permite difuminar cualquier objeto,
gráfico, texto o foto, proporcionándole un borde borroso que se mezcla con el fondo.
El control de difuminación no es una de las herramientas de la izquierda, sino uno de
los controles que se ubican en la barra superior. Pruébalo en tu forma de rectángulo.
Selecciona la forma y haz clic en el control de difuminación de la barra superior.

La sombra debajo del dibujo de la pelota tiene un borde difuminado. La combinación

de todos estos controles te permite producir rápidamente gráficos de capas
asombrosos para tu página web, todo directamente en Web Designer sin necesidad
de utilizar ninguna otra herramienta gráfica.

Éste es un ejemplo de un rectángulo redondeado

con una gradación de color, gradación de
transparencia y bordes difuminados con un poco
de texto arriba.

Esta tiene un relleno de gradación de color desde

verde oscuro hasta verde claro de izquierda a
derecha. También tiene una transparencia
graduada desde la parte superior hasta abajo. El
difuminado otorga un borde suave. Crear este
tipo de imagen lleva solo unos pocos segundos y
se convierte automáticamente al gráfico
indicado, cuando guardas tu página web. En
Web Designer puedes crear cualquier tipo de
gráfico, foto, texto con transparencia y
simplemente "funciona". Web Designer puede
también importar casi todos los tipos de
archivos gráficos, desde Adobe EPS, hasta
Photoshop PSD, Cámara RAW y más.

Nota técnica: Web Designer convierte automáticamente todo tipo de vector gráfico
en imágenes PNG, un PNG de canal alfa, si se ha utilizado transparencia. Utiliza
capas CSS para repetir el orden de aparición de las capas en Web Designer. Esto es
compatible con todos los navegadores web modernos.

www.magix.es
 Primeros pasos 63

Herramienta de sombra
Un efecto gráfico muy popular es crear una sombra suave debajo de un gráfico o un
texto. Esto sirve para elevar el objeto del fondo.

La HERRAMIENTA DE SOMBRA te permite añadir una sombra suave a cualquier

objeto, texto, gráfico o foto. Selecciona la HERRAMIENTA DE SOMBRA y
simplemente arrastra el objeto. Puedes ajustar el desenfoque de sombra y la
transparencia utilizando los controles de la barra de información.

Texto con una sombra suave.

Para ajustar la posición de una sombra existente, ve a la HERRAMIENTA DE SOMBRA y

arrastra sobre sombra.

Gráficos de ejemplo

Este botón combina muchas de las funciones descritas más abajo: fue creado a partir
de la combinación de formas difuminadas y utilizando transparencia con gradación (el
efecto de reflexión blanco). El texto tiene una sombra suave y el botón tiene una
sombra de resplandor. Todo está agrupado. (No necesitas crear el botón, ya que
aparece en la categoría "Botones" de la GALERÍA DE DISEÑOS ).

La gran ventaja de los gráficos vectoriales, en comparación con los gráficos de "mapa
de bits" creados en software de edición como Photoshop, es que puedes volver a
colorear, editar, rotar y cambiar el tamaño del botón sin pérdida de calidad. Agrándalo
y verás que mantiene la nitidez:
64

Sobre la ampliación puedes volver a colorear de manera más fácil. Tan sólo
selecciona, haz clic en un color y elige el color que quieres reemplazar de la lista que
se muestra en el cuadro de diálogo "Reemplazar color" que aparece. Puedes incluso
extenderlo como lo desees: todo lo que hagas en Web Designer es no destructivo (lo
que significa que puedes editar siempre sin pérdida de calidad).

Aquello que normalmente lleva mucho tiempo y procedimientos en otro software

para gráficos, es cosa de niños en Web Designer.

Menús con clic derecho

Al hacer clic derecho sobre cualquier objeto en el espacio de trabajo de MAGIX Web
Designer 10 Premium, se abre un menú desplegable con opciones relacionadas con el
objeto sobre el que has hecho clic. Por ejemplo, si haces clic derecho sobre un
rectángulo que acabas de dibujar, el menú desplegable te permitirá realizar acciones
solo relacionadas con un rectángulo.

Si haces clic derecho sobre una foto, sin embargo, algunas de las opciones del menú
que aparecen serán útiles solo para fotos, mientras que otras serán similares a
acciones que puedes realizar en un rectángulo. Las operaciones específicas para el
objeto se encuentran en la parte superior de la lista del menú de clic derecho, por
ejemplo, en el caso del rectángulo, las tres primeras acciones pueden utilizarse
solamente en rectángulos.

También puedes hacer clic derecho sobre la página y el tablero de dibujo para ver un
menú con las operaciones relacionadas con el fondo de página o de tablero.

Si seleccionas más de un objeto y haces clic derecho, el menú contendrá acciones

específicas para múltiples objetos como agrupar o alinear y combinar, así como otras
operaciones comunes como cortar, copiar y eliminar. De la misma manera, si haces
clic derecho sobre objetos que has agrupado previamente, verás acciones específicas
para un grupo.

Te recomendamos hacer clic derecho sobre cualquier objeto o múltiples objetos en el

espacio de trabajo para acceder al menú específico de esos objetos. Cuando lo hayas
probado algunas veces, sabrás que acciones puedes realizar rápidamente con estos
menús.

www.magix.es
 Primeros pasos 65

Capas, MouseOver (rollover) y elementos

emergentes
Como ya se mencionó anteriormente, todos los objetos tienen un orden de ubicación
en la página: desde el objeto más al fondo hasta el objeto en primer plano.

Estos objetos están ubicados unos encima de otros.

Adicionalmente, todos los objetos pueden posicionarse en capas nombradas. Cada

capa puede tener cualquier cantidad de objetos y tiene la habilidad de poder activarse
o desactivarse. Cuando la capa se desconecta, todos los objetos en esa capa se
vuelven invisibles.

Las capas se controlan desde la GALERÍA DE PÁGINAS Y CAPAS de la barra de

galerías.
En Web Designer, las capas se utilizan para suministrar funciones MouseOver
(algunas veces llamadas "rollover") en tu página web. Éstas incluyen botones
resaltantes (se resaltan cuando pasas el cursor sobre los mismos) y otros efectos
emergentes como un panel de texto que contiene una descripción detallada de
producto. También puedes aplicar una transición a una capa para que aparezca en tu
página web con una animación.

Efectos MouseOver
Hay dos tipos de efectos mouseover. Primero, el que se utiliza en botones mouseover,
en los que cualquier objeto con dirección web puedes mostrar un objeto gráfico
superpuesto que aparece en una capa llamada MOUSEOVER. Ve más abajo para más
detalles. Hay otra posibilidad aún mejor de mouseover, con la que puedes hacer que
aparezcan los contenidos de cualquier capa como mouseover o con un clic en un
objeto en tu página. Esta capa popup puede contener texto, gráficos, fotos o cualquier
combinación de estos elementos. Más información, abajo.

Las capas MouseOff y MouseOver

Todos los objetos principales en tu página web han sido colocados en la capa inferior,
conocida normalmente como MOUSEOFF. Los botones que se destacan cuando
66

mueves el cursor del ratón sobre ellos en tu página web, tienen un gráfico adicional en
la capa, conocido como MOUSEOVER .

Si abres la Galería de capas puedes mostrar u ocultar cualquier capa si colocas o

quitas la selección en la casilla de visibilidad (columna izquierda bajo el símbolo de
ojo). Esta es una forma de mostrarte cómo pueden verse los elementos de
MouseOver en tu página web.

La capa actual siempre está destacada en la Galería de capas (la capa de MouseOff
en el diagrama de arriba) y esta es la capa en la que todos los objetos nuevos se
dibujarán. Para colocar objetos en cualquier otra capa, simplemente haz clic en la
capa requerida en la Galería de capas, y asegúrate de que los símbolos del ojo y del
candado estén abiertos.

Nota: la capa MouseOver debe estar siempre por encima de la capa MouseOff.

Para editar los objetos en una capa, los símbolos tanto de "ojo" como de "candado"
deben estar abiertos, esto significa que puedes ver y editar la página (tal como se
ilustra arriba en la capa MouseOff).

Botones mouseover (rollover)

Casi todos los botones de diseño acabado en la GALERÍA DE DISEÑOS tienen un efecto
mouseover en Web Designer. Están creados con dos versiones de cada botón, el
botón principal en la capa MouseOff y el botón "resaltado" en la capa MouseOver.

Normalmente no tienes que saber o tener en cuenta esto porque ambos botones se
comportan como uno: los cambios que haces en uno, como editar el texto de
etiqueta, se reflejan en la otra versión. Si mueves, arrastras o cambias un botón en la
capa MouseOff, la otra versión en la capa MouseOver cambiará asimismo aunque no
puedas verlo. Esto se efectúa utilizando Grupos suaves (en la página 52).
www.magix.es
 Primeros pasos 67

Orden de capas en documentos de página web

Si tu documento de página web tiene efectos MouseOver, capas popup y quizás
también efectos MouseOver en estas capas popup, deberás seguir algunas reglas
importantes sobre cómo ordenar las capas en tu documento. Si no sigues estas reglas
de orden, es posible que algunos efectos no funcionen.

Si tienes en cuenta las capas una a una desde el fondo hasta el primer plano (que
significa ir hacia arriba en la GALERÍA DE PÁGINAS Y CAPAS ), primero deben
encontrarse todas las capas estáticas. Se trata de capas que siempre son visibles y
que no se usan como popups. En la mayoría de los diseños habrá solo una: la capa
MouseOff. Pero ciertos diseños pueden tener varias, en cuyo caso deberán ser las
primeras capas en el orden. La siguiente es la capa MouseOver, en caso de que
hubiera efectos MouseOver en las capas. Esto contiene los estados de MouseOver
para todos tus botones MouseOver. Luego, debe encontrarse la capa "MouseDown",
si has agregado efectos MouseDown a las capas estáticas.

Tu siguiente capa podría ser una capa popup. Si los objetos de este grupo tienen
efectos MouseOver, entonces la siguiente capa que siga a la capa popup debe ser la
capa que contiene dichos efectos. Debe tener un nombre que comience con
"MouseOver", p. ej. "MouseOverPopup1". Luego, si la capa popup también tiene
efectos MouseDown, deberá seguir una capa cuyo nombre comience con
"MouseDown" y que contenga todos esos efectos.

A continuación puedes tener otra capa popup a la que debe seguirle de nuevo otra
capa MouseOver y MouseDown para esa capa popup. Y así sucesivamente. Puedes
tener tantas capas popup como quieras.

Por lo tanto, para resumir lo explicado anteriormente, el orden de las capas debe
seguir, en general, lo que indica la lista siguiente, que se muestra en el mismo orden
que en la GALERÍA DE PÁGINAS Y CAPAS (del primer plano al fondo) Todas las capas
son opcionales y puedes nombrar las capas como tú quieras, a excepción de los
caracteres en negrita que identifican las capas especiales MouseOver y MouseDown.

MouseDown popup n
MouseOver popup n
Capa popup n
...
MouseDown popup 1
MouseOver popup 1
Capa popup 1
MouseDown
MouseOver
Capa estática n
...
Capa estática 2
MouseOff
68

Ten en cuenta que solo tienes que preocuparte por estas reglas de orden si estás
construyendo páginas complejas con múltiples efectos popup. Si estás usando los
diseños de plantillas provistos en la GALERÍA DE DISEÑOS , no tendrás problemas con el
orden de las capas de tu sitio web.

Mover objetos entre capas

Hay varias formas de mover objetos entre capas. Primero, selecciona el objeto o los
objetos que quieras mover, y, a continuación:
• CORTA el objeto (Ctrl+X o haz clic derecho y selecciona CORTAR ). Asegúrate de
que la capa de destino es la capa actual (mostrada con , haz clic en la capa si
no es así) y luego haz clic derecho en PEGAR o PEGAR EN LUGAR. Ten en cuenta
que si cortas o copias múltiples elementos que se encuentran en diferentes
capas, la estructura de capas se conservará al pegar. Los elementos se pegarán
en la misma capa de la que se cortaron/copiaron en vez de en la capa actual. Si
quieres pegar todos los elementos en la capa actual e ignorar la estructura de
capas, usa la opción PEGAR EN LA CAPA ACTUAL . Si quieres mantener la estructura
de las capas, escoge PEGAR EN EL LUGAR DE LA CAPA ACTUAL . Estas opciones de
pegado también se encuentran en la barra desplegable del portapapeles en la
barra superior, así como también en el menú EDITAR .
• Haz clic derecho y escoge ARREGLO y luego MOVER A LA CAPA DE
ADELANTE /MOVER A LA CAPA DE ATRÁS para mover los objetos seleccionados a
una capa más arriba o abajo.
• Asegúrate de que la capa de destino esté seleccionada como la capa actual y
luego encuentra el elemento seleccionado en la GALERÍA DE PÁGINAS Y CAPAS
(haz clic en el botón LOCALIZAR ), haz clic derecho sobre el elemento y
selecciona MOVER A LA CAPA ACTUAL .

Aplicación de transiciones a las capas popup

Puedes aplicar una transición a una capa popup para controlar como aparecerá la
capa y también como se cerrará.
1. Haz clic en la capa en la GALERÍA DE PÁGINAS Y CAPAS y luego en el botón
PROPIEDADES en la parte superior de la galería.
2. Haz clic en la pestaña CONFIGURACIÓN DE POPUP del diálogo de propiedades de
capa.
3. Escoge un EFECTO DE TRANSICIÓN de la lista desplegable y mueve la barra
deslizante para fijar la velocidad de la transición en segundos.
4. Escoge la forma en que quieres que se cierre la capa de popup con ayuda de
este campo. Déjalo sin marcar si quieres que la capa popup permanezca abierta
hasta que la cierres manualmente, o márcala si quieres que se cierre cuando
hagas clic en otra parte de la página web.
5. Haz clic en APLICAR .

www.magix.es
 Primeros pasos 69

Nota: La capa mouseover aparece y desaparece cuando pones y quitas el cursor

sobre el objeto disparador. Si empleas un método de clic para visualizar la capa (del
diálogo de Enlace), la capa se muestra si haces clic en el objeto y se oculta cuando
haces clic en cualquier otro lugar de la página (o cuando haces clic en el botón para
cerrar la capa de popup si has desactivado la opción "Cerrar popup
automáticamente" que se muestra arriba).

Capas pop·up
Una alternativa más fuerte te permite visualizar los contenidos de cualquier capa al
pasar el cursor sobre cualquier objeto o haciendo clic sobre el mismo. Esto se puede
utilizar para una gran variedad de efectos pop·up diferentes, como fotos pop·up,
menús, o descripciones de objetos detalladas.

Para hacer esto, posiciona todos los objetos que quieras como pop·up en una nueva
capa (en la galería de objetos haz clic en NUEVO · no utilices la capa mouseover),
luego define la propiedad mouseover (diálogo de PROPIEDADES WEB ) del objeto
original para disparar la visualización de esta capa cuando pases el cursor sobre
cualquier objeto. Por ejemplo puedes hacer que un pop·up como éste aparezca
cuando pases el cursor sobre un texto:
70

Aquí tienes los pasos para crear un texto pop·uo como éste:
1. Haz clic en NUEVO en la GALERÍA DE CAPAS para crear una nueva capa.
2. Dibuja un rectángulo redondeado con la HERRAMIENTA RECTÁNGULO, haz clic en
un parche de color (pálido) en la LÍNEA DE COLOR para darle un color de relleno.
Para una buena medida dale una sombra suave (selecciona la herramienta
SOMBRA y tira del rectángulo).
3. Crea un bloque de texto en la parte superior de tu rectángulo. Selecciona la
HERRAMIENTA DE TEXTO y tira diagonalmente a través del rectángulo. Teclea tu
texto. Probablemente quieras ocultar ahora la capa pop·up, entonces
deselecciona la casilla del "ojo" de tu nueva capa.
4. De vuelta en la capa base (mouseoff) (haz clic en la GALERÍA DE CAPAS para
definir ésta como la capa actual), selecciona el texto que quieras que dispare el
pop·up utilizando el método usual (en la herramienta de texto). A continuación
abre el diálogo PROPIEDADES WEB (Ctrl+Shift+W) y en la pestaña MOUSEOVER
selecciona la nueva capa del menú desplegable "MOSTRAR CAPA POP·UP ". Haz
clic en OK.
5. Haz una vista general y prueba tu efecto mouseover.

Si quieres que el pop·up sólo aparezca cuando haces clic, selecciona la misma opción
en la pestaña ENLACE del mismo diálogo de PROPIEDADES WEB .

Nota: La capa mouseover aparece y desaparece cuando pones y quitas el cursor del
ratón sobre el objeto disparador. Si empleas un método de clic para visualizar la
capa (del diálogo de Enlace), la capa se revela si haces clic en el objeto y se oculta
cuando haces clic en cualquier otro lugar de la página.

Fotos pop-up
Hay una segunda forma más fácil de mostrar fotos ampliadas de miniaturas que no
implica crear nuevas capas. Ver aquí (en la página 42). Este método es mejor para
cuando tienes grandes fotos pop-up, ya que las fotos pop-up no se cargan hasta que
se hace clic en la imagen de miniatura.

Creación de botones, banners y otros gráficos

web
Web Designer es una herramienta genial para crear cualquier gráfico web para utilizar
con otros programas y otras herramientas de autoría web. Puedes dibujar estos
objetos desde el comienzo, utilizando las herramientas de dibujo o utilizar los cliparts
web de la GALERÍA DE DISEÑOS . Simplemente dibuja, diseña o importa cualquier
elemento de la GALERÍA DE DISEÑOS a una página en blanco. Manipúlalo según tus
deseos, cámbiale el tamaño, el color y el texto o fuentes, y luego exporta el elemento
como PNG o JPG.

Por ejemplo, así se crea un gráfico de botón individual a partir de una plantilla:

www.magix.es
 Primeros pasos 71

Abre la GALERÍA DE DISEÑOS y luego la categoría Botones web (o Iconos,

Banners o la categoría que necesites).
Haz doble clic sobre un diseño para abrirlo en un nuevo documento. Edítalo según tus
deseos, puedes:
• Cambiar su tamaño (o girarlo) con la HERRAMIENTA DE SELECCIÓN
• Cambiar el color con un clic en los colores apropiados en el extremo izquierdo
de la Línea de colores y escogiendo "Editar".
• Cambiar el texto con la HERRAMIENTA DE TEXTO

Una vez que estés satisfecho con el resultado, selecciona el

objeto y expórtalo como PNG o JPG con los botones de la
barra de página web (estos se encuentran en la barra
desplegable del símbolo de exportación HTML).

Para casi todos los gráficos, como botones, encabezados, íconos y otros objetos no
fotográficos deberías usar formato PNG. Para elementos que contienen fotos o partes
texturizadas a partir de fotos, entonces JPEG será un mejor formato. Si estás
guardando una foto girada o una con una sombra suave o borde suave, entonces
deberías guardarla en un formato PNG, pero debes considerar que este archivo será
mucho más grande que el JPEG.

Si haces clic en el botón CONFIGURACIÓN en el diálogo Exportar archivo, accedes a un

panel de control avanzado que te permite optimizar la imagen
72

Aquí puedes comparar las dos versiones diferentes de la misma imagen, una junto a
la otra. Por ejemplo, puedes comparar un JPEG con una versión en PNG del mismo
gráfico para evaluar la calidad o el tamaño del archivo; o comparar dos imágenes PNG
optimizadas de forma diferente. Consulta el capítulo de referencia del diálogo de
exportación (en la página 456) en el manual en PDF. En el ejemplo anterior, la
compresión JPEG se ajustó para obtener un tamaño de archivo óptimo.

Publicar la página web

Para subir tu página web en Internet de forma instantánea puedes publicarla en
MAGIX Mundo Online (MOW, por sus siglas en inglés), que incluye un servicio de
alojamiento web gratuito, o bien publicarla en otro espacio web. Publicarla en MOW
resulta más sencillo porque está integrado en Web Designer.

Selecciona "ARCHIVO" >"PUBLICAR" página web. Regístrate a continuación en MOW o

pulsa en el enlace PUBLICAR EN OTRO ALOJAMIENTO WEB .

MAGIX Mundo Online (MOW)

Pulsa el botón REGISTRAR si todavía no dispones de una cuenta en MOW: registrarse

es gratis, fácil y rápido. Introduce tu e-mail y contraseña: haz clic en MANTENERME
REGISTRADO para evitar tener que registrarte en futuras sesiones con Web Designer.

Cuando aparezca el diálogo de publicación de MOW, haz clic en el botón PUBLICAR

para poner tu página web en la base de tu espacio web o introduce el nombre de una
subcarpeta si quieres publicar varias páginas. Para conseguir una dirección de página
web diferente, pulsa el botón NUEVA DIRECCIÓN DE PÁGINA WEB.

Otros alojamientos web

Introduce los detalles FTP para tu espacio de alojamiento web: estos datos los provee
la empresa de alojamiento web.

Necesitas:
• La dirección del alojamiento
• Nombre de usuario
• Contraseña
• Subcarpeta
• URL de la página web publicada

Consulta el apartado principal Publicar página web (en la página 310) para más
información.

www.magix.es
 Primeros pasos 73

Transferencia de datos
1. Tras hacer clic en EXPORTAR (o PUBLICAR ), Web Designer abre una pequeña
ventana que muestra el progreso de la transmisión de datos y avisa cuando la
publicación se ha completado. Si has introducido la URL de tu página web con
los detalles FTP, puedes acceder directamente a ella desde aquí.
2. Como alternativa, tan pronto como la transferencia finalice, podrás abrir una
ventana de navegador e ir a la URL de la página web publicada. Los usuarios de
MAGIX Mundo Online pueden abrir su página web a través de su dirección web
en Mundo Online: http://tunombre.magix.net/publico.

Nota: si introduces una subcarpeta en la pestaña "Publicar" del diálogo "Propiedades

web", la página se guardará ahí.

Nota: muchos servidores utilizan nombres de archivo sensibles a las mayúsculas y

las minúsculas. Así, por ejemplo, la dirección web xara.com/products.htm no es
igual a xara.com/Products.htm. Para reducir la confusión y los posibles errores, Web
Designer obliga a que todos los nombres de página se escriban en minúsculas y
contengan solo caracteres permitidos. Esto significa que los nombre de páginas no
pueden contener espacios. Sugerimos utilizar un guión bajo como separador
alternativo.
74

Manejo de documento

Iniciar un nuevo documento

Principalmente, hay cuatro tipos diferentes de documentos en MAGIX Web Designer 10
Premium: página web, presentación, foto y animación. Para iniciar un nuevo documento:
Selecciona "ARCHIVO" > "NUEVO"

Así se abre un submenú con varios documentos de plantilla predefinidos por los que
empezar. La primera es la plantilla por defecto y se utiliza para crear el nuevo
documento después de iniciar MAGIX Web Designer 10 Premium. La plantilla de
animación es la plantilla por defecto para los documentos con animaciones.

El botón NUEVO DOCUMENTO de la barra de control estándar crea un nuevo

documento con la plantilla por defecto (shortcut "Ctrl + N").

Puedes guardar tus propias plantillas con el comando "ARCHIVO" > "GUARDAR
PLANTILLA" : consulta "Cambiar el documento de plantilla (en la página 469)" para más
detalles.

Abrir un documento existente

Para abrir un documento existente:
• Arrastra y suelta un archivo. Selecciona el archivo en el explorador de Windows o
en tu escritorio y arrástralo hasta el documento abierto para importarlo o hasta
cualquier otra parte de la ventana de Web Designer para abrir el documento. O,
haz doble clic sobre un archivo de Web Designer.
• O, para abrir un archivo usado recientemente, selecciónalo en ARCHIVO ·> ABRIR
RECIENTE
• O, selecciona ARCHIVO ·> ABRIR (Shortcut "Ctrl+O").
• O, haz clic sobre el botón ABRIR en la barra de control ESTÁNDAR .

Se mostrará el diálogo de apertura. El diálogo te permite una selección múltiple de

archivos. Haz clic y pulsa "Ctrl" para seleccionar varios archivos o haz clic y pulsa "Shift"
para seleccionar varios archivos

Al igual que en las ventanas de exploradores, puedes cambiar la vista del

archivo para que se vea junto con sus detalles o como vista en miniatura con
este botón.

Si VER VISTA PREVIA en la esquina superior derecha está activado, el archivo

seleccionado se verá en una vista previa aún más grande (esto no funciona en el caso de
una selección de varios archivos).

www.magix.es
 Manejo de documento 75

La ventana de MAGIX Web Designer 10 Premium

Barra de título
Nombre del archivo que se visualiza
Barra de botones estándar
Barra de galerías
Barra de información
Barra de herramientas
Reglas
Página
Tablero de dibujo
Línea de colores
Barra de estado
Indicadores de arrastre/ajuste en vivo
Barra de herramientas web
Pestañas de documentos para todos los archivos abiertos
76

La ventana de Web Designer es similar a una hoja de papel convencional sobre un

caballete o un tablero de dibujo. El rectángulo blanco representa la hoja de papel (la
carilla o página). El borde gris es el tablero de dibujo.

Puedes cambiar el tamaño de la página con un clic derecho y escogiendo OPCIONES DE

PÁGINA y luego la pestaña TAMAÑO DE PÁGINA (en la página 477).

Documento seleccionado y barra de título

Puedes abrir más de un archivo en simultáneo en Web Designer. Verás todos los
documentos abiertos como pestañas en la parte superior del espacio de trabajo.

El documento actual se muestra en el espacio de trabajo y el nombre se señala en gris

en las pestañas de documento. Haz clic derecho en la pestaña de un documento para
obtener un menú de las acciones que se pueden realizar. El tipo de documento actual
está indicado en la esquina superior izquierda de la ventana de Web Designer, junto a
las opciones del menú. El documento actual recibe todas las entradas. Cualquier cambio
que no haya sido guardado en un documento se indica con una estrella tras el nombre
del archivo.

Las pestañas muestran todos los documentos abiertos y la pestaña del documento actual está
marcada en gris.

Barras de control
Las barras de control contienen botones que puedes usar para manejar Web Designer.
Puedes personalizar las barras de control de distintas formas como, por ejemplo,
reordenándolas o creando y ocultando barras.

La ventana por defecto muestra la barra de botones ESTÁNDAR con los botones que se
utilizan con mayor frecuencia:

Puedes personalizar la barra de control ESTÁNDAR de la misma forma que las otras
barras de control.

Estos iconos con un triángulo indicador en la esquina inferior derecha cuentan con
barras desplegables. Si colocas el cursor del ratón sobre estos iconos, verás la barra
desplegable con más iconos.

Para más información sobre la personalización de barras de control consulta el capítulo

"Personalización de Web Designer" (en la página 479).

www.magix.es
 Manejo de documento 77

Barra de información
Esta es una barra de control especial. Su contenido cambia según la herramienta que
selecciones. Las barras de información para algunas herramientas específicas están
descritas en sus respectivos capítulos.

Las barras de información no pueden personalizarse.

Barra de información de la herramienta de selección

Barra de herramientas principal

Esta es la barra de control que contiene inicialmente todas las
herramientas disponibles en Web Designer (ver izquierda). Puedes
personalizar la barra de herramientas o mover herramientas a otras barras
de control.

Algunos de los símbolos de la barra de herramientas tienen un pequeño

triángulo indicador en la esquina inferior derecha. Esto significa que está
disponible una barra desplegable con más símbolos de herramientas.
Mantén el cursor del ratón sobre el símbolo para que aparezca la barra
desplegable. Luego podrás llevar el cursor del ratón sobre cada símbolo de
la barra para ver un consejo de herramienta con la indicación de su
funcionamiento.

Haz clic sobre una herramienta para seleccionarla (algunas herramientas

también tienen shortcuts de teclado).
Para más información sobre la personalización de barras de control
consulta el capítulo "Personalización de Web Designer" (en la página
479).

Reglas
Puedes ocultar reglas, cambiar el punto cero (origen) y
utilizarlas para crear líneas guía. Para más información, lee
"Reglas (en la página 91)".
78

La barra de estado

Objetos seleccionados
Opciones disponibles
Indicadores
Cursor del ratón X-Y

Esto aparece en la parte inferior de la ventana. La barra de estado te informa sobre los
objetos seleccionados, opciones disponibles, indicadores de arrastre/ajuste en tiempo
real y la posición X/Y del cursor.

Los indicadores
Estos aparecen a la derecha de la barra de estado:

Indicador Live Drag

El indicador muestra si live drag se encuentra activado o no (por defecto está
activado). Haz doble clic sobre el indicador para activar/desactivar el live drag,
todo el objeto se mueve (no solo el contorno), lo que facilita juzgar el efecto de la
edición en tiempo real. El dibujo con las herramientas de dibujo libre, líneas
rectas, Quickshape, rectángulos y elipses también se realiza en tiempo real con
esta con esta opción. Si tu PC no puede trabajar con un documento
particularmente complejo, esta opción se apagará automáticamente para
garantizar que la edición siga siendo rápida y eficiente.
Indicador de ajuste
Este indicador está activo cuando se ha seleccionado la opción VENTANA >
AJUSTAR A OBJETOS . Muestra cuando mueves un punto cerca de la distancia de
ajuste de un objeto. Para más información sobre el ajuste, consulta "Trabajar con
objetos (en la página 126)".

Coordenadas X-Y
Web Designer muestra las medidas relativas a la esquina inferior izquierda de la página.
Sin embargo, esto puede configurarse. Para más información, lee el capítulo Trabajar
con objetos.

Modo de pantalla normal/completa

En el modo de pantalla normal, parte de la ventana está ocupada por la barra de título, la
barra de menú y las barras de desplazamiento. Esto puede no ser conveniente si
necesitas la mayor superficie de edición posible. Web Designer tiene otro modo de
www.magix.es
 Manejo de documento 79

pantalla llamado "pantalla completa" que muestra un monitor más ordenado. Puedes
configurar cada modo de pantalla de la forma que quieras. Por ejemplo, puedes tener tu
propia configuración de las barras de control. La configuración se guarda y se aplica
cada vez que cambias entre los modos de pantalla.

La pantalla normal/completa se controla a través de VENTANA > PANTALLA COMPLETA o

con un clic derecho y la opción PANTALLA COMPLETA ("8" del teclado numérico).

Para ver la barra de menú en modo de pantalla completa, mueve el cursor hasta la parte
superior de la pantalla.

Abrir una segunda ventana

Es posible que quieras abrir una segunda ventana con el mismo documento para:
• obtener una vista ampliada o reducida del documento;
• ver otra parte del documento;
• obtener dos vistas de la misma área con dos calidades diferentes.

Las configuraciones de calidad están descritas más adelante.

Escoge Ventana > Nueva vista para abrir otra ventana. Puedes tener el mismo
documento abierto en diferentes ventanas.

Selección de la ventana que se quiere visualizar

Cada ventana que esté abierta se muestra como una pestaña debajo de la barra de
información. Haz clic en una pestaña para ver la ventana o clic en el menú VENTANA y
escoge un nombre para la ventana en la parte inferior.

Orden de múltiples ventanas

"VENTANA > ORDENAR VISTAS" > te ayuda a organizar múltiples ventanas. Cada ventana
tiene su propia barra de título pero ninguna barra de control. Haz clic sobre una ventana
para que sea la ventana actual. Con "Ctrl + F6" puedes pasar por las ventanas en
secuencia.

ORDENAR VISTAS muestra las ventanas ordenadas verticalmente o, en caso de más de

tres ventanas, como superpuestas.

Minimizar ventanas múltiples

Al minimizar una de las ventanas, se ve un icono en el fondo de la ventana principal de
Web Designer. Para volver a abrir la ventana haz doble clic.
80

Cambiar el valor de zoom

Muchas veces es útil aumentar la vista del documento para examinar los detalles o
reducir la vista para obtener una impresión general. Los valores por encima de 100%
muestran una vista ampliada (como si estuvieras utilizando una lupa); mientras que
debajo de 100% reducen la vista. Lo único que se modifica es la vista del documento; el
tamaño del documento y de los objetos permanece igual (el cambio de tamaño de
documento se describe más adelante). Para cambiar el valor de zoom puedes usar la
herramienta de ZOOM, el ratón o las barras de control.

Algunos valores de zoom tienen asignados shortcuts: los números 1, 2, 3, 4 colocan el

zoom entre 100% y 400%. El número 5 lo lleva al 50%.

Uso de la herramienta de zoom

Para ampliar o reducir la vista:

• Selecciona la herramienta de ZOOM de la barra principal de herramientas.

• O pulsa Alt+Z para cambiar entre la herramienta actual y la herramienta de ZOOM .
• O pulsa y mantén pulsada las teclas Alt+Z para cambiar temporalmente a la
herramienta de ZOOM (suelta Alt+Z para volver a la herramienta previa).
• O +F7 para seleccionar la herramienta de ZOOM .

Cambiar el valor de zoom utilizando el ratón

Si tu ratón tiene ruedita:
• Pulsa Ctrl y gira la rueda del ratón para cambiar el nivel de zoom.

También puedes configurar una tecla del ratón para el zoom. Además, puedes cambiar
la acción de la rueda del ratón entre desplazamiento y zoom en Herramientas >
Opciones > Pestaña del ratón (en la página 475). La acción opuesta está disponible
pulsando la tecla Ctrl.

Alternativamente, selecciona la herramienta de ZOOM:

• Haz clic para ampliar.
• +clic para reducir el valor de zoom (ver más del documento).
• Arrastra el ratón diagonalmente para crear un rectángulo. Al soltar la tecla del
ratón, el área dentro del rectángulo se ampliará para adaptarse al tamaño de la
ventana.

Cambiar el zoom utilizando la barra de información/barra

de control de zoom
Hay una barra desplegable en la barra de herramientas estándar, que te brinda acceso a
las funciones de zoom, sin tener que ir a la herramienta de zoom.

www.magix.es
 Manejo de documento 81

Mantén el cursor del ratón sobre el símbolo del zoom de la barra de

herramientas estándar para ver la barra desplegable.

Para cambiar el zoom:

Shortcut: Ctrl + R. Haz clic en el botón ZOOM ANTERIOR. Este es el valor de

zoom antes de la configuración actual. Usar este botón te permite cambiar de
un valor de zoom a otro en el documento. Esto es útil para cambiar entre el
detalle y una vista general. El valor de zoom anterior se guarda para cada
ventana. Puedes cambiar a otra ventana y el zoom previo se seguirá
manteniendo.
Shortcut "1" Haz clic en el botón Zoom a 100%. El factor del zoom cambia al
100%

Shortcut "Ctrl + + J". Haz clic en el botón ZOOM AL DIBUJO . La ventana

muestra todos los objetos del documento.

Shortcut "Ctrl + + P". Haz clic en el botón ZOOM A LA PÁGINA . La ventana

muestra toda la página o pares de páginas.

Shortcut "Ctrl + + Z". Haz clic en el botón ZOOM A LA SELECCIÓN . El objeto u

objetos seleccionados ocuparán toda la ventana.

Introduce un valor en el campo de texto. Pulsa "" para

implementar el cambio o selecciona algún valor de
zoom predeterminado incluyendo los mencionados
anteriormente (página, dibujo, seleccionado, anterior)
en el menú desplegable.

Desplazar el documento dentro de la ventana

La forma más rápida y fácil de desplazar el documento es utilizar el botón central del
ratón (que muchas veces es también la ruedita). Haz clic y pulsa la tecla del ratón y
mueve el ratón. Suelta el botón para volver a la herramienta anterior.

Para mover el documento dentro de la ventana también puedes:

• Usar las barras de control y las flechas a los costados de la ventana.

La visualización de las barras de desplazamiento es opcional. Escoge Ventana > Barras

> Barras deslizantes para desactivarlas

• Usa la rueda del ratón para desplazar el documento hacia arriba y hacia abajo
(Shift + rueda del ratón para izquierda a derecha)
82

Puedes cambiar la acción de la rueda del ratón entre desplazamiento y zoom en

Herramientas > Opciones > Pestaña del ratón. La acción opuesta está disponible
pulsando la tecla Ctrl.

• O selecciona la herramienta de DESPLAZAMIENTO de la barra de

herramientas principal (shortcut+F8).

• O pulsa la barra espaciadora o Alt+X para cambiar entre la herramienta actual y la

herramienta de DESPLAZAMIENTO.
• O pulsa y mantén pulsada la barra espaciadora o Alt+X para cambiar
temporalmente entre la barra de DESPLAZAMIENTO (y suelta la tecla para volver a la
herramienta anterior). Después puedes usar el ratón para desplazar el documento
por la ventana.

La barra de información de la herramienta de DESPLAZAMIENTO es la misma que la barra

de información de la herramienta de ZOOM (descrita anteriormente).

Cambiar el tamaño de página

Cuando se abre un nuevo documento en Web Designer el tamaño de página es 760 x
700 píxeles (SVA página web). Sin embargo, si lo deseas puedes cambiar el tamaño de
página para que sea compatible con otras resoluciones de pantalla como VGA.
1. Escoge en el menú "HERRAMIENTAS - > OPCIONES".
2. De ser necesario, escoge la pestaña de tamaño de página.
3. Selecciona el tamaño de página que deseas.

Si seleccionas PERSONALIZAR en la selección de tamaño puedes configurar un ancho y

un alto personalizado en los campos de abajo.

Cada página del documento (página web exportada) puede tener una tamaño diferente.
Con la opción TODAS LAS PÁGINAS DEL SITIO WEB CON EL MISMO TAMAÑO puedes
determinar un tamaño de página para que se aplique a todas las páginas del documento.

Puedes cambiar el alto de la página arrastrando el borde inferior de la

página con la herramienta de selección.

Páginas múltiples en el documento

Un documento de MAGIX Web Designer 10 Premium puede tener múltiples páginas.
Cada página se exporta a una página en HTML independiente, es decir, cada documento
en MAGIX Web Designer 10 Premium corresponde a una página web. Por defecto,
cuando abres o creas un nuevo documento web, Web Designer muestra solamente una
página. Los documentos impresos, sin embargo, se visualizan por defecto en vista de
multipágina. Haz clic derecho en una página o su tablero de dibujo y selecciona o
desactiva VISTA MULTIPÁGINA para cambiar entre modos de presentación.
www.magix.es
 Manejo de documento 83

La página actual
Si haces clic en una página de un documento multipágina, se convertirá en la página
actual.

Debes estar situado en la página actual cuando desees introducir, duplicar o

mover páginas, como pasaremos a explicarte en las secciones siguientes.

Puedes saber en qué página del documento te encuentras actualmente

mediante los indicadores situados en las esquinas de la página.

Introducir páginas en tu documento

Haz clic derecho sobre una página y escoge PÁGINA NUEVA o NUEVA DOBLE PÁGINA. Se
insertará una nueva página en blanco después de la página actual,

haz clic derecho sobre una página y escoge DUPLICAR PÁGINA ACTUAL o DUPLICAR DOBLE
PÁGINA ACTUAL . Un duplicado de la página actual se insertará detrás de la página.

La nueva página será la

misma que la página original
incluyendo su tamaño y
orientación, e incluirá todo
su contenido, de manera tal
que la puedas utilizar como
plantilla para nuevos
contenidos.
También puedes utilizar las
opciones del menú "EDITAR >
PÁGINAS "

Además, la barra de herramientas estándar cuenta con una barra desplegable que te
permite añadir, duplicar y eliminar páginas rápidamente.

Mantén el cursor del ratón sobre cada símbolo de la barra para ver un consejo de
herramienta para cada operación. Puedes agregar una nueva página en blanco, duplicar
la página actual o eliminarla.
84

Copiar y pegar páginas

Puedes copiar y pegar páginas enteras en el documento actual o pegar páginas en otro
documento. Esto copia las dimensiones de página, las capas y otros atributos de la
página, además de todos los objetos en la página.

Para copiar la página actual, borra cualquier selección actual pulsando Esc o haz clic en
una parte vacía de la página o del área de trabajo. En la barra de estado aparecerá "No
hay objetos seleccionados". Haz clic en una parte en blanco de la página y selecciona
COPIAR PÁGINA (o pulsa "Ctrl + C").

Cuando pegas una página copiada, se añade inmediatamente después de la página

actual. Para pegar usa las teclas "Ctrl + V" o haz clic derecho en la página y selecciona
PEGAR > PÁGINA en el menú contextual.

Nota: si el documento en el que se pega una página tiene la opción TODAS LAS PÁGINAS
DEL DOCUMENTO IDÉNTICAS activada en ARCHIVO> OPCIONES DE PÁGINA , las
dimensiones de la página pegada serán reemplazadas por las dimensiones de página
del documento. Entonces, la nueva página tendrá las mismas dimensiones que las
otras páginas del documento.

Mover páginas dentro del documento

El modo más fácil de cambiar entre páginas en tu documento es arrastrar la página en
miniatura en la galería páginas y capas (que está fijada a la parte derecha por defecto).
También puedes seleccionar más de una página a la vez y arrastrar para reordenarlas.

Como alternativa para mover la página actual:

• Selecciona "EDICIÓN" > "PÁGINAS" > "MOVER PÁGINA HACIA ARRIBA" o haz clic
derecho y selecciona MOVER PÁGINA HACIA ARRIBA para cambiar la página actual
por la anterior.
• Selecciona "EDICIÓN" > "PÁGINAS" > "MOVER PÁGINA HACIA ABAJO" o haz clic
derecho y seleccionaMOVER PÁGINA HACIA ABAJO para cambiar la página actual por
la posterior.

Estas opciones de menú serán desactivadas si estás en la primera o la última página del
documento respectivamente.

Eliminar páginas de tu documento

Para eliminar la página actual de tu documento haz clic derecho y selecciona ELIMINAR
PÁGINA ACTUAL o ve a "EDICIÓN" > "PÁGINAS" > "ELIMINAR PÁGINA ACTUAL" . La página
actual y todos sus contenidos serán eliminados. O selecciona una o más páginas en la
galería de páginas y capas y pulsa el botón "Eliminar" o la tecla de borrado.

www.magix.es
 Manejo de documento 85

Navegar entre páginas

Además de los métodos usuales para moverse dentro de un documento (como la barra
deslizante y la ruedecilla del ratón), existen otras formas de navegar a través de las
páginas:

Hacia arriba: se mueve hacia arriba del documento (retrocede a la página anterior). La
cantidad de desplazamiento depende de tu nivel de zoom. Cuanto más alejado estés del
documento (zoom out), más grande será el desplazamiento.

Ctrl + Re. Pág. (page up): va hacia el centro de la página anterior.

Hacia abajo: se mueve hacia abajo del documento. La cantidad de desplazamiento

depende de tu nivel de zoom. Cuanto más alejado estés del documento (zoom out), más
grande será el desplazamiento.

Ctrl + Av. Pág: va hacia el centro de la página anterior.

O haz clic en la flecha que apunta hacia arriba o hacia abajo

en la barra de estado de acuerdo a dónde te quieres
desplazar:
La barra de estado también es útil para saber qué página/s estás visualizando
actualmente.

Nota: todos estos movimientos son relativos a las páginas que estés visualizando, no a
la página actual.

Galería de páginas y capas

También puedes utilizar la galería de Páginas y capas para administrar
convenientemente las páginas en tu documento. Te permite ver, añadir, duplicar,
eliminar, reorganizar y renombrar páginas desde una sola vista. Para más información,
consulta Galería de páginas y capas (en la página 407).

Guardar el documento
Esta sección explica cómo guardar los documentos en el formato de Web Designer (su
formato nativo). Para más detalles sobre exportar documentos en otro formato, lee el
capítulo "Importación y exportación (en la página 446)".
Te recomendamos que siempre guardes los documentos de forma regular. Si no lo
haces, es posible que lo lamentes si hay un corte de electricidad repentino o si tu PC se
cuelga de repente, ya que perderás muchas horas de trabajo invertidas en un
documento complicado. Asegúrate de que la función de copia de seguridad automática
esté activada para que se realicen copias regulares de los documentos mientras
trabajas. Consulta la sección Copias de seguridad automáticas (en la página 88) a
continuación para más detalles.
86

Opción Guardar (en el menú Archivo)

(Shortcut Ctrl+S o clic sobre el botón Guardar en la barra de control
ESTÁNDAR ).

Esta opción te ofrece una forma rápida de volver a guardar el documento con el mismo
nombre de archivo. La opción no está disponible salvo que hayas realizado cambios y
todavía no los hayas guardado.

Para un nuevo documento que todavía no se ha guardado en disco, la opción actúa

como "Guardar como" (descrita a continuación).

Guardar como (en el menú Archivo)

Esta opción abre un diálogo que te permite guardar el documento con un nuevo nombre
o en otro directorio. Esta opción es útil para realizar copias de seguridad de Web
Designer.

Guardar todo (en el menú Archivo)

Esto actúa como una serie de comandos de GUARDAR o GUARDAR COMO para todos los
documentos que se encuentran abiertos actualmente.

Directorios de compatibilidad
Algunos documentos, que se utilizan para crear páginas web, tienen archivos externos
de referencia porque estos no pueden ser integrados al archivo de diseño .web. Por
ejemplo, un archivo Flash (swf) de tu página web. Debes mantener el archivo Flash junto
al archivo de diseño porque si no, cuando quieras exportar la página web, esta no
funcionará de forma correcta. Otra razón por la que es importante mantener ambos
archivos juntos es para cuando quieras enviar el diseño a alguien o para cuando quieras
transferirlo a otro equipo. MAGIX Web Designer 10 Premium ofrece un directorio
opcional de compatibilidad para los archivos externos que se encuentra a la derecha del
archivo de diseño.

Nombres para el directorio de compatibilidad

El archivo de diseño y su directorio de compatibilidad correspondiente se identifican
fácilmente porque tienen el mismo nombre. El directorio de compatibilidad para
"miSitio.web" se llama "miSitio_web_archivos". Si cambias el nombre de un archivo de
diseño o lo copias o mueves de sitio, no te olvides de cambiar el nombre del directorio
de compatibilidad (si existe uno). Y si deseas enviar un archivo de diseño, recuerda que
debes mandar también el directorio de compatibilidad.

Cuando cargues un diseño que tiene un directorio de compatibilidad y luego escoges la

opción "Guardar como", MAGIX Web Designer 10 Premium también copiará todo el
directorio de compatibilidad (si existe uno).
www.magix.es
 Manejo de documento 87

Contenido del directorio de compatibilidad

Si utilizas el marcador de lugar (en la página 287) del diálogo PROPIEDADES WEB para
insertar una referencia a un archivo externo en tu diseño de la página web, MAGIX Web
Designer 10 Premium copiará automáticamente ese archivo al directorio de
compatibilidad. Si no existe el directorio de compatibilidad se creará uno. Ten en cuenta
que si realizas modificaciones al objeto del marcador posteriormente, el archivo original
no se borrará automáticamente del directorio de compatibilidad. Si no necesitas más ese
archivo, deberás eliminarlo manualmente.

También puedes copiar manualmente archivos al directorio de compatibilidad. MAGIX

Web Designer 10 Premium no eliminará ningún archivo, independientemente de si estos
aparecen en el diseño o no. Esto es así porque hay muchas formas distintas de colocar
referencias a archivos externos en el archivo de diseño. Por ejemplo, se puede insertar
un código complejo de HTML en el diseño que contenga una referencia a un archivo
externo de tu directorio de compatibilidad. O también se puede tener un archivo externo
que contenga una referencia a otro archivo externo. No hay forma de que MAGIX Web
Designer 10 Premium pueda estar seguro de que el archivo no va a ser utilizado en la
página web, por eso no los elimina.

Exportación de páginas web con directorios de

compatibilidad
Cuando exportas un documento de página web, se copiarán todos los archivos de
directorio de compatibilidad a la carpeta que contenga todas las imágenes de tu página
web. Si exportas "miSitio.web" a "index.htm", los archivos de la carpeta
"miSitio_web_archivos" se copiarán a la carpeta "index_htm_archivos".

Cerrar el documento
Para cerrar el documento:
• Seleccionar "ARCHIVO" > "CERRAR", pulsa "Ctrl + F4", o también "Ctrl + W".
• O bien haz clic sobre la X más pequeña de las dos que se encuentran en la esquina
superior derecha.
• O incluso haz clic derecho en la pestaña del documento para ver un menú de
contexto sensible con una serie de opciones de guardar y cerrar tanto para una
sola pestaña cono para todas las pestañas abiertas.

Haz clic derecho en una pestaña para visualizar múltiples opciones de guardar y cerrar.
88

Copias de seguridad automáticas

MAGIX Web Designer 10 Premium guardará como opción copias de seguridad de tus
documentos abiertos mientras trabajas. Esto te ayudará a evitar que pierdas tu trabajo
en el caso de un fallo eléctrico o de un cierre anormal del programa. También es útil si
deseas volver a una versión anterior de tu documento.

asPara activar o desactivar las copias de seguridad automáticas, abre el diálogo

HERRAMIENTAS >OPCIONES y escoge la pestaña COPIAS DE SEGURIDAD .

Copias de seguridad de documentos abiertos

Para activar las copias de seguridad, selecciona este campo y escoge cómo te gustaría
que se hagan las copias de seguridad. El periodo sugerido es de 10 minutos, lo que
significa que un documento abierto se guardará si han pasado más de 10 minutos desde
que se ha guardado por última vez (o desde que se creó o abrió el documento).

Ten en cuenta que una vez que el periodo configurado haya pasado desde la última
copia de seguridad, la próxima copia de seguridad se realizará cuando el programa haya
estado inactivo durante al menos 15 segundos. Esto evita que se interrumpa tu trabajo y
que el documento se guarde mientras se está modificando. En el uso normal, es poco
probable que no haya periodos inactivos de 15 segundos o más, por lo que permite
realizar una copia de seguridad poco después. De todas formas, si estás editando
activamente durante un periodo extendido de tiempo es posible que transcurra bastante
más tiempo que el configurado entre dos copias de seguridad.

La función de copia de seguridad automática no guarda los cambios de los

subdocumentos abiertos. Cuando se ejecuta una copia de seguridad programada, solo
www.magix.es
 Manejo de documento 89

se guarda el documento principal en su estado actual y sin los cambios no guardados del
grupo. Por esta razón, se recomienda guardar regularmente los cambios de edición
interna en el documento principal.

Cuando se realiza una copia de seguridad, verás una barra de progreso en la parte
inferior de la ventana de MAGIX Web Designer 10 Premium mientras se finaliza el
procedimiento.

Ubicación de la copia de seguridad

Utiliza el botón Explorar si quieres cambiar la carpeta en la que están guardadas tus
copias de seguridad.

Puedes acceder a los documentos de copia de seguridad en cualquier momento en la

opción de menú ARCHIVO>ABRIR RECIENTE>COPIAS DE SEGURIDAD . Esto abre un diálogo
de archivos con la carpeta de copias de seguridad, de forma que puedas navegar, abrir o
eliminar cualquiera de los archivos de copia de seguridad.

Revisiones
Por defecto, se guardan 10 revisiones de cada diseño en tu carpeta de copias de
seguridad, pero puedes escoger cambiar este número en el campo de revisiones. Las
revisiones que excedan la cantidad establecida, se eliminarán automáticamente. Cada
archivo de copia de seguridad recibe el nombre del documento del que se ha tomado,
junto con la fecha y hora en que se ha realizado la copia de seguridad.

ADVERTENCIA: Ten en cuenta que si tienes múltiples documentos que comparten el

mismo nombre de archivo en diferentes carpetas en tu ordenador, sus copias de
seguridad también compartirán el nombre en la carpeta de copias de seguridad. Por lo
tanto, intenta usar nombres de archivo únicos para tus diseños con el propósito de
evitar que las copias de seguridad de un diseño sobrescriban otras con el mismo
nombre.

Documentos sin título

Las copias de seguridad de los documentos que has creado y que no has guardado se
almacenarán con el nombre "Untitled" seguido de un número y la fecha/hora. Este
nombre y número corresponden a los que se muestran en la barra de título cuando estás
editando documentos sin guardar.

ADVERTENCIA: como los documentos sin guardar se denominan Untitled1, Untitled2,

etc., las copias de seguridad de estos documentos se sobrescriben relativamente
rápido. Por lo tanto, deberías guardar los documentos importantes con un nombre
exclusivo de tu elección para poder identificar fácilmente las copias de seguridad de
ese documento en el directorio de copias de seguridad.
90

Guardar copias de seguridad de documentos abiertos al

cerrar el programa
La pestaña "Copias de seguridad" del diálogo "Opciones" te permite activar laCOPIA DE
SEGURIDAD AUTOMÁTICA Y RESTAURACIÓN . Cuando esta opción está activada, al cerrar
MAGIX Web Designer 10 Premium, no se te preguntará si quieres guardar los
documentos modificados que todavía están abiertos. Por el contrario, se realiza una
copia de seguridad de todos los documentos abiertos en la carpeta de copias de
seguridad y el programa se cierra. Luego, al iniciar nuevamente el programa, los mismos
documentos se cargan automáticamente para que puedas continuar trabajando desde
donde los has dejado.

Ten en cuenta que si tiene cualquier vista abierta de un subdocumento de edición

interna, estas se cerrarán sin notificación y se guardarán en el documento principal
cuando se cierre el programa y se hace una copia de seguridad del documento principal.
Las vistas del subdocumento de edición interna no se vuelven a abrir cuando se reinicia
el programa. Consulta edición dentro de grupos.

Recuperación tras cierres anormales del programa

Si has activado las copias de seguridad automáticas y el programa se cierra de forma
anormal (debido a un corte de electricidad, por ejemplo), el programa debería detectarlo
al reiniciarse. De ser así, te ofrecerá la posibilidad de restaurar la copia de seguridad más
reciente de cada documento que se encontraba abierto en el momento de la última
copia de seguridad. El cierre anormal no se detectará si no se ha realizado ninguna copia
de seguridad desde el último cierre normal del programa.

Copias de seguridad al cerrar el sistema

Si cierras Windows sin cerrar el programa primero, todos los documentos abiertos se
guardarán en la carpeta de copias de seguridad aun cuando la opción "Guardar copias
de seguridad de documentos abiertos al cerrar el programa" no esté activada. Esto
permite que el cierre del sistema se realice sin que MAGIX Web Designer 10 Premium
lo interrumpa para preguntarte acerca de los documentos modificados sin guardar. La
próxima vez que inicies el programa, se te preguntará si quieres restaurar o no los
documentos que estaban abiertos en el momento del cierre del sistema.

Recuperación de copias de seguridad

Puedes acceder a las copias de seguridad de tus documentos con Archivo>ABRIR
RECIENTES ->COPIA DE SEGURIDAD . Esto abre un diálogo de archivos con la carpeta de
copias de seguridad, de forma que puedas navegar, abrir o eliminar cualquiera de los
archivos de copia de seguridad. Es una buena idea utilizar este diálogo para limpiar
viejas copias de seguridad de forma periódica. Ten en cuenta que cuando cargas un
documento de copia de seguridad no se asocia automáticamente con el archivo de
diseño del que se ha realizado la copia de seguridad. Se trata como un documento
independiente con sus propios derechos. Por lo tanto, si decides conservar la copia de

www.magix.es
 Manejo de documento 91

seguridad deberías usar ARCHIVO>GUARDAR COMO para guardarlo en algún lugar con un
nombre adecuado.

Cuadrícula en pantalla
Para ayudarte a diseñar tu documento, Web Designer puede mostrar una cuadrícula en
la pantalla (la cuadrícula aparece solamente en la pantalla, no se exporta ni se imprime).
La cuadrícula te ayuda a alinear objetos (similar a utilizar una hoja de gráficos como
ayuda para dibujar).

Haz clic derecho y escoge "MOSTRAR CUADRÍCULA/GUÍAS" > "MOSTRAR CUADRÍCULA"

para activar y desactivar la visualización de la cuadrícula o escoge "AJUSTAR A" >
"AJUSTAR A CUADRÍCULA" . También puedes escoger la opción "VENTANA" > "AJUSTAR A
CUADRÍCULA" . En este caso, los puntos de cuadrícula actúan como imanes y, al mover
objetos, estos se ajustan al punto de cuadrícula más cercano. Por defecto los documento
web tienen activado "AJUSTE A CUADRÍCULA" , con una cuadrícula de 1 píxel.

El tipo de cuadrícula (isométrica/rectangular), el punto 0,0 (el origen) y el espaciado

entre los puntos de la cuadrícula se configuran en la pestaña CUADRÍCULA Y REGLA (en la
página 474) del diálogo de opciones. Cualquier cambio que hagas se aplicará solo al
documento seleccionado. El ajuste a los objetos magnéticos también está activado por
defecto para los documentos web. El ajuste de objeto es una forma muy precisa de
alinear líneas, puntos y bordes de los objetos a cualquier otro objeto para que se toquen.

Puedes usarlo para alinear los centros de los objetos o para alinear objetos respecto al
centro de la página o para alinearlos de forma horizontal o vertical en cualquier parte en
el centro de la página o en la esquina de la misma.

Para activar el ajuste de los objetos, haz clic en el botón AJUSTAR A OBJETOS o
haz clic derecho y escoge "AJUSTAR A" > "AJUSTAR A OBJETOS" . También
puedes escoger la opción "VENTANA" > "AJUSTAR A CUADRÍCULA" .
Consulta Manejo de objetos (en la página 126) para más detalles sobre el ajuste de
cuadrículas y el ajuste a objetos.

Reglas
Las reglas están desactivadas por defecto. Para activarlas:
• Haz clic derecho y escoge "MOSTRAR CUADRÍCULA/GUÍAS" > "MOSTRAR REGLAS"
para activar y desactivar la visualización de la cuadrícula.
• Pulsa "Ctrl + Shift + R".
• O selecciona "VENTANA" > "BARRAS" > "MOSTRAR REGLAS".

Web Designer utiliza las reglas para:

• controlar los márgenes, tabulaciones y sangrías (en la página 208) en la
HERRAMIENTA DE TEXTO .
92

• para informarte la parte de la página que estás viendo;

• mostrar la posición X-Y actual del cursor;
• aplicar líneas guía. Si la opción "VENTANA" > "AJUSTAR A CUADRÍCULA " está
activada, las líneas guía se ajustan a las divisiones de las reglas. Para más
información sobre líneas guía, lee el apartado guías y líneas guía en el capítulo
Manejo de objetos (en la página 126).

Cuando creas o cambias el tamaño de objetos, puedes utilizar las reglas para controlar el
tamaño. También puedes utilizar la HERRAMIENTA DE SELECCIÓN para un trabajo más
exacto. Lee Selección de objetos para más información. Las reglas pueden verse sobre el
borde izquierdo y el borde superior de la ventana. Una línea punteada sobre cada regla
sigue la posición actual del cursor.

Las unidades y números de las divisiones de las reglas son los mismos configurados
para personalizar la cuadrícula en pantalla. Estos valores se configuran utilizando la
pestaña "Cuadrícula y regla (en la página 474)" del diálogo "Opciones". Las unidades
actuales y los factores de cambio de tamaño se visualizan en la esquina superior
derecha de la regla.

Mostrar/ocultar reglas
Haz clic derecho y escoge "MOSTRAR CUADRÍCULA/GUÍAS" > "MOSTRAR REGLAS" ("Ctrl +
Shift + R") para activar y desactivar las reglas. Los cambios se aplicarán a la ventana
actual y a las siguientes ventanas que abras. No afecta a las otras ventanas abiertas.

Cambiar los puntos cero de las reglas

Muchas veces es fácil medir los objetos si alineas el punto 0,0 de la regla con el objeto.
Para mover el punto 0,0 arrastra el cuadrado de la intersección de ambas reglas.

Puedes arrastrar vertical u horizontalmente a lo largo de las reglas o hasta cualquier otra
parte de la ventana de edición de Web Designer. A medida que lo hagas, una línea
punteada te mostrará la nueva posición.

Esto también mueve el origen de la cuadrícula de forma que las divisiones de la regla
siempre se encuentren alineadas con la cuadrícula.

También puedes mover el punto cero desde la pestaña CUADRÍCULA Y REGLA del diálogo
de opciones (descrito a continuación)
www.magix.es
 Manejo de documento 93

Calidad de imagen
Hay cinco configuraciones de calidad disponibles en el menú VENTANAS >CALIDAD que
afectan la forma en que el documento aparece en MAGIX Web Designer 10 Premium:
• Sólo contorno. Ahora, con antialiasing completo para una mayor calidad de
visualización de la pantalla
• Contornos con pasos de transición
• Color total (sin antialiasing)
• Alta calidad (antialising total y suavizado de imagen)
• Muy alta calidad (el mejor antialiasing de la industria. La nueva visualización de
fotos bicúbica aumenta la calidad de fotos reducidas).

COLOR TOTAL muestra el documento a color, pero con el antialiasing desactivado.

La configuración CONTORNO muestra solamente el contorno de las formas (se dibujan

como wire frames). Esto facilita la selección de objetos que se encuentran detrás de
otros objetos.

La configuración de calidad no tiene efecto en la forma en que el documento exporta o

imprime, excepto en el caso de exportaciones de mapas de bits que utilizan la
configuración de calidad actual.

La tecla de restricción
La tecla "Ctrl" tiene una función especial en Web Designer. Restringe la acción de la
función actual de alguna manera. Por ejemplo, normalmente puedes girar un objeto a
cualquier ángulo. Pero en Web Designer, si pulsas la tecla "Ctrl" mientras giras un
objeto, la rotación está restringida a una serie de ángulos predeterminados. Por defecto,
el objeto girará solamente en múltiplos de 45 grados y a cualquier rotación en que un
borde recto importante del objeto quede vertical u horizontal.

La línea negra que se encuentra a la

izquierda puede girarse a cualquier
ángulo dentro del círculo. A la derecha se
encuentra la misma línea, pero al
presionar "Ctrl", solo puede rotarse hasta
las posiciones indicadas.
De forma similar, restringir un rectángulo crea un cuadrado perfecto y restringir una
elipse crea un círculo perfecto. Si sueltas la tecla "Ctrl", ya no estarán restringidos.

La función de restricción de ángulo se define en OPCIONES -> GENERAL -> RESTRICCIÓN

DE ÁNGULO (en la página 472).
94

Galerías
MAGIX Web Designer 10 Premium usa galerías para suministrar acceso conveniente a
bibliotecas externas de contenido como plantillas, fuentes, colores, cliparts, atributos de
líneas y mapas de bits/fotos. Esta sección de la ayuda suministra información general
sobre características que son comunes a múltiples galerías. Las secciones individuales
describen características específicas a una galería en particular.

Por defecto, la GALERÍA DE PÁGINAS Y CAPAS está abierta en el modo Páginas (y muestra solo
páginas, no sus capas) y está fijada en la parte derecha de la ventana de Web Designer.

Página y capas
Diseños
Mapa de bits
Líneas
Rellenos

www.magix.es
 Manejo de documento 95

La GALERÍA DE PÁGINAS Y CAPAS te muestra y te permite manipular las páginas de tu

documento y las capas dentro de cada página.

Las GALERÍAS de DISEÑOS y RELLENOS te permiten escoger entre diferentes plantillas y

estilos suministrados con MAGIX Web Designer 10 Premium.

La GALERÍA DE MAPAS DE BITS te muestra los mapas de bits y fotos que estás utilizando
en todos los documentos abiertos.

Algunas galerías se describen en detalle más adelante.

Ver una galería

Para visualizar una galería:
1. Haz clic o pasa el cursor sobre la pestaña vertical de la galería que se encuentra a
la derecha del espacio de trabajo (la barra de galerías). La galería se abrirá
automáticamente. Al quitar el cursor de la galería, esta se cerrará
automáticamente.
2. Para mantener una galería abierta mientras trabajas, haz clic en el botón OCULTAR
AUTOMÁTICAMENTE que se encuentra en la esquina superior derecha. El botón
OCULTAR AUTOMÁTICAMENTE se transforma en un alfiler con la punta hacia abajo
para indicar que la galería está fijada al espacio de trabajo.
3. Para cerrar una galería fijada, consulta Cerrar una galería (en la página 101).
4. Si quieres que las galerías dejen de abrirse automáticamente al hacer MouseOver,
desactiva la opción BARRA DESPLEGABLE del menú "Herramientas" > "Galerías".

Galería no fijada: la galería se cierra al quitar el cursor de la misma.

Galería fijada: la galería permanece abierta aunque quites el cursor de la

misma y, además, puedes moverla y fijarla (en la página 95) donde quieras.

Nota: por defecto, las GALERÍAS DE LÍNEAS y RELLENOS no muestran su título hasta que
no se hayan abierto, sino sus iconos individuales. Web Designer siempre muestra el
título de la última galería que has visto.

Mover y fijar una galería

Puedes liberar cualquier galería de la barra de galerías, si deseas moverla a una
ubicación más práctica en el espacio de trabajo. También puedes fijar la galería (o un
grupo de galerías, consulta Agrupar galerías) en la parte superior, inferior, derecha o
izquierda del espacio de trabajo.
96

Puedes mover una galería a cualquier lugar del espacio de trabajo

Para mover una galería:

1. Abre una galería y haz clic en el botón OCULTAR AUTOMÁTICAMENTE para fijar la
galería. El botón muestra un alfiler hacia abajo para indicar que la galería puede
moverse y fijarse en otro lugar.
2. Haz clic en la barra de título de la galería y arrastrar para moverla. Puedes dejar
que la galería "flote libremente" por cualquier lugar del espacio de trabajo o puedes
fijarla en una nueva ubicación.

Si mueves cualquiera de las galerías, las otras la acompañarán como si fuera un grupo.
Accede a una galería individual con un clic sobre su pestaña en la parte inferior del
grupo o haz clic y arrastra la pestaña de la galería alejándola del grupo.
• Mapa de bits
• Línea
• Relleno

Si haces clic y arrastras la barra de título de una galería que puedes fijar, aparecerán
flechas en el espacio de trabajo que te indicarán los lugares en donde puedes fijar la
galería.

www.magix.es
 Manejo de documento 97

Al arrastrar una galería, aparecerán flechas de fijación en la parte central, superior, inferior,
izquierda y derecha del espacio de trabajo. Arrastra la galería hasta una flecha para fijarla allí.

Ejemplo de una galería que se ha fijado a la derecha del espacio de trabajo.

Para fijar una galería:

1. Haz clic y arrastra la galería hasta la flecha que apunta a la ubicación en donde
quieres colocar la galería. Por ejemplo, si quieres colocar la galería en la parte
superior de la pantalla, muévela hacia la flecha que señala hacia la parte superior
del espacio de trabajo.
98

2. Cuando el cursor llega a la flecha, un recuadro gris transparente indica la nueva

ubicación de la galería.
3. Suelta el botón del ratón para fijar la galería. Ahora, cuando cierres u ocultes
automáticamente la galería, la pestaña se mostrará en esta nueva ubicación.
4. Pasa el cursor o haz clic sobre la pestaña para volver a abrir la galería.

Nota: para mover las galerías a su posición por defecto, escoge BARRAS DE
CONTROL del menú VENTANA , haz clic en GALERÍAS y finalmente en RESTAURAR .

Agrupación de galerías
Puedes arreglar dos o más galerías de forma que se encuentren cerca unas de otras.
1. Para posicionar una galería para que quede adyacente a una que has fijado
anteriormente, haz clic y arrastra la segunda galería hasta las cuatro flechas del
centro del espacio de trabajo.
2. Suelta cuando te encuentres sobre la flecha que indica en dirección a la primera
galería que has movido. La segunda galería se fija junto con la primera.

También puedes agrupar galerías y mover todo el grupo a una nueva ubicación si, por
ejemplo, estás trabajando principalmente con dos o tres galerías que quieres que se
encuentren cerca unas de otras y a las que deseas acceder fácilmente.

Ejemplo de un grupo de galerías con pestañas de galería en la parte inferior. Haz clic y arrastra para
agregar o quitar una galería del grupo.

www.magix.es
 Manejo de documento 99

Para agrupar galerías:

1. Desactiva el botón OCULTAR AUTOMÁTICAMENTE en una de las siguientes galerías:
MAPAS DE BITS, LÍNEAS , RELLENO , . La galería se agrupará automáticamente con las
otras cinco galerías y se mostrarán como pestañas en la parte inferior del grupo.
2. Para quitar una galería de un grupo, haz clic en su pestaña y arrástrala hacia afuera.
3. Haz clic en una pestaña para abrir una galería del grupo.
4. Para agregar una galería a un grupo, haz clic y arrastra la galería hasta el grupo.
Aparecerán cuatro flechas en el centro del grupo.
5. Arrastra y suelta la galería en el cuadrado del centro de estas flechas para que
Web Designer la agregue al grupo y su pestaña se agregue al final del grupo.
6. Cuando fijas un grupo de galerías, todas las galerías dentro del grupo también
están fijadas. Al ocultar automáticamente o cerrar un grupo de galerías, verás
todas las pestañas de las galerías del grupo en el borde del espacio de trabajo más
cercano a la última ubicación en donde se encontraban fijadas.

Uso de las galerías

Para plegar o desplegar una sección en una galería:
• Haz clic sobre el icono PLEGAR/DESPLEGAR
• O haz doble clic sobre el título de la sección.
• O haz clic derecho sobre una sección para ver el menú pop-up. Selecciona
PLEGAR/DESPLEGAR sección. El menú pop-up también tiene opciones para abrir la
sección siguiente o la anterior.

La ilustración muestra la galería desplegada. Otras galerías son similares.

100

Los botones de la parte superior dependen de la galería (p.ej. RELLENO y TRANSP son
opciones específicas de la GALERÍA DE MAPA DE BITS .) De todos modos, la mayoría de las
galerías presenta estos botones:

APLICAR inserta el ítem seleccionado de la galería. Haz clic sobre un ítem para
seleccionarlo.

OPCIONES abre un menú en donde puedes escoger:

• BUSCAR : se describe más adelante en la búsqueda de un nombre de ítem.
• ORDENAR : se describe más adelante en el orden de los ítems en una galería.
• PROPIEDADES : permite controlar el tamaño de los iconos y la cantidad de
información que se muestra en la galería.
• Añadir (galerías de clipart, rellenos y fuentes): descrito a continuación en añadir
ítems en una galería.
• ELIMINAR (galerías de clipart, rellenos y fuentes): descrito a continuación en
eliminar secciones de una galería.

Seleccionar ítems
Para seleccionar un ítem:
• Haz clic sobre un ítem para seleccionarlo.
• O haz clic sobre un ítem, después +clic sobre otro ítem: todos los ítems entre los
dos puntos se seleccionarán.
• O Ctrl+clic para añadir ese ítem a la selección.

Reordenar ítems en la galería

En algunas galerías, "OPCIONES - > ORDENAR" abre un campo de diálogo. Puedes ordenar
por nombre y, dependiendo de la galería, por otros criterios. Los controles de clave
primaria controlan el orden inicial. Para algunos parámetros como tipo o longitud de
nombre, es posible que haya dos o más archivos con el mismo tipo o longitud de
nombre. Estos archivos pueden ordenarse usando la clave secundaria.

Añadir a la galería
Es posible que quieras añadir ítems extra para estas galerías. (sólo es posible en las
galerías de DISEÑOS & RELLENOS ). Para esto:
1. Copia los archivos que quieres añadir a un nuevo directorio usando el explorador
de Windows.
- Para la GALERÍA DE CLIPARTS , estos archivos pueden ser cualquier tipo de la
amplia gama de archivos de vectores o mapas de bits.
- Para la GALERÍA DE RELLENOS puede ser cualquiera de los formatos de mapa de
bits compatibles con Web Designer (listados en Importación y Exportación en
la página 447).
2. En cada galería, pulsa el botón "DISEÑOS DE DISCO/RELLENOS" . Se abrirá una
ventana de diálogo.
www.magix.es
 Manejo de documento 101

3. Usa este diálogo para seleccionar el directorio que quieres añadir.

4. Haz clic en "AÑADIR" . Esto crea una nueva sección en la galería.

Si después quieres añadir más ítems a la carpeta:

1. Copia los archivos nuevos en la carpeta existente.
2. En la galería, pulsa el botón "DISEÑOS DE DISCO/RELLENOS" . Se abrirá una ventana
de diálogo.
3. Usa este diálogo para seleccionar el directorio que quieres añadir.
4. Haz clic en "ACTUALIZAR" para actualizar la sección en la galería.

Eliminar secciones de una galería

Para eliminar una sección de una galería (válido sólo para las galerías de CLIPARTS y
RELLENOS ):

1. Haz clic sobre el título de la sección o secciones que quieres eliminar.

2. Haz clic en "ELIMINAR" .

Si posteriormente quieres volver a utilizar la sección, añade la carpeta a la galería

(descrito anteriormente).

Cerrar una galería

Por defecto, el botón OCULTAR AUTOMÁTICAMENTE de las galerías está activado (es
decir, que el botón OCULTAR AUTOMÁTICAMENTE que se encuentra en la esquina
superior derecha no está fijado). De esta forma, la galería se cerrará automáticamente
cuando alejes el cursor. Sin embargo, si has desactivado el botón OCULTAR
AUTOMÁTICAMENTE (galería fijada), tendrás que cerrar la galería de forma manual. Para
cerrar una galería liberada, haz clic en el botón CERRAR que se encuentra en la parte
superior derecha de la galería. La galería se cerrará y su pestaña se mostrará en la barra
de galerías.

Para cerrar una galería fijada, haz clic en OCULTAR AUTOMÁTICAMENTE (alfiler) o
CERRAR en la parte superior derecha de la galería. La galería se cierra y su pestaña se
mostrará en el lugar del espacio de trabajo en donde la hayas fijado. Para volver a abrir la
galería, pasa el cursor sobre ella o haz clic sobre la pestaña.

Nota: para eliminar una galería completamente, selecciona GALERÍAS de menú

HERRAMIENTAS y selecciona la galería que quieres eliminar.

Eliminar una galería del espacio de trabajo

Por defecto, cuando cierras una galería, Web Designer la regresa a la barra de galerías
para que puedas volver a abrirla acercando el cursor a su ícono o pestaña. Sin embargo,
puedes configurar a Web Designer para que elimine cualquier galería del espacio de
trabajo si no la necesitas.

Para eliminar galerías del espacio de trabajo, realiza una de las siguientes opciones:
102

• Escoge GALERÍAS del menú HERRAMIENTAS y selecciona la galería que quieres

eliminar. La galería seleccionada desaparecerá del espacio de trabajo. Si quieres
volver a ver la galería, ve a GALERÍAS en el menú HERRAMIENTAS y escoge la galería
que quieres volver a ver.
• Escoge BARRAS DE CONTROL del menú VENTANA y ve hacia abajo en la lista de
barras de control disponibles para ver las GALERÍAS . Haz clic en el recuadro
GALERÍAS para ver la barra de herramientas de galerías. Haz clic en CERRAR . En la
barra de herramientas Galerías que aparecerá en la parte superior del espacio de
trabajo, puedes activar una galería si haces clic en su barra de herramientas.

Deshacer y rehacer
¿Qué son las funciones deshacer y rehacer?
Todos cometemos errores o cambiamos de parecer. Web Designer facilita la corrección
de errores o de cambios no deseados. Todas las acciones que haces se guardan en una
"lista de deshacer". Esto te permite deshacer no solo la última operación, sino volver
hacia atrás deshaciendo varias operaciones. Por lo tanto, puedes experimentar
libremente sabiendo que siempre puedes eliminar lo que no quede bien.

La función deshacer
Deshacer cancela el efecto de la última operación. Para deshacer una
operación:
• Haz clic sobre el botón DESHACER de la barra de control ESTÁNDAR.
• O escoge Editar > Deshacer (la formulación exacta te dice cuál es el paso
deshacer, por ejemplo, deshacer escala).
• O pulsa Ctrl+Z.
• O pulsa la tecla de coma (en cualquier herramienta salvo la herramienta de
TEXTO ).

Puedes repetir la función deshacer para seguir retrocediendo por la secuencia de las
operaciones previas.

La función rehacer
Rehacer cancela la función deshacer anterior. Para rehacer la última operación:

• Haz clic sobre el botón REHACER de la barra de control ESTÁNDAR.

• O escoge Editar > Rehacer (la formulación exacta te dice cuál es el paso rehacer,
por ejemplo, rehacer escala).
• O pulsa Ctrl+Y.
• O pulsa la tecla de punto (en cualquier herramienta salvo la herramienta de TEXTO).

La función rehacer solo puede aplicarse inmediatamente después de la función

deshacer. No puedes rehacer tras modificar el documento (por ejemplo, moviendo o
añadiendo un objeto).

www.magix.es
 Trabajar con objetos 103

Trabajar con objetos

La herramienta de selección
La HERRAMIENTA DE SELECCIÓN es la herramienta principal para seleccionar,
mover, girar y cambiar el tamaño de los objetos. Generalmente se utiliza
más que cualquier otra herramienta y es la herramienta central para
manipular documentos.

Dimensiones de selección
% de controles de tamaño
Bloquear relación de aspecto
Girar e inclinar
Voltear
Escalar anchos de línea
Aplicar nombres

Para utilizar la HERRAMIENTA DE SELECCIÓN :

• Haz clic sobre la HERRAMIENTA DE SELECCIÓN en la BARRA DE HERRAMIENTAS
PRINCIPAL .
• O pulsa "Alt + S", "V" o "F2".

Cuando cambies a la HERRAMIENTA DE SELECCIÓN , si hay objetos seleccionados

dentro de un grupo u otro tipo de objeto compuesto, se seleccionará el objeto
principal (grupo) en su lugar.

Puesto que la herramienta de SELECCIÓN es la herramienta más utilizada, existe un

shortcut adicional para permitirte cambiar a esta herramienta para realizar una
selección u otra operación y volver rápidamente a la herramienta anterior. Si estás
utilizando otra herramienta puedes cambiar fácilmente a la herramienta de
SELECCIÓN :

• Pulsa y libera Alt+S para cambiar a la herramienta de SELECCIÓN . Pulsa otra vez
para regresar a la herramienta anterior.

Seleccionar objetos
Para seleccionar un solo objeto haz clic en cualquier parte visible del objeto.
104

Cambiar selección de objetos

Una vez que el objeto esté seleccionado, puedes utilizar las siguientes teclas para
cambiar la selección:
• Fin selecciona el objeto de atrás.
• Inicio selecciona el objeto de adelante.
• "Tab" selecciona el objeto siguiente hacia atrás.
• +Tab selecciona el objeto siguiente hacia adelante.

Los objetos del frente y el fondo se describen en Trabajar con objetos (en la página
103).

Marco de selección
Para seleccionar varios objetos, pulsa y mantén pulsada la tecla del ratón. Al arrastrar
el ratón se dibuja un rectángulo de selección y todos los objetos dentro del rectángulo
quedarán seleccionados.

Algunos programas de dibujo llaman a este rectángulo "marco de selección".

Si hay algún objeto que no te permite dibujar un rectángulo porque el objeto se

mueve, pulsa "" mientras arrastras el rectángulo de selección.

Ampliar selección
Para seleccionar objetos adicionales:
•  + clic sobre ellos.
• O  + arrastrar el ratón. Esto dibuja un rectángulo de selección y añade los
objetos dentro del rectángulo a la selección.

Seleccionar bajo
Pulsa Alt para seleccionar objetos que se encuentran debajo de otros objetos. Con
Alt+clic puedes pasar por varios objetos superpuestos.

Selección interna
Puedes seleccionar un objeto que está dentro de un grupo u otro objeto contenedor
pulsando "Ctrl" mientras haces clic sobre el objeto. Es lo que se llama selección
interna. El objeto sobre el que haces clic será siempre seleccionado, incluso si está
dentro de varios niveles de grupos anidados. Cuando se tiene un nido de grupos tan
profundo, en ocasiones se quiere seleccionar solo uno de los grupos anidados (un
grupo que está dentro de otro). Podrás hacerlo fácilmente si mantienes presionadas
las teclas "Alt" y "Ctrl" mientras haces clic. El primer clic de tal tipo seleccionará el
grupo del nivel superior (tal como lo hace un clic normal). Haz clic de nuevo y se

www.magix.es
 Trabajar con objetos 105

seleccionará el siguiente grupo según su orden en el nido. Continúa haciendo clic para
avanzar en la estructura del grupo hasta que se seleccione el grupo que deseas.

Ten en cuenta que algunas operaciones no se pueden realizar si hay un objeto interno
seleccionado. Por ejemplo, el marco de selección y la copia con clic derecho no
funcionan para la selección interna.

Mover objetos seleccionados debajo o dentro

Si necesitas mover un objeto seleccionado que se encuentra debajo de otros o dentro
de un grupo, no podrás simplemente arrastrarlo, porque se seleccionará y arrastrará
otro objeto. Para evitar esto, pulsa "Ctrl + Alt" y comienza a arrastrar. Esto arrastrará
siempre el objeto seleccionado. Puedes soltar las teclas una vez que hayas
comenzado a arrastrar.

O puedes utilizar las teclas de flechas  de tu teclado para desplazar el objeto.

Selección y capas
No puedes seleccionar objetos que se encuentran en capas bloqueadas o invisibles.

Consulta "Galería de páginas y capas (en la página 407)" para obtener más detalles
sobre capas.

Seleccionar todos los objetos

Para seleccionar todos los objetos:
• Escoge Edición > Seleccionar todo.
• O pulsa Ctrl+A.

Deseleccionar un objeto
Para deseleccionar todos los objetos:
• Haz clic en cualquier lugar sin usar del documento.
• O escoge Edición > Borrar selección.
• O pulsa Esc.

Para deseleccionar un objeto entre muchos:

• +clic sobre el objeto. Esto deselecciona el objeto. Los otros objetos
permanecen seleccionados.
106

Marcadores de selección
Cada objeto seleccionado muestra un marcador de selección para señalar que está
seleccionado. Esto es un recordatorio muy útil cuando seleccionas y deseleccionas
varios objetos.

Barra de estado
La barra de estado que se encuentra en la parte inferior de la ventana también
describe lo que está seleccionado.

Controles deslizantes de límites de selección

Los controles deslizantes de límites de selección te permiten cambiar el tamaño y
extender los objetos seleccionados. Para leer más información sobre este tema ve a
Extender o reducir objetos. Varios clics sucesivos sobre un objeto cambia entre
mostrar los controles de límite de selección y rotación.

Tab
Si hay un objeto seleccionado, pulsar Tab y +Tab cambiará la selección al objeto
anterior y siguiente en el documento.

Mover objetos
Para deslizar un objeto sobre la página
1. Escoge la herramienta de SELECCIÓN .
2. Arrastra el objeto hasta la posición deseada. Pulsa Ctrl para limitar la dirección
de movimiento a uno de los ángulos de restricción.

www.magix.es
 Trabajar con objetos 107

Puedes definir los ángulos de restricción. Consulta el capítulo Personalización de

Web Designer.

Pulsa Ctrl+Alt y podrás arrastrar el objeto seleccionado aunque el cursor no se

encuentre encima de él. Esto es útil cuando el objeto seleccionado se encuentra
oculto tras otro objeto o cuando es parte de un grupo. Suelta Ctrl+Alt después de
comenzar a arrastrar el objeto, salvo que quieras restringir el movimiento.

También puedes mover objetos usando las teclas de flecha. Esto se describe en la
próxima página.

Soltar una copia

Durante un movimiento (y mientras pulsas la tecla izquierda del ratón) haz clic
derecho o pulsa + del teclado numérico para soltar una copia del objeto. El objeto
original no se mueve. Puedes hacer esto todas las veces que quieras para crear una
serie de objetos duplicados.

O, de la misma forma, pulsa la tecla derecha del ratón y arrastra. Esto arrastrará
inmediatamente una copia del objeto. Haz clic izquierdo para dejar una copia en la
posición actual del ratón.

Rellenos
Generalmente, si mueves un objeto, su relleno también se moverá:

Movimiento normal de izquierda a derecha de un objeto con relleno lineal.

Esto también es aplicable al girar, doblar, extender o cambiar el tamaño de objetos.

Web Designer también puede mover el objeto pero no el origen del relleno. Para
hacer esto, pulsa la tecla - en el teclado numérico durante el movimiento.

El mismo movimiento pero pulsando la tecla - (menos) durante el arrastre.

108

Desplazar objetos
Generalmente puedes mover un objeto levemente utilizando las teclas de flecha . (A
veces, estas teclas tienen otros usos, especialmente en la herramienta de TEXTO.)

El desplazamiento no se ve afectado por el ajuste magnético ni de cuadrícula. (Los

ajustes se describen más adelante).

Modificadores de desplazamiento
Para modificar la distancia de desplazamiento, utiliza estas combinaciones de teclas
mientras usas las flechas:
• Ctrl 5 veces la distancia normal
•  10 veces la distancia normal
• Ctrl +  l/5 de la distancia normal
• Alt 1 píxel
• Alt +  10 píxeles

Puedes cambiar la distancia normal de desplazamiento en la pestaña GENERAL de

Herramientas > Opciones. (Consulta el capítulo Personalización de Web Designer (en
la página 473).

El desplazamiento funciona en la mayoría de las herramientas.

Cortar, copiar y pegar

Estas funciones te permiten mover o copiar un objeto en el mismo documento o entre
diferentes documentos. Debes hacer lo siguiente:
1. Selecciona el objeto.
2. Para eliminar el objeto, elige " EDITAR" > "CORTAR " (o "Ctrl + X"). Para copiar el
objeto pero no eliminarlo, escoge "EDICIÓN" > "COPIAR" (o "Ctrl+C"). Las dos
opciones colocan el objeto (o una copia del objeto) en el portapapeles.
3. Escoge "EDITAR" > "PEGAR ", "Ctrl + V" o "INSERTAR ". Esto pega el contenido del
portapapeles en el documento.

Ten en cuenta que si los objetos que copias se encuentran en la misma capa,
entonces puedes pegar esos objetos en cualquier capa, si conviertes primero esa capa
en la capa actual y luego escoges "EDITAR" > "PEGAR" > "PEGAR EN CAPA" o "PEGAR EN
EL LUGAR EN LA CAPA ACTUAL" . La capa desde la que se copian los objetos se ignora
en este caso.

Sin embargo, si los objetos que copias se encuentran en varias capas diferentes,
entonces la estructura de capas se mantiene al pegar.

Esto te permite copiar los datos en capas dentro de un documento o a un documento

diferente. Cualquier capa que falte en el documento de destino se crea
www.magix.es
 Trabajar con objetos 109

automáticamente con esta operación. Por ejemplo, si copias un botón de MouseOver,

que tenga un objeto en la capa MouseOff y otro objeto en la capa MouseOver, a otro
documento, las capas MouseOff y Mouseover se crearán si todavía no existen y se
copiarán los objetos de los botones sobre ellas.

"Ctrl + Shift + V" o "EDITAR" > "PEGAR EN LUGAR" pega el contenido del portapapeles
en la misma posición X/Y desde la que fueron cortadas o copiadas, o en la misma
posición en relación al final de la página en el caso de objetos del pie de página. Esto
solo se aplica a objetos cortados o copiados dentro de Web Designer. Los objetos
importados desde otros programas siempre se pegan en el centro de la vista actual.

El objeto permanece en el portapapeles, por lo que puedes pegar el mismo objeto

muchas veces.

Si se provee una serie de formatos en el portapapeles, MAGIX Web Designer 10

Premium te mostrará un diálogo titulado PEGADO ESPECIAL para que puedas elegir el
formato en el que deseas pegar el objeto. Al pegar en un texto, puede que tengas la
opción de pegar el texto sin formato o en formato Rich Text (formato de texto
enriquecido). Además, es posible que veas las siguientes opciones de pegado, según
el contenido del portapapeles:

Pegar texto sin formato

Pega el texto del portapapeles en el documento sin formato.

Pegar formato/atributos
Conserva el formato (p. ej. el tipo y tamaño de fuente) o los atributos de estilo (p. ej.,
el color de la línea y del relleno) del objeto que se pega.

Pegar posición
Esta opción aplica la posición de un objeto copiado en el portapapeles a un objeto
seleccionado actualmente, que se mueve a exactamente la misma posición que el
objeto copiado.

Si se han copiado múltiples elementos en el portapapeles, Web Designer los trata

como a un grupo y mueve al objeto actual seleccionado a la posición del grupo
copiado como un todo.

El objeto seleccionado actualmente se pega o se mueve a la posición central del

objeto copiado o al grupo de objetos.

Pegar tamaño
Esta opción aplica el tamaño de un objeto copiado en el portapapeles a un objeto
seleccionado actualmente, cuyo tamaño se reajusta (en torno a su centro) al tamaño
exacto del objeto copiado.
110

Si al pegar el tamaño tienes muchos elementos seleccionados, no se redimensiona el

tamaño de la selección como un todo, sino que cada uno de esos objetos se convierte
al tamaño del objeto copiado. Por ejemplo, si copias una foto de 200x200 píxeles,
luego seleccionas otras 10 fotos y seleccionas "Pegar tamaño", las 10 fotos se
convierten a 200x200 píxeles. Este es un modo rápido de convertir un montón de
objetos a un tamaño determinado.

Pegar reemplazo de selección

Esto es similar a PEGAR POSICIÓN , solo que el objeto copiado en el portapapeles
reemplaza al objeto seleccionado actualmente y mantiene la posición del elemento
borrado.

El objeto copiado se pega en la posición central del objeto borrado.

Pegar en la capa actual

Igual que PEGAR EN LUGAR , pero el objeto se pegará solamente en la capa actual.

Esto es útil si quieres ver u ocultar el objeto pegado cuando se muestran capas
encima o debajo.

Pegar en el lugar de la capa actual

Igual a PEGAR EN LA CAPA ACTUAL , pero el objeto se pegará en la capa actual en la
misma posición desde la que lo has copiado.

Eliminar objetos del documento

Primero selecciona los objetos que quieres eliminar. Puedes cortar los objetos al
portapapeles o eliminarlos.

Cortar objetos
Selecciona "Edición > Cortar", o pulsa "Ctrl + X". Los contenidos del portapapeles
serán sobrescritos y podrás pegar el objeto o los objetos borrados en el lugar deseado.

Eliminar objetos
Escoge "Edición > Eliminar", pulsa "Supr" o haz clic sobre el botón ELIMINAR de
la barra de control ESTÁNDAR.

En este caso los objetos eliminados no se colocarán en el portapapeles. Si eliminas

accidentalmente un objeto, puedes recuperarlo con deshacer.

www.magix.es
 Trabajar con objetos 111

Duplicar y clonar
Ambas opciones crean una copia del objeto seleccionado. El objeto original se
deselecciona y el duplicado o el clon se convierte en el objeto seleccionado.

También puedes duplicar un objeto mientras lo mueves, giras, doblas o cambias su

tamaño. Mientras lo arrastras (y mientras pulsas la tecla izquierda del ratón) haz clic
derecho o pulsa + del teclado numérico para soltar una copia del objeto. El objeto
original no se mueve. Puedes hacer esto todas las veces que quieras para crear una
serie de objetos duplicados.

Una forma sencilla de crear una o más copias de un objeto alineado horizontal o
verticalmente, es arrastrar el objeto, pulsar Ctrl para limitar el movimiento y después
hacer clic derecho (o pulsar + del teclado numérico) para cada copia.

Para sustituir rápidamente una línea de objetos, dibuja uno, después arrástralo mientras pulsas
la tecla Ctrl y haz clic derecho para cada copia que quieras crear.

Duplicar
Escoge Edición > Duplicar o pulsa Ctrl+D. La copia aparecerá un poco hacia la
derecha y abajo del objeto original.

La distancia de duplicación puede cambiarse. Lee el capítulo Personalización de

Web Designer (en la página 473).

Clonar
Escoge Edición > Clonar o pulsa Ctrl+K. Esto coloca una copia exactamente arriba del
original. La clonación es una forma fácil de crear formas concéntricas.

Este ejemplo usa una letra original A con relleno negro y un contorno blanco con una anchura de
4 pt y un clon sin relleno y una línea negra de 1 pt.
112

Mover objetos hacia adelante o hacia atrás

Las ilustraciones complejas tienen objetos apilados uno sobre otros, igual que este
blanco.

El blanco de la izquierda está construido a partir de tres círculos apilados uno sobre otro.

Para asegurar que los objetos se superpongan en el orden correcto, muchas veces
necesitas cambiar el orden desde adelante hacia atrás. (El objeto de adelante siempre
cubre a los de abajo y los otros objetos siempre cubren a los que están más abajo.
Cada nuevo objeto que creas se coloca arriba de los anteriores.)

El menú Arreglo te ofrece las cuatro opciones siguientes:

• TRAER AL FRENTE (Ctrl+F): esto convierte al objeto seleccionado en el objeto de
más arriba. Por lo tanto, ocultará todos los objetos que cubra.
• MOVER ADELANTE (Ctrl++F): esto mueve el objeto un nivel hacia el frente,
como si estuviera subiendo un peldaño de una escalera.
• MOVER ATRÁS (Ctrl++B): esto mueve el objeto un nivel hacia atrás.
• LLEVAR ATRÁS (Ctrl+B): esto coloca el objeto atrás de todo.

Estas opciones mueven los objetos hacia adelante y hacia atrás en la misma capa.
MOVER A LA CAPA AL FRENTE y MOVER A LA CAPA DE ATRÁS te permiten mover los
objetos entre las capas visibles. (Las capas invisibles no se tienen en cuenta al mover
objetos).

Más información sobre capas en el capítulo Capas (en la página 407)

Girar utilizando el ratón

Para ver los controles deslizantes de rotación (en lugar de los de modificación de
tamaño) en una forma seleccionada en la herramienta de selección, haz clic de nuevo
sobre la forma seleccionada.

Arrastra una flecha de una esquina. Mientras arrastras, el objeto gira alrededor del
centro de transformación. La barra de información muestra el ángulo de rotación
actual.

www.magix.es
 Trabajar con objetos 113

" + arrastrar" para hacer girar un objeto alrededor de su centro (el centro de
transformación será ignorado).

Para realizar una rotación limitada, pulsa "Ctrl" mientras rotas. Esto significa que el
objeto rotará solo a una selección limitada de ángulos Rotará a múltiplos del valor del
ángulo de restricción, que por defecto es de 45º. Pero además, incluirá ángulos a los
cuales está alineado cualquier borde recto significativo del objeto vertical u
horizontalmente. Esto hace más fácil, por ejemplo, rotar un rectángulo que ha sido
girado ligeramente, de manera que el rectángulo quede derecho de nuevo (alineado
con la pantalla). O hacer cualquier línea recta de una forma tanto vertical como
horizontal. Estos bordes tienen que ser al menos un 25% del ancho o alto de la forma
para considerarse significativos durante una rotación restringida.

Puedes definir los ángulos de restricción. Consulta el capítulo "Personalización de

Web Designer (en la página 472)".

Para crear una copia mientras realizas un giro, pulsa la tecla "+" del teclado numérico
mientras giras o haz clic con la tecla derecha del ratón.

Girar objetos
Esta opción es parte de la herramienta de SELECCIÓN .

Si el modo de rotación está activado, el centro de transformación (alrededor

del cual el objeto gira) aparece inicialmente en el centro del objeto, tal como
se ve en este pequeño blanco.

Haz otro clic sobre el objeto para poner la herramienta de selección en el modo de
rotación. Arrastra el centro de transformación al lugar que desees.

Atención: si se mueve el centro de rotación, se mantendrá en esta posición para

cualquier objeto seleccionado hasta que todos los objetos estés deseleccionados; así
el punto volverá al centro de cualquier objeto seleccionado.

Rotación con ángulos exactos (utilizando la barra de

información)
Introduce un ángulo en el campo de rotación y pulsa . Los ángulos positivos realizan
el giro en sentido contrario a las agujas del reloj, mientras que los ángulos negativos lo
realizan en el sentido de las agujas del reloj.

Haz clic sobre las flechas a la derecha para desplazar el

ángulo de rotación.
114

Girar objetos en el modo de cambio de tamaño

También es posible girar y doblar un objeto si no te encuentras en el modo de

rotación. Usando el modo de cambio de tamaño, mueve el cursor hasta las áreas
pequeñas cerca de los controles deslizantes de límites de selección, tal como se
muestra arriba. El cursor cambiará a un icono de rotación para indicar que puedes
girar o doblar el objeto arrastrando el ratón.

Cambio del tamaño de objetos (escalar)

Esta opción es parte de la herramienta de SELECCIÓN .

Botón Escalar anchos de línea

Con el botón ESCALAR ANCHOS DE LÍNEA , al cambiar el tamaño
de un objeto, también se cambiará el ancho de sus líneas. Si
desactivas este botón, el ancho de las líneas no se modificará.

Puedes activar este botón durante el arrastre y pulsando la tecla / del teclado
numérico. Este control también determina si los valores X, Y, ancho y alto de la barra
de información incluyen el ancho del contorno o pincel. Muchas veces es útil ver y
controlar el tamaño exacto de la forma excluyendo el ancho de la línea.

Botón Bloquear relación de aspecto

Con el botón BLOQUEAR RELACIÓN DE ASPECTO , la relación de
aspecto ancho:altura permanece constante cuando cambias el
tamaño del objeto.

En otras palabras, la forma mantiene las mismas proporciones que el original. Se

recomienda dejar este botón activado la mayoría del tiempo para garantizar que los
objetos no se deformen al cambiar su tamaño.

www.magix.es
 Trabajar con objetos 115

Si este botón está desactivado, puedes cambiar la relación de aspecto al cambiar el

tamaño del objeto. Es decir, que puedes extender el objeto de una forma u otra
arrastrando un control deslizante de esquina o introduciendo un nuevo tamaño.

Cambiar tamaño utilizando el ratón

La herramienta de
SELECCIÓN debe
encontrarse en el modo de
cambio de tamaño (los
controles deslizantes de
límite son cuadrados). De
ser necesario, haz clic sobre
el objeto para cambiar al
modo de cambio de
tamaño.

Arrastra uno de los controles deslizantes de esquina. El objeto cambiará de tamaño a

medida que muevas el cursor diagonalmente. La barra de información muestra el
cambio de tamaño actual. El tamaño del objeto se encontrará dentro de la escala
delimitada por el control deslizante que hayas arrastrado y el opuesto. Si quieres
utilizar otro punto fijo del objeto para realizar la rotación, mueve el centro de
transformación al punto deseado y usa los botones de la barra de información para
cambiar el tamaño.

Pulsa "" mientras arrastras para cambiar el tamaño del objeto alrededor de su
centro. Esto funciona independientemente de la posición del centro de
transformación. "Ctrl + arrastra" aumenta el tamaño del objeto en múltiplos de su
tamaño original (x2, x3 y sucesivamente). Para crear una copia mientras cambias el
tamaño (dejando el original en su lugar), haz clic derecho o pulsa la tecla "+" del
teclado numérico.

Si arrastras los controles deslizantes laterales, el objeto se extenderá o reducirá. Esta

operación se explica detalladamente en la sección Extender o reducir objetos.

Cambiar tamaño utilizando la barra de información

Introduce el valor en el campo CAMBIAR TAMAÑO DE TEXTO y pulsa "".

• Los valores menores que 100% reducen el objeto. 50 reduce el tamaño del
objeto a la mitad.
• Los valores mayores que 100% aumentan el tamaño del objeto. 200
duplica el tamaño del objeto.
116

Si el botón BLOQUEAR ASPECTO está activado, puedes introducir el valor en

cualquier campo de texto para cambiar el tamaño del objeto de acuerdo al
porcentaje deseado. Si este botón está desactivado, puedes introducir valores
individuales para el ancho y el alto.

Como alternativa, escribe el tamaño deseado del objeto en los campos de texto
AL o AN .

Si el botón BLOQUEAR RELACIÓN DE ASPECTO está activado, esto cambia el tamaño del
objeto pero mantiene su relación de aspecto. Puedes introducir cualquier tamaño en
cualquier unidad como, por ejemplo, 1 cm.

Si cambias el tamaño utilizando los botones de la barra de información (o recuadros

de números), siempre se realizará el cambio de tamaño alrededor del centro de
transformación. Puedes posicionar el centro en cualquier lugar del objeto, tal como se
ha descrito en la sección "Girar objetos".

Voltear objetos
Esta opción es parte de la herramienta de SELECCIÓN . Un clic sobre los
botones para VOLTEAR da vuelta el objeto vertical u horizontalmente a
partir del centro de transformación.

El tamaño y la relación de aspecto no cambian, el objeto simplemente se voltea.

Extender o reducir objetos

Esto es similar a cambiar el tamaño de los objetos, salvo que el objeto cambia de
tamaño en una sola dirección. La extensión o reducción del objeto son básicamente la
misma acción, pero en sentido contrario.

Extender o reducir objetos utilizando el ratón

La herramienta de SELECCIÓN debe encontrarse en el modo de cambio de tamaño.
(Los controles deslizantes de selección son cuadrados.) De ser necesario, haz clic en
el objeto para activar el modo de cambio de tamaño.

Utiliza los controles deslizantes superiores, inferiores y laterales, en lugar de los

controles deslizantes de esquina para extender o reducir una forma sólo en una
dimensión. Ten en cuenta que sólo se muestran estos controles deslizantes en los
rectángulos que no tienen una foto en su interior porque extender otros objetos en
una sola dimensión rara vez produce resultados correctos (las fotos se distorsionan).

www.magix.es
 Trabajar con objetos 117

Arrastra uno de los controles

deslizantes laterales. El objeto
cambiará de tamaño en la dirección
de arrastre. La barra de información
muestra el cambio de tamaño
actual.

El botón BLOQUEAR RELACIÓN DE

ASPECTO se ignora.

Haz clic derecho o pulsa "+" del teclado numérico mientras arrastras para extender o
reducir una copia el objeto (dejando el original en su lugar).

Extender o reducir objetos utilizando la barra de información

El BOTÓN BLOQUEAR ASPECTO debe estar desactivado (si está activado, cambiarás el
tamaño del objeto en vez de extenderlo o reducirlo). Introduce el valor en el campo de
texto del ancho o alto (según corresponda) y pulsa "". También puedes introducir un
porcentaje (ancho o alto). Si introduces 200% en el campo % superior, el ancho del
objeto se duplicará mientras que el alto permanecerá igual. Si está activada la opción
BLOQUEAR ASPECTO , el objeto no se modificará.

Inclinar objetos
Esta opción es parte de la herramienta de SELECCIÓN .

A la izquierda se encuentra el objeto original; a la

derecha el objeto inclinado horizontalmente.

Inclinar utilizando el ratón

Cambia la herramienta de SELECCIÓN al modo de rotación/doblado haciendo clic
sobre el objeto. (Los controles deslizantes de selección tienen forma de flecha).
Arrastra una de las flechas laterales, superiores o inferiores para inclinar el objeto. Ten
en cuenta que sólo se muestran estos controles deslizantes en los rectángulos que no
tienen una foto en su interior porque inclinar otros objetos rara vez produce
resultados correctos (las fotos se distorsionan).

A medida que arrastras, el objeto se inclinará en la dirección

del movimiento (vertical u horizontal).

La barra de información muestra el ángulo de

inclinación actual.
118

 + arrastra para inclinar el objeto alrededor del centro. Pulsa "Ctrl" para limitar la
dirección de inclinación a uno de los ángulos de restricción. Para crear una copia
mientras arrastras, haz clic derecho o pulsa la tecla "+" del teclado numérico (dejando
el original adonde estaba antes). O haz clic derecho con el ratón para crear copias
instantáneas; si quieres copias adicionales haz clic izquierdo.

También puedes inclinar el objeto con la herramienta de selección en el modo de

cambio de tamaño, utilizando las áreas de inclinación. Para más información ve a la
sección Girar objetos en el modo de cambio de tamaño (en la página 114).

Inclinar utilizando la barra de información

Para inclinar horizontalmente introduce un ángulo en el
campo de inclinación y pulsa "".

La herramienta de moldes
La herramienta de MOLDE sirve para distorsionar las imágenes. Se utiliza tanto
para crear perspectivas (es decir, girar en tres dimensiones) o distorsiones a
partir de envolturas.

Barra de información de la herramienta de moldes

Malla
Eliminar molde
Separar molde
Girar molde
Copiar molde
Envolturas
Pegar molde de envoltura
Perspectiva
Pegar molde de perspectiva
La barra de información contiene dos juegos predeterminados de formas de molde.
Simplemente haz clic sobre un botón para aplicar el molde predeterminado. El botón
de la izquierda de cada grupo es el molde por defecto "sin distorsión" que puedes
editar manualmente después de aplicarlo.

www.magix.es
 Trabajar con objetos 119

Perspectivas
La herramienta de MOLDE te permite aplicar perspectiva a
las formas para darles un sentido de profundidad.

Puedes aplicar perspectivas a todos los tipos de objetos,

incluyendo texto y mapas de bits. Ten en cuenta que los
mapas de bits pierden la perspectiva si después aplicas
una transición o los conviertes en formas editables.
1. Selecciona el o los objetos.
2. Selecciona la herramienta de MOLD
(shortcut +F6).
3. Escoge una de las opciones de perspectiva:

El botón de la derecha (pegar perspectiva) se

describe más adelante.

Web Designer dibuja un rectángulo alrededor del objeto o selección. Puedes arrastrar
los controles deslizantes de cada esquina del rectángulo para crear el efecto de
perspectiva. Puedes girar, cambiar de tamaño e inclinar el objeto con perspectiva
utilizando la herramienta de SELECCIÓN .

Es posible que quieras mover los controles deslizantes sin volver a dibujar el objeto
con perspectiva (esto acelera el redibujo de la pantalla).

Para realizar esto, selecciona el botón SEPARAR MOLDE . Para readaptar el

objeto, desactiva el botón.

Usar puntos de fuga

A medida que reduces el tamaño de los lados del molde de perspectiva, verás un
"punto de fuga" de destino. Esto es similar a los puntos de fuga en los dibujos
convencionales de perspectivas.

Puedes utilizar puntos de fuga para obtener una perspectiva consistente para varios
objetos.

Todos los objetos comparten un punto de fuga común en la cruz pequeña.

120

La malla de perspectiva
Este botón pinta una serie de puntos en una cuadrícula que te permite una
vista previa del grado de distorsión en perspectiva de un objeto.

Utilizar moldes
Es posible que quieras aplicar la misma perspectiva a varios objetos. Para lograr esto,
debes crear una forma de molde, copiarla en el portapapeles y después utilizarla para
otros objetos. Una forma de molde en perspectiva debe tener cuatro lados rectos.

Esta es una forma de Estas no son aceptables. El objeto de la izquierda tiene

molde aceptable. demasiados lados (deben ser cuatro). El objeto de la derecha tiene
lados curvos (deben ser rectos).

Eliminar una perspectiva

Haz clic sobre ELIMINAR para quitar la perspectiva.

Si el objeto seleccionado tiene más de una perspectiva o envoltura, sólo se eliminará

la que se ha aplicado más recientemente.

Girar el objeto dentro del molde

Muchas veces verás que el molde es la forma correcta, pero el objeto debe
girarse. Puedes girar el objeto con un clic sobre el botón girar contenido.

Envolturas
La herramienta de moldes te permite envolver formas de diferentes maneras.

El efecto es similar a una hoja de hule o globo que puedes extender en cualquier
dirección.

Puedes envolver todo tipo de objetos excepto los mapas de bits.

Ejemplo de texto con envoltura

www.magix.es
 Trabajar con objetos 121

La aplicación de una envoltura es similar a la aplicación de una perspectiva:

1. Selecciona el o los objetos.
2. Selecciona la herramienta de MOLD
(shortcut +F6).
3. Escoge una de las opciones de envoltura:

El botón de la derecha es similar al botón pegar perspectiva que se describe más

adelante.

En principio, el botón de la izquierda no modifica el objeto. Los otros botones

modifican inmediatamente el objeto.

Para editar el molde después de aplicarlo:

1. Arrastra cualquiera de los controles deslizantes de esquina.
2. O haz clic en un control deslizante de la esquina y arrastra los controles
deslizantes de curva.

El ejemplo de arriba muestra los 4 controles deslizantes de curva de las esquinas que
se han arrastrado hacia afuera para doblar el contenido del molde.

También puedes girar, cambiar el tamaño e inclinar el objeto con envoltura utilizando
la herramienta de SELECCIÓN .

La malla de moldes
El botón de malla muestra una serie de puntos que te permite ver
previamente la distorsión que la envoltura dará al objeto.

Moldes de envoltura
Puedes crear un molde de envoltura a partir de cualquier forma con cuatro lados, que
puedes distorsionar a tu gusto y después utilizar como molde de envoltura con un clic
sobre PEGAR ENVOLTURA de la BARRA DE INFORMACIÓN de la herramienta de moldes.

Editar formas de molde

Puedes editar la forma de los moldes de sobres de cartas o en perspectiva con la
herramienta de edición de formas (o con los controles deslizantes de edición con la
herramienta de selección, de ser mostrada). Según el tipo de molde, hay algunas
restricciones:
• No puedes añadir controles deslizantes a un molde de envoltura o de
perspectiva, porque tiene que permanecer como una forma con cuatro lados
• No puedes cambiar una línea recta por una curva en un molde de perspectiva.
122

Ajuste
El ajuste facilita el posicionamiento de esquinas o puntos específicos de objetos en
lugares precisos. Puede utilizarse para alinear esquinas a un punto o línea específico o
para espaciar objetos en intervalos regulares utilizando la cuadrícula.

MAGIX Web Designer 10 Premium ofrece tres tipos de ajuste:

• Ajustar a cuadrícula
• Ajuste magnético
• Ajustar a líneas guía u objetos guía

Ajustar a cuadrícula es muy útil para espaciar los objetos en intervalos precisos o
cambiar el tamaño en múltiplos exactos de un valor determinado. Las líneas guía se
utilizan para alinear esquinas (aunque usar objetos guías es más poderoso) y,
finalmente, el ajuste magnético es una forma general de posicionar líneas, puntos o
esquinas arriba de otras líneas puntos o esquinas de objetos cercanos.

Ajustar a cuadrícula
Si se ha seleccionado AJUSTAR A CUADRÍCULA, los puntos de cuadrícula funcionan
como imanes. Haz clic derecho en el portapapeles y escoge "AJUSTAR A " > "AJUSTAR
A CUADRÍCULA" o utiliza la opción del menú "VENTANA" > "AJUSTAR A CUADRÍCULA" ,
(o pulsa "." (separador decimal) del teclado numérico). Puedes controlar el espaciado
de la cuadrícula en el diálogo de opciones (haz clic derecho y escoge OPCIONES DE
PÁGINA o utiliza la función "HERRAMIENTAS " > "OPCIONES ") en la pestaña de
Cuadrícula y Reglas. Por defecto, las plantillas de documento web tienen el ajuste a la
cuadrícula activado con un solo píxel, por lo que, en general, todos los objetos y
posiciones son píxeles enteros.

Al arrastrar objetos, los bordes se ajustarán a los puntos de cuadrícula. Si el tamaño

del objeto es tal, que ambas esquinas opuestas no pueden ajustarse, la esquina que se
ajustará depende de la dirección en la que se está arrastrando el objeto.

www.magix.es
 Trabajar con objetos 123

Este ejemplo muestra una cuadrícula con 5 subdivisiones entre las divisiones mayores. La forma
tiene un contorno gris muy ancho. Como el objeto se arrastró hacia abajo a la izquierda, los
bordes inferiores izquierdos se han ajustado al punto de cuadrícula más cercano.

Nota: el espaciado de cuadrícula por defecto es 50 píxeles para las líneas principales
con 50 subdivisiones. Esto significa que la cuadrícula tiene un espaciado de un píxel
de pantalla y puede parecer que no se estuviera trabajando a un nivel normal de
100%. Si amplías la imagen a 500%, verás que se ajusta de forma correcta.

Como alternativa, cambia los valores de cuadrícula a, por ejemplo, 10 subdivisiones, lo

que significa que los puntos de cuadrícula están en límites de 5 píxeles.

Ajuste y ancho de línea

El control ESCALAR ANCHOS DE LÍNEA de la barra de
información de la HERRAMIENTA DE SELECCIÓN afecta a
cualquier tipo de ajuste que se esté aplicando a los
bordes de los objetos, incluyendo sus contornos.

El ejemplo muestra una forma con un contorno gris muy grueso. También muestra
una línea negra delgada, el contorno de la forma en sí mismo (puedes ver que el
contorno grueso está dibujado de forma igual a cada lado del centro de la línea, por lo
que se encuentra parcialmente dentro de la forma y parcialmente fuera).

Si la opción escalar anchos de línea está activada, el ancho del contorno es importante
y "ajustar a la cuadrícula" ajustará los bordes de los objetos, incluyendo los contornos,
a las cuadrículas. Ajustar a objetos te permitirá realizar el ajuste respecto de los
bordes o las líneas centrales de los contornos. Si los contornos, tal como aparecen en
la pantalla son pequeños y hay poca diferencia entre estas dos posiciones de ajuste,
124

entonces tendrá prioridad el ajuste a los límites. Por lo tanto, amplía la vista si quieres
ajustar a los centros de los contornos en este caso.

Si la opción escalar anchos de línea está desactivada, "ajustar a la cuadrícula" y

"ajustar a objetos" realizarán el ajuste a las líneas centrales de los objetos e ignorarán
los anchos del contorno. Como el ajuste prioriza la opción escalar anchos de línea, los
límites utilizados para el ajuste son siempre los mismos límites que se indican en la
barra de información de la HERRAMIENTA DE SELECCIÓN .

Ajuste magnético de objeto (ajustar a objetos)

Con el ajuste magnético a objetos es más fácil posicionar objetos de forma precisa
respecto a otros o al centro o bordes de la página.

Por ejemplo, si quieres que varias líneas comiencen precisamente en el mismo punto
o quieres que una línea se junte con precisión al borde de un círculo, el uso del ajuste
magnético te será muy útil.

Puedes usar esto para alinear los centros de los objetos o para alinear objetos
respecto al centro de la página o para alinearlos de forma horizontal o vertical en
cualquier parte en el centro de la página. El ajuste magnético funciona si mueves o
amplías el tamaño de los objetos con la HERRAMIENTA DE SELECCIÓN .

Para activar y desactivar la alineación magnética a objetos, haz clic en el

botón AJUSTAR A OBJETOS en la barra de herramientas de la parte superior.
Como alternativa, haz clic derecho sobre el tablero de dibujo y escoge
"AJUSTAR A" > "AJUSTAR A OBJETOS" o utiliza la opción del menú
"VENTANA" > "AJUSTAR A OBJETOS" . También puedes activarlo y
desactivarlo si pulsas la "s" mientras arrastras.

Haz clic y arrastra el objeto que quieres ajustar. A medida que arrastras, Web
Designer muestra un icono de imán, líneas azules y puntos rojos cuando te
encuentras cerca de un "punto de interés" al que puedas ajustar el objeto.

Indicadores de ajuste

Los indicadores de ajuste se muestran siempre que ocurre un ajuste. Es decir, siempre
que el objeto que estás arrastrando se encuentre en el sector de un punto de interés

www.magix.es
 Trabajar con objetos 125

en el documento (que puede ser otro objeto o una parte de la página). Web Designer
se ajusta respecto al punto de interés y el cursor del ratón se convierte en un imán
que te indica que se ha realizado un ajuste. También recibirás otras indicaciones
dinámicas en la pantalla que te informarán que se ha realizado un ajuste.
• Un punto rojo significa que el ajuste se ha realizado respecto a un punto
específico.
• Una línea azul indica que el ajuste se ha realizado respecto a alguna
característica de otro objeto (p. ej. el borde de un rectángulo).
• Una línea naranja indica que se ha realizado un ajuste respecto a una
característica de una página (esquinas, bordes, centro).

Las líneas que indican el ajuste parpadean para mostrar que son indicadores
temporales en tiempo real y para que puedas diferenciarlas de los colores del fondo.

La distancia de ajuste se controla a través de la pestaña RATÓN del diálogo de

OPCIONES ("HERRAMIENTAS" > "OPCIONES" o clic derecho sobre una página y
OPCIONES DE PÁGINA ).
126

Puedes especificar dos distancias de ajuste en la sección "Radios de ajuste

magnético", que controlarán cuán cerca los objetos tendrán que estar antes de
ajustarse. El tamaño del círculo alrededor de los puntos (punto) y la distancia hacia
ambos lados de las líneas (línea). En general, lo mejor es que el valor de punto sea
mayor que el valor de línea, de forma que sea más fácil ajustar a los puntos extremos
de las líneas.

Personalización de Web Designer contiene detalles del diálogo de opciones.

Difuminación (Feathering)
Si quieres que los bordes de un objeto sean borrosos (blur) para que el objeto se
desvanezca en un objeto de fondo. Esto se llama difuminación. Un ejemplo es cuando
se fusionan dos mapas de bits para evitar un borde marcado entre ellos.

El control de difuminación se encuentra sobre el lado

derecho de la barra superior después del botón de
galerías.

Para difuminar un objeto:

1. Selecciona el objeto o los objetos que quieres difuminar.
2. Introduce un tamaño numérico para la difuminación en el campo de texto.
O
Haz clic en la flecha para ver la barra deslizante emergente. A medida que
arrastres la barra deslizante los objetos se difuminarán.

La difuminación fusiona los bordes de los objetos o los hace borrosos.

Si has seleccionado varios objetos, la difuminación aparecerá alrededor de cada

objeto. Si has agrupado los objetos, la difuminación aparecerá alrededor del conjunto
de objetos agrupado.

Objetos guía y líneas guía

Los objetos guía y las líneas guía son objetos de una capa especial: la capa guía. Una
capa guía se crea automáticamente cuando creas una línea guía (ver a continuación)
o puede crearse de forma manual con un clic derecho en la GALERÍA DE CAPAS y
seleccionando CREAR UNA CAPA GUÍA. Lee el capítulo "Capas para más información
(en la página 407)".

Usa la opción AJUSTAR A GUÍAS del menú Ventana (o la tecla 2 del teclado numérico)
para activar el ajuste a objetos guía.
www.magix.es
 Trabajar con objetos 127

Cualquier objeto colocado en la capa guía se convierte en un objeto guía. Esto puede
ser cualquier objeto incluyendo líneas en cualquier ángulo, formas irregulares y
QuickShapes. Puedes crear, eliminar y cambiar el tamaño de los objetos de la capa
guía al igual que en las otras capas, pero los objetos se verán con contornos de puntos
rojos y el ancho de línea o color de relleno se ignorará. Esta información se guardará, y
si posteriormente mueves el objeto desde la capa guía a una capa normal, el ancho de
línea y los colores se verán nuevamente.)

Puedes usar los objetos guía para dibujar líneas de construcción como líneas que
pasan a través de un punto imaginario para un dibujo en perspectiva.

Colocar objetos en la capa guía

Primero asegúrate de que haya una capa guía en la GALERÍA DE PÁGINAS Y CAPAS, (ver
más arriba). Puedes crear objetos directamente en la capa guía si la seleccionas y
creas objetos de forma usual.

También puedes cortar o

copiar objetos desde otras
capas y pegarlos en la capa
guía. Para pegar objetos en la
misma posición relativa a la
capa guía utiliza el shortcut
"Ctrl+ Shift+ V".

La galería de páginas y capas muestra la capa guía

seleccionada encima de otras dos capas.

MOVER A LA CAPA DE DELANTE y MOVER A LA CAPA DE ATRÁS en el menú ARREGLO (o

hacer clic derecho y seleccionar "ARREGLO" > "MOVER A LA CAPA DE DELANTE/ DE
ATRÁS") ignora la capa guía y, por ello, no puede utilizarse para mover objetos a esta
capa.

Crear un línea guía

Las líneas guía son líneas verticales u horizontales que sirven para alinear rápida y
fácilmente una serie de objetos en la página.
• Activa las reglas (Ctrl+L).
• Arrastra desde una regla hasta la página

O
• Doble clic sobre la regla para crear una línea guía alineada al punto de clic.

Esto crea automáticamente una capa guía y coloca la línea guía en esa capa.
128

O, usa la galería de capas:

1. Clic derecho sobre la galería de capas y escoge PROPIEDADES
2. De ser necesario, escoge la pestaña Guías.
3. Selecciona horizontal o vertical.
4. Haz clic en Nuevo.
5. Introduce la posición deseada.

Eliminar una línea guía

Utiliza la herramienta de selección para arrastrar la línea guía hasta la regla apropiada
(la regla vertical para líneas guía verticales, la regla horizontal para horizontales).

O haz clic derecho sobre la línea guía y escoge Eliminar.

Resumen de shortcuts del teclado numérico

+ crea una copia mientras arrastras, cambias de tamaño, doblas, etc. El objeto
original no se modifica.
/ conserva el ancho de línea intacto al cambiar de tamaño el objeto.
- conserva el relleno sin cambios al mover, cambiar de tamaño, doblar, etc.
* activa y desactiva el ajuste magnético.

Agrupar y desagrupar objetos

Las herramientas de sombra y transparencia ofrecen diferentes resultados,
dependiendo si se trata de objetos agrupados o no. Para más información, lee el
capítulo Transparencia (en la página 244) y Sombras (en la página 253).

Muchas veces crearás formas complejas a partir de varios objetos diferentes. La

opción Arreglo >Agrupar, te permite unir estos objetos para que parezcan un solo
objeto. Después podrás seleccionar los objetos agrupados y copiarlos, moverlos,
escalarlos o realizar cualquier otra operación sobre todo el grupo.

Para crear un grupo

1. Selecciona todos los objetos que quieres incluir en el grupo.
2. Escoge Arreglo > Agrupar (o Ctrl+G) para crear el grupo.

Desagrupar objetos
1. Selecciona el grupo.
2. Escoge Arreglo > Desagrupar (o Ctrl+U).

Después de esto, todos los objetos individuales quedarán seleccionados.

www.magix.es
 Trabajar con objetos 129

Eliminar objetos de un grupo

1. Desagrupar los objetos.
2. +clic sobre los objetos que quieres eliminar. Esto los deselecciona, mientras
los otros objetos permanecen seleccionados.

Puedes escoger Arreglo > Agrupar para volver a agrupar los objetos restantes.

Seleccionar un objeto dentro de un grupo

(Por ejemplo, para cambiar su color.) Ctrl+clic sobre el objeto. (También puedes
utilizar esto para seleccionar un "grupo dentro de un grupo".) Si pulsas Tab o +Tab,
la selección dentro del grupo se moverá al objeto siguiente o anterior. Una vez que
has seleccionado un objeto dentro del grupo, puedes utilizar Alt+clic para seleccionar
el objeto debajo del objeto seleccionado.

Esto se llama "seleccionar dentro".

Grupos y capas
Más información sobre capas en el capítulo Capas (en la página 407)

Si todos los objetos que quieren agruparse se encuentran en una sola capa, el grupo
se creará en esa capa. El grupo se encuentra en el nivel del mayor miembro del grupo.
(Es decir, el grupo se convierte automáticamente en el objeto de adelante).

Si los objetos se encuentran en más de una capa, el grupo se creará en la capa que
contenga el objeto más cercano al frente.

Cambiar colores en un grupo

La mayoría de los grupos utilizan más de un color simple y a veces es útil cambiarlos
(por ejemplo para cambiar los colores de un botón formado por un grupo de objetos).
Podrías hacerlo simplemente desagrupándolos o usando SELECCIONAR INTERIOR para
cambiar el color de cada objeto individualmente, y reagruparlos después. Pero una
forma más rápida es seleccionar el grupo y hacer clic en un color. Si el grupo contiene
varios colores, aparecerá un diálogo que te permitirá elegir cuál reemplazar con el
color que has seleccionado. O abre el EDITOR DE COLOR y su lista de colores incluirá la
misma lista de colores que se ha usado en el grupo. Selecciona el color que quieres
editar.
130

Grupos suaves (soft groups, en inglés)

Los grupos normales, como se explicó en "Agrupar y desagrupar objetos" (en la
página 128), solo se colocan en una capa, no pueden estar en varias capas al mismo
tiempo. Los GRUPOS SUAVES te permiten conectar objetos a través de distintas capas.

Si seleccionas un componente de un grupo suave, también se seleccionarán otros

componentes del mismo grupo suave, incluso los que son invisibles o se encuentran
bloqueados. Esto significa que cuando muevas, gires o transformes un componente
de un grupo suave, todos los otros objetos también se modificarán de forma similar.

La barra de estado te indica cuando un grupo suave ha sido seleccionado.

Los grupos suaves son prácticos para cuando quieres mantener juntos los objetos que
están relacionados. Por ejemplo, los estados MOUSEOFF y MOUSEOVER de un botón
web se agrupan en un grupo suave para que el otro estado también guarde los
movimientos o transformaciones.

Creación de grupo suaves

Para crear un grupo suave, selecciona todos los objetos que quieras incluir en el grupo
y luego escoge "ARREGLO > APLICAR GRUPO SUAVE" (o pulsa "Ctrl + Alt + G"). Ten en
cuenta que si el grupo suave va a tener componentes en capas invisibles o
bloqueadas, tendrás que hacer esas capas temporalmente visibles y editables
utilizando la galería de capas para poder seleccionar los objetos y agruparlos en un
grupo suave.

Un objeto no puede ser miembro de más de un grupo suave y los grupos suaves no
pueden ser parte de otros grupos suaves.

Eliminación de grupos suaves

Para deshacer un grupo suave, seleccionar "ARREGLO > ELIMINAR GRUPO SUAVE " (o
pulsa “Ctrl + Alt + U”). Los objetos no serán borrados, pero no ya estarán asociados
en un grupo suave.

Sincronización de texto
En algunas circunstancias, los objetos de texto de un grupo suave se sincronizan para
que, si editas el texto de uno, también se actualice en los demás. Esta función existía
antes de la introducción de las COPIAS LIVE y las COPIAS LIVE son mucho más flexibles
y potentes, por lo que esta función ya no es tan útil como solía serlo. Sin embargo,
muchas plantillas y elementos de la GALERÍA DE DISEÑOS todavía la utilizan y también
se usa generalmente para botones MouseOver, en donde ambos estados del botón
deben tener la misma etiqueta todo el tiempo. Cuando se cambia la etiqueta del
estado desactivado, el estado MouseOver también cambia para coincidir.

www.magix.es
 Trabajar con objetos 131

Además, muchas veces pueden obtenerse efectos "similares a las sombras" si colocas
dos o más copias de texto muy cerca entre sí pero con un leve desplazamiento. Al
editar una, se cambiarán las demás en sincronización.

Para mantener la sincronización, los objetos de texto deben:

• encontrarse en el mismo grupo suave
• tener el mismo texto al momento de la creación de un grupo suave
• y contar con recuadros de límite superpuestos o encontrarse en diferentes capas
o diferentes frames de animación.

Si quieres que el texto se mantenga sincronizado en otras circunstancias, utiliza las

COPIAS LIVE .

Alineación
Así puedes alinear o distribuir de forma precisa dos o más objetos.

Alineación rápida
Selecciona los objetos que deseas alinear y haz clic derecho en la selección para
escoger ALINEAR del menú desplegable, luego escoge una de las opciones siguientes:
• Para alinear los objetos verticalmente, selecciona BORDES IZQUIERDOS ,
CENTROS o BORDES DERECHOS.
• Para alinear los objetos horizontalmente, escoge BORDES SUPERIORES , CENTROS o
BORDES INFERIORES .

Alineación y distribución del espacio

Si, además de alinearlos, quieres distribuir el espacio entre los objetos, selecciónalos,
haz clic derecho sobre la selección y escoge "ALINEAR" > "ALINEACIÓN" para ver el
diálogo de alineación de objetos. Como alternativa, escoge "ARREGLO" >
"ALINEACIÓN" ("Ctrl + + L").
132

El pequeño diagrama en la parte superior del

diálogo te muestra el efecto al seleccionar cada
opción. Los objetos seleccionados en el
documento no cambiarán hasta que pulses
APLICAR .

El diálogo de alineación es un diálogo no modal,

lo que significa que puedes dejarlo abierto y
continuar trabajando sobre el documento al
mismo tiempo. Por lo tanto, puedes cambiar
herramientas, dibujar y cambiar la selección del
objeto y después seleccionar una de las opciones
de alineación.
Si te has equivocado al seleccionar, puedes
cambiar a la selección y hacer clic sobre el botón
APLICAR para configurar la última alineación. Esto
puede ahorrarte mucho tiempo.

Dentro
Esta sección del diálogo controla los límites dentro de los que alineas o distribuyes los
objetos. Las opciones son:

LÍMITES DE SELECCIÓN : los límites son los bordes

externos de los objetos seleccionados. Esta posición
relativa no tiene efecto en la página.

LÍMITES DE UN OBJETO DE ATRÁS : los límites son los

bordes externos del objeto seleccionado que se
encuentre atrás de todo. Este objeto no será afectado
por el alineamiento.
Puedes utilizar esto para definir el objeto de
"referencia" cuando quieres alinear varios objetos en
una fila, por ejemplo. Con las opciones normales de
los "límites de la selección" el objeto que se
encuentre más a la izquierda será el objeto de
referencia (el que no se moverá).

www.magix.es
 Trabajar con objetos 133

PÁGINA/S : si los objetos se encuentran en una sola

página, los límites son los bordes de página. (Esto te
permite, por ejemplo, centrar objetos en la página o
alinear a partir del borde de página.)

Alineación
Para alinear objetos para que, por ejemplo, sus bordes izquierdos queden alineados a
la izquierda:
1. Selecciona los objetos y luego haz clic derecho sobre la selección.
2. Escoge "ALINEAR " > "BORDES IZQUIERDOS " de la lista desplegable.

Los objetos seleccionados se moverán para alinearse al borde izquierdo.

Como alternativa:
1. Escoge "ALINEAR " > "ALINEACIÓN " o pulsar "Ctrl + Shift + L" o escoge
ALINEACIÓN del menú ARREGLO para abrir el diálogo Alineación de objetos.
2. Selecciona la opción "DENTRO" deseada, por ejemplo, límites de selección.
3. Selecciona ALINEAR A LA IZQUIERDA para la posición horizontal.
4. Deja la posición vertical SIN CAMBIOS.
5. Haz clic en APLICAR .

Los objetos seleccionados se moverán para alinearse al borde izquierdo. Todas las
opciones de alineación actúan de forma similar. Mostramos solamente el ejemplo de
alineación izquierda para ser breves. Experimenta para aprender las otras opciones.

Para seleccionar rápidamente cualquier otra combinación de alineación vertical y

horizontal, haz clic en el diagrama:
• Un solo clic alinea la posición horizontal y vertical a la posición de clic de
cualquiera de las nueve combinaciones superior-centro-inferior/izquierda-
centro-derecha.
• "Ctrl + clic" no cambia la posición horizontal y arregla los objetos en una línea
alineada respecto a la parte superior, central o inferior.
• "+ clic" no cambia la posición vertical y arregla los objetos en una columna
alineada respecto a la izquierda, al centro o a la derecha.

Distribuir
Las opciones de distribución posicionarán los objetos seleccionados de forma regular
dentro del área (generalmente los límites de selección, pero también puede ser la
página o doble página.)

Todas las opciones de distribución funcionan de forma similar. Los siguientes

ejemplos muestran las diferentes opciones verticales para alinear objetos:
134

DISTRIBUIR BORDES SUPERIORES : las partes superiores

de los objetos se distribuyen de forma regular. La
distribución de BORDES INFERIORES es la inversa: la
parte inferior de los objetos se distribuye de forma
regular.

DISTRIBUIR CENTROS : los centros de los objetos se

distribuyen de forma regular.

DISTRIBUIR EN ESPACIOS IGUALES : los objetos

presentan espacios regulares entre uno y otro.

Las opciones de posición horizontal son similares, pero funcionan en dirección

horizontal. Si, por ejemplo, quieres distribuir esta colección de elipses para que
presenten espacios iguales y sus bordes superiores estén alineados:
• Selecciona las formas
• Abre el diálogo de alineación (Ctrl+Mayús+L)
• Asegúrate de que la sección DENTRO muestre la
opción LÍMITES DE SELECCIÓN
• Selecciona la posición horizontal: distribuir
centros
• Selecciona la posición vertical: alinear arriba
• Haz clic en APLICAR .

Ahora se verán así, con espaciado horizontal

equidistante y alineación superior.

Recuerda que si te has equivocado, siempre puedes deshacer la operación.

Copiar estilos - pegar atributos

Esto te permite copiar atributos (como el modelo de línea o el color de relleno) entre
objetos. Es una forma rápida de aplicar múltiples atributos a un objeto.

El cuadrado tiene un color, sombra, estilo

de línea y relleno específicos. Si se copia
y se pegan los atributos al círculo del
centro, el resultado será el círculo de la
derecha.

www.magix.es
 Trabajar con objetos 135

1. Selecciona el objeto cuyos atributos quieres copiar.

2. Copia la selección al portapapeles. ("EDICIÓN" > "COPIAR " o "Ctrl + C".)
3. Selecciona los objetos a los que quieres aplicar los atributos.
4. Escoge "EDICIÓN" > "PEGAR ATRIBUTOS" o "Ctrl + Shift + A".

El objeto permanece en el portapapeles hasta que lo sustituyas con otra operación

"copiar" o "cortar". Esto te permite repetir la función de "pegar" todas las veces que
quieras.

Librerías de estilos
Es bastante fácil utilizar esta técnica para crear documentos que pueden utilizarse
como librerías de estilo. Crea una serie de pequeños objetos con un relleno, color y
otros estilos de atributos. Después, la forma más sencilla de utilizar uno de estos
estilos es:
• Haz clic sobre el objeto fuente, "Ctrl+C" para copiar el estilo
• Ve al objeto de destino (que puede encontrarse en otro documento, "Ctrl+Tab"
para cambiar rápidamente entre documentos), haz clic en el objeto para aplicar
el estilo
• Pulsa "Ctrl+Shift+A" para aplicar los atributos

Atención: la mayoría de los atributos puede copiarse de esta forma, incluyendo

sombras, valores de difuminación, estilos de relleno, efectos en vivo, etc.. Sin
embargo, los biseles no pueden copiarse de un objeto a otro, si el objeto en el que se
tiene que copiar el bisel posee ya un bisel para aplicar a los atributos de bisel.

Nombrar objetos
Puedes aplicar nombres a cualquier objeto del MAGIX Web Designer 10
Premium, utilizando la opción "Aplicar, quitar o verificar nombres de objetos"
en la barra de información de la HERRAMIENTA DE SELECCIÓN .

La aplicación de nombres es un mecanismo que tiene una variedad de usos que serán
explicados a continuación. El uso más común es para formar series de objetos.

Ejemplos del uso de nombres

Animaciones Flash: los nombres para las animaciones Flash se usan para marcar
objetos a los que se les añadirán animaciones con el exportador Flash. Lee el capítulo
sobre Flash (en la página 418) para más detalles.

Objetos repetidos: se utiliza una convención especial de nombres para identificar un

objeto que aparecerá en la misma posición y con la misma forma en múltiples
páginas. Esto te permite editar una copia del objeto y actualizar todas las otras copias
para que estén iguales. Ver el capítulo "Objetos repetidos" (en la página 137) en
Primeros pasos.
136

El diálogo carece de modo así que puedes cambiar la selección mientras el diáolog
esté abierto. Muestra los nombres para la selección actual. El campo de texto superior
del diálogo te indica cuántos objetos están seleccionados actualmente.

Añadir nombres
Para añadir un nombre a un objeto, selecciona el objeto y abre el diálogo
APLICAR/ELIMINAR NOMBRES utilizando el botón de la BARRA DE INFORMACIÓN DE LA
HERRAMIENTA DE SELECCIÓN .

Introduce el nuevo nombre en el campo "Aplicar nombre" o utiliza la lista desplegable

del mismo campo para seleccionar un nombre que ya haya sido utilizado en otra parte
del documento actual. Haz clic en AÑADIR . El nombre aparecerá en la lista "NOMBRES
APLICADOS ".

Nombres aplicados
El campo de "NOMBRES APLICADOS " te muestra los nombres que se han aplicado en la
selección actual. Si hay más de un objeto seleccionado, solo se mostrará una lista de
los nombres aplicados si todos los objetos de la selección tienen la misma serie de
nombres. Si no es así, verás la palabra "<muchos>" indicando que se han aplicado
distintos nombres para los diferentes objetos de la selección.

Para quitar un nombre de un objeto seleccionado, haz clic en el nombre en la lista

"Nombres aplicados" y luego haz clic en el botón ELIMINAR .

www.magix.es
 Trabajar con objetos 137

Objetos repetidos
En las páginas web es muy común que ciertos elementos se repitan en todas las
páginas como, por ejemplo: los botones de navegación, los encabezados o los logos.

Web Designer te ofrece la posibilidad de repetir cualquier elemento en el mismo lugar

de las páginas del sitio. Cuando actualizas una de las copias, Web Designer aplica
automáticamente esos cambios a todas las páginas que tienen una copia del objeto
repetido.

En la mayoría de las plantillas de diseño se repiten los botones principales de

navegación. Puedes convertir a cualquier objeto, como un botón, en un objeto
repetido si haces clic derecho y escoges la opción REPETIR EN TODAS LAS PÁGINAS. El
objeto se copia en el mismo lugar en todas las páginas y verás el símbolo de objeto
repetido en la esquina superior derecha. Si realizas más cambios a este elemento,
todas las copias se actualizarán automáticamente.

Sin embargo, si la barra está configurada como BARRA DE NAVEGACIÓN DEL SITIO
aparecerá automáticamente en todas las páginas de tu sitio y no es necesario que la
conviertas en un objeto repetido.

Los textos de logos y pies de página generalmente se configuran como objetos que se
repiten. Esto significa que puedes editarlos en una sola página, y que el objeto se
actualizará automáticamente en todas las otras páginas.

Nota: se utiliza la página actual como fuente original para actualizar los elementos
repetidos de todas las páginas.

El recuadro rojo es el símbolo de objeto repetido y se muestra en todas las instancias del objeto
repetido.
138

Si no quieres una copia de un objeto que se repite en la página, solo tienes que
borrarla de esa página. Al editarlo, el objeto repetido se actualiza solamente en las
páginas que ya lo contienen. Esto significa que puedes escoger qué páginas de tu
documento deben tener el objeto que se repite y cuales no deben tenerlo.

Si quieres repetir un objeto en solo unas cuantas páginas de una página web extensa
puedes hacer lo siguiente:
1. Primero, repite tu objeto en todas las páginas de tu sitio web, usando "Arreglo" >
"Repetir en todas las páginas".
2. Selecciona uno de los objetos repetidos y cópialo al portapapeles ("Ctrl + C").
3. Pulsa la tecla "Eliminar" y selecciona la opción "Eliminar de todas las páginas"
cuando se indique.
4. Ahora simplemente pega el objeto repetido en cada página donde lo quieras
copiar.

Edición del contenido de un objeto repetido

Cuando Web Designer crea un objeto repetido, los elementos repetidos se colocan en
un grupo de repetición similar a un grupo normal. Si vas a una página inferior que
contiene un objeto repetido en la GALERÍA DE PÁGINAS Y CAPAS, puedes ver que hay
un grupo repetido que contiene a cada objeto repetido de esa página.

Web Designer coloca a cada objeto repetido dentro de un grupo de repetición.

www.magix.es
 Trabajar con objetos 139

Si deseas editar un elemento que se encuentra dentro de este grupo, pulsa Ctrl y haz
clic sobre el elemento para seleccionarlo dentro del grupo de repetición. También
puedes hacer doble clic sobre un grupo para editarlo en una nueva vista de
subdocumento (o haz clic en él y escoge ABRIR del menú de contexto). Contendrá
solamente el contenido del grupo y no el grupo en sí mismo, para que puedas
seleccionar directamente a los elementos del grupo con un clic.

Como alternativa, si vas a una herramienta específica, en general puedes hacer clic
directamente en cualquier objeto al que pueda aplicarse la herramienta y se
seleccionará dentro de su grupo de repetición (o de cualquier otro grupo). De esta
forma, puedes seleccionar, por ejemplo, una Quickshape que se encuentra dentro de
un grupo de repetición, si vas a la herramienta de Quickshape y haces clic sobre la
forma.

Al igual que con otras ediciones que realices a un objeto repetido, cualquier edición
que hagas dentro de un grupo de repetición se aplicará a todas las instancias de ese
objeto repetido en otras páginas.

Fijación de un objeto repetido

Puedes fijar un objeto repetido, si haces clic sobre él y escoges FIJAR OBJETO
REPETIDO . Una vez fijado, el objeto no puede seleccionarse. De todas formas, si
realizas una modificación a otras copias de ese objeto repetido en otras páginas que
no estén fijadas, se cambiarán todas las copias, incluyendo la copia fijada.

Detención de la repetición de objetos

Haz clic derecho sobre un objeto y escoge DETENER ACTUALIZACIÓN para desactivar la
repetición de un objeto o de todas las copias de ese objeto en tu sitio web. También
podrás hacerlo si escoges DETENER ACTUALIZACIÓN del menú ARREGLO.

Se te preguntará si quieres dejar de repetir el objeto seleccionado o todas las copias

del objeto. Escoge la opción TODOS . Ahora, cada copia puede editarse de forma
independiente y la próxima vez que realices un cambio, los otros objetos no se
actualizarán.

Utiliza esta opción cuando, por ejemplo, hayas utilizado ARREGLO > REPETIR EN TODAS
LAS PÁGINAS para copiar un objeto en todas las páginas de tu sitio web, pero luego
quieras modificar dichos objetos para que sean diferentes en cada página de forma
que dejen de estar conectados entre sí.

DETENER ACTUALIZACIÓN también es útil si quieres crear una copia de un objeto

repetido en una página (p. ej., un pie de página o un logotipo) y no quieres que esa
copia se actualice. En este caso, escoge la opción SOLO ESTA COPIA, cuando se te
pregunte.
140

Ten en cuenta que no puedes usar DETENER ACTUALIZACIÓN en barras de

navegación que tengan la opción BARRA DE NAVEGACIÓN DEL SITIO activada en el
DIÁLOGO DE BARRA DE NAVEGACIÓN . Esto es porque las barras de navegación del
sitio se actualizan siempre en toda la página. Consulta el capítulo Barras de
navegación para más información sobre las barras de navegación.

Eliminar objetos repetidos

Si no quieres una copia de un objeto que se repite en la página, solo tienes que
borrarla de esa página. MAGIX Web Designer 10 Premium te preguntará si deseas
eliminar solo esa copia o todas las copias del objeto repetido. Al pulsar "Ctrl +
Eliminar" se eliminarán el objeto repetido seleccionado sin preguntar si se quieren
eliminar todas las copias o solo una.

Pies de página y objetos que se amplían con la

página.
Normalmente en un documento de página web no todas las páginas tienen la misma
longitud y puede que tengas objetos que quieras que permanezcan a una distancia fija
del final de la página, incluso cuando la alargas o acortas. Estos elementos se llaman
objetos de pie de página. Puede que tengas también formas que conforman el fondo
de tu página, que deben extenderse o contraerse si cambia el largo de la página, de
modo que siempre se ajusten a la página adecuadamente. El submenú POSICIÓN EN LA
PÁGINA del menú contextual te permite hacer que los objetos se comporten de estas
maneras.

Haz clic derecho sobre un objeto y mira el submenú POSICIÓN EN LA PÁGINA . Este
menú te permite controlar la forma en que el objeto se comporta cuando cambias el
tamaño de la página. Las primeras cuatro entradas del submenú se comportan como
un grupo de botones de radio, es decir, que solo puedes seleccionar uno para cada
objeto cada vez.

Fijo
Esta es la opción por defecto y la configuración adecuada para la mayoría de los
objetos de un documento. La posición del objeto es fija con respecto a la parte
superior de la página de forma que no se moverá aun cuando cambies la longitud de
la página.

Pie de página
Así se marca el elemento como objeto de pie de página. Siempre mantendrá la misma
distancia con respecto a la parte inferior de la página, de forma que si amplías la
página, el objeto se moverá hacia abajo en la misma proporción. Si copias el objeto y
utilizas la opción PEGAR EN EL LUGAR para insertarlo en una página con un tamaño

www.magix.es
 Trabajar con objetos 141

diferente, el objeto se ubicará a la misma distancia de la parte inferior de esa otra

página.

Si configuras un objeto repetido como pie de página, se colocará a la misma distancia

de la parte inferior de cada página.

Automático
Esta opción es especialmente útil para plantillas de página y objetos repetidos.
Permite que un objeto se comporte como un pie de página, solo si se encuentra en la
mitad inferior de una página. Si mueves el objeto a la mitad superior de la página, se
comportará como un objeto fijo. La lógica de esta reacción reside en que los objetos
que son pie de página se necesitan en general cerca de la parte inferior de la página.

Esta es la configuración por defecto para los objetos repetidos. En otras palabras, si
configuras un objeto cerca del borde de la página como repetido, se colocará a la
misma distancia del borde inferior de todas las páginas en las que aparece. Pero si lo
mueves a la mitad superior de la página, ya no se tratará como un elemento de pie de
página.

Ampliar con la página

Si configuras a un objeto con AMPLIAR CON LA PÁGINA , la parte superior del objeto no
se moverá. Pero la parte inferior del objeto se desplazará para mantener la distancia a
la parte inferior de la página. Por lo tanto, el objeto se escalará en sentido vertical. En
general, esta opción es útil solamente para objetos que forman parte del fondo de una
página. Por ejemplo, muchas de las plantillas de páginas web de la galería de diseños
tienen rectángulos de colores en la capa de fondo de página que forman parte del
diseño de la página. En general, están configurados como AMPLIAR CON LA PÁGINA
para mantener un diseño perfecto con cualquier longitud de página.

Objetos de desplazamiento
Los objetos de desplazamiento son especialmente útiles en las plantillas de páginas
porque ayudan a mantener el diseño de la página cuando el texto se extiende o se
acorta. Los objetos de desplazamiento no se superponen unos con otros, por lo que si
amplías o mueves uno de forma que invada el espacio de otro, lo "desplazará" hacia
abajo en la página. Y si un objeto de desplazamiento se sale del final de la página, esta
se amplía automáticamente.

Para convertir un objeto en objeto de desplazamiento, haz clic derecho sobre él y

escoge DESPLAZAMIENTO... del submenú POSICIÓN EN LA PÁGINA . Aparecerá el diálogo
de DESPLAZAMIENTO.
142

Selecciona la casilla "Desplazamiento" para activar esta opción para los objetos
marcados. Luego puedes cambiar los márgenes inferior y superior, si lo deseas. Por
defecto, los márgenes inferior y superior están bloqueados conjuntamente: si quieres
configurarlos de forma independiente haz clic en el botón de bloqueo. El valor del
margen superior determina cuán cerca pueden estar los objetos de desplazamiento
entre sí, hasta que uno se desplace para dar lugar al otro. De esta forma impide que
otros objetos de desplazamiento se acerquen demasiado. De la misma forma, el valor
del margen inferior especifica cuán cerca puede estar de otro objeto de
desplazamiento situado debajo antes de que lo desplace. También define la distancia
mínima que debe mantenerse entre el objeto y el extremo inferior de la página (la
página se extenderá de ser necesario), ya que por lo general no deseas que el objeto
se encuentre justo sobre el borde de la página.

El campo AMPLIAR LADOS te permite hacer que el objeto de desplazamiento se

comporte como si fuera más ancho de lo que es en realidad. Esto significa que puedes
hacer que desplace a los objetos que se encuentran debajo (o que se lo empuje desde
arriba) aun si existe una separación horizontal entre los objetos. Entonces, por
ejemplo, un rectángulo de 100 píxeles de ancho con una configuración de
desplazamiento con AMPLIAR LADOS de 50 píxeles, se comportará como si tuviera
200 píxeles de ancho respecto al desplazamiento.

Como se menciona arriba, cuando un objeto de desplazamiento se alarga desplazará

otros objetos de desplazamiento debajo del mismo fuera de la página y , si es
necesario, la página se alargará. Pero, ¿qué ocurre si el objeto de desplazamiento se
acorta de nuevo (porque se haya borrado parte del texto de un objeto de texto, por
ejemplo)? Ahora hay espacio para que los objetos de desplazamiento debajo vuelvan
a desplazarse hacia arriba en la página. Por lo tanto, mientras que los objetos
comenzaron pegados antes de que el texto fuera borrado, esto es exactamente lo que
sucede a continuación: los objetos de desplazamiento inferiores suben, cubriendo el
hueco que en caso contrario se hubiera generado. De igual manera y donde sea
preciso, el final de la página se desplazará hacia arriba, haciendo la página más corta.

En resumen, aplicar "Desplazamiento" a los elementos principales de tu página ayuda

a mantener su disposición cuando se añade o elimina contenido de la misma.
www.magix.es
 Dibujar una linea o forma 143

Dibujar una linea o forma

Puedes utilizar cualquiera de las siguientes herramientas para dibujar líneas y formas:
• HERRAMIENTA DE MANO ALZADA Y PINCEL ("F3").
• HERRAMIENTA DE LÍNEAS RECTAS Y FLECHAS
• HERRAMIENTA DE EDICIÓN DE FORMAS ("F4").

La HERRAMIENTA DE MANO ALZADA Y PINCEL es la forma más simple de dibujar líneas,

curvas y formas, y funciona igual que un lápiz.

La HERRAMIENTA DE LÍNEAS RECTAS Y FLECHAS es la mejor opción si quieres dibujar

pequeños segmentos de líneas rectas o añadir extremos de flecha a cualquier tipo de
línea.

La HERRAMIENTA DE EDICIÓN DE FORMAS es la mejor herramienta para dibujar curvas y

líneas precisas. Es también la herramienta principal para editar líneas y formas.

Nota: aunque no es la barra de herramientas de la herramienta de dibujo,

también puedes usar la HERRAMIENTA DE PLUMA para crear formas precisas.
Tiene funcionalidad limitada y funciona como la herramienta de línea de otros
programas de dibujo. Para usar la HERRAMIENTA DE PLUMA , escoge BARRAS DE
CONTROL del menú VENTANA y haz clic en la casilla PALETA DE BOTONES . Luego
haz clic en el icono HERRAMIENTA DE PLUMA en la paleta de botones.

La herramienta de dibujo libre y pincel

Puedes utilizar esta herramienta para dibujar libremente como si fuera un
lápiz. También puede utilizarse para crear pinceladas, lo que se describe más
adelante. Incluye la opción de crear líneas de ancho variable si se utiliza un
dispositivo de dibujo sensible a la presión como una tableta gráfica. Mientras
utilizas esta herramienta, la barra de estado te suministra información sobre
cómo utilizarla.
1. Coloca el cursor en el lugar donde debe comenzar la línea.
2. Pulsa y mantén pulsada la tecla del ratón (o dibuja con tu tableta gráfica u otro
dispositivo conectado).
3. A medida que arrastras el cursor por el documento, dibujarás una línea en
tiempo real.
4. Suelta la tecla del ratón para finalizar la línea.
144

Después de dibujar libremente una línea

puedes controlar el suavizado de la
curva (la cantidad de puntos de control)
Suavizado Indicador de readaptación
ajustando la barra deslizante de control
de suavizado de la barra de
información.

Los valores bajos hacen que la línea siga el movimiento del ratón de forma más
cercana al crear más puntos de control, mientras que los valores más altos producen
curvas más suaves con menos puntos de control.

Los valores bajos son menos suaves Los valores altos ofrecen curvas más suaves

Puedes cambiar el suavizado en cualquier momento hasta que realices otras

ediciones a la línea (el indicador de readaptación te indicará en la barra de
información si todavía puedes hacer modificaciones al suavizado).

Borrar durante el dibujo

Antes de soltar el botón, puedes eliminar parte de la línea si pulsas la tecla Shift. El
icono del lápiz se dará la vuelta para que puedas utilizar la goma. Ahora podrás borrar
hacia atrás en la línea. Suelta  para continuar dibujando.

Dibujo de segmentos rectos con la herramienta de dibujo

libre
Mientras dibujas libremente una línea, presiona Alt y mueve el cursor hasta la nueva
posición, al soltar Alt la línea será recta. Puedes continuar dibujando la línea o pulsar
nuevamente Alt para dibujar otro segmento. Recuerda que puedes utilizar Ctrl para
limitar el ángulo de la línea. Si solo quieres dibujar muchos segmentos individuales de
líneas rectas, utiliza la herramienta de líneas rectas descrita más abajo.

www.magix.es
 Dibujar una linea o forma 145

Extender una línea

Asegúrate de haber seleccionado la línea (un solo clic sobre la forma o la línea
mientras te encuentras en la herramienta de DIBUJO LIBRE Y PINCEL lo hará). Ahora, si
te mueves hasta el final de la línea, un pequeño símbolo + junto al icono del lápiz te
indicará que puedes dibujar para añadir una nueva sección de dibujo libre a la línea.

Unir dos líneas

Selecciona ambas líneas ("Shift+clic" en la segunda línea para añadirla a la selección)
y ahora podrás dibujar desde el final de una línea hasta el final de la otra. Un pequeño
+ al lado del lápiz (aparece después de una pausa) te indica que te encuentras sobre
el extremo.

Cerrar una forma

Una forma es un objeto cerrado sin controles de inicio ni fin. Sólo las formas pueden
tener un relleno de color.

Para cerrar una forma:

1. Crea un objeto abierto cuyo punto de control de fin se
encuentre cerca del punto de control de inicio. Todos los
puntos de control - salvo el de fin - deberían encontrarse en
las posiciones deseadas.
2. Coloca el cursor sobre el control deslizante de fin.
3. Arrastra el control deslizante de fin hasta el control
deslizante de inicio y suelta la tecla del ratón. Los dos
controles deslizantes se unirán.

O:
1. Crea un objeto abierto con todos los controles deslizantes en
sus posiciones correctas. No dibujes el segmento de línea
final.
2. Mueve el cursor sobre el punto de inicio. Aparecerá un + a la
derecha del cursor cuando se encuentre sobre el control
deslizante de inicio.
3. Haz clic para crear el segmento final de la línea y cerrar la
forma.

O:
1. Escoge la herramienta de EDICIÓN DE FORMAS .
2. Haz clic sobre un punto de fin para seleccionarlo.
3. Pulsa la tecla Enter.
146

O:
1. Usa la herramienta de DIBUJO LIBRE Y PINCEL para crear el segmento final.

Cualquiera de estas opciones cerrará la forma. Si hay un color de relleno actual, la

forma se llenará con ese color.

Editar líneas/formas con la herramienta de

dibujo libre y pincel
No puedes modificar directamente las formas creadas con las herramientas de
rectángulo, elipses o quickshape. Primero debes convertirlas en formas editables con
"ARREGLO > CONVERTIR A FORMAS EDITABLES ". Consulta "Trabajar con formas (en la
página 173)" para más información.

Puedes utilizar la herramienta de DIBUJO LIBRE Y PINCEL para editar líneas (o el

contorno de las formas) y simplemente dibujar la sección de la línea que quieres
modificar. Por ejemplo, para editar el objeto:

Selecciona el objeto que quieres editar.

Mueve el lápiz de dibujo libre sobre una parte de la línea.

Una ~ mostrará cuando el lápiz se encuentra en su
posición.

Dibuja la línea requerida y después mueve el lápiz hasta el

segundo punto de la línea existente. Una ~ te indica
nuevamente cuando el lápiz se encuentra en la posición
correcta.

Al soltar la tecla del ratón, la sección de la línea se

sustituirá.

www.magix.es
 Dibujar una linea o forma 147

Modo Bosquejo
Esta opción es útil si estás dibujando rápidamente muchas líneas
independientes cercanas unas a otras, tal vez con una tableta de dibujo.

Al trabajar de esta forma, generalmente no quieres editar las líneas existentes que has
dibujado, sino dibujar nuevas líneas con cada trazo. Pero como se ha descrito
anteriormente, si inicias una operación de dibujo en una línea existente o sobre su
punto final, esa línea existente se modifica. Entonces, cuando haces un bosquejo, es
posible que modifiques líneas sin quererlo con tus pinceladas, en vez de dibujar
nuevas líneas como las que querías.

Para solucionar este problema, activa el modo de bosquejo. Ahora, si colocas el cursor
del ratón sobre una línea existente o un punto de extremo, verás que se hace una
breve pausa antes de que el cursor del ratón cambie para indicar que la línea se
editará o extenderá. Esta pausa significa que puedes seguir editando líneas existentes
si lo deseas, pero que no lo harás sin intención cuando quieres trazar nuevas líneas.

Dibujo sensible a la presión

MAGIX Web Designer 10 Premium es compatible con el dibujo sensible a la
presión con una tableta que admita la sensibilidad a la presión. Esta opción
está ubicada en la barra de información.

La mayoría de las tabletas modernas deberían ser compatibles. Así puedes dibujar
trazos de ancho variable: cuánta más presión se aplique, más ancho será el trazo.

Alta presión Baja presión

Para dibujar un trazo de ancho variable con la tableta:

1. Activa el dibujo sensible a la presión al pulsar el botón ACTIVAR/DESACTIVAR
GRABACIÓN DE PRESIÓN en la barra de información de la herramienta de mano
alzada.
2. Quita la selección actual (haz clic en una parte vacía del lienzo o pulsa Escape).
3. Escoge un ancho de línea adecuado de la lista desplegable de anchos de línea en
la barra superior. El ancho que has seleccionado será el ancho de la línea que se
dibuja cuando aplicas la máxima presión.
4. Un alerta aparecerá para preguntar si deseas hacer que el ancho de línea
seleccionado sea la opción por defecto para nuevos objetos. Pulsa el botón
"Fijar" para confirmar.
5. Empieza a dibujar con tu dispositivo de tableta. Cambia la presión a medida que
dibujas para variar el ancho de línea.
148

Hay una entrada especial en la lista desplegable de formas de trazo en la barra de

información llamada "Presión" para indicar que la línea seleccionada tiene un perfil
personalizado. Para convertir la línea dibujada a presión en un trazo normal, tan solo
escoge un perfil de trazo alternativo de la lista. De esta forma se eliminan todos los
datos de presión guardados para el trazo.

Modo de trazo
El modo trazo te ayuda a dibujar líneas que siguen bordes visibles en imágenes
fotográficas. Por ejemplo, puedes utilizarlo para dibujar alrededor de un edificio u otro
objeto en una foto que quieras cortar.

Para la mayoría de las fotos es mejor disminuir el valor por defecto del suavizado para
que la línea siga con mayor precisión los bordes complejos con menos suavizado de la
línea mientras dibujas. Siempre puedes ajustar el suavizado después de haber
dibujado la línea, de ser necesario.

Activar/desactivar modo trazo

Activa el modo trazo con el botón de la barra de información. Dibuja con la
herramienta de dibujo libre sobre una foto y verás que la línea intenta seguir los
bordes de la imagen.

También puedes activar y desactivar el modo trazo mientras estás dibujando la línea,
si pulsas la tecla T. El cursor del ratón cambia para indicar si el modo de trazo está
activado o desactivado. Esto te permite, por ejemplo, desactivar el modo trazo cuando
estás dibujando sobre una parte compleja de una imagen en donde no hay un borde
obvio que el modo trazo pueda seguir.

Asignar puntos
A veces verás mientras dibujas a lo largo de un borde en una foto que los últimos
píxeles de la línea "saltan" como si buscaran diferentes rutas. Cuando hay más de una
ruta posible, mueve el cursor alrededor y observa cómo el extremo salta entre ellos.
www.magix.es
 Dibujar una linea o forma 149

Puedes "asignar" el extremo en cualquier momento, al presionar la BARRA

ESPACIADORA cuando se haya encontrado la ruta correcta. Luego continúa y el modo
trazo encontrará más rutas entre el último punto asignado y el cursor del ratón.

Los puntos asignados se añaden automáticamente cada 50 píxeles de pantalla,

porque en general no querrás volver a dibujar una línea a esa altura, si ya te
encuentras tan lejos de ese punto.

Eliminación
Tal como se menciona anteriormente, independientemente de si el trazado está
activado o desactivado, puedes eliminar la última parte de la línea que has dibujado si
pulsas la tecla Shift y mueves el cursor del ratón a una parte anterior de la línea. La
línea se borrará desde ese punto hasta el final.

Imágenes complejas
Muy pocas fotos reales tienen objetos con bordes obvios que el modo trazo puede
seguir sin problemas. A menudo hay texturas en los objetos o en el fondo que harán
que el modo de trazo encuentre muchos bordes alternativos. Amplía las partes
difíciles de las fotos para obtener más control sobre el trazo y poder usar la barra
espaciadora para asignar puntos manualmente y con mayor frecuencia en las
imágenes más complejas. Luego presiona T para activar y desactivar el modo a
medida que te mueves por las partes de una imagen que son fáciles de trazar y las
que no.

Cortar objetos de las fotos

Para cortar una parte de una foto puedes dibujar una forma común sobre la foto y
después usar la función de formas combinadas en el menú ARREGLO para cortar la
foto con la forma (consulta el capítulo Trabajar con formas (en la página 171) para
más detalles).

O puedes ir al modo máscara, dibujar una forma de máscara sobre una foto y
después usar las funciones cortar, copiar y pegar (o la función combinar
formas) para cortar o copiar la parte de la foto que has indicado con la
máscara.

Consulta el capítulo Trabajar con fotos para más información sobre el modo de
máscara. Una vez que has cortado una parte de una foto, en general es una buena
idea aplicar una pequeña cantidad de difuminación para hacer el borde más borroso.

Edición no destructiva
A diferencia de la mayoría de las herramientas de foto que editan permanentemente
los píxeles de la foto cuando cortas objetos de esta forma, MAGIX Web Designer 10
Premium es no destructivo. El contorno es un contorno de vectores editable que
puedes editar de la misma forma que otras formas de vector con la herramienta de
150

dibujo libre o de formas. Utiliza la edición de formas para limpiar manualmente tu

contorno, y revelar más o menos imagen a medida que editas los bordes.

Estilos de pincel
La herramienta de DIBUJO LIBRE Y PINCEL también puede utilizarse para aplicar
distintos estilos de trazos sobre el trazado de la línea. Entonces, puedes convertir una
línea sólida con un ancho específico en una línea con ancho variable o utilizar uno de
los estilos de pincel, como "airbrush" o marcador de fieltro, etc.

Es importante comprender que la línea puede continuarse editando por lo que, a

diferencia de la mayoría de programas de dibujo y optimización de fotos, puedes
seleccionar la línea posteriormente y ajustar la forma de la línea y el trazo del pincel.
Esto se describe en el apartado PINCELES más adelante en este capítulo.

La herramienta de líneas rectas y flechas

Esta herramienta facilita el dibujo de segmentos individuales de líneas rectas y el
agregado de extremos de flecha a cualquier línea, de forma que es más fácil y práctico
que hacerlo con la galería de líneas.

Dibujo y edición de líneas rectas

Simplemente haz clic y arrastra sobre la página para dibujar una línea recta. Puedes
hacer clic sobre una línea existente para seleccionarla y, una vez seleccionada, puedes
hacer clic y arrastrar de cualquier extremo para moverlo.

Agregar extremos de flechas

La barra de información tiene dos listas desplegables a la izquierda, que te permiten
escoger un extremo de punta para cada extremo de la línea seleccionada.

Punta de flecha
Extremo posterior de la flecha
Tamaño del extremo de la flecha
Trayectoria invertida

La barra deslizante de la barra de información te permite cambiar el tamaño de los

extremos de flecha a la línea seleccionada actualmente. O puedes introducir un valor
de porcentaje en el campo de texto del tamaño a la derecha de la barra deslizante.

www.magix.es
 Dibujar una linea o forma 151

Por defecto, los extremos de línea se crean con un ancho 6 veces mayor que el ancho
de la línea, y esto se toma como el tamaño 100%, como indica la barra deslizante de
tamaño. Si haces la línea más ancha, el ancho del extremo de la flecha también se
actualizará. Por lo tanto, introduce un valor menor que 100% para reducir el tamaño
de los extremos de la flecha o mayor que 100% para aumentarlo. A pesar de que la
barra deslizante solo llega a un máximo de 800%, puedes entrar porcentajes mayores
en el campo de texto.

Trayectoria invertida
Presiona el botón TRAYECTORIA INVERTIDA de la barra de información para
intercambiar la punta y el final de la flecha de la línea seleccionada.

Agregar más segmentos de línea

Las líneas creadas con la herramienta de líneas rectas son, por supuesto,
completamente compatibles con las otras herramientas de dibujo. Entonces, si
quieres agregar más segmentos a una línea, curvarla o tal vez convertirla en una
forma cerrada, utiliza la herramienta de edición de formas.

La herramienta de edición de formas

La HERRAMIENTA DE EDICIÓN DE FORMAS es la herramienta principal para
crear curvas, líneas y formas precisas, así como para editar y modificar las
líneas y las formas.

Añadir/Cambiar/Editar indicador
Crear curva
Crear línea
Unión en curva
Unión marcada
Separar en puntos
Eliminar puntos
Invertir trayectoria
Posición de los controles deslizantes
Suavizado
152

La barra de información, que se muestra arriba, ofrece una amplia variedad de

controles, incluyendo un control numérico muy preciso.

Todas las líneas y formas en MAGIX Web Designer 10 Premium están formadas a
partir de una secuencia de curvas y secciones de línea. Muchas veces, las curvas se
denominan Bézier, en honor al primer matemático en describirlas.

Estas secciones o segmentos de una línea están señalados por pequeños controles
deslizantes negros. Puedes arrastrar, añadir y eliminar estos controles deslizantes
para manipular la forma de la línea o contorno.

Algunos objetos como QuickShapes, rectángulos, elipses y texto tienen que

convertirse en formas editables, antes de poder utilizar la HERRAMIENTA DE EDICIÓN
DE FORMAS para modificarlos. Para ello, selecciona un objeto y marca "ORDENAR " >
"COMBINAR FORMAS " > "AÑADIR FORMA".

Para dibujar un segmento de línea recto

Para comenzar una línea recta en la herramienta de EDICIÓN DE FORMAS
1. Haz clic donde quieras comenzar la línea. (Puedes comenzar una línea en
cualquiera de los extremos; no es necesario trabajar de izquierda a derecha, ni
de arriba hacia abajo). Esto crea un control deslizante. Este se ve como un
cuadrado rojo para señalar que está seleccionado.
2. De ser necesario, selecciona el botón CONVERTIR EN LÍNEA de la barra de
información. (Shortcut L). Esto te garantiza que el próximo clic dibujará un
segmento de línea recto.

Haz clic donde quieras colocar el próximo control deslizante o haz clic y arrastra y
después suelta el botón del ratón cuando la línea sea correcta. Esto crea un segmento
de línea y selecciona el nuevo control deslizante del extremo.

www.magix.es
 Dibujar una linea o forma 153

Mezclar líneas curvas y rectas

Para crear un objeto que es una mezcla de segmentos rectos y curvos, cambia entre
los botones CONVERTIR EN CURVA y CONVERTIR EN LÍNEA mientras creas el objeto
(también puedes pulsar L o C en el teclado).

Nota: También puedes usar el shortcut "X" para crear unión en vértice o "S" para
crear una unión fluida mientras usas el EDITOR DE FORMAS . Estos afectan la forma en
que dos segmentos de línea se unen. Una unión en vértice crea dos controles Bézier
independientes que puedes editar de forma separada. Con una unión en vértice
puedes crear un ángulo recto. Una unión fluida crea una unión simétrica que funciona
como un balancín. Si arrastras uno de los controles Bézier hacia abajo, el control
opuesto va hacia arriba.

Para dibujar un segmento de línea curvo:

Esto es similar a iniciar una línea recta (descrito
anteriormente).

1. Haz clic donde quieras comenzar la línea.

2. De ser necesario, selecciona el botón CONVERTIR EN CURVA . (Shortcut C)
3. Haz clic o arrastra (igual que lo descrito para las líneas rectas) para crear un
segundo control deslizante y un segmento curvo se añadirá a la línea.

Un segmento curvo tiene CONTROLES DE CURVA asociados con el control deslizante de

punto seleccionado. Puedes arrastrarlos para ajustar el ángulo y el radio de la curva.

Extender la línea.
Asegúrate de seleccionar un punto de control deslizante que se encuentre en un
extremo (contorno rojo) y después haz clic para añadir una nueva sección de línea o
154

curva. Cada clic sucesivo coloca un nuevo punto de control deslizante y dibuja un
nuevo segmento de línea a partir del punto de control deslizante seleccionado.

Finalizar la línea
 + clic completa la línea (manténla seleccionada), o pulsa "Esc" para terminar la
línea y deselecciónala. El próximo clic creará una nueva línea.

Añadir un nuevo punto de control

La herramienta de EDICIÓN DE FORMAS tiene tres modos dependiendo si no hay
ningún punto de control seleccionado (un clic iniciará una nueva línea), si está
seleccionado un control del extremo de la línea (un clic añadirá una nueva sección) o
si está seleccionado uno o más controles (puedes arrastrar o cambiar los controles
deslizantes).

En el modo actual, la barra de información muestra lo

siguiente:

• NUEVO :
clic para comenzar una nueva línea.
• AÑADIR :
clic para extender la línea.
• CAMBIAR : arrasta o elimina puntos de control.

Esto solo es aplicable a la herramienta de edición de formas.

Al final de una línea:

Selecciona la línea, después:

1. De ser necesario, haz clic en el punto de fin para seleccionarlo.
2. Coloca el cursor y haz clic para añadir una nueva sección.

En el medio de una línea:

Selecciona la línea, después:

1. Haz clic sobre la línea para añadir un nuevo punto de control sobre la línea.
2. Arrastra el punto de control a la posición deseada.

www.magix.es
 Dibujar una linea o forma 155

Al inicio de una línea:

Si el punto de fin está seleccionado y haces clic sobre el punto de inicio, la forma se
cerrará. Esto se describe en "Cerrar una forma" (en la página 145). Para añadir un
nuevo control deslizante en el inicio de una línea:
1. Termina la línea con  + clic.
2. Haz clic en el punto de inicio.
3. Coloca el cursor en posición y haz clic.

Seleccionar múltiples puntos de control

Es posible que quieras seleccionar varios puntos de control para, por ejemplo,
eliminarlos o moverlos como un grupo o cambiar una región de puntos a líneas curvas
o rectas. Para esto:
1. Selecciona un punto de control con un clic.
2.  + clic sobre otros puntos de control para seleccionarlos. ( + clic también
elimina la selección).
- O  + Ctrl+clic sobre un punto de control para seleccionar todos los puntos
de control de la línea.
- O arrastra el cursor del ratón diagonalmente para crear un rectángulo de
selección. Todos los puntos de control que se encuentren dentro del
rectángulo se seleccionarán.
- O  + arrastra el cursor del ratón diagonalmente para crear un rectángulo de
selección. Esto añade todos los puntos dentro del rectángulo a aquellos que
ya están seleccionados.
3. Si la línea tiene uno o más puntos de control seleccionados:
- Fin mueve la selección al final de la línea.
- Inicio mueve la selección al comienzo de la línea.
- Tab mueve la selección al próximo punto de control hacia el fin de la línea.
-  + tab mueve la selección al próximo punto de control hacia el inicio de la
línea.

Los puntos de inicio y fin son importantes cuando se aplican flechas (en la página
161).

Eliminar puntos
Selecciona el o los puntos de control tal como se describe
anteriormente y haz clic sobre el botón ELIMINAR PUNTOS (barra de
información del EDITOR DE FORMAS ) o pulsa la tecla Supr.
156

Mover puntos de control - Herramienta de

edición de formas
Puedes mover el o los controles deslizantes seleccionados:
• Arrastra los controles deslizantes usando el ratón.
• O utiliza las teclas de flechas de tu teclado.

O para mover un solo control deslizante, introduce los valores nuevos en los campos
de texto de la barra de información (ver más abajo).

Utilización de los campos de texto de la barra de

información
Los dos campos de texto
centrales siempre
muestran las
coordenadas X/Y del
punto seleccionado.

Los campos X/Y de al lado indican las coordenadas de los controles deslizantes de
curva a cada lado del punto seleccionado.

Por defecto, las coordenadas X/Y se miden a partir de la esquina inferior izquierda de
la página. Puedes cambiar esto en la pestaña "Cuadrícula y regla (en la página 474)"
en el diálogo de opciones. Si el punto seleccionado se encuentra al final de una
sección de línea curva, los campos izquierdos muestran la longitud y el ángulo de la
línea. Puedes ajustar estos valores introduciendo uno nuevo y pulsando Intro.

Longitud y ángulo para la línea recta

Posición del punto seleccionado
Posición del control de la curva

www.magix.es
 Dibujar una linea o forma 157

Suavizar una línea

Solo con herramienta de edición de forma.

Las formas importadas de un examinador pueden contener puntos innecesarios sobre

las líneas. Las líneas con demasiados puntos pueden ser poco manejables y reducir la
velocidad de renderización. MAGIX Web Designer 10 Premium puede suavizar la
línea para eliminar puntos innecesarios.

Selecciona todos los puntos de la parte de la línea que quieres suavizar. (Lee más
arriba). Es probable que la forma más sencilla de seleccionar una gran cantidad de
puntos sea la selección con arrastre sobre la región en la HERRAMIENTA DE EDICIÓN DE
FORMAS .

Arrastra la barra de suavizado del final de la barra

de información de la EDICIÓN DE FORMAS .

Los puntos eliminados se recuerdan para que puedas realizar otros cambios al
suavizado de la línea con solo ajustar la barra deslizante. Los puntos eliminados se
eliminan cuando realizas otra edición a la línea como, por ejemplo, arrastrar un
control deslizante.

Consejo: para asegurarte de que no se borren puntos importantes, comprueba que

no estén seleccionados. (+clic sobre un punto seleccionado para eliminar la
selección).

Restringir la línea
Cuando arrastras un punto de control y pulsas la
tecla de restricción (Ctrl), el movimiento se limitará
al ángulo de restricción (controlado en el diálogo de
OPCIONES , en la pestaña GENERAL ). Al arrastrar un
control deslizante de curva, el ángulo está
restringido.
158

Convertir una línea recta en una curva (y

viceversa)
1. Selecciona los puntos de control de los dos finales del segmento de línea.
2. Haz clic en CONVERTIR EN LÍNEA o CONVERTIR EN CURVA en la barra de
información o pulsa L o C en tu teclado.

Después de cambiar el tipo de línea, es posible que quieras mover los controles de
curva para una transición más suave entre los segmentos de línea curvos y rectos.

Puedes seleccionar varios segmentos de línea y convertirlos. Los puntos de control de

ambos extremos del segmento deben estar seleccionados.

Cambiar curvas
Uso del control de curva
Arrastrar el control de curva ajustará la curva de los segmentos de curva contiguos.

Mueve los controles deslizantes de curva hacia o desde

el punto de control para arrastrar la curva en la dirección
requerida.

Arrastrar el segmento de línea

También puedes cambiar la curva, arrastrando el segmento de línea entre los puntos.

Nota la diferencia entre arrastrar una línea para cambiar su forma y hacer clic en la
línea para añadir un nuevo punto de control. Arrastrar un segmento de línea recto lo
cambia a un segmento de línea curvo.

www.magix.es
 Dibujar una linea o forma 159

Crear uniones en punta

Generalmente, MAGIX Web Designer 10 Premium dibuja una curva suave a través de
un punto de control. Para esto, los dos controles de curva a cada lado del punto de
control están unidos. Si se mueve un control de curva, también se moverá el otro.

Muchas veces quieres crear una unión en punta. Para esto, necesitas desvincular los
controles de curva:
1. Haz doble clic sobre el punto de control.
2. O selecciona el punto de control y:

Haz clic sobre el botón UNIÓN EN PUNTA Z o pulsa Z en tu teclado.

Ahora puedes mover cada control de curva de forma independiente.

Crear uniones en curva

Para convertir una unión en punta en una curva:
1. Haz doble clic sobre el punto de control.
2. O selecciona el punto de control y:

Haz clic sobre el botón UNIÓN EN CURVA S o pulsa S en tu teclado.

Los dos controles de curva se han vinculado y se mueven a lados opuestos del punto
de control. Esto puede cambiar la forma de la curva.

Equilibrar curvas
El equilibrio hace que los dos controles deslizantes de la curva se encuentren a la
misma distancia del punto, lo que resulta en curvas más simétricas y suaves. Para
equilibrar una curva, selecciona el control deslizante del punto, luego arrastra uno de
los controles deslizantes de curva mientras mantienes la tecla SHIFT presionada. A
medida que arrastras uno de los controles deslizantes de la curva, el otro se moverá
para ser exactamente opuesto y tener la misma distancia desde el control deslizante
del punto.
160

Unir líneas
Para unir líneas ambas tienen que estar seleccionadas (los deslizantes de punto se
muestran en ambas líneas):

Con la herramienta de SELECCIÓN , mantén presionado "" y haz clic en las línea para
seleccionarlas (si ya te encuentras en la herramienta de EDICIÓN DE FORMAS , pulsa
"Alt + S" si quieres ir a la herramienta de SELECCIÓN , para seleccionar la segunda línea,
presiona " + clic", y luego "Alt + S" para volver a la herramienta de EDICIÓN DE
FORMAS .

El modo de selección de objetos está explicado en detalle en el capítulo "Selección

de objetos (en la página 103)".

Una vez que ambos objetos están seleccionados, en la herramienta de EDICIÓN DE

FORMAS , arrastra el control deslizante del extremo de la línea hasta el extremo de la
otra línea. Mientras arrastras, el cursor del ratón mostrará un símbolo + para indicar
que las líneas se unirán.

Si los extremos de ambas líneas ya se encuentran uno muy cerca del otro, pero no
están unidos, puedes ampliar el tamaño con el zoom, o alejar el punto de fin y
después volverlo a arrastrar para llevarlo hasta el punto de fin y ver el "+" que indica
que las líneas se unirán.

Para crear una forma con relleno, arrastra los otros dos controles deslizantes de fin
para que se unan. Puesto que unes los controles deslizantes de fin, sólo puedes unir
líneas y no formas. Las formas son objetos cerrados y, por lo tanto, no tienen
controles deslizantes de fin.

www.magix.es
 Dibujar una linea o forma 161

Cambiar el ancho de línea (grosor)

Para cambiar el ancho de la línea o del contorno de una forma, primero selecciona el
objeto o los objetos:

Introduce un nuevo valor para el ancho de línea en el campo de texto

de la barra de control ESTÁNDAR o escoge del menú uno de los
grosores de línea por defecto.

El grosor de la línea se mide tradicionalmente en puntos (abreviado pt.) 1 punto es

1/72 de una pulgada o aprox. 0,3mm, o un poco menos del grosor de un píxel de
pantalla si se visualiza al 100% del zoom

Puedes usar cualquiera de las unidades de medida estándar de MAGIX Web

Designer 10 Premium.

Puedes introducir el valor del ancho en cualquier unidad y MAGIX Web Designer 10
Premium lo convertirá al número correcto de puntos. Por ejemplo, puedes introducir
0,5cm y obtendrás una línea con un grosor de medio centímetro, pero el campo del
ancho de línea indicará un valor cercano a 14pt.

Si no has seleccionado ningún objeto y cambias el valor del grosor de la línea, esto
cambiará el ancho por defecto para todas las nuevas líneas.

Nota: el ancho de línea cero es un caso especial y no debería utilizarse. Esto dibuja
una línea de un píxel. El tamaño verdadero dependerá del dispositivo en el que se
visualizará el dibujo. En el monitor, un píxel es claramente visible y nunca se ve con
antialiasing. En dispositivos como impresoras o imagesetters, que presentan una
resolución mucho más alta, la línea es casi invisible. (Las líneas con ancho cero de
archivos importados se convierten a 0,25 pt.)

Galería de líneas
La GALERÍA DE LÍNEAS puede utilizarse para aplicar una gama de estilos o atributos de
línea como, trazos de pincel, plantillas con guiones, puntas de flecha y más.

Para ver la GALERÍA DE LÍNEAS :

• Selecciona "HERRAMIENTAS > GALERÍA DE LÍNEAS "
• O haz clic en la pestaña GALERÍA DE LÍNEAS en la barra de GALERÍAS.

La GALERÍA DE LÍNEAS está separada en secciones. Para abrir o cerrar una sección, haz
clic en el pequeño icono de carpeta de la ventana de la galería.
162

Ancho de línea
Tipo de unión
Extremo de línea

Para aplicar cualquier estilo o atributo de línea desde la galería puedes:

• arrastrar y soltar el estilo deseado desde la galería hasta la forma o línea;
• hacer doble clic sobre el estilo deseado en la galería;
• seleccionar el estilo y después hacer clic sobre el botón APLICAR .

Ancho de línea
El campo de texto que se encuentra encima de la galería es una copia del campo de
texto de la barra de control estándar.

Trazos de pincel
Hay varias secciones que muestran una selección de varios estilos de pincel.

Modelo de guión
Esta sección ofrece una selección de estilos de línea con guiones.

www.magix.es
 Dibujar una linea o forma 163

Puntas de flecha
La mejor forma de aplicar una punta de flecha es utilizar la HERRAMIENTA DE LÍNEAS
RECTAS Y FLECHAS (en la página 150), tal como se ha descrito anteriormente en este
capítulo. Sin embargo, también puedes utilizar la galería de líneas. Arrastra y suelta la
punta de flecha desde la galería hasta el extremo apropiado de la línea.

Como alternativa para aplicar una punta de flecha:

• Haz doble clic sobre la punta de flecha en la galería.
• O, selecciona la punta de flecha deseada y pulsa APLICAR .

Web Designer tiene dos tipos de diseños de flecha: comienzo y fin. Si la línea ya tiene,
por ejemplo, una punta de flecha de comienzo, la punta de flecha aplicada se colocará
automáticamente en el extremo final de la línea.

Si la línea no tiene puntas de flecha y pulsas el botón APLICAR o haces doble clic sobre
un estilo para aplicarlo, la punta de flecha se colocará al final de la línea.

El tamaño de la punta de flecha depende del ancho de la línea. Las líneas más anchas
tendrán puntas de flecha proporcionalmente más grandes.

Si pulsas "Ctrl" y haces doble clic sobre una punta de flecha o estilo de final se
aplicará en el otro extremo de la línea.

Para información general sobre galerías, consulta Manejo de documentos (en la

página 94).

Cambiar el tipo de unión

Este control en la parte superior de la GALERÍA DE LÍNEAS configura el estilo de las
esquinas.
164

Para cambiar una línea existente, selecciona la

línea.
Para cambiar el tipo de unión actual, deselecciona
todas las líneas.
Selecciona el tipo deseado del menú.

Cambiar extremo de línea

Este control en la parte superior de la GALERÍA DE LÍNEAS configura el estilo de los
extremos de la línea.

Para cambiar una línea existente, selecciona la

línea.
Para cambiar el extremo de línea por defecto,
deselecciona todas las líneas.
Selecciona el tipo deseado del menú.

www.magix.es
 Manejo de formas 165

Manejo de formas

Herramientas de dibujo y forma

Usa cualquiera de estas herramientas para crear formas regulares.

• HERRAMIENTA DE RECTÁNGULO ("M")
• HERRAMIENTA DE ELIPSE ("L")
• HERRAMIENTA DE FORMA RÁPIDA ("Shift + F2")

La HERRAMIENTA DE RECTÁNGULO crea rectángulos y cuadrados.

La HERRAMIENTA DE ELIPSE crea círculos y elipses.

La HERRAMIENTA QUICKSHAPE crea polígonos, estrellas y smartshapes.

Crear rectángulos y cuadrados

Para crear un rectángulo:utiliza la herramienta de RECTÁNGULO (" + F3" o
"M"). Haz clic y arrastra para dibujar un nuevo rectángulo.

Crear un cuadrado
Para crear un cuadrado en vez de un rectángulo, pulsa Ctrl mientras arrastras.

Creación y edición de rectángulos con esquinas

redondeadas
Para que las esquinas de tu rectángulo sean redondeadas, selecciónalo y luego
pulsa el botón "Esquinas redondeadas" en la barra de información de la
HERRAMIENTA DE SELECCIÓN .

Puedes arrastrar los controles deslizantes de las esquinas para ajustar el diámetro de
las esquinas redondeadas.
166

Para cambiar el tamaño de los rectángulos ve a la HERRAMIENTA DE RECTÁNGULO (y

arrastra los controles deslizantes de las esquinas) o a la HERRAMIENTA DE SELECCIÓN .

Ten en cuenta que si cambias la relación de aspecto de una esquina redondeada de

un rectángulo utilizando la herramienta de selección (extendiendo sólo una
dimensión), la relación de aspecto de las esquinas redondeadas no cambiará. Pero si
seleccionas varios objetos o si extiendes un grupo con un rectángulo con esquinas
redondeadas, la relación de aspecto de las esquinas no se mantendrá.

Crear círculos y elipses

Para crear una elipse o un círculo:

Selecciona la herramienta de ELIPSES (" + F4" o "L") de la barra de

herramientas principal.

Los botones RADIO Y DIÁMETRO de la barra de información crean automáticamente

círculos.

Radio
Diámetro
Creación con límites

Selecciona la opción RADIO para dibujar círculos. El lugar en dónde empieces a

arrastrar será el centro del círculo.

Selecciona la opción DIÁMETRO. Ahora el lugar en dónde empieces a arrastrar

determinará el borde del círculo.

Con el botón de CREACIÓN CON LÍMITES seleccionado, arrastra el ratón a través del
lienzo y se creará una elipse. Para crear un círculo en vez de una elipse, pulsa "Ctrl"
mientras arrastras.

Puedes convertir una elipse en un círculo en cualquier momento haciendo doble clic
sobre un control deslizante.

www.magix.es
 Manejo de formas 167

Smartshapes
Usa la HERRAMIENTA QUICKSHAPE para insertar SMARTSHAPES: una
colección de formas útiles ya preparada como flechas, globos de diálogo,
campos de texto y componentes geométricos.

Con la HERRAMIENTA QUICKSHAPE seleccionada, haz clic en el botón INSERTAR de la

barra de información y elige entre las formas disponibles en el menú desplegable. Si
seleccionas RECTÁNGULO , ELIPSE, PANEL DE TEXTO o GLOBO DE DIÁLOGO la forma se
colocará directamente en tu documento. Las otras opciones abrirán el CATÁLOGO DE
CONTENIDO ONLINE , donde están disponibles numerosas formas. Elige una forma e
impórtala simplemente en tu documento haciendo doble clic o haciendo clic en el
botón IMPORTAR . También puedes acceder a smartshapes a través de la GALERÍA DE
DISEÑOS y el menú principal INSERTAR .

Smartshapes de flecha, globo de diálogo y segmento de tarta.

Edición de smartshapes
Smartshapes viene con controles deslizantes predefinidos, lo que te permite editar las
formas de forma fácil e intuitiva. Simplemente modifica o curva una flecha o para
editar un globo de diálogo usando los controles deslizantes, por poner algún de
ejemplo. Los controles deslizantes aparecen cuando seleccionas la forma usando la
HERRAMIENTA QUICKSHAPE , y si pasas sobre el control deslizante, la barra de estado te
da una práctica descripción de la función.

Cuando estés en la herramienta de selección, haz doble clic sobre cualquier

smartshape y esto te lleva a la herramienta quickshape, de forma que puedes
arrastrar el ratón sobre los controles deslizantes de la forma.

Las smartshapes originales (a la izquierda) y las versiones editadas (a la derecha) que muestran
los controles deslizantes de smartshapes.
168

Con el globo de diálogo, los controles deslizantes te permiten cambiar las

dimensiones del globo, añadir una curvatura, controlar el área de texto y modificar el
tamaño y orientación de la flecha del globo. Cuando smartshape contiene texto,
puedes editarlo: cambia su tamaño y fuente, etc. así como para cualquier otro texto,
usando la HERRAMIENTA DE TEXTO.

Para cambiar los colores de una smartshape, puedes seleccionar la forma y hacer clic
en los colores sobre la línea de colores o abrir el EDITOR DE COLOR . O arrastra el color
desde la línea de color y suéltalo sobre el elemento. Donde hay múltiples colores en la
forma, el diálogo Reemplazamiento de color (en la página 183) aparecerá
permitiéndote elegir qué color quieres cambiar.

Hay muchas smartshape diferentes y verás más aparecer con el tiempo según el
programa vaya buscando nuevas formas modificadas en Internet cuando inicias el
programa. Así que mantente al tanto para agregar nuevas formas.

Crear polígonos y estrellas

Usa la herramienta QUICKSHAPE para crear una forma simétrica regular con esquinas
en punta o redondeadas. Luego puedes arrastrar los extremos para doblar los lados y
cambiar la cantidad de lados o convertir el objeto en una elipse, un polígono o una
estrella.

1. Selecciona la herramienta QUICKSHAPE (" + F2") de la barra de

herramientas desplegable.
2. Selecciona CREAR POLÍGONOS o FORMAS DE ESTRELLA de la barra de
información.
3. Selecciona la cantidad de lados en el menú o introduciendo el valor en el
campo de texto.

Modos de creación: Radio/Diámetro/Límites

Polígono
Elipse
Formas de estrella
Esquinas redondeadas
Restaurar bordes
Número de lados
Menú de elementos editables
Edición de campos
Insertar smartshapes
www.magix.es
 Manejo de formas 169

Para crear un polígono o estrella arrastra el ratón exactamente de la misma manera

que para un círculo o elipse usando los botones de creación de límites, diámetro o
radio para controlar el punto de origen de tu forma.
• Desde el centro hacia afuera (botón RADIO).
• O desde una esquina externa (botón de DIÁMETRO).
• O crea en diagonal un rectángulo imaginario que encierre el polígono (CREACIÓN
CON LÍMITES ) lo que te permite distorsionar el polígono o la estrella.

Polígonos o estrellas con esquinas redondeadas

Selecciona el botón ESQUINAS CURVADAS o haz
doble clic sobre un punto de esquina.

El polígono tiene controles

deslizantes adicionales
(controles deslizantes de
radio) donde comienza el
redondeo. Para aumentar o
disminuir el radio, arrastra
cualquiera de los controles de
radio.
Para eliminar las esquinas redondeadas:
• Haz clic en el botón ESQUINAS CURVADAS .
• O doble clic sobre el control deslizante.

Editar polígonos y estrellas

La herramienta SELECCIÓN te permite mover, girar, doblar y cambiar el tamaño de una
forma. (La herramienta SELECCIÓN se describe en Manejo de objetos en la página
103).

Usando la herramienta QUICKSHAPE puedes cambiar el tamaño o rotar:

• Arrastra los controles deslizantes de esquina.
• O selecciona TAMAÑO Y ROTACIÓN del menú ELEMENTOS EDITABLES . Introduce
los valores requeridos en los campos de texto.

También puedes desplazar los valores usando los botones de la derecha. Para mover:
• Arrastra el control deslizante del centro de la forma.
• O utiliza las teclas de flechas de tu teclado.
• O selecciona CENTRO en el menú ELEMENTOS EDITABLES . Introduce los valores
X/Y deseados en los campos de texto.
170

Aplica o elimina las esquinas redondeadas con un clic sobre el botón

ESQUINAS CURVADAS .

Cambia el polígono a una elipse haciendo clic en el botón CREAR ELIPSE o

haciendo doble clic en el centro del polígono.

Haz un polígono con forma de estrella haciendo clic en el botón FORMAS DE

ESTRELLA . O haciendo doble clic en un lateral.

Arrastra los lados para curvarlos. Mueve el cursor sobre la esquina del polígono (se
convertirá en una flecha). Ahora puedes arrastrar los lados.

A la izquierda se encuentran los polígonos

originales. Simplemente arrastra los lados para
crear lados curvos.
"Ctrl+doble clic" sobre el lado o un clic sobre RESTAURAR BORDES para que los lados
vuelvan a ponerse rectos.

Cambia la cantidad de lados introduciendo el número en el menú o

seleccionando una de las opciones.

Edición de estrellas
Para aumentar o disminuir la profundidad de la forma de estrella:

Arrastra un control deslizante de estrella o

selecciona RADIO Y DESPLAZAMIENTO DE LA
ESTRELLA del menú de ELEMENTOS EDITABLES .
Introduce los valores requeridos en los campos La forma original está a la izquierda.
de texto.
O arrastra los lados para curvarlos:

La forma original está a la izquierda.

También puedes desplazar los valores usando los botones de la derecha.

Desplazamiento desde el centro

Desplazamiento angular

www.magix.es
 Manejo de formas 171

Si haces "Ctrl + arrastrar" un lado de una estrella, todos los lados se desplazarán de
forma simétrica. Si pulsas "Ctrl + " y arrastras, se desplazará el par de lados como
imagen reflejada. "Ctrl+doble clic" sobre el lado o un clic sobre RESTAURAR BORDES
para que los lados vuelvan a ponerse rectos.

Combinar formas
La opción del menú ARREGLO > COMBINAR FORMAS te ofrece una amplia gama de
opciones avanzadas para combinar formas con el objetivo de crear nuevas formas
como, añadir, separar o cortar. Puedes utilizar la combinación de formas en cualquier
tipo de objeto, incluido los mapas de bits.

Crear agujeros en las formas

Escoge ARREGLO> COMBINAR FORMAS > SUSTRAER FORMAS . Esto es similar a utilizar
unir formas (descrito anteriormente). Las diferencias son:
• La forma de arriba (o el grupo de arriba) recibe un agujero de las otras formas.
• Los atributos y colores de línea de las formas subyacentes no se modificarán.
• Combinar formas modifica las líneas físicamente. La única forma de restaurar las
formas originales es utilizar deshacer.
• La cantidad de formas superpuestas no tiene efecto.

Fusionar varias formas en una sola

Por ejemplo, para crear la forma de la derecha a partir de las tres formas de la
izquierda:

1. Crea dos círculos y el rectángulo.

2. Selecciona las tres formas.
3. Haz clic derecho y escoge "COMBINAR FORMAS" > "AÑADIR FORMAS" .

La nueva forma tomará los atributos y colores de la forma de arriba (en este caso el
rectángulo de la ilustración.)

Intersección de formas
Con FORMAS DE INTERSECCIÓN , el nuevo objeto se crea de esas partes de las formas
inferiores que están cubiertas por el objeto de arriba.
172

Selecciona las formas que quieres utilizar y la

forma de arriba.

Escoge ARREGLO> COMBINAR FORMAS >

FORMAS DE INTERSECCIÓN . Esto crea una
nueva forma. La forma de arriba desaparece.

Los atributos y colores de línea de las formas subyacentes no se modificarán. Las

áreas no cubiertas por la forma de arriba se eliminarán. La forma de arriba puede ser
un grupo para una sustracción para completa. (Los grupos se describen en el capítulo
Manejo de objetos en la página 128).

Separar una forma

Si quieres separar una línea o una forma: selecciona un punto de control existente de
la línea o contorno de la forma, o crea uno nuevo donde quieres separar la línea (clic
sobre la línea en la herramienta de EDICIÓN DE FORMAS; ver arriba).

Haz clic sobre el botón SEPARAR EN PUNTOS o pulsa la B de tu teclado.

Si separas una línea, el cambio no será visible. Sin embargo, si mueves un punto de
control, solo se moverá una parte de la línea. Si separas una forma, se convertirá en
una línea. El relleno desaparecerá.

Nota: cortar formas (parte de Arreglo > Combinar formas) te permite separar
formas en dos formas individuales. Esta función se describe en el capítulo Trabajar
con formas (en la página 172).

Cortar formas
MAGIX Web Designer 10 Premium te permite cortar formas en dos o más partes.
Puedes usar un objeto sólido o una línea. Por ejemplo, para cortar un segmento de un
círculo:

www.magix.es
 Manejo de formas 173

1. Crea un círculo y un triángulo arriba

2. Selecciónalos.
3. Escoge ARREGLO> COMBINAR FORMAS >
CORTAR FORMAS .Las esquinas del
triángulo cortarán el círculo en dos
formas. El triángulo desaparecerá.
4. Ahora puedes arrastrar el segmento fuera
del círculo.

También puedes utilizar una línea para cortar un objeto:

La línea debería estar dibujada completamente a través del objeto y extenderse más
allá. (Como se muestra en la ilustración.) Si la línea es demasiado corta, sólo se
realizará un pequeño corte.

Convertir a formas editables

Escoge ARREGLO > CONVERTIR EN FORMAS EDITABLES (shortcut Ctrl++S) para
convertir objetos predefinidos como mapas de bits, rectángulos, elipses, QuickShapes
y texto en formas. Esto te permite editar su contorno como si fueran formas normales.

Esto tiene varios usos:

• Puedes manipular sólo una parte de los objetos predefinidos después de
convertirlos en editables.
• Puedes manipular texto de forma casi ilimitada, añadir nuevas curvas y
decoración según lo desees. Ten en cuenta que no puedes editar el texto
convertido en formas porque deja de ser texto.
• Es posible que quieras enviar un archivo .xar a alguien que no tiene esa fuente en
particular. Puesto que el texto convertido no es más que una colección de líneas
y curvas, no se necesita tener la fuente original.

La desventaja es que no puedes editar los objetos con sus herramientas originales.

Para más información sobre textos, lee el capítulo Trabajar con textos (en la página
190).
174

Trabajar con colores

MAGIX Web Designer 10 Premium te permite controlar la aplicación, creación y
modificación de los colores de los objetos. Para documentos simples, puedes escoger
los colores de la paleta de colores en pantalla, la línea de colores. Las operaciones de
color más avanzadas se describen más adelante.

La línea de colores
La línea de colores se muestra en la parte inferior de la ventana. Te permite ver los
colores de relleno y línea, te da acceso al editor de colores y proporciona la paleta de
colores predefinidos incluyendo la opción "sin color".

MUESTRA DE COLOR: la parte exterior de la muestra de color en el extremo

izquierdo muestra la línea de colores, mientras que el centro muestra el color de
relleno. Estos son los colores de cualquier objeto seleccionado o los atributos de
color actuales si no se ha seleccionado ningún objeto.

Este botón permite el acceso al editor de color (en la página 178).

SELECTOR DE COLOR: usa la pipeta para escoger un color de cualquier parte del
documento o cualquier parte de la pantalla del ordenador. Consulta Usar la
pipeta para escoger colores (en la página 179), para más detalles.
SIN COLOR: haciendo clic aquí puedes aplicar un "relleno sin color". Con
"Shift+clic" puedes aplicar "sin color" a una línea. Ten en cuenta que no es lo
mismo que 100 % transparente. "Sin color" y transparencia son diferentes. Una
forma a la que se le aplica transparencia sigue siendo una forma sólida, mientras
que una forma rellenada con "sin color" queda hueca. El botón SIN COLOR
también se puede utilizar para restaurar los colores originales de una foto a la
que se le haya aplicado un color continuo.
Marcador de color de relleno actual
Marcador de color de línea actual

Si la longitud de la línea de color excede la ventana, puedes desplazarte por la línea de

colores con la barra de desplazamiento inferior o arrastrando la línea de color con "Alt
+ arrastrar".

MAGIX Web Designer 10 Premium te ofrece varias opciones para el tamaño

visualizado de la línea de colores (descrito en Personalización de Web Designer)

www.magix.es
 Trabajar con colores 175

Colores de la línea de colores

Colores con nombre (originales): primero se encuentran los colores con nombre
(si se encuentran presentes en el documento, ver más abajo). Los colores con
nombre se utilizan para asignar colores originales a las plantillas y diseños, para
que el esquema de color de un diseño pueda cambiarse sin tener que editar cada
objeto de forma individual.
Colores vinculados: son aquellos colores que están relacionados con una sombra
o un matiz y se muestran de forma diferente en la línea de color (pequeños
rectángulos redondeados), de modo que resulta mucho más fácil distinguir los
colores con nombres independientes de aquellos que están vinculados a un color
principal. Leer el capítulo Creación de un tinte, una tonalidad o un color
vinculado (en la página 188).
Colores de paleta: hay una paleta "estándar" de 46 colores predefinidos. Hay 5
sombras de 7 colores estándar y 10 sombras de grises, negros y blancos. Los
colores de la paleta estándar no se pueden editar (es decir, no son colores con
nombre) y tienen una selección simple y limitada de colores que se utilizan para
aplicarlos a objetos (ya sea arrastrando hasta el objeto o mediante clic).

Los marcadores pequeños en los iconos de color muestran cuál de los colores con
nombre (si hay alguno) o colores de paleta se han aplicados al objeto seleccionado.

Los marcadores en forma de rombo muestran los colores usados por los
objetos seleccionados. Un rombo en la esquina superior izquierda indica el
color de relleno, en la esquina superior derecha indica el color de línea.
Los marcadores en forma de cruz muestran los atributos de color activo, si
no hay ningún objeto seleccionado. El color de línea a la derecha, el color
de relleno a la izquierda.
Los marcadores triangulares muestran los colores de un relleno si has
aplicado alguno.

Esto funciona también escogiendo un color con el selector de color de un objeto

existente, consulta Usar la pipeta para escoger colores (en la página 179). Los
marcadores de línea de colores se actualizan inmediatamente e indican el color del
objeto bajo la pipeta al arrastrarlo alrededor.

Reordenar los colores de la línea de color.

Es posible que prefieras cambiar el orden de los colores de la línea de color.
Simplemente pulsa Ctrl y arrastra los colores sobre la línea. Con esto también se
reordenará la GALERÍA DE COLORES . Sólo los colores con nombre pueden ser
reorganizados en la línea de color.
176

Menú contextual de la línea de colores

Haz clic derecho sobre un color de la línea de colores para ver un menú contextual
con las siguientes opciones:

EDITAR Abre el editor de color para editar el color con

ESTABLECER COLOR DE RELLENO
/ ESTABLECER COLOR DE LÍNEA
REEMPLAZAR COLORES
RENOMBRAR
ELIMINAR
nombre (no disponible para los colores de la paleta)
Configura este color como el color de relleno o de
línea del objeto seleccionado
Esta opción se muestra solo cuando el objeto
seleccionado tiene partes con múltiples componentes
o múltiples colores,
Cambiar el nombre del color con nombre (no
disponible para los colores de paleta)
Borra el color con nombre (no disponible para los
colores de paleta)

Si el objeto seleccionado es un mapa de bits, también puedes consultar las opciones

CONFIGURAR COLOR OSCURO DE TONO CONTINUO / CONFIGURAR COLOR CLARO DE
TONO CONTINUO. Consulta Coloreado de mapa de bits (en la página 238) para más
información.

Con un clic derecho sobre la opción "sin color", las opciones de color de relleno y línea
se reemplazarán por ELIMINAR COLOR DE RELLENO / ELIMINAR COLOR DE LÍNEA.

Aplicar colores de relleno y línea con arrastrar y

soltar
• Para aplicar un color de relleno a un objeto (seleccionado o sin seleccionar),
arrastra un color desde la línea de colores y suéltalo en el centro de la forma.
• Para establecer el color de línea o contorno, suelta el color sobre el contorno en
vez de sobre el centro.
• Para cambiar el color actual de relleno, arrastra un color a un espacio en blanco.
• Para cambiar el color de fondo de la página, arrastra un color hasta el fondo de
página.
• Para cambiar cualquier color en un objeto complejo o multicolor como un botón,
panel de texto, forma con relleno graduado, etc. suelta el color en cualquier
parte del objeto.

Al arrastrar colores, un indicador al lado del cursor te dirá cuál será el efecto al soltar
el color:

www.magix.es
 Trabajar con colores 177

Establecer un color de relleno liso (cuando se arrastra sobre un objeto) o los

colores intermedios de un relleno multicolor (en la página 241).

Establecer color de línea (cuando se arrastra sobre una línea).

Establecer color de relleno actual (cuando se arrastra sobre un espacio vacío).

Establecer color de inicio de relleno con gradación (cuando se arrastra sobre el

inicio de un relleno).

Establecer color final de relleno con gradación (cuando se arrastra sobre el final
de un relleno).

Establecer color de fondo de página o tablero de dibujo (cuando se arrastra un

color hasta la página o tablero de dibujo).

En vez de arrastrar y soltar, si has seleccionado un objeto, puedes hacer un simple clic
sobre la línea de color. Así se abre el Menú contextual de color de línea.

En los otros casos, puedes modificar el color de la línea con "Shift" + clic sobre la línea
de color.

Si has seleccionado una foto o una forma con relleno de mapa de bits, un clic sobre el
color de línea muestra el menú contextual con opciones de contorno incluidas. Color
continuo significa que el mapa de bits se convertirá a una escala de grises (blanco y
negro) y el color seleccionado se usará como un color claro de tono continuo. En
general, el color continuo oscuro es negro. Puedes configurar ambos colores
continuos a través del menú contextual de la línea de colores (leer más arriba).
Consulta Colorear mapa de bits (en la página 238) para más información.

Para establecer la opción "sin color" en un relleno o línea,

realiza los pasos descritos anteriormente, pero escoge la
opción "Sin color" en vez de un color.

Editar el color de un objeto

Para editar el color de relleno del objeto o objetos seleccionados:
• Selecciona "HERRAMIENTAS" > "EDITOR DE COLOR" ("Ctrl + E").
• O haz clic sobre el icono EDITOR DE COLOR en la línea de colores.
• O haz clic derecho sobre el objeto y selecciona COLOR DE RELLENO
• O haz doble clic sobre el icono de color de línea y relleno actual en la línea de
colores (al borde del panel más a la izquierda).
178

Para editar el color de línea del objeto o objetos seleccionados

• "Shift + clic" sobre el icono EDITAR COLOR
• O haz doble clic sobre el icono de color de línea y relleno actual (al borde del
panel más a la izquierda).

Esto muestra el EDITOR DE COLOR que te permite seleccionar cualquier color del
espectro. A diferencia de la mayoría de los programas gráficos, el Editor de color
puede permanecer en pantalla mientras continuas trabajando. Cambiará para reflejar
el color de los objetos seleccionados, y el poder arrastar la esquina inferior derecha
para redimensionar la ventana del EDITOR DE COLOR te permite ajustar el color del
objeto seleccionado fácilmente y con precisión.

El editor de color
El editor de color se utiliza para cambiar el color de los objetos del documento.

Cuando edites el color puedes arrastrar la pipeta para escoger colores de la

pantalla, incluso de otras ventanas abiertas
Selecciona el color a editar: color de relleno/ color de línea del objeto
seleccionado o cualquier color con nombre (original).
Haz clic en la etiqueta para crear un color con nombre
Haz clic para mostrar los controles de color ampliados
Color anterior
Color actual
Arrastra aquí para seleccionar cualquier tonalidad del tono seleccionado.
Arrastra aquí para seleccionar cualquier tono.
Arrastra aquí para aumentar el tamaño de la ventana.

www.magix.es
 Trabajar con colores 179

La forma más fácil de crear un color nuevo es seleccionar un tono de la línea de color
inferior. Todos los matices de este tono se verán en la sección superior: tan solo haz
clic o arrastra desde la sección superior para seleccionar el nuevo color. Verás que los
objetos seleccionados cambian de color a medida que los ajustas en el editor de color
(lo que se llama "vista previa en tiempo real").

Por ejemplo, para seleccionar un color rosa, que es un matiz pálido del rojo,
selecciona el color rojo en la sección inferior y después escoge un rojo muy pálido
(rosa) en el área superior derecha de la sección superior.

Color previo y actual

Mientras arrastras hasta el editor de color, las dos pequeñas muestras que se
encuentran en la esquina superior derecha del Editor de color muestran el color actual
y el previo (antes de que comenzaras con la edición). Esto es útil cuando quieres
realizar un cambio pequeño y comparar entre el color nuevo y el anterior.

Usar la pipeta para escoger colores

En vez de seleccionar tintes y tonalidades en el EDITOR DE COLOR puedes escoger un
color de cualquier parte del documento o de tu monitor, incluso de otras ventanas y
programas.

Para ello haz clic y arrastra la pipeta. A medida que arrastres, verás que el editor de
color toma el color que se encuentra debajo de la pipeta. Suelta el botón del ratón
cuando tengas el color deseado. Esta es una forma fácil y rápida de utilizar el mismo
color o copiar colores de fotos o de un objeto a otro.

Si el objeto bajo el cursor del ratón es complejo (p. ej. tiene aplicada una
transparencia) y el color no se puede determinar, se aplicará el color RGB de la
pantalla.

La muestra de color abre un pequeño popup en el cursor

del ratón que indica el color que se está probando en ese
momento. Este será o el nombre de color de la paleta, el
nombre ya fijo de un color o el modelo y valor del color.

Operaciones de color avanzadas

Haz clic sobre VER OPCIONES AVANZADAS en el editor de color para ver la
parte inferior del diálogo que te ofrece más opciones.
180

Sin color de relleno

Convertir color con nombre en local para frame/capa
Renombrar color con nombre
Valores de colores HSV
Valor de color hex RGB
Modelo de color (HSV, RGB o escala de grises)
Para leer más sobre tipos de colores, consulta el capítulo Creación de un
tinte, una tonalidad o un color vinculado (en la página 188).

Aquí puedes introducir valores precisos RGB (o HSV). En general, se introduce un

color hexadecimal RGB para los gráficos web. Los campos H , S y V te permiten
especificar el color con un valor porcentual HSV (valor de saturación de tinte). En el
campo # puedes introducir el valor RGB en números hexadecimales (0-F).

Aquí también están disponibles los botones de "Sin color de relleno" y de "Ayuda".

Colores locales y colores originales

Web Designer tiene dos tipos de colores:
• Los COLORES LOCALES se utilizan en un solo lugar del documento. Cada objeto
tiene un color por separado y nada se comparte. Esto es útil cuando quieres
cambiar el color de un objeto sin afectar otros objetos. Los colores locales son el
método más sencillo para documentos simples que utilizan relativamente pocos
colores. "Aplicar color" y "Editar el color de un objeto" explicados anteriormente
se refieren al trabajo con colores locales.
• Los COLORES ORIGINALES (O COLORES CON NOMBRE) pueden utilizarse una y otra
vez en el documento. (Son el equivalente a los estilos de un procesador de
textos). Los colores originales se utilizan en las plantillas y brindan un aspecto
consistente a los elementos de la página como los botones o las barras de
navegación. Cualquier edición que se realice a un color con nombre se reflejará
en todos los objetos o partes del dibujo que usen ese color. También puedes
copiar colores originales entre documentos. Los colores originales aparecen en

www.magix.es
 Trabajar con colores 181

la línea de colores. Si el diseño ya tiene colores originales y cargas o pegas

plantillas de la GALERÍA DE DISEÑOS que contengan colores originales con el
mismo nombre, el programa te preguntará si quieres que el color original
importado sea igual que los ya existentes. Se le adjudican nombres consistentes
a los colores originales de la mayoría de plantillas para que coincidan
perfectamente con los diferentes colores originales de los elementos que
importes.

Importante: si seleccionas un objeto de la página que tiene un color con nombre y lo

modificas con el editor de color, el color se convertirá en un color local en vez de un
color con nombre (porque se supone que si intentas editar el color del objeto, eso es
lo que quieres. Si lo que quieres hacer es cambiar el color con nombre y todas las
veces en las que se utiliza, entonces debes Editar el color con nombre (en la página
184).

Esquemas de colores originales

Muchos de los temas web ofrecidos en la GALERÍA DE DISEÑOS y en los paquetes de
plantillas que pueden adquirirse por separado incluyen esquemas de colores
alternativos que pueden aplicarse fácilmente a los sitios web que utilizan el mismo
tema para transformar el esquema de color de forma instantánea. Los esquemas de
color se pueden encontrar por lo general dentro de cada tema de la GALERÍA DE
DISEÑOS bajo TEMAS PARA PLANTILLAS DE PÁGINAS WEB , después de todos los diseños
de página y elementos gráficos independientes que conforman el tema. Todos tienen
"Esquema de color" en su título en la GALERÍA DE DISEÑOS , por lo que pueden
identificarse fácilmente.

Para aplicar un esquema de colores a tu sitio web, simplemente arrastra el esquema

desde la GALERÍA DE DISEÑOS y suéltalo en tu página. Puedes intentar aplicar los
esquemas de colores de un tema a un sitio web creado a partir de plantillas de otro
tema. Pero obtendrás resultados mezclados y algunos esquemas no funcionarán
correctamente con algunos temas. Por lo tanto, para mejores resultados, utiliza los
esquemas de colores del tema que has utilizado para crear tu sitio.

Uno de los esquemas de color que se ofrecen con cada tema concuerda con los
colores por defecto utilizados por ese tema. Esto te permite regresar fácilmente a los
colores originales, si lo prefieres, después de experimentar con esquemas
alternativos.

Creación de tus propios esquemas de colores

Es muy fácil crear tus archivos de esquemas de colores, que puedes compartir con los
usuarios de Web Designer para que ellos los utilicen en las páginas web creadas con
el mismo tema.
1. Carga una de las plantillas de página para el tema. Escoge una que muestre
todos los colores del tema de forma más efectiva. De ser necesario, puedes
182

agregar más elementos a la página para incluir toda la gama de colores

temáticos.
2. Edita los colores con nombre del tema uno por vez, tal como se describe a
continuación en la sección "Edición de colores con nombre" (en la página 184).
3. Una vez que estés satisfecho con tu nuevo esquema de colores, utiliza ARCHIVO
> GUARDAR COMO para guardarlo. El nombre de archivo que escojas DEBE incluir
"ThemeColorScheme" como parte del nombre del archivo. Esta es la forma en
que Web Designer reconoce los archivos de esquema de colores, es decir, al
buscar esa secuencia en el nombre del archivo. También es una buena idea
incluir el nombre del tema relacionado con el esquema. Por ejemplo, si es un
esquema de colores azules para el tema "Beta", podrías llamarlo
"BetaThemeColorSchemeAzul.web".

Para comprobar tu esquema de colores, arrástralo y suéltalo desde el explorador de

archivos hasta la página con los colores temáticos por defecto. La página debería
cambiar de color instantáneamente con tu esquema de colores.

Creación de nuevos colores con nombre

Si quieres usar el mismo color en diferentes partes del dibujo, y si existe la posibilidad
de que quieras cambiarle el color en el futuro, se recomienda que crees un COLOR CON
NOMBRE . Esto es fácil en MAGIX Web Designer 10 Premium:

Selecciona el objeto que tiene el color que quieres usar y luego haz clic en NUEVO
COLOR CON NOMBRE en el EDITOR DE COLOR .

Haz clic para crear un nuevo color con nombre

www.magix.es
 Trabajar con colores 183

Asígnale al color un nombre adecuado, como "color del coche" y haz clic en crear.
Verás el color nuevo añadido en la LÍNEA DE COLOR .

Ahora podrás aplicar el color a cualquier objeto como lo haces habitualmente,

arrastrándolo de la línea de color y luego soltándolo, o solo con un clic (o con un clic
en el botón derecho para usarlo como línea de color) para aplicarlo como color de
relleno. Cuando editas un color con nombre, todos los objetos que usen este color
cambiarán.

Reemplazar colores
Con Web Designer es más fácil volver a colorear objetos agrupados complejos como
botones, paneles de texto, barras de navegación, etc., ya que te ofrece una lista de
colores usados que te ayuda a elegir cual quieres reemplazar.

El diálogo de reemplazo de colores te permite seleccionar que color quieres reemplazar en el

grupo.

Puedes volver a colorear un elemento de una de las siguientes maneras:

• Arrastra el color desde la línea de color y suéltalo sobre el elemento.
• Selecciona un elemento y haz clic en un color de la línea de color.
• Selecciona el elemento y abre el EDITOR DE COLOR (Ctrl+E).

El editor mostrará una lista de colores de elemento en el menú desplegable en la parte

superior. Selecciona el que quieres editar y usa el editor de color como de costumbre.

Ten en cuenta que al reemplazar los colores en gráficos de esta forma, puedes re-
emplazar el uso de colores con nombre por colores locales sin nombre, o viceversa.
Así, por ejemplo, podrías tomar un botón que tiene el "tema de color 1" y reem-
plazarlo por el "tema de color 2". A partir de entonces, al editar el "tema de color 2"
en tu documento se cambiará también el color del botón. O bien, si reemplazas el
tema de color 1 con un color local, el botón ya no estará asociado a ningún tema de
color. Y puedes usar esta función para aplicar de forma rápida colores con nombre
en gráficos que originalmente no estaban diseñados para usar tales colores.
184

Si seleccionas el elemento pluma, el "Editor de color" mostrará las gama de colores de reemplazo
disponibles.

Ten en cuenta que, cuando seleccionas un objeto con múltiples colores, la lista
desplegable del editor de color te muestra únicamente estos colores. El color de
relleno local, la línea de color local y la lista de colores con nombre no están
incluidas en la lista en este contexto para evitar hacer la lista demasiado larga y
confusa.

Cambiar color de fondo

Arrastra un color desde la línea de colores y suéltalo en el fondo de la página o del
tablero de dibujo para establecer su color. Si hay múltiples colores en el fondo, se
mostrará el diálogo "Color de reemplazo" para que elijas que color reemplazar.
Funciona igual que como se ha descrito arriba para los grupos con múltiples colores.

Para usar el editor de color para cambiar los colores de fondo, haz clic derecho en la
página y selecciona "FONDO DE PÁGINA" >"EDITAR COLOR DE PÁGINA" , o sobre el fondo
del tablero de dibujo y selecciona "TABLERO DE DIBUJO FONDO" >"EDITAR COLOR DEL
TABLERO DE DIBUJO" .

Editar colores con nombre

Hay cuatro modos diferentes de ver el color en el EDITOR DE COLOR para poder
editarlo:
• Escoge del menú en el EDITOR DE COLOR .
• O haz clic sobre el color en la LÍNEA DE COLORES y selecciona EDITAR del menú
que aparece.
www.magix.es
 Trabajar con colores 185

• O arrastra y suelta un color de la línea de color sobre el EDITOR DE COLOR .

• O bien arrastra y suelta un color de la GALERÍA DE COLORES (explicado más
adelante) sobre el EDITOR DE COLOR .

Ahora podrás editar el color como lo desees. Todos los objetos que utilizan ese color
se actualizarán automáticamente para mostrar el nuevo color en todas las páginas de
tu documento.

Renombrar colores con nombre

Mientras editas un COLOR CON NOMBRE, haz clic derecho sobre el EDITOR DE COLOR y
selecciona RENOMBRAR
• O haz clic izquierdo sobre el color en la línea de colores y escoge RENOMBRAR .

Eliminar colores con nombre

Para eliminar un color con nombre, haz clic sobre el color en la línea de colores y
selecciona ELIMINAR .

Eliminar colores no utilizados

Para eliminar los colores no utilizados de la Línea de color, abre la galería de colores y
selecciona una gama de colores (haz clic sobre uno y Shift+clic sobre otro), después
pulsa el botón Eliminar. Se te preguntará si quieres eliminar solamente los colores no
utilizados. Sin embargo, ten en cuenta que los colores con nombre no utilizados, se
eliminarán automáticamente cuando se guarda o carga un documento.

Importación de colores con nombre

Al importar un diseño al documento actual (p.ej. al importar desde la GALERÍA DE
DISEÑOS , importar de un archivo XAR o pegar objetos de otro diseño), si alguno de los
nombres de los colores importados coincide con el nombre de los del diseño actual,
pero mantiene diferentes valores de color, aparecerá una alerta como la siguiente:

Si deseas que lo objetos importados adopten los colores de tu diseño actual, elige la
opción “IGUALAR ”. Esto hace que todos los objetos que usan un nombre de color dado
utilicen la muestra existente de dicho color tal y como aparece en el documento
actual.
186

Si por el contrario deseas que los objetos importados mantengan sus propios colores,
selecciona la opción “NO IGUALAR ”. Así se añaden nuevos nombres de colores a tu
diseño, con un número añadido al nombre de los colores para distinguirlos de los
colores que ya están en el diseño actual. De esta forma los objetos importados
mantendrán sus propios colores.

Observa que si importas objetos de múltiples diseños diferentes y eliges siempre “NO
IGUALAR ”, acabarás con un gran número de nombres de colores diferentes en tu línea
de color. Esto casi nunca resulta útil. Por ello una alternativa mejor es usar la función
"Reemplazar color" descrita arriba para cambiar los colores de los objetos donde no
quieras que adopten los colores tema de tu documento.

La misma entrada se muestra si hay diferencias en la definición del "estilo de texto"

entre el documento y el diseño importado. Ver esta entrada no significa
necesariamente que haya diferentes definiciones del nombre de color: podría deberse
tan solo a diferencias de "estilo de texto". Consulta la sección de "Estilos de texto" del
capítulo de "Manejo de texto" para más detalles.

La entrada de "igualar" arriba incluye una casilla de “NO PREGUNTARME DE NUEVO”. Si

haces clic aquí, la opción que elijas se aplicará a todas las importaciones futuras sin
preguntarte de nuevo. Sin embargo esto solo se aplica durante la sesión actual, por lo
que después de reiniciar el programa se te preguntará de nuevo, en relación a la
próxima importación, cuando haya alguna discrepancia con los colores.

Usar la opción IGUALAR significa que puedes escoger una plantilla, cambiar sus
colores de tema, importar a continuación más plantillas del mismo tema y los diseños
importados adoptarán automáticamente los colores de tema que has modificado.

Por ejemplo, importa un botón gráfico rojo de la GALERÍA DE DISEÑOS , cambia su color
de tema principal de rojo a verde, luego importa un logo gráfico rojo del mismo tema y
elige la opción “IGUALAR” . Cuando el logo aparece en tu diseño, en vez de ser rojo
habrá recogido automáticamente el color de tema verde escogido. Como en la
mayoría de los temas el nombre del color de tema principal es "Color de tema 1",
también obtendrás buenos resultados al importar gráficos de diferentes temas e
igualando los colores.

Convertir color con nombre en local para frame/capa

Cuando pulsas este botón, se crea un nuevo color con nombre que es idéntico
al que que has seleccionado.
Este nuevo color será aplicado a todos los objetos en el frame o capa actual que utiliza
el color con nombre seleccionado. Esto significa que con un clic puedes localizar para
frame/capa. Entonces puedes editar el color original y el localizado por separado.

Esta opción es útil cuando estás creando animaciones y quieres que el color de un
objeto cambie a medio camino de la animación. Este botón se oscurece a no ser que
estés editando un color con nombre que también es usado en otro frame o capa.
www.magix.es
 Trabajar con colores 187

Colores normales, tintes, tonalidades y colores

vinculados
Colores normales
Estos son los colores individuales que aplicas a los objetos. MAGIX Web Designer 10
Premium también puede vincular un color a otro color, es decir, cuando cambia el
color principal, el color vinculado también cambiará. Hay tres formas de vincular un
color a su: TINTE, TONALIDAD y COLORES VINCULADOS . Esta es una técnica muy útil
que te permite, por ejemplo, volver a cambiar el color un dibujo con tonalidades
complejas con un sólo clic. Algunos de los cliparts modelo utilizan esta técnica.

Tintes
Los tintes están vinculados a otros colores (llamados colores principales) y son
siempre una versión más pálida que el principal. Tienen dos usos principales:
• Cuando quieres crear tonalidades más pálidas de un color principal y es posible
que quieras cambiar el color principal en el futuro y que los tintes se actualicen
automáticamente.
• Para extender el rango de colores disponibles de las tintas de impresión. Por
ejemplo, un tinte 25% rojo resulta en un color rosa. Por lo tanto, utilizando tinta
roja puedes obtener tanto un rojo puro como un rosa. De la misma forma, si
estás utilizando solamente tinta negra y blanca, podrás crear varias tonalidades
de gris. Si estás imprimiendo con una gama limitada de colores (generalmente
es más económico imprimir a uno o dos colores en vez de a todo color).

Un tinte puede estar basado en cualquier tipo de color, incluyendo otro tinte.
Cualquier cambio que se realice al color principal, también cambiará a los tintes
basados en él. Por ejemplo, es posible que definas un color rosa como 50% del color
principal rojo. Si cambias el color principal a naranja, el tinte cambiará de rosa a
naranja claro.

Tonalidades
Esto permite crear colores más claros y más oscuros basados en un color principal. Si
se cambia el color principal, se modificarán también las tonalidades asociadas. Por
ejemplo, un dibujo de un coche puede utilizar tonalidades para las regiones con más
luz y tonalidades de la carrocería. Una simple edición al color principal cambiará todos
los colores, pero las tonalidades se mantendrán iguales. Por lo tanto, configurar
tonalidades es una forma muy útil de modificar colores.

Para obtener mejores resultados, el color principal debe ser un color saturado "puro".
Si se utiliza el modelo de color HSV, la saturación y el valor deberían ser 100%. Al
verlo en el EDITOR DE COLOR , la cruz debería encontrarse en la esquina superior
izquierda.
188

Colores vinculados
Los colores vinculados son similares a las tonalidades, pero permiten más flexibilidad.
También están basados en color principal pero puedes definir los atributos que
quieres que compartan el color vinculado y el principal. Por ejemplo, puedes crear un
color vinculado que sea una versión más o menos saturada del principal, pero que el
tinte y la tonalidad sean las del principal.

Creación de un tinte, una tonalidad o un color

vinculado
Ve arriba para leer la sección sobre TINTES , TONALIDADES y COLORES VINCULADOS . Te
será útil para cuando quieras encontrar el color principal de una tonalidad más clara u
oscura.

Los TINTES , las TONALIDADES y los COLORES VINCULADOS deben tener un color
"original" con un nombre de color asignado, para que cuando cambies el color original
también cambie su tonalidad. Por ello, de ser necesario, primero asígnale un nombre
al color (ver Creación de nuevos colores con nombre en la página 182).

Para crear un tinte, una tonalidad o un color vinculado:

1. Selecciona el objeto o los objetos a los que quieres aplicar el color.
2. Abre el EDITOR DE COLOR con las opciones avanzadas.
3. Selecciona la opción "color normal" en el menú desplegable situado en la parte
inferior del diálogo y elige entre las opciones TINTE, TONALIDAD, o VINCULADO.
4. En el menú desplegable del COLOR ORIGINAL , selecciona el color con nombre al
que quieres añadirle un vínculo.
5. Ajusta el TINTE, la TONALIDAD o el COLOR VINCULADO en la parte superior del
editor de color.

Si no aparecen las opciones de tinte, tonalidad y color vinculado en el menú

desplegable de "tipo de color", esto probablemente significa que aún no has creado un
color con nombre al que le quieres agregar un vínculo, o también puede ser que estás
editando el único color con nombre del diseño.

www.magix.es
 Trabajar con colores 189

A la izquierda verás que el nuevo color tiene un poco de tinte del color original "amarillo", por
ello el editor sólo suministra tintes más claros del color original. A la derecha si seleccionas la
opción tonalidad podrás elegir cualquier tonalidad más clara o más oscura del color original.

Si quieres utilizar este color en muchas partes del documento se recomienda que le
asignes al color un nombre para que aparezca en la línea de colores y así puedas
encontrarlo más fácilmente cuando lo necesites. Haz clic sobre el ícono con forma de
etiqueta para crear un nuevo nombre para un color. Ahora aparecerá en la línea de
color para que lo puedas escoger y colocar sobre otros objetos.

Editar el color principal

El objetivo principal de utilizar tintes, tonalidades y colores vinculados es que siguen
los cambios que se realizan al color principal. Para ver el resultado, intenta editar el
COLOR CON NOMBRE que es el principal (arrástralo de la LÍNEA DE COLOR hasta el
EDITOR DE COLOR y modifica el color.) Verás que los objetos con el tinte, tonalidad o
color cambian en sincronización con el color principal.

NOTA: ten cuidado de no editar el color de los objetos sobre la página a la que has
aplicado colores con NOMBRE, TINTES , TONALIDADES o COLORES VINCULADOS porque
se convertirán en COLORES LOCALES .
190

Trabajar con textos

Introducción
Las opciones de edición de texto de MAGIX Web Designer 10 Premium son similares
a los editores de texto o procesadores de texto, pero además suministra una amplia
gama de características que no encontrarás en esos programas.

Puedes aumentar o ampliar el texto a un tamaño muy grande.

Puedes aplicar la gama de atributos y efectos normales de MAGIX

Web Designer 10 Premium: rellenos, difuminación, transparencia,
tonalidades de color, sombras y continuar editando el texto.

Puedes convertir los contornos de las letras en formas que pueden

editarse al igual que cualquier forma normal.

Adaptar texto a la curva. Todo el texto puede girarse, inclinarse y extenderse.

www.magix.es
 Trabajar con textos 191

Terminología
FUENTE o TIPO DE FUENTE: un conjunto de caracteres con un estilo consistente.

FAMILIA DE FUENTES : un conjunto de fuentes similares. Por ejemplo, Garamond y

Garamond Italic son fuentes diferentes pero pertenecen a la misma familia
Garamond.

JUSTIFICACIÓN: una forma alternativa de describir a la alineación de texto. Al texto

alineado a la izquierda muchas veces se lo denomina justificado a la izquierda.

MONOESPACIADO : todos los caracteres individuales de una fuente monoespacio

tienen el mismo ancho. Muchas veces se las denomina fuentes con ancho fijo. Muy
útil para listados de programas. Courier es la fuente monoespacio más común. La
mayoría de las fuentes son fuentes con espaciado proporcional, es decir, que el ancho
de los caracteres varía.

PUNTO : el tamaño del texto o fuentes se miden en puntos (pt). 1 pt es

aproximadamente 1/72 pulgadas, por lo que un texto de 72 pt es tiene aprox. 1
pulgada de altura, a pesar de que las fuentes de un tamaño determinado pueden
variar.

La herramienta de texto
Usa la HERRAMIENTA DE TEXTO ("F8") para introducir o editar texto.

Barra de información de la HERRAMIENTA DE TEXTO , lado izquierdo

Fuente
Tamaño de fuente
Estilo
Negrita
Cursiva
Subrayado
192

Barra de información de la HERRAMIENTA DE TEXTO , lado derecho

Justificar
Superíndice/Subíndice
Espaciado de línea
Lista con viñetas
Lista numerada
Quitar sangría
Colocar sangría
Corrector de ortografía
Espaciado de párrafos

MAGIX Web Designer 10 Premium es compatible con tres tipos básicos de objetos
de texto
• Líneas de texto simple: haz clic sobre la página y escribe.
• Columnas de texto: haz clic y arrastra para crear una columna y después escribe.
• Áreas de texto: haz clic y arrastra en sentido diagonal para crear un área
rectangular. Después escribe.

Después de haber creado un objeto de texto puedes transformarlo (girarlo, inclinarlo,

cambiar su tamaño) y puedes aplicar todos los atributos normales, color de relleno,
transparencia, difuminación, etc. utilizando las herramientas normales. También
puedes vincularlo a una curva. El texto permanecerá editable.

www.magix.es
 Trabajar con textos 193

Menú de fuente

Popup de tamaño de fuente en tiempo real

Fuentes usadas en el documento actual
Fuentes compatibles con la web
Fuentes de Google
Todas las fuentes instaladas
Variantes de estilo disponibles para la fuente seleccionada. No todas las fuentes
tienen variantes

El menú de fuente muestra todas las fuentes instaladas y está dividido en cuatro
secciones. El apartado superior muestra las fuentes que se están usando actualmente
194

en el documento. El segundo apartado muestra las fuentes compatibles con la web.

Estas son las fuentes que puedes usar sin problemas para las páginas web, ya que son
admitidas por los navegadores y dispositivos más comunes. Consulta el apartado
"Fuentes compatibles con la web". La tercera sección muestra las fuentes de Google
disponibles que también pueden usarse de forma segura en la páginas web, y la
sección final presenta una lista alfabética de todas las fuentes instaladas. Cada
nombre de fuente se visualiza en el menú usando su propio tipo de letra, lo que hace
más fácil la selección.

Aquellas fuentes para las cuales están disponibles varios estilos se muestran con
pequeños triángulos negros en el lado derecho del menú. Tan solo mantén el cursor
del ratón sobre el nombre de una fuente durante un segundo o dos y aparecerá un
pequeño submenú a la derecha del menú principal que proporciona una lista de las
variantes disponibles de esa fuente. Mientras se visualiza el submenú puedes mover
el cursor del ratón por encima para seleccionar la variante de la fuente deseada.

Fuentes compatibles con la web

Estas fuentes son compatibles para su uso en páginas web porque la inmensa
mayoría de los PCs y otros dispositivos las tendrán instaladas. También puedes usar
cualquiera de las cientos de fuentes de Google en tu página. Incluso puedes usar otras
fuentes que tengas instaladas, siempre que la licencia de la fuente lo permita:
consulta la sección FUENTES PARA PÁGINAS WEB incluida abajo.

Vista previa de fuente en tiempo real

Si mantienes el ratón sobre cualquier entrada del menú de fuentes por una fracción
segundo, el texto seleccionado en el documento será actualizado para poder tener
una vista previa de esta fuente. No será un cambio permanente hasta que no hagas
clic sobre la fuente requerida. Si mueves el cursor del ratón sobre el menú volverás a
la fuente inicial hasta que te poses sobre otra entrada. Esto es ideal para obtener una
vista previa muy rápida de gran cantidad de fuentes.

Si pulsas la tecla "Shift" mientras navegas por el menú de fuentes, habrá una pequeña
pausa antes de que se vea la fuente seleccionada. Esta opción es práctica porque la
vista previa instantánea ralentiza la navegación a través del menú; y si tienes varias
fuentes seleccionadas este proceso será aún más lento.

Vista previa de tamaño de fuente en tiempo real

Junto al menú de tamaño de fuente se encuentra una barra deslizante emergente
igual a la que se utiliza en otras partes de Web Designer. Esto brinda un control de
tamaño de letra directo y ajustará el tamaño de fuente del texto seleccionado en
tiempo real a medida que arrastras la barra deslizante.

www.magix.es
 Trabajar con textos 195

Haz clic para ver la opción emergente para el tamaño de la fuente

Como con las barras emergentes deslizantes anteriores existen dos forma de uso.
Con "clic + soltar" sobre la flecha aparecerá la barra y se quedará en pantalla. Ahora
podrás arrastrar la barra deslizante o usar la rueda del ratón sobre el control para
ajustar rápidamente los valores. En este caso, podrás ajustar el tamaño de punto
usando la rueda del ratón para ver los resultados directamente en la página del
documento mientras trabajas.

Otra forma de utilizar la barra deslizante emergente es "pulsar + arrastrar + soltar"

sobre el botón y la barra. Esto es un modo ligeramente más directo de ajustar el
control (requiere menos clics).

Navegación instantánea del menú de fuente

Mientras el menú de fuente es mostrado, puedes escribir los carácteres iniciales del
nombre de fuente, y el menú se desplazará hasta esa sección de la lista. Por ejemplo,
si escribes "ver", se desplazará instantáneamente y localizará la fuente "Verdana".

Fuentes de Google
Web Designer te da la opción de usar una de las cientos de fuentes Google. Son
fuentes web de fuentes abiertas y gratuitas que tienen la ventaja de estar presentadas
por Google, por lo que no tienes que cargar archivos de fuentes con tu página web: tu
navegador buscará las fuentes directamente en los servidores alojamiento de fuentes
de Google.

Las fuentes están totalmente integradas en Web Designer, por lo que puedes navegar
y buscar a lo largo de la lista de fuentes utilizando el BUSCADOR DE FUENTES para
descargarlas e instalarlas en tu propio PC.

Para comenzar a usar fuentes Google, tan solo haz clic en AÑADIR del menú de
fuentes para detener el buscador de fuentes.
196

El buscador de fuentes de Google muestra alguna de las fuentes disponibles y familias de fuentes.

Puedes buscar fuentes introduciendo el nombre de fuente en la casilla de búsqueda o

desplázarte hacia abajo por la lista para encontrar una fuente adecuada. Restringe tu
búsqueda seleccionando estilos de fuente en las listas de casillas a la izquierda y usa
la barra de desplazamiento con vista previa para ver la fuente en diferentes tamaños.

Haz clic en la fuente elegida y se te preguntará si quieres descargarla e instalarla. En

muchos PC Windows, y dependiendo de tu configuración Windows, se solicitará
permiso para la instalación, que realiza un programa de instalación de fuentes
independiente. Cada fuente que instales aparecerá en la sección fuentes de Google
del menú de fuentes.

Algunas fuentes Google, como EXO, proveen una amplia gama de pesos En estos
casos el significado de la opción "Negrita" cambia ligeramente. Los valores de peso de
las fuentes pueden estar entre 100 (fuentes muy ligeras o delgadas) a 900 (fuentes
muy pesadas o negras). En lugar de seleccionar siempre un peso de negrita dado, al
aplicar negrita (pulsando el botón "B", o usando "Ctrl+B" cuando se edita el texto)
sucede lo siguiente:

www.magix.es
 Trabajar con textos 197

Peso del texto principal Peso seleccionado cuando se aplica

"B"

100 a 300 (Delgado/Extra ligero/ligero 400 (Normal)

500 a 500 (Normal/Medio 700 (Negrita)

600 a 900 (Seminegrita/Negrita/Extra etc.) 900 (Negro)

Por supuesto, no tienes por qué utilizar las fuentes exclusivamente para páginas web.
Como las fuentes son TrueType también se pueden usar en cualquier documento (p.
ej. un PDF).

Si envías otro usuario de Web Designer un archivo .xar o .web que contenga fuentes
de Google, se les preguntará, respecto a como cargar el documento, si quieren
descargar e instalar la fuente.

Nota: algunos navegadores no renderizan fuentes de Google tan efectivamente

como otros, por lo que es siempre una buena idea probar tus páginas web con varios
navegadores para asegurarte de que la calidad de las fuentes es aceptable.

Texto simple
Si quieres escribir una pequeña cantidad de texto simple, coloca el cursor donde
quieres introducir el texto y haz clic. Aparecerá un cursor rojo y podrás comenzar a
escribir con tu teclado.

Si te has equivocado, pulsa "Supr "o "Retroceso" de la forma usual.

Al pulsar "Enter" se completa la línea e inicia una línea de texto debajo. El espaciado
entre líneas se controla en el campo de texto de espaciado en la barra de información.

El texto básico no es adecuado para grandes párrafos, ya que no hay salto de línea
automático (puesto que el ancho es ilimitado). Usa mejor una columna de texto o un
área de texto en su lugar (ver más abajo).

Por defecto, el texto no tiene color de contorno. Con "Shift + clic" sobre un color de la
línea de color le darás un color de contorno al texto seleccionado (el grosor puede
ajustarse como siempre a través del control de ancho de línea). Probablemente
querrás establecer el tipo de unión de línea (en la página 163) para redondearla y
darle un aspecto más suave (controlen la parte superior de la GALERÍA DE LÍNEAS ).

El ancho de línea está definido Cambiar el ancho de línea (el grosor) (en la página
160). La aplicación de color está descrita en Manejo de colores (en la página 174).
198

Puedes seguir introduciendo texto incluso después de la rotación o de haber aplicado

un relleno o ajustado el texto a una línea.

Texto en una columna

Si estás introduciendo una gran cantidad de texto a lo largo de varias líneas, es posible
que una columna te resulte más útil. Cambiar el ancho de la columna adaptará
automáticamente el texto.

Para escribir una columna de texto:

1. Selecciona la herramienta de TEXTO.
2. Mueve el cursor del ratón al lugar de inicio de la columna.
3. Arrastra hacia la derecha para crear una línea horizontal del ancho de la
columna. Esta línea roja te muestra el ancho de la columna. Nunca se imprime.
4. Introduce el texto. No necesitas pulsar al final de una línea. Cuando el texto llega
al final de la columna sigue automáticamente en una nueva línea.

NOTA : si haces clic fuera o cambias la herramienta antes de comenzar a tipear, la

columna de texto se eliminará y no quedará nada en la página. Por lo tanto, debes
comenzar a tipear inmediatamente después de haber arrastrado la línea de ancho de
la columna.

En vez de tipear el texto, puedes crearlo en un editor de texto, copiarlo al portapapeles

y copiarlo en MAGIX Web Designer 10 Premium. Copiar y pegar es compatible con el
texto con formato RTF.

Las palabras sólo se separan en las líneas si se introduce un guión.

El efecto de el guión en un texto fluido.

Si introduces Ctrl+- (tecla menos) se insertará un guión suave que aparecerá

solamente si la palabra puede terminarse al final de la línea. Esto es especialmente útil
para columnas de texto angostas: para evitar espacios en blanco es posible que
necesites insertar guiones a algunas palabras. Si insertas un guión normal, la palabra
se separará al final de la línea. Se llama guión "suave" porque cuando la palabra
aparece en el medio de una línea, el guión desaparece (a diferencia de un guión
normal o el carácter menos), por lo que el guión se introduce sólo si es necesario.

Al editar texto, el guión suave funciona como un carácter invisible (no ocupa
espacio), pero puede reconocerse en el texto moviendo las flechas izquierda/derecha
sobre el lugar en donde se encuentra el carácter.

www.magix.es
 Trabajar con textos 199

Un guión rígido puede insertarse utilizando Ctrl+Shift+- (tecla menos). Un guión

rígido no causará ninguna separación. Esto es útil en situaciones en las que las
palabras presentan guiones pero no deben separarse al final de las líneas.

Cambiar el ancho de la columna

Arrastra uno de los dos controles deslizantes al final de la línea.

Cambiar el ángulo de la columna

Pulsa ń+arrastra uno de los controles deslizantes al final de la línea para cambiar el
ángulo de la columna. Como alternativa, pulsa Ctrl y arrastra para limitar la línea a
ángulos restringidos. También puedes utilizar la herramienta de SELECCIÓN y girar el
objeto de forma normal.

Para más información sobre ángulos restringidos, lee el capítulo Introducción a

MAGIX Web Designer 10 Premium (en la página 93).

Áreas de texto
Si haces clic y arrastras diagonalmente sobre la página usando la herramienta de
TEXTO , crearás un área de texto rectangular. El cursor se posicionará en la esquina
superior izquierda y podrás introducir texto y pegar. Un área de texto puede contener
una historia de texto "fluido". En este caso una sola pieza de texto fluye de un área de
texto a otra. Esto se llama texto fluido, como el agua, porque al añadir o eliminar texto
en un área, desbordará a o desde las áreas de texto conectadas.Si el texto sobrepasa
el final del área de texto se verá de color gris, a pesar de que podrás continuar
editando el texto de forma normal.

Conexión de áreas de texto, flujo de texto

Cuando un texto sobrepasa la parte inferior del área de texto, aparece una flecha roja
al final del área. Si arrastras este indicador sobre cualquier otra área de texto, el texto
fluirá hasta la nueva área de texto y las dos áreas se conectarán. Esto se muestra con
una flecha de flujo.

Área de texto en exceso sobre el área de texto con la flecha roja.

200

Si el cursor de texto se encuentra en un área con texto en exceso, haz clic y arrastra
sobre la página para crear una nueva área de texto. La nueva área de texto se
conectará automáticamente y el texto fluirá hasta la nueva área.

Consejo: puedes hacer fluir un texto desde un área a otra en cualquier página,
incluso en páginas anteriores. Si necesitas que el texto fluya a un área que se
encuentra varias páginas adelante, probablemente sea más fácil utilizar el método
anterior, aunque si reduces la imagen a un tamaño de texto pequeño podrás
arrastrar la flecha por las páginas.

Para desconectar un área de texto de otra, arrastra el indicador y suéltalo lejos de las
áreas de texto. O haz clic en la flecha de flujo en la parte inferior del área de texto y
selecciona DESVINCULAR FLUJO DE TEXTO .

Si eliminas un área de texto que está conectada con otra, solo se eliminará el área. El
texto volverá a fluir a las áreas de texto restantes.

Páginas de múltiples columnas

Puedes usar dos o más áreas de texto en tu página, vinculadas tal como se
describe arriba, para crear un diseño de página de múltiples columnas. Sin
embargo, Web Designer te ofrece una forma más rápida de hacerlo.
Selecciona el área de texto que quieres colocar en varias columnas o coloca
el signo de intercalación en él y haz clic en el botón COLUMNAS de la barra de
información de la HERRAMIENTA DE TEXTO . O haz clic derecho sobre el texto y
escoge COLUMNAS… del menú contextual.

Aparecerá el diálogo de
columnas...

Diálogo de columnas

Por defecto, la cantidad de columnas que se muestran coincidirá con la cantidad de

áreas de texto vinculadas de la página actual. No obstante, puedes cambiar este
número para adaptarlo a la cantidad de columnas que quieres incluir. Si quieres un
diseño de 3 columnas, introduce 3. También puedes especificar el tamaño del espacio
entre las columnas. Cuando hayas finalizado, pulsa CONVERTIR . Tus áreas de texto se
transformarán en un conjunto de columnas con espacios iguales.

www.magix.es
 Trabajar con textos 201

El ancho total del conjunto de áreas de texto se mantiene cuando utilizas el diálogo de
columnas, por lo que si las áreas de tu texto original cubrían únicamente la mitad
izquierda de tu página, las columnas creadas también cubrirán esa mitad. Por lo tanto,
si quieres que las columnas abarquen todo el ancho de la página, mueve o
redimensiona las áreas de texto de forma que cubran todo el ancho y luego utiliza el
diálogo de columnas para que estas tengan el mismo tamaño y espaciado.

Una página de 1 columna transformada en una página de 3 columnas.

También puedes utilizar el diálogo de columnas para reducir la cantidad de columnas

de la página si así lo deseas.

En el caso de que el mismo arreglo de columnas se encuentre en otras páginas (y

correspondan al mismo flujo de texto), se te preguntará si quieres aplicar los cambios
a las columnas de todas esas páginas también (tal como se describe en los cambios
de áreas de texto). Es decir, que si usas el diálogo de columnas podrás convertir de
inmediato un documento entero de una sola columna en un documento de múltiples
columnas, o viceversa, siempre que el flujo de texto sea único.

Saltos de columna
Inserta un salto de columna en un área de texto usando la HERRAMIENTA DE TEXTO
para hacer clic derecho en el punto del texto en el que quieres introducir el salto.
Luego selecciona "INSERTAR" > "SALTO DE COLUMNA" . O utiliza el shortcut
(Ctrl+Shift+Intro).
202

Un salto que se inserta en la mitad de la columna central (izquierda) desplaza el texto a la

siguiente columna (derecha).

Todo el texto después del salto de columna aparecerá en la siguiente área de texto
vinculada del flujo actual, ya sea en la misma página o en la siguiente.

Saltos de página
Inserta un salto de página en un área de texto usando la HERRAMIENTA DE TEXTO para
hacer clic derecho en el punto del texto en el que quieres introducir el salto. Luego
selecciona "INSERTAR" > "SALTO DE PÁGINA" . O utiliza el shortcut (Ctrl+Intro).

Todo el texto después del salto de página aparecerá en la siguiente área de texto
vinculada en la próxima página.

Cambiar el tamaño de las áreas de texto

Con la HERRAMIENTA DE TEXTO , puedes hacer clic y arrastrar cualquiera de los
controles deslizantes de esquina. El texto del área tomará el formato adecuado para
adaptarse al nuevo tamaño. Si cambias el tamaño de un área de texto con la
HERRAMIENTA DE SELECCIÓN , ocurre lo mismo: el texto en sí mismo no cambia de
tamaño sino solo el área de texto; el texto se reacomoda para adaptarse al nuevo
tamaño. Si lo que deseas es modificar el tamaño del texto del área de texto, ve a la
HERRAMIENTA DE TEXTO , selecciona todo el texto con Ctrl+A y cambia el tamaño de
fuente en la barra de información de HERRAMIENTA DE TEXTO .

Puedes girar el área de texto, utilizando la HERRAMIENTA DE SELECCIÓN de forma

normal y el texto fluirá a lo largo del área de texto girada.

www.magix.es
 Trabajar con textos 203

El flujo del texto no se ve afectado si giras una de las áreas de texto.

Mantén pulsada la tecla "Ctrl" mientras giras para limitar el ángulo de rotación a 90°
y a los ángulos alineados a la pantalla. Si usas la herramienta de texto, puedes hacer
clic y arrastrar los controles deslizantes de las esquinas. El texto del área cambiará de
formato para ajustarse al nuevo tamaño. Si modificas el tamaño de un área de texto
con la herramienta de selección ocurre lo mismo: el texto en sí mismo no cambia de
tamaño sino solo el área; el texto se reacomoda para adaptarse al nuevo tamaño. Si lo
que deseas es modificar el tamaño del texto del área de texto, ve a la herramienta de
texto, selecciona todo el texto con Ctrl+A y cambia el tamaño de fuente en la barra de
información de herramienta de texto.

Cantidad de palabras
La cantidad total de palabras y caracteres del texto actual se indica en la barra de
estado. Esto también muestra la cantidad de palabras excedidas. Si está seleccionada
cualquier región de texto, se mostrará la cuenta de la selección.

Texto siguiendo una curva

Para colocar un texto a lo largo de una curva de tu elección:
1. Crea un texto básico, un texto en
una columna o un área de texto
(ver más arriba).
2. Selecciona tu objeto de texto y
una curva.
3. Escoge ARREGLO > ADAPTAR
TEXTO A LA CURVA .

Como alternativa, selecciona una curva o línea y después, en la herramienta de

TEXTO , haz clic sobre la línea donde quieres que el texto comience y escribe. Esto
adaptará automáticamente el texto a lo largo de la línea. Cuando alcances el final de
la línea, el texto continuará en una nueva línea inmediatamente por debajo de la
anterior.
204

Si no quieres que el texto siga en otra línea, pulsa "Shift y clic" sobre la línea. Para
ocultar una curva, selecciona la herramienta de EDICIÓN DE FORMAS y configura el
color de la línea en SIN COLOR o un ancho de NINGUNO. También puedes editar la
curva de forma usual.

La aplicación de color está descrita en Trabajar con colores (en la página 174).

Ajustar el margen izquierdo y derecho de un texto sobre

una curva
Si estás comenzando a escribir o colocar una columna de texto sobre una curva,
puedes cambiar la posición de inicio y fin de los controles deslizantes rojos.
Simplemente arrástralos sobre la curva según lo desees. Si centras el texto, se
encontrará entre estos dos márgenes.

Cambiar lados de la línea

Haz clic derecho sobre el texto y selecciona la opción de menú INVERTIR TEXTO EN LA
CURVA . Como alternativa, si cambias la dirección de la línea (herramienta de EDICIÓN
DE TEXTO , botón INVERTIR TRAYECTORIA de la barra de información), entonces el texto
cambiará al otro lado de la línea o, en el caso de una forma cerrada, se moverá desde
el interior al exterior de la forma.

Editar texto
Haciendo doble clic sobre un objeto de texto en cualquier herramienta te llevará a la
herramienta de TEXTO y posicionará el cursor en la posición de clic en el texto.

Pueden utilizarse todas las funciones de cursor y operaciones usuales de un

procesador de texto. Por ejemplo:
• Haz clic donde deseas colocar el cursor.
• Utiliza las teclas de flechas que van hacia la izquierda, la derecha, hacia arriba o
abajo.
• Utiliza "Ctrl + teclas de flechas que van hacia la izquierda y derecha" para mover
una palabra hacia la derecha o hacia la izquierda.
• Pulsa "Inicio" o "Fin" para desplazarte al inicio o fin de la línea.
• Pulsa "Ctrl + Inicio" o "Ctrl + Fin" para desplazarte al inicio o fin del objeto de
texto.

Selección de texto:
• "Shift+ cualquiera" de las teclas anteriores para seleccionar el texto
• Doble clic para seleccionar una palabra
• Triple clic o "Ctrl + L" para seleccionar toda la línea de texto
• Cuatro clics (4x) seleccionan un párrafo
• O arrastra sobre el texto en la herramienta de texto para seleccionar el texto
www.magix.es
 Trabajar con textos 205

• "Ctrl + A" seleccionará todo el texto dentro del objeto de texto (debes
encontrarte en la herramienta de TEXTO.)

Si has seleccionado texto, cualquier cambio que realices se aplicará solamente a la

región de texto seleccionada. Si sólo se encuentra el cursor en el texto, entonces
cualquier atributo, por ejemplo, otro color, aparecerá solamente cuando introduzcas
texto nuevo.

Seleccionar todo el objeto de texto

Existe un shortcut para seleccionar todo el objeto de texto. En vez de utilizar Ctrl+A o
arrastrar a lo largo del texto, simplemente pulsa la tecla ESC . Esto elimina el cursor
pero selecciona todo el texto (la barra de estado confirmará 1 objeto de texto). Esto
facilita la aplicación de un efecto o atributo a toda la historia de texto.

Por ejemplo, para cambiar el tamaño de la fuente de todo el objeto de texto, pulsa ESC
y selecciona un nuevo tamaño de la barra de información.

Cambiar mayúsculas o minúsculas

Pulsar Ctrl+W cambiará la mayúscula o minúscula del texto detrás del cursor y
moverá el cursor. Entonces, si te das cuenta de que has tipeado una sección de texto
con la tecla Mayúsculas activada, coloca el cursor al inicio y pulsa Ctrl+W.

Puedes cambiar la mayúscula o minúscula de la región de texto seleccionada de la

misma forma. El cursor no se moverá.

Comillas inteligentes
Si escribes comillas ' o ", Xtreme las convertirá automáticamente en comillas de
apertura o cierre estéticamente adecuadas. Esto significa que 'esto' cambiará a ‘esto’
y "comillas" en “comillas”. Esta característica es lo suficientemente inteligente para
comprender el uso de comillas simples dentro de las palabras, para que, por ejemplo,
si escribes en inglés la palabra 'don't' no se convierta en ‘don’t’.

Introducir caracteres especiales

Existen shortcuts útiles para insertar caracteres especiales como © o ™. Lee la
sección Caracteres especiales (herramienta de texto) (en la página 507) en el
capítulo "Menús y shortcuts de teclado".

Todos estos shortcuts (con la excepción del espacio rígido) son compatibles con
Microsoft Word.
206

Insertar texto de ejemplo ('Lorem Ipsum')

Cuando se compone un diseño de página es una práctica común que se utilice un
texto de ejemplo que contiene palabras en pseudo-latín (que no significan nada) y
que tiene la apariencia general de un texto típico en inglés (o en otros idiomas
latinos). El texto comienza así: "Lorem ipsum dolor sit amet..."

Nota histórica. este mismo texto ha sido utilizado como texto de ejemplo por más
de 500 años en la industria de la imprenta, e incluso partes de las frases en latín se
han escrito hace más de 2000 años.

Para insertar un párrafo del texto "Lorem ipsum" tienes que pulsar las teclas Ctrl +
Shift + L ("L" para Lorem) utilizando la herramienta de texto. Para insertar un bloque
de texto más largo presiona esta combinación de teclas un par de veces.

Corrector de ortografía
La herramienta de texto incluye un corrector de ortografía. Para activarlo
selecciona el icono del CORRECTOR DE ORTOGRAFÍA en la barra de información
de la herramienta de TEXTO y se abrirá un menú.
Selecciona "REVISAR ORTOGRAFÍA MIENTRAS SE
ESCRIBE ". Ahora todas las palabras sin revisar de
tu documento y aquellas que vas tecleando
aparecen subrayadas con una línea de guiones.

Para corregir una palabra mal escrita, haz clic

sobre la palabra con el botón derecho del ratón y
el menú contextual te mostrará sugerencias
ortográficas correctas de la palabra situada en la
parte superior del menú. Selecciona
simplemente una de las sugerencias para
sustituir la palabra.

Selección de idioma
Haciendo clic en el icono del corrector de ortografía aparece un menú con todos los
idiomas para los cuales hay diccionarios instalados. Por defecto, el idioma
seleccionado corresponderá a la configuración local. Puedes elegir diferentes idiomas
para diferentes objetos de texto de modo que en tu documento puedes utilizar texto
en múltiples idiomas si fuera necesario.

Para cambiar el idioma asociado con el objeto de texto, selecciona el objeto de texto y
a continuación selecciona el idioma requerido en el menú del corrector de ortografía
de la herramienta de texto. Ahora, el objeto de texto será revisado con el diccionario
de la lengua que elegiste.

www.magix.es
 Trabajar con textos 207

Si quieres introducir numerosos objetos de texto utilizando un idioma diferente al

seleccionado por defecto, puedes cambiar el actual atributo de idioma de texto de
modo que no tienes que cambiar individualmente el idioma de cada objeto de texto.
Para ello asegúrate de que no has seleccionado nada (haz clic sobre un área vacía de
tu diseño utilizando la herramienta de selección). A continuación elige en la
herramienta de texto el idioma que quieras usando el menú del corrector de
ortografía. Se te preguntará si deseas fijar el atributo de idioma de texto actual. Haz
clic en "Fijar" para confirmarlo. De ahora en adelante cada nuevo objeto de texto que
crees se asociará al idioma elegido. Ten en cuenta que dicho atributo actual no se
cargará de nuevo cuando guardes y cargues tu diseño. Por lo tanto deberás repetir el
procedimiento anterior para fijar el atributo de idioma de texto actual la próxima vez
que cargues el documento, si quieres seguir introduciendo nuevos objetos de textos
usando el mismo idioma.

Si hay un objeto de texto cuya ortografía no quieres revisar en absoluto, selecciona el

objeto y elige la opción "Sin idioma (ignorar") del menú del corrector de ortografía.

Diccionario de usuario
Las palabras que utilices regularmente y que no se encuentren en el diccionario
suministrado por MAGIX Web Designer 10 Premium pueden añadirse a tu propio
diccionario personal. Haz clic con el botón derecho del ratón y selecciona "Añadir a
diccionario de usuario". Ahora la palabra ya no será detectada como incorrecta. El
diccionario de usuario se aplicará a todos los documentos que utilices en tu
ordenador y se aplicará para todos los idiomas.

Buscar y reemplazar
La función Buscar y reemplazar realiza una búsqueda en vivo para que a medida que
buscas algo, el texto se explora y se marca en tiempo real.

Para buscar texto, selecciona en el menú EDITAR > BUSCAR/REEMPLAZAR... o pulsa

CTRL+ALT+F y verás el siguiente diálogo:
208

Introduce la palabra de búsqueda y se resaltará en el texto. Puedes escoger buscar

solamente en la historia o página actual o en todo el documento (el texto fluye por
todas las páginas).

La opción TODA LA PALABRA buscará solamente todas las palabras que coincidan con
el texto de búsqueda. Por ejemplo, si buscas la palabra, "met", no se resaltará "metro".
La opción COINCIDIR MAYÚSCULAS Y MINÚSCULAS solamente buscará la letra exacta.
Si buscas, por ejemplo, "aBc" en esta opción, no encontrarás "abc".

Cómo sincronizar el texto empleando Grupos

suaves
En algunos diseños es posible que necesites que múltiples objetos de texto muestren
siempre el mismo texto, pero con estilos diferentes. Por lo general, cuando quieres
cambiar el texto mostrado en estos objetos, debes editar cada uno de forma
individual.

Añadiendo a un grupo suave objetos de texto relacionados de esta forma, puedes

asegurarte de que siempre mostrarán el mismo texto. Para añadir los objetos de texto
relacionados a un grupo suave, primero asegúrate de que todos ya poseen
exactamente el mismo texto (de lo contrario no se sincronizarán todos). A
continuación selecciona todos usando la herramienta de selección. Luego escoge
"ARREGLAR" > "APLICAR GRUPO SUAVE" ("Ctrl + Alt + G").

Ahora, cuando edites el texto de un objeto, los demás se actualizarán

automáticamente, aún cuando se encuentren en otras capas diferentes del
documento. Ten en cuenta que esta sincronización funciona incluso si algunos de los
objetos se encuentran en capas bloqueadas o invisibles.

Para deshacer un grupo suave, selecciona "ARREGLO" > "ELIMINAR GRUPO SUAVE "
("Ctrl + Alt + U"). Lee la sección de grupos suaves del capítulo Manejo de objetos (en
la página 130) para obtener más información sobre grupos suaves.

Tabulaciones, márgenes y sangrías

Reglas
Para ajustar las tabulaciones, márgenes y sangrías, necesitas activas las reglas del
documento.

Para esto:
• Escoge Ventana > Barras > Reglas.
• O pulsa Ctrl++R (este es un nuevo shortcut).
• O pulsa Ctrl+L (si no te encuentras en la herramienta de TEXTO).

www.magix.es
 Trabajar con textos 209

Las características de texto avanzadas sólo aparecerán en la regla cuando estés

utilizando la herramienta de TEXTO y cuando el cursor de texto se encuentre dentro
de la historia de texto o cuando el objeto de texto esté seleccionado en la herramienta
de TEXTO.

Al arrastrar los márgenes o tabulaciones en la regla de la herramienta de texto, verás

una guía vertical temporal que te facilitará alinear las tabulaciones o márgenes a otros
objetos de la página.

Márgenes y sangrías
Cualquier cambio que realices se aplicará al párrafo de texto actual, es decir, el
párrafo en el que se encuentra el cursor de texto. Por el contrario, si has seleccionado
una región de texto, el cambio se aplicará a los párrafos de la región seleccionada.

Puedes aplicar cambios a todo el texto de una historia de texto, si seleccionas todo el
texto dentro de la historia (Ctrl+A). Para cambiar más de una historia de texto,
selecciona los objetos de texto en la herramienta de SELECCIÓN , después cambia a la
herramienta de TEXTO y realiza los cambios correspondientes.

Margen izquierdo . Arrastra esto para cambiar el margen izquierdo del texto.

Margen de la primera línea. Arrastra para cambiar el margen izquierdo de la

primera línea del párrafo (útil para listas, como se muestra abajo).
Margen derecho. Arrastra esto para cambiar el margen derecho del texto.

Demostración del margen izquierdo y el margen de la primera línea

210

Demostración de un margen derecho

Texto siguiendo una curva

Si has adaptado una sola línea de texto a la curva utilizando la opción ADAPTAR TEXTO
A LA CURVA , la línea de curva será el margen.

Si has hecho clic sobre la línea o has adaptado una columna de texto a una curva o
línea, entonces verás indicadores de margen izquierdo y derecho (pequeños
cuadrados rojos) que puedes arrastrar a lo largo de la línea para ajustar los márgenes
utilizados para la justificación.

Tabulaciones
Por defecto, las historias de texto se crean con tabulaciones de 0,5 cm. Esto significa
que puedes pulsar la tecla Tab y tu texto se moverá al próximo punto de tabulación.
Sólo necesitas definir una nueva posición de tabulación, si deseas utilizar otro
espaciado.

Estas tabulaciones por defecto se muestran como "L" sobre la regla:

Tabulaciones estándar indicadas con "L"

www.magix.es
 Trabajar con textos 211

Tabulaciones personalizadas
Para crear una posición de tabulación personalizada, haz clic sobre la regla en el lugar
don de quieres colocar la tabulación. Se sustituirán las tabulaciones por defecto hasta
esa posición de la regla.

Por ejemplo:

El triángulo indica una tabulación personalizada

Para colocar más de una tabulación, haz clic varias veces sobre la regla. Para
desplazar una tabulación personalizada arrástrala a lo largo de la regla. Para eliminar
una tabulación arrástrala fuera de la regla (las tabulaciones por defecto retornarán).

Tipos de tabulaciones personalizadas

Puedes configurar diferentes tipos de tabulaciones personalizadas. Por defecto, las
tabulaciones personalizadas están alineadas a la izquierda. Esto significa que el texto
se alineará con la tabulación a la izquierda del texto. Para cambiar el tipo de
tabulación, haz clic sobre el icono de tabulación sobre la regla.

Están disponibles los siguientes tipos de tabulación personalizada. Puedes escoger

diferentes tipos de tabulaciones, puesto que no estás limitado a utilizar un solo tipo
de tabulación en una historia.

Alineación izquierda: el texto se alineará con la tabulación a la izquierda.

Alineación derecha: el texto se alineará con la tabulación a la derecha.

212

Alineación central: el texto se centrará a partir de la tabulación.

Alineación al decimal: los puntos decimales en el texto se alinearán con la

tabulación. Esto es útil para crear listas, sin importar la longitud del número, los
puntos decimales se alinearán con al tabulación.

Cómo crear sangrías francesas

La sangría francesa es cuando la primera línea del párrafo tiene un margen negativo, o
el margen se encuentra más a la izquierda que el margen izquierdo normal. Las listas
con número o viñetas son ejemplos de sangría francesa.

Para crear una sangría francesa:

1. Arrastra el margen izquierdo hacia adentro.
2. Haz clic sobre la regla lejos del margen izquierdo (crea una nueva tabulación) y
arrastra esta tabulación hasta el margen izquierdo.
3. Ahora todas las líneas comenzarán con sangría; puedes insertar cualquier
carácter o número y pulsar Tab para moverlo hasta el margen izquierdo. Y (al
igual que con el párrafo) todas las líneas siguientes de texto tendrán sangría
hasta el margen izquierdo.

Texto alrededor de objetos

Puede hacer que cualquier objeto en MAGIX Web Designer 10 Premium sea rodeado
por texto, de modo que el texto fluya alrededor del objeto, en vez de aparecer debajo.
Esto facilita la presentación de páginas que contienen pasajes largos de texto
combinados con fotos y gráficos. Una vez que has insertado los objetos, puedes
ajustar las posiciones de gráficos y fotos, y el texto se adaptará automáticamente y
fluirá alrededor de ellos.

Puedes escoger que el texto rodee solamente en una capa, lo que evita que el texto lo
haga en las otras capas y, además, evita que los objetos de capas superiores rodeen al
texto.

www.magix.es
 Trabajar con textos 213

Hacer que un objeto se rodee de texto

Para que el texto rodee al objeto, haz clic derecho y selecciona la opción CONTORNEAR
TEXTO . El texto de la misma capa que se encuentre debajo del objeto, lo rodeará con
un margen por defecto de 5 píxeles entre el texto y el objeto. Ten en cuenta que
contornear el texto sólo funciona si el texto está debajo de los objetos, si el texto está
encima no funciona.

Como alternativa, haz clic derecho sobre el objeto y selecciona CONTORNEO Y

ANCLAJE DE TEXTO para ver el diálogo correspondiente.

Haz clic en la casilla CONTORNEAR TEXTO ALREDEDOR DE ESTE GRÁFICO.

214

Si lo deseas, establece un margen para la distancia entre el texto y el objeto. Si deseas

una altura y un ancho diferentes para el margen, haz clic en el símbolo de candado e
ingresa el margen de altura en H (horizontal) y el ancho en V (vertical). Haz clic en
OK .

Para desactivar que el texto rodee al objeto, haz clic derecho sobre el objeto y vuelve
a escoger CONTORNEAR TEXTO para desactivarlo. O haz clic derecho y selecciona
CONTORNEO Y ANCLAJE DE TEXTO para ver el diálogo correspondiente. Haz clic en la
casilla CONTORNEAR TEXTO ALREDEDOR DE ESTE GRÁFICO para desactivar la opción y
haz clic en ACEPTAR .

Ten en cuenta que las líneas individuales de texto no responden al contonear objetos,
solo lo hacen las áreas con texto y columnas de texto.

Para que el texto texto fluya alrededor del objeto solamente en su misma capa,
consulta Propiedades de capa (en la página 413).

Gráficos anclados
Puedes colocar cualquier gráfico o grupo para anclarlo a una posición en un texto, de
forma que al mover el texto, el objeto de gráfico se desplace para mantener la misma
posición relativa. Sin embargo, el anclaje se debería usar para objetos que están fuera
de los márgenes del texto (p. ej. una foto que está a la derecha d izquierda de una
columna de texto), o tras el texto. Usa la incrustación para objetos que estén dentro
de los límites del texto (ver abajo).
1. La forma más rápida de anclar un gráfico o un grupo es hacer clic y escoger la
opción ANCLAR AL TEXTO. Sin embargo, si quieres también editar las propiedades
de anclaje, puedes hacer clic en el objeto y seleccionar CONTORNEO Y ANCLAJE DE
TEXTO para ver el diálogo del mismo nombre.
2. Haz clic en la casilla MOVER GRÁFICO CON EL TEXTO.
3. Por defecto, la opción MOVER SOLO VERTICALMENTE también está seleccionada,
de forma que el gráfico anclado se moverá solamente en sentido vertical a
medida que se edite el texto. Esta es normalmente la opción más útil: si quieres
que el objeto siga la posición de anclaje también horizontalmente, fijar el objeto
es por lo general una opción mejor.
4. Un símbolo de ancla aparecerá en la parte superior izquierda del objeto para
indicarte que está anclado.
5. Con la HERRAMIENTA DE SELECCIÓN o la HERRAMIENTA DE TEXTO, haz clic y
arrastra el símbolo de ancla hasta que aparezca una flecha roja.
6. Mueve el extremo de la flecha y suéltala en la ubicación en la que quieres anclar
el objeto. Un signo de intercalación (una "T" invertida) te indicará la posición de
anclaje.
7. A medida que edites el texto alrededor de este signo de intercalación, el punto
de anclaje y el objeto de anclaje se moverán junto con el texto.

www.magix.es
 Trabajar con textos 215

Un objeto anclado muestra un símbolo de anclaje y una flecha que señala al punto de anclaje,
marcado con un signo de intercalación. Estos desaparecerán mientras escribes, salvo que te
encuentres cerca del punto de anclaje.

Nota: si arrastras la flecha de anclaje a un lugar de la página en la que no hay texto,

la flecha se convertirá en un ancla roja que indica que las propiedades de anclaje del
objeto se perderán si lo sueltas allí. Esto también ocurre cuando la flecha se suelta
en el mismo objeto.

Sin embargo, ten en cuenta que el objeto anclado no se moverá fuera del área de la
página como resultado de mover el punto de anclaje. El objeto anclado solo se moverá
hasta el borde de la página.

Este es un ejemplo de una columna de texto con diversos elementos gráficos a la izquierda. Cada
uno de estos está anclado al inicio de una línea de texto inmediatamente a la derecha.
216

Es posible anclar cualquier objeto o grupo de gráficos, incluyendo grupos con texto,
como el ejemplo del panel lateral, que se muestra arriba.

También es posible anclar objetos para que aparezcan arriba o debajo del texto. El
ejemplo del gráfico de flor azul pálido, que se muestra arriba, está anclado de esta
forma y fluirá junto con el texto.

NOTA : si un objeto anclado también está configurado para que el texto se contornee,
solo ocurrirá con el texto respecto del que el objeto está anclado.

NOTA : el contorno de texto es restringido para los objetos que se repiten; el texto
dentro de un grupo repetido se contorneará solamente respecto de los objetos
dentro del grupo repetido. Los objetos individuales con configuración de contorneo
dentro de un grupo repetido, solamente lo hacen respecto del texto dentro del grupo
repetido. Los grupos repetidos como un todo pueden contornear cualquier texto que
se encuentre debajo del grupo en la página.

Mover objetos anclados

Cuando agregas o eliminas texto, el objeto se mueve a medida que el texto fluye, pero
siempre mantendrá su posición relativa respecto al punto de anclaje. Puedes mover
un gráfico anclado arrastrándolo de la forma usual. Esto cambia su posición relativa
respecto del punto de anclaje, pero no mueve el punto de anclaje, que permanece
visible al final de la flecha del símbolo de anclaje si haces clic y mueves el gráfico.

Si quieres mover el punto de anclaje a otra ubicación dentro del texto, haz clic y
arrastra el símbolo de anclaje para crear una nueva flecha y arrastrarla a su nueva
ubicación. Si cortas y pegas el texto que contiene el signo de intercalación, el objeto
anclado también se cortará y pegará.

Visualización del punto de anclaje

El punto de anclaje del texto anclado solamente es visible si haces clic en el objeto
anclado con la HERRAMIENTA DE SELECCIÓN o si haces clic en el área que rodea al
texto en la HERRAMIENTA DE TEXTO.

Cuando haces clic en una región de texto con la HERRAMIENTA DE TEXTO , se

mostrarán los puntos de anclaje con el símbolo de la "T" invertida y una flecha desde
el punto de anclaje hasta el símbolo de anclaje en la parte superior izquierda de cada
objeto anclado. Entonces, la forma más sencilla de ver todos los puntos de anclado
para cualquier texto es hacer clic en él con la HERRAMIENTA DE TEXTO.

Sin embargo, cuando comienzas a editar el texto, el signo de intercalación, la flecha y

el símbolo de anclaje desaparecen temporalmente hasta que dejas de escribir. Si te
encuentras cerca del punto de anclaje, Web Designer muestra el signo de
intercalación, junto con la flecha que señala al símbolo de anclaje para indicarte que te
encuentras cerca.
www.magix.es
 Trabajar con textos 217

Grupos suaves (soft groups, en inglés)

Puedes pegar Grupos suaves (en la página 130) de la misma forma, aun cuando parte
de un grupo se encuentra en otra capa. Por ejemplo, los botones Web con efectos
mouse over o pop-up en otras capas, pueden anclarse de esta forma.

Eliminar un ancla
Para eliminar un ancla de un objeto, haz clic derecho y selecciona nuevamente
ANCLAR AL TEXTO para desactivar la opción. Ahora, cuando hagas clic en el objeto con
la HERRAMIENTA DE SELECCIÓN o en el texto en la HERRAMIENTA DE TEXTO, ya no verás
el símbolo de anclaje.

Gráficos incrustados
Puedes insertar un objeto en el texto para que se comporte igual que un carácter.
Simplemente copia el objeto al portapapeles ("Ctrl+C"), ve a la herramienta de texto,
coloca el cursor de texto en la posición en la que quieres insertar el objeto y pégalo
("Ctrl+V").

Puedes seleccionar, copiar, pegar y eliminar el objeto incrustado junto con el texto
que lo rodea, al igual que si fuera un carácter de texto. Sin embargo, también puedes
seleccionarlo y transformarlo con la herramienta de selección. Te recomendamos
utilizar esta técnica de incrustación en vez del anclaje, porque es más eficiente en
términos del proceso requerido para dar formato al texto.

Estilos de texto
Los ESTILOS DE TEXTO son una forma muy útil de modificar la apariencia del texto en
todo el documento con unos pocos clics.

Un ESTILO DE TEXTO es un conjunto con nombre de atributos, como fuente, tamaño,

color, espaciado y otras propiedades de texto. Por ejemplo, el encabezado principal al
comienzo de este documento puede tener un estilo llamado "Encabezado 1", el
subencabezado más pequeño, como el de esta sección, y todos los encabezados de
sección equivalentes, un estilo llamado "Encabezado 2"
218

Al actualizar la definición de "Encabezado 2", por ejemplo, a una fuente diferente,

todos los encabezados similares se actualizarán instantáneamente.

Lo mismo ocurre con el texto principal, que muchas veces se denomina "cuerpo de
texto", tiene un estilo en particular, que en Web Designer se llama "Texto normal". Al
actualizar ese estilo para que su fuente sea, por ejemplo, Times New Roman de 12
puntos, todo el "Texto normal" del documento puede cambiarse de una sola vez, sin
tener que seleccionar y aplicar el mismo cambio de fuente una y otra vez.

Los ESTILOS DE TEXTO serían, entonces, como la función "Colores con nombre" que
también es compatible con Web Designer, en la que puedes actualizar el "Color tema
1" a un nuevo color para que todas las partes del documento que utilicen ese color lo
cambien al nuevo.

Barra de información de estilos de texto

En la BARRA DE INFORMACIÓN DE LA HERRAMIENTA DE TEXTO hay un menú desplegable
de estilos que te permite crear estilos, aplicarlos a cualquier texto y actualizar la
definición del estilo.

Por defecto, hay un pequeño grupo de estilos predefinidos, incluyendo el "Texto normal" y tres
estilos de encabezado, del Encabezado 1 al 3.

Estilo de párrafo y estilo de carácter

Los ESTILOS DE TEXTO están disponibles en dos variedades. Los estilos de párrafo se
aplican a todo el apartado y también se utilizan para encabezados. No es posible
aplicar un estilo de párrafo a una sección más pequeña que un párrafo. Es decir, que
no puedes aplicar un estilo de párrafo a una sola palabra dentro de un apartado. Si lo
intentas, entonces todo el párrafo cambiará a este estilo.

Simplemente coloca el cursor de texto en cualquier lugar de la línea y selecciona un

estilo de párrafo del menú de estilos para que todo el párrafo cambie a ese estilo.

Por otra parte, los estilos de carácter pueden aplicarse a cualquier sección del texto,
incluso a un solo carácter. Por ejemplo, si quieres destacar algunas palabras de tu
texto con un color diferente, el estilo de carácter te vendría ideal. La ventaja es que

www.magix.es
 Trabajar con textos 219

puedes cambiar luego el color (o fuente, etc.) de todas estas palabras destacadas con
solo actualizar el estilo.

En los estilos de párrafo pueden definirse todos los atributos de texto, salvo las
propiedades de las listas numeradas o con viñetas. Los estilos de carácter solo
pueden definir atributos de texto que pueden aplicarse a un solo carácter, como
color de texto, tamaño y grosor de fuente, etc.

Actualización de los estilos de texto

Para actualizar una definición de estilo:
1. selecciona un poco de texto que tenga el estilo que quieres actualizar.
2. Aplica los cambios que deseas, como otra fuente o tamaño de fuente.
3. Selecciona "Actualizar estilo" del menú desplegable de estilos en la barra de
información de texto.

Por ejemplo, para cambiar todo el "Texto normal" a otra fuente, selecciona algunas
palabras del estilo "Texto normal", cambia la fuente (y cualquier otro atributo) y luego
selecciona "Actualizar estilo" "Texto normal" del menú de estilos de la barra de
información de la herramienta de texto.

Cuando tienes páginas de la variante RWD, se puede actualizar el estilo de texto para
una variante individual. Esto es útil, por ejemplo, cuando necesitas que el texto de una
variante de móvil sea más o menos grande o de una fuente diferente. Para actualizar
el estilo de una variante individual, cambia el texto como arriba y selecciona
ACTUALIZAR ESTILO EN ESTA VARIANTE del menú desplegable Estilo en la barra de
información Texto.

Ver Diseño de web adaptativo (en la página 294) para más información sobre
variantes.

Nota: cuando actualizas un estilo a partir de una selección de texto, el estilo

actualizado vuelve a aplicarse a la selección. Por lo tanto, si seleccionas algunos
caracteres de, por ejemplo, el Encabezado 1, cambias su color y luego actualizas el
estilo "Encabezado 1" todo el párrafo cambiará a este nuevo color (porque es un
estilo de párrafo y solo puede aplicarse a todo el apartado).

Estilos basados en otros estilos

En Web Designer, puedes crear un estilo a partir de otro. Supongamos que deseas
otra variante del estilo de Encabezado 2 que sea idéntico, pero con otro color; deberás
crear un nuevo estilo a partir del "Encabezado 2" en el diálogo CREAR ESTILO. Esto
significa que si actualizas el "Encabezado 2" para que, por ejemplo, tenga una nueva
fuente o tamaño, el nuevo estilo también tendrá la nueva fuente o tamaño.
220

Los nuevos estilos de carácter se basan normalmente en el "Estilo de párrafo

subyacente", pero solo con los cambios que deseas. Por lo tanto, esto significa que si
aplicas un estilo de carácter que solo establece el color de texto a una palabra, y luego
alteras el estilo del párrafo, esta palabra cambiará para adaptarse a excepción de su
color.

Creación de nuevos estilos

Para crear un estilo completamente nuevo, selecciona alguna parte del texto al que
quieras aplicar el estilo, escoge el menú CREAR ESTILO del menú desplegable de estilos
o de la BARRA DE INFORMACIÓN DE LA HERRAMIENTA DE TEXTO.

Si deseas crear un nuevo estilo de párrafo, te recomendamos seleccionar y aplicar los

cambios a todo un apartado, antes de seleccionar la opción del menú CREAR ESTILO.

Este diálogo muestra un nuevo estilo, (NuevoEstilo2) que se crea como ESTILO DE
PÁRRAFO , a partir del estilo ENCABEZADO 2 ya existente. La opción PÁRRAFO SIGUIENTE
determina el estilo que se utilizará cuando comiences a escribir el próximo apartado.

La sección inferior del diálogo muestra la definición completa de este estilo. En este
caso, puedes ver que se basa en el Encabezado 2, con solo un cambio de color.

Para crear un estilo que no se base en ningún otro estilo, es decir, que no herede
ningún atributo de otro estilo, selecciona (Sin estilo) de la opción "Basado en:" tal
como se muestra a continuación.

www.magix.es
 Trabajar con textos 221

El diálogo muestra que estoy creando un NuevoEstilo2 que es un estilo de párrafo y

que no me estoy basando en ningún otro estilo. Esta sección inferior enumera todos
los atributos que crean este estilo; en el ejemplo puedes ver que utilicé la fuente
Palatino, de 12 píxeles y que he aplicado sangría. Los otros atributos listados aquí
también se han tomado del texto seleccionado, es decir, que este estilo consiste en
una definición completa con una lista de todo el texto posible. En este caso, al
introducir texto en este estilo, el "Párrafo siguiente" (es decir, cuando pulses Intro)
tendrá el mismo estilo.

Eliminación de estilos: los estilos que no se utilizan en ningún lugar de un

documento se eliminan automáticamente al guardar y volver a cargar el documento.
Sin embargo, los estilos por defecto (texto normal y los encabezados de 1 a 3) no se
eliminan jamás.

Eliminación de estilos
La lista de ESTILOS en el menú ESTILOS incluye la entrada SIN ESTILO. Si seleccionas
esta opción, el estilo (de párrafo o de carácter) se quitará de la selección y el texto
regresará al formato por defecto.

Propiedades de estilo
Si quieres cambiar la definición de un estilo, como el estilo en el que se basa, o
simplemente mirar su definición, puedes usar la opción PROPIEDADES… del menú de
estilos. Necesitas seleccionar texto que tenga un estilo aplicado antes de hacerlo a fin
de indicar el texto que deseas editar. Aparecerá el diálogo PROPIEDADES DE ESTILO,
que tiene el mismo aspecto que el diálogo CREAR ESTILO.

La descripción del estilo en la parte inferior del diálogo describe las diferencias
respecto al estilo en que se basa. Por lo tanto, si deseas ver todos los atributos del
estilo, selecciona temporalmente SIN ESTILO en la listaBASADO EN para ver una
descripción completa. No olvides restablecerlo el estilo correcto en BASADO EN o
hacer clic para cancelar el diálogo si no quieres cambiar el estilo.
222

Aplicar estilos de texto

Cambiar el tamaño de fuente
Existen diversas formas de cambiar el tamaño de la fuente:

• Introduce un nuevo valor en el campo de texto de tamaño de la barra de

información y pulsa .
• O selecciona una opción de la lista desplegable TAMAÑO DE FUENTE en la barra
de información.
• O utiliza la barra deslizante emergente de tamaño de fuente (en la página 194).
• O aumenta/disminuye el tamaño de fuente con Ctrl++> y Ctrl++<. Esta
opción se aplica solamente si todas las partes de texto seleccionadas tienen el
mismo tamaño de fuente.
• O utiliza la herramienta de SELECCIÓN para cambiar el tamaño de todo el objeto
de texto.

Negrita y cursiva
Haz clic sobre el botón NEGRITA o CURSIVA de la barra de información
("Ctrl + B" o "Ctrl + I")

Esta opción aplica la variante negrita o cursiva de la fuente actual.

Subrayado de texto
Haz clic en el botón de subrayar en la barra de información para subrayar el
texto seleccionado. El color de subrayado y el tamaño deriva
automáticamente del color y tamaño del texto.

Justificación o alineación de texto

La justificación siempre se aplica a toda la línea. Cualquier región seleccionada se
ignorará.

Justificación IZQUIERDA: el borde izquierdo del texto se alinea a la posición inicial

de clic.
Justificación CENTRAL : centra el texto alrededor de la posición de clic.
Justificación DERECHA: el borde derecho del texto se alinea a la posición inicial de
clic.
Justificación COMPLETA: esto sólo se aplica cuando el texto sigue a una curva o
se encuentra en una columna y cuando haya al menos una línea completa de
texto para justificar.
www.magix.es
 Trabajar con textos 223

Al usar texto simple la posición inicial de clic de la página se toma como origen de
la justificación de texto.

Superíndice y subíndice
Haz clic en el botón apropiado sobre la BARRA DE INFORMACIÓN .
superíndice
Texto normal subíndice

Agregar y quitar sangrías

Agregar sangría a un párrafo de texto.

Quitar sangría a un párrafo de texto.

Lista con viñetas

Puedes convertir cualquier texto en una lista con viñetas si seleccionas el texto
y luego escoges el botón de lista con viñetas de la barra de información.

Cada párrafo de texto se convierte en una viñeta independiente. Si pulsas "Intro" al

finalizar una línea al final de la viñeta, la próxima línea también comenzará con una
viñeta. Para finalizar la lista con viñetas, pulsa Intro al final de la última viñeta y luego
vuelve a pulsar Intro en la nueva línea con viñeta. Esto elimina la última línea con
viñeta y te permite comenzar a introducir texto normal nuevamente.

Puedes incluir listas con viñetas secundarias si pulsas el botón de sangría de la

barra de información. Esta sangría crea una línea con viñeta y cambia el estilo
de la viñeta para diferenciarla de la principal.

Ejemplo de una lista de viñetas secundaria

224

Para mover un punto de viñeta desde la lista secundaria hasta la principal,

simplemente coloca el texto del cursor en la línea y pulsa el botón para quitar
sangría.
Por lo tanto, realizar arreglos en las listas de viñetas es fácil con los botones para
agregar y quitar sangrías.

Lista numerada
Puedes crear y editar listas numeradas de la misma forma que se ha descrito
para las listas con viñetas pero con el botón de listas numeradas.

Puedes escoger el esquema numerado que se utiliza para cada lista con el diálogo de
PROPIEDADES DE LISTA . Coloca el cursor de texto en uno de los puntos de la lista
numerada, haz clic derecho y escoge PROPIEDADES DE LISTA... del menú contextual.

En el diálogo puedes escoger entre una variedad de esquemas de numeración y

también introducir el valor que debe utilizarse en la primera entrada de la lista. Luego,
el número se aumentará automáticamente para las siguientes entradas de la lista.

Lista con viñetas y números con gráficos

Puedes usar cualquier gráfico para las viñetas o números de una lista. Puedes diseñar
listas con tus propias viñetas o números con las herramientas de dibujo o texto, o bien
con los diseños de viñetas de la galería de diseños (en ELEMENTOS DE PÁGINA>
ELEMENTOS GRÁFICOS > VIÑETAS ). Por ejemplo, puedes crear un círculo simple con la
herramienta de elipse, rellenarlo, aplicarle una sombra y copiarlo en el portapapeles.
Luego destaca con la herramienta de texto la lista a la que quieres aplicar el estilo.
Haz clic derecho sobre la lista y escoge Pegar como viñeta del menú. El diseño
aparecerá como una viñeta para cada entrada de la lista.

www.magix.es
 Trabajar con textos 225

En el caso de una lista numerada, el procedimiento es el mismo, salvo que agrupas un

elemento de texto con tu gráfico y luego escoges Pegar como número para sustituir
los números o elementos de texto de tu lista. El objeto de texto en el grupo se utiliza
para mostrar el número.

Espaciado de línea
El espaciado de línea te permite cambiar el espacio entre dos
líneas (afecta el espaciado vertical).

El espaciado de línea se mide en porcentajes (120%) o puntos (12pt). Puedes

introducir el valor de espacio de línea en el campo de texto o hacer clic sobre las
flechas para desplazar los valores.

La configuración de porcentajes tiene como beneficio de que cambia de tamaño si

cambias el tamaño de la fuente. Si se aplica un porcentaje a una línea de texto con
varios tamaños de fuente, se utilizará el tamaño más grande. Por ejemplo, si una línea
contiene texto 90% y 100%, el espaciado de línea se calculará a partir del 100%.

Espaciado de párrafos
Los dos últimos campos de la barra de información de la herramienta
de texto te permiten configurar el espacio antes y después de los
párrafos.

Esto es particularmente útil cuando quieres configurar espacios de media línea entre
los párrafos.

Al igual que en Microsoft Word, cuando utilizas el espaciado arriba y abajo de los
párrafos, el espaciado es el valor mayor entre ambos (no se acumula). El espaciado
arriba del párrafo moverá el primer párrafo hacia abajo en un marco de texto.
226

Enlaces de texto
Puedes aplicar un enlace en cualquier parte de un objeto de texto de modo que
cuando el documento se exporte como HTML el texto aparezca en los navegadores
web como un enlace sobre el cual se puede hacer clic.

Utiliza la HERRAMIENTA DE TEXTO para seleccionar las palabras o los caracteres

que desees aplicar al enlace y luego haz clic en el botón de enlace en la barra de
herramientas de WEB .

Esto abre el diálogo de PROPIEDADES WEB con la pestaña ENLACE seleccionada. En esta
pestaña puedes elegir si quieres vincular un URL, otra página de tu sitio web o incluso
una capa popup.

Por defecto, cuando aplicas un enlace a una parte de texto, el texto aparece
subrayado y con el color de enlace de texto definido para el documento actual.
Puedes cambiar el color del enlace, estando los enlaces subrayados o no, en la
pestaña PÁGINA WEB del diálogo de PROPIEDADES WEB (menú HERRAMIENTAS-
>PROPIEDADES WEB ). Asimismo puedes fijar el color que aparece cuando el usuario
mueve el cursor del ratón por encima de un enlace de texto en un navegador web
("Colores MouseOver"), y el "Color visitado", el cual se usa para visualizar que los
usuarios ya han visitado dicho enlace con su navegador web.

Para fijar los tres colores globales de los enlaces de texto, o bien puedes seleccionar
los colores con nombre (original) ya existentes que utilizaste en tu página web
usando las listas desplegables, o bien puedes hacer clic en el botón EDITAR para abrir
el EDITOR DE COLOR mediante el cual puedes elegir el color que quieras.

Asimismo, si fuera necesario también puedes sobrescribir los colores globales de los
enlaces de texto para enlaces individuales. En la pestaña de enlaces del diálogo de las
propiedades web, deselecciona la opción "Utilizar los colores de enlace de página web
usuales". A continuación el enlace seleccionado adoptará el color de texto que fijaste
en el documento, en lugar del color global del enlace de texto.

Texto dentro de grupos para páginas web

Al exportar un documento como página web, todos los grupos serán exportados
como imágenes. De este modo, ningún texto dentro de un grupo podrá ser
seleccionado y copiado como texto por un visitante de tu página web.

Esto suele ser apropiado para botones gráficos, títulos, logotipos, etc., ya que el texto
forma parte del gráfico. Sin embargo puede que tengas más piezas de texto
importantes dentro de grupos que desees mantener como texto en tu página web
exportada. Para hacer esto, solo tienes que aplicar el nombre especial "Texto HTML"
a tu objeto de texto. La forma más fácil de hacer esto se explica a continuación:

www.magix.es
 Trabajar con textos 227

1. Escoge la HERRAMIENTA DE TEXTO y haz clic en el texto para insertar el cursor de

texto.
2. Pulsa Esc para seleccionar todo el objeto de texto.
3. Abre el diálogo de nombre ("HERRAMIENTAS" > "NOMBRES..." ).
4. O bien selecciona el nombre de “TEXTO HTML ” de la lista desplegable “APLICAR
NOMBRE " si ya lo has utilizado en el documento actual, o bien teclea el nombre
de "Texto HTML". A continuación haz clic en “AÑADIR” para añadir el nombre.

Ahora, cuando exportes tu página web, tu texto permanecerá como texto y el resto
del grupo se convertirá en imagen. Todos los paneles de texto suministrados por la
GALERÍA DE DISEÑOS ya han aplicado este nombre a los objetos de texto dentro de los
mismos, por lo que el texto de los paneles se exportará como texto.

Los navegadores no pueden renderizar texto con rotación, por lo que no puedes
utilizar este nombre para forzar que el texto con rotación sea exportado como texto.
En este caso, el nombre se ignora.

Copiar estilos de texto

Es fácil copiar el estilo de cualquier texto a otra región de texto utilizando la opción
PEGAR ATRIBUTOS :

• Selecciona la región fuente cuyo estilo quieres copiar. Esto puede ser también
una sola palabra (sólo haz doble clic).
• Selecciona Edición > Copia (o Ctrl+C).
• Selecciona la región de texto a la que quieres aplicar el estilo.
• Selecciona Edición > Pegar atributos (Ctrl + Majús + A).

Si el cursor de texto se encuentra posicionado en algún texto cuando PEGAS

ATRIBUTOS , los atributos del párrafo se pegarán a este otro (p.ej. tabulaciones,
márgenes). Si has seleccionado una región de texto, entonces PEGAR ATRIBUTOS
insertará todos los atributos visuales del texto fuente.

Aplicar atributos a historias de texto completas

Si el cursor se encuentra en un objeto simple o una columna de texto, Esc
seleccionará todo el objeto de texto. Puedes aplicar un atributo, por ejemplo, un color,
y todo el objeto de texto se modificará. Esto es con frecuencia más rápido que realizar
seleccionar todo (Ctlr+A).

Con las áreas de texto este método sólo funciona si se han seleccionado todas las
áreas de texto. Puedes hacer esto en la herramienta de SELECCIÓN con un clic y ń+clic
sobre las diferentes áreas de texto para seleccionarlas. Pero este método sólo es
posible si las áreas de texto se encuentran en una sola página. Si tu historia de texto
fluye por diferentes páginas y quieres cambiar todo el texto, entonces será necesario
Seleccionar todo (Ctrl+A) y después aplicar los atributos deseados.
228

Copiar / Pegar texto con formato (RTF)

Puedes copiar texto con formato desde otras aplicaciones como editores o
procesadores de texto y copiarlo en MAGIX Web Designer 10 Premium como texto y
las fuentes, márgenes y espaciado de líneas se conservarán. Esto facilita la posibilidad
de conservar el estilo y apariencia de tu texto.

Cuando pegas texto en formato Rich Text (RFT) desde otras aplicaciones se te da la
opción de pegar el texto como "texto sin formato" lo que significa que aparecerá en la
fuente y estilo del cursor donde pegas o como Rich Text lo que significa que se
conservará el estilo del texto fuente.

Esto también funciona al revés. Puedes copiar texto de Web Designer y pegarlo en
otras aplicaciones compatibles con Rich Text y el estilo (fuente, tamaño, colores,
márgenes, etc.) se conservará. Esto funciona solamente si copias de un objeto de
texto simple o de un único texto fluido.

Algunas aplicaciones, como Microsoft Word, tienen una opción del menú que provee
una amplia gama de opciones de pegado. Estas aplicaciones te permiten muchas
veces escoger el formato del objeto pegado (texto o gráfico).

Visualizar fuentes utilizadas

Muchas veces es útil obtener un resumen de las fuentes utilizadas en el documento,
especialmente si quieres compartir el documento con otros usuarios de Web
Designer que no tienen las fuentes instaladas.

Encontrarás una lista completa de las fuentes utilizadas en "Archivo" > "Propiedades
del documento".

Todas las fuentes que no estén instaladas pero se estén utilizando en el documento,
estarán señaladas con "NO INSTALADA" .

Si quieres enviar el documento a otro usuario que no tiene instaladas las fuentes
utilizadas pero que tampoco tiene que editar el texto, entonces puedes convertir el
texto en formas editables (lee a continuación).

Incrustación de fuentes en el documento

MAGIX Web Designer 10 Premium guarda las formas de caracteres de todas las
fuentes usadas en tu documento. Esto significa que si pasas tu archivo de diseño a
otra persona o transfieres el archivo a otro equipo, el texto seguirá teniendo la misma
apariencia, incluso si las fuentes correctas no están instaladas.

www.magix.es
 Trabajar con textos 229

Incrustación de fuentes en un sitio web

La mayoría de los documentos de sitios web utilizan únicamente fuentes compatibles
con la web, que son fuentes que están instaladas en la mayoría de los equipos y otros
dispositivos, de forma que pueden utilizarse sin inconvenientes en cualquier página
web. Sin embargo, puedes utilizar casi cualquier fuente en un sitio web, puesto que
Web Designer publicará automáticamente la fuente en tu sitio de forma que el texto
aparezca correctamente en todos los equipos, independientemente de si está
instalada o no.

Para ayudar a tu página a cargar de manera más rápida, tan solo se incluyen
caracteres Western en la fuente incrustada, a menos que tu documento use otro tipo
de caracteres también.

Cuando exportas o realizas una vista previa de un documento que utiliza fuentes que
no son compatibles con la Web, Web Designer emitirá un aviso con la lista de fuentes
que se incrustarán en tu página web. Esta característica te recordará que tu sitio
incluye fuentes incrustadas.

Algunas fuentes no permiten la incrustación en un documento ni en una página web.

Web Designer detecta estas fuentes y emite una alerta independiente si intentas
utilizar estas fuentes en un documento de sitio web. En este caso, deberías cambiar a
otra fuente que sea compatible con la Web, una fuente Google o alguna que permita
la incrustación, aunque puedes continuar y publicar tu documento con la fuente
restringida si estás seguro de que utilizas la fuente de acuerdo con los términos de su
licencia (por ejemplo, en una página web que sea para uso propio).

Compatibilidad entre el navegador y el texto

Es una pena que los diferentes navegadores visualicen el mismo texto ligeramente
diferente, por lo general con una pequeña diferencia de tamaño o longitud de línea.
Así, el texto 10pt, por ejemplo, no se visualiza con el tamaño 10pt sino con tamaño de
píxel más próximo (13 píxeles).

MAGIX Web Designer 10 Premium ha sido diseñado para emular el comportamiento

de los navegadores más comunes ajustando los tamaños intermedios a píxeles
enteros y ajustando las longitudes de línea para emular al máximo el texto en
navegadores de Windows. Puedes desactivar este ajuste en el diálogo OPCIONES , en la
pestaña GENERAL (haz clic derecho y selecciona OPCIONES DE PÁGINA o selecciona
OPCIONES del menú HERRAMIENTAS ) desactivando la opción "MOSTRAR LONGITUDES
DE TEXTO COMPATIBLES CON WINDOWS ".

Nota para usuarios avanzados: si utilizas MAGIX Web Designer 10 Premium o

desactivas esta opción de compatibilidad, cuando introduzcas un tamaño
intermedio, por ejemplo 13,6 píxeles ó 10pt, obtendrás el texto exactamente con ese
230
mismo tamaño. Pero te advertimos que la mayoría de los navegadores web
visualizarán este texto con un tamaño ligeramente mayor o menor al que se ve en
MAGIX Web Designer 10 Premium.

La segunda consecuencia del (mal) comportamiento de este navegador es que en el

caso de las fuentes pequeñas se produce un gran salto de un tamaño al siguiente. Por
lo tanto, si deseas un tamaño de fuente, por ejemplo entre 9pix y 10pix, no podrás
obtenerlo. La mayoría de los navegadores no pueden visualizar un tamaño intermedio
(tanto si usas puntos, ems o cualquier otro tipo de unidad). Por lo tanto verás cómo
los tamaños de texto de MAGIX Web Designer 10 Premium saltan de un tamaño a
otro tamaño cuando cambies el tamaño de los objetos de texto.

www.magix.es
 La herramienta de relleno 231

La herramienta de relleno

Crear un relleno de color con gradación

El proceso de creación de un relleno diferente es casi igual para todos los tipos
de relleno:
1. Selecciona el objeto o los objetos a los que quieres aplicar el relleno.
2. Selecciona la herramienta de RELLENO ("G")
3. Selecciona el tipo de relleno del menú desplegable.
4. Haz clic y arrastra hasta el objeto para crear el relleno. O arrastra uno de los
controles deslizantes de relleno para ajustar el tamaño y posición del relleno

MAGIX Web Designer 10 Premium suministra una vista previa interactiva del relleno
a medida que arrastras.

Mientras arrastras, aparecerá una flecha de

relleno que indica la dirección del relleno. Los
controles deslizantes se pueden seleccionar y
arrastrar para ajustar la posición y el ángulo
del relleno.

Relleno de colores
Selecciona uno de los controles deslizantes de relleno y haz clic sobre un color de la
LÍNEA DE COLORES o abre el EDITOR DE COLOR y elige un nuevo color. Puedes pulsar
"Tab" para cambiar entre los controles deslizantes de relleno.

Tipos de relleno
Web Designer dispone de estos tipos de relleno de color:

RELLENO LISO : la forma recibe un color o tono parejo en toda la

superficie.

RELLENO LINEAL : el color cambia gradualmente de un color a

otro.

RELLENO CIRCULAR : el color cambia a partir de un punto en

forma circular.
232

RELLENO ELÍPTICO : similar al relleno circular, salvo que el cambio

se realiza en forma elíptica.

RELLENO CÓNICO : el cambio de color gira alrededor de un punto.

El efecto es de un cono iluminado desde un lado con el lado
opuesto con otro color.
RELLENO DE ROMBOS : similar al relleno elíptico, solo que el
relleno son como rombos.

RELLENO DE TRES COLORES : muestra tres colores diferentes,

como si hubiera luces iluminando el objeto.

RELLENO DE CUATRO COLORES : lo mismo que el relleno de tres

colores, pero con cuatro colores.

RELLENO DE MAPA DE BITS : el objeto se rellena con una o más

copias de un mapa de bits o foto. Todas las fotos que ves en
MAGIX Web Designer 10 Premium son formas con relleno de
mapa bits (por lo general rectángulos, por supuesto). Puedes
utilizar cualquier foto o cualquier mapa de bits de las galerías de
MAPAS DE BITS o RELLENOS .

NUBES FRACTALES : produce un relleno aleatorio con parches que

es especialmente útil para nubes y neblina.

PLASMA FRACTAL : un relleno aleatorio de parches que presenta

un mayor contraste que el relleno de nubes fractales.

La herramienta de RELLENOS te permite aplicar estos tipos de relleno a los objetos

seleccionados, así como editar y ajustar los rellenos.

Seleccionar dentro automáticamente

En la herramienta de relleno, se aplica automáticamente la opción "Seleccionar
dentro" si haces clic sobre un objeto, es decir, que se selecciona parte de un grupo en
vez del grupo como un todo. Esto facilitará tu trabajo con fotos y rellenos dentro de
grupos. Si quieres cambiar el atributo de relleno de un grupo (que no es muy
probable) necesitas seleccionar el grupo utilizando la HERRAMIENTA DE SELECCIÓN .

www.magix.es
 La herramienta de relleno 233

Barra de información de herramienta de relleno

Tipo de relleno
Segmentación de relleno
Efecto de relleno
Nombre de mapa de bits
Perfil
Control deslizante/resolución de relleno
Color/grano del control deslizante

TIPO DE RELLENO selecciona el tipo de relleno. Si seleccionas de este menú:

• con un objeto seleccionado, aplica el relleno al objeto
• sin un objeto seleccionado, establece el actual tipo de relleno, el cual se usa para
objetos nuevos dibujados.

SEGMENTACIÓN DE RELLENO se utiliza al aplicar mapas de bits y rellenos fractales. Las

opciones se describen más adelante en los rellenos de mapas de bits. La
segmentación de relleno cambia la repetición del efecto de relleno. Las opciones son:
• Simple: el relleno se utiliza una sola vez, independientemente del tamaño del
objeto.
• Repetir/Mosaico repetido: el efecto se repite hasta llenar todo el objeto.
• Invertir mosaico repetido: sólo disponible en rellenos fractales y de mapas de
bits. Esto es similar al mosaico repetido, pero uno de cada dos mosaicos está
invertido.

Las opciones de segmentación de

relleno no están disponibles para los
rellenos cónicos. Todos los otros
tipos de relleno pueden repetirse.
Esto puede producir efectos muy
útiles.

Un relleno elíptico con repetición dentro de una

forma de elipse

El EFECTO DE RELLENO se utiliza para todos los tipos de rellenos, con excepción de los
rellenos de 3 y 4 colores. Controla el desvanecimiento del relleno desde el color de
inicio al color de fin:
234

• TRANSICIÓN (FADE) :crea una transición entre dos colores de forma lineal.
• ARCO IRIS :
realiza una transición siguiendo el borde más corto del modelo de
color HSV. Por ejemplo, una transición de amarillo a cian será amarillo-verde-
cian.

Esta opción no tiene efecto alguno cuando los dos colores son negro, blanco y gris.

• ALT ARCO IRIS : similar a la opción arco iris salvo que la transición se realiza
siguiendo el borde más extenso de la rueda de color. Por ejemplo, la transición
de amarillo a cian será amarillo-rojo-magenta-azul-cian.

El NOMBRE DE MAPA DE BITS muestra un menú desplegable con vistas en miniatura de

todos los mapas de bits de la GALERÍA DE MAPAS DE BITS y es una forma sencilla de
seleccionar el mapa de bits que necesitas para rellenarlo.

Con el PERFIL DE RELLENO puedes determinar la graduación de la "transición de color"

desde el comienzo y hasta el fin del relleno. Esto se aplica a todos los tipos de relleno,
excepto a los rellenos lisos, los de tres y cuatro colores y los rellenos de mapa de bits
(al menos que sea un mapa de bits con un color de tono continuo). Para cambiar el
perfil de un relleno:
1. Selecciona el objeto con relleno.
2. En la barra de información de la HERRAMIENTA DE RELLENO haz clic en PERFIL . Esto
abrirá el cuadro de diálogo de PERFIL .
3. Selecciona un perfil predefinido de la lista desplegable o arrastra los
deslizadores para crear un perfil personalizado. La opción superior en la lista
desplegable (la línea directa) crea una transición lineal entre el comienzo y el fin
del relleno.

Aquí se ven tres tipos distintos de rellenos con escala de grises con sus correspondientes cuadros
de diálogos de perfil. El del centro, que viene por defecto, es una transición lineal de negro a
negro.

www.magix.es
 La herramienta de relleno 235

CONTROL DESLIZANTE DE RELLENO : indica si el control deslizante de inicio o fin está

seleccionado. Este campo queda en blanco para rellenos lisos.

RESOLUCIÓN (sólo rellenos de mapas de bits y fractales): muestra la resolución del

mapa de bits (siempre que no hayas seleccionado un control deslizante de relleno).
Puedes introducir una nueva resolución para cambiar el tamaño del mapa de bits. Las
resoluciones bajas muestran los píxeles individuales del mapa de bits. Muy pocas
veces se necesita una resolución mayor que 150 DPI, incluso para utilización de
tipografía.

COLOR DE CONTROL DESLIZANTE DE RELLENO (excepto el relleno de mapas de bits):

indica el color aplicado al control deslizante de relleno seleccionado.

Rellenos lisos
Para aplicar o cambiar un relleno liso:
1. Selecciona un relleno liso del menú de tipos de relleno.
2. Elige un color de LÍNEA DE COLORES .

La línea de colores se describe en Manejo de colores (en la página 174).

Rellenos lineales
Así se utilizan los rellenos lineales:

1. Escoge "Relleno lineal" del menú. (No es necesario si el relleno contiene una
relleno de un color).
2. Coloca el cursor del ratón en el lugar donde debe comenzar el relleno. (Esto
también puede ser fuera del objeto).
3. Arrastra el cursor hasta la posición de fin del relleno. (También puede
encontrarse fuera del objeto).

La flecha que se dibujará sobre el objeto seleccionado, se denomina flecha de relleno.

Esta flecha muestra la dirección y el alcance de la gradación del relleno. Ambos
extremos de la flecha pueden marcarse con un clic.
236

Desplazamiento de los controles de inicio y fin de un

relleno
Modificación de la dirección y el tamaño de la gradación de un relleno:
1. Desplaza el cursor sobre el control deslizante que quieres mover. Al
encontrarse sobre el control deslizante, el aspecto del cursor cambiará.
2. Arrastra el control deslizante.

Cambiar colores de un relleno

Para cambiar el color de un relleno:
• Arrastra el color desde la LÍNEA DE COLORES hasta un control deslizante de
relleno (no es necesario que selecciones primero el control deslizante).
• O bien O arrastra el color hasta el objeto. Cada relleno tiene una línea central
imaginaria en la mitad de la flecha de relleno. Si sueltas el color sobre el control
deslizante de inicio, cambiará el color del control deslizante de inicio; mientras
que si lo sueltas sobre el control deslizante de fin, cambiará el color en el control
deslizante de fin.
• Si está seleccionado uno de los controles deslizantes (está señalado),
simplemente haz clic sobre un color.

La línea de colores se describe en Trabajar con colores (en la página 174).

Cada método cambia el color de un solo control deslizante; no se cambia ningún otro
control deslizante seleccionado, o:
1. Selecciona el control deslizante (o controles deslizantes, también funciona con
objetos múltiples) correspondiente.
2. Escoge el color deseado de la línea de colores.
3. Esto cambia todos los controles deslizantes de relleno seleccionados.

Rellenos circulares
Para los rellenos circulares, la aplicación del relleno,
movimiento de los controles deslizantes y el cambio de los
colores son iguales a los rellenos lineales. El control
deslizante de inicio es el centro del relleno.

Los rellenos circulares son útiles para crear efectos de sombras.

Cambiar el aspecto alto/ancho del objeto cambia automáticamente un relleno

circular a un relleno elíptico (ver a continuación).

Una forma rápida de aplicar un relleno circular:

• +arrastra para crear un relleno circular.
www.magix.es
 La herramienta de relleno 237

Rellenos elípticos
La aplicación de un relleno elíptico es similar a la aplicación
de rellenos lineales. A medida que arrastras el cursor del
ratón, creas un círculo con dos controles deslizantes de fin.
Después puedes arrastrar estos controles deslizantes para
crear una elipse adecuada.

+arrastrar conserva la relación de aspecto del relleno. Ctrl+arrastrar limita la

rotación a los ángulos de restricción configurados. El desplazamiento de controles
deslizantes y el cambio de colores es igual que para los rellenos lineales.

Rellenos de mapa de bits

Tipo de relleno
Segmentación de relleno
No utilizado
Nombre de mapa de bits
Resolución
No utilizado

La Galería de mapa de bits se describe en La galería de mapa de bits (en la página

324) en el capítulo Trabajar con fotos, para Galería de rellenos, lee más abajo (en la
página 242).

El relleno de mapas de bits es el tipo de relleno más impactante. Te permite utilizar

cualquier foto o textura como relleno de cualquier forma y te ofrece control directo
sobre el tamaño, ángulo, posición y mosaico. También puedes colorear los rellenos de
mapas de bits. Puedes utilizar cualquier tipo de mapas de bits, incluyendo fotos JPEG
y canal alfa (semi-transparentes).

Cuando importas un archivo de foto en MAGIX Web Designer 10 Premium (ej. un

archivo JPG o PNG) aparecerá como una forma con un tipo de relleno de mapa de
bits. Cuando un objeto de este tipo se selecciona en la línea de estado, se muestra
como una "foto", pero es lo mismo que una foto a la que se le ha aplicado un relleno
de mapa de bits.

Para rellenar o dar forma con un mapa de bits o relleno de foto, realiza uno de los
siguientes pasos:
238

• Arrastra un mapa de bits desde la GALERÍA DE MAPA DE BITS o desde el

explorador de Windows, manteniendo Shift presionada y soltando, o bien
• Arrastra un relleno desde la GALERÍA DE RELLENOS hasta una forma (en este caso,
no es necesario mantener Shift presionada antes de soltar)
• Selecciona "Mapa de bits" del menú desplegable de la izquierda de la BARRA DE
INFORMACIÓN de la HERRAMIENTA DE RELLENO , y luego selecciona el mapa de bits
requerido del menú desplegable de nombres de mapas de bits (solo muestra
mapas de bits que hayan sido cargados previamente).

Puedes rellenar un objeto con un mapa de bits o múltiples repeticiones del mapa de
bits.

Mosaico simple (foto) Mosaico repetido Repetir invertido: los mosaicos se

adaptan de forma perfecta.

El relleno tiene tres controles deslizantes. Para ello, utiliza Cambiar el tamaño y la
posición del relleno de mapa de bits (en la página 240). Una forma alternativa de
configurar el tamaño del mapa de bits es introducir la resolución en el campo de la
barra de información. Primero tienes que deshacer la selección de control deslizante
de relleno haciendo clic en cualquier parte de la imagen donde no haya un control
deslizante de relleno, y luego escribe una nueva resolución dpi.

Sustitución de los rellenos de mapa de bits

Si una forma ya contiene un mapa de bits, o es una foto, entonces solamente puedes
arrastrar y soltar un nuevo mapa de bits desde cualquier fuente, como el Explorador
de Windows, y se sustituirá el mapa de bits existente. La nueva imagen se adaptará a
la forma de forma exacta. Al hacer esto también se sustituirán las otras instancias de
la foto en la página actual si estas se encuentran en el mismo GRUPO SUAVE .

Si presionas SHIFT al sustituir una foto de esta forma, la posición, escala y rotación del
relleno de mapa de bits se conservará.

Coloreado de mapa de bits

Puedes colorear cualquier mapa de bits o relleno de foto pulsando simplemente sobre
un color en la LÍNEA DE COLOR (asegúrate de no haber seleccionado ningún control
deslizante de relleno, al hacer clic sobre la imagen). Esto creará un tono contínuo
(técnicamente tono dual) que fluctúa entre el negro y el color seleccionado. También
puedes hacer clic derecho en la línea de color y seleccionar 'ESTABLECER COLOR CLARO
DE TONO CONTINUO ' o bien 'ESTABLECER COLOR OSCURO DE TONO CONTINUO '.

www.magix.es
 La herramienta de relleno 239

Por ejemplo, para convertir una foto a blanco y negro, sólo necesitas hacer clic en el
color blanco de la línea de color.

Para cancelar cualquier color aplicado, escoge SIN COLOR

para cualquiera de los controles deslizantes. Esto restaura
el color original del mapa de bits.

El campo RESOLUCIÓN de la BARRA DE INFORMACIÓN muestra la resolución que puede

modificarse moviendo los controles deslizantes de relleno o introduciendo un valor.

Cambio del tamaño y la posición del relleno de mapa de

bits
Si pulsas Shift, haces clic y arrastras hasta una forma que ya contiene un relleno de
mapa de bits, se creará un nuevo relleno de mapa de bits cuyo centro se encontrará
en el punto del clic. Si mantienes pulsada la tecla Ctrl también, el ángulo se limitará,
de forma que te será más fácil crear un mapa de bits vertical.

Una vez que has creado el relleno, puedes arrastrar

hasta cualquier lugar de la imagen para reposicionar el
relleno dentro de la forma.

Al pasar el ratón sobre los controles deslizantes de

relleno exteriores, el cursor del ratón se convertirá en
un cursor de "rotación". Si arrastras los controles
deslizantes externos, el relleno de mapa de bits se
ampliará, pero manteniendo la relación de aspecto; si
pulsas "ñ" mientras arrastras, se cambiará el tamaño
vertical y el horizontal de forma independiente y el
relleno se doblará. La barra de información muestra la
resolución del relleno de mapa de bits (puedes ajustar
la resolución y, por lo tanto, el tamaño del mapa de
bits, introduciendo un nuevo valor).
240

Un ejemplo

Para rellenar la elipse de la izquierda con la foto central:

1. Arrastra la foto o archivo de mapa de bits desde el Explorador de Windows (o
desde la Galería de mapas de bits si ya se ha utilizado en el documento) hasta la
elipse y luego arrástrala mientras pulsas la tecla "Shift". La herramienta de
relleno se convertirá en la herramienta actual.
2. Ahora podrás ajustar el ángulo y tamaño de la imagen arrastrando los controles
deslizantes de relleno.

El ejemplo anterior tiene una sombra simple. Lee el capítulo sobre la herramienta de
sombras (en la página 253) para más información.

Relleno fractal
MAGIX Web Designer 10 Premium es compatible con dos tipos de rellenos fractales
que son modelos de relleno naturalistas creados matemáticamente. Son muy útiles
para simular el color del cielo, las nubes u otras texturas de la naturaleza.

Cada vez que creas un relleno fractal nuevo se crea un nuevo modelo. Para sustituir
un fractal existente por un modelo nuevo escoge uno del menú de relleno.

El control GRANO de la BARRA DE INFORMACIÓN te permite controlar la proporción de

granos del modelo. Los valores bajos resultan en un modelo suave, mientras que los
valores altos dan modelos con granos más marcados.

Puedes ajustar el tamaño y posición del relleno fractal arrastrando y ajustando los
controles deslizantes de relleno. Deselecciona los controles deslizantes de relleno
(clic sobre el relleno fuera de los controles) para ver los controles de resolución y
granos.
www.magix.es
 La herramienta de relleno 241

Relleno fractal con nubes. A la izquierda con valor de grano 1, a la derecha con valor de grano 50.

Relleno de plasma fractal. A la izquierda con valor de grano 5, a la derecha con valor de grano
50.

Nota la diferencia entre el grano y la resolución. El grano controla el flujo del modelo.
La resolución establece el tamaño del mapa de bits fractal y la impresión de los
píxeles individuales.

Puedes cambiar los colores de inicio y fin de un relleno fractal. Selecciona los
controles deslizantes centrales o externos y después aplica el color utilizando la línea
de colores o la galería de COLOR . Para cancelar el color aplicado, escoge Sin color.

Gradaciones de color de varios niveles

Muchos de los tipos de rellenos con gradación de color (lineal, circular, elíptico,
cónico, rombos) son compatibles con rellenos de gradación de varios niveles, lo que
significa que en vez de pasar de un color a otro, puede pasar por una cantidad de
niveles de color diferentes.

Para añadir un nuevo nivel de color a una graduación, selecciona la herramienta de

relleno para que se vea la flecha de relleno y después:
• Arrastra un color hasta el lugar correspondiente de la flecha de relleno.
• O haz doble clic sobre la flecha de relleno para crear un nuevo control de relleno
y después haz clic sobre un color o abre el EDITOR DE COLOR .

Puedes reposicionar los controles deslizantes de relleno simplemente arrastrándolos.

242

Si un control deslizante de relleno se encuentra seleccionado, pulsa Tab para

seleccionar el siguiente. Si el EDITOR DE COLOR está abierto, se actualizará para reflejar
el nuevo control deslizante de relleno

Para eliminar un control deslizante de nivel, selecciónalo con un clic y pulsa la tecla
Supr.

La galería de rellenos
La GALERÍA DE RELLENOS contiene texturas de mapas de bits que pueden utilizarse
para rellenos. Sólo cuando utilizas un relleno se copia en el documento.

Para ver la GALERÍA DE RELLENOS :

• Escoge HERRAMIENTAS > GALERÍAS > GALERÍA DE RELLENOS .
• O pulsa "+ F11".

IMPORTAR : importa el mapa de bits seleccionado en el documento. Una copia del

mapa de bits aparece en la GALERÍA DE MAPAS DE BITS . También puedes arrastrar y
soltar el mapa de bits hasta una parte en blanco de la página. Esto es en general más
fácil que hacer clic en IMPORTAR .

RELLENAR : importa y aplica el mapa de bits seleccionado como:

• Un relleno de mapa de bits en los objetos seleccionados (de existir).

www.magix.es
 La herramienta de relleno 243

• O, si ningún objeto es seleccionado, inserta el mapa de bits en el documento

como un nuevo objeto de foto.

También puedes arrastrar y soltar el mapa de bits hasta un objeto para aplicar un
relleno de mapa de bits.

Hay algunas diferencias entre arrastrar una mapa de bits desde la galería de MAPAS
DE BITS o la GALERÍA DE RELLENOS: al arrastrar mapas de bits desde la GALERÍA DE
RELLENOS y soltarlos sobre las formas para crear un relleno de mapa de bits, el
relleno tendrá mosaicos y el mapa de bits no tendrá la mejor adaptación posible
para la forma. Este comportamiento es diferente al que ocurre al arrastrar desde la
galería de mapa de bits porque en general las texturas se aplican desde la galería de
rellenos y normalmente tienen forma de mosaico y no adaptadas.

TRANSP : (transparencia) importa y aplica el mapa de bits seleccionado como:

• Un mapa de bits transparente al objeto seleccionado (de existir).

• O configura el atributo de transparencia actual.

OBTENER RELLENOS : descarga rellenos gratis de Xara.

FONDO : establece el relleno seleccionado como fondo de página.

ELIMINAR : borra el relleno o carpeta seleccionada.

RELLENO DE DISCO : añade nuevos rellenos de tu disco duro o un CD.

OPCIONES : te permite seleccionar el tamaño de los símbolos de vista previa y si se

debe mostrar información completa sobre el mapa de bits, así como buscar y ordenar
los rellenos.

DETENER DESCARGA : si tienes una conexión lenta y la descarga de Internet se demora,

puedes detener la descarga y continuarla más tarde.

Buscar y ordenar están descritos en el capítulo Trabajar con documentos (en la

página 94).

Trabajar con documentos (en la página 94) incluye información general sobre
galerías.
244

Transparencia
La herramienta de TRANSPARENCIA te permite determinar cuánto de los
colores y objetos subyacentes se podrán ver a través de un objeto.

Forma
Tipo de transparencia
Segmentación
Nombre de mapa de bits
Perfil
Control deslizante/Resolución
Cantidad de transparencia

Puedes controlar el nivel de transparencia desde completamente opaco a

completamente transparente. Web Designer, con su amplia gama de gradaciones de
transparencia, te ofrece más que otros paquetes de dibujo. Puedes aplicar
transparencia lisa o con gradación a todos los tipos de objeto, incluyendo mapas de
bits.

Algunos usos de la transparencia:

• Simular agua o vidrio.
• Si quieres que los objetos se desvanezcan en partes de objetos o se mezclen con
el fondo.
• Las transparencias de nubes o de niebla son especialmente óptimas para esto.
• Utilizando el tipo especial de transparencia puedes iluminar, oscurecer y aplicar
efectos especiales a objetos y fotos.
• Crear puntos iluminados o reflejos.

www.magix.es
 Transparencia 245

El parabrisas tiene múltiples objetos superpuestos con distintas transparencias. El

reflejo del centro es un blanco 100% opaco que se va desvaneciendo poco a poco de
forma elíptica.

Aplicar transparencia plana

Se llama transparencia "plana" porque todas las partes de los objetos tienen la misma
transparencia, a diferencia de la transparencia con gradación.
1. Selecciona el o los objetos.
2. Selecciona la herramienta de transparencia (shortcut F6)
3. Arrastra la barra deslizante de transparencia en la barra de información

MAGIX Web Designer 10 Premium suministra una vista previa en vivo. A medida que
arrastras la barra de transparencia, los objetos del documento se modifican para que
puedas ver el efecto inmediatamente.

Aplicar transparencia con gradación

La transparencia con gradación funciona de forma muy similar a los rellenos de color
(en la página 231) con gradación. Debes arrastrar sobre los objetos en la
HERRAMIENTA DE TRANSPARENCIA para crear una transparencia con gradación. Tienes
a disposición una gama similar de formas de transparencia: la más sencilla es la lineal,
pero también puedes utilizar transparencias circulares o elípticas:
1. Selecciona el o los objetos.
2. En la HERRAMIENTA DE TRANSPARENCIA , arrastra a lo largo de los objetos para
crear un desvanecimiento lineal a lo largo del objeto.
3. Selecciona formas de transparencia alternativas del menú desplegable de la
barra de información

Puedes seleccionar y ajustar la posición y la intensidad de transparencia utilizando los

controles deslizantes del objeto.

Lee Rellenos (en la página 231) para más información sobre cómo manipular los
controles deslizantes de relleno y las diferentes formas de relleno (en este caso,
formas de transparencia)

Transparencia con gradación de varios niveles

Del mismo modo que puedes añadir varios niveles a un relleno con gradación, puedes
hacer lo mismo con una transparencia con gradación. Esto te permite, por ejemplo,
aplicar una gradación desde opaco a transparencia de 50%, volver a transparencia de
25%, volver al opaco, etc.
246

Puedes definir el nivel de transparencia en cada nivel seleccionando un control

deslizante y ajustando la barra deslizante. Añade niveles adicionales haciendo doble
clic en la línea de transparencia con graduación.

Consulta el capítulo Rellenos (en la página 231) para más información sobre el uso de
controles deslizantes.

Tipos de transparencia
El tipo de transparencia más común, y el único que muchas otras aplicaciones
comprenden, se llama transparencia mezclada. Pero MAGIX Web Designer 10
Premium es compatible con diferentes tipos que afectan a los objetos de forma
diferente.

Web Designer tienes estos tipos de transparencia:

Mezcla
El color del objeto se mezcla con el color los objetos subyacentes. El efecto es similar
a distribuir una capa fina de color (o pintura) sobre los objetos subyacentes.

Vitral
El efecto es similar a ver los objetos subyacentes a través de un vidrio de color. Es
ideal para la simulación de cristal y para oscurecer objetos con criterio selectivo. El
color del objeto con vitral:
• Blanco: sin efecto en los colores de objetos subyacentes.
• Gris y negro: oscurecen los colores de objetos subyacentes.
• Otros colores: oscurecen colores subyacentes a un color saturado (rojo claro
sobre rojo claro se convierte en rojo medio: verde sobre rojo se convierte en
negro). Si quieres usar un objeto de color para oscurecer colores subyacentes,
puedes encontrar en OSCURECER un tipo de transparencia más fácil de usar.

Técnicamente, el proceso es sustractivo en el espacio de color RGB.

Blanqueador
El "blanqueador" no tiene ninguna analogía clara en el mundo físico. Es útil para crear
puntos destacados cuando la fuente de luz no es blanca. El color del objeto con
aplicación de blanqueador:
• Gris y blanco: aclaran los colores en objetos subyacentes.
• Negro: sin efecto en los colores de objetos subyacentes.
• Otros colores: aclaran colores subyacentes hacia un color no saturado. (Rojo
claro sobre rojo claro se convierte en rojo pálido: verde sobre rojo se convierte
en amarillo.) Si quieres usar un objeto de color para aclarar, pero sin cambiar el
color base de los colores subyacentes, puedes encontrar en ACLARAR un tipo de
transparencia fácil de usar.

www.magix.es
 Transparencia 247

Técnicamente, el proceso es aditivo en el espacio de color RGB.

Contraste
Generalmente se usa C en un objeto por separado para modificar el color de los
objetos subyacentes (es decir, usarías el objeto como filtro). Dependiendo del color
escogido, aumentará el contraste de los colores subyacentes (los aclarará o hará más
grises). El color del objeto con contraste:
• Gris (por debajo del 50 % de tinte negro) y Blanco: aumentan el contraste
(comprime la gama de colores) para hacer los colores subyacentes más
brillantes.
• Gris (por encima del 50% de tinte negro) y Negro: hacen que los colores
subyacentes sean más grisáceos (tendencia gris)
• Otros colores: convierten el color a la sombra equivalente de color gris. (el
amarillo da un color gris claro, el rojo un gris oscuro.) Entonces, aumenta o
disminuye el contraste de los objetos subyacentes.

Saturación
Generalmente se usa Saturación en un objeto por separado para modificar el color de
los objetos subyacentes (es decir, usarías el objeto como filtro). Dependiendo del
color escogido, esta opción aclarará o hará más grises los colores de los objetos
subyacentes. El color del objeto con aplicación de saturación:
• Gris (por debajo del 50 % de tinte negro) y Blanco: aumenta la saturación en los
colores de los objetos subyacentes haciéndolos más puros.
• Gris (por encima del 50% de tinte negro) y Negro: disminuyen la saturación
(coloración) hacia el negro.
• Otros colores: convierten el color a la sombra equivalente de color gris. (el
amarillo da un color gris claro, el rojo un gris oscuro.) Entonces, aumenta o
disminuye la saturación de color de los objetos subyacentes.

Oscurecer/Aclarar
Oscurecer/Aclarar es ideal para oscurecer o aclarar objetos subyacentes.
Generalmente se usa en un objeto por separado para modificar el color de los objetos
subyacentes (es decir, usarías el objeto como filtro). Oscurecer/Aclarar son versiones
en escala de grises del tipo de transparencias vitral/blanqueador. El color del objeto
con oscurecer/aclarar:
• Blanco: sin efecto en los colores de objetos subyacentes.
• Gris y negro: oscurecen/aclaran los colores de objetos subyacentes.
• Otros colores: convierten el color a la sombra equivalente de color gris. (el
amarillo da un color gris claro, el rojo un gris oscuro.) Entonces, se
oscurecen/aclaran los colores de los objetos subyacentes.

Brillo
Dependiendo del color escogido, Brillo aclarará u oscurecerá los colores de los objetos
subyacentes. El color del objeto con brillo:
248

• Gris (por debajo del 50 % de tinte negro) y Blanco: aclaran los colores de los
objetos subyacentes. El blanco tiene mayor efecto.
• Gris (por encima del 50 % de tinte negro) y Negro: oscurecen los colores de los
objetos subyacentes. El negro tiene mayor efecto.
• Otros colores: convierten el color a la sombra equivalente de color gris. (el
amarillo da un color gris claro, el rojo un gris oscuro.) Entonces, se aclaran u
oscurecen los colores de los objetos subyacentes.

Luminosidad
Luminosidad utiliza la escala de grises equivalente al color para controlar la
luminosidad (o valor) de los objetos subyacentes. Nota que la luminosidad no tiene
efecto sobre los objetos subyacentes grises, blancos ni negros. El color del objeto con
luminosidad:
• Gris y blanco: aumentan la luminosidad de los colores en objetos subyacentes.
El blanco tiene el mejor efecto, produciendo un color saturado.
• Negro: permanece como un objeto negro.
• Otros colores: convierten el color a la sombra equivalente de color gris. (el
amarillo da un color gris claro, el rojo un gris oscuro.) Entonces, aumenta la
luminosidad de los objetos subyacentes.

Tono
Es útil para el desplazamiento de color de los objetos subyacentes. Su acción es más
fácil de comprender si se usa el modelo de color HSV. El color del objeto con
aplicación de tono:
• Gris, Blanco, y Negro: sin efecto. Estos colores están en el centro de la rueda de
colores y por eso no poseen tono.
• Si el color subyacente es gris, blanco o negro: el tipo de transparencia de tono
queda sin efecto.
• Otros colores: reemplazan el tono de los objetos subyacentes por el tono de ese
objeto. Utiliza la saturación y el valor del color subyacente.

Para más información sobre HSV, consulta Manejo de colores (en la página 174).

Para todas estas opciones, la barra deslizante controla la cantidad de transparencia

desde opaco (transparencia 0%) hasta completamente transparente (100%).

Al aplicar una transparencia plana al objeto también se aplica una transparencia a la

línea alrededor del objeto. No es posible configurar diferentes transparencias, pero
puedes eliminar la línea con la opción sin color o seleccionando el ancho de contorno
"ninguno". Para crear un objeto con un relleno transparente y una línea no
transparente, utiliza un tipo de transparencia no plana.

Para más información sobre colores, por favor, lee Manejo de colores (en la página
174).

www.magix.es
 Transparencia 249

Optimizar
Lee Optimizar a continuación para más información sobre esta transparencia.

Optimizar
La transparencia mejorada te permite modificar cualquier parte de tu diseño con la
herramienta Optimizar foto como si fuera una fotografía. Por ejemplo, puedes dibujar
una forma en cualquier parte de tu diseño, aplicar la transparencia y luego ajustar el
brillo del área del diseño que esté cubierta con la forma.

Aplicación de la transparencia mejorada

Para aplicar la transparencia mejorada:
1. Dibuja o selecciona la forma a la que quieres aplicar el efecto de transparencia
mejorada.
2. Ve a la herramienta de Transparencia y selecciona "MEJORADA" de la lista de
TIPOS DE TRANSPARENCIA en la barra de información.
3. La forma parece haber desaparecido de tu página. Esto es porque está aplicando
mejoras a lo que se encuentre debajo de ella. Por defecto, todos los atributos
están fijados de forma que no haya cambios visuales aplicados, por lo que la
forma no tiene ningún efecto y no puedes verla. De todas formas, debería estar
seleccionada.
250

4. Cambia a la herramienta de mejora de foto. Aumenta el brillo con el control de la

barra de información. Ahora puedes ver que el área cubierta por tu forma tiene
más brillo en comparación con el área fuera de la forma.
5. Puedes ajustar el brillo, contraste, saturación y temperatura.
6. Mueve tu forma o transfórmala y los cambios se aplicarán al área debajo de la
forma.

En general también querrás aplicar difuminación con la Herramienta de difuminación

para suavizar los bordes de la forma y mezclarla con el diseño.

Edición de foto con "Transparencia mejorada"

Si aplicas la transparencia mejorada tal como se describe arriba, la forma permanece
como un objeto independiente y no está vinculada con ninguna foto ni otro objeto del
diseño (salvo que la agrupes de forma manual con otros objetos). Como
generalmente querrás utilizar este efecto para editar fotos, hay una forma mejor de
utilizar la transparencia mejorada para trabajar con fotos.

Para aplicar "Transparencia mejorada" sobre una parte de una foto:

1. Selecciona la foto.
2. Selecciona una de las herramientas de dibujo de máscaras de la barra
desplegable de máscaras y marca el perfil del área de la foto que quieres
modificar.
3. Invierte ahora la máscara para que el área que trazaste se convierta en un área
sin máscara. Para ello, haz clic en INVERTIR MÁSCARA en la barra de información
o también sobre el icono invertir máscara de la barra de herramientas de
máscara desplegable.
4. A continuación, ve a HERRAMIENTA DE MEJORA DE FOTO y comienza a modificar la
foto con los controles de la barra de información.

La forma de máscara invertida se convertirá en una forma con la transparencia

mejorada aplicada. La forma también se agrupa con la foto para formar un Grupo de
foto (en la página 320). Esto significa que a medida que te mueves o transformes la
foto, las formas mejoradas se mueven o transforman con ella. La forma mejorada está
vinculada con los bordes de la foto.

Para más información sobre el uso de la transparencia mejorada en fotos, consulta el

capítulo Herramienta de foto.

Ten en cuenta que no puedes aplicar el efecto de nitidez a los objetos con
transparencia mejorada, salvo que estén aplicados como parte de un grupo de foto,
tal como se describe más arriba.

www.magix.es
 Transparencia 251

Perfil
Puedes ajustar el "gradación de la transición de color" entre el comienzo y el fin de las
transparencias. Esto se aplica a todas las distintas graduaciones de transparencia
excepto a las de tres y cuatro puntos (en dónde esta opción no está disponible).

Para cambiar el perfil de una transparencia:

1. Selecciona el objeto.
2. En la barra de información de la herramienta de TRANSPARENCIA , haz clic en
PERFIL . Esto abrirá el cuadro de diálogo de PERFIL .
3. Selecciona un perfil predefinido de la lista desplegable o arrastra los
deslizadores para crear un perfil personalizado. La opción superior en la lista
desplegable (la línea recta) crea una transición lineal entre el comienzo y el fin
de la transparencia.

Mapas de bits
Las galerías de mapas de bits y rellenos se describen en el capítulo Trabajar con
mapas de bits (en la página 318).

Cuando seleccionas un tipo de transparencia de MAPA DE BITS , se utiliza un mapa de

bits por defecto. Haz clic en NOMBRE DE MAPA DE BITS en la barra de información de
transparencia o utiliza las galerías de mapas de bits o rellenos para cambiar el mapa
de bits utilizado. (Clic sobre el botón TRANSP en la galería o arrastrar y soltar desde la
galería).

Por defecto, los colores más claros de un mapa de bits son los más transparentes.
(Por supuesto, puedes modificar la cantidad relativa de transparencia
posteriormente).

Control deslizante / resolución

Si has seleccionado un control deslizante, este campo te indica cuál es. Si no hay
ningún control deslizante seleccionado y se está utilizando una transparencia de
mapa de bits, controla el DPI.
252

Aplicar transparencia a varios objetos

Si agrupas objetos y aplicas transparencia, todo el grupo será tratado como un objeto
y la transparencia se aplicará a todo el grupo. Sin embargo, si los objetos no están
agrupados y aplicas transparencia, cada objeto individual recibirá una transparencia
por separado y obtendrás un efecto diferente si los objetos están superpuestos.

Transparencia individual (izquierda) o transparencia de grupo (derecha)

Mezclar transparencias individuales y de grupo

Puedes combinar los métodos descritos anteriormente para crear combinaciones
complejas de transparencia. Por ejemplo, puedes aplicar un 50% de transparencia a
un objeto, después agruparlo y aplicar también transparencia al grupo. También
puedes aplicar primero transparencia al grupo y después aplicar atributos a objetos
individuales dentro de un grupo. Simplemente pulsa Ctrl, haz clic sobre el objeto y
cambia sus atributos.

www.magix.es
 Sombras 253

Sombras

La herramienta de sombra
La herramienta de SOMBRA (shortcut Ctrl+F2) te permite aplicar, eliminar y
modificar sombras semitransparentes (o "suaves").

Sin sombra
Tipos de sombras
Nitidez de la sombra
Transparencia de la sombra
Posición de la sombra

MAGIX Web Designer 10 Premium tiene tres tipos de sombras:

• Pared (Wall): la sombra se proyecta detrás del objeto.
• Suelo (Floor): el objeto parece estar parado verticalmente sobre una superficie.

Brillo (Glow): la sombra se utiliza para añadir un efecto de halo alrededor del objeto

La transparencia de sombras suaves aumenta hacia los bordes, lo que le otorga un

efecto muy realista. Las sombras tienen su propia resolución y puedes modificar su
tamaño sin pérdida de calidad.

Aplicar una sombra

Aplicar una sombra de pared
Para aplicar una sombra de pared:

1. Selecciona el objeto.
2. Escoge la herramienta de SOMBRA .
254

3. Selecciona el botón PARED de la barra de información de la

herramienta de SOMBRA.
4. Puedes arrastrar la sombra desde o hacia el objeto para
crear más o menos distancia entre el objeto y la pared
imaginaria.

Como alternativa para crear una sombra de pared:

1. Selecciona el objeto.
2. Escoge la herramienta de SOMBRA.
3. Arrastra desde el centro del objeto en dirección a la sombra.

Aplicar una sombra de suelo

1. Selecciona el objeto.
2. Escoge la herramienta de SOMBRA .
3. Selecciona el botón SUELO de la barra de
información de la herramienta de SOMBRA.
4. Arrastra hacia o desde el objeto para cambiar el
tamaño o la dirección radial. El ángulo puede tener
hasta 70°.

Aplicar un efecto de resplandor

Añadir un resplandor o halo detrás de un objeto puede crear gráficos muy
asombrosos.

Para crear un efecto de resplandor:

1. Selecciona el objeto.
2. Escoge la herramienta de SOMBRA .
3. Selecciona el botón RESPLANDOR de la barra de
información de la herramienta de SOMBRA.
4. Arrastra hacia o desde el objeto para cambiar el
tamaño del resplandor.

www.magix.es
 Sombras 255

Desenfocar los bordes de la sombra

Esto cambia el tamaño de la sombra. Un
desenfoque leve otorga el efecto de una fuente
de luz fuerte, un desenfoque mayor, una fuente
de luz difusa o distante. Se recomienda que las
sombras siempre estén desenfocadas
levemente, puesto que es más realista.

Para desenfocar los bordes de la sombra:

1. Selecciona el objeto
2. Escoge la herramienta de SOMBRA.
3. En la barra de información de la herramienta de SOMBRA, arrastra la barra
deslizante o introduce un valor en el campo de texto de la derecha.

Cambiar la transparencia de la sombra

Una sombra semitransparente es más
realista que una sombra sólida. Pero
puedes cambiar el nivel de transparencia
de la sombra para adaptarla a tus
necesidades.

Para cambiar la transparencia:

1. Selecciona el objeto
2. Escoge la herramienta de SOMBRA.
3. En la barra de información de la herramienta de SOMBRA, arrastra la barra
deslizante de transparencia o introduce un valor en el campo de texto de la
derecha.

Cambiar el color de sombra o el efecto de

relleno
Después de aplicar una sombra a un objeto, puedes cambiar el color de la sombra o el
efecto de relleno. Puedes aplicar cualquiera de los efectos de color de MAGIX Web
Designer 10 Premium incluyendo rellenos multinivel. Cómo cambiar el color de la
sombra:
256

Para más información sobre colores y la línea de colores lee el capítulo Trabajar con
colores (en la página 174).

• La forma más fácil es arrastrar y soltar un color desde la línea de color hasta la
sombra. (Asegúrate de soltar el color sobre la sombra y no sobre el objeto.)
• Como alternativa, tienes a disposición este método un poco más complejo pero
que te permite el control absoluto sobre el color:
1. Selecciona la sombra utilizando la herramienta de SELECCIÓN . (Asegúrate de
seleccionar la sombra y no el objeto).
2. Utiliza el EDITOR DE COLOR para editar el color.

Eliminar una sombra

Para eliminar una sombra suave:
1. Selecciona el objeto
2. Escoge la herramienta de SOMBRA.
3. Selecciona el botón SIN SOMBRA de la barra de
información de la herramienta de SOMBRA.

Aplicar una sombra a varios objetos

El resultado de aplicar una sombra depende de la agrupación de los objetos:
• Si los objetos están agrupados, las sombras superpuestas se fusionan (no se
oscurecen al superponerse).
• Si los objetos no están agrupados, cada objeto recibirá una sombra individual.
Las partes superpuestas de las sombras se verán más oscuras.
• Si has seleccionado varios objetos con sombra, los cambios se aplicarán a todas
las sombras.

Selección de objetos con ayuda de la

herramienta de sombras
Antes de colocar una sombra a un objeto debes marcarlo. La forma usual de
seleccionar un objeto es a través de la herramienta de SELECCIÓN . Sin embargo,
también puedes utilizar la herramienta de SOMBRAS para marcar un objeto con un
simple clic.
www.magix.es
 Sombras 257

Copiar sombras a otros objetos

Una vez que una sombra se ve de la forma que deseas, puedes copiarla a otros
objetos utilizando la opción PEGAR FORMATO/ATRIBUTOS . Simplemente copia el
objeto que tiene la sombra (EDICIÓN > COPIAR ), selecciona el objeto o los objetos a los
que quieres pegarle la sombra y escoge EDICIÓN > PEGAR FORMATO/ATRIBUTOS .
258

Biseles

La herramienta de bisel
La herramienta de BISEL (shortcut Ctrl+F3) da a los objetos una apariencia de
profundidad en vez de que parezcan planos sobre la página.

Los biseles tienen su propia resolución, por lo que puedes modificar su tamaño sin
perder calidad.

Tipo de bisel
Lista de tipo de barra deslizante
Valor numérico y de barra deslizante para el parámetro seleccionado
Bisel externo
Bisel interno
Estilo de unión

Puedes aplicar biseles a casi todos los tipos de objetos. Las excepciones son:
• Partes de bloques de texto (como una sola letra): el bisel se aplica a todo el
texto.
• A la curva seguida por un texto.
• Objetos con contorno
• Efectos en vivo (el bisel se aplicará al objeto antes de aplicar el efecto, si el
efecto es en vivo o a la caja circundante del efecto si el efecto está bloqueado).

Aplicar un bisel
Para aplicar un bisel a un solo objeto:
1. Selecciona el objeto
2. Escoge la herramienta de BISEL .
3. Escoge la forma de bisel de la lista TIPO DE BISEL . La opción NINGUNO elimina
todos los biseles aplicados.

Aplicar un bisel a varios objetos

El resultado de un bisel sobre varios objetos, depende de la agrupación de los objetos:
• Si los objetos están agrupados, los biseles que se superponen se fusionan. El
color de bisel es el mismo al del objeto trasero.
www.magix.es
 Biseles 259

• Si los objetos no están agrupados, cada objeto recibirá un bisel individual. El

color de bisel es el mismo al del objeto.

Modificar un bisel
Puedes cambiar el ángulo y elevación de la luz y cambiar la forma, dirección y tamaño
del borde del bisel.

Dirección del bisel

Los biseles pueden encontrarse dentro o fuera del objeto. Los biseles externos hacen
los objetos más grandes, mientras que los biseles internos no cambian el tamaño del
objeto. Para cambiar la dirección del bisel.
1. Selecciona el objeto.
2. Haz clic en el botón INTERNO o EXTERNO.

Cambiar la fuente de luz del bisel

El efecto de bisel se crea con una luz que brilla a lo ancho del objeto y que ilumina la
forma (perfil) del bisel. Puedes cambiar la dirección y la altura de la luz, así como su
intensidad (contraste).

Cambiar el ángulo de luz (dirección horizontal):

1. Selecciona el objeto.
2. Arrastra la flecha para cambiar la posición de la fuente de luz.

No puedes mover el centro de la flecha, sino solamente la punta

de la flecha.

Para establecer un ángulo preciso, selecciona ÁNGULO DE LUZ de la lista TIPO DE

BARRA DESLIZANTE . Y después arrastra la barra o introduce un valor en el campo de
texto.
260

Si has seleccionado varios objetos con bisel, el ángulo de luz se cambiará para todos
los biseles. Si arrastras la flecha, se cambiará sólo el bisel (o biseles) de la flecha.

Cambiar la intensidad de la luz (contraste)

Para cambiar la intensidad de la luz:
1. Selecciona el objeto.
2. Selecciona CONTRASTE de la lista TIPO DE BARRA DESLIZANTE . Y después arrastra
la barra o introduce un valor en el campo de texto.

Si has seleccionado varios objetos con bisel, los cambios se aplicarán a todos los bise-
les. Los colores utilizados en el bisel afectan el contraste. Por ejemplo, los colores
fuertes (saturados) requieren más contraste que los colores débiles para obtener el
mismo efecto. Para mejor resultados, es posible que debas ajustar el contraste para
cada objeto.

Cambiar la elevación de la luz (ángulo vertical)

Esto te permite mover la luz desde cualquier posición arriba del objeto (90) hasta el
costado del objeto (0).
1. Selecciona el objeto.
2. Selecciona ELEVACIÓN DE LA LUZ de la lista TIPO DE BARRA DESLIZANTE . Después
arrastra la barra o introduce un valor en el campo de texto.

Para obtener biseles redondeados se recomienda una elevación de luz de 30. Con
este ángulo, el bisel se mezcla suavemente con el objeto.

Cambiar el tamaño del bisel

Cómo cambiar el tamaño del bisel:
1. Selecciona el objeto.
2. Arrastra cualquiera de las flechas externas para extender el
bisel.
Como alternativa:
1. Selecciona el objeto.
2. Selecciona TAMAÑO de la lista TIPO DE BARRA DESLIZANTE .
3. Después arrastra la barra o introduce un valor en el campo de texto.

www.magix.es
 Biseles 261

Cambiar la forma del bisel

1. Selecciona el objeto
2. Escoge la herramienta de BISEL .
3. Escoge la forma de bisel de la lista TIPO DE BISEL .

Cambiar el color del bisel o el efecto de relleno

Después de aplicar un bisel a un objeto, puedes cambiar su color o el efecto de
relleno. Puedes aplicar cualquiera de los efectos de color de MAGIX Web Designer 10
Premium incluyendo rellenos multinivel.

Para más información sobre colores y la línea de colores lee el capítulo Trabajar con
colores (en la página 174).

Cómo cambiar el color del bisel:

• La forma más fácil es arrastrar y soltar un color desde la línea de color hasta el
bisel. (Asegúrate de soltar el color sobre el bisel y no sobre el objeto.)

Como alternativa, tienes a disposición este método un poco más complejo pero que
te permite el control absoluto sobre el color:
1. Selecciona el bisel utilizando la herramienta de SELECCIÓN . (Asegúrate de
seleccionar el bisel y no el objeto).
2. Utiliza el EDITOR DE COLOR para editar el color.

Cambiar el estilo de unión del bisel

Después de aplicar un bisel a
un objeto, puedes cambiar la
forma de las esquinas
(uniones).

Cómo cambiar el estilo de la unión de bisel:

1. Selecciona el objeto.
2. Haz clic sobre el botón de unión apropiado en la barra de información de la
herramienta de BISEL .

Miter Redondo Bisel

262

Eliminar un bisel
Para eliminar un bisel:
1. Selecciona el/los objeto/s cuyo bisel quieres eliminar.
2. Escoge la herramienta de BISEL .

Escoge NINGUNO de la lista TIPO DE BISEL .

www.magix.es
 Máscaras 263

Máscaras
En MAGIX Web Designer 10 Premium las herramientas de máscara no se muestran
en la barra de herramientas principal al inicio. Si quieres usar estas herramientas,
puedes encontrarlas en la paleta de botones.

Para abrir el botón paleta selecciona BARRAS DE CONTROL ... del menú VENTANA y
desplázate por la lista hasta la parte inferior. Ahora haz clic en la casilla al lado del
icono de "Botón paleta". (O haz clic derecho sobre un área vacía o cualquier barra de
botones y elige "Botón paleta" del menú popup).

Si quieres usar estas herramientas a menudo puedes moverlas desde el "Botón

paleta" arrastrándolas hasta la barra de herramientas. (Mantén pulsada la tecla
"Alt", luego arrastra el botón y suéltalo sobre la barra de herramientas sobre alguno
de los iconos existentes).

Crear una máscara

En Web Designer se utiliza una máscara para proteger parte de una foto de una
posible distorsión. Por ejemplo, cuando se usa la herramienta de ESCALA BASADA EN
EL CONTENIDO/ ZOOM para extender o ampliar una foto, a veces quieres proteger
parte de la foto para evitar que se distorsione con la operación. Utiliza una máscara
para marcar el área a proteger.

Para crear una máscara selecciona una de las herramientas de máscara de la barra
desplegable de herramientas de máscara y úsala para pintar una máscara rosa sobre
tu foto en las partes que quieres proteger. Para ello, el PINCEL DE MÁSCARA (la primera
herramienta de la barra desplegable) es normalmente la herramienta más útil.

Las áreas enmascaradas muestran un relleno de color rosa y tienen un efecto de

"hormigas en marcha" alrededor del borde. Cualquier parte de los objetos cubierta por
el área rosa será protegida cuando se lleve a cabo una operación compatible con la
máscara.

La herramienta de máscaras
Las herramientas para el dibujo de máscaras están en la barra de herramientas
de máscaras desplegable.

La barra de herramientas de máscara desplegable.

264

La HERRAMIENTA PINCEL DE MÁSCARA es la herramienta de máscara por

defecto y te permite "pintar" sobre el área que quieres ocultar. Elige un
tamaño de pluma de la barra de información y crea una forma de máscara
pasándola sobre el objeto. Si mantienes presionada la tecla "Shift" a la vez
que el botón izquierdo del ratón podrás borrar partes de la máscara.
Usa la herramienta de máscara a mano alzada para dibujar formas cerradas
alrededor de las áreas u objetos que quieres ocultar igual que lo harías con un
lápiz. Como las herramientas de mano alzada y pincel, también la barra de
información tiene un control suavizado y puedes mantener la tecla "Shift"
para borrar tu línea mientras dibujas.
La herramienta MÁSCARA DE RECTÁNGULO te permite arrastrar un área de
máscara rectangular. Puedes modificar tu forma usando la configuración de
ancho y alto de la barra de información.
Usa el botón MOSTRAR MÁSCARA para activar y desactivar la máscara.

El botón INVERTIR MÁSCARA invierte el área enmascarada de forma que las

zonas no enmascaradas se ocultan y viceversa.

Usa el botón ELIMINAR MÁSCARA para quitar el efecto en todas las formas.

Tanto la función INVERTIR MÁSCARA como la de ELIMINAR MÁSCARA aparecen

también en la barra de información.

Para más información sobre la característica de control suavizado consulta en la

herramienta Mano alzada y pincel.

Editar máscara.
En la mayoría de los casos editas la máscara usando las mismas herramientas de
máscara descritas arriba. Pero las formas que conforman una máscara son en realidad
formas normales colocadas en una capa especial de máscara, por lo que en algunos
casos puede ser útil editar formas sobre ella. Utiliza la GALERÍA DE PÁGINA Y CAPA
para acceder a la capa de máscara. Te será útil para los más finos detalles de las
formas de máscaras o si quieres mover una máscara de posición o incluso para crear
una máscara suave.
1. Haz clic en la herramienta de selección y abre la galería de páginas y capas.
2. Haz clic en la capa de máscara para activarla.
3. Selecciona la forma de máscara que quieras modificar y cámbiala de posición o
tamaño como necesites.
4. Haz doble clic en la forma para editarla usando la HERRAMIENTA DE FORMA . O
bien, si has creado la forma usando la herramienta de máscara de rectángulo, un
doble clic te permitirá la edición con la HERRAMIENTA DE RECTÁNGULO. (EN LA
PÁGINA 165)

www.magix.es
 Máscaras 265

Máscaras suaves
Una máscara suave es una máscara que incluye una variedad de niveles de máscaras,
en vez de consistir simplemente en partes con y sin máscara. Por ejemplo, una parte
de una imagen pueden tener aplicada un 50% de máscara de forma que la operación
que se aplique luego tenga únicamente el 50% de efecto en esa parte. O una forma
de máscara puede tener una máscara graduada que abarque de 0% a 100%. Si se
utiliza después esa máscara con la HERRAMIENTA DE OPTIMIZACIÓN DE FOTO para dar
más brillo a la imagen, el efecto tendrá esa misma graduación.

Crear una máscara suave

Puedes crear máscaras suaves si aplicas la herramienta de transparencia a tus formas
de máscaras en la capa de máscaras.

Crea en primer lugar las formas de máscara.

• Cambia a la herramienta de selección y abre la galería de páginas y capas.
• Extiende la página para ver las capas y haz clic en la capa de máscara para
activarla.
• Haz clic sobre la forma de máscara en el espacio de trabajo y selecciona la
herramienta de transparencia.
• Arrastra por la forma de máscara para crear una máscara suave graduada lineal.

Operaciones que utilizan la máscara

Cortar, copiar, eliminar
Estas operaciones son útiles cuando se utilizan junto con máscaras para cortar trozos
de fotos, pero también puedes usarlas con cualquier objeto.
1. Selecciona una de las herramientas de máscara de la barra desplegable de
HERRAMIENTA DE MÁSCARA y dibuja la forma de máscara que desees.
2. A continuación, cambia a la HERRAMIENTA DE SELECCIÓN y selecciona el dibujo o
foto que deseas editar
3. Selecciona ahora una de las opciones del menú EDICIÓN para realizar cualquier
operación de cortar/copiar/pegar.
266

La máscara rectangular se usa para crear una máscara (izquierda). Cortar o borrar quita las
partes no enmascaradas de la foto (derecha).

En el ejemplo de la izquierda, la máscara se ha invertido. Ahora, cuando cortes o elimines, el área

de máscara en rosa está protegida y todo lo demás se eliminará.

Duplicar, clonar
Esto copiará solamente las partes no en máscara del dibujo o foto. La opción Clonar
coloca una copia exactamente sobre el original.

Modificación de tamaño de foto con contenido

Para proteger parte de una foto ante cambios de escala:
1. Selecciona una de las herramientas de máscara de la barra de herramientas de
máscara desplegable y dibuja la forma de máscara que desees alrededor del
área que quieres proteger.
2. Ahora ve a la herramienta "Cambio de tamaño teniendo en cuenta el contenido"
(barra desplegable de herramientas de foto en la barra de herramientas
principal) y haz clic sobre la foto.

Consulta la función Cambio de tamaño teniendo en cuenta el contenido (en la

página 358) para más información.

www.magix.es
 Máscaras 267

Herramienta de optimización de foto

Utiliza una máscara para aplicar brillo, contraste, saturación, temperatura o
enfoque/desenfoque a cualquier parte de una foto.
1. Selecciona una de las herramientas de máscara de la barra de herramientas de
máscara desplegable y dibuja la forma de máscara que desees alrededor del
área que quieres proteger.
2. Ahora ve a la herramienta de optimización de foto (barra de herramientas de
foto desplegable sobre la barra de herramientas principal) y haz clic sobre la
foto.
3. Usa los "Controles de optimización" de la barra de información de la
herramienta de fotos.

Los usuarios avanzados quizá quieran usar máscaras suaves para introducir efectos
graduados en la operación de optimización de foto. Consulta los capítulos
Herramienta de fotos y Manejo de fotos para más información.

Combinar formas
El menú "ARREGLO" > "COMBINAR FORMAS" contiene una serie de funciones que te
permiten combinar las formas de múltiples maneras. Estas operaciones funcionan con
la máscara.

Por ejemplo, recorta una parte de una foto (cookie estilo cúter).
1. Selecciona una de las herramientas de máscara de la barra desplegable de
herramientas de máscara y pinta cualquier forma de máscara que necesites.
2. Cambia a la herramienta de selección y escoge el dibujo o foto que quieres
segmentar.
3. Selecciona "ARREGLO" > "COMBINAR FORMAS" > "SEGMENTAR" .

Copiar formas a la capa de máscara

Puede que prefieras dibujar formas de máscara usando las herramientas de dibujo
normales en lugar de las de máscara, o incluso usar una forma existente de la capa de
máscara. Resulta particularmente útil cuando trabajas con máscaras suaves, donde
estás aplicando niveles o transparencias sobre los objetos de máscara. En la
"Herramienta de selección", elige la forma y copia o córtala. Ahora cambia a una de
las herramientas de máscara y haz PEGAR . Utiliza PEGAR EN EL LUGAR si deseas que la
forma aparezca exactamente en el mismo lugar desde el cual se copió o cortó.

Para copiar las formas desde la capa de máscara hasta cualquier otra, haz la inversa.
Selecciona las formas mientras estés en una herramienta de máscara, luego cambia a
la HERRAMIENTA DE SELECCIÓN , y pega.
268

Diálogo de propiedades web

El diálogo de propiedades web es un diálogo con múltiples pestañas que te permite
añadir y configurar la mayoría de las características relacionas con la web en MAGIX
Web Designer 10 Premium y fijar diferentes propiedades web en objetos, páginas y en
toda tu página web. Para abrirlo, haz clic derecho sobre un objeto y escoge
PROPIEDADES WEB o utiliza la opción del menú "HERRAMIENTAS" > "PROPIEDADES
WEB…" (shortcut Ctrl + Shift + W).

También puedes acceder a cada pestaña del diálogo con los botones de la barra
desplegable de propiedades web, disponible en la barra de herramientas de página
web.

Pestaña Enlace
Pestaña Página web
Pestaña Página
Pestaña Imagen
Pestaña MouseOver
Pestaña Marcador de posición
Pestaña Publicar
Pestaña Analytics (en la página 293)
Editar barra de navegación

El diálogo carece de modo así que puedes dejarlo abierto mientras seleccionas
diferentes páginas y objetos en tu documento. Así es más rápido y fácil configurar las
propiedades de diferentes objetos y páginas en tu página web. Utiliza el botón
ACEPTAR para aplicar tus cambios y cerrar el diálogo, o bien utiliza el botón APLICAR
para aplicar tus cambios sin cerrar.

Ten en cuenta que si tu documento actual es un diseño de animación, el diálogo

PROPIEDADES WEB aparece de forma modificada con algunos controles diferentes y
muchos otros desactivados porque no se aplican a las animaciones. Lee el capítulo
sobre Animaciones para informarte sobre cómo usar este diálogo con diseños de
animación.

Las siguientes secciones abarcan cada una de las pestañas correspondientes.

www.magix.es
 Diálogo de propiedades web 269

Pestaña Enlace

La configuración de esta pestaña se aplica al objeto, a los objetos o al texto

seleccionados. Por lo general, esta pestaña se utiliza para añadir un enlace a un objeto
en tu página web (por ejemplo un botón o una foto), o bien para añadir texto de modo
que cuando un usuario visita tu página y hace clic en el objeto/texto, es remitido a
otra página. Puedes agregar enlaces a otras páginas de tu sitio web, a una dirección
URL o a una ventana emergente.

También puedes aplicar efectos de transición a los enlaces, de forma que la página de
destino del enlace (ya sea externa o una de las páginas de tu sitio) aparezca con la
transición que selecciones. Las transiciones para los enlaces solo pueden utilizarse
cuando en enlace se abre en una nueva página, de lo contrario, estarán desactivadas.
270

Para agregar un enlace a algunas palabras de un párrafo, ve a la HERRAMIENTA DE

TEXTO y selecciona el texto al que quieras agregar el enlace. A continuación configura
el enlace en esta pestaña.

La sección principal de esta pestaña te permite escoger qué debe ocurrir cuando se
hace clic en el objeto o texto seleccionado.

Enlazar a una dirección web

Para vincular esta dirección, introduce una dirección web. Si mantienes seleccionado
el recuadro "CORREGIR DIRECCIÓN AUTOMÁTICAMENTE ", tu dirección, en caso
necesario, se ajustará si haces clic en OK o Aplicar. Por ejemplo, si entras a
"www.xara.com", lo corregirá a "http://www.xara.com/".

Puedes poner en el campo de la dirección del enlace una dirección de correo

electrónico y así, al hacer clic en el enlace, se abrirá el programa de correo electrónico
del usuario con el campo Para: rellenado. Asimismo, puedes especificar la línea del
asunto, agregar direcciones de correo electrónico CC o CCO para copiarlas en el
correo electrónico, o incluso especificar el cuerpo de texto estándar que deseas
utilizar. tunombre@elsitioquequieras.com asunto:correo electrónico de la página web
cc:otro@elsitioquequieras.com coo:yotromas@elsitioquequieras.com cuerpo:correo
electrónico autogenerado

Nota técnica: MAGIX Web Designer 10 Premium codifica tu dirección de correo

electrónico para reducir las probabilidades de que robots de correo basura
encuentren tu correo electrónico de la página web. Esto requiere que Javascript esté
permitido en el navegador (actualmente > 95%) de los navegadores).

Enlazar a...
Selecciona esta opción si deseas enlazar a otra página en el sitio web actual o, si estás
creando una presentación, si quieres incluir un enlace al paso siguiente o previo de la
presentación. La lista desplegable te permite seleccionar la página o el paso al que
deseas enlazar. También puedes escoger esta opción para enlazar a un objeto al
borde superior de la página (se crea un salto rápido desde el final de una larga página
hasta el inicio).

CONSEJO: si tu documento de sitio web tiene varias páginas, asignar a cada una un
nombre facilita la configuración y mantenimiento de los enlaces de tu página porque
la lista de páginas contendrá los nombres de las páginas y no solo "Página 2",
"Página 3", etc.

Consulta la sección PESTAÑA PÁGINA (en la página 278) a continuación para

más detalles sobre cómo configurar los nombres de página o editar los
nombres en la GALERÍA DE PÁGINAS Y CAPAS .

www.magix.es
 Diálogo de propiedades web 271

Además de una entrada para cada página en tu sitio, la lista desplegable también
contiene entradas especiales PRÓXIMA PÁGINA/PASO DE PRESENTACIÓN, PÁGINA
ANTERIOR/PASO DE PRESENTACIÓN y PARTE SUPERIOR DE PÁGINA .

Página anterior/Próxima página

Utilízalo para agregar un enlace hacia una página anterior o posterior de tu sitio web.
En el caso de enlaces de este tipo, el orden de las páginas se establece según el orden
de página que aparece en MAGIX Web Designer 10 Premium. La opción "siguiente"
en la última página configura un enlace a la primera página y la opción "anterior" en la
primera página, a la última.

Paso de presentación anterior/siguiente

Utiliza esta opción para agregar un enlace que te lleve al paso siguiente o anterior de
la presentación, si tu sitio web es una presentación. El orden de la presentación
también está determinado por el orden de los pasos tal como aparecen en MAGIX
Web Designer 10 Premium, al igual que "página anterior/siguiente".

Parte superior de la página

Si quieres enlazar a la parte superior de una página particularmente larga, crea un

objeto al final de la página (por lo general un objeto de texto o un botón) y selecciona
entonces la opción para enlazar "PARTE SUPERIOR DE LA PÁGINA" . El enlace te llevará
directamente a la parte superior de la página.

Enlazar a una referencia

Esta opción te permite hacer que el usuario salte a una parte específica de cualquier
página de tu sitio web.

Para configurar un punto de referencia, primero ve a la página y determina hacia

dónde quieres que lleve el enlace. Selecciona el objeto y agrega un nombre con un clic
derecho y la opción NOMBRES... . A continuación selecciona el objeto para el cual
quieres crear el enlace y escoge en la lista suministrada por la opción "Enlazar a una
referencia" el nombre de la referencia que ya creaste.

Observa que cuando creas un enlace vinculado a un objeto que se encuentra muy
abajo en la página, el navegador web bajará la página automáticamente para mostrar
tu objeto de referencia.

NOTA : no puedes aplicar una transición a un enlace a una referencia.

272

Enlace al archivo
Esta opción de enlace es útil si quieres agregar un documento, película u otro archivo
a tu sitio web para que esté a disposición de los visitantes. Por ejemplo, es posible que
quieras ofrecer un documento PDF.

Selecciona el objeto o texto que quieres enlazar con el archivo. Luego, activa esta
opción Enlace al archivo y utiliza el botón EXPLORAR para buscar el archivo en tu
ordenador. El nombre del archivo aparece en el campo de texto a la izquierda del
botón Explorar. Con un clic en Aceptar, el enlace se aplicará.

Además de aplicar el enlace, MAGIX Web Designer 10 Premium ha hecho una copia
de tu archivo y la ha colocado en la carpeta de soporte para tu diseño. Esta es una
carpeta que se guarda junto con tu archivo .web o .xar. Si tu diseño se llama
"Misitio.web", la carpeta de soporte se llamará "Misitio_web_files". Todos los
archivos que se encuentran en la carpeta de soporte se publican junto con tu sitio
web, lo que significa que tu archivo se publicará con tu sitio web para que el enlace
que has agregado funcione. Consulta el capítulo Manejo de documentos (en la página
86) para más información acerca de las carpetas de soporte.

Nota: como el archivo se copiará en la carpeta de soporte de tu diseño, deberás

actualizar esta copia cada vez que modifiques el archivo original y quieras publicar la
versión modificada. O puedes repetir el proceso de enlace y buscar el archivo
actualizado. De igual forma, si mueves o copias tu diseño a otro ordenador o le das
una copia a alguien, debes asegurarte de enviar también la carpeta de soporte del
archivo de diseño porque contiene una parte muy importante de tu página web.

NOTA : no puedes aplicar una transición a un enlace a un archivo.

Capa popup
Puedes añadir el contenido que quieras en una capa separada de tu página y puedes
hacer que este contenido se muestre como un popup solo cuando el usuario hace clic
en un enlace. Por ejemplo, podrías agregar un texto descriptivo sobre una foto que se
encuentre en tu página web y hacer que el texto solo aparezca cuando el usuario haga
clic en la foto.

Para añadir una capa de popup, primero tienes que agregar la propia capa
mediante la GALERÍA DE PÁGINAS Y CAPAS y luego agregar tu contenido de
popup a esa capa.
Consulta el capítulo GALERÍA DE PÁGINAS Y CAPAS para más información. A
continuación puedes seleccionar la capa de la lista de capas que encontrarás junto a
la opción de "Capa popup".

También puedes agregar un efecto de transición que se aplica cuando la capa

aparece. En la GALERÍA DE PÁGINAS Y CAPAS , abre las propiedades de capa para poder

www.magix.es
 Diálogo de propiedades web 273

aplicar una transición directamente a una capa (en la página 68) para lograr un efecto
de animación cuando aparezca el contenido de la capa. Puedes también hacer clic en
el botón "Configuración" al lado de la capa popup en la pestaña de "Enlace" para
acceder a las mismas propiedades de capa.

Ahora cuando un visitante haga clic en el objeto aparecerá el contenido de la capa.

Con un clic en cualquier otro lugar de la página, el popup desaparece de nuevo por
defecto. Pero puedes hacer que la capa popup permanezca arriba hasta que el
visitante la cierre explicitamente. Tan solo desbloquea la casilla CERRAR POPUP
AUTOMÁTICAMENTE del diálogo de propiedades de la capa. Entonces se incluye un
botón de cierre en el borde superior del popup y permanece en pantalla hasta que se
presiona el botón de cerrar.

Ten en cuenta que también puedes acceder a las propiedades de capa haciendo clic
en el botón "Configuración..." al lado de la opción capa popup en el diálogo "Enlace".

Ten en cuenta que todo el contenido de la capa popup se carga en cuanto el usuario
visita tu página. Entonces, si quieres ofrecer muchas fotos con ventanas emergentes,
utiliza la característica Foto emergente descrita a continuación.

Foto emergente
Esta opción te ofrece una forma muy fácil de añadir fotos emergentes y otras
características de la galería de fotos a tu sitio web, sin agregar capas. Simplemente
importa tu foto y utiliza la HERRAMIENTA DE SELECCIÓN para reducir el tamaño
correctamente de modo que aparezca como una pequeña miniatura de foto en tu
página web. Luego selecciónala y escoge la opción FOTO EMERGENTE.

Haz clic en el botón CONFIGURACIÓN junto a esta opción para ir a la PESTAÑA IMAGEN ,
en donde puedes fijar el tamaño de la foto emergente y escoger entre otras opciones.
Consulta la sección pestaña Imagen a continuación (en la página 281) para más
detalles. Al seleccionar la opción foto emergente en esta pestaña Enlace, también se
selecciona la casilla foto emergente en la pestaña Imagen, es decir, que ambos
activan el mismo comportamiento de popup.

Utilizar colores habituales para enlaces de sitios web

Esta opción te permite decidir cómo deben aparecer los enlaces de texto. Por defecto,
esta opción está seleccionada, lo que significa que el enlace de texto tendrá el color
que ´ú definiste para toda la página web. Puedes configurar este color en la pestaña
Página web (véase el apartado de la pestaña Página web).

Si deseleccionas esta opción, el enlace de texto seleccionado mantendrá el color que

le diste en la página. Por lo tanto, puedes asignar colores distintos a los diferentes
enlaces, si lo deseas.
274

Abrir enlace en:

Esta opción no hace nada si una de las opciones "Capa popup" o "Popup foto" está
seleccionada. Pero de cara a otros enlaces te permite definir cómo el navegador web
debe cargar la página web de destino. Por defecto, está configurado como "Sin
especificar", lo que por lo general significa que el navegador abrirá el enlace en la
misma ventana del navegador que la ventana o el enlace.

La lista desplegable contiene cuatro opciones producen que el navegador haga cosas
especiales. Tiene que seleccionar una de estas opciones o tecleas el nombre de un
frame:

NUEVA VENTANA (_BLANK) Abre el enlace en una nueva ventana del navegador.

MISMO FRAME (_SELF) Abre el enlace en este frame (el frame que contiene este
objeto).

FRAME SUPERIOR (_PARENT) Abre el enlace en la ventana principal o en el frameset

(conjunto de marcos o frames) que contiene este frame.

MISMA VENTANA (_TOP) Abre el enlace dentro de la página principal del navegador,
sustituyendo todos los frames existentes.

Si quieres que el enlace se cargue en un frame específico en el navegador, teclea el

nombre del frame en este campo.

Área que permite clic

Esta opción te permite especificar en qué área del objeto se debe hacer clic para
invocar el enlace. Sin embargo, no es compatible con páginas web HTML (el
rectángulo que rodea el objeto siempre se usa); sólo funciona si se exporta a flash.

FORMA DE OBJETO : El usuario debe hacer clic exactamente en el contorno del objeto
para invocar el enlace.

RECTÁNGULO RODEANDO OBJETO: El usuario puede hacer clic en cualquier parte del
rectángulo que esté rodeando el objeto (caja circundante) para invocar el enlace.

www.magix.es
 Diálogo de propiedades web 275

Pestaña Página web

La configuración en esta pestaña se aplica a todo el documento o a toda la página

actual, por lo que no importa qué objeto o página hayas seleccionado.

TÍTULO, DESCRIPCIÓN Y PALABRAS CLAVE : estos campos se han descrito en la sección

Pestaña Página (en la página 278). Opcionalmente puedes configurar estos campos
para que se apliquen a cada página de tu sitio, a no ser que la configuración para una
página de la pestaña "Página" los anule. Por ejemplo, una página que no tenga su
propio título en la pestaña Página, obtendrá el título especificado aquí.

CÓDIGO HTML (ENCABEZADO) Y CÓDIGO HTML (CUERPO): estos botones tienen el

mismo objetivo que los botones código HTML (encabezado) y código HTML
(cuerpo) de la secciónpestaña Página y te permiten introducir una gran cantidad de
código HTML en la sección del encabezado o del cuerpo de las páginas de tu sitio
web.
276

Si se ha especificado código aquí en la PESTAÑA PÁGINA WEB, se incluirá en todas las

páginas del sitio junto con el código especificado para cada página en la pestaña
Página. De esta forma puedes incluir un código en cada página y, además, te puedes
agregar más código a las páginas que lo requieran.

Colores para enlaces de sitios web

Esta sección de la pestaña "Página web" te permite controlar cómo los enlaces de
texto deben aparecer en tu página web.

SUBRAYAR TEXTOS CON ENLACES : el subrayado se suele usar para resaltar en el texto
los enlaces que permiten clic, por lo que esta opción está seleccionada por defecto.
Desactívala si no quieres que tus enlaces de texto aparezcan subrayados.

MOUSEOFF : aquí puedes elegir el color que quieras para todos tu enlaces de texto. O
bien puedes elegir en la lista desplegable (si existe una en tu documento actual) un
color original con nombre, o bien puedes hacer clic en el botón "Editar" para abrir el
editor de color y elegir cualquier otro color.

MOUSEOVER : los enlaces de texto cambiarán a este color cuando un usuario mueva el
cursor del ratón por encima de ellos.

VISITADO : enlaces de texto que conduzcan a una página que el usuario ya ha visitado
se visualizan en este color en lugar de en el color MouseOff.

Adaptar a bordes de página

Esta opción está activada por defecto. Si tienes objetos en tu sitio web que
sobrepasan los bordes de la página web, haz clic en esta opción para recortar estos
objetos de modo que solo sea visible la parte que está sobre la página. Desactiva esta
casilla si quieres que el objeto fluya sobre el borde de la página de forma que la
porción que sobrepasa el tablero de dibujo se muestre de todas formas.

Ten en cuenta que si tienes una página invisible (lo que ocurre por defecto para
nuevos documentos web o si has aplicado "sin color" a tu página), no se puede
hacer clip a los bordes de página aun cuando esta opción está activada.

Presentaciones web
Haz clic en la opción PÁGINA WEB DE PRESENTACIÓN para convertir una página web
existente en una presentación.

Nota: si creas un documento de presentación y escoges PRESENTACIÓN DE 955

PIX del menú NUEVO , la casilla PÁGINA WEB DE PRESENTACIÓN se activa
automáticamente.

www.magix.es
 Diálogo de propiedades web 277

CLIP A LOS BORDES DE LA PÁGINA (activado por defecto): si tienes objetos en tu página
web que sobrepasan los bordes de la página web, haz clic en esta opción para
recortar estos objetos a la porción visible en la página web. Quita la selección de esta
casilla si quieres que el objeto fluya sobre el borde de la página de forma que la
porción que sobrepasa el tablero de dibujo se muestre de todas formas.

Nota: si tienes transiciones aplicadas a una capa o transiciones de pasos de una

presentación que aparecen desde los lados, la parte inferior o la parte superior de la
página, al desactivar esta opción, la transición aparecerá desde el borde de la
ventana del navegador en vez de desde el borde de la página.

Retina (activado por defecto)

Cuando esta opción está activada, Web Designer exportará versiones en alta
resolución de cada imagen en tu página web, además de imágenes en resolución de
pantalla normal. Esto significa que los dispositivos con pantallas de muy alta
resolución verán imágenes de mayor calidad.

Consulta la sección Imágenes de alta resolución (en la página 318) del capítulo
Manejo de fotos (en la página 318) para más información.

Opciones de exportación web

El diálogo OPCIONES DE EXPORTACIÓN WEB te permite elegir como quieres publicar tu
sitio web. Puedes elegir entre exportarlo como SITIO WEB CONVENCIONAL (con un
archivo HTML separado para cada página), donde haces clic a través de las páginas
usando la navegación convencional, o como SUPERSITE (el sitio completo como un
único archivo HTML), lo que te permite presentar tu página con transiciones
animadas entre páginas o como un arreglo horizontal o vertical de páginas, para que
los usuarios puedan explorarla con toques de pantalla en móviles y tabletas.

La configuración por defecto para el diálogo es PÁGINA WEB CONVENCIONAL .

Ver Supersites (en la página 300) para más detalles sobre las opciones de
visualización y para añadir capas.
278

Pestaña Página

Las opciones en esta pestaña se aplican a la página actual, no al objeto ni a los objetos
seleccionados. La página actual se indica con líneas de ángulo negras en la parte
exterior de cada esquina de la página. Todos los campos en esta pestaña son
opcionales: no necesitas necesariamente rellenar estos campos para cada página de
tu web.

Si quieres tener el mismo título, descripción y palabras clave en cada página de tu

sitio web, puedes configurarlo una sola vez en la pestaña Página web en lugar de
hacerlo para cada página.

NOMBRE DE ARCHIVO DE LA PÁGINA : utiliza este campo para establecer el nombre que
quieres que se utilice para esta página, al exportarla. Así, si quieres que la página se
exporte como "inicio.htm", configura este campo como "inicio".
www.magix.es
 Diálogo de propiedades web 279

En general, la primera página de un sitio web se denomina "index.htm" o "inicio.htm"

porque si un visitante especifica una URL con el nombre de dominio y sin el nombre
de página (como www.xara.com), el servidor web generalmente lo lleva
automáticamente a la página index.htm, si esta existe. Ten en cuenta que los
caracteres que introduces en este campo se escriben automáticamente en
minúsculas y que no se permiten los caracteres acentuados y algunos otros
caracteres no alfanuméricos. Esto tiene como objetivo reducir los posibles de
problemas de compatibilidad con los diferentes servidores web cuando publicas tu
página web.

TÍTULO DE PÁGINA: puedes escoger un título para tu página. Si está definido, los
navegadores web lo usan para mostrar el título de la página en el marco de la ventana
del navegador o en la pestaña. A modo de ejemplo, en el momento de redacción la
página inicial de www.xara.com tiene el título "Graphics Software by Xara" que, como
puedes ver, se muestra en el navegador web si visitas la página.

Avanzado: el título se inserta en el encabezado de la página con el elemento HTML

"<título>".

DESCRIPCIÓN DE LA PÁGINA : es posible que los motores de búsqueda muestren este

texto de descripción de la página en los resultados de las búsquedas cuando un
visitante encuentre tu página mediante una búsqueda en Internet. Los navegadores y
otros servicios web también pueden mostrar la descripción de la página.

Avanzado: la descripción se introduce como metadatos en el encabezado de la

página
(‘<meta name="description" …..).

PALABRAS CLAVE DE LA PÁGINA: aquí puedes ingresar palabras clave que deseas que
los motores de búsqueda reconozcan para que los visitantes encuentren tu sitio.
Introduce palabras que los visitantes potenciales puedan buscar cuando quieran
encontrar páginas y sitios como el tuyo. Para aquellos familiarizados con HTML, las
palabras clave se introducen en el encabezado de la página como metadatos:

Avanzado: las palabras clave se introducen como metadatos en el encabezado de la

página
(‘<meta name="palabras clave" …..).

CÓDIGO HTML (ENCABEZADO): haz clic para abrir el diálogo de código HTML
(encabezado), en donde puedes pegar o escribir código HTML directamente en el
encabezado de tu página web. El código se inserta sin modificarse antes de la etiqueta
de cierre "</encabezado>".
280

CÓDIGO HTML (CUERPO): haz clic para abrir el diálogo de código HTML, en donde
puedes pegar o escribir código HTML directamente en el cuerpo de tu página web. El
código se inserta sin modificarse antes de la etiqueta de cierre "</cuerpo>".

Estos diálogos deben utilizarse con cuidado porque insertar código o comandos
inválidos en tu página pueden generar serios problemas en toda la página web. Si
necesitas insertar el mismo código exacto para todas la páginas de tu sitio web,
puedes usar el botón de código HTML (encabezado) y código HTML (cuerpo) en la
pestaña Página web de este diálogo, en vez de introducirlo para cada página individual
en la pestaña Página.

EFECTO DE TRANSICIÓN: escoge un efecto de transición que se mostrará cuando un

visitante abra tu página web. Por ejemplo, si seleccionas una transición fade para una
página, cuando un visitante haga clic en esa página, en vez de cargarse directamente,
aparecerá gradualmente. Sin embargo, no puedes aplicar un efecto de transición de
esta manera a una página externa, sino que debes usar la opción Transición de enlace
de la pestaña "Enlace" para hacerlo.

Puedes aplicar los siguientes efectos de transición a una página:

Instantánea (por defecto) El contenido de la nueva página, capa o paso aparecerá

Aparecer desde
Desaparecer desde
Transición
Desaparecer en negro
Obturador
Separación y aparición
vertical/horizontal
directamente
El contenido de la nueva página, capa o paso aparecerá
desde diversas direcciones
El contenido de la página actual desaparecerá en
diversas direcciones
El contenido de la nueva página aparecerá de forma
gradual
El contenido de la página actual cambiará a una
pantalla en negro y el contenido de la nueva página
aparecerá gradualmente.
Una barra negra se mueve a lo ancho de la pantalla
desde la derecha y oscurece el contenido viejo. Al
regresar revela el contenido de la nueva página.
El nuevo contenido aparece, se divide en dos mitades
que se unen de forma vertical u horizontal.

VELOCIDAD (EN SEG.): arrastra la barra para escoger una velocidad para la transición
de entre 0 y 5 segundos. Por defecto, cuando aplicas una transición, los objetos
solamente aparecerán o desaparecerán desde la esquina de la página web. Si quieres
que los objetos aparezcan desde las esquinas de la ventana del navegador, en vez de
desde las esquinas de la página, desactiva la opción de los bordes CLIP A LA PÁGINA en
la pestaña Página web (en la página 275) del diálogo de propiedades web.

www.magix.es
 Diálogo de propiedades web 281

Nota técnica: las transiciones de página primero cargan la página de destino en un

iFrame oculto y luego revelan ese iFrame con el efecto visual. Luego, la página de
destino vuelve a cargarse de forma normal. Esta segunda carga de la página de
destino, generalmente no se nota, pero, dependiendo de la velocidad de la máquina
y de la versión del navegador que se utilice (especialmente los navegadores más
antiguos), muchas veces la página parpadea un momento al final de la transición de
página.

Pestaña Imagen

Fotos emergentes
Esta sección de la PESTAÑA IMAGEN te permite añadir fotos emergentes y otras
características de la galería de fotos a tu página web. Simplemente importa tu foto y
utiliza la HERRAMIENTA DE SELECCIÓN para reducir el tamaño correctamente de modo
que aparezca como una pequeña miniatura de foto en tu página web. Luego, mientras
la foto todavía está seleccionada, selecciona el campo foto emergente en esta
pestaña. Escoge el tamaño que quieres dar a la foto emergente en el campo de ancho
(valor por defecto: 500 píxeles). Haz una vista previa de tu página y haz clic en la
miniatura de tu foto en tu página, ahora verás aparecer la ventana emergente con tu
foto.

Al activar la función de foto emergente en el campo de la pestaña IMAGEN , también se

selecciona automáticamente la opción correspondiente de la pestaña ENLACE. Esto es
282

porque con un clic sobre la foto verás la foto emergente, de forma que no puedes
agregar otro enlace al mismo objeto. Es decir, que cualquier enlace que hayas
configurado previamente en el objeto mediante la pestaña Enlace desaparecerá.

Una gran ventaja de estas ventanas emergentes frente a las capas emergentes (tal
como se describen anteriormente en la sección de la pestaña ENLACE ) es que la foto
ampliada solo se carga en el navegador web cuando los visitantes hacen clic en una
foto en miniatura. Por lo tanto, este método es más adecuado para presentar un gran
número de fotos en una página de galería, ya que en un primer momento sólo se
cargan las pequeñas miniaturas, permitiendo así que la página se cargue más
rápidamente.

Observa que esta característica funciona con otros objetos además de las fotos, por
ejemplo con formas y grupos, pero no se puede utilizar directamente en texto.
Puedes introducir un grupo de relleno de texto (Ctrl+G) para evitar esta restricción.

Título de la ventana emergente

Utiliza este campo para agregar un título a la foto seleccionada, que se mostrará
sobre la foto emergente. Ten en cuenta que debes activar también esta opción de
título en el diálogo de opciones de foto emergente (ver a continuación) porque, por
defecto, los títulos no se muestran.

Opciones de la foto emergente

Haz clic en el botón OPCIONES para abrir el diálogo OPCIONES DE FOTO EMERGENTE .
Aquí puedes escoger entre una variedad de opciones que cambian la forma en que se
presentan tus fotos emergentes.

www.magix.es
 Diálogo de propiedades web 283

Opciones de la ventana emergente

Las siguientes opciones cambian la apariencia de la foto emergente.

OSCURECER PÁGINA MIENTRAS LA VENTANA EMERGENTE ESTÁ ABIERTA : con esta opción
seleccionada, toda la página se oscurece cada vez que se muestra una foto
emergente. Esto ayuda a enfatizar la foto emergente de forma que se destaque contra
el fondo oscuro de la página.

MOSTRAR SOMBRA DETRÁS DE LA VENTANA EMERGENTE : esta opción coloca una

sombra detrás de la ventana de la foto emergente para que se destaque del fondo de
la página.

MOSTRAR TÍTULO DE LA IMAGEN : si has introducido texto de título (lee más arriba)
para cada una de tus fotos, esta opción hace que el título aparezca sobre la foto
emergente.

Ten en cuenta que el texto del título es independiente del texto de subtítulo que se
muestra debajo de la foto. Lee a continuación para más información sobre los textos
de subtítulo.

Opciones de la galería
Las siguientes opciones activan las características de galería para tus fotos
emergentes.

MOSTRAR LOS CONTROLES DE NAVEGACIÓN DE LA GALERÍA : activa esta opción para que
los controles de la galería se vean sobre la foto emergente.

Esto aparece arriba de la foto cuando se coloca el cursor del ratón sobre la foto.
Permite al visitante ver las otras fotos emergentes en la página actual sin tener que
284

cerrar la ventana emergente y hacer clic en las vistas en miniatura de las otras fotos.
El visitante puede pasar a la foto anterior o siguiente, o iniciar o detener un pase de
fotos automático en el que cada foto se muestra durante algunos segundos para
luego pasar a la siguiente.

MOSTRAR GUIÓN CINEMATOGRÁFICO AL FINAL DE LA FOTO: con esta opción se verá una
cinta cinematográfica con vistas en miniatura debajo de la ventana emergente. Esto
permite al visitante ir a cualquiera de las fotos de la ventana emergente con un clic en
las vistas en miniatura en la cinta cinematográfica, sin tener que cerrar primero la
ventana emergente de la foto.

INICIAR PASE DE FOTOS AUTOMÁTICAMENTE : activa esta opción cuando quieras que se
inicie un pase de fotos cuando un usuario hace clic en tus fotos emergentes. También
puedes escoger cuántos segundos debe mostrarse cada foto cuando el pase de fotos
esté funcionando.

Ten en cuenta que sólo las fotos incluidas en la galería de fotos son aquellas fotos que
se encuentran en la página actual que están configuradas como ventanas emergentes.
Todas las otras fotos en tu página no aparecerán en la galería, por lo que debes
asegurarte de usar la pestaña Enlace del diálogo de propiedades web para activar la
opción foto emergente en todas las fotos que quieras que se incluyan en la galería.

Subtítulos de imagen
De forma opcional puede mostrarse un subtítulo debajo de cada foto emergente.
Introduce el texto del subtítulo en este campo en la pestaña Imagen.

Observa que esta característica funciona con otros objetos además de las fotos, por
ejemplo, con formas y grupos, pero no se puede utilizar directamente en texto.
Puedes introducir un grupo de relleno de texto (Ctrl+G) para evitar esta restricción.

www.magix.es
 Diálogo de propiedades web 285

Para aquellos familiarizados con HTML, este texto se utiliza como texto alternativo en
la imagen exportada para el objeto seleccionado actualmente, independientemente de
si la imagen tiene o no una ventana emergente. Los navegadores web muestran este
texto en la página en lugar de la imagen si ésta no está disponible por alguna razón.

Tipo de imagen web

Debido a la naturaleza de las páginas web HTML, la mayoría de los objetos que ves y
puedes seleccionar en la página MAGIX Web Designer 10 Premium deben
convertirse en imágenes de mapas de bits durante el proceso de exportación de tu
página web. Todo esto sucede de forma automática si realizas una vista previa y la
exportación, pero los controles de esta pestaña te conceden cierto control sobre
cómo se crean estas imágenes.

Recuerda que cada grupo, forma, encabezado, logotipo, foto, fondo de panel, etc. se
exporta por separado como imagen. Viendo cómo se agrupan los objetos en tu
diseño, puedes controlar cómo numerosas imágenes son exportadas para componer
tu página web. Por ejemplo, si tienes dos formas separadas en tu diseño que no están
agrupadas conjuntamente, se exportarán como dos imágenes separadas. Puedes
agrupar las dos formas (Ctrl+G), así se exporta una sola imagen.

Este apartado sobre la pestaña Imagen te permite especificar cómo el objeto

seleccionado actualmente debe ser exportado como una imagen. Por defecto, MAGIX
Web Designer 10 Premium lo decidirá por ti. Esto significa que como regla general las
fotos se exportarán como JPEG (suele ser el mejor formato para fotos) y otros objetos
se exportarán como PNG (suele ser el mejor formato para gráficos). Las fotos que se
rotaron en la página o a las que se les aplicó una sombra semitransparente, se
exportan como PNG porque JPEG no es compatible con la transparencia.

Puedes forzar el objeto o los objetos seleccionado(s) para exportar como JPEG o
como PNG seleccionando la opción apropiada. Si la opción JPEG está seleccionada,
puedes también escoger la calidad JPEG para esta imagen. Una calidad superior
implica que el tamaño del archivo JPEG es mayor.
286

Pestaña Mouse-over

Las opciones de esta pestaña especifican lo que debería ocurrir cuando un visitante
coloca el cursor del ratón sobre el objeto seleccionado. Por ejemplo, puedes hacer que
cierto texto o una capa completa de contenido emerja cuando un visitante coloque el
cursor del ratón sobre una foto de tu página web.

MOSTRAR TEXTO DE POPUP (TÍTULO): aquí puedes especificar el texto del "título de
popup" de un objeto. Los navegadores web lo muestran como un consejo de
herramienta emergente cuando el usuario mueve el cursor del ratón sobre un objeto.
Por ejemplo, si cuentas con una foto en miniatura que dispone de una versión
ampliada de la foto al hacer clic (consulta la sección pestaña Imagen para información
sobre esto), es posible que quieras insertar el texto de título de popup "Haz clic para
ampliar". Entonces, cuando el cursor del ratón pasa sobre la miniatura de la foto, se
verá este consejo de herramienta.
MOSTRAR CAPA POPUP: del mismo modo que puedes añadir a tu diseño una capa que
sólo se muestre cuando un usuario hace clic en un objeto (lee el apartado de la
pestaña Enlace), también puedes especificar que esa capa se muestre cuando el
cursor del ratón se mueva sobre un objeto. Cuando el cursor del ratón se quita del
objeto, vuelve a desaparecer el popup. Simplemente escoge esta opción y selecciona
la capa que quieras que se convierta en popup en la lista suministrada. Por ejemplo,
puedes utilizar esta característica para mostrar como popup una copia más grande de
una foto cuando el usuario mueva el cursor del ratón sobre la misma. Ten en cuenta
que todo el contenido de la capa popup se carga en cuanto el usuario visita tu página.
Por lo tanto, este método de mostrar fotos emergentes no se recomienda si tienes
una gran cantidad de fotos que quieres mostrar. En este caso, utiliza la función Foto
emergente (en la página 42) descrita en el apartado de la pestaña Enlace.

www.magix.es
 Diálogo de propiedades web 287

Pestaña Marcador de lugar

La pestaña Marcador de posición de utiliza para añadir y editar manualmente los

widgets editables. Estos son widgets que insertas en tu página web al introducir
manualmente el código HTML para el widget o al importar un archivo Flash o de
película. En general, no deberás utilizar la pestaña Marcador de lugar para los widgets
que agregues de la GALERÍA DE DISEÑOS , porque el código y los archivos que hacen
que estos widgets funcionen se manejan automáticamente. Consulta el capítulo
Widgets de página web (en la página 398) para más detalles.
288

Para convertir cualquier objeto normal en un marcador de lugar para un widget,

selecciónalo y abre esta pestaña del diálogo Propiedades web. Escoge si deseas que el
widget se base en código HTML que has obtenido de un sitio web de widget, un
archivo Flash o un archivo gráfico. Navega en busca del archivo o pega el código
HTML. Haz clic en ACEPTAR y el objeto se convertirá un marcador de lugar.

Esto significa que el objeto representa las dimensiones y la posición del contenido que
has agregado, pero que al exportar tu página web, el objeto se sustituye con el código
o archivo verdadero que has insertado.

Sin embargo, existe una forma más sencilla de añadir archivos o códigos a tu sitio.
Simplemente arrastra y suelta los archivos Flash o GIF animados desde el explorador
de archivos de Windows hasta tu página. Se generará automáticamente una imagen
de marcador de posición y se colocará en tu página. Una copia del archivo se añade a
la carpeta de soporte de tu diseño para que se exporte y publique con tu sitio. Al
exportar y publicar tu sitio, la imagen del marcador de posición se sustituye por el
archivo verdadero que has importado.

De la misma forma, si has copiado código HTML de la página web de widgets de un

tercero, puedes pegar el código en MAGIX Web Designer 10 Premium (asegúrate de
que te encuentres en la HERRAMIENTA DE SELECCIÓN cuando lo hagas y no en la
HERRAMIENTA DE TEXTO porque, de lo contrario, se insertará como texto). MAGIX
Web Designer 10 Premium detecta el HTML y lo utiliza para renderizar una imagen
de marcador de posición que aparecerá en tu página. También puedes agregar un
marcador de posición para el código HTML directamente en el cuerpo o en el
encabezado de una página con un clic en los botones código HTML (cuerpo) o código
HTML (encabezado), que abrirán un diálogo en donde podrás pegar o editar códigos
largos, de ser necesario.

Al exportar o publicar tu sitio, el marcador de posición se sustituye por el código

verdadero para que el widget funcione. Consulta el capítulo Widgets de página web
(en la página 398) para más detalles.

Reemplazar con Flash

Selecciona esta opción para sustituir el objeto del marcador de lugar con una
animación flash. Utiliza el botón Explorar para localizar el archivo Flash (.swf) que
quieres usar.

A continuación , el archivo elegido se copiará automáticamente al directorio de

compatibilidad para el diseño actual de modo que cuando exportes tu página web, el
archivo se incluirá en el directorio _htm_archivos junto con todas las demás imágenes
generadas para tu página web. Lee el capítulo Trabajar con documentos para obtener
información sobre los directorios de compatibilidad.

www.magix.es
 Diálogo de propiedades web 289

Reemplazar con un archivo gráfico

Selecciona esta opción si quieres insertar un gráfico o una imagen en tu página web
en lugar del objeto del marcador de lugar (por ejemplo PNG, GIF u otro archivo de
imagen compatible con el web.). Utiliza el botón Explorar para seleccionar el archivo.

A continuación , el archivo elegido se copiará automáticamente al directorio de

compatibilidad para el diseño actual de modo que cuando exportes tu página web, el
archivo se incluirá en el directorio _htm_archivos junto con todas las demás imágenes
generadas para tu página web. Lee el capítulo Trabajar con documentos para obtener
información sobre los directorios de compatibilidad.

Reemplazar con código HTML

Con esta opción, puedes pegar código HTML que has obtenido de otra sección del
cuerpo o encabezado de tu página web, por ejemplo, entre las etiquetas
<body></body> o <head></head>. Por ejemplo, muchos sitios proveen widgets que
puedes agregar a tu página si pegas el HTML aquí. Sigue las instrucciones que ofrece
el proveedor. En la mayoría de los casos necesitas agregar solamente código al
cuerpo, pero algunos widgets requieren que incluyas algún tipo de código en el
encabezado.

Tal como se mencionó anteriormente, puedes simplemente pegar el código HTML

directamente en la página en vez de insertarlo en este diálogo (siempre que te
encuentres en la HERRAMIENTA DE SELECCIÓN ). Al hacerlo de esta forma, aparecerá
automáticamente una imagen de marcador de posición de aspecto similar al widget
verdadero, por lo que se recomienda utilizar este método para insertar código HTML.

Advertencia: debes tener cuidado e insertar solamente código que sabes que es
seguro y que proviene de una fuente de fiar. El código inválido o roto afectará tu
página web publicada porque MAGIX Web Designer 10 Premium simplemente
inserta el código tal y como tú lo suministras, sin modificar ni revisar, cuando
exportas tu página web.

Si utilizas módulos de Xara (www.xaraonline.com), puedes pegar un snippet (trozo)

de módulo en este campo para agregar tu módulo a tu página web.

Si el código HTML que introduces contiene una referencia a archivos externos que se
supone deben encontrarse en tu página web, deberás copiar estos archivos externos
en la carpeta de soporte para tu diseño. Lee el capítulo Manejo de documento (en la
página 74) para obtener información sobre las carpetas de soporte. Una vez en la
carpeta de soporte, los archivos se copiarán automáticamente a la carpeta _htm_files
de tu sitio web al exportarlo. Por lo tanto, también es necesario asegurarte que
cualquier referencia a estos archivos en el código HTML se encuentre en la ubicación
correcta.
290

He aquí un ejemplo simple para explicarlo de forma más clara. Supón que yo quiero
insertar una pequeña pieza de código HTML que añade una imagen en mi página
web. El código HTML que yo agregue necesitará una referencia al archivo de imagen
en algún lugar. Primero copio el archivo de imagen, digamos "milogotipo.gif", en la
carpeta de soporte de mi documento. Si el documento es "mipagina.web", la carpeta
de soporte será "mipagina_web_archivos". Yo sé que cuando exporte esta página
web, la exportaré al nombre "mipagina.htm". Esto significa que todas las imágenes
generadas para mi página web y una copia de "milogotipo.gif" que puse en la carpeta
de soporte, se exportarán al directorio "mipagina_htm_archivos". Por lo tanto, en el
código HTML que inserto tengo que incluir una referencia al archivo de imagen en esa
ubicación. Por lo tanto, puedo insertar:

<img src="mipagina_htm_archivos/milogotipo.gif" />

Observa que esto hace referencia al archivo de imagen en la ubicación del directorio
de la imagen exportada (_htm_archivos) y NO en el la carpeta de soporte
(_web_achivos) directamente, ya que únicamente el directorio de la foto exportada se
copia en el servidor web junto con mi página web cuando se publique la página.

Obviamente, si realmente solo quiero poner una imagen en mi página web, ¡es mucho
más fácil importar directamente la imagen a MAGIX Web Designer 10 Premium! Pero
esto es un ejemplo simple que muestra cómo agregar un código HTML que contiene
una referencia a un archivo externo. Consulta Integración de YouTube, Flash y otros
widgets (en la página 33) para más ejemplos.

Añadir código al encabezado de página

Algunos códigos tienen que ir en el encabezado del código HTML exportado (<head>
tag) y no en el cuerpo (<body> tag) como aparece por defecto.

Para ello, haz clic en el botón de código HTML (encabezado) situado en el marcador
de posición, en la página web o en la pestaña de página del cuadro de diálogo de
propiedades e introduce o copia el código.

Objetos de marcador de lugar

El objeto de marcador de lugar en realidad está incluido en tu página web y puede
mostrarse al usuario en algunas circunstancias. Por ejemplo, si has añadido una
animación flash y el usuario que visita tu página no tiene instalado Flash en su
navegador web, o si lo tiene deshabilitado, el navegador mostrará en su lugar la
imagen del marcador de lugar.

¡Por lo tanto, es una buena idea hacer de tu marcador de lugar algo más avanzado que
sólo un rectángulo negro! Podrías utilizar una imagen estática que se parezca al
contenido flash. O quizás podrías usar un grupo como marcador de lugar que incluya
un mensaje de texto que pida al visitante instalar Flash para que así pueda ver el
contenido flash.

www.magix.es
 Diálogo de propiedades web 291

Pestaña Publicar

En la pestaña PUBLICAR configuras o cambias la configuración, lo que te permite

publicar tu página en Internet. Sin embargo no necesitas visitar este diálogo antes de
publicar: la operación de publicación te indicará que introduzcas los detalles
requeridos si no los has especificado todavía. Consulta el Capítulo de publicación para
más información.

• Haz clic en el botón CONFIGURACIÓN para conformar la configuración tanto de

MAGIX MUNDO ONLINE como de OTROS ALOJAMIENTOS WEB (VÍA FTP).
• Haz clic en el botón GUARDAR EN EL PERFIL para guardar los detalles actuales en
un perfil.
• Selecciona la opción que incluye tu página en la galería de páginas de usuarios
de Web Designer marcando INCLUIR MI PÁGINA WEB EN LA GALERÍA DE USUARIOS .
• Marca la casilla PUBLICACIÓN RÁPIDA (SOLO ARCHIVOS CAMBIADOS) para volver a
publicar solo los nuevos archivos en tu página web.
• Marca la casilla SALVAR CONFIGURACIÓN DE PUBLICACIÓN EN EL DOCUMENTO si
deseas mantener los detalles FTP para este documento en particular.
• Marca la casilla GUARDAR CONTRASEÑA EN EL DOCUMENTO para guardar la
contraseña de FTP en el documento (no recomendado para uso normal y no
disponible para MAGIX ONLINE WORLD).
292

Consulta el capítulo principal Publicar página web (en la página 310) para tener toda
la información sobre como publicar tu página.

Explorar espacio web

Si has completado los campos de dirección de FTP, el nombre de usuario FTP y la
contraseña de FTP, haz clic en el botón opcional Explorar espacio web para navegar,
ver y eliminar los archivos que has cargado a tu servidor FTP.

Puedes ver los archivos y abrir las carpetas para ver el contenido de las subcarpetas.
También puedes eliminar uno o muchos archivos. Selecciona múltiples filas con un
clic mientras pulsas Shift o Ctrl, tal como lo haces en el Explorador de Windows. Haz
clic en un encabezado de columna para ordenar los archivos según el criterio de esa
columna.

Navega por la lista de archivos que has cargado a tu servidor ftp

Regresa a la vista de archivos original que habías abierto al lanzar el diálogo

Explorar espacio web
Te lleva a las carpetas de un nivel superior

Elimina un archivo o múltiples archivos seleccionados

www.magix.es
 Diálogo de propiedades web 293

Pestaña Analytics

Pestaña Google Analytics con una muestra de código de seguimiento.

La pestaña Google Analytics te ofrece una forma rápida y fácil de añadir un código de
seguimiento a tus páginas permitiéndote controlar el tráfico de tus páginas web
usando las herramientas de información de Google. Necesitas tener una cuenta con
Google para usar las funciones de Analytics: haz clic en el botón "PÁGINA WEB DE
ANALYTICS" para visitar la página y crear una cuenta, si aun no tienes una, o para
administrar una cuenta existente. Sigue las siguientes instrucciones para obtener tu
código de seguimiento y cópialo en la pestaña Analytics. Ahora podrás hacer el
seguimiento de datos a través de la página web Google Analytics de tu página
publicada.
294

Diseño web adaptativo

Acerca de RWD
Con el uso en aumento de dispositivos móviles para acceder a Internet, también
aumenta la demanda de diseños de sitios web hechos a la medida de los formatos de
móviles y tabletas.
Aunque los dispositivos móviles tales como teléfonos tienen navegadores web
excelentes capaces de visualizar cualquier página web, un sitio web optimizado para
móviles no debería requerir del uso del zoom para ver el texto. Esto significa
normalmente que el contenido principal será una única columna de tamaño un punto
mayor para que se pueda leer mejor en el móvil de un vistazo. Las páginas web en los
móviles normalmente tienen un contenido reducido y se pueden navegar con toques
de un solo dedo para desplazar y navegar.
Podrías crear dos sitios web separados, uno diseñado para móviles de pantalla
estrecha y otro para pantallas de escritorio tradicionales más anchas, pero repetir el
contenido en dos páginas web separadas puede ser tedioso y una pérdida de tiempo,
especialmente si tienes que hacerlo cada vez que actualizas los textos o imágenes.
El diseño web adaptativo (RWD por sus siglas en inglés) es una técnica que permite a
tus sitios web responder de forma dinámica al tamaño de la pantalla. En lugar de
tener dos páginas web separadas, es decir, dos páginas HTML separadas, tendrás una
sola página web que puede cambiar su diseño dependiendo del tamaño de la pantalla
(y la resolución) del dispositivo que se esté usando para ver la página web.

Dos variantes del mismo sitio web. La primera es como se ve en una pantalla ancha, la segunda
es para pantallas estrechas como las de dispositivos móviles. La columna de texto es más
estrecha y las imágenes y los elementos de página están organizados para adaptarse a una
pantalla más estrecha.

www.magix.es
 Diseño web adaptativo 295

"Retina" adaptativa o control de resolución HiDPI

Los dispositivos móviles y tabletas se diferencian de la mayoría de navegadores web
de escritorio en que admiten gráficos de una resolución mayor. Web Designer admite
esto de forma totalmente automática y producirá tanto imágenes de resolución
normal como Hi-DPI o Retina para todos los gráficos y fotos. La página web utiliza
entonces de forma inteligente la versión adecuada de la imagen dependiendo de la
resolución del dispositivo de navegación.

Los navegadores más viejos como IE8 y anteriores no admiten RWD, por lo que solo
mostrarán la variante principal de tu sitio web.

Variantes múltiples
Crear sitios RWD puede llegar a implicar una programación compleja de Javascript.
Pero al ser Web Designer una herramienta destinada a diseñadores de programación
cero, el usuario todavía tiene todo el control para el diseño web espontáneo y
totalmente libre: también puede crear múltiples variantes del mismo sitio web.
Puedes crear una variante diseñada para dispositivos móviles de pantallas estrechas,
quizá otro diseño para tabletas intermedias de pantalla pequeña y otra variante para
un escritorio de pantalla ancha tradicional.

Lo importante es que el contenido, es decir, el texto, las fotos, los gráficos y los
esquemas de colores, se comparten entre las variantes. El segundo punto importante
es que las variantes de capa múltiple para cada página no son archivos separados,
sino que forman parte de un solo archivo HTML que puede cambiar de forma
dinámica e instantánea de una capa a otra dependiendo del ancho del navegador.

Para cada variante que creas, puedes adaptar la capa tanto como desees. Puedes
modificar el tamaño y recolocar elementos en la página y esto se comparte entre las
variantes. Edita el texto para la variante de móvil estrecha y el texto se actualiza para
las otras variantes. También puedes elegir actualizar el estilo de texto (en la página
217) de una variante y que se apliquen los cambios solo a esa variante. O puedes
decidir que quieres diferentes contenidos o gráficos en una variante: las variantes de
móviles normalmente tienen un contenido reducido.

Cuando añades o borras una página en una variante, automáticamente crea o elimina
la página en otras variantes. Así que tu página siempre tiene los mismos arreglos de
página en todas las variantes.

Hay que poner los nombres de las páginas web en orden para que se puedan
compartir a través de las variantes. Si no se le pone nombre al sitio, entonces se le
aplica uno automáticamente.
296

Crear páginas web RWD desde las plantillas

Con mucho la forma más sencilla de comenzar a utilizar variantes es usar uno de los
diseños de plantillas de páginas web de la GALERÍA DE DISEÑOS o del CATÁLOGO DE
CONTENIDO : puedes ver que plantillas vienen con variantes por la (R) al lado del
nombre de la carpeta. Tan solo haz doble clic en la plantilla de una página web para
abrirla y editarla.

Cuando abras una plantilla verás dos pestañas de documento, una será la del
documento principal del sitio web llamada variante principal y otra plantilla más
estrecha llamada variante de móvil. Web Designer muestra cada variante en una
pestaña separada, de forma que puedes cambiar entre las variantes de forma fácil y
rápida. Te puede ser de ayuda organizar tus documentos web usando la opción de
menú "VENTANA" > "ORGANIZAR VISTAS" para alinear tus variantes una junto a otra.

Crear sitios web RWD desde sitios existentes

Para crear una variante desde un sitio web existente tienes que abrir el diálogo
VARIANTES DE PÁGINA WEB. Cualquiera de los siguientes pasos te permitirá hacerlo:

• Haz clic en "HERRAMIENTAS" > "VARIANTES DE PÁGINA WEB" > "VARIANTES DE

PÁGINA WEB" .
• Haz clic derecho en la pestaña de documento y seleccionar "VARIANTES DE
PÁGINA WEB" para abrir el diálogo y también para ver tus variantes.
• Haz clic derecho en cualquier lugar del área de trabajo y selecciona "VARIANTES
DE PÁGINA WEB" > "VARIANTES DE PÁGINA WEB" para ver el diálogo.

Variantes de página web

Haz clic en el botón CREAR y elige un ancho de diseño en píxeles. Las dos variantes
arriba describen páginas web d 760 píxeles para la variante principal y una variante
de móvil que tiene por defecto un ancho de 480 píxeles. Lo que sucede es que el
navegador web que se visita con un ancho de 620 píxeles o mayor verá la variante
mayor mientras que un navegador con un ancho menor de 620 píxeles verá la
variante de móvil.

www.magix.es
 Diseño web adaptativo 297

Puedes ver y editar las dimensiones de las variantes existentes haciendo clic en el
botón PROPIEDADES... .

Cuando creas una nueva variante, todo el contenido de la página web principal
aparece en su mayoría inalterado, pero el tamaño de página cambia y el fondo de
página se ajusta. Depende de ti si quieres volver a ajustar el diseño como desees para
esta capa. Puedes mover los elementos alrededor de la página libremente, reducir el
ancho de las columnas de texto, cambiar el tamaño y la posición de las imágenes y
tendrás que hacerlo para todas las páginas de tu variante de sitio web.

Puedes cambiar el título y el ancho de píxel de una variante en cualquier momento

haciendo clic en los botones PROPIEDADES y luego ACTUALIZAR del diálogo.

Nota: el punto de inflexión entre dos variantes está a medio camino entre los anchos
de las dos. Así en el caso arriba descrito para anchos de navegador inferiores a 620,
mostrará el más estrecho y en el caso de los anchos por encima, mostrará el más
ancho. Tenlo en cuenta también porque la mayoría de los dispositivos móviles
siempre tratan de ajustar el contenido del navegador a la pantalla, no importa que tu
página web sea más ancha que los píxeles de su pantalla: se reducirá para adaptarlo
al navegador.

Compartir a través de variantes

Cuando creas una variante nueva, la mayoría del contenido se comparte o se
comparte en tiempo real a través de todas las variantes, pero el tamaño y la posición
de ese contenido es propio de cada variante.
• Si editas el texto, se cambiará en todas las variantes.
• Si cambias el tamaño de los objetos, el cambio se aplicará a una sola variante
(es probable que quieras que los objetos tengan diferentes posiciones y
tamaños en las diferentes variantes.
• Si arrastras y sueltas una foto en una foto existente, se reemplazará en todas las
variantes.
• Si editas la forma de una foto, la recortas o cambias el relleno (el tamaño de
imagen, la rotación o la posición dentro del marco de la foto), entonces estos
cambios solo afectan a esa variante. Esto es útil porque significa que puedes, no
solo cambiar el tamaño y posición de las fotos en la variantes, sino también
cambiar su relación de aspecto y el recorte de la imagen.

Haz clic en un objeto para ver si está compartido en tiempo real o no.
298

Esta foto tienen un marcador de doble

línea en el ángulo superior, lo que
indica que está compartida en tiempo
real en una o más variantes.

Puedes modificar el tamaño, recortar y

ajustar el relleno como necesites y el
cambio seguirá afectando solo a esa
variante. Pero si sustituyes la foto, por
ejemplo colocando una foto encima,
entonces cambiarán todas las
variantes.

Cuando creas un objeto nuevo (por ejemplo un área de texto, una foto o un gráfico)
en principio no se comparte entre las variantes. Si quieres compartirlo, usa el menú
"HERRAMIENTAS" > "VARIANTES DE PÁGINA WEB" o tan solo haz clic derecho en el
elemento y selecciona "VARIANTES DE PÁGINA WEB" > "COMPARTIR CON TODAS LA
VARIANTES" . Selecciona "DEJAR DE COMPARTIR CON VARIANTES" si no quieres que un
objeto se comparta entre las variantes. Este menú también te da la opción de borrar el
objeto de todas la variantes.

Nota técnica: si tienes variantes diferentes de fotos, es decir, diferentes tamaños,

recortes o posición de relleno, entonces Xara tiene que crear múltiples versiones de
la foto para la página web publicada. Sin embargo esto no tiene costes de
rendimiento (no ralentiza tu página web), ya que el navegador web carga en un
principio la versión correcta y luego, en el fondo, descarga las imágenes de las otras
variantes. Esto significa que la versión inicial que estás mirando (en el móvil o en la
versión de escritorio) se descargará tan rápido como pueda, pero que si cambias el
ancho de tu navegador o la orientación, cambiará de forma inmediata a la otra
versión.

Variantes y objetos repetidos

Cuando los objetos repetidos (en la página 137) como las barras de navegación, los
encabezados y los pies de página aparecen en varias variantes, no pueden
compartirse a través de ellas. En lugar de eso, cada variante tiene su propio conjunto
de objetos repetidos separado.

Variantes y barras de navegación

Es probable que quieras un diseño de barra de navegación en una variante más
estrecha. Las barras de navegación en cada variante son independientes, de modo
que puedes adaptarlas como sea necesario, incluido el cambio de diseño de la barra,
arrastrando un diseño de barra de navegación de la GALERÍA DE DISEÑOS y soltándolo
en la barra existente en la variante que quieres cambiar. Puede que quieras, por
ejemplo, una barra horizontal para páginas web anchas y una vertical para
dispositivos estrechos.

www.magix.es
 Diseño web adaptativo 299

Una solución eficiente de espacio para las barras de navegación en una variante de
página web para móviles estrechos es tener un solo botón de navegación con un
menú de enlaces a otras páginas en el sitio web en lugar de una barra con un botón
para cada página. Ver Barras de navegación de botón único (en la página 376) para
más detalles.

Variantes y fondos
El color principal o el diseño del fondo de tablero de dibujo (el área alrededor de la
página que determina el fondo de la ventana del navegador cuando se publica la
página) puede cambiar de una variante a otra y cada página y cada variante de página
se exporta con su propio rectángulo de tablero de dibujo.

Las excepciones son las Supersites (en la página 300), porque solo se puede
visualizar un fondo cada vez.

Puedes colocar objetos adicionales en la capa de fondo de tablero de dibujo y estos

pueden variar también entre las variantes de las páginas. Así que, por ejemplo,
puedes tener una forma superpuesta en el borde de la página y esta puede colocarse
todavía de forma diferente en cada variante o faltar en algunas variantes.

Consulta Fondos de página web (en la página 302) para más información.

Publicación de variantes
Publicar tu página web con variantes es fácil y no difiere de publicar una página web
normal. Tu página web es capaz de determinar la resolución del dispositivo de
visualización de forma automática y proporcionar la variante adecuada en relación al
ancho que tenga.

Puedes probarlo cambiando el ancho de tu navegador web cuando hagas la vista

previa de tu página: hazlo más estrecho y verás como cambia instantáneamente para
mostrar la variante móvil de tu página web.
300

Supersites

Sobre las Supersites

Los navegadores web modernos admiten muchos efectos HTML5 y CSS3 avanzados,
permitiendo la creación de páginas web mucho más dinámicas y atractivas
visualmente.

Las Supersites utilizan estos efectos para permitirte añadir transiciones de página
dinámicas animadas y opciones de visualización para tus páginas web cuando un
usuario va haciendo clic al navegar por tu página web..

Las animaciones de Supersites implican la aceleración de hardware, que es admitida

por casi todos los navegadores modernos, incluyendo aquellos de teléfonos y
tabletas, para asegurarse una animación rápida y fluida.

Mientras las Supersites no resultan adecuadas para las páginas web complejas y
grandes, son especialmente apropiadas para las páginas pequeñas o para
documentos web, presentaciones y para cualquier ocasión en que se requiera un
contenido de estilo diapositiva. Las presentaciones (en la página 385) se publican
siempre como Supersites.

Las opciones de visualización verticales u horizontales permiten al usuario deslizarse

a través de las páginas usando un ratón o incluso con toques de pantalla a través de
las páginas cuando se usa una tableta u otro dispositivo móvil. Las páginas se
presentan como una lista de desplazamiento única. Alternativamente una selección
de transiciones de página ofrece una amplia gama de transiciones entre las que elegir.

Habilitar Supersites
Abre el diálogo OPCIONES DE EXPORTACIÓN WEB para ver las opciones
SUPERSITE ."HERRAMIENTAS" > "OPCIONES DE EXPORTACIÓN WEB" . O también haz clic
derecho en tu página y abre el diálogo PROPIEDADES WEB y haz clic en "PÁGINA WEB"
> "OPCIONES DE EXPORTACIÓN WEB".

www.magix.es
 Supersites 301

Diálogo de opciones de exportación web

Selecciona la opción SUPERSITE y selecciona. Puedes seleccionar las opciones de

desplazamiento VERTICAL u HORIZONTAL o las TRANSICIONES DE PÁGINA .

Para aplicar una transición de página, selecciona TRANSICIONES DE PÁGINA y elige

entonces un EFECTO DE TRANSICIÓN del menú desplegable. Puedes controlar la
velocidad de transición y también que las páginas tengan la opción ADAPTAR TAMAÑO
A LA PANTALLA , de modo que se redimensionan de forma automática para adaptarse
a la ventana del navegador. El efecto de transición que elijas se aplicará a todas las
páginas de tu sitio web.

Si quieres añadir una transición específica a una página individual, entonces ve a la

pestaña PÁGINA en el DIÁLOGO DE PROPIEDADES WEB y aplica aquí la transición. La
configuración de las transiciones a nivel de página tiene prioridad frente a aquellas
configuraciones para el sitio web completo en las OPCIONES DE EXPORTACIÓN WEB .

Ten en cuenta que la opción ADAPTAR TAMAÑO A LA PANTALLA solo funciona

realmente bien para las páginas cortas y donde las páginas de tu sitio web tengan el
mismo alto y ancho. Si usas esta opción con páginas largas, el resultado no es bueno
porque el navegador encogerá la página de modo que su alto se ajuste al alto del
navegador o dispositivo.
302

Necesitas hacer una vista previa de tu página web en un navegador web

separado para ver si las animaciones para la transición funcionan bien (mejor
que usar la ventana de vista previa del navegador incorporado, ya que no te
muestra las animaciones de forma fluida). Haz clic en el botón Vista previa
de página web de la barra de herramientas y luego haz clic en uno de los
iconos del navegador en el extremo superior derecho de la ventana de vista
previa para ver las transiciones en un navegador web separado que tienes en
tu dispositivo.

Selección de iconos de navegación en la ventana de vista previa de página web.

www.magix.es
 Fondos de página web 303

Fondos de página web

La mayoría de diseños de página en la GALERÍA DE DISEÑOS tienen dos tipos de fondo.
Un fondo de tablero de dibujo amplio que se extiende a lo largo del fondo de toda la
ventana del navegador cuando exportas tu página. Sobre él está el fondo de página
con todos los otros elementos que constituyen la página web. Por defecto las
plantillas de la galería de diseño contienen una variante principal y una móvil dentro
del mismo documento web.

Fondo del tablero de dibujo o del navegador

Fondo de página

Configurar los colores del fondo de página o tablero de dibujo

Cuando creas un nuevo documento en blanco ("ARCHIVO" > "NUEVO" ) la página es
transparente (sin color) por defecto, por lo que tan solo verás el color del tablero de
dibujo tras ella, que es blanco por defecto. Esta área de página es donde colocas todos
los elementos de tu página web. También verás un contorno guía rectangular suave
que muestra los límites de la página sobre el tablero de dibujo. Puedes desactivar
esta guía si quieres (haz clic derecho en la página y desactiva "FONDO DE PÁGINA" >
"MOSTRAR TAMAÑO DE PÁGINA".
304

Si arrastras un color desde la línea de colores al tablero de dibujo y lo sueltas, todo el

fondo de la página adoptará ese color. Sucede esto porque el fondo de página es por
defecto transparente, reflejándose así el color del tablero de dibujo subyacente. Y esto
es exactamente lo que verás en el navegador cuando realices una vista previa de tu
página.

Sin embargo, también puedes configurar el tablero de dibujo en un solo color, tal
como se describe más arriba, y luego fijar el área alrededor de la página en otro color.
Tan solo suelta un color sobre el fondo de página para configurar su color. Ahora, al
hacer la vista previa de tu página verás que el color de fondo de la ventana del
navegador tiene el color del tablero de dibujo y el fondo de página cuenta con su
propio color.

www.magix.es
 Fondos de página web 305

Puedes utilizar el editor de colores para modificar los colores. Haz clic derecho sobre
la página y selecciona "FONDO DE PÁGINA" > "EDITAR COLOR DE PÁGINA" para abrir el
editor de color. Entonces podrás editar el color de la página. Para editar el color del
tablero de dibujo, haz clic derecho sobre el tablero de dibujo y selecciona "FONDO DEL
TABLERO DE DIBUJO" > "EDITAR COLOR DEL TABLERO DE DIBUJO" .

Para restablecer el color blanco del fondo del tablero de dibujo, haz clic derecho sobre
el tablero de dibujo y selecciona "FONDO DEL TABLERO DE DIBUJO" > "RESTABLECER" .
Para restablecer el fondo de página a su color transparente por defecto, haz clic
derecho en el fondo de página web y selecciona "FONDO DE PÁGINA" > "RESTABLECER".

Si tienes más de una página en tu documento de página web y quieres aplicar un

fondo y colores del tablero de dibujo globalmente, es decir, en cada página de tu
documento de sitio web, puedes hacerlo fácilmente. Haz clic derecho sobre el tablero
de dibujo o sobre el fondo de página y selecciona COPIAR FONDO DE TABLERO DE
DIBUJO o COPIAR FONDO DE PÁGINA y selecciona entonces PEGAR TABLERO DE
DIBUJO/FONDO DE PÁGINA EN TODAS LAS PÁGINAS.

Fondos de plantilla y cambio de color de fondo

MAGIX Web Designer 10 Premium te permite arrastrar y soltar una gama de fondos
de página diseñados previamente desde la GALERÍA DE DISEÑO directamente en tu
documento web. Elige entre la selección de fondos del apartado FONDOS DE PÁGINA
WEB de la galería. Puedes personalizar las texturas con tus propios colores
arrastrándolos desde la línea de colores sobre el fondo o usando clic derecho sobre el
fondo y abriendo el menú "FONDO DE TABLERO DE DIBUJO" > "EDITAR COLOR DE
TABLERO DE DIBUJO" para desplegar el editor de color.

Cuando cambias el color de un fondo que está compuesto por una serie de colores,
Web Designer te preguntará qué color quieres cambiar. Puede que estos sean colores
con nombre (como sería en el caso de que estuvieras trabajando con uno de los
temas de plantillas prediseñadas para páginas web, o con colores que hayas
nombrado previamente, o incluso podrían ser colores locales si estuvieras cambiando
tu propia selección de color) Consulta "Reemplazar colores" para más información.

Ten en cuenta que cuando arrastres uno de los fondos de página web disponibles
sobre el fondo del tablero de dibujo, reemplazará todos los objetos que están
actualmente en la capa del tablero de dibujo, y a este respecto es una operación
destructiva.

Fondos fijos no desplazables

Normalmente, si tienes una página web larga por la que te puedas desplazar en el
navegador, el fondo del navegador se desplaza con ella, por lo que el contenido de la
página permanece en la misma posición en relación al fondo. Pero puede fijar el fondo
306

para que no se desplace con el contenido de la página. Haz clic derecho sobre el
tablero de dibujo y selecciona "FONDO DE TABLERO DE DIBUJO" > "FIJO" . Entonces,
cuando hagas una vista previa, el contenido se desliza sobre el fondo fijo mientras te
desplazas (para ver este efecto, asegúrate de que tu página es suficientemente larga
como para que el navegador muestre la barra de desplazamiento).

Para cambiar al estado por defecto, selecciona "FONDO DE TABLERO DE DIBUJO" >
"DESPLAZAMIENTO" .

Usar fotos como fondo.

Crear fondos de foto.
Si quieres crear un fondo propio de foto o de textura de mapa de bits en lugar de
personalizar un fondo prediseñado de la galería de diseños, es muy fácil de hacer.

Primero, importa la foto o textura en tu documento, tal y como lo harías para subirla a
tu página web. Entonces haz clic en la foto y escoge entre CONFIGURAR PÁGINA COMO
FONDO o CONFIGURAR TABLERO DE DIBUJO COMO FONDO , dependiendo de cual quieras
configurar.

Segmentación
En función de la naturaleza y tamaño de la imagen, puede que quieras que la imagen
se repita a modo de mosaico para rellenar el fondo. Para cambiar esta configuración,
haz clic derecho en el fondo de página o de tablero de dibujo (dependiendo de nuevo
de lo que quieras cambiar) y selecciona o desbloquea la opción "mosaico" en el
submenú Fondo de página/ Fondo de tablero de dibujo.

Rellenar la ventana del navegador

Al usar una foto como fondo del tablero de dibujo (que se convierte en el nuevo fondo
del navegador) hay una opción más. Puedes hacer que la foto cambie de tamaño en
relación al tamaño de la ventana del navegador del visitante. Tan pronto como la
ventana de navegador cambie de tamaño, la foto lo hace también para adaptarse. Haz
clic derecho en el tablero de dibujo y selecciona "FONDO DE TABLERO DE DIBUJO" >
"RELLENAR LA VENTANA DEL NAVEGADOR" .

Desplazamiento de la parte superior de la página

Generalmente, si configuras la página y el tablero de dibujo con diferentes colores, al
hacer la vista previa verás que la página se extiende hasta la parte superior de la
ventana del explorador. No puedes ver el color del tablero de dibujo encima de tu
página. Sin embargo, puedes añadir un desplazamiento para que haya cierto espacio
entre tu página y el navegador web.

Para agregar un desplazamiento, debes cambiar el origen de la página. Generalmente,

el origen de la página está configurado en la esquina superior izquierda de tu página.

www.magix.es
 Fondos de página web 307

Al mover el origen hacer arriba 20 píxeles, por ejemplo, agregas un margen de 20

píxeles a la parte superior de tu página cuando se visualiza en un navegador web.

Puedes cambiar el origen de dos formas. La forma más sencilla es abrir el diálogo
HERRAMIENTAS > OPCIONES y en la pestaña CUADRÍCULA Y REGLA aumentar el valor de
la coordenada Y del punto de origen. En general, esto está configurado como el
tamaño vertical de tu página, por lo que debes aumentar el tamaño del margen de
desees ver. Entonces, por ejemplo, si tu página tiene 700 píxeles de alto, cambia el
valor Y de la coordenada de origen de 700 a 720 para agregar un desplazamiento de
20 píxeles.

Como alternativa puedes configurar el punto de origen de forma interactiva. Activa

las reglas con VENTANA > VER REGLAS (Ctrl+L). Luego haz clic y arrastra el botón de
cruce, ubicado en el lugar en que la regla vertical se cruza con la horizontal, en la parte
superior izquierda de lienzo. Ahora, estás desplazando por la posición original, por lo
que coloca la distancia vertical apropiada sobre la esquina izquierda superior de tu
página. Cambiar la posición horizontal del origen no tiene efecto en la posición
horizontal de tu página, por lo que no deberías modificarla.

Capas de fondos de página o de tablero de

dibujo
Si abres la GALERÍA DE PÁGINAS Y CAPAS verás tanto la CAPA DE FONDO DE PÁGINA
como la CAPA DE FONDO DE TABLERO DE DIBUJO. Estas capas contienen objetos que
montan ambos fondos en tu documento.

Estas capas se encuentran generalmente bloqueadas, por lo que no puedes

seleccionarlas para editar su contenido. Sin embargo, puedes desbloquearlas en la
GALERÍA DE PÁGINAS Y CAPAS y realizar cierto tipo de edición limitada para
personalizar el fondo de tu página o tablero de dibujo. Tan solo haz clic en los
símbolos de bloqueo al lado de las capas para desbloquearlas. Una vez
desbloqueadas, puedes hacer actual una capa de fondo (de forma que se dibujan
nuevos objetos sobre ella) o editar los objetos sobre ellas al igual que para las capas
normales.

Si has elegido, por ejemplo, un color diferente para el fondo de página, habrás visto un
rectángulo que quedó seleccionado (mira en la barra de estado) cuando hiciste clic en
el fondo de página. Ahora puedes editar de forma limitada este rectángulo, insertarle
un relleno con gradación con la HERRAMIENTA DE RELLENO o redondear sus esquinas
con la HERRAMIENTA DE RECTÁNGULO .

Si has colocado elementos en el tablero de dibujo (posiblemente tengas gráficos,

fotos u otros trabajos aun no terminados que no quieras que aparezcan como parte
de tu documento web) estos elementos no aparecerán cuando hagas una vista previa
de la página web. Si quieres que aparezcan como parte del fondo, entonces muévelos
hasta la capa FONDO DE TABLERO DE DIBUJO.
308

Las dos estrellas están sobre la capa del tablero de dibujo y por lo tanto aparecen como parte de
la página cuando se haga una vista previa en la ventana del navegador.

Ten en cuenta que una vez que hayas desbloqueado la capa de un fondo, se
comportará exactamente como cualquier otra capa abierta. De este modo, cuando
hagas clic derecho sobre un objeto en la capa de fondo desbloqueada, verás el menú
de capa normal relativo a los objetos sobre la capa y no el menú de la capa de fondo
propiamente, cosa que ves cuando la capa está bloqueada por defecto.

Fondos avanzados
Extender objetos de fondo.

Donde tengas un objeto con un relleno plano, de mapa de bits, vertical u horizontal,
puedes optar por hacerlos un mosaico horizontal para rellenar totalmente el ancho de
la ventana del navegador.

Para hacer que un objeto se exporte de esta manera asegúrate de que el objeto está
en la capa de fondo de tablero de dibujo (consultar "Galería de páginas y capas") y
que la capa esté desbloqueada: haz clic derecho sobre le objeto y selecciona
RELLENAR EL ANCHO DEL NAVEGADOR del menú contextual.

Nota: esta opción solo aparece en el menú contextual de objetos que están sobre la
capa de fondo de tablero de dibujo.

Tendrás una vista previa del objeto a lo ancho del navegador

www.magix.es
 Fondos de página web 309

El rectángulo se visualiza en ancho completo en el navegador (parte inferior)

Nota: esta opción solo funciona de forma eficiente para gradientes verticales y
planos y para rellenos de mapa de bits (tales como relleno de textura). La razón para
ello es que solo estos tipos de relleno se pueden convertir en mosaico de manera
eficiente en el navegador para llenar el ancho de la ventana. Por ello no se
recomienda seleccionar esta opción para otro tipo de objetos, ya que la página
exportada puede incluir archivos png muy grandes y puede que no queden tan bien
como quisieras.
310

Publicar página web

Publicar en MAGIX Mundo Online (MOW)

Para subir tu página web a Internet de forma instantánea puedes publicarla en
MAGIX Mundo Online (MOW, por sus siglas en inglés), que incluye un servicio de
alojamiento web gratuito, o bien publicarla en otro espacio web. Publicarla en Mundo
Online resulta sencillo porque está integrado en Web Designer.

Selecciona "ARCHIVO" > "PUBLICAR PÁGINA WEB " o haz clic en el icono publicar en la
barra de herramientas de la página web.

La primera vez que hagas esto verás aparecer el diálogo de registro de MAGIX
Mundo Online.

Regístrate simplemente usando tu nombre de usuario y contraseña del Mundo

Online: se te habrá suministrado ya con la compra o el registro de Web Designer en la
página web de MAGIX. Otros usuarios pueden hacer clic en el botón REGISTRO
GRATUITO para obtener un nombre de usuario y contraseña para MAGIX de forma
inmediata. Puedes optar por permanecer registrado, lo que significa que cuando
salgas de Web Designer y vuelvas a entrar, estarás ya registrado.

Una vez que te hayas registrado verás el siguiente diálogo:

www.magix.es
 Publicar página web 311

Selecciona la dirección de tu página web en el menú desplegable. También puedes

introducir el nombre de una subcarpeta, p. ej. "página 1", y verás cómo se añade al
final de tus direcciones web en el campo superior. Te será útil si quieres publicar
varias páginas en la misma cuenta de Magix Mundo Online: puedes poner cada una
en una subcarpeta diferente. También es útil si quieres añadir una contraseña para
proteger una carpeta.

Haz clic en PUBLICAR . Tu página web se publicará y verás la ventana de transferencia

de datos que te indica el progreso de la publicación. Cuando la publicación haya
terminado, podrás navegar por tu página web a través del enlace que aparece en la
ventana de transferencia de datos. Publicar en MOW genera automáticamente un
mapa de bits que verás como un archivo mapadebits.xml en tu espacio web de
MOW. Es una lista de las páginas en tu sitio web y ayuda a los buscadores a
encontrar y hacer una lista de todas las páginas de tu sitio.

El botón PROTECCIÓN POR CONTRASEÑA te lleva a MAGIX Online Word, donde podrás
controlar el acceso a carpetas configurando las contraseñas. Puedes crear una lista de
contactos que podrás organizar en grupos de usuarios. Las visitas al área de
protección por contraseña tendrán que facilitar una dirección de correo electrónico y
una contraseña para acceder.

El botón CENTRO DE CONTROL te llevará a MAGIX Mundo Online, donde podrás

administrar tu cuenta así como navegar, ver y eliminar archivos que hayas cargado en
tu espacio web de Mundo Online.

Haz clic en el botón NUEVA DIRECCIÓN WEB si quieres elegir una dirección web
diferente para tu página web. Puedes comprar, por ejemplo, tu propio nombre de
dominio (p. ej. xara.com), en lugar de tener magix.net en tus direcciones web. Si
adquieres otras direcciones web, estas aparecerán en "Tu página web" en la lista
desplegable arriba cuando vuelvas a publicar. Utiliza la opción "Actualizar" de esa lista
para actualizarla en caso de que no incluya todas las direcciones que esperabas ver.
312

Publicar en un alojamiento web alternativo

Si no quieres publicar en MAGIX Online World, tan solo selecciona "Publicar en un
alojamiento web alternativo": así se abrirá la pestaña "Publicar" del diálogo
"Propiedades de web" donde puedes configurar los detalles FTP de una empresa
alternativa.

Debes disponer de la información FTP de tu empresa de alojamiento web: dirección

de host, nombre de usuario, contraseña, ruta completa de carpetas (incluyendo
subcarpetas) que tu empresa de alojamiento web necesita que publiques.

Introducir detalles de publicación

1. Elige en que alojamiento FTP deseas publicar. En este caso elegirás "Otros
alojamientos web" (vía FTP).
2. Haz clic ahora en "Configuración" en la parte superior del diálogo para
configurar tu perfil de usuario FTP (si no estás usando MAGIX Online World).
Se abrirá el siguiente diálogo.

www.magix.es
 Publicar página web 313

1. En el campo "Dirección FTP del alojamiento", introduce la dirección FTP de tu

alojamiento web. Suele ser el mismo nombre de tu dominio, si lo tienes. Por
ejemplo, para usuarios de MAGIX Mundo Online sería Ftp.MAGIX-online.com.
2. En el campo "Nombre de usuario FTP", introduce tu nombre de usuario.
3. En el campo "Contraseña FTP", introduce tu contraseña FTP.
4. El campo opcional "Subcarpeta" permite publicar la página web en una
subcarpeta. Si creas una subcarpeta aquí, todas las páginas en tu sitio web se
publicarán en esta carpeta. El hecho de publicar en una subcarpeta o no,
dependerá de las condiciones de tu servicio de alojamiento web: en alguno de
ellos no necesitarás publicar en una subcarpeta, mientras que otros requieren
que publiques en una subcarpeta "pública" o "www", por ejemplo. Debes
controlar toda la ruta de carpetas FTP que tu empresa de alojamiento web
requiere para que publiques, antes de publicar tu sitio web, puesto que los
requerimientos varían mucho. Por ejemplo, si tu empresa web quiere que
publiques en http://yourdomain.com/public_html, entonces debes escribir
"public_html" en el campo de subcarpeta.
5. Si quieres un mapa del sitio para tu página, o si quieres que se incluya tu página
en la galería de usuarios Xara http://www.xara.com/websitegallery, necesitas
introducir la URL completa de tu página publicada en el campo URL de página
web. Para el mapa del sitio web se genera un archivo llamado mapadelsitio.XML
de forma automática. Es una lista de las páginas en tu sitio web y ayuda a los
buscadores a encontrar y hacer una lista de todas las páginas de tu sitio. Si no
has especificado una URL aquí, al exportar tu página web, no se creará el mapa
de sitio.
6. Haz clic en el botón "Explorar espacio web" para examinar, ver y eliminar
archivos que has subido a tu servidor FTP (opcional).
7. Cuando hayas terminado, haz clic en OK para volver a la pestaña "Publicar" del
diálogo "Propiedades web".
314

Haz clic en OK. Web Designer visualiza un diálogo confirmando los detalles de
publicación que está a punto de utilizar. Haz clic en "Publicar".

Publicar diálogo de detalles

www.magix.es
 Publicar página web 315

Transferencia de datos
1. Tras hacer clic en "Publicar", Web Designer abre una pequeña ventana que
muestra el progreso de la transmisión de datos y te indica cuando la publicación
se haya completado. Si has introducido la URL de tu página web con los detalles
FTP, puedes acceder directamente a ella desde aquí.
2. Como alternativa, tan pronto como la transferencia finalice, podrás abrir una
ventana de navegador e ir a la URL de la página web publicada. Los usuarios de
MAGIX Mundo Online pueden abrir su página web a través de su dirección web
en Mundo Online: http://tunombre.magix.net/publico.

Nota: si introduces una subcarpeta en la pestaña "Publicar" del diálogo "Propiedades

web", la página se guardará ahí.

Importante: si no has asignado ningún nombre de página específico en la galería de

páginas y capas, el nombre que exportes en último lugar se utilizará como base para
todas las páginas de tu sitio web. Por ejemplo, si abres una plantilla de página web,
la exportas como "test" a tu sistema de archivos y la publicas a continuación, se
publicará como test.htm en tu servidor web y las páginas adicionales serán
test_2.htm, test_3.htm etc.

"index.htm" es el nombre común para la primera página de una web.

Nota: muchos servidores utilizan nombres de archivo sensibles a las mayúsculas y

las minúsculas. Así, por ejemplo, la dirección web xara.com/products.htm no es lo
mismo que xara.com/Products.htm. Para reducir la confusión y los posibles errores,
Web Designer obliga a que todos los nombres de página se escriban en minúsculas
y contengan solo caracteres permitidos. Esto significa que los nombre de páginas no
pueden contener espacios. Sugerimos utilizar un guión bajo como separador
alternativo.

Guardar perfiles
Los perfiles te permiten guardar los detalles de publicación en tu ordenador, de modo
que puedas recuperarlos y usarlos de nuevo en el futuro sin tener que introducirlos de
nuevo.

En PERFIL , haz clic en el botón GUARDAR PERFIL e introduce un nombre de perfil

adecuado. Ahora puedes seleccionar el perfil de la lista de perfiles en la parte superior
del diálogo, de forma que puedes usarlos en otros documentos sin tener que
introducirlos. Puedes guardar un perfil tanto con configuración MOW como FTP.

Nota: puedes eliminar un perfil seleccionando en la lista de PERFIL y haciendo clic en

el botón ELIMINAR al lado.
316

Incluir página web en la galería de usuarios

El campo INCLUIR MI PÁGINA EN LA GALERÍA DE USUARIOS solo está disponible si has
añadido una URL válida (o si usas MAGIX Online World). Si seleccionas esta opción,
tras publicar, Tu página es propuesta para ser incluida en la galería de páginas web
creadas por usuarios de Web Designer.

Visita la galería en http://www.xara.com/websitegallery o haz clic en el botón Más

información para saber más.

Publicación rápida (solo archivos modificados)

Deja la casilla PUBLICACIÓN RÁPIDA (SOLO ARCHIVOS MODIFICADOS) seleccionada. De
esta forma la publicación será más rápida en la mayoría de los casos, ya que solo los
archivos modificados desde la última publicación son publicados de nuevo.

Guardar la configuración de publicación en el

documento
Deja activa la casilla GUARDAR LA CONFIGURACIÓN DE PUBLICACIÓN EN EL DOCUMENTO
para tener guardados los detalles de publicación que has introducido en el documento
actual. Esto significa que siempre que abras el documento, tendrá ya los detalles de
publicación en él, por lo que puedes realizar actualizaciones fácilmente.

Cuando actives la casilla "Guardar configuración de publicación en el documento",

también podrás activar la casilla "Guardar contraseña" (no disponible para la
publicación en MOW). Selecciona esta casilla también para guardar la contraseña
FTP para el documento actual, si estás seguro de que eso es lo que quieres. No es
recomendable hacerlo, ya que significa que cualquiera que se haga con una copia de
tu archivo de diseño puede publicar en tu página web sin tener que saber o introducir
tu contraseña.

Cambiar entre cuentas MOW

Solo puedes trabajar sobre una cuenta MOW al mismo tiempo porque con MAGIX
Web Designer 10 Premium solo puedes estar registrado en una única cuenta MOW a
la vez. Por lo tanto, si quieres publicar una página web en una cuenta MOW diferente,
necesitas salir primero de MOW usando "COMPARTIR" > "SALIR" . Luego puedes
volver a registrarte en otra cuenta MOW y publicar como se describe arriba.

Del mismo modo, si cargas un documento de página web que contenga unos datos de
acceso a MOW diferentes a los de la cuenta en la que estás actualmente registrado,
verás aparecer el diálogo de registro de MOW si tratas de publicar ese documento, de
forma que puedas registrarte en la cuenta correspondiente al mismo (de este modo
se cerrará automáticamente la sesión actual de MOW).

www.magix.es
 Publicación de documentos web 317

Publicación de documentos web

Documentos web y PDF

Tal vez la forma más usual de distribuir documentos impresos a una mayor cantidad
de personas sea mediante archivos PDF que se ofrecen como descarga. Desde el
punto de vista del diseño, los sitios webs y HTML están estrictamente restringidos.
Cada navegador muestra el texto de forma diferente y la disponibilidad limitada de
fuentes hace casi imposible asegurar que tu cliente verá exactamente tu diseño. Por
esto, los folletos, informes y todo tipo de documento en los que el diseñador quiera
conservar el control preciso del diseño, fuente, disposición y paginación se crean
como PDF.

Sin embargo, el formato PDF tiene una desventaja: requiere instalar plug-ins o
programas adicionales para poder visualizarlos. Designer Pro X9 presenta una nueva
forma de publicar en estilo "impreso" o documentos de tipo DTP que no implica la
utilización de PDF.
• Libre uso de fuentes. La capacidad de utilizar una amplia variedad de fuentes.
Puedes usar tus fuentes instaladas (las fuentes que se incluyen
automáticamente siempre que la licencia lo permita) o las más de 600 fuentes
de Google Fonts.
• Fotos y gráficos de alta resolución. Diseño libre: combina gráficos y texto en
cualquier lugar de la página.
• Resultados "lo que ves es lo que obtienes" con píxeles precisos. El documento
que diseñas en Designer Pro es exactamente lo que verá quien lo mire, con las
mismas fuentes, diseño y paginación.
• Sin necesidad de instalar ningún plug-in o lector independiente. Las páginas se
crean en HTML5. Tu documento es un documento web.
• Este formato es compatible con todos los navegadores modernos, incluyendo
dispositivos portátiles y tablets, y podrás desplazarte rápidamente y de forma
fluida por todo el documento.
318

Trabajar con fotos

Introducción
Actualmente, las fotos son una parte integral de casi todo trabajo creativo, de sitios
web, flyers, folletos, DTP y más.

El Manejo de fotos en Web Designer es diferente al que puedes haber usado con
otros programas de diseño gráfico.

En MAGIX Web Designer 10 Premium puedes colorear, cortar, copiar, mezclar,

enmascarar, difuminar (decolorar los bordes de) fotos, todo lo que quieras. La
naturaleza orientada al objeto, no destructiva, del manejo de fotos significa que, por
ejemplo, cuando cambias el tamaño de una foto, no estás alterando realmente la foto
original, sino que sólo estás modificando una copia visual. La imagen original con la
resolución total se guarda en el archivo .web de modo que posteriormente puedes
editar, volver a cambiar el tamaño o aplicar cualquiera de las opciones de edición de la
herramienta de fotos sin ninguna pérdida de calidad. Incluso puedes "descortar" fotos
recortadas.

El manejo de fotos es increíblemente rápido. Puedes abrir una foto de 50 megapíxeles

y efectuar cualquiera de las operaciones de optimización y girar la imagen con su
resolución total en tiempo real.

Este capítulo cubre los principios básicos de manipulación de fotos e imágenes de

mapas de bits en MAGIX Web Designer 10 Premium. El funcionamiento de la
Herramienta de fotos está contemplado en el capítulo Herramienta de fotos.

Imágenes de alta resolución

Las imágenes de alta resolución del mismo tipo que las imágenes de dispositivos
Retina(R) de Apple se pueden crear ahora automáticamente con Web Designer.

Para poder aprovechar las pantallas de tipo Retina es necesario, por lo general, crear
todas tus fotos y gráficos de páginas web con una resolución al menos de 96 dpi: esto
es el doble de píxeles por pulgada tanto vertical como horizontalmente, lo que cuatro
veces más píxeles por pulgada cuadrada. La parte negativa es que tus archivos serán
ahora más de cuatro veces mayores, reduciendo la velocidad de tu página web para
todos tus visitantes. Para aquellos visitantes de tu web que no tienen pantallas de alta
resolución esto es ciertamente injusto.

Web Designer resuelve este problema creando de forma automática fotos y gráficos
de alta resolución y actuando de manera inteligente al cargar los gráficos con la
resolución adecuada para el navegador que se está usando.

www.magix.es
 Trabajar con fotos 319

Esto significa que no se penaliza con una reducción de la velocidad para aquellos
visitantes sin Retina, pero aquellos que tienen navegadores de alta resolución
conseguirán ver la imágenes al doble de resolución y páginas web de mayor cantidad.

La creación de imágenes de alta resolución está activada por defecto: cuando

exportes tu página web, un visitante Retina o de alta resolución verá las imágenes y
gráficos con mayor resolución, mientras que un visitante estándar verá imágenes de
resolución normal. Lo único que tienes que hacer: asegúrate de que las imágenes que
quieres que aparezcan con alta resolución están guardadas en tus páginas web con
una resolución mayor que 100 dpi, ya que este es el punto límite en el cual Web
Designer asume que quieres que la imagen se renderice como alta definición.
Imágenes con una resolución inferior a 100 dpi permanecerán como imágenes de
definición estándar. No tendrás que preocuparte de esto por lo general, ya que, con la
función activada por defecto, todas las imágenes se optimizan a 192 dpi en el diálogo
OPTIMIZAR FOTO , por lo que quedan por encima del umbral de creación de imágenes
de alta resolución.

Ten en cuenta que debido a las imágenes de mayor tamaño y al hecho de que se
necesitan tanto las imágenes de alta resolución como las de resolución normal,
publicar páginas Retina lleva más tiempo que publicar páginas no Retina. Si deseas
deshabilitar la función, ve a la pestaña "PROPIEDADES DE WEB" > "PÁGINA WEB"
situada en el menú HERRAMIENTAS , o bien haz clic derecho sobre tu documento web
y selecciona "PROPIEDADES DE PÁGINA WEB" > "PÁGINA WEB" . Entonces desactiva la
casilla IMÁGENES RETINA (ALTA DEFINICIÓN) en la parte inferior del diálogo.

Si desear volver a formatear una página de definición estándar creada con una
versión anterior de Designer a una con imágenes de alta resolución, ten en cuenta
que tendrás que importar fotos de nuevo a Web Designer con la función Retina
activada.

Consulta Optimizar fotos y mapas de bits para más información sobre la resolución
de imágenes.

Objetos de fotos
En Web Designer las fotos (o mapas de bits) son simplemente otro tipo de objeto en
la página. Puedes arrastrar y soltar fotos en la página de tu explorador, y luego puedes
redimensionarlas, girarlas, copiarlas y moverlas como cualquier otro objeto. Puedes
ajustar la transparencia, incluso la transparencia con gradación, difuminar los bordes y
cortar y recortar formas extraídas de fotos con gran facilidad. la opción de
transparencia te deja mezclar, combinar o crear fotos compuestas.
320

Donde en otros programas deberías usar capas, en MAGIX Web Designer 10

Premium cada objeto está sobre su propia capa y, también con cada objeto de la
página, puede traerlo hacia el frente o hacia atrás de otros objetos.

Grupos de foto
Si editas una foto con alguna herramienta, como la HERRAMIENTA DE OJOS ROJOS
INTEGRADA , la foto se agrupa con otros objetos que modifican la imagen de alguna
forma. Por ejemplo, con la HERRAMIENTA DE OJOS ROJOS , las formas de elipse que se
utilizan para modificar las áreas de ojos rojos de la foto se agrupan con la foto en sí
misma. Esto se llama GRUPO DE FOTO y lo verás en la línea de estado cuando
selecciones una de estas fotos modificadas.

Al igual que un grupo usual, el grupo mantiene a la foto unida con los demás objetos
que se añadieron para modificarla, pero las HERRAMIENTAS DE FOTO y otras
herramientas lo tratan como si fuera una foto usual. En general, los grupos de foto se
colocan automáticamente dentro de un objeto de ClipView, que recorta los objetos
que superponen los bordes de las fotos hasta los límites de la foto misma. Por ello,
cuando seleccionas un grupo de fotos en la línea de estado generalmente muestra
que has seleccionado un "grupo de foto recortado". Consulta el apartado Clipview de
Manejo de objetos para obtener información sobre clipviews.

Diferencias entre los grupos de foto y las fotos:

• Los grupos de fotos reúnen una foto simple y algunas ediciones vectoriales.
• Puedes arrastrar una foto por su forma de corte en la HERRAMIENTA DE RELLENO
pero no puedes hacer lo mismo con los grupos de fotos (selecciona dentro y
mueve la foto base o haz clic derecho para abrir el menú contextual y
seleccionar los objetos recortados y luego arrástralos en la herramienta de
selección).
• Algunas operaciones convertirán los grupos de fotos en fotos.

Si quieres convertir un grupo de fotos en un objeto de foto común, puedes usar

HERRAMIENTA > OPTIMIZAR FOTO para hacerlo. Pero ten en cuenta que esto es
destructivo y que luego no podrás modificar ninguna de las ediciones que aplicaste a
la foto. Otras operaciones, como la modificación de tamaño con contenido y el
contone, también convierten grupos de foto en fotos planas porque estas operaciones
no pueden preservar la estructura del grupo de foto. Cuando un grupo de foto debe
convertirse de esta forma, aparece primero un mensaje de advertencia.

www.magix.es
 Trabajar con fotos 321

Importación de fotos
MAGIX Web Designer 10 Premium es compatible con una muy amplia gama de tipos
de fotos o mapas de bits, incluyendo JPEG, PNG, TIFF e imágenes RAW de cámaras
digitales, así como muchos tipos más. El término "mapa de bits" es el término general
que abarca todos los tipos, pero intercambiable con la palabra "foto".

El modo más fácil de abrir una imagen es arrastrando la foto o el archivo de mapa de
bits desde tu explorador de Windows hasta la ventana de Web Designer. O bien,
puedes seleccionar las opciones de menú ARCHIVO > ABRIR o IMPORTAR .

Al importar fotos de alta resolución (cualquier imagen con más de 1.920 píxeles de
alto o ancho) en un documento web (incluyendo presentaciones), MAGIX Web
Designer 10 Premium cambia automáticamente el tamaño de la foto para ajustarlo al
tamaño de pantalla HD, sin preguntar si deseas importarla con una resolución menor.
Para un documento web, aun con el tamaño reducido, debería haber más que
resolución suficiente en tus fotos para resultados de alta calidad en tu página web,
por lo que raramente es necesario importar imágenes de cámaras digitales con su
resolución completa para usar en la web.

Sin embargo, si estás importando una foto grande en un documento animado, MAGIX
Web Designer 10 Premium te preguntará si deseas importar una versión de menor
322

resolución de tus fotos. Si el documento incluirá muchas fotos, es posible que quieras
utilizar esta opción de resolución reducida. De lo contrario, si contiene varias fotos, el
tamaño del archivo de diseño será mucho más grande de lo que debería ser (porque
contiene una copia de cada una de tus fotos) y es posible que no dispongas de
memoria suficiente en tu equipo para cargar, editar y exportar tu documento. Si
arrastras y sueltas sobre una foto existente, esta se reemplazará. Arrastra hasta el
fondo para importar como una foto individual.

Sustituir fotos
Si arrastras y sueltas un archivo de foto (desde el Explorador de Windows o desde la
galería de mapas de bit) hasta una foto existente, esta se reemplazará pero
mantendrá el mismo contenedor o tamaño de frame. Esto facilita la sustitución de
fotos en plantillas. Puedes usar la HERRAMIENTA DE RELLENO para ajustar el tamaño, la
posición y el ángulo de la foto dentro de su contorno. Esto no es válido para
documentos de foto (en la página 342), donde al soltar una foto en la página siempre
la importará como un nuevo documento.

Cuando reemplazas una foto o mapa de bits de esta manera, se adaptará de la mejor
forma posible al contorno de la imagen existente. Si mantienes presionada la tecla
"Shift" al reemplazar una foto, la nueva cabrá en las mismas dimensiones y rotación
que la foto anterior. Esto es útil para cuando ajustes manualmente la escala o rotación
de un relleno y luego quieres sustituir la imagen por otra que tenga la misma relación
de aspecto.

Si existen múltiples copias de la misma foto en una página, en el mismo grupo suave,
por ejemplo, una pequeña vista en miniatura y una versión más grande en una capa
popup, cuando haces clic y arrastras para reemplazar, todas las copias de la foto de
ese grupo suave se reemplazarán con la foto nueva.

Sustitución de múltiples fotos en simultáneo

La mayoría de las plantillas web incluidas en la GALERÍA DE DISEÑOS te permitirá
reemplazar varias imágenes al mismo tiempo, si arrastras y sueltas muchos archivos
de imagen desde el Explorador hasta el lienzo. O utiliza la opción ARCHIVO >
IMPORTAR y selecciona varias imágenes en el diálogo de archivo (Ctrl+clic añade la
selección actual, Shift+clic te permite seleccionar un rango de archivos).

Las fotos entrantes se utilizan para sustituir las imágenes en el documento. De la

misma forma que cuando importas fotos individuales, se te preguntará si deseas
importar versiones de tamaño reducido, si tus fotos son muy grandes. La sustitución
se realiza de izquierda a derecha y desde arriba hacia abajo (el orden de lectura
normal). Si no arrastras la cantidad suficiente de fotos para sustituir todas las fotos
reemplazables, puedes continuar importando fotos de la misma manera. La
sustitución continúa a partir de la siguiente foto sin reemplazar. Así, puedes llenar
rápidamente el diseño con tus fotos.

www.magix.es
 Trabajar con fotos 323

Si importas más fotos de las que pueden acomodarse en la página actual, también se
sustituirán las fotos de las siguientes páginas con las fotos entrantes restantes. Si
todavía quedan fotos entrantes, la página actual se duplica todas las veces que sea
necesario para acomodar todas tus fotos.

Esto significa que puedes crear rápidamente una página web con una galería de tus
fotos. Simplemente escoge una plantilla de galería de la GALERÍA DE DISEÑOS y luego
importa todos los archivos de fotos que desees. La página se copia todas las veces
que sea necesario para que entren todas tus fotos. Asegúrate de escoger la opción de
tamaño reducido si importas muchas fotos.

Utilización de fotos como relleno

También puedes usar cualquier mapa de bits como relleno para cualquier forma de
dibujo. Simplemente arrastra el archivo sobre la forma (que puede ser de tu sistema
de archivos, o de las Galerías de mapas de bits o de rellenos), y presiona "Shift" antes
de soltar. Esto sustituirá el color de relleno existente por un mapa de bits, adaptado al
objeto. Puede usar otra vez la HERRAMIENTA DE RELLENO para ajustar el tamaño, la
posición y el ángulo.

Tamaño de foto inicial

Cuando importas una foto grande, su tamaño se reduce a HD (1920 x 1080), si es
más grande, en documentos animados e impresos se te preguntará primero. Su
tamaño se modifica a 500 píxeles de ancho en la página. Para reducir el tamaño,
solamente arrastra desde una de las esquinas usando la herramienta de selección, o
introduce un nuevo ancho en el campo de la barra de información de la herramienta
de selección.

Si reemplazas una foto mediante arrastrar y soltar, entonces la foto se adaptará

exactamente al contenedor, es decir, su tamaño y la resolución dependerá del tamaño
del contenedor.

Copias de memoria cero

Una de las diferencias más revolucionarias entre Web Designer y otros softwares es
que, cuando copias cualquier foto en la página, realmente no realiza una nueva copia
completa de la foto original importada, sino que muestra simplemente otra "vista" de
la imagen original. El motor de renderización de Web Designer es lo suficientemente
rápido como para mostrar cualquier cantidad de copias de la misma imagen al vuelo.
Esto te permite ahorrar gran espacio de memoria y reduce drásticamente el tamaño
de los archivos.
324

Esto no limita lo que puedes realizar con cada copia, puesto que se tratan de forma
completamente independiente. Cada copia no tiene que ser idéntica. Puedes editar
cada una como quieras, redimensionándola, girándola, cortándola, coloreándola o
aplicándole una amplia gama de efectos de foto y de transparencia. Todo, sin ocupar
espacio en la memoria ni aumentar el tamaño del archivo original.

Este ejemplo muestra las copias separadas de la misma imagen, cada una manipulada
de un modo diferente. Cada una conserva la resolución total del JPEG original
importado, como puedes ver en la imagen de la derecha. La memoria (RAM y el
tamaño de archivo) no es superior al tamaño de JPEG original.

La galería de mapa de bits

El capítulo Manejo de documentos (en la página 94) cuenta con información
general acerca de las galerías.

La GALERÍA DE MAPA DE BITS muestra todo los mapas de bits o fotos usadas en
cualquier documento, con la información de su tamaño de píxeles y el tamaño de
archivo.

Puedes abrirla con clic en la barra de galerías, desde el menú HERRAMIENTAS >
GALERÍAS , o con "F11".

www.magix.es
 Trabajar con fotos 325

Este ejemplo muestra la GALERÍA DE MAPAS DE BITS para el documento de arriba, y

muestra la imagen JPEG original de la joven que es integrada al archivo .web nativo.
Como se menciona anteriormente, todas las copias de esta imagen se muestran
directamente desde el archivo original, y sólo se muestra la imagen sola y no las
cuatro variantes que aparecen en la página.

Se muestra la siguiente información de ayuda acerca de la imagen original:

• Nombre de archivo del JPEG original
• El tipo de archivo, en este caso un JPEG, y el tamaño de archivo, 1.006 K. (Este
es el tamaño original del archivo, y también cuánto lugar de archivo .web
ocupará esta imagen.)
• Las dimensiones de píxeles del original, el tamaño de megapíxeles (en este caso
sólo inferior a 2 MP)
• La profundidad de color, en este caso "24 bit", a veces se denomina color
verdadero (true color). La imagen Xara es una imagen de 4 bit.
• La resolución original de la imagen, en estos casos 96 dpi
326

La GALERÍA DE MAPAS DE BITS siempre contiene un mapa de bits por defecto, con la
imagen de Xara en gris. Se utiliza como mapa de bits por defecto para rellenos de
mapas de bits y en casos donde faltan otros mapas de bits. Es útil tenerlo también
como marcador de posición.

Como con todas las galerías, puedes arrastrar los objetos de la galería a la página para
crear una nueva copia. O puedes seleccionar una imagen en la galería y hacer clic en
uno de los botones superiores. El apartado siguiente muestra detalladamente cómo
utilizar los controles de la GALERÍA DE MAPAS DE BITS , que en su mayoría están
pensados para usuarios más avanzados.

Relleno de formas con un mapa de bits

Selecciona la forma en la página, luego selecciona el mapa de bits en la galería y haz
clic en el botón de relleno. O bien, arrastra la imagen de la GALERÍA DE MAPAS DE BITS
y suéltala en cualquier forma mientras mantienes pulsada "Shift". Puede ajustar el
tamaño, el ángulo, etc. en la HERRAMIENTA DE RELLENO.

Ajuste de una transparencia de mapa de bits

Esto es para los usuarios más avanzado. Puedes usar cualquier mapa de bits como
una máscara de transparencia sobre cualquier forma rellena o mapa de bits. La
luminosidad del mapa de bits afecta la transparencia del objeto seleccionado. El
tamaño de transparencia del mapa de bits, la rotación y segmentación pueden ser
controlados desde la barra de información de la HERRAMIENTA DE TRANSPARENCIA (en
la página 244).

Eliminar imágenes de la galería

Cuando eliminas un mapa de bits de la página, permanece en la GALERÍA DE MAPAS DE
BITS . Cualquier mapa de bits no utilizado será eliminado del archivo cuando sea
guardado y vuelto a abrir. Sin embargo puedes eliminar cualquier mapa de bits
seleccionándolo y apretando el botón SUPRIMIR . Si el mapa de bits es usado en el
documento, será sustituido en el mapa de bits estándar de Xara.

Ajuste del fondo de la página para un mapa de bits

Selecciona el mapa de bits en la galería y haz clic en el botón FONDO. Se abrirá un
menú que te permite elegir entre la configuración del FONDO DEL TABLERO DE DIBUJO o
el FONDO DE PÁGINA . Cuando configuras el fondo del tablero de dibujo, si la imagen es
más estrecha que la página, se asume que quieres tener la imagen en mosaico para
rellenar por completo el fondo del navegador. De otra forma la imagen se aplica como
un único segmento. Puedes cambiar esta configuración haciendo clic derecho en el
tablero de dibujo y buscando en el submenú "Fondo de tablero de dibujo".

También puedes aplicar una imagen en el fondo sin usar esta galería: tan solo haz clic
en la imagen y consulta las opciones en el menú contextual.

www.magix.es
 Trabajar con fotos 327

Consulta Fondos de página web (en la página 302) para más información.

Guardar
Seleccionando el mapa de bits y haciendo clic en GUARDAR , guardarás la imagen
original. En el caso de JPEG integrada, se guardará el archivo JPEG original. Otros
tipos de mapas de bits se guardan mejor como tipos de mapa de bits PNG.

Propiedades del mapa de bits

El botón PROPIEDADES te mostrará la información del mapa de bits seleccionado en la
galería. Esta opción también te da la posibilidad de evitar que se suavicen las
imágenes cuando se amplían los mapas de bits. Por lo general, todos los mapas de
bits se suavizan cuando se amplían, o se agrandan con el zoom en la pantalla. Hay un
cuadro de selección en el diálogo de Propiedades para desactivar esta característica
para que puedas ver cada píxel cuando amplías con el zoom.

Esto también proporciona la información de las propiedades de animación del mapa

de bits. Esto es realmente aplicable sólo a imágenes GIF animadas.

ANIMACIÓN GIF:

• RETARDO (el tiempo en que el frame es dejado en pantalla)

• RESTAURAR: La configuración de GIF animado fija lo que ocurre entre cada frame
de un GIF animado. Nada significa que no se efectúa ninguna acción. Numerosos
navegadores interpretan que esto significa lo mismo que la opción Conservar
como es. Conservar como es visualiza los frames uno encima de otro - esto deja
visibles muchos frames en un stack si algunos son transparentes. Algunos
navegadores borran la animación antes de reproducir más loops, mientras que
otros no. El fondo restaura el área cubierta por el color de fondo del GIF (blanco,
por lo general). Restaurar anterior restaura el área cubierta por el frame
dejándola como era antes de visualizarse el frame. Esto algunos navegadores lo
interpretan como borrar la imagen y mostrar el fondo, mientras que otros
navegadores lo interpretan como mostrar el frame encima del frame anterior.
Como los navegadores lo interpretan de modo diferente, deberás experimentar
hasta conseguir los resultados deseados.

Archivos JPEG integrados

Los archivos JPEG están enormemente comprimidos en relación a su estado original,
siendo hasta 10 veces más pequeños que la imagen original. En el ejemplo de arriba,
la imagen original no comprimida requiere más de 7 MB de memoria, pero en la
GALERÍA DE MAPAS DE BITS sólo tiene 1 MB. Una reducción muy significativa. Por eso
las imágenes JPEG son el tipo de archivo estándar para la fotografía digital y para
utilizar en Internet. Cuando arrastras y sueltas un archivo JPEG (o usas las opciones
de menú "Abrir" "o Importar") el JPEG original es almacenado en el documento, y
esto es lo que queda guardado en el archivo .xar cuando guardas tu documento.
328

Es importante entender como se diferencia de otras herramientas de gráficos, tanto

en software de dibujos vectoriales como de programas de edición de fotos. Otros
productos descomprimirán la imagen y almacenarán la imagen no comprimida
"cruda" en la memoria y el archivo nativo cuando lo guardas en disco. Lo que no es
más que una copia completa de la imagen original cruda, como se menciona
anteriormente. Haz cuatro copias de tu foto y guarda el archivo, y será cuatro veces
más grande. En MAGIX Web Designer 10 Premium el archivo no se agranda, no
importa cuantas copias hagas.

Al incrustar el archivo JPEG original en vez de guardar la imagen no comprimida,

existe un ahorro de tamaño de archivo mayor a 7:1 comparado con otros programas
de diseño gráfico. Al haber cuatro copias completas de la imagen significa, en este
caso particular, que la memoria usada es más bien 30 veces menor. Por lo tanto,
representa un enorme ahorro de tamaño (y de tiempo) en comparación a otras
herramientas de gráficos*.

*Es fácil para comprobar. Importa un JPEG a tu editor de gráficos favorito, haz cuatro copias, y
haz algunos pequeños cambios en ellas, coloreándolas, rotándolas, o desenfocándolas. Luego,
guarda el archivo nativo y compáralo con el tamaño del JPEG original, y el equivalente archivo
.Xar. Un archivo .Xar nativo tendrá apróximadamente el tamaño del JPEG original, no importa
cuántas copias de la imagen sean hechas.

Extracción del JPEG original

Haz clic derecho sobre cualquier imagen en la GALERÍA DE MAPAS DE BITS y escoge la
opción de menú GUARDAR para guardar el JPEG original en tu sistema de archivos.

Calidad de visualización de fotos

MAGIX Web Designer 10 Premium puede mostrar fotos en uno de cinco niveles de
calidad. Las dos primeras configuraciones, suavizan los píxeles de pantalla para evitar
píxeles visibles o secciones no fluidas en los extremos (antialiasing). Cambia el nivel
de calidad con la entrada CALIDAD en el menú VENTANA .

MUY ALTA Muestra imágenes mediante sampleo bicúbico. Esto permite ver
CALIDAD (POR las imágenes en la mejor calidad, en particular para imágenes
DEFECTO) grandes de alta resolución que son altamente reducidas o
ampliadas con zoom.
ALTA CALIDAD Antialiasing activado, pero las imágenes se renderizan lento y con
una calidad baja.
COLOR TOTAL Sin antialiasing, por lo que se ven los píxeles individuales. Esto
puede ser útil cuando amplíes con el zoom y necesites ver cla-
ramente los pixeles de la imagen por separado. El inconve-niente
es que las imágenes generalmente se ven pobres cuando reduces
o amplías causando un pixelado claramente visible y bordes
"escalonados" dentados, sobre todo si haces girar la imagen.

www.magix.es
 Trabajar con fotos 329

CONTORNOS CON Es particularmente útil para ver los contornos de los diferentes
PASOS DE pasos de una transición. MAGIX Web Designer 10 Premium no es
TRANSICIÓN compatible con transiciones pero los archivos .xar importados
pueden contenerlas.
CONTORNO Sólo se ven los contornos de los objetos. Esto es útil para buscar y
seleccionar objetos que son difíciles de ver debido a otros objetos
que se encuentran delante o detrás de ellos.

Hay un control adicional que te permite frenar todo antialiasing o suavizado de

imagen en imágenes que son reducidas o ampliadas con zoom. En otras palabras, en
vez de una imagen suavizada, verás todos los pixeles cuando amplíes con zoom. Abre
la GALERÍA DE MAPAS DE BITS y haz clic derecho sobre la imagen y seleccione
"propiedades". En el diálogo desactiva la selección de "Suavizar al aumentar tamaño".
Ahora, no importa la calidad que utilices para la imagen (y todas las copias), siempre
se visualizarán los píxeles no suavizados cuando amplíes o reduzcas con zoom.

Atención: Si usas el control de Desenfoque/Enfoque de la Herramienta de fotos,

entonces las imágenes tienen que ser mostradas en la calidad máxima. Así que si
piensas que la calidad de visualización ha dejado de funcionar, es casi seguro que
has desenfocado o enfocado la imagen con la Herramienta de fotos.

Guardar y exportar fotos

Al seleccionar la opción GUARDAR siempre se guardará un archivo .web nativo. Para
guardar una foto como JPEG, PNG u otro tipo de archivo de imagen, es necesario usar
la opción EXPORTAR o el shortcut "Ctrl + Shift + E".

Hay dos íconos disponibles en la barra superior que son shortcuts para
guardar la selección como JPG o PNG. Estos se encuentran en la barra
desplegable cuando colocas el cursor sobre el icono de exportación
HTML.

Recomendamos guardar las fotos como JPEG (a veces llamado JPG), ya que ofrece la
mejor relación tamaño/calidad.

Cuando exportas JPEG o PNG, aparece la opción CONFIGURACIÓN en el diálogo

Guardar. Al seleccionar esta opción se obtienen muchas alternativas de exportación
avanzadas y se pueden comparar diversos ajustes e incluso tipos de archivos
alternativos como por ejemplo PNG.

Cuando exportas un JPEG, aparece una ventana con una vista previa de exportación
donde puedes ajustar muchas opciones de exportación y comparar ajustes
alternativos o tipos de archivo alternativos como PNG.
330

La ventana de vista previa de exportación te permite ajustar el tamaño, la resolución,

la calidad del JPEG y, además, seleccionar entre 3 tipos de archivos de exportación
alternativos. Los valores por defecto deberían ser los correctos para todas las tareas
comunes y puedes pulsar simplemente el botón de exportación para guardar tu foto.

Aspectos para tener en cuenta al exportar:

• Primero selecciona el objeto o los objetos que quieres exportar
• El tamaño por defecto de la imagen exportada será del tamaño que veas en la
pantalla con el zoom al 100%.

La ventana de Vista previa de exportación (en la página 456) está descrita más
detalladamente aquí.

Consejo: Puedes controlar la calidad de JPEG en el diálogo configuración de

exportación de la pestaña de Opciones. El valor estándar y recomendado es 85%.

El sistema JPEG está diseñado de

manera tal que un ajuste de 85 es el
valor óptimo. Te recomendamos que no
guardes archivos JPEG con calidad del
100%, ya que los resultados son
visualmente idénticos a la calidad del
85%, sólo que el tamaño de archivo y
uso de memoria aumenta drásticamente
sin beneficio alguno.

Se puede bajar la calidad por debajo de 85 para que se vea más rápido la página en la
web. La ventana de vista previa muestra la calidad de cualquier valor que selecciones.

Consejo: Si crees que vas a seguir editando la imagen exportada, como cambiar el
tamaño de la imagen, te recomendamos que guardes el archivo .web también. Esto
preservará la imagen original sin pérdida de calidad.

Ejemplo para cambiar el tamaño de una foto y guardarla

en JPEG.
este proceso es muy rápido y simple:
• Suelta tu foto en MAGIX Web Designer 10 Premium (en una página en blanco o
en la barra de título)

www.magix.es
 Trabajar con fotos 331

• Ve a la herramienta de selección, arrastra el control deslizante de una esquina

para cambiar el tamaño de la imagen, o introduce el ancho o la altura requerida
en los campos correspondientes de la barra de información. El tamaño de la
imagen será correcto cuando esté al 100%.

• Haz clic en el botón "Exportar selección como JPG" en la barra superior.

• Introduce un nombre de archivo, haz clic en el botón CONFIGURACIÓN si
necesitas controlar la compresión o simplemente haz clic en GUARDAR .

Para guardar la imagen en formato PNG, repite los mismos pasos de arriba pero
selecciona la opción PNG en el menú desplegable del tipo de archivo.

Atributos de la edición de fotos

Todas las ediciones realizadas con la HERRAMIENTA DE FOTO (en la página 344),
como cambiar el brillo, el contraste, el color, los valores de enfoque o desenfoque,
serán guardadas sobre la foto como atributos de Web Designer.

Tal como puedes cambiar el color de una forma o de una línea sin cambiar la forma
subyacente, los atributos de la herramienta de foto cambian la apariencia de la foto
pero sin afectar la imagen original (a esto se le llama edición no destructiva). Otra
forma de explicar esto es que MAGIX Web Designer 10 Premium sólo guarda una
lista de las ediciones aplicadas a tu foto; puedes cambiar, quitar o añadir nuevas
ediciones. Siempre podrás recuperar la foto original sin retocar, incluso luego de haber
cambiado el brillo, haberle cambiado el tamaño, o incluso luego de haberla cortado o
recortado.

Los atributos se pueden copiar y pegar entre distintos objetos. Esto no sólo se aplica
solamente a los atributos tradicionales como el color o el ancho de la línea, también
funciona con todos los atributos de la HERRAMIENTA DE FOTO. Esto significa que
puedes copiar todas las optimizaciones que le hayas hecho a la foto a otro
documento, utilizando la función "copiar/pegar atributos".

Esto también vale para todos los otros atributos de la foto, como color y ancho de
línea, coloreado de foto (contoning), sombras, etc.; todos estos atributos se pueden
copiar de una foto a otra usando la misma técnica.

Editar el contorno de las fotos

Puedes utilizar la herramienta de EDICIÓN DE FORMA para ajustar directamente el
contorno exterior de una foto. De la misma manera, puedes aplicar contornos para
cualquier forma, sombra, etc.
332

Utilizando la HERRAMIENTA DE EDICIÓN DE FORMA

puedes achicar o agrandar la forma de sus
esquinas. Este ejemplo también tiene un contorno
negro y una sombra suave. Para restaurar la
imagen a la forma rectangular original, selecciona
"deshacer corte" en el modo de corte en la barra
de información de la HERRAMIENTA DE FOTOS .
Cuando se editan las fotos de esta forma, se
tratan como si fueran una forma vectorial normal
con relleno de mapa de bits. Por eso puedes usar
las herramientas de edición para crear una línea o
cambiar la forma, e incluso puedes usar la
HERRAMIENTA DE RELLENO para ajustar el tamaño,
el ángulo y la posición del relleno de la foto
adentro de la forma.

Recortar fotos
La forma más fácil de recortar una foto es
arrastrarla mientras te encuentras en la
HERRAMIENTA DE OPTIMIZACIÓN o también
puedes arrastrar uno de los 8 controles
deslizantes alrededor de la foto para ajustar el
borde de cualquier foto seleccionada.

Para un manejo más avanzado del recorte, selecciona el BOTÓN CLIP en la

herramienta de fotos de la barra de información, ya que te permitirá definir la
relación de aspecto, así como usar el recorte numérico preciso.

Asimismo encontrarás un botón Deshacer corte que borra cualquier rectángulo de

corte y restaura la imagen original.

Una función importante es que la herramienta de recorte es realmente dinámica, en

otras palabras, el recorte no es destructivo y el borde del recorte puede ajustarse
luego para mostrar partes ocultas de la foto. Si realmente quieres cortar, es decir,
realizar un recorte destructivo que elimine las partes invisibles de una imagen, utiliza
la función Optimizar foto.

Recortar fotos con una máscara

Si quieres crear formas de foto no rectangulares o cortar partes de una foto, utiliza
una máscara. Primero selecciona la foto y luego la HERRAMIENTA DE MANO ALZADA de
la barra desplegable de herramientas de máscara.

www.magix.es
 Trabajar con fotos 333

Usa la "Herramienta de mano alzada" para dibujar una forma de máscara

cerrada alrededor de la parte de la foto que quieres recortar.

Cambia a HERRAMIENTA DE SELECCIÓN y selecciona la foto bajo la máscara o elimina la

selección (presiona "Esc"). Ahora al copiar ("Ctrl+C"), se copiará solamente la parte
sin máscara de la foto en el búfer de pegado. Ahora pulsa "Eliminar" y la parte sin
máscara se eliminará. O presiona "Ctrl+C" para cortar. También puedes usar la
máscara para aplicar operaciones de forma "ARREGLO" > "COMBINAR " con ella.

Consulta el capítulo Máscaras (en la página 263) para más información acerca del
uso de máscaras.

Herramienta Capturar pantalla

Esta herramienta ofrece algunas ventajas con respecto al método mencionado
anteriormente, incluyendo la opción de capturar el cursor del ratón en la imagen.
ÁBRELA CON HERRAMIENTAS > CAPTURA DE PANTALLA.

ÁREA DE PANTALLA: aquí puedes escoger el área de pantalla que quieres capturar.
Puedes capturar toda la pantalla, la ventana activa en su totalidad o simplemente el
contenido de la ventana activa sin el borde de ventana.
334

OPCIONES: aquí puedes escoger si deseas incluir el cursor en la captura de pantalla.

También puedes decidir si deseas capturar una sola imagen o mantener la
herramienta activada durante la sesión para poder realizar capturas consecutivas
cada vez que pulsas el shortcut asignado.

La sección de resultado te permite escoger la forma en que manejarás la imagen de

pantalla. Por defecto, se insertará directamente en el diseño actual de MAGIX Web
Designer 10 Premium. Como alternativa puedes también guardar cada captura de
pantalla como archivo BMP (mapa de bits de Windows) o PNG en cualquier carpeta.
Los archivos creados se denominarán "ScreenCapture", "ScreenCapture1,
"ScreenCapture2" y así sucesivamente. Selecciona la CARPETA DE DESTINO para los
archivos con el botón EXPLORAR...

Puedes definir casi cualquier combinación de teclas (Shift, Alt, Ctrl + tecla) para
activar la captura de pantalla. Simplemente haz clic en el campo de shortcut y
después selecciona la combinación de teclas deseada, p. ej. "Ctrl+S". El shortcut
escogido aparecerá en el campo de shortcut. Si se superpone con cualquier otro
shortcut definido en MAGIX Web Designer 10 Premium recibirás una advertencia en
la parte inferior del diálogo, pero esto no importará si están abiertas otras ventanas al
tomar capturas de pantallas. Presiona RESTAURAR para regresar al shortcut
seleccionado previamente.

En vez de utilizar una tecla de shortcut para tomar la captura de pantalla, puedes usar
la opción TIEMPO. Esto es útil en los casos en que cualquier movimiento en el teclado
cambia la pantalla que quieres capturar, como en el caso de un consejo de
herramienta que es probable que desaparezca cuando presiones una tecla. Selecciona
la opción de tiempo e introduce el valor de retraso en segundos. La captura de
pantalla se tomará automáticamente una vez que haya transcurrido el tiempo
específico. El temporizador comenzará ni bien hagas clic en el botón INICIAR .

Al pulsar el botón INICIO se cerrará el diálogo de captura de pantalla y se activará el

shortcut de sistema. Cambia a la ventana que quieres capturar y pulsa la combinación
deseada o espera que el tiempo pase si has escogido la opción de tiempo. La captura
de pantalla se toma y se inserta en Web Designer o se guarda en el archivo según la
opción escogida. Si has seleccionado "Capturar siempre" puedes tomar capturas de
pantalla adicionales si presionas la combinación nuevamente (esto no está disponible
con la opción de tiempo). Para desactivar la herramienta si has escogido esta opción,
cierra MAGIX Web Designer 10 Premium para cerrar la sesión. Como alternativa,
vuelve al diálogo de captura de pantalla y escoge la opción "una sola vez" y toma una
captura de pantalla más.

www.magix.es
 Trabajar con fotos 335

Colorear fotos
Selecciona una foto, haz clic en la línea de colores y elige en el menú para aplicar un
color continuo a la foto. Para convertir una foto de color a blanco y negro, haz clic en
el color blanco y selecciona "ESTABLECER COLOR CLARO DE TONO CONTINUO". Esto se
llama color continuo porque es un tono continuo de negro a blanco.

Si haces clic en LÍNEA DE COLORES ,

puedes seleccionar cualquier color,
sea éste el color claro o el oscuro del
tono continuo (contone). También
puedes utilizar la herramienta EDITOR
DE COLOR (Ctrl+E) y elegir cualquier
color que quieras. El menú
desplegable en la parte superior del
editor de color controla si estás
editando en el color claro u oscuro.
Puedes restaurar el color original de la foto haciendo clic en el pequeño cuadrado
blanco cuadriculado del extremo izquierdo de la línea de colores, o haz clic derecho
sobre la foto y selecciona la opción "restaurar color".

Si quieres colorear una foto que está dentro de un grupo, pulsa "Ctrl+click" para
seleccionarla dentro del grupo y aplica el tono continuo como se describe arriba.

Cambiar el tamaño, rotar y reposicionar la foto

dentro de su propio marco
MAGIX Web Designer 10 Premium trata las fotos como si fueran un rectángulo con
relleno de mapa de bits. Es decir, la forma de tu foto será tratada por el programa
como si fuera un contorno alrededor de la imagen que se encuentra adentro, y el
336

contorno se puede editar completamente. Entonces, cuando recortes o edites el

contorno de la forma, no estarás afectando al relleno.

Las fotos y los mapas de bits de la página siempre están "contenidos" dentro del
contorno de una forma. No sólo puedes cambiarle la forma al contorno, sino que
también puedes ajustarle el tamaño, el ángulo y la posición de la foto dentro de su
marco (frame) utilizando la HERRAMIENTA DE RELLENO . Selecciona la foto, ve a la
HERRAMIENTA DE RELLENO y podrás ver las flechas de relleno que se encuentran en un
ángulo recto (o puedes ir a la herramienta de relleno, y hacer clic sobre la foto para
seleccionarla).

Por ejemplo. para agrandar y rotar la imagen hacia la izquierda dentro de su propio
marco, selecciona la herramienta de relleno y arrastra una de las puntas de las
flechas.
• Para cambiar el tamaño, arrastra el cursor sobre una de las puntas de las flechas,
alejándote del centro. Puedes mantener presionada la tecla "Ctrl" para mantener
el ángulo.
• Para rotar la imagen, arrastra una de las puntas de las flechas sobre el centro.
• Para reposicionar la imagen, arrastra en cualquier parte de la imagen.

En la barra de información de la herramienta de relleno

puedes seleccionar la opción de "mosaico repetido" y la
imagen se llenará con un mapa de bits segmentado. Si
arrastras los controles deslizantes de relleno, podrás
cambiar las dimensiones de la segmentación dentro de
la imagen o realizar una rotación. Si realizas la misma
acción pero con una imagen gigante con muchos
píxeles, podrás ver la velocidad con la que trabaja
MAGIX Web Designer 10 Premium.

www.magix.es
 Trabajar con fotos 337

Si cuentas con un grupo de fotos en vez de un objeto común de foto no puedes utilizar
la herramienta de relleno tal como se describe arriba para ampliar la imagen y girarla
en su marco. Si quieres convertir un grupo de foto en un objeto de foto común para
poder ajustarlo con la herramienta de relleno, puedes usar Herramienta > Optimizar
foto para hacerlo. Pero ten en cuenta que esto es destructivo y que luego no podrás
modificar ninguna de las ediciones que aplicaste a la foto.

Enderezar horizonte
Es muy fácil enderezar el horizonte torcido de una imagen. Sólo tienes que utilizar la
herramienta de relleno siguiendo los mismos pasos de arriba.
• Selecciona la herramienta de relleno y haz clic sobre una foto. Esto mostrará los
controles deslizantes de relleno, que básicamente son flechas que muestran la
extensión del relleno en el interior de la forma.
• Arrastra uno de los extremos de las flechas para cambiar el tamaño de la
imagen o para rotarla.

La siguiente imagen tiene un paisaje con un horizonte torcido, que ha sido creada con
la función de "creación de panorámicas".

Utilizando la herramienta de relleno, arrastra una de las flechas para rotar o cambiar el
tamaño de la imagen. Puedes reposicionar la foto arrastrando el control deslizante de
las flechas en el centro, o mantiene presionada la tecla "Shift" y mueve el cursor sobre
la imagen.
338

Ver una foto ampliada en su tamaño completo

El botón ZOOM A 1:1 en la barra de información de la herramienta de foto ajusta el
zoom de forma que la imagen seleccionada se muestre en su tamaño completo, en
donde cada píxel de la imagen corresponde a un píxel de pantalla. Esto es útil si
quieres editar una imagen que se ha reducido en la página, pero quieres verla en su
tamaño completo mientras trabajas en ella.

Darle el tamaño completo a una foto

El botón AMPLIAR FOTO A 100% en la barra de información de la herramienta de foto
hace que la foto seleccionada actualmente se amplíe al tamaño completo de la
página. Así, una foto que se ha reducido a 500 píxeles de ancho, pero cuyo original
tenía 1000 píxeles de ancho, se ampliará nuevamente a su valor original. Si el zoom
del documento es 100%, significa que cada píxel de la imagen corresponderá a un
píxel en la pantalla.

Optimización de fotos y mapas de bits

Con la resolución siempre en aumento y el tamaño de archivo de los JPEGs de cámara
digital, si tienes un documento que contiene muchas imágenes, el tamaño del archivo
se puede agrandar muy rápidamente Por ejemplo, un documento multipágina que
contiene 20 JPEGs de máxima resolución, cada uno de los 5 Mb producirán un
archivo .xar de más de 100 Mb*.

Además, estas fotos por lo general están innecesariamente en alta resolución. Reducir
una foto de una cámara digital de 8 megapíxeles a 5 cm (2 pulgadas) de ancho en la
página, tendrá como resultado una imagen de 1500 dpi. Pese a que una imagen de
alta resolución tiene una mayor flexibilidad para la impresión (y puedes ampliarla o
agrandar pequeñas partes de la foto), esta es mucho más alta de lo necesario
respecto a lo requerido incluso para la impresión comercial de mayor calidad, y
todavía más en el caso de gráficos web o productos HTML.

Si seleccionas una pequeña parte de la imagen o cortas solo una pequeña parte de tus
fotos, podría haber grandes partes de imagen oculta fuera del área visible. Este
"recorte en vivo" es una gran función para la edición, ya que puedes retornar el
recorte, alterar el tamaño, la posición o la escala y todo permanece lo más nítido
posible. Sin embargo, puede que quieras eliminar las partes invisibles en los
documentos finalizados.

www.magix.es
 Trabajar con fotos 339

La imagen de mariposa para recortar todavía mantiene adjunto el resto de la foto. Si

vas a la HERRAMIENTA DE RELLENO podrás ver esto fácilmente si cambias el tamaño
del relleno dentro del contorno. Por lo tanto, las partes de la imagen fuera de la
mariposa probablemente serán superfluas para tu documento final.

Haz clic derecho sobre una foto y escoge OPTIMIZAR FOTO o "HERRAMIENTAS" >
"OPTIMIZAR FOTO..".. Este diálogo permite realizar tres funciones importantes:
• Eliminar partes invisibles de las fotos
• Reducir la resolución de las fotos
• Convertir PNG o mapas de bits en JPEG incrustados para optimizar el tamaño de
archivo

Si seleccionas esta opción del menú para cualquier mapa de bits, se abrirá el diálogo
OPTIMIZAR FOTO .

Para imágenes JPEG la configuración por defecto hace que la foto se optimice a JPEG
192dpi (resolución de pantalla retina) en el tamaño que aparece en tu página, o 96 dpi
si la opción retina no está activada (pestaña PÁGINA WEB del diálogo PROPIEDADES
WEB ). En general, esto es lo que quieres de las fotos de tu sitio web.

Al optimizar imágenes diferentes a JPEG, Web Designer decidirá automáticamente si

es mejor optimizarla a PNG o JPEG, según la propia naturaleza de la imagen.
340

Puedes hacer clic en el botón CONFIGURACIÓN de este diálogo, si quieres cambiar

cualquier configuración, como el formato de imagen utilizado para la optimización, la
calidad JPEG, etc.

Puedes cambiar la resolución utilizada en este diálogo, si escoges el tamaño físico que
deseas para la imagen optimizada (ancho/alto en píxeles) o si introduces un dpi
diferente (p. ej. 150 dpi si quieres calidad de impresión).

Si escoges la opción de dpi, el valor que introduzcas se recuerda y se convierte en el

valor por defecto para la sesión actual. También puedes mantener la resolución actual
de la foto si seleccionas ACTUAL de la lista PPI.

También puedes escoger optimizar como PNG (produce imágenes más grandes pero
mayor calidad para gráficos e imágenes de texto) o cambiar la calidad usada para la
optimización JPEG (mayor calidad significa tamaño más grande).

Si tu foto se corta, solo la parte visible de la imagen se preserva en la imagen

optimizada.

Para imprimir, una resolución de 150dpi ofrece muy buenos resultados, pese a que
300dpi ofrece la impresión comercial de mejor calidad (la mayoría no pueden
distinguir entre 150dpi y 300dpi y , sin embargo, 300dpi requiere cuatro veces más
memoria o espacio de archivo).

Advertencia: "OPTIMIZAR FOTO" es una operación "destructiva". Cuando guardes el

documento, las partes de la imagen que se hayan quitado se perderán, y la
resolución se cambiará definitivamente (obviamente, puedes deshacer los cambios
mientras tengas el archivo abierto durante la edición).

Puedes optimizar múltiples fotos al mismo tiempo si quieres que todas tengan el
mismo dpi. Selecciona las fotos que quieras optimizar y luego elige la opción
OPTIMIZAR como se ha descrito más arriba. Si tus fotos tienen diferentes
www.magix.es
 Trabajar con fotos 341

dimensiones, la opción para optimizar según el tamaño de píxeles estará desactivada

y deberás escoger el dpi requerido.

O puedes utilizar "HERRAMIENTAS" > "OPTIMIZAR TODAS LAS IMÁGENES" para

optimizar todas las imágenes de mapas de bits de tu documento en una sola
operación.

El proceso de optimización convertirá las imágenes grandes que no sean JPEG en

imágenes JPEG más pequeñas, si el programa decide que la imagen puede
almacenarse y exportarse en JPEG sin una pérdida de calidad inaceptable.

Ten en cuenta que después de optimizar la foto, la foto original sin optimizar
permanece en la GALERÍA DE MAPAS DE BITS . Esto significa que todavía se encuentra
en la memoria y que el espacio de almacenamiento requerido en tu diseño no se
habrá reducido. Tan solo guarda tu diseño y vuélvelo a cargar después de optimizar
para eliminar las imágenes originales más grandes.

Convertir objetos o dibujos a mapas de bits

Puedes crear fácilmente un mapa de bits a partir de un objeto, o partir de una parte de
tu dibujo, incluso si están compuestos por otros mapas de bits. Los mapas de bits
pueden tener cualquier tamaño o resolución y también pueden tener transparencias.
También puedes crear mapas de bits con un número reducido de colores, que puede
ser útil para el uso en la web.

Crear un mapa de bits a partir de objetos:

1. Selecciona el/los objeto/s en la página
2. Haz clic derecho y selecciona CREAR UNA COPIA DE MAPA DE BITS o selecciona
CREAR UNA COPIA DE MAPA DE BITS en el menú ARREGLO (Ctrl + Shift + C).
3. En el diálogo, selecciona la profundidad de color, el tamaño y otras opciones.

Para obtener un máximo de calidad, selecciona una profundidad de color de un color

verdadero, o si quieres tener transparencia, selecciona "true color + alpha" (la
transparencia alpha es un término técnico). Puedes crear mapas de bits con menos
colores si seleccionas una profundidad de color de 256 colores o menos. Esto te
permite tener control sobre las opciones de "dithering" y paleta. Estas opciones se
describen en la sección Exportar mapas (en la página 456).

Ten en cuenta que siempre se crean imágenes en formato PNG (el tipo de imagen
con más calidad). Pero recuerda que las fotos a color completo requieren mucha
memoria y espacio de archivo. Utiliza la opción de optimización de foto para
convertir las imágenes en PNG en imágenes JPEG integradas para reducir el tamaño
del archivo.
342

Documentos fotográficos
A veces es mejor trabajar con una foto sola, en vez de con un "objeto" en una página.
Web Designer le llama a esta foto "foto documento" o "modo foto", y se lo puede
editar de forma similar como se hace con los editores tradicionales de foto. Puedes
crear un documento fotográfico de varias maneras:
• Arrastra una foto desde tu explorador hacia la barra de título o la barra de
herramientas de la ventana de Web Designer.
• Selecciona "Archivo > Abrir" y selecciona una foto.
• Crea un documento fotográfico en blanco seleccionando "ARCHIVO > NUEVO >
FOTO VACÍA ".

Los documentos fotográficos de Web Designer se diferencian de los documentos

tradicionales en lo siguiente:
• No hay una página en blanco visible. Las dimensiones de página se ajustan a las
dimensiones de la foto, ampliándose automáticamente si añades cualquier otro
objeto.
• Los documentos fotográficos tienen una cuadrícula de 1 píxel por defecto. La
función para ajustar la cuadrícula también viene activada. Esto hace más fácil y
preciso tu trabajo de corte y recorte de áreas.
• El tablero o pasteboard (el área alrededor de la foto) tiene un color más oscuro.
Esto facilita la distinción rápida entre los documentos fotográficos y los
documentos de dibujo.
• El zoom del documento está ajustado de modo tal que la foto cubra toda la
página, y la herramienta de fotos se abrirá automáticamente.
• Si sueltas documentos fotográficos adicionales sobre la foto principal, estarás
agregando una nueva foto al documento y no reemplazando la foto principal que
se encuentra en el marco. Y la vista se alejará (zoom out) permitiéndote ver la
imagen entera.
• Las imágenes no se reducen a un tamaño de 500 píxeles al importarlas, tal
como se hace como en documentos web normales, sino que se han importado a
una escala de 1:1 de modo que, si fijas el zoom a 100%, verás el tamaño total de
la imagen.
• Las opciones de suavizado de píxeles se han cambiado. Por defecto, se aplica el
modo de visualización en alta calidad. Esta es la mejor forma de ver imágenes
reducidas y las imágenes a las que se les haya aplicado un "zoom out" para
alejar la imagen. Cuando uno se acerca a la imagen haciendo "zoom in", el
suavizado de píxeles estará desactivado.

En lo que respecta a todas las otras funciones, los documentos fotográficos funcionan
como los otros documentos normales de MAGIX Web Designer 10 Premium. Puedes
usar cualquiera de las herramientas de dibujo y de texto como lo haces
habitualmente. Si quieres crear un documento fotográfico con un tamaño específico,
puedes cambiar el lienzo o el tamaño de la página seleccionando "HERRAMIENTAS >
OPCIONES y la pestaña "PÁGINA " para introducir las dimensiones.

www.magix.es
 Trabajar con fotos 343

En documentos fotográficos, se permitirán dos controles extra. Los botones ANTERIOR

y SIGUIENTE cambiarán a la imagen anterior o siguiente en la carpeta desde donde se
abrió la imagen. Esto cerrará la imagen actual, por lo que se te pedirá que guardes el
archivo.

Edición de archivos de fotos

Puedes utilizar MAGIX Web Designer 10 Premium para editar fácilmente tus fotos
JPEG y guardar el archivo modificado. A diferencia de la mayoría de los editores de
fotos, puedes realizar repetidas ediciones sin pérdida de calidad, a pesar de que el
formato JPEG es un formato con pérdida. Esto es porque MAGIX Web Designer 10
Premium puede guardar tus ediciones sin pérdida, junto con la foto original. Funciona
de la siguiente forma.

Primero abre el JPEG con ARCHIVO > ABRIR , mediante arrastrar y soltar o con un clic
derecho en el Explorador de archivos de Windows y eligiendo MAGIX Web Designer
10 Premium en la lista "Abrir con". La foto se abrirá como un documento de foto.

Edita la foto con las herramientas de foto tal como se describe anteriormente.

Si luego escoges ARCHIVO > GUARDAR ("Ctrl+S"), el archivo JPEG que has abierto se
sobrescribirá con la imagen modificada. Sin embargo, MAGIX Web Designer 10
Premium también guarda tu foto en su formato .xar nativo por defecto. Este archivo
se coloca en una carpeta principal junto con tu archivo JPEG. Tiene el mismo nombre
que tu archivo de foto, pero con la extensión .web. El archivo .xar incluye tu foto
original sin las modificaciones aplicadas y, por supuesto, detalles de tus ediciones.

Si posteriormente cargas el archivo JPEG modificado para continuar editándolo,

MAGIX Web Designer 10 Premium buscará en la carpeta principal para ver si hay un
archivo .xar disponible para esta foto. De ser así, se abrirá este archivo .xar en vez de
tu archivo JPEG y podrás continuar editando desde donde has dejado. Cuando vuelvas
a guardar, el archivo JPEG se sobrescribirá nuevamente y el archivo .xar se actualizará
y guardará en la carpeta principal.

Por supuesto, si no quieres sobrescribir tu archivo JPEG con los cambios, puedes usar
la opción ARCHIVO > GUARDAR COMO para guardar la foto modificada en otro lugar o
utilizar algunas de las opciones para exportar tu foto en diversos formatos.

Puedes conservar la foto original del archivo .web si la abres, abres la GALERÍA DE
MAPAS DE BITS , haces clic derecho sobre la foto y escoges la opción GUARDAR .
344

La herramienta de fotos

Introducción
Con la herramienta de fotos podrás recortar fotos o ajustar sus niveles de brillo y
nitidez de forma muy directa y rápida, incluso con las imágenes con muy alta
resolución. Esta herramienta provee:
• Auto-optimización con un clic de tus fotos; esto es particularmente bueno para
imágenes subexpuestas.
• Ajuste manual de brillo, contraste, saturación de color, temperatura del color de
la foto y desenfoque o nitidez de las fotos.
• Corte de imágenes. Se trata de 'corte en vivo', lo que significa que podrás cortar
y deshacer el corte todas las veces que quieras.
• Una función de "comparación" con un solo clic para comparar rápidamente los
cambios respecto al original.
• Función sencilla para copiar/pegar fotos que aumenta las ediciones entre
imágenes diferentes.

Todas estas operaciones son interactivas con actualización en vivo. Cuando ajustas
los valores, la imagen se actualiza al instante. Son también no destructivas, lo cual
significa que tu imagen original no se cambia y siempre puedes hacer o deshacer
cualquier ajuste.

También está disponible una herramienta para ojos rojos.

Ventajas de la herramienta de fotos

Esta herramienta tiene tres beneficios principales:
1. Es no destructiva.
2. Es muy rápida, aun para imágenes muy grandes.
3. La edición fotográfica no requiere memoria.

Para más información respecto a estos beneficios en comparación con otras

herramientas de edición de fotos, consulta el capítulo Manejo de fotos.

Utilización de la herramienta de fotos

Para acceder a las HERRAMIENTAS DE FOTO, mueve el cursor del ratón sobre el
icono de la cámara en la barra de herramientas principal en la parte izquierda
de la ventana. Aparecerá una barra desplegable con iconos para cada una de
las herramientas de foto.

www.magix.es
 La herramienta de fotos 345

Si estás en la herramienta de selección, haz doble clic en una foto para cambiar a la
HERRAMIENTA DE FOTO .

Los primeros seis botones de la barra de información a la izquierda son comunes a

todas las herramientas y suministran acceso a las funciones GIRAR 90° , IMAGEN
ANTERIOR/SIGUIENTE , AJUSTAR ZOOM y AMPLIAR FOTO A 100% . Estas opciones se
describen más adelante.

Funciones comunes para fotos

Los siguientes botones están disponibles en la barra de información cuando te
encuentras en las herramientas para fotos Optimización, Clip, Ojos rojos o Cambio de
tamaño con contenido.

Controles para rotar 90°

Los dos iconos de rotación giran la foto o las fotos seleccionadas a 90 grados en
sentido de las agujas del reloj o en sentido contrario.

Anterior y Siguiente

Cuando "abres" una foto utilizando MAGIX Web Designer 10 Premium, la foto se
carga en un nuevo documento de foto porque Web Designer presupone que quieres
editar o ver la foto misma, más que utilizarla como parte de un dibujo o de otro
documento. Cuando abres una foto puedes utilizar los botones "Anterior" y
"Siguiente" de la barra de información de la herramienta de foto para cerrar el
documento de foto actual y abrir la foto siguiente (o previa) en el mismo archivo que
la foto actual. Esto te permite navegar a través de las fotos en un archivo sin tener que
abrir y cerrar cada una individualmente. Si has hecho cambios en la foto que no has
guardado, se te preguntará si quieres guardar los cambios cuando pulsas Anterior o
Siguiente.

Consulta Trabajar con documentos para más información en Documentos

fotográficos.
346

Zoom 1:1
Selecciona una foto y haz clic en el botón zoom 1:1.

El factor del zoom para el documento está establecido de forma que la foto
seleccionada se muestre 1:1 (un píxel de la foto es igual a un píxel de la pantalla).
Utiliza esta opción si quieres trabajar en una foto a tamaño completo en un
documento en donde has reducido el tamaño de la foto.

Ampliar foto a 100%

La función AMPLIAR FOTO A 100% hace que la foto seleccionada actualmente
se amplíe al tamaño completo de la página.

Así, una foto que se ha reducido a 500 píxeles de ancho, pero cuyo original tenía
1000 píxeles de ancho, se ampliará nuevamente a su valor original. Si el zoom del
documento es 100%, significa que cada píxel de la imagen corresponderá a un píxel
en la pantalla. Si el zoom del documento es 100%, significa que cada píxel de la
imagen corresponderá a un píxel en la pantalla.

Herramienta de optimización
Haz clic en el ícono de la cámara para ingresar a la HERRAMIENTA DE
OPTIMIZACIÓN .

Con la HERRAMIENTA DE FOTOS podrás recortar fotos o ajustar sus niveles de brillo y
nitidez de forma muy directa y rápida, incluso con las imágenes con muy alta
resolución. Esta herramienta te provee:
• Optimización automática con un clic de tus fotos, especialmente útil para fotos
subexpuestas.
• Ajuste manual de brillo, contraste, saturación de color y desenfoque o nitidez de
las fotos.
• Corte de imágenes. Se trata de "corte en tiempo real", lo que significa que
podrás cortar y deshacer el corte todas las veces que quieras.
• Corrección de la dominante de color o el balance de blancos.
• Una función de "comparación" con un solo clic para comparar rápidamente los
cambios respecto al original.
• Función copiar/pegar fotos sencilla que aumenta las ediciones entre imágenes
diferentes.

Todas estas operaciones son interactivas con actualización en tiempo real Mientras
ajustas los valores, la imagen se actualiza de forma instantánea. Son también no
destructivas, lo cual significa que tu imagen original no se cambia y siempre puedes
hacer o deshacer cualquier ajuste.

www.magix.es
 La herramienta de fotos 347

Los primeros seis botones de la izquierda de la barra de información (no se ilustran arriba) son
comunes a todas las herramientas y están descritos anteriormente

Optimización automática
Brillo
Contraste
Saturación de color
Temperatura del color
Control de tonos
Desenfoque/Enfoque
Comparación con el original

En esta herramienta puedes ajustar el brillo, el contraste, la saturación, la

temperatura, el tono, el desenfoque y el enfoque. Puedes introducir directamente
valores a los campos de texto o usar la barra deslizante emergente para ajustar los
valores de forma interactiva.

Pop-ups deslizantes
Los pop-up deslizantes pueden ser utilizados de una o dos maneras:

1. Haz clic y suelta la flecha pop-up. El control deslizante se quedará en pantalla y

podrás ajustar los valores todas las veces que quieras, solo tienes que arrastrar
el control deslizante. Otra alternativa es que mantengas presionado el botón del
ratón sobre el control y puedes usar la rueda del ratón para realizar pequeños
ajustes hacia abajo o hacia arriba. El control deslizante desaparecerá cuando
hagas clic en otro lugar del documento.
2. O haz clic y mantiene presionado el botón del ratón y arrastra el cursor sobre la
barra deslizante para ajustar el valor. Cuando sueltes el ratón el pop-up
desaparecerá. Esta forma de trabajar es más rápida porque solo tiene que hacer
clic y soltar para cambiar los valores.

Auto-optimización
Si haces clic en el botón "OPTIMIZAR" se realizará un análisis general del brillo y el
contraste de la imagen y la imagen se optimizará automáticamente para obtener una
mejor imagen. Esto es muy efectivo para las imágenes oscuras subexpuestas. Luego
348

de haber aplicado la auto-optimización a una foto podrás ajustar los valores que han
sido asignados con la optimización, usando los controles que se encuentran a la
derecha del botón "optimizar". Si haces clic sobre el botón "COMPARAR" se restaurará
la imagen original, y si haces clic otra vez sobre el mismo botón volverás a los valores
de optimización anteriores.

Brillo/Contraste/Temperatura del color/Saturación/Tono

Brillo Contraste Saturación Temperatura del
color

La imagen se actualiza al instante mientras ajustas los valores. La saturación cambia

la intensidad del color. Si le colocas el valor mínimo -100, la imagen será en blanco y
negro. El manejo de la temperatura del color hace que una imagen sea más "cálida" o
"fría". El control de tono se aplica a un tinte de color particular de la imagen y te
permite controlar la intensidad del color seleccionado.

Tono

El regulador de tono controla la intensidad

del color seleccionado.

Desenfoque / Enfoque

Este control desenfoca las imágenes si introduces valores por debajo del cero
(negativos) y si los valores van por arriba del cero (positivos) la imagen se enfocará.
Se recomienda que no uses valores muy altos cuando enfocas las imágenes. Y aplica
la opción de "enfoque" solo a imágenes que han sido reducidas mucho.

Comparar y restaurar el original

El botón COMPARAR puede ser utilizado para restablecer todos los valores de las
herramienta OPTIMIZAR que vienen por defecto, y así vuelve la foto a su estado
original. Pulsa el botón comparar por una segunda vez y recuperarás tus valores
previos. Por lo tanto, puedes utilizar el botón "Comparar" para cambiar rápidamente
de tu foto editada a la foto original para ver los efectos de los cambios que has hecho.

Debido a que todos los cambios de optimización o de niveles son "no destructivos", si
pulsas "Comparar" simplemente estarás eliminando los atributos de optimización, y
de esta forma volverás a la imagen original. El botón "Comparar" puede ser utilizado
en cualquier momento después de haber modificado la imagen.

www.magix.es
 La herramienta de fotos 349

Recortar o cortar imágenes

El modo más fácil de cortar una foto es arrastrar el cursor sobre la foto o a lo largo de
la misma habiendo seleccionado la HERRAMIENTA DE OPTIMIZACIÓN . El corte se
efectúa al instante de soltar el ratón. La foto cortada resultante tiene controles
deslizantes de clip alrededor de la misma donde puedes ajustar posteriormente los
bordes del recorte.

Esta es una operación no destructiva, lo que significa que puedes ajustar el área de
corte después de que la hayas recortado, e incluso puedes deshacer un recorte y
restaurar toda la imagen. Una forma de comprender el proceso es que simplemente
ajusta el contorno de la imagen, pero que toda la imagen permanece dentro del
rectángulo. Por ello se llama recorte y no corte, aunque tiene el mismo objetivo.

Herramienta de corte
Como alternativa, puedes entrar en la HERRAMIENTA DE CORTE si seleccionas el icono
de corte de la barra de información para fotos. Esto suministra una gama de opciones
de recorte adicionales. Puedes introducir un valor exacto de píxeles y escoger entre
varias relaciones de aspecto de recorte.

Para un corte interactivo y algunas opciones más en relación con las

relaciones de aspecto, entra en el MODO DE CORTE con el botón HERRAMIENTA
DE CORTE .

La barra de información se verá así:

Mientras arrastras el cursor sobre la foto, el rectángulo de corte se verá resaltado.

• Puedes ajustar el área de corte si arrastras los controles deslizantes laterales o
los de las esquinas.
• Dentro del área de corte puedes mover la región cortada de lugar si la arrastras
con el cursor.
• Selecciona el botón CORTAR o haz doble clic dentro del área de corte para
realizar un corte.
350

Podrás darte cuenta si una foto ha sido cortada o no si miras la barra de estado que
dirá "foto cortada".

Borrar
Presiona el botón "BORRAR" , o haz clic fuera del área de corte marcada para vaciar el
rectángulo de corte actual.

Regla de los tercios

Existe una norma fotográfica que ayuda a componer fotografías y que se denomina la
"Regla de los tercios". En pocas palabras significa que debes colocar los objetos
importantes de tus fotos en tercios del ancho de la imagen. Por ejemplo, en general es
mejor colocar el horizonte en el tercio inferior de la imagen que justo en el centro.
Cuando arrastras una región de clip a través de tus líneas de fotos, se muestran las
líneas en los tercios a lo ancho y a lo largo de la imagen para ayudarte a posicionar los
objetos para seguir esta norma de composición.

Consejo: busca "Regla de los Tercios" en Google para obtener más información.

Deshacer corte
Pulsa el botón DESHACER CORTE sobre cualquier foto cortada seleccionada para
restaurar la foto original. Esto restaura el rectángulo de corte, que puedes ajustar o
borrar si haces clic fuera de él.

El botón DESHACER CORTE en la HERRAMIENTA DE CORTE cambiará el contorno de

cualquier foto cortada, y también las formas creadas arbitrariamente que contengan
un relleno de mapa de bits, a un contorno de rectángulo de la foto completa o a un
mapa de bits utilizado como relleno. Puede ser que tengas que seleccionar el botón
"Borrar" para borrar el rectángulo de recorte (o haz clic fuera del rectángulo).

www.magix.es
 La herramienta de fotos 351

Ajustando la región cortada

Debido a que el botón "Deshacer corte" restaura el rectángulo de corte (mostrando el
área de afuera más oscura), puedes realizar finos ajustes a una foto cortada). Solo
selecciona la foto, pulsa el botón "Deshacer corte" y ajusta los lados del rectángulo de
corte como requieras. Haz doble clic dentro de la foto para cortarla otra vez.

Ancho / Alto
Luego de dibujar un rectángulo de corte puedes introducir valores directamente
dentro de los campos de ancho y alto en la barra de información fijar valores exactos
a las dimensiones del rectángulo de corte.

Bloquear aspecto
Selecciona el recuadro "BLOQUEAR ASPECTO" para mantener la relación de aspecto del
rectángulo de corte mientras lo arrastras. Los botones de radio a la derecha del check-
box determinan la relación de aspecto utilizada. Selecciona "ACTUAL" para mantener
la relación de aspecto de la foto antes de cortarla. Ten en cuenta que el rectángulo de
corte cambia automáticamente entre la forma orientación de paisaje y retrato a
medida que arrastras el cursor hacia una esquina del rectángulo. Entonces si lo
arrastras lateralmente, tiende a crearse un corte con orientación paisaje. Si lo
arrastras hacia abajo, entonces se creará una región cortada con orientación retrato.

Las relaciones de aspecto más comunes para recortes predeterminados disponibles

son 4:3 (mayoría de cámaras digitales para consumidores y televisores y monitores
de estilo antiguo), 3:2 (filmadoras tradicionales y cámaras digitales SLR de alta
calidad) y 16:9 (relación de aspecto para televisores con pantalla ancha).

Puedes anular la opción "bloquear aspecto" si pulsas "Ctrl" mientras arrastras el ratón.
De modo que si estás arrastrando un rectángulo de corte (o ajustando uno) sin la
relación de aspecto bloqueada, mientras estás pulsando "Ctrl" entonces se mantendrá
el aspecto de la última relación de aspecto seleccionada. De la misma forma, si tienes
la opción "bloquear aspecto" activada y presionas "Ctrl", se desbloqueará
temporalmente el aspecto bloqueado.

Cortar en documentos fotográficos

En el modo foto hay una cuadrícula de 1 píxel que se aplica a la foto (cuando tiene 96
dpi, la resolución por defecto) y el rectángulo de corte se ajustará a la cuadrícula. Esto
hace muy fácil realizar un corte con una exactitud de píxel por píxel. Para realizar
ajustes muy precisos o del tamaño de 1 píxel se recomienda operar en modo foto y
acercarse con el zoom para poder ver los píxeles más claramente.

Ver Documentos fotográficos (en la página 342) para más información.

352

Notas para la herramienta de foto

1. Puedes seleccionar diferentes fotos mientras usas las HERRAMIENTAS DE FOTO
con solo hacer clic sobre ellas. También puedes seleccionar fotos que se
encuentran en un grupo.
2. Si haces clic y arrastras mientras te encuentras en la HERRAMIENTA DE
OPTIMIZACIÓN , se comenzará un recorte en la foto sobre la que has hecho clic.
O, si comienzas a arrastrar el fondo, el recorte se aplicará a la primera foto que
toques durante este arrastre.
3. El botón DESHACER CORTE en la HERRAMIENTA DE CORTE cambiará el contorno de
cualquier foto cortada, y también las formas creadas arbitrariamente que
contengan un relleno de mapa de bits, a un contorno de rectángulo de la foto
completa o a un mapa de bits utilizado como relleno. Es posible que tengas que
seleccionar el botón "Borrar" para borrar el rectángulo de recorte (o haz clic
fuera del rectángulo).
4. Todas las operaciones para las fotos pueden deshacerse. A diferencia de las
fotos tradicionales o de los editores de píxeles, aquí la foto original no se altera
hasta que optimices la foto para hacer que los cambios sean permanentes. Esto
significa que puedes realizar cuantos cambios quieras, tan seguido como quieras
y guardar y abrir archivos .xar y .web todas las veces que quieras sin que la
imagen se vea afectada (todas las operaciones de edición son no destructivas y
sin pérdidas) y sin que el tamaño del archivo se modifique.
5. Todas las opciones de la HERRAMIENTA DE FOTO, incluyendo el control de niveles,
operan sobre los objetos rellenos con mapas de bits, y también sobre las fotos
individuales.
6. Si abres una foto en MAGIX Web Designer 10 Premium (con ARCHIVO ->ABRIR ),
se abrirá como un documento de foto. Después de editarla, puedes sobrescribir
la foto, si escoges la opción ARCHIVO->GUARDAR ("Ctrl+S"). También se guarda
un archivo .web o .xar en una carpeta principal junto con tu foto modificada,
conservando tu foto original y las ediciones. Consulta el capítulo Manejo de
fotos para más información.

www.magix.es
 La herramienta de fotos 353

La herramienta de ojos rojos

La herramienta de OJOS ROJOS te permite eliminar rápidamente los efectos
de ojo rojo de los rostros de las fotos.

Haz clic en el símbolo anterior para ingresar en el modo de ojos rojos. Luego:
• Amplía la vista de los ojos rojos, con la HERRAMIENTA DE ZOOM (EN LA PÁGINA 80)
o simplemente utiliza Ctrl+rueda del ratón.
• Haz clic y arrastra desde el centro del ojo rojo hacia afuera, para crear un parche
de ojo circular. El color rojo se eliminará del área dentro de este círculo.
• Repite los pasos anteriores para cada ojo rojo de tu foto.

Puedes seleccionar cualquier parche de ojo rojo que has aplicado a una foto con un
clic sobre él mientras te encuentras en la herramienta de ojo rojo. Después, puedes
pulsar la tecla eliminar para quitar el parche.
354

También puedes ir a la herramienta QuickShape y editar el parche del ojo rojo

seleccionado de la misma forma en que editas las elipses normales en tus
documentos.

Por lo tanto, de ser necesario puedes dar forma elíptica a los parches de ojos rojos si
esto lo coloca mejor en el área de ojo rojo. Lee la ayuda de la Herramienta
QuickShape para información sobre su utilización para editar elipses. Sin embargo,
para la mayoría de las fotos los parches circulares por defecto son suficientes para
eliminar los efectos de ojos rojos.

Al borde de la elipse de ojo rojo se le aplica una difuminación de 3 píxeles, para que
no se produzca un corte duro en el área de donde se elimina el ojo rojo. Puedes
ajustar fácilmente este valor de difuminación si seleccionas la elipse de ojo rojo
(como se ha mencionado anteriormente) y ajustas el valor de difuminación con el
control de difuminación principal (del lado derecho de la barra superior), de la misma
forma que editas el valor de difuminación de las formas usuales.

Después de aplicar la herramienta de ojo rojo, los parches de ojo rojo están agrupados
dentro de un GRUPO DE FOTO . Esto tiene como objetivo que, al mover la foto por el
documento, o al transformarla, los parches de ojo rojo se muevan junto con la foto.
Ten en cuenta que esto significa que si quieres seleccionar una elipse de ojo rojo
mientras no te encuentras en la herramienta de ojo rojo, necesitarás pulsar Ctrl
mientras haces clic sobre la elipse (lo que se llama una operación "seleccionar
dentro"). Lee el capítulo sobre Trabajar con fotos para información acerca de los
Grupos de foto (en la página 320).

Haz clic sobre el botón LIMPIAR TODO en la barra de información de la herramienta de

ojos rojos para eliminar todas las elipses de ojo rojo de la foto seleccionada
actualmente.

www.magix.es
 La herramienta de fotos 355

Efectos en tiempo real

Introducción
NOTA: esta herramienta está incluida en la versión de 64 bits de Web Designer
Premium por razones legales, para documentos que usan efectos de sombra o de
difuminación de mapas de bits, los cuales funcionan en la versión de 64 bits. La
versión de 64 bits no es compatible con los plug-ins normales de 32 bits de
Photoshop y los efectos de 64 bits no están incluidos en el producto.

Los efectos en tiempo real son efectos de mapas de bits que pueden aplicarse a un
objeto utilizando herramientas del "Editor de imagen de Xara" o plug-ins de Adobe®
Photoshop®. La lista de efectos en vivo disponibles se ve en la barra de información
de la herramienta de Efectos en vivo con un clic sobre el botón "Nuevo".

Añadir un nuevo efecto

Lista de efectos aplicados en orden
Editar el efecto seleccionado
Resolución del efecto en tiempo real
Eliminar el efecto actual
Bloquear/desbloquear efectos
Eliminar todos los efectos
Configurar para buscar plug-ins

Aplicar un efecto en vivo

Para aplicar un efecto en vivo:
1. Selecciona el objeto o los objetos de forma usual.
2. Selecciona la herramienta de EFECTOS EN VIVO.
3. Haz clic sobre el botón NUEVO en la parte izquierda de la barra de información.
Esto mostrará una lista dividida en partes de los efectos disponibles. El primer
conjunto de efectos de la lista son los efectos del XARA PICTURE EDITOR . El
segundo conjunto son los efectos suministrados por las herramientas incluidas
en MAGIX Web Designer 10 Premium DIFUMINACIÓN y SOMBRA. El tercer
conjunto son los efectos de plug-ins "nuevo estilo" de Photoshop y el último
conjunto son los efectos "estilo antiguo" de Photoshop (lee más adelante para
obtener una explicación de estos diferentes tipos).
4. Selecciona de la lista el efecto que quieres aplicar.
356

5. Esto mostrará un diálogo o herramienta del efecto. Puedes ajustar varios

controles y generalmente podrás ver una vista previa del efecto en el diálogo.

Una vez que has finalizado, haz clic sobre ACEPTAR para volver a MAGIX Web
Designer 10 Premium.

Editar formas
Si aplicas un efecto en vivo a una forma o texto, podrás seguir editando el objeto sin
problema. Cada ve que lo editas, el efecto en vivo se vuelve a aplicar
automáticamente al objeto. Para efectos bloqueados, esto no es posible y debes
eliminar el efecto usando el botón ELIMINAR de la barra de información de los efectos
en vivo, después editar la forma y finalmente volver a aplicar el efecto.

Bloquear efectos
Cuando cambias el tamaño o giras un objeto que tiene aplicado un efecto en vivo,
Web Designer lo considera una edición y vuelve a generar el efecto. Sin embargo, es
posible que esto no sea lo que quieres, por lo que a veces es útil bloquear un efecto.

Los plug-ins de "viejo estilo" de Photoshop ya están BLOQUEADOS al aplicarlos. Esto

significa que la capa subyacente no puede editarse. También puedes bloquear un
efecto en vivo para que permanezca fijo al cambiar el tamaño o girar el objeto, como
si estuvieras girando o cambiando el tamaño de un mapa de bits.

Como ejemplo de esto, imagina un plug-in que siempre aplica ondas horizontales. (El
efecto en vivo "Televisión" muestra algo similar). Aplica este efecto a la forma y verás
una línea horizontal sobre ella. Si después giras la forma, ¿querrás que las ondas giren
también? De ser así, bloquea el efecto antes de la rotación. Si, por el contrario, quieres
que el efecto de ondas horizontales se vuelva a aplicar en el rectángulo girado, dejar el
efecto sin bloquear.

Cuando un efecto en vivo está bloqueado, el efecto gira con el objeto (izquierda).

Si envías los diseños a otras personas para que los carguen pero no tienen los plug-in
utilizados en el diseño, no verán los efectos aplicados. Para evitar este problema,
puedes bloquear los efectos. Los efectos bloqueados se guardan como mapas de bits

www.magix.es
 La herramienta de fotos 357

en el documento, de forma que todos pueden verlos, incluso si no tienen los plug-ins
que generaron los efectos.

Para bloquear un efecto, selecciona el objeto o los objetos y después haz

clic en el símbolo del CANDADO de la barra de información de los EFECTOS
EN VIVO . Para desbloquear un efecto que has bloqueado de esta forma,
vuelve a hacer clic sobre el CANDADO.

Todavía puedes modificar la resolución del efecto. Es posible que quieras utilizar una
resolución mayor para la impresión que si solamente quieres trabajar en pantalla.

Resolución de los efectos en vivo

Para la utilización en pantalla y web, se recomienda no modificar la resolución por
defecto de 96 DPI (la misma que la resolución de pantalla). Si necesitas una imagen
con resolución mayor, por ejemplo, si quieres imprimir o exportar un mapa de bits de
alta resolución, puedes aumentar este valor a 150 DPI o más. Cuanto mayor sea la
resolución, más tiempo se necesitará para generar o volver a generar el efecto
(porque tiene que trabajar con un mapa de bits mucho más grande) y más memoria
se necesitará.

Puedes configurar la resolución de un efecto en vivo como "automático" en vez de

escoger un valor DPI fijo. Con esta configuración, el efecto se volverá a generar
automáticamente cuando sea necesario y con la resolución más apropiada. Por
ejemplo, si imprimes un diseño que contiene efectos en vivo, cualquier efecto
configurado como AUTOMÁTICO se regenerará en la resolución de impresión si
todavía no se encuentra en esa resolución o en una mayor. En un diseño grande con
muchos efectos, esto puede hacer que la impresión sea más lenta porque cada efecto
debe volver a generarse en alta resolución.

Puedes cambiar la resolución que se utiliza para renderizar los efectos en la pestaña
EFECTOS Y PLUG-INS del diálogo de OPCIONES . El valor por defecto es 96 DPI. Una vez
que modificas esta configuración, todos los efectos que apliques posteriormente se
realizarán con la resolución seleccionada. Cambiar la configuración no modificará la
resolución de los efectos que ya se han aplicado.

Para más información sobre el diálogo de opciones, lee el capítulo Personalización

de Web Designer.

Para cambiar la resolución de un efecto que ya se ha aplicado, utiliza el control de DPI

en la barra de los EFECTOS EN VIVO.

Guardar y transferir archivos

Cuando transfieres un archivo a otra persona, no podrá ver los efectos aplicados,
salvo que tenga instalados los mismos plug-ins (esto es similar a los problemas con
las fuentes: el receptor necesita tener instaladas todas las fuentes utilizadas en el
358

diseño para ver una representación precisa del texto en el documento). Para
garantizar que el receptor pueda ver los efectos de tu diseño, bloquea los efectos
antes de guardar.

Cuando esté cargado un diseño que utilice efectos que no están instalados, se emitirá
un aviso para notificar al usuario que es posible que el diseño no se vea de la forma
pensada por el diseñador.

Dado que los efectos bloqueados se guardan como mapas de bits en el archivo Xara,
los archivos serán más grandes que para los efectos en vivo sin bloquear.

Copiar efectos en vivo

Para más información sobre copiar y pegar, lee el capítulo Trabajar con objetos (en
la página 108).

Puedes copiar efectos en vivo en tu diseño desde un objeto a otro utilizando PEGAR
ATRIBUTOS , de la misma forma que copias todos los demás atributos. Simplemente
selecciona el objeto con el/los efecto/s que quieres copiar y escoge Edición > Copiar.
Después selecciona el objeto u objetos a los que quieres copiar los efectos y escoge
Edición > Pegar atributos.

Ten en cuenta que no puedes copiar efectos de plug-in de "viejo estilo" de Photoshop
de esta forma porque esos efectos no tienen la capacidad de volverse a aplicar.

Cambio de tamaño teniendo en cuenta el

contenido
En Web Designer la herramienta CAMBIO DE TAMAÑO TENIENDO EN CUENTA EL
CONTENIDO no se presenta en la barra principal desde el inicio. Si quieres usara esta
herramienta puedes encontrarla en la PALETA DE BOTONES.

Para abrir la paleta de botones selecciona BARRAS DE CONTROL... del menú VENTANA
y desplázate por la lista hasta el final. Ahora haz clic en la casilla al lado del elemento
PALETA DE BOTONES . (O puedes hacer clic derecho en un área vacía de cualquier
barra de botones y elegir PALETA DE BOTONES del menú desplegable).

Si quieres usar esta herramienta a menudo puedes moverla fuera de la "Paleta de

botones" arrastrándola sobre la barra de herramientas. (Mantén "Alt" pulsado,
arrastra el botón y suéltalo sobre un icono de la barra de herramientas).

Se puede arrastrar el botón de cambio de tamaño teniendo en cuenta el contenido

sobre la herramienta de foto desplegable si te aseguras de que está abierto antes de
que sueltes el botón, pero ten en cuenta que no se situará en esta posición cuando
vuelvas a reiniciar el programa.

www.magix.es
 La herramienta de fotos 359

Web Designer incluye ahora la posibilidad de ampliar las fotos con una nueva técnica
que conserva las proporciones de los aspectos clave de la misma.

El ojo humano es particularmente sensible a los cambios en la proporción de aspecto

de los objetos usuales y la mayoría de las personas puede reconocer cuando algo es
incorrecto en las imágenes que se han extendido o reducido levemente.

Aquí hay una foto de ejemplo del famoso

arco Torii en Japón. Claramente el arco es el
objeto principal de esta foto.

Aquí la foto se ha
extendido utilizando
el método de
extensión normal de
la HERRAMIENTA DE
SELECCIÓN . Aun con
esta extensión
moderada, es obvio
que las proporciones
del arco se han
distorsionado de
forma incorrecta.

Extender utilizando "Cambio de tamaño teniendo en cuenta el contenido". Sigue pareciendo

perfectamente natural. Las proporciones se han conservado, aun con esta extensión extrema, que
es dos veces más ancha que el original. La línea de la costa extendida continúa pareciendo
natural.
360

Preparar tu foto
La función de modificación del tamaño con contenido forma parte de las herramientas
de FOTO.

Selecciona tu foto y de la barra desplegable de la herramienta de foto,

selecciona el BOTÓN DE CAMBIO DE TAMAÑO CON CONTENIDO. El extremo
derecho de la barra de información muestra ahora un conjunto de botones.

Selecciona una foto, ve a herramienta de foto y la barra de información debería tener

el aspecto siguiente;

Primero haz clic en el botón PREPARAR para preparar la foto para el cambio de
tamaño. Esto inicia un análisis de la foto para calcular qué partes de una imagen se
pueden estirar y qué partes se deben mantener. Este proceso puede tomar un tiempo
dependiendo de la resolución de la foto y de cuántos procesadores tenga tu PC.

Para una imagen con una resolución realmente alta, se recomienda reducir la
resolución de imagen si no necesitas la resolución máxima. Haz esto antes de
seleccionar los botones Preparar. Para reducir la resolución de tu foto, selecciona el
botón OPTIMIZAR e introduce un ancho en píxeles o una resolución en dpi en le
diálogo. El tamaño de la imagen en la página no cambiará, solo cambia la resolución o
el número de píxeles de la foto. Después de preparar la imagen aparecerán nuevas
flechas de modificación de tamaño en los lados de la foto. Simplemente tira de éstas
para ampliar o reducir la imagen en la dirección deseada.

Optimizar
Las fotos que han sido preparadas para permitir la modificación de tamaño con
contenido tienen datos adicionales guardados junto a las mismas para permitir
ajustes posteriores. Cuando guardas un documento, estos datos adicionales también
se guardan, por lo que puedes cargar este documento y continuar ajustando el ancho
y la altura sin necesidad de realizar otra operación Preparar.

Cuando termines de modificar el tamaño de la foto, se recomienda que "fijes" los

cambios utilizando la función Optimizar. Esto convertirá la imagen ampliada de nuevo
en una imagen JPEG incrustada, a cualquier resolución, y así se guardará el tamaño de
archivo de forma sustancial.

Restablecer
Si haces clic en el botón "Restablecer", se restablece la imagen volviendo a su estado
original y borrando cualquier reducción o cualquier máscara que se pueda haber
aplicado.

www.magix.es
 La herramienta de fotos 361

Uso de máscaras con la función "Cambio de tamaño

teniendo en cuenta el contenido"
Si utilizas la herramienta de máscara podrás tener mayor control para evitar que las
áreas protegidas de la foto se distorsionen. Las áreas con máscara no se
distorsionarán de ninguna forma. Lee el capítulo Máscaras (en la página 263) para
más información acerca de las máscaras. Igualmente encontrarás a continuación un
resumen sobre la uso de máscaras con el cambio de tamaño teniendo en cuenta el
contenido.

Para proteger una o más áreas de la foto contra la distorsión:

1. Selecciona una de las herramientas de máscara de la barra desplegable
HERRAMIENTAS DE MÁSCARA y selecciona la parte o partes de la foto que quieres
proteger.
2. Ahora ve a la herramienta "Cambio de tamaño teniendo en cuenta el contenido"
y haz clic en la foto.

Ahora, cuando uses el botón PREPARAR , esta área estará protegida contra la
distorsión. Es posible que necesites seleccionar la foto para habilitar el botón
PREPARAR .

Nota: puedes enmascarar más de la mitad de la imagen. La operación de

preparación dará un error si pruebas esto.

Ajustar una máscara o añadir una nueva máscara

No puedes añadir una máscara a una imagen que ya has extendido. Si deseas añadir
una nueva máscara o ajustar la existente, tienes las siguientes opciones:
1. Haz clic en el botón RESTABLECER y dibuja una nueva máscara.
2. Haz clic en deshacer la cantidad de veces necesarias para regresar a la máscara
y después utiliza las herramientas de dibujo normales para ajustar las formas de
la máscara.
3. O bien, antes de seleccionar los botones PREPARAR , copia la máscara al
portapapeles. Si deseas utilizarla posteriormente, RESTABLECE la imagen, vuelve
a activar la HERRAMIENTA DE MÁSCARA y pega la forma en la capa de máscara.

Existe otra alternativa en la que puedes "fijar" una imagen extendida utilizando la
función OPTIMIZAR y después aplicar la nueva máscara. En la mayoría de los casos
esto no es recomendable porque produce resultados de menor calidad que al
restablecer la imagen y aplicar la máscara a la imagen original.
362

Zoom de foto teniendo en cuenta el contenido

Una alternativa al cambio de tamaño con contenido en que la foto conserva su
tamaño pero el contenido se amplía de forma inteligente. Aquí se ilustra un ejemplo
del efecto.

Utiliza la barra de zoom de la barra de información para

controlar el zoom de la foto con contenido.

La imagen conserva el mismo tamaño pero el programa detecta y amplía

automáticamente el contenido "interesante". Ten en cuenta que esto no es un recorte
de la chica, sino que todos los elementos, nubes y césped que aparecen en el original
están ampliados en la versión ampliada. El programa detecta automáticamente que el
surfer es la "región de interés" por lo que lo amplía.

Otro ejemplo:

El programa ha determinado que las flores, no las hojas del fondo, son el área de
interés, por lo que ha ampliado esas partes. Con la función de máscara puedes
proteger cualquier parte de la imagen de la distorsión a pesar de que estos dos
ejemplos anteriores no utilizan ninguna máscara.

Modificación de tamaño con contenido alternativa

Cuando amplías fotos hay dos formas alternativas de modificar la imagen. El método
de arrastrar las flechas de tamaño a veces no ofrece un buen resultado con algunos
tipos de imagen.
www.magix.es
 La herramienta de fotos 363

Sin embargo, si pulsas la tecla Alt mientras arrastras un extremo de los controles
deslizantes laterales en la herramienta de modificación de tamaño con contenido, se
utilizará una escala inteligente diferente con un algoritmo que tendrá mejores
resultados en algunas fotos.

Notas acerca de Cambio de tamaño teniendo en cuenta el

contenido
• Solo puedes comprimir la imagen a la mitad de su ancho o alto inicial
• Si guardas un documento con una foto que se ha preparado para el cambio de
tamaño teniendo en cuenta el contenido, entonces se guardará la información de
cambio de tamaño en el documento. La ventaja es que después puedes reajustar
la foto utilizando la característica para tener en cuenta el contenido. Existe una
gran ventaja de tamaño de archivo significante de guardar las fotos de esta
forma.

Creación de panorámicas
MAGIX Web Designer 10 Premium incluye una herramienta que puede unir
hasta 8 fotografías automáticamente para convertirlas en una única
panorámica de alta resolución.
La creación de una panorámica de alta calidad puede tornarse en un proceso muy
técnico y complejo. En general requiere la utilización de un equipo y lentes especiales
para obtener fotografías con la misma alineación y exposición. Con la herramienta
para crear panorámicas que viene con el MAGIX Web Designer 10 Premium no
necesitarás nada de esto y puedes utilizar una cámara digital de uso diario y podrás
crear imágenes panorámicas de alta excelente calidad en tan solo un par de minutos.

Característica de esta herramienta:

• Cálculo automático de distancia focal para optimizar imágenes y minimizar el
efecto "ojo de pez"
• Ajustes: distorsión de barril (automatic barrel), distorsión de cojín (pin cushion)
y efecto viñeta
• Corrección automática de exposición
• Detección automática de puntos superpuestos compartidos y unión
"transparente" de líneas
• Recorte automático del resultado final

Para crear una panorámica debes sacar una serie de fotos desde un lugar en donde te
encuentres parado en una posición central con respecto al objeto a fotografiar.
Idealmente cada foto se superpondrá con la próxima en un 30%, aunque funcionará
con más o menos superposición.

El proceso de creación de una panorámica es muy simple:

364

1. Importa cada una de las fotos. No es necesario que intentes colocar las
superposiciones de forma correcta.
2. Selecciona todas las fotos que desees unir.
3. Haz clic en el botón PANORÁMICA en la barra desplegable de la HERRAMIENTA DE
FOTO .

Comenzará el proceso de unión (stitching) y continuará como proceso de fondo. Se

abrirá una ventana emergente (pop-up) que te indicará el progreso por los distintos
estadios, aunque podrás seguir utilizando el MAGIX Web Designer 10 Premium
normalmente mientras avanza. Cuando esté completo el proceso, la imagen
panorámica será importada a la página. Ten cuenta que esta no reemplaza las
imágenes originales y puedes borrarlas si no las necesitas.

Tres ejemplos de fotos de un paisaje. Cada foto se superpone con la otra (en este caso un poco
más de lo necesario).

La imagen panorámica final es el resultado de la unión sin transiciones del grupo de fotos
originales.

Optimizar imágenes
El MAGIX Web Designer 10 Premium siempre une las fotos en alta resolución,
incluso si has reducido el tamaño de la imagen en la página. Esta característica es
muy práctica porque produce resultados de máxima calidad con la resolución más
alta posible. Pero esto sí quiere decir que la composición de una panorámica necesita
un par de minutos. Por eso, a veces es mejor reducir la resolución de las imágenes
antes de crear la panorámica, especialmente si solo necesitas un resultado final con
una resolución de calidad mediana, como para la web.
www.magix.es
 La herramienta de fotos 365

Para reducir la resolución de cualquier imagen, reduce la imagen en la página al

tamaño requerido y luego utiliza la opción "HERRAMIENTAS > OPTIMIZAR FOTO". Ten
en cuenta que la herramienta para crear una panorámica (panorama stitcher)
funciona mejor con imágenes en alta resolución (ya que de esta forma le es más fácil
al programa encontrar los partes que se repiten en las diferentes fotos para realizar la
unión).

Cuando esté lista la imagen panorámica se guardará como una imagen PNG en el
MAGIX Web Designer 10 Premium. Este es el formato de mejor calidad pero ocupa
mucha memoria y espacio de archivo, especialmente si es una panorámica en alta
resolución. (La GALERÍA DE MAPA DE BITS te indicará cuánto espacio necesita). Por
ello, es recomendable que reduzcas la resolución de la imagen final y luego la
conviertas a JPG. Para realizar esta acción, utiliza nuevamente la opción
"HERRAMIENTAS ->OPTIMIZAR FOTO".

Notas:
• La herramienta creadora de panorámicas (panorama stitcher) requiere que
todas las fotos tengan el mismo tamaño y resolución.
• En la medida de lo posible no saques fotos a objetos en movimiento. Esto puede
llegar a confundir el sistema ya que el mismo objeto puede llegar a aparecer en
distintos lugares de la misma foto, o directamente ni figurar.
• Intenta mantener el horizonte a la misma altura en cada foto.

Consejo: Si sacas las fotos con estilo retrato puedes obtener una cobertura máxima
vertical.

Actualizaciones para el Panorama Studio

Si así lo deseas puedes descargar una versión más flexible y poderosa del programa
Panorama Studio. Esta actualización te ofrece más herramientas y controladores para
la creación de una panorámica. Los usuarios de Designer Pro reciben este programa
gratis con el producto en el CD.

Si el Panorama Studio está instalado se te ofrecerá la opción de utilizarlo en lugar de

la versión estándar cuando seleccionas el botón "Panorámica".
366

Herramienta de extrusión 3D
La HERRAMIENTA DE EXTRUSIÓN ofrece una rápida y sencilla posibilidad para convertir
formas 2D y textos en extrusiones 3D con efectos de luz y sombras de alta calidad. Se
basa en la tecnología de MAGIX 3D Maker utilizada. Te permite realizar -arrastrando
con el ratón a la pantalla- rotaciones de objetos 3D en tiempo real, la adaptación de la
profundidad de extrusión y el desplazamiento de tres fuentes de luz en un espacio 3D
alrededor del objeto.

La barra de información permite la selección de los tipos de bordes que se podrán

visualizar a lo largo de la extrusión. Puedes optar entre una selección de más de 25
tipos de contornos.

Extrudir una forma

Para cambiar una forma 2D a un objeto extrudido 3D, ve a la herramienta de
extrusión en la barra de herramientas principal y simplemente haz clic y
arrastra el objeto para rotarlo dentro del espacio 3D.

Inicialmente se le da una profundidad por defecto a la extrusión. El color del frente de

la forma 3D tendrá el color del relleno de la forma original y el color de la extrusión
(los costados del objeto 3D) será del mismo que el color de la línea de la forma. Luego
de haber creado una extrusión, mueve el cursor del ratón sobre el objeto 3D. Verás

www.magix.es
 Herramienta de extrusión 3D 367

que el cursor irá cambiando de símbolos en la pantalla para indicar qué ocurrirá si
haces clic y arrastras a otros puntos del diseño:

Verás esto cuando el cursor del ratón esté sobre el frente o el reverso del
objeto. Si haces clic y luego arrastras el ratón, el objeto girará en el espacio
3D.
Esto se puede visualizar cuando el cursor del ratón se encuentra sobre la
extrusión (costados del objeto extrudido). Si haces clic y luego arrastras el
ratón cambiarás la profundidad de la extrusión.

Verás esto cuando el cursor del ratón se encuentra sobre la extrusión y

mantengas presionado el botón "Ctrl". Haciendo clic y luego arrastrando el
ratón cambiará el tamaño del bisel (ver abajo).

Barra de información de Herramienta de

extrusión

Extrusión On/Off
Lista de tipo de barra deslizante
Valor numérico y de barra deslizante para el parámetro seleccionado
Tipo de bisel
Barra deslizante y valor del tamaño de bisel
Luces On/Off
Brillo/Mate
Esquina con inglete/Esquina redonda

Puedes ajustar un objeto 3D extrudido de forma manual, directamente en la página

como se describe más arriba, o seleccionándolo y utilizando los controles de la barra
de información de la Herramienta de extrusión.

Activar o desactivar (on/off) la extrusión

EXTRUSIÓN ON/OFF

Una vez que una forma o un objeto ha sido extrudido las modificaciones que se le
pueden realizar al objeto original son limitadas. Por ejemplo, si has extrudido una
forma, no es posible editar la forma con la "herramienta de edición de forma" porque
ya no es más una forma simple de 2D con la que puedes interactuar. Sin embargo, si
368

utilizas este control puedes "desactivar" temporariamente la extrusión para poder

visualizar y modificar el objeto subyacente utilizando otras herramientas, antes de
volver a activar la extrusión otra vez. Luego de realizar la modificación y de activar la
extrusión, la extrusión se volverá a aplicar a tu objeto 2D modificado, con todos los
mismos atributos 3D que tenía antes de haber desactivado la extrusión.

Ten en cuenta que en algunos casos si cambias mucho la forma del objeto mientras
la extrusión está desactivada (p. ej. cuando transformas un objeto a una forma
completamente diferente), puede ocurrir que los atributos de la extrusión 3D que
hayas aplicado no se haya conservado. En estos casos puedes utilizar PEGAR
ATRIBUTOS para copiar los atributos de una copia de tu extrusión original antes de la
modificación. Ver Copiando estilos: pegar atributos (en la página 134).

Profundidad de la extrusión
La forma más fácil de ajustar la profundidad de la extrusión es que hagas clic y luego
arrastres el cursor sobre la extrusión como ha sido explicado arriba. Aunque también
para realizar ajustes puedes utilizar la barra deslizante, que se encuentra en la parte
izquierda de la barra de información de la herramienta de extrusión. Asegúrate de
haber seleccionado PROFUNDIDAD DE EXTRUSIÓN en la lista desplegable a la izquierda
de la barra deslizante (esta es la configuración que viene por defecto). La profundidad
de la extrusión actual se puede visualizar en el campo numérico a la derecha de la
barra deslizante, también puedes introducir al campo tus valores para la profundidad
de la extrusión.

Tipo y tamaño del bisel

El tipo de bisel determina el perfil que tendrán los costados, los bordes y las esquinas
de la extrusión 3D. El tipo de bisel que se activa por defecto es el bisel con esquinas
redondeadas. La lista desplegable del tipo de bisel tiene una larga selección de
distintos tipos de biseles de las que puedes elegir. Puedes ajustar el tamaño del bisel
utilizando la barra deslizante a la derecha de la lista de tipos de bisel. A la derecha de
la lista de tipos de bisel se encuentra un campo numérico que muestra el tamaño
actual del bisel, y si quieres puedes introducir otro tamaño de bisel.

Un atajo (shortcut) alternativo para ajustar el tamaño del bisel es que arrastres el
cursor al costado del objeto 3D mientras mantienes presionado el botón "Ctrl" (con la
herramienta de extrusión activada).

Luces
LUCES ON/OFF

Si activas las luces podrás ajustarlas a tu gusto en el espacio 3D . Hay tres luces a las
que se les puede asignar un color propio y una posición específica en el diseño.

www.magix.es
 Herramienta de extrusión 3D 369

En este ejemplo, el color del frente

de la forma será blanco. Pero verás
que se ve verde porque hay una luz
verde que ilumina casi
directamente la "cara" (frente) de la
forma.
Podrás optimizar los objetos 3D en
tu diseño ajustando sus colores y
las posiciones de las tres luces.

Detrás del objeto hay una luz de color beige/naranja y otra de color púrpura. Ambas
luces generan reflejos en los costados, y si cambias el color o la dirección de las luces
que se encuentran detrás del objeto, los reflejos de las luces también cambiarán.

Para mover una luz alrededor del objeto 3D, arrastra la flecha de la luz. Si sueltas la
luz detrás del objeto 3D (ya no la podrás seleccionar), puedes recuperarla utilizando
la barra deslizante de la izquierda en la opción "Extrudir" de la barra de información.
Selecciona uno de los ángulos de luz de la lista desplegable (por ejemplo: "Luz 2
Ángulo 1") a la izquierda de la barra deslizante. La luz se moverá alrededor del objeto
3D de tu diseño. Las distintas opciones de "ángulos de luz" de esta lista desplegable
te permiten mover todas las luces en cualquier dirección del espacio 3D para lograr
las posiciones que desees. Sin embargo, en general también obtendrás buenos
resultados arrastrando las flechas de luz a la página.

Para cambiar los colores de las luces, sólo tienes que arrastrar los colores de la barra
de colores y soltarlos directamente sobre las flechas de luz. Para editar el color de la
luz con el editor de color, haz doble clic en la flecha de luz que quieres cambiar y el
editor de color se abrirá con el color de la luz que hayas seleccionado. Ahora podrás
editar los colores de la luz. Con el editor de color abierto, mientras haces clic en las
diferentes flechas de luz, en el frente (cara) y en los costados de la extrusión, el color
seleccionado de la lista desplegable del editor de color cambia para que coincida con
el de la selección; así podrás seleccionar y cambiar rápidamente los diferentes colores
de tu extrusión.

Brillo / Mate
Utiliza este botón para hacer la superficie del objeto 3D más o menos
reflectante. Con la opción de brillo y la luz posicionada en el lugar correcto
detrás del objeto, la luz rebotará en los costados del objeto creando un efecto.

Esquina con inglete / Esquina redonda

Puedes elegir entre esquinas CON INGLETE o REDONDAS para tu objeto
3D. Las esquinas con ingletes tienen bordes cuadrados y las redondas
producen bordes redondeados.
370

Texturas y fotos
Cuando extrudas una foto, la foto se verá en el frente (cara) del objeto 3D. Puedes
crear impresionantes efectos 3D de fotos en un par de segundos con tan sólo
importar una foto y luego aplicarle una extrusión.

Este efecto se genera cuando realizas una extrusión de una foto y la giras un poco, creando una
copia reflejada por medio de la herramienta de selección, y ajustando el ángulo 3D para que
coincidan. Luego se le da una transparencia graduada para crear un reflejo más oscuro.

Puedes utilizar cualquier foto o textura para el frente de tu extrusión. Puedes importar
tu imagen y realizarle una extrusión como se explicó arriba, o arrastra y suelta una
imagen sobre el frente de una extrusión existente mientras presionas "Shift". Se habrá
aplicado la foto o la textura en el frente (cara) del objeto extrudido.

Extrudir texto
Puedes realizar una extrusión a un texto de la misma forma que se le puede realizar a
una forma. Haz clic y arrastra el ratón sobre el texto mientras utilizas la herramienta
de extrusión. Como es de esperar, si haces esto a varias palabras esto puede ser un
proceso lento y no es recomendable.

www.magix.es
 Herramienta de extrusión 3D 371

Como el texto en general es negro, al menos que cambies el color de la extrusión

resultante también será totalmente negro (esto hace difícil su visualización). Por ello,
se recomienda cambiar el color antes de realizar la extrusión (aunque puedes
cambiarlo luego con sólo hacer clic en un color).

Como ocurre con otros objetos extrudidos, si quieres editar el texto, sólo tienes que
desactivar la extrusión utilizando el botón de la izquierda de la barra de información
para realizar extrusiones, edita el texto y luego vuelve a activar la extrusión con el
mismo botón.

Copiar atributos de una extrusión 3D

Puedes copiar y pegar el estilo de una extrusión 3D, de un objeto 3D a otro. Esta
opción funciona de la misma forma que para todos los atributos en el Web Designer.
Simplemente copia la fuente del objeto extrudido al portapapeles y luego selecciona
uno nuevo, después selecciona EDITAR -> PEGAR ATRIBUTOS . Ten en cuenta que esta
acción sólo pegará los atributos 3D sobre otros objetos 3D extrudidos. Por ello,
primero tienes que extrudir una forma antes de pegarle los atributos 3D.

Esto copiará todos los atributos 3D tales como la profundidad de la extrusión, los
colores de la luz, tipo de bisel, y los colores del frente del objeto y los bordes.

Insertar sombras detrás del objeto

Utilizando la herramienta de sombra puedes optimizar el efecto 3D colocando una
sombra tenue detrás del objeto. Sólo tienes que aplicar herramienta de sombra y
arrastrarla sobre el objeto 3D.

El ejemplo de la izquierda es un ejemplo de una sombra de pared y el de la derecha es de una

sombra de suelo.
372

Barras de navegación
La mayoría de los sitios web tienen una barra de navegación horizontal o vertical,
desde la que puede accederse a todas las páginas importantes.

MAGIX Web Designer 10 Premium incluye funciones especiales para las barras de
navegación, que facilitan la inserción, edición y eliminación de botones. Los botones
de una barra de navegación pueden ajustar el ancho para coincidir automáticamente
con sus etiquetas y se reposicionan automáticamente cuando realizas cambios. Hasta
puedes agregar menús y submenús desplegables a tus barras y hacer que se puedan
agregar o eliminar botones automáticamente al agregar o eliminar páginas.

Los usuarios avanzados pueden crear sus propias barras a partir de diseños de
botones propios y modificar los diseños de botones existentes en una barra de
navegación para aplicar su nuevo diseño en toda la barra.

Usar de barras de navegación de plantillas

La galería de diseños contiene una amplia variedad de barras de navegación de
plantillas para tu uso. Son tanto barras horizontales como verticales y son
completamente personalizables. Tan solo arrastra y suelta una barra desde la galería
hasta tu página. O reemplaza una barra existente soltando la nueva encima: la nueva
barra adopta todos las etiquetas de los botones, enlaces y menús de la barra
reemplazada.

Cuando sueltes la barra puede que se te sugiera ajustar el esquema de color del
documento si no es el mismo que el de la barra. Puedes usar el color de la función de
reemplazo de color para cambiar los colores de la barra: todo esto sin tener que
desagrupar la barra en sus diferentes objetos. Tan solo selecciona la barra y haz clic
sobre un color de la línea de colores, o si está abierto el editor de color, elige el color
que desees editar desde la lista de colores desplegable.

Consulta Esquemas de colores de temas (en la página 181) para más información
sobre edición de temas de colores y mira en "Reemplazar colores" para saber como
puedes personalizar los colores fácilmente.

www.magix.es
 Barras de navegación 373

También se puedes crear barras de navegación desde cualquier diseño de botón: si

quieres crear tu propia barra, consulta más adelante en la sección correspondiente
de este capítulo.

Diálogo Propiedades de la barra de navegación

La mejor forma de editar las etiquetas, enlaces y otros atributos de una barra de
navegación y de agregar o eliminar botones, es utilizar el diálogo de propiedades de la
barra de navegación. Haz doble clic sobre una barra para abrir el diálogo o un clic
derecho sobre la barra y escoge "EDITAR BARRA DE NAVEGACIÓN " del menú
contextual.

La mitad superior del diálogo te permite establecer diversas propiedades de la barra

de navegación. La parte inferior te permite agregar y eliminar botones y menús y
editar las etiquetas y enlaces de cada botón y entrada del menú.

Orientación
Escoge la orientación horizontal o vertical que desees para tu barra de navegación.
Para las barras de navegación verticales generalmente querrás que los botones
tengan el mismo ancho (el ancho del botón más ancho), para obtener una barra
rectangular. Consulta la opción AJUSTAR TODOS LOS BOTONES A LA ETIQUETA MÁS
ANCHA a continuación para controlar esto.
374

Justificado
Escoge el comportamiento que deseas para tu barra cuando cambie su longitud al
editar etiquetas o añadir/quitar botones. Una barra horizontal JUSTIFICADA A LA
IZQUIERDA crecerá hacia la derecha a medida que agregas más botones o extiendes la
longitud de las etiquetas de los botones. El extremo izquierdo de la barra
permanecerá en el mismo lugar en la página. De forma similar, una barra JUSTIFICADA
A LA DERECHA mantendrá su extremo derecho y crecerá hacia la izquierda. Una barra
JUSTIFICADA EN EL CENTRO crece tanto para la derecha como para la izquierda de
forma equitativa. Selecciona la opción central si, por ejemplo, quieres que la barra de
navegación horizontal se centre en la parte superior de tu página.

Para barras verticales, las opciones de justificación cambian a Arriba, Centro y Abajo.
En el caso de las barras verticales, la configuración determina si la barra crece hacia
arriba (Abajo), hacia abajo (Arriba) o en ambos sentidos (centro) al agregar botones.

Ajustar el ancho de los botones a las etiquetas

Activa esta opción si quieres que los botones se extiendan, reduzcan o crezcan para
ajustarse al texto de la etiqueta. Si esta opción está desactivada, tus botones
conservarán el mismo tamaño de forma que una etiqueta que sea demasiado extensa
para el botón sobrepasará los extremos del botón.

Mismo ancho para todos los botones

Esta opción está disponible sólo si la opción "Ajustar el ancho de los botones a las
etiquetas" está activada. Selecciona esta opción para hacer que todos los botones
tengan el mismo ancho que el botón más ancho de la barra. Para las barras de
navegación verticales, esto es casi siempre deseable para obtener una barra
rectangular. Para las barras horizontales, muchas veces la barra tiene un mejor
aspecto si todos los botones tienen el mismo tamaño, pero requiere más espacio, por
lo que es posible que no puedas incluir tantos botones en la barra si esta opción está
activada.

Espaciado de botón
Aquí puedes escoger el espacio entre cada botón en la barra de navegación horizontal
si no quieres que cada botón se encuentre justo arriba de su vecino. Simplemente
introduce la cantidad de píxeles de espacio que te gustaría y observa el resultado de
inmediato.

El orden de los botones coincide con el orden de la página

Al activar esta opción, el orden de los botones de la barra de navegación coincidirá
con el orden de las páginas del documento. Si cambias el orden de las páginas en la
GALERÍA DE PÁGINAS Y CAPAS , la barra de navegación también se reordenará. Esto es
especialmente útil para las barras de navegación de los sitios web con
presentaciones, en los que es importante mantener el orden lineal de las páginas y
www.magix.es
 Barras de navegación 375

para los que deseas que los botones de la barra tengan el mismo orden de las páginas
de la presentación.

Barra de navegación del sitio

Esta es una opción muy importante en el DIÁLOGO BARRA DE NAVEGACIÓN que activa
los enlaces automáticos, es decir, que los botones y los enlaces se agregarán solos a
medida que agregas páginas. Además, todos los cambios que hagas a la barra se
reflejarán en todas las páginas del sitio tan pronto como cierres el diálogo Barra de
navegación.

Por lo general activas esta opción si quieres que tu barra de navegación aparezca en
todas las páginas de tu sitio web. Sin embargo, puedes eliminar manualmente la barra
de algunas páginas si así lo deseas.

Esta barra de navegación del sitio también es útil para completar automáticamente
las entradas de menú en un solo botón de barra de navegación después de convertirlo
desde un botón múltiple de barra de navegación. Ver Botón único de barra de
navegación (en la página 376) para más información.

Desplazamiento y tranformación de una barra de

navegación del sitio
Si mueves una barra de navegación del sitio sobre la página, la barra también se
mueve en todas las páginas en las que aparece. De la misma forma, si cambias el
tamaño de la barra con la HERRAMIENTA DE SELECCIÓN, la transformación se aplica a
todas las copias de la barra en otras páginas. No puedes realizar ninguna otra
transformación de una barra de navegación con la HERRAMIENTA DE SELECCIÓN
(rotación, extensión, cambio de tamaño en una sola dimensión).

Enlace automático de páginas

Cada vez que agregues una nueva página a tu sitio, un enlace a esa página se
agregará a tu barra de navegación del sitio y la nueva página obtendrá una copia de la
barra, si todavía no la tiene. Si tu barra cuenta con un botón sin usar, entonces ese
botón se enlazará con la nueva página. Si todos los botones ya contienen un enlace,
se agregará un nuevo botón al final de la barra y se lo enlazará con la nueva página. En
ambos casos, la etiqueta del botón se modifica para que coincida con el nombre de la
nueva página, si tiene un nombre o a "Nueva página" si no lo tiene. Generalmente
querrás editar de inmediato la nueva etiqueta en el diálogo de la barra de navegación.

Si eliminas una página de tu sitio web, el botón de la barra de navegación del sitio que
contiene el enlace con esa página se eliminará automáticamente en todas las páginas
de tu sitio.
376

Activación y desactivación de las barras de navegación del

sitio
Al activar y desactivar la opción de navegación del sitio en el diálogo de barra de
navegación, el cambio se refleja en todas las copias de esa barra.

Eliminación de una barra de navegación del sitio de una

página
Si quieres que la barra de navegación del sitio no aparezca en una página en particular
de tu sitio, simplemente haz clic en ella para seleccionarla en esa página y pulsa
Eliminar. Se te preguntará si quieres eliminar la barra de esa página sola o de todas.

Sin embargo, tras eliminar la barra de una o más páginas, si luego desactivas la opción
de barra de navegación del sitio (tal vez para editar el diseño de botones que no
puede realizarse con esta opción activada), y luego vuelves a activarla, la barra se
añadirá automáticamente a todas las páginas del sitio que no la contengan.

Barras de navegación del sitio y plantillas

Todas las plantillas de páginas únicas en la GALERÍA DE DISEÑOS cuentan con barras
de navegación configuradas para ser barras de navegación del sitio al cargarlas desde
la galería para iniciar un nuevo documento de página web. Esto significa que puedes
crear rápidamente un pequeño sitio web con todas las páginas enlazadas a la barra
sin tener que agregar botones ni enlaces de página de forma manual. De la misma
forma, todas las plantillas de páginas web tienen barras de navegación del sitio
activadas. Si no quieres este comportamiento, desactiva la opción de barra de
navegación en el DIÁLOGO DE BARRA DE NAVEGACIÓN .

Las barras de navegación independientes presentadas con cada tema en la galería no

tienen la opción de barras de navegación del sitio activada. Esto es porque es
probable que un usuario que agregue manualmente una barra no quiera que la barra
apareza en todas las páginas. De todas formas, esta opción puede activarse
fácilmente en el diálogo de barra de navegación de ser necesario.

Otros aspectos interesantes

Si eliminas un botón que refiere a una de tus páginas o si cambias el enlace para que
refiera a otro lugar, no se realizará acción alguna para restaurar un enlace de botón a
la página. Se asume que has decidido que no quieres utilizar un enlace directo a esa
página en tu barra de navegación del sitio. Los nuevos botones y enlaces de página
solamente se crean cuando se agrega una página.

www.magix.es
 Barras de navegación 377

Barras de navegación de botón único

Las páginas diseñadas para ser visualizadas en dispositivos móviles pequeños tienen
poco espacio para barras de navegación horizontales o verticales, por lo que se
necesita una solución más eficiente en relación al espacio. Usar una barra de
navegación con un único botón y un menú es una de las soluciones que funcionan
bien, no importa cuantas páginas tenga el sitio.

Barra de navegación vertical de botón único

Para hacer una barra de navegación de botón único de una barra normal, tan solo abre
el diálogo PROPIEDADES DE LA BARRA DE NAVEGACIÓN (haz doble clic sobre la barra de
navegación) y borra todos los botones menos uno. Ahora borra los enlaces del botón
(haz clic en el campo URL al lado del botón en el diálogo y elige NO APLICAR en el
diálogo de enlace). Ahora puedes comenzar a añadir entradas de menú al botón de
forma manual en el diálogo de la barra de navegación o se puede añadir una entrada
de menú de forma automática para cada página en tu sitio web. Para añadir los
enlaces de forma automática, activa la opción BARRA DE NAVEGACIÓN DE PÁGINA WEB
en el diálogo (o desactívala y actívala de nuevo si ya estaba activada). Verás que tu
menú se completa con un enlace a cada página de tu sitio web. Edita los nombres de
cada entrada en el menú si no quieres que sean los mismos nombres que las páginas.

Hay una selección de diferentes diseños de barra de navegación en la GALERÍA DE

DISEÑOS dentro de "WIDGETS Y ELEMENTOS DE PÁGINA" > "BARRAS DE NAVEGACIÓN" .
También cada uno de los temas que hay en Temas de páginas web (general) tienen
sus propios diseños de barra de navegación. Cambia el diseño de tu barra de
navegación arrastrando un nuevo diseño de la galería de diseños y soltándolo en tu
barra.

IMPORTANTE: ten en cuenta que algunas barras de navegación tienen diseños de

primer y último botón que difieren del diseño de los botones centrales. Estas barras
378

de navegación no son adecuadas para un botón único porque si se queda el botón

central solo, su diseño es poco probable que sea atractivo, por lo que el diálogo de
propiedades de la barra de navegación no te permite borrar los botones de la derecha
y la izquierda de estas barras para dejar solo el central. Por lo que elige un diseño de
barra de navegación donde todos los botones de la barra tengan la misma apariencia.

Todos los botones iguales: adecuado

para barras de navegación de botón
único.

Diseños de botón final diferentes: no

adecuado para barras de navegación
de botón único.

Para convertir una barra de navegación de botón único en una barra de botones
múltiples normal, tan solo añade más botones y borra las entradas de menú del
primer botón si no se requiere ningún menú.

Botones y menús
Edita las etiquetas de botones, enlaces y otros atributos de botones con la tabla y los
controles con estructura de árbol en la mitad inferior del DIÁLOGO DE BARRA DE
NAVEGACIÓN . Cada fila de la tabla corresponde a un botón de la barra o a una entrada
en un menú de uno de los botones.

Agregado y edición de botones

Para agregar un botón, haz doble clic sobre la primera columna, en el lugar donde dice
"Doble clic para agregar botón". Se agregará una nueva fila debajo de la fila
correspondiente al último botón. O haz clic en el botón AÑADIR en la parte inferior del
diálogo para agregar un botón detrás del botón seleccionado. Puedes comenzar a
editar de inmediato la etiqueta para el nuevo botón. Para completar la edición de la
etiqueta, pulsa Intro o haz clic en algún lugar fuera de la etiqueta.

Puedes editar cualquier etiqueta de botón si haces clic en la fila apropiada para
seleccionarlo y luego haces clic en la primera columna para iniciar la edición de la
etiqueta.

www.magix.es
 Barras de navegación 379

Para fijar el enlace de un botón, haz doble clic en el campo de la URL o, si la fila ya
está seleccionada, simplemente haz clic en ella. Aparecerá el DIÁLOGO ENLACE DE
PROPIEDADES WEB . Este debería parecerte familiar, puesto que es el mismo diálogo
Enlace (en la página 269) que utilizas para agregar otros enlaces a tu página y están
disponibles las mismas opciones. Algunas opciones están desactivadas porque no
son aplicables a las barras de navegación ni a los enlaces de menú, como la opción de
foto emergente que sólo funciona cuando se aplica a una foto.

También puedes configurar el texto de consejo de herramienta para cada botón en la

tercera columna. Edita el texto de la misma forma en que lo haces con el texto de la
etiqueta. En el sitio web exportado, este texto aparecerá como un pequeño consejo de
herramienta emergente cuando se coloque el cursor del ratón sobre el botón o
entrada del menú.

Creación de los botones MouseOver propios

Puedes crear tus propios botones MouseOver desde cero dibujando los elementos
necesarios con rectángulos, texto, etc. Tan solo dibuja las partes principales del botón
en la capa MouseOff (recuerda agruparlo (en la página 51)) y coloca la versión
destacada correspondiente en la capa MouseOver. Mientras que la versión MouseOff
tenga un enlace de dirección web, la versión MouseOver se visualizará
automáticamente cuando muevas el ratón por encima de la página web. (La capa
MouseOver tiene que estar encima de la capa MouseOff).

En otras palabras, otorgas al objeto principal una dirección web utilizando la

opción de enlace. Después seleccionas una capa MouseOver en la GALERÍA DE
PÁGINAS Y CAPAS y colocas las versiones MouseOver de tu botón en esta capa
para que se superpongan con el objeto con el enlace.

Nota técnica: cualquier objeto gráfico en la capa MouseOver se visualizará si se

superpone como mínimo el 50% con el objeto de la capa MouseOff. Las dos
versiones de botones MouseOver se mantienen sincronizadas con la función de
grupos suaves. Si seleccionas un botón en una capa, se selecciona automáticamente
la versión de grupo suave en la otra capa, aun cuando la capa esté desactivada. Al
editar el texto del botón en una capa, se pondrá en sincronía automáticamente con la
otra versión del botón.

Para asegurarte de que el texto cambie en los dos estados cuando editas uno de ellos,
aplica un grupo suave a los botones de ambas capas. Para esto, necesitarás permitir
ambas capas en la GALERÍA DE PÁGINAS Y CAPAS y realizar una selección lazo
alrededor de ambos botones. La barra de estado debe informarte si has seleccionado
todo. Selecciona "ARREGLO" > "APLICAR GRUPO SUAVE" . Ahora, cuando edites el texto
en la capa Off, también cambiará en la otra capa, aun cuando esté oculto. (Ten en
cuenta que este efecto solo funciona si el texto en las capas Off y Over es igual y
cuando los objetos estén agrupados como grupo suave).
380

Una vez que tengas un botón operativo, puedes convertirlo en una barra de
navegación. Selecciona el botón (junto con su estado MouseOver, si lo tiene) y
selecciona entonces "ARREGLO" > "CREAR BARRA DE NAVEGACIÓN" . El diálogo de barra
de navegación aparece para que puedas configurar la barra. Consulta el capítulo Barra
de navegación (en la página 372) para más información, incluyendo cómo tener
diferentes botones iniciales y finales en tu barra.

Agregar menús y submenús

En la primera columna (etiqueta) verás un símbolo más a la izquierda de cada
etiqueta. Este es un control de la estructura de árbol y con un clic en el símbolo más
junto a una etiqueta de botón, la vista se expande y podrás agregar un menú a ese
botón

Haz clic en el texto DOBLE CLIC PARA AGREGAR UN ELEMENTO DEL MENÚ debajo del
botón para comenzar a añadir un menú. O haz clic en el botón AÑADIR en la parte
inferior del diálogo para agregar un elemento de menú detrás del elemento
seleccionado. Para cada elemento de menú que agregues, aparecerá una nueva fila en
la tabla. Configuras la etiqueta, enlace y consejo de herramienta para cada elemento
del menú de la misma forma en que lo haces para los botones. También puedes
agregar submenús a cualquier menú, si primero expandes la estructura de árbol de la
entrada del menú.

Separadores de menú
Puedes agregar un separador a tu menú con un clic en el botón AÑADIR SEPARADOR
en la parte inferior del diálogo. El separador se agrega después del elemento de menú
seleccionado en este momento. Los separadores te permitirán agrupar visualmente
los elementos relacionados de tu menú.

Estilos de menú
Haz clic en el botón ESTILO DE MENÚ… para abrir el DIÁLOGO ESTILO DE MENÚ . Esto te
permite cambiar cómo aparecen los menús y cómo se comportan en tu barra de
navegación.

www.magix.es
 Barras de navegación 381

Fuente
Escoge una fuente para utilizar para el texto de tus menús. Sólo se enumerarán las
fuentes seguras para la web, que son las fuentes que todos los visitantes de tu sitio
deberían tener. También existe la opción de hacer que la fuente sea negrita o para
cambiar su tamaño.

NOTA: Esto no cambia la fuente que se utiliza para las etiquetas de botón de tu
barra, sino la fuente utilizada en los menús. Para cambiar la fuente de las etiquetas
de botones, consulta la sección correspondiente más adelante en este capítulo.

Dirección
Escoge la dirección en la que quieres que tus menús se abran. Para las barras de
navegación horizontales, normalmente querrás que sea hacia abajo y para las barras
de navegación verticales, o bien hacia la izquierda o hacia la derecha dependiendo el
lugar de la página en el que se encuentre tu barra.

Espaciado
Con esta configuración puedes agregar espacio entre las entradas del menú; si las
separas, el menú será más grande.

Borde
Agrega un borde a los paneles de los menús al fijar un ancho de borde en píxeles.
382

Animación
Por defecto, los menús se abrirán de forma instantánea, pero aquí puedes elegir si
quieres que el menú tenga una animación mientras se abre.

Transparencia
Puedes hacer que tus menús sean semitransparentes para poder ver a través de los
paneles de menú. Introduce el nivel de transparencia que te gustaría como porcentaje.

Desplazamiento horizontal/Desplazamiento vertical

Puedes desplazar el panel del menú de forma horizontal o vertical con respecto a los
botones. Introduce la cantidad de píxeles de desplazamiento.

Actualización de la barra de navegación en todas

las páginas
Tal como se ha descrito anteriormente, si la opción BARRA DE NAVEGACIÓN DEL SITIO
está activada para una barra de navegación, entonces todos los cambios realizados a
una barra de navegación se aplicarán automáticamente a todas las otras páginas,
incluyendo la ubicación de la barra en la página.

Sin embargo, si no tienes esta opción activada, debes utilizar la función ARREGLO >
ACTUALIZAR OBJETOS REPETIDOS para copiar los cambios que has realizado a la barra
en la página actual a todas las otras páginas. Ten en cuenta que esto también
actualizará todos los otros objetos repetidos en la página, como los encabezados o
logos, y la página actual se utilizará como referencia. Lee el capítulo Trabajar con
objetos para más información sobre objetos repetidos.

Edición en el lienzo
Puedes editar las etiquetas de botones directamente en el lienzo, con la
HERRAMIENTA DE TEXTO . Simplemente escoge la HERRAMIENTA DE TEXTO y
haz clic en el texto de la etiqueta para comenzar a editarlo.

Si el objeto de texto es un objeto repetido (clic derecho y REPETIR EN TODAS LAS

PÁGINAS ), todos los cambios que realizas a una instancia del objeto se actualizarán
automáticamente.

Cambio de la fuente de los botones de la barra

de navegación
Puedes modificar la fuente utilizada para las etiquetas de botones de una barra de
navegación fácilmente. Selecciona la barra con un clic en ella. Luego ve a la
HERRAMIENTA DE TEXTO y selecciona de la lista de fuentes que se encuentra a la

www.magix.es
 Barras de navegación 383

izquierda la BARRA DE INFORMACIÓN DE LA HERRAMIENTA DE TEXTO. A medida que

desplaces el cursor del ratón sobre las diferentes fuentes de la lista, la barra de
navegación se adaptará de inmediato para que puedas ver el aspecto de tu barra con
esa fuente. Selecciona la fuente que desees. Si tu barra tiene un estado MouseOver,
su fuente también se adaptará.

De la misma forma, puedes cambiar el tamaño de la fuente con el control del tamaño
de fuente que se encuentra junto a la lista de selección de fuente.

Importación e inserción de barras de navegación

Si importas o pegas una barra de navegación en tu documento, la opción de
navegación del sitio de esta barra de navegación se desactiva automáticamente, si
estaba activada. Esto es para evitar conflictos con cualquier barra de navegación del
sitio existente en tu documento.

Sin embargo, si la barra entrante es del mismo tema y tipo que la barra de navegación
del sitio existente (es parte del mismo grupo de repetición), inmediatamente se
actualizará para coincidir con la barra de navegación del sitio existente. De esa forma,
esta barra no aparecerá con su forma original en tu página.

Si la barra es de un tema o tipo diferente (no es parte del mismo grupo de repetición)
aparecerá sin modificación.

Creación de barras de navegación propias

Puedes crear una barra de navegación a partir de cualquier tipo de diseño de botón. La
GALERÍA DE DISEÑOS contiene varios diseños de botones diferentes o puedes dibujar
tus propios diseños. Consulta la sección Creación de los botones MouseOver propios
(en la página 379) del capítulo Primeros pasos para más información sobre este
tema. El botón puede o no incluir un estado MouseOver.

Para crear una barra de navegación, selecciona el botón y luego escoge ARREGLO >
CREAR BARRA DE NAVEGACIÓN . El DIÁLOGO DE BARRA DE NAVEGACIÓN aparecerá y
podrás agregar más botones a tu barra de inmediato, de la misma forma que con las
otras barras de navegación.

También puedes crear barras de navegación con más de un diseño de botón (para
que puedas tener diferentes diseños para tu primer y/o último botón de la barra).
Consulta la sección a continuación para información sobre cómo hacerlo.

Restricciones de diseño de botones

Existen algunas reglas que debes seguir cuando crees tus propios botones para
utilizar en barras de navegación.
384

Limitaciones de botones extensibles

Para obtener resultados óptimos cuando tus botones se extienden de forma
automática, te recomendamos que no haya puntos de control de ruta ni rellenos con
gradación/puntos de control de transparencia en el área horizontal que ocupa el
objeto de texto de la etiqueta de botón.

Texto en un botón
Cada estado del diseño de botón debe diseñarse como objeto de grupo que contenga
el objeto de texto que puede servir como etiqueta de botón. Este objeto de texto
debería ser un objeto de texto simple, no una columna de texto ni un área de texto. Es
decir, que debería crearse en la Herramienta de texto con un clic en la página y
escribiendo, sin arrastrar una línea ni área de texto primero.

Estados de botones en grupos suaves

Si hay varios estados en tu botón, p. ej. MouseOff y MouseOver, necesitan agregarse
a un grupo suave para que permanezcan juntos cuando un estado se mueve o
transforma.

www.magix.es
 Presentaciones como páginas web 385

Presentaciones como páginas web

Sobre las presentaciones

MAGIX Web Designer 10 Premium te permite crear presentaciones web: parecido a
una presentación de Microsoft PowerPoint® pero como una web Supersite (en la
página 300) con efectos tales como transiciones animadas de los pasos dentro de
una página y transiciones animadas de página fluidas.

Las presentaciones son documentos de páginas web HTML normales y son

compatibles con todos los navegadores modernos así como con teléfonos y tabletas.
Se ajustan automáticamente para adaptarse al tamaño de cualquier ventana de
navegador.

Quienes visiten tu presentación web podrán navegarla paso por paso y página por
página con la flecha hacia la derecha o la tecla Av. Pág. para ver el próximo paso o
página y la flecha hacia la izquierda o la tecla Re. Pág. para volver hacia atrás. También
aparecerá una barra de navegación popup en la parte inferior izquierda de la presen-
tación que te permitirá desplazarte fácilmente por las páginas de la presentación.

Además, puedes crear tus "presentaciones por control remoto" en las que puedes
dirigir la presentación a una audiencia invitada viendo tu documento en su navegador
web. Cuando vayas al siguiente paso o diapositiva, ellos verán la misma transición
animada. Esto es perfecto para presentaciones "por conferencia".

Puedes exportar tu presentación, tal como lo haces con un sitio web convencional. Si
alojas tu presentación en MAGIX Online World: el alojamiento es gratuito y también
puedes proteger tu presentación por contraseña, de modo que solo visitantes
invitados autorizados puedan ver tu presentación.

Pasos y capas
Los pasos en una presentación son en realidad capas que están animadas en la página
de una en una. Si abres la galería de páginas y capas (en la página 85) verás todos los
pasos, como capas, además de otras cuantas capas. El fondo de cada diapositiva de la
galería de páginas y capas se llama capa MOUSEOFF. Sobre este hay otra capa
MOUSEOVER que contiene elementos que tienen comportamiento MouseOver, tales
como botones, barras de navegación, flechas de "página siguiente", etc. Además hay
un FONDO DE TABLERO DE DIBUJO y un FONDO DE PÁGINA que son capas especiales y
que generalmente están bloqueadas.

Es importante tener en cuenta que no es necesario usar la galería de páginas y capas

para crear o editar tu presentación. La barra de herramientas de presentación (en la
página 387) principal se puede usar para añadir, borrar y saltar a cualquier paso de tu
presentación.
386

Pasos de presentación en la galería de páginas y capas: la flecha muestra el paso actual.

Puedes reordenar los pasos de tu presentación si ordenas las capas en la galería. Los
números de los pasos se actualizarán automáticamente.

El paso actual está indicado con el símbolo de la flecha (en la captura de pantalla
arriba, el paso de presentación 2 es el actual). Tan solo haz clic sobre un paso para
hacer que sea el actual.

En el espacio de trabajo solo se muestran los objetos sobre la capa actual e inferior.
Así se refleja como se verá tu presentación cuando ese paso se alcanza en la
presentación. En una presentación de 3 pasos, por ejemplo, si el paso 2 es actual, no
verás ningún otro objeto en el paso 3 hasta que no hagas actual este paso u otros
siguientes.

Además puedes hacer clic en el icono "S" (solo) junto al paso que quieres ver, para
visualizar solamente este paso en el lienzo. Haz clic en el icono nuevamente para
volver al modo normal.

Al igual que con las capas, puedes hacer clic y arrastrar un objeto para moverlo de un
paso a otro en la GALERÍA DE PÁGINAS Y CAPAS.

www.magix.es
 Presentaciones como páginas web 387

La barra de herramientas "Presentación"

MAGIX Web Designer 10 Premium te muestra automáticamente la barra de
herramientas "Presentación" en el lado derecho de la barra de herramientas estándar
cuando creas o abres un documento de presentación.

La barra de herramientas te permite:

Crear un nuevo paso de presentación que contenga cualquiera de los objetos

seleccionados en el momento. Crear pasos rápidamente si arrastras o pegas
objetos en la página, los seleccionas y luego haces clic en este botón. Aun si
los objetos seleccionados ya se encuentran en un paso de presentación, un
clic en este botón moverá los elementos marcados a un nuevo paso. Si no has
seleccionado ningún objeto, cuando presionas este botón, un nuevo paso
vacío se crea y se convierte en el actual, por lo que todo lo que dibujes o
añadas a continuación se situará en ese paso.

Mueve los objetos seleccionados a la capa MouseOff, si no son parte de

ningún paso de presentación y deben mostrarse permanentemente como
objetos "de fondo".
Duplicar el paso de presentación actual (tal vez la opción más fácil para crear
un nuevo paso). El paso que contiene el objeto seleccionado se duplicará en su
totalidad (no solo el objeto seleccionado). El nuevo paso se convierte también
en el paso actual.
Eliminar el paso de presentación actual. El paso que contiene los objetos
seleccionados se elimina por completo, incluyendo los objetos de este paso
que no están seleccionados.
Salta a cualquiera de los pasos de la
presentación así como a la capa de
fondo/MouseOff.

Muestra la pestaña "Transición web" del diálogo Propiedades de capa (en la

página 413), lo que te permite escoger un tipo de transición para el paso de
presentación en el que se encuentran los objetos seleccionados.

Creación de una presentación

Existen tres formas de crear una nueva presentación:
• Comienza con una plantilla prediseñada y luego personalízala (en la página
388) con tu propio texto, imágenes y esquema de colores.
388

• Crea una presentación desde cero (en la página 388): agrega todos los
elementos necesarios, texto, gráficos y fotos en tu página y ordena el contenido
en pasos y páginas de tu presentación, tal como lo desees.
• Convierte una página web/documento web existente (en la página 390) en una
presentación.

Creación de una presentación a partir de plantillas

Abre la GALERÍA DE DISEÑOS con un clic en la pestaña GALERÍA DE DISEÑOS o
ARCHIVO > NUEVO DE LA GALERÍA DE DISEÑOS .

Busca la carpeta PRESENTACIONES en la galería y haz doble clic para abrirla.

Las carpetas temáticas contienen colecciones de diseños de presentaciones y

archivos gráficos asociados con cada tema específico. Navega por las carpetas de
temas hasta encontrar un diseño que te guste y haz doble clic sobre la primera
miniatura, denominada "Presentación".

Se abrirá un nuevo documento de presentación que muestra todas las páginas de

plantillas, con varias páginas y, cada una, con pasos de presentación con contenido.
Algunas páginas y pasos tienen aplicadas transiciones.

Haz clic en VISTA PREVIA DE PÁGINA WEB COMPLETA para abrir una ventana de
vista previa: entonces haz clic en uno de los iconos de navegador en el
extremo superior derecho de la ventana para lanzar un navegador externo. Tus
presentaciones puedes verlas en un navegador web separado para ver bien el
resultado de las animaciones de transición. También puedes usar las flechas
del extremo superior izquierdo de la presentación (o en tu teclado) para ver
los pasos y transiciones activos. Trata también de mover el cursor del ratón
hasta la esquina inferior izquierda de las ventanas de vista previa de
presentación para ver los controles de navegación desplegables.

Cierra la vista previa. Personaliza el texto y las fotos con tu propio contenido, tal como
cuando editas un documento de página web.

Creación de una presentación desde cero

Esta sección describe el mejor flujo de trabajo para crear una página de presentación
mediante un ejemplo que te ayudará a dar los primeros pasos rápidamente.

Selecciona "NUEVO" > "PRESENTACIÓN (PANORÁMICA)" o "NUEVO" > "PRESENTACIÓN

(4:3 NORMAL)" del menú ARCHIVO dependiendo de si quieres una presentación en
pantalla panorámica (16:10) o una normal (4:3).

Nota: 16x10 es una solución mejor para algunos monitores de pantalla ancha y
tabletas que no son exactamente 16:9 y no es tan achatada. Pero, por supuesto,
puedes crear cualquier relación de aspecto que necesites.

www.magix.es
 Presentaciones como páginas web 389

Se abrirá una nueva ventana con un documento en blanco, que mostrará el

icono de documento de presentación en su pestaña en la parte superior de la
ventana del documento.
La barra de herramientas "Presentación" aparecerá en el extremo derecho de la barra
superior. Los botones de la barra de herramientas están habilitados únicamente
cuando has seleccionado algún elemento en la página.
1. Utiliza la HERRAMIENTA DE TEXTO para agregar texto a tu presentación en blanco,
tal vez, en el encabezado de la página. Selecciona este objeto de texto con la
HERRAMIENTA DE SELECCIÓN y mira la barra de estado en la parte inferior de la
ventana de Web Designer. Te indicará que has seleccionado un objeto de texto
en la capa MouseOff. Todos los elementos de la capa MouseOff estarán visibles
de forma permanente en tu presentación, puesto que esta capa es parte de tu
fondo. Por lo tanto, haz una vista previa de tu página para ver el texto del
encabezado.
2. Ahora agrega un nuevo objeto de texto con la HERRAMIENTA DE TEXTO.
Nuevamente, este objeto se colocará en la capa MouseOff y la línea de estado te
lo indicará cuando lo selecciones con la HERRAMIENTA DE SELECCIÓN . Ahora,
hagamos que este texto aparezca como el primer paso de esta presentación.
3. Con el texto seleccionado en la HERRAMIENTA DE SELECCIÓN , haz clic en el botón
"pie" que es el primer botón de la barra de herramientas "Presentación", llamado
CREAR COMO PASO NUEVO . Ahora mira la línea de estado: te indicará que el
objeto seleccionado es el "paso 1 de la presentación" en vez de MouseOff.
4. Haz nuevamente una vista previa. Al comienzo verás solamente el encabezado
inicial. Pulsa la flecha derecha de tu teclado para que aparezca el segundo objeto
de texto. Ya has agregado el primer paso de tu presentación.
5. El paso 1 es ahora el paso actual, por lo que si dibujas un nueva forma o añades
algún texto, será situado en el paso 1. Dibuja un rectángulo usando la
HERRAMIENTA DE RECTÁNGULO . Selecciónalo con la HERRAMIENTA DE SELECCIÓN y
nota como la barra de estado muestra el rectángulo situado en Paso de
presentación 1, que es también el paso actual.
6. Haz nuevamente una vista previa de tu página y verás que, al pulsar la flecha
hacia la derecha, aparecen el texto y el rectángulo.
7. Una forma rápida de crear un nuevo paso a partir de un paso existente es utilizar
el botón DUPLICAR PASO. Selecciona el rectángulo y pulsa este botón. Se
duplicará todo el paso, incluyendo el texto que no has seleccionado, pero que se
encontraba en el paso 1 junto con el rectángulo. Selecciona el nuevo texto o
rectángulo y la línea de estado te indicará que se encuentra en un nuevo paso de
la presentación. El nuevo paso se convierte en el paso actual: el paso de
presentación 2 y otros objetos que crees ahora se añadirán a este paso.
8. Si quieres mover un objeto a otro paso, haz clic derecho sobre él y verás el
submenú PRESENTACIÓN en el menú contextual que aparece. El submenú, a su
vez, contiene otro submenú MOVER A PASO , que enumera todos los pasos
existentes en la página. Tan solo selecciona el paso que desees. También existe
la opción NUEVO PASO en el menú, que tiene el mismo resultado que el botón
CREAR COMO PASO NUEVO que utilizamos más arriba.
390

9. Puedes cambiar el efecto utilizado para cada paso de forma muy sencilla.
Selecciona uno de los rectángulos que acabas de añadir y pulsa el último botón
de la barra de herramientas "Presentación", denominado EFECTO DE TRANSICIÓN
DEL PASO . Así se abre un diálogo que te permite seleccionar una transición
diferente en vez de la transición por defecto, "fade". Selecciona APARECER DESDE
LA DERECHA . Haz nuevamente una vista previa de tu página y verás que, al pulsar
la flecha hacia la derecha, el texto y el rectángulo aparecen desde la derecha.
10. Si decides que deseas que un objeto permanezca visible de forma permanente
en vez de formar parte de un paso, selecciónalo y pulsa el botón MOVER AL
FONDO en la barra de herramientas presentación. Así se coloca el objeto
nuevamente en la capa MouseOff. Pruébalo con uno de los objetos que has
colocado en un paso.
11. La GALERÍA DE DISEÑOS contiene algunos componentes muy útiles para las
presentaciones en "PRESENTACIONES " > "COMPONENTES DE PRESENTACIONES ". Tan
solo arrastra y suelta un componente hasta tu página. Cada componente se
añade al paso actual. Si no es esto lo que quieres, utiliza la barra de
herramientas "Presentación" o haz clic derecho en el menú "Presentación" para
moverlo a otro paso o a la capa de fondo (MouseOff). (Ten en cuenta que los
componentes TÍTULOS y CONTROLES DE TRANSICIÓN siempre se añaden a la capa
de MouseOff/Fondo).
12. Recuerda, como está descrito arriba, que la GALERÍA DE PÁGINAS Y CAPAS te
muestra todos los pasos de presentación en tu página en orden, puesto que
cada paso de la presentación es, en realidad, una capa independiente. Tan solo
el paso actual y los pasos anterior y posterior a él se muestran en el espacio de
trabajo.

Conversión de una página web existente en una

presentación
En el documento de página web, haz clic derecho sobre una página y escoge
PROPIEDADES DE PÁGINA WEB para ver el diálogo Propiedades web.

Haz clic en la pestaña Página web y luego en PÁGINA WEB DE PRESENTACIÓN para
seleccionar esa opción.

La pestaña del documento en la parte superior del espacio de trabajo mostrará

el ícono de documento de presentación.

Nota: las capas dentro del documento no se convierten automáticamente en pasos

de la presentación cuando conviertes una página web en una presentación. Debes
convertir de forma manual cada capa en un paso de la presentación, consulta
Conversión de una capa en un paso. Sin embargo, cuando conviertes una
presentación en una página web, los pasos de la presentación se convierten
automáticamente en capas que reciben el nombre "paso 1", etc.

www.magix.es
 Presentaciones como páginas web 391

Manejo de los pasos de presentación

En general, puedes manejar los pasos de una presentación de la siguiente manera:
• Haz clic derecho sobre un objeto de un paso y escoge PRESENTACIÓN y luego
selecciona la opción deseada del submenú.
• Utiliza los botones de la barra de herramientas Presentación (en la página 387).
• Utiliza la GALERÍA DE PÁGINAS Y CAPAS .

Visualización del contenido de los pasos

En ocasiones puede que quieras obtener una vista más clara de los objetos que se
encuentran en un paso. Puedes usar la opción SALTAR A en la barra de herramientas
de presentación para llevarte a un paso o capa particular o incluso utilizar la GALERÍA
DE PÁGINAS Y CAPAS .

Para una fácil navegación, el menú SALTAR A solo visualiza la capa fondo/MouseOff y
los pasos de presentación. Si necesitas seleccionar otra capa (MouseOver, fondo de
página, fondo de tablero de dibujo) tan solo selecciona GALERÍA DE PÁGINAS Y CAPAS y
se desplegará como la página actual en el menú desplegable SALTAR A .

Si haces clic en un paso en la GALERÍA DE PÁGINAS Y CAPAS todos pasos que has
seleccionado previamente se ocultarán y todos los pasos abajo se harán visibles
dándote así una vista precisa de tu posición en la presentación como se muestra en el
espacio de trabajo. Sucede lo mismo si seleccionas un paso usando la opción SALTAR
A . Puedes ocultar o mostrar cualquiera de los pasos en la presentación haciendo clic
en el icono de ojo. Además puedes hacer clic en el icono "S" (solo) junto al paso que
quieres ver, para visualizar solamente este paso en el lienzo. Haz clic en el icono
nuevamente para volver al modo normal.

Ten en cuenta que en la GALERÍA DE PÁGINAS Y CAPAS se hace referencia al fondo del
menú SALTAR A como capa MouseOff.

Mover objetos de un paso a otro

Puedes mover objetos de un paso a otro en tres formas diferentes:
• Haz clic derecho sobre el objeto y selecciona "PRESENTACIÓN" > "MOVER A PASO"
, luego selecciona el número de paso al que quieres mover los objetos, o
selecciona "FONDO" si quieres mover los objetos a la capa MouseOff, o bien
"NUEVO PASO" para mover los objetos a un nuevo paso.
• En la GALERÍA DE PÁGINAS Y CAPAS, haz clic y arrastra los objetos de un paso a
otro o haz clic derecho sobre los objetos y escoge MOVER A LA CAPA ACTUAL .
• Usa cortar y pegar para mover objetos de un paso a otro. Corta el objeto
(Ctrl+X), convierte el paso que quieras mover en el paso actual, luego pega
(Ctrl+V) o pega en el lugar (Ctrl+Shift+V).
392

Cambio del orden de los pasos

El orden en que los pasos se ven es el orden en que los pasos aparecen en la GALERÍA
DE PÁGINAS Y CAPAS , tal como lo indican los números de pasos. También puedes
hacer clic y arrastrar los pasos hacia arriba o hacia abajo en la GALERÍA DE PÁGINAS Y
CAPAS hasta que los pasos se encuentren en el orden que desees.

Eliminar objetos de un paso

Haz clic derecho sobre el objeto y selecciona CORTAR o ELIMINAR o, en la GALERÍA DE
PÁGINAS Y CAPAS haz clic derecho sobre el objeto y selecciona ELIMINAR , o haz clic en
el objeto y luego pulsa el botón ELIMINAR en la barra de herramientas estándar.

Cuando borras un objeto y éste es el único en un paso, Web Designer eliminará el

paso vacío automáticamente solo después de las operaciones "guardar" o "vista
previa" . Así se pueden añadir objetos a un paso sin alterar el orden de pasos
existentes.

Tras las operaciones Guardar o Vista previa, los pasos vacíos se eliminarán y los
pasos restantes se volverán a numerar respectivamente.

Eliminar un paso
Selecciona un objeto del paso y haz clic en el botón ELIMINAR PASO de la
barra de herramientas "Presentación" o haz clic derecho y escoge
PRESENTACIÓN > ELIMINAR PASO .

O bien, haz clic derecho sobre la capa en la GALERÍA DE PÁGINAS Y CAPAS y

seleccionaELIMINAR CAPA .

Agregado de nuevas páginas de presentación

Haz clic derecho en MAGIX Web Designer 10 Premium y escoge NUEVA PÁGINA para
agregar una nueva página en blanco, o DUPLICAR LA PÁGINA ACTUAL para añadir una
copa de la página seleccionada.

Creación de listas con números y viñetas

Al añadir listas con viñetas o números a una presentación, cada elemento de la lista
se convierte automáticamente en un paso de presentación independiente cuando la
exportas. Esto facilita la creación y edición de elementos animados de una lista. Para
agregar nuevos elementos a la lista, haz clic en Intro al final de uno de los elementos
existentes. El efecto de transición que se utiliza para cada elemento de la viñeta
durante la presentación es el establecido para la capa de presentación en la que se
encuentra la lista (no puedes fijar efectos diferentes para los diversos puntos de la
misma lista).

www.magix.es
 Presentaciones como páginas web 393

Para desactivar esta función, haz clic derecho en el área de texto mientras te
encuentras en la HERRAMIENTA DE TEXTO, escoge Presentación > Presentar por
párrafo del menú y quita la selección de la opción. Ahora, al exportar/previsualizar tu
presentación, la lista no se separará en pasos independientes.

Para más información sobre las listas con viñetas y números, consulta Manejo de
texto > Aplicación de apariencias de texto (en la página 190)

Eliminar páginas de presentación

Haz clic derecho sobre la página y selecciona ELIMINAR PÁGINA ACTUAL . O selecciona
las páginas que quieres borrar en la GALERÍA DE PÁGINAS Y CAPAS y pulsa "borrar",
para borrar varias páginas a la vez.

Enlaces al paso siguiente/anterior

Puedes agregar fácilmente botones y objetos a una página de presentación que
muestren el próximo paso en la página. Simplemente agrega o crea tu botón y utiliza
la lista ENLACE A en la pestaña Enlace (en la página 270) del diálogo de Propiedades
web para aplicar un enlace al botón u objeto que mostrará el próximo paso de
presentación.

Cuando el visitante haya visto todos los pasos de la página con el enlace "próximo
paso de presentación" o con la flecha hacia la derecha, al hacer clic en el botón o
pulsar la tecla nuevamente, verá la próxima página.

Nota: si conviertes una presentación en un documento web (opción PÁGINA WEB DE

PRESENTACIÓN en el diálogo Propiedades web en la pestaña Página web), los enlaces
Paso de presentación anterior/siguiente se convierten automáticamente en los
enlaces Página anterior/Próxima página. No puedes aplicar enlaces "Paso de
presentación anterior/siguiente" a un documento web.

Aplicación de transiciones a pasos de

presentaciones
Cuando creas un paso, Web Designer le asigna automáticamente una transición
instantánea. Para cambiar la transición en pasos de presentaciones:

Abre la pestaña "Transiciones" del diálogo de "Propiedades de capa" con un

clic en el botón "Propiedades de transición de capa" en la barra de
herramientas "Presentación" o haz clic derecho en un objeto dentro del paso y
selecciona PRESENTACIÓN > TRANSICIÓN. O bien, en la GALERÍA DE PÁGINAS Y
CAPAS , haz clic derecho en el paso y escoge PROPIEDADES DE CAPA .
394

Escoge una transición de la lista de EFECTO DE TRANSICIÓN , arrastra la barra

VELOCIDAD para fijar la duración de la transición entre 0 y 5 segundos y finalmente
haz clic en APLICAR .

Los nuevos pasos que has creado adquieren un efecto de transición en el último paso
de la presentación por defecto. Esto significa que, si quieres la misma transición en
todos los pasos, solo tienes que configurarlo una vez sobre el primer paso y entonces
todos los pasos añadidos a continuación tendrán la misma transición.

Aplicación de transiciones a páginas de

presentaciones
Cada página de una presentación puede tener su propia transición. Para añadir una
transición a la página actual, haz clic derecho en la página y selecciona la PESTAÑA DE
PÁGINA (EN LA PÁGINA 278) del diálogo PROPIEDADES DE PÁGINA WEB .

Luego selecciona un tipo de transición para la página en la lista desplegable EFECTO DE

TRANSICIÓN y desliza la barra VELOCIDAD para fijar la velocidad de la transición entre
0 y 5 segundos.

Luego, cuando un visitante navegue por a la página con la transición animada, verá
dicha transición.

www.magix.es
 Presentaciones como páginas web 395

También puedes configurar la transición de página para varias páginas de una vez.
Tan solo selecciona las páginas que quieres cambiar en la galería de páginas y capas
(usa Shift+clic y Ctrl+clic para extender la selección) y luego cambia la transición
sobre la pestaña de página como se muestra arriba.

Nota: las transiciones de página solo funcionan para una página web si está
configurada para ser una Supersite. Los documentos de presentación son Supersites
por defecto, por lo que no es necesario visitar esta opción en la PESTAÑA DE PÁGINA
WEB del diálogo.

Información de presentación avanzada

Capas de popup y capas de presentación
Las capas de presentación son capas que tienen la opción de presentación
seleccionada en el diálogo "Propiedades de capa". Una vez que activas esta opción
para una capa, el nombre de la capa se convierte en "Paso de presentación [n°.]" en la
GALERÍA DE PÁGINAS Y CAPAS .

En un documento de presentación puedes mezclar capas popup con capas de

presentación pero, por supuesto, solo las capas de presentación se presentarán
cuando los visitantes naveguen por la presentación con las teclas de flecha del
teclado. El uso de capas y pasos en simultáneo es útil si quieres conservar
características tales como capas popup en tu presentación. Puedes convertir capas en
pasos (y convertir pasos en capas) si activas la opción CAPA DE PRESENTACIÓN en la
pestaña "Transición web" del diálogo Propiedades web (en la página 413).

Cuando creas un nuevo paso, esta casilla se selecciona automáticamente. Si quitas la

selección para convertir un paso en una capa, esto eliminará el paso de tu
presentación, pero su contenido y la transición de la capa se conservarán. Sin
embargo, la capa convertida no se mostrará cuando un visitante navegue por la
presentación con las flechas del teclado o con un enlace de paso de presentación
anterior/siguiente.

Sesiones remotas de presentación

Una vez que hayas publicado tu página web de presentación creada con MAGIX Web
Designer 10 Premium en MAGIX Mundo Online, podrás usar el sistema de
presentación remota de Xara para controlar de forma remota la navegación por tu
presentación con cualquier cantidad de invitados a través de Internet.

Con este sistema, suministras un enlace a cada persona que quieras que vea tu
presentación, a la que podrán acceder mediante su navegador web usual. Verán la
página de apertura de tu presentación, pero no podrán navegar por los pasos ni
interactuar con la presentación directamente. Por el contrario, a medida que tú te
396

muevas por los pasos de la presentación utilizando las flechas, paso por paso y página
por página, los visitantes verán que su navegador web se actualiza automáticamente.
Todos verán la página y los pasos que tú estés viendo en tu navegador web. En
general, esto se utiliza junto con una llamada en conferencia para que todos los
participantes pueden desplazarse juntos por la presentación.

Configuración de una presentación remota

Configurar una presentación remota es sencillo. Simplemente realiza lo siguiente:
1. Publica tu presentación en MAGIX Mundo Online, visualízala mediante la
dirección web publicada y asegúrate de que puedes desplazarte con las flechas
de tu teclado. Cpia la URL de la primera página de tu presentación.
2. Selecciona "AYUDA" > "PRESENTACIONES EXTERNAS ...." del menú de Web Designer
e inicia sesión en MAGIX Mundo Online con tu dirección de e-mail y tu
contraseña registradas. O haz clic en el botón para crear una cuenta de MAGIX
Mundo Online, si todavía no tienes una.
3. Introduce un título para tu presentación y la URL de la primera página.
4. Tienes la opción de introducir un mensaje que se mostrará a tus invitados antes
de comenzar la presentación. Puedes escoger, por ejemplo, mostrar "La
presentación comenzará a las 14:00". Nota: como eres el presentador, no podrás
ver este mensaje.
5. Haz clic en el botón CREAR PRESENTACIÓN . Tu presentación aparecerá en la lista
de la derecha. Se mostrará una sola URL para tu nueva presentación. Copia esa
dirección y suminístrala a todas las personas a las que deseas invitar a tu
presentación, indicándoles cuándo tendrá lugar.
6. Cuando llegue el momento de comenzar con tu presentación, inicia sesión en
http://presenter.xara.com/ http://presenter.xara.com y haz clic en el botón
INICIAR junto a tu presentación a la derecha. Verás la primera página de tu
presentación, al igual que todos tus invitados. Cuando hagas clic en la flecha
hacia la derecha para moverte al próximo paso o página, todos los visitantes
verán lo mismo que tú en sus navegadores web.
7. En la esquina superior derecha de la ventana del navegador, el sistema de
presentación remota te mostrará la cantidad de invitados que están viendo tu
presentación. Si mueves el cursor osbre este text, verás una lista de los nombres
de cada invitado.

Limitaciones
Solamente "próximo paso", "paso siguiente", "Re. Pág.", "Av. Pág." y los enlaces web
comunes se transmiten entre el presentador y los visitantes. Por lo tanto, evita confiar
en otros eventos, como eventos MouseOver, fotos emergentes, capas popup, etc.,
porque los visitantes no podrán verlos.

Hacer una presentación

Si quieres hacer una presentación, lo primero que necesitas es una cuenta en MAGIX
Mundo Online. Si todavía no tienes una, dirígete a la página de inicio del gestor
remoto de presentaciones en http://presenter.xara.com/ http://presenter.xara.com,
www.magix.es
 Presentaciones como páginas web 397

haz clic en el botón CREAR UNA CUENTA DE MAGIX MUNDO ONLINE y sigue las
instrucciones que aparecerán. Si ya dispones de una cuenta, inicia sesión como se
indica más abajo.

Dirígete a la página de inicio del gestor remoto de presentaciones e introduce tu

dirección de correo electrónico y contraseña y haz clic en INICIAR SESIÓN . En CREAR
UNA PRESENTACIÓN , tendrás que elegir el título para la presentación y la URL a la
página web en la que se encuentra la presentación.

Nota: La URL que elijas tiene que ser una presentación y no una página web
estándar. Si no, el gestor remoto de presentaciones no funcionará.

Escribe un mensaje de bienvenida en el campo MENSAJE PARA LOS VISITANTES . Este

mensaje se mostrará al inicio de la sesión, por lo que estaría bien que incluyeras la
hora y la fecha de la sesión junto con una pequeña descripción sobre el tema que la
presentación trata.

Haz clic en el botón CREAR PRESENTACIÓN .

La presentación se mostrará en la lista de la derecha. La contraseña que los

participantes en la presentación tienen que introducir para acceder a la sesión se
mostrará en el apartado CÓDIGO. Cópialo y pégalo para enviárselo a los participantes
junto con la URL (que se generará al pulsar el botón COPIAR URL ). También podrás ver
la URL haciendo clic en INICIO ; botón que inicia la presentación. La URL se muestra en
la parte superior izquierda de la ventana del gestor remoto de presentaciones.

Cuando llegue la hora de empezar la presentación, pulsa el botón INICIO situado junto
a tu presentación. Cuando los participantes se unan (haciendo clic en la URL e
introduciendo la contraseña que enviaste), su nombre aparecerá en una lista ubicada
en la parte superior izquierda de la ventana.

Puedes moverte por la presentación utilizando las flechas del teclado o haciendo clic
en los botones "anterior" y "siguiente" situados en la propia presentación. Los
participantes no podrán ver ni pulsar dichos botones, por lo que tú serás el único que
podrá mover la presentación. La presentación se sincroniza de modo que todos los
participantes verán siempre la parte sobre la que estés "presentando" en tiempo real
sin importar el momento en el que se unan a la presentación.

Visualización de una presentación

Cuando los visitantes, hagan clic en el enlace que les has dado, primero se les
preguntará su nombre. El nombre se utiliza solamente para que el presentador sepa
quien está viendo su presentación. Los visitantes luego verán la primera página de tu
sitio de presentación, con el mensaje de bienvenida en la parte superior. O, si tu
presentación ya ha comenzado, verán la misma página que tú.
398

Widgets de sitios web

Este capítulo describe cómo agregar contenido dinámico a tu sitio web, como
películas, animaciones, formas y miles de gadgets disponibles como contadores de
página y conversores de divisas. Nos referimos a estos con el término general
"widgets de sitios web" o simplemente "widgets".

Widgets y marcadores de posición - todo

automático
En MAGIX Web Designer 10 Premium, un widget es un objeto que puedes colocar en
tu página web y que muestra algún tipo de contenido dinámico que también puede
ser interactivo. Este contenido puede proceder de un sitio web externo (p. ej. un
widget de noticias) o estar publicado con el sitio web (p. ej. un pase de fotos). En el
lienzo de Web Designer, un widget está representado por una imagen estática de
marcador de posición, que define la posición y el tamaño del widget en la página. El
marcador de posición está vinculado con el código HTML y los archivos (Flash,
Javascript, fotos, etc.) que hacen que el widget funcione en la página exportada.

En general, un marcador de posición es una imagen que parece una instantánea

estática del widget mismo, pero también puede ser simplemente un rectángulo o
cualquier otro objeto. El marcador de posición generalmente tiene las mismas
dimensiones que el widget, de forma que puedas posicionarlo con respecto al otro
contenido de tu página.
www.magix.es
 Widgets de sitios web 399

La buena noticia es que Web Designer generalmente renderiza las imágenes de

posición de marcador por ti.

Tipos de widgets
Básicamente, existen tres tipos de widgets, que se diferencian en la forma en que los
personalizas y configuras en MAGIX Web Designer 10 Premium. A continuación
encontrarás una breve descripción de cada tipo, pero más adelante en este capítulo
cada uno se explica en más detalle. Para los tres tipos de widget puedes hacer doble
clic en la imagen de marcador de posición para editarlos.

Widgets que se editan en la Web

Cuando personalizas estos widgets, se abre una ventana con el navegador web y te
muestra el sitio web que te pone a disposición el widget para que lo configures y
personalices mediante esa interfaz web. Por ejemplo, si utilizas un widget que es un
mapa provisto por un sitio web de mapas, generalmente debes escoger la ubicación
geográfica y el tamaño del mapa. Una vez que hayas finalizado, haz clic en el botón
INSERTAR en la parte inferior de la ventana del explorador. En general, insertarás estos
widgets desde la GALERÍA DE DISEÑOS .

Widgets que se editan en el programa

Estos widgets se editan en Web Designer, pero generalmente en un documento
multipágina independiente, que facilita la edición del contenido del widget. Por
ejemplo, para un widget de un pase de fotos que muestra diez fotos, estas imágenes
se verán y editarán fácilmente dentro del documento multipágina del widget que se
utiliza para modificarlo. En general, también insertarás estos widgets desde la
GALERÍA DE DISEÑOS .

Widgets que se editan manualmente

Estos son widgets que agregas manualmente al insertar el código HTML del widget
directamente en Web Designer o al utilizar la pestaña "HERRAMIENTAS " >
"PROPIEDADES WEB " > "MARCADOR DE POSICIÓN " para insertar el código. También
puedes crearlos al importar un archivo, como una animación o película, en tu página.

Web Designer no te ofrece ninguna otra interfaz para editar tu widget, sino la pestaña
MARCADOR DE LUGAR , que te permite cambiar el archivo o código que lo define.

Widgets de la galería de diseños

Muchos elementos de la carpeta "Elementos de página y widgets" en la galería de
diseños son "widgets", tal como lo indican sus nombres.

Para agregar un widget, simplemente arrástralo y suéltalo desde la galería hasta tu

página. Lo que ocurre después depende del tipo del widget. Si es un widget que se
400

edita en la web, una ventana del navegador se abrirá para permitirte configurar el
widget en la página web del proveedor. Si es un widget que se edita en el programa,
aparecerá un marcador de posición en la página. Haz doble clic en el marcador de
posición para abrir un nuevo documento en Web Designer, que te permitirá
personalizar el widget.

Inserción
Pulsa el botón AYUDA al final de la ventana para ver información que te guíe durante
el proceso de configuración e inserción del widget. Para la mayoría de los widgets,
deberás llegar al punto en que la página web del widget te muestre el código HTML
que necesita insertarse en tu página web. Cuando sea visible, generalmente puedes
hacer clic en el botón Insertar en la parte inferior de la ventana. Entonces, MAGIX
Web Designer 10 Premium encontrará el código HTML y lo insertará en tu página por
ti.

Para algunos widgets, MAGIX Web Designer 10 Premium no puede tomar el código
HTML directamente desde la página y deberás copiar el código al portapapeles.
Selecciona el código en la ventana del navegador y pulsa Ctrl+C. Muchos widgets te
facilian esto porque te suministran un botón de copia junto al código. Una vez que has
copiado el código, haz clic en el botón INSERTAR .

Generación automática del marcador de posición

Al pulsar el botón Insertar, si MAGIX Web Designer 10 Premium encontró el código
del widget, la ventana de la página web del widget se cerrará y verás un aviso
indicando que MAGIX Web Designer 10 Premium está ocupado renderizando la
imagen del marcador de posición. Tras algunos segundos, aparecerá una imagen de
tu widget en tu página. Para la mayoría de los widgets, esta imagen tiene el mismo
tamaño que el widget en sí mismo, por lo que puedes posicionarla con la
HERRAMIENTA DE SELECCIÓN .

Ahora, todo lo que debes hacer es realizar una vista previa de tu página web y verás el
nuevo widget en funcionamiento.

Membresía del sitio del widget

Es posible que algunos widgets requieran que abras un cuenta con el proveedor del
widget antes de poder usarlo. La mayoría son gratis, pero algunas ofrecen servicios
premium además de la oferta gratis. Mira cada widget individual y la información
sobre el sitio del proveedor del widget para más detalles.

Edición de widgets existentes

En cualquier momento, puedes hacer doble clic en el marcador de lugar (o doble clic y
escoger EDITAR WIDGET ) en la página de Web Designer para ir al sitio web del
proveedor y modificar o reemplazar el widget.

www.magix.es
 Widgets de sitios web 401

Los proveedores de widgets que te ofrecen una cuenta generalmente conservarán una
copia de un widget que has creado. Esto significa que puedes iniciar sesión en tu
cuenta y encontrar, modificar e insertar un widget que has creado previamente.
Insertar widgets existentes es como insertar widgets nuevos, simplemente haz clic en
INSERTAR cuando veas el código HTML o copia el código HTML para el widget en el
portapapeles y luego haz clic en INSERTAR .

Widgets que se editan en el programa

Algunos widgets que arrastras hasta tu página desde la GALERÍA DE DISEÑOS no
abrirán una ventana de navegador, tal como se ha descrito más arriba para los
widgets que se editan en la Web. Estos son widgets que se editan en el programa y
que puedes modificar directamente dentro de Web Designer en una ventana de
documento independiente.

Edición

Después de soltar este tipo de widget en tu página, haz doble clic sobre él para
editarlo. Se abrirá una nueva ventana de documento en Web Designer (el
"documento de edición" del widget). Lo que muestre ese documento dependerá del
widget en sí, pero en general verás un documento multipágina que te permite editar y
personalizar de forma práctica todo el contenido.

En general, se mostrarán instrucciones específicas a un costado o en la parte superior

de la primera página, que te describirá los aspectos del widget que puedes editar en el
documento y los que no puedes. En la mayoría de los casos, puedes editar el texto
que utilizas con la HERRAMIENTA DE TEXTO , pero en general no puedes cambiar ni la
fuente ni el estilo del texto. Puedes sustituir las fotos si arrastras un nuevo archivo de
foto hasta las imágenes desde el explorador de Windows, tal como lo haces para
reemplazar fotos en documentos normales. Y puedes editar las fotos con la
HERRAMIENTA DE FOTOS , ajustarlas con la HERRAMIENTA DE RELLENO , etc.

Mira una página por vez y personaliza los textos y las fotos. Es posible que algunos
objetos estén bloqueados (un clic sobre ellos no tiene efecto), lo que te indicará los
aspectos del widget que no puedes editar, o tal vez debas modificarlo al cambiar los
objetos bloqueados en algunas de las otras páginas. Los objetos bloqueados están
presentes como ayuda visual para ayudar al contexto de las partes editables sin
bloqueo del diseño.

Agregado de más contenido

Algunos widgets te permitirán agregar más contenido al widget, si duplicas las

páginas que se muestran (clic derecho sobre la página y escoge DUPLICAR PÁGINA
ACTUAL ). Un widget de pase de fotos te permitirá agregar más fotos de esta forma.
Después de duplicar una página, cambia las fotos o el texto, como lo desees. Las
instrucciones en el widget te indicarán si puedes o no duplicar páginas de esta forma
para agregar contenido.
402

Si realizas cambios que las instrucciones te indican que no debes hacer, en general, se
ignorarán. Sin embargo, es posible que el widget deje de funcionar, así que cambia
solamente los aspectos del diseño que las instrucciones te indican que puedes
modificar.

Cambio de tamaño

Los widgets que se editan en el programa en general no pueden redimensionarse, por

lo tanto, no cambies el tamaño del marcador de posición en tu página ni las
dimensiones de página en el documento de edición del widget.

Guardado de cambios

Una vez que finalices tu personalización, cierra el documento y se te preguntará si

deseas guardar los cambios que has hecho al documento de página web. Como
alternativa, solo pulsa "Ctrl + S" y los cambios que realices se guardarán y el
documento de edición se cerrará para que vuelvas al documento de tu página web. El
marcador de posición que representa tu widget debería actualizarse para reflejar la
primera página del documento de edición. Haz una vista previa de tu página para ver
el resultado de tus cambios en el widget.

Agregado de archivos de películas y

animaciones
MAGIX Web Designer 10 Premium incluye compatibilidad directa con algunos tipos
de archivos que es posible que quieras añadir a tu página. Para estos archivos, puedes
simplemente arrastrarlos y soltarlos desde el Explorador de Windows hasta tu página
o utilizar la opción ARCHIVO > Importar.

Durante la importación, se identifica el tipo de archivo y se coloca un marcador de

posición o un enlace apropiado en tu página, mientras que el archivo se copia en la
carpeta de soporte de tu diseño. La carpeta de soporte es una carpeta que está
vinculada a tu archivo de diseño y se crea automáticamente. Si tu archivo de diseño
se llama "Misitio.web", la carpeta de soporte se llamará "Misitio_web_files". El
contenido de esta carpeta se incluye junto con todos los archivos de imagen de tu
sitio, toda vez que exportes y publiques tu sitio.

Archivos de película MP4 y FLV

Al importar un archivo MP4 o FLV, MAGIX Web Designer 10 Premium inspecciona el
archivo para determinar la relación de aspecto y otra información acerca de la
película. Se te preguntará si deseas que se inicie la reproducción de la película
automáticamente tan pronto como se cargue la página en que aparece (autoinicio).
Luego inserta el archivo de película y otros archivos en un reproductor de películas
Flash en la carpeta de soporte de tu sitio web. En tu página aparecerá una imagen
similar al reproductor de la película.

www.magix.es
 Widgets de sitios web 403

Posiciona y cambia el tamaño de tu marcador de posición con la HERRAMIENTA DE

SELECCIÓN y luego haz una vista previa de tu página. Haz clic en el botón para iniciar
la reproducción de la película (deberás tener Flash instalado). Esto es todo. El
reproductor de la película contiene controles básicos para ajustar el volumen, iniciar y
detener la reproducción y para desplazarte hasta cualquier lugar de la película. Como
alternativa puedes usar algún widget de la GALERÍA DE DISEÑOS para presentar tus
vídeos. De este modo tendrás más control sobre la presentación. Consulta
ELEMENTOS DE PÁGINA Y WIDGETS > AUDIO / VÍDEO .

Otros formatos de película

MAGIX Web Designer 10 Premium no es directamente compatible con otros
formatos de película, pero visita el sitio web de MAGIX para más información sobre
cómo convertir películas a un formato que pueda agregarse a tu página web.

Archivos Flash
Para incluir una animación Flash en tu sitio web, importa el archivo Flash (.swf). El
archivo Flash se copia en la carpeta de soporte de tu diseño, de forma que se
exportará y publicará con tu sitio web. Una imagen de marcador de posición se
renderiza y se coloca en tu página web.

Puedes cambiar el tamaño de tus animaciones Flash, si utilizas la HERRAMIENTA DE

SELECCIÓN para cambiar el tamaño de la imagen de marcador de posición al tamaño
deseado y la posicionas en el lugar que desees. Haz una vista previa de tu página para
ver la animación Flash en funcionamiento en tu página web. Por supuesto, debes
tener Flash instalado para poder reproducirla con éxito.

Archivos MP3
Importa un archivo MP3 para añadirle audio a tu página web. Una ventana te permite
elegir si el audio comenzará automáticamente una vez se cargue tu página o si
debería empezar cuando se pulse el botón en el reproductor.

Como en los otros tipos de archivos de arriba, se creará una imagen de marcador de
posición y se ubicará en tu página. El archivo MP3, junto con todos los demás
archivos necesarios para hacer que el reproductor funcione, se copiarán en la carpeta
de soporte de tu documento y se incluirán en la página web exportada. Previsualiza la
página para ver el reproductor en acción.

El reproductor es simple y discreto. Puedes iniciar y parar el audio, saltar a distintos

puntos de la pista haciendo clic en la línea temporal, ajustar el volumen (haciendo clic
en la línea indicadora de volumen) y silenciarlo (clic en el icono con un altavoz).

Nota técnica: el reproductor utiliza las opciones de HTML 5 nativo del navegador
web para reproducir el audio, solamente si el navegador es compatible con ello y si
404
también es compatible con el formato MP3. En caso contrario se utilizará Flash. Esto
significa que el reproductor funciona con todas las versiones modernas de
navegadores (los antiguos no son compatibles con HTML 5 y algunos modernos no
son compatibles, directamente, con archivos MP3).

GIF animados
Agrega un GIF animado a tu página de la misma forma en que agregas archivos Flash.
Importa o arrastra y suelta el archivo GIF hasta la página. Se copiará a la carpeta de
soporte del diseño y se generará una imagen de marcador de posición estática.
Cambia el tamaño y reposiciona el marcador de posición, luego haz una vista previa
de tu página y listo.

Archivos PDF
Puedes importar archivos PDF a un documento web en dos formas diferentes. O bien
lo importas para que el contenido del archivo se copie en tu página (al igual que
cuando importas una foto). O bien puedes agregar un enlace a una copia del archivo
en tu sitio web y dejas que el archivo se publique en tu sitio. Al importar un archivo
PDF se te dará a escoger entre estas dos opciones. Al añadir un enlace, el archivo PDF
se copia en la carpeta de soporte de tu diseño de forma que se exporta y publica con
el resto de tu sitio. Además, se agrega un enlace en tu página que se verá así:

Un clic sobre el enlace de tu página exportada generalmente abre el archivo PDF, pero
el comportamiento exacto varía según la configuración del navegador del usuario.

Widgets de otros sitios de widgets

Existen cientos o miles de sitios que ofrecen widgets de alguno tipo y la Galería de
diseños brinda acceso a un pequeño subgrupo de ellos. Casi todos los widgets se
ofrecen mediante un breve código HTML. El proveedor del widget generalmente te
suministra instrucciones simples para insertar el código en tu página web, pero con
MAGIX Web Designer 10 Premium, esto es todavía más fácil.

Copia el código del proveedor del widget en el portapapeles de tu sistema,

simplemente cópialo tal como lo harías en un procesador de texto. Muchas veces, el
proveedor del widget te suministra un botón "copia" que lo hace por ti.

Luego, en MAGIX Web Designer 10 Premium ve a la herramienta de selección y haz

una operación de pegado habitual (Ctrl+V). Verás que MAGIX Web Designer 10
Premium reconoce el código HTML e comienza de inmediato a renderizar la imagen
de marcador de posición, tal como lo hace como cuando se inserta un widget de la
Galería de diseños. El marcador de posición aparecerá en tu página y, generalmente,

www.magix.es
 Widgets de sitios web 405

tendrá el tamaño del widget. Luego podrás hacer una vista previa de tu página para
ver al widget en funcionamiento.

NOTA: si no te encuentras en la herramienta de texto cuando pegas el código, se

pegará como texto en vez de introducir un marcador de posición. Una vez que hayas
pegado el contenido del portapapeles como texto, continuará pegando como texto
aún cuando cambies a la herramienta de selección y vuelvas a pegar. Si llegas a este
punto, vuelve a la página web del widget y copia el código de nuevo. Luego, pégalo
mientras te encuentras en la herramienta de selección.

Cambio de tamaño de widgets

Puedes cambiar el tamaño de las imágenes de marcadores de posición para archivos
Flash, MP4 y GIF animados de la misma forma que cambias el tamaño del contenido
de tu página, porque este tipo de contenido es modificable. Sin embargo, la mayoría
de los otros widgets no son compatibles con esto y siempre renderizarán el mismo
tamaño.

Para estos widgets, el objeto de marcador de posición determina simplemente los

límites del área en que el widget puede renderizar, de forma que reducir el tamaño del
marcador de posición significará que el widget se verá recortado en tu página. La
imagen del marcador de posición se regenera cada vez que cambias su tamaño por lo
que reflejará un recorte del widget también, tal como se ilustra en el ejemplo.

Marcador de posición con el tamaño por Marcador de posición con tamaño reducido
defecto

Este es un ejemplo del botón "Comprar ahora" de PayPal que permite vender bienes y
servicios desde tu página web. Este widget está disponible en la Galería de diseños.
De la misma forma, hacer que el marcador de posición de estos widgets sea más
grande resultará en un espacio vacío alrededor del widget en la página y en la imagen
del marcador de posición. Para widgets como este, que no cambian de tamaño
correctamente cuando se modifica el tamaño del marcador de posición, lo mejor es
conservar el tamaño original por defecto.

Hay algunos widgets que pueden mejorarse si se cambia el tamaño del marcador de
posición, aun cuando el widget en sí mismo no cambie su tamaño. Algunos widgets
llenarán el contenedor en el que están insertos, lo que significa que parecerán más
grandes y habrá espacios en blanco que ocupan el espacio. Puedes experimentar
cambiando el tamaño del widget en cada dirección y reduciendo el widget sin perder
partes de él. Por ejemplo, este widget se ha renderizado demasiado ancho y alto de
forma que se desperdicia espacio abajo y a la derecha de los controles. Si reduces el
406

tamaño, el tamaño de los controles no cambiará, sino que la forma se recortará. El

resultado es un marcador de posición más claro que ocupa menos espacio en la
página.

Marcador de posición con el tamaño por defecto Marcador de posición más angosto y corto

Desactivación de la regeneración del marcador de

posición
La imagen de marcador de posición se regenerará cada vez que cambies su tamaño,
el código o el archivo relacionado. Es posible que algunas veces quieras desactivar la
regeneración de forma que la imagen del marcador de posición no cambie. Puedes
hacerlo si quitas la tilde de la casilla que se encuentra en la parte inferior de la
PESTAÑA MARCADOR DE POSICIÓN del DIÁLOGO HERRAMIENTAS > PROPIEDADES WEB .

Inserción manual de marcadores de posición

para widgets
Si no quieres que MAGIX Web Designer 10 Premium cree una imagen de marcador
de posición, puedes fijar una personalmente. Primero crea un objeto de marcador de
posición (tal vez un rectángulo del tamaño adecuado o una imagen importada que
quieras utilizar para representar el widget en tu página). Selecciona el objeto y luego
abre la pestaña Marcador de posición en HERRAMIENTAS > PROPIEDADES WEB .

O pulsa el botón de marcador de posición en la barra desplegable de

Propiedades web en la barra superior.

En este diálogo, puedes escoger si deseas asociar el objeto seleccionado con un

archivo Flash u otro archivo o con un código HTML que el diálogo te permite pegar en
el cuerpo o encabezado de tu página web. Lee la sección PESTAÑA MARCADOR DE
POSICIÓN del capítulo diálogo de Propiedades web (en la página 287) para más
detalles en este diálogo. En general, no quieres que la opción "Regenerar marcador de
posición" esté activada si quieres conservar el objeto de marcador de posición que
has creado. Si seleccionas esta opción, tu marcador de posición se reemplazará por la
imagen generada del código o archivo especificado en este diálogo.

www.magix.es
 Galería de páginas y capas 407

Galería de páginas y capas

La galería de páginas y capas

Por defecto, la GALERÍA DE PÁGINAS Y CAPAS se muestra abierta en la parte derecha de
la ventana de Web Designer cuando abres el programa. Si lo prefieres puedes liberar,
mover, fijar o cerrar la galería. Consulta Galerías para más información.

Si has cerrado previamente la GALERÍA DE PÁGINAS Y CAPAS , que está abierta

por defecto, puedes volver a abrirla con un clic en la pestaña GALERÍA DE
PÁGINAS Y CAPAS en la pestaña de galería o si presionas F10.

La GALERÍA DE PÁGINAS Y CAPAS enumera todo lo que tienes en tus documentos,

desde las páginas y las capas hasta cada elemento individual de la página.
Proporciona el modo de seleccionar, ocultar bloquear y reorganizar estos elementos.

Funciona en diferentes niveles: PÁGINAS , CAPAS, PASOS DE PRESENTACIONES y

OBJETOS. La orden de estos elementos es como sigue:

Páginas
Capas/pasos
Elementos de página, donde se
incluyen los grupos
Contenidos de grupo

Algunas de las características clave de la GALERÍA DE PÁGINAS Y CAPAS son:

Control de página
• Presentación de una lista de las páginas
• El modo de páginas muestra una lista más acotada de vistas en miniatura de las
páginas para una navegación más sencilla.
• Agregar una nueva página, duplicar, cortar, copiar, pegar o borrar páginas.
• Cambiar el orden de las páginas arrastrándolas
• Renombrar páginas

Control de capas
• Muestra una lista de todas las capas en cada página, desde el fondo (en general
la capa de fondo) hasta la capa superior
• En un documento de presentación, muestra una lista de todos los pasos y capas
de cada página de la presentación, desde la primera hasta la última
• Crear nuevas capas, borrar, reorganizar y renombrar capas
• Ocultar o mostrar capas
• Bloquear capas (lo que convierte la capa en no editable)
• Solo para una capa: desactiva todas las otras
408

Control de objetos
Muestra una lista de todos los elementos (objetos) en la página de acuerdo con el
orden en el que aparecen en la misma, desde la parte inferior hasta la parte superior.
• Ocultar o mostrar cualquier elemento
• Mover hacia arriba o hacia abajo en el orden
• Bloquear algún objeto para que sea no editable
• Ubicar y destacar cualquier objeto en la galería con un clic en la página cuando
te encuentras en el modo "Localizar": activa o desactiva el botón LOCALIZAR
• Solo para un objeto: desactiva todos los otros
• Mover objetos dentro o fuera de un grupo usando arrastrar y soltar, o mover un
objeto de un grupo a otro. (Ten en cuenta que esto solo es posible para grupos
normales, no para grupos anclados o repetidos).

Además, la GALERÍA DE PÁGINAS Y CAPAS muestra una pequeña vista en miniatura de

las páginas y una miniatura de cada elemento de la página. Pasa el cursor sobre un
elemento para ver una vista miniatura más grande.

www.magix.es
 Galería de páginas y capas 409

Así se muestra que la capa MouseOff se ha expandido para mostrar el contenido de esta capa.
Aquí se muestra un grupo de barra de navegación y otros grupos diversos, la línea de texto y los
elementos de la columna de texto y algunos elementos del grupo de sombras.

Si pasas el cursor sobre las pequeñas vistas en miniatura, verás una miniatura más grande que te
permitirá identificar cada objeto de la página.

Ten en cuenta que las dos columnas de la derecha indican (y controlan) si los elementos son
editables (una flecha pálida) o bloqueados (icono del candado) y si son visibles en la página
(icono de ojo abierto más claro) u ocultos (icono cerrado más oscuro).

Un clic sobre estos símbolos cambiará la visibilidad o el estado bloqueado o de edición de cada
objeto.
410

Páginas
Con un clic en el botón PÁGINAS en la parte superior de la GALERÍA DE PÁGINAS Y
CAPAS (o con un clic derecho en la galería y la opción VER NIVEL DE PÁGINA) se abrirá
el modo Páginas, verás solamente las páginas del documento y cerrarás todos los
otros niveles abiertos. Si te encuentras en el modo Páginas y la galería está fijada, el
ancho de la galería se reducirá al mínimo para ocupar el menor espacio posible. La
cantidad de botones en la parte superior de la galería también se reducirá a aquellos
que pueden utilizarse para las páginas. Para salir del modo páginas, simplemente
expande una de las páginas para ver sus capas. La galería regresará a su ancho
completo y se restaurarán todos los botones.

Puedes reordenar las páginas si arrastras las páginas seleccionadas en la GALERÍA DE

PÁGINAS Y CAPAS o si haces clic derecho sobre una página y escoges MOVER LA
PÁGINA HACIA ARRIBA/ABAJO . Para cambiar el nombre a la página, haz clic derecho y
escoge RENOMBRAR PÁGINA. Además de ofrecer una forma útil de identificar páginas
en documentos largos, el nombre de página se usa cuando el documento se exporta
como página web.

Capas
¿Qué son capas? Todo en tu documento tiene un orden de apilamiento · esto significa
que nuevos elementos son posicionados encima de elementos más antiguos de la
página, como si estuvieras añadiendo trozos de papel en tu escritorio. Puedes hacer
clic para mover cualquier objeto, pero si tu documento tiene docenas o incluso
cientos o miles de elementos, tu tarea puede volverse desordenada y difícil. Quizás
quieras trabajar en elementos que están tapados por elementos que se encuentran
encima.

Las capas son útiles para organizar páginas o dibujos más complejos que contienen
numerosas partes separadas. Utilizando capas puedes agrupar una colección de
elementos y luego activar o desactivar la colección entera (hacerla visible u ocultarla)
a través de una operación fácil. Imagínate que una capa es un sobre transparente de
plástico que contiene una pila de papeles separados. Abriendo el sobre puedes
acceder a su contenido y re·arreglarlo. Pero tu escritorio puede que contenga una pila
de dichos sobres y, tal y como puedes volver a arreglar los sobres, también puedes
volver a ordenar, de forma similar, las capas.

Por lo tanto, las capas son grupos de elementos. Las capas pueden hacerse invisible
para ocultar partes de tu documento, lo que hace que tus áreas de trabajo sean
menos desordenadas y más fáciles de manejar. Puedes asignar nombres a las capas o
puedes crearlas o borrarlas fácilmente. Y de igual modo que puedes hacer clic en el
icono de la pequeña flecha para abrir una página y ver su contenido (las capas en la
página), puedes hacer lo mismo con cada capa para ver los contenidos de esa capa.
Cuando selecciones cualquier objeto, la capa se mostrará en la línea de estado en la
parte inferior de la ventana.

www.magix.es
 Galería de páginas y capas 411

La capa actual
Cuando creas un objeto nuevo en la página, se coloca en una de las capas, la llamada
capa activa o simplemente capa actual. En un documento en blanco esto se llama
Capa 1 o, en el caso de documentos web, se lo denomina MouseOff. La capa actual se
señala con una flecha de selección .

Importante: todos los elementos, fotos o texto nuevo que se dibuje y todos los
elementos pegados se colocan en la capa actual marcada con el símbolo .

Puedes cambiar la capa actual, simplemente con un clic sobre su hilera en la GALERÍA
DE PÁGINAS Y CAPAS . Es importante comprender que puedes seleccionar un objeto en
cualquier capa o incluso en múltiples capas, sin que se encuentren en la capa actual.
Esta capa actual, con la flecha, simplemente indica el lugar en donde se colocarán los
nuevos elementos.
412

Este ejemplo de la GALERÍA DE PÁGINAS Y CAPAS muestra la capa actual, llamada MouseOff (la
página actual se llama Novedades). Entonces, si dibujas algo nuevo se colocará en la capa
MouseOff.

También muestra un elemento de grupo de sombras seleccionado en el documento (señalado en

color azul) dentro de otro grupo que se encuentra en otra capa diferente, denominado Foto de
vacaciones 2.

Hay cuatro capas ocultas (llamadas foto de vacaciones 4, foto de vacaciones 3, foto de
vacaciones 1 y MouseOver). La página "fondo" está bloqueada.

Capa actual siempre visible

Es posible que la página actual pueda estar oculta o hasta bloqueada. Al hacer clic en
una capa para seleccionarla y convertirla en la capa actual no cambia su estado
bloqueado o visible. Sin embargo, existe una preferencia en la pestaña General (en la
página 470) del diálogo Opciones (haz clic derecho sobre una página y escoge
OPCIONES DE PÁGINA o selecciona OPCIONES del menú HERRAMIENTAS ) para hacer que
las capas actuales siempre sean visibles y puedan editarse (no estén bloqueadas). Si
seleccionas esta opción, cada vez que selecciones una capa en la GALERÍA DE PÁGINAS
Y CAPAS se hará visible y no estará bloqueada. Al moverte a otra capa, la capa anterior
regresará a su estado de visibilidad y bloqueo anterior.

Capas en páginas web

En páginas web guardadas de <Programmnam_short>, las capas se usan para efectos
de MouseOver o de pop·up (en el navegador web, los contenidos de estas capas se
visualizan cuando mueves el cursor sobre elementos en la página).

Puedes encontrar más detalles sobre esto en el capítulo de Gráficos web y Páginas
web en el apartado de Capas, MouseOver (rollover) y pop·ups (en la página 65).

Grupos y capas suaves

Los Grupos suaves (en la página 130) son poco usuales porque son grupos de objetos
que pueden encontrarse en diferentes capas. (Los elementos de los grupos normales
deben estar en una sola capa). Cuando seleccionas una parte de un grupo suave, las
otras partes también se seleccionan, incluso si están ocultas o bloqueadas. La
GALERÍA DE PÁGINAS Y CAPAS mostrará todos los elementos seleccionados de color
azul, pero en el caso de los grupos suaves, estos elementos pueden encontrarse en
otras capas que no has expandido y, por lo tanto, no son visibles de inmediato.

Lee el apartado sobre Grupos suaves (en la página 130) en el capítulo de Manejo de
objetos para más información.

www.magix.es
 Galería de páginas y capas 413

Operaciones de capa
Con un clic en el botón CAPAS en la parte superior de la galería de páginas y capas
aparecerán sólo las capas de la página actual. Este es un modo en que el botón de
capas permanece pulsado. Mientras te encuentras en el modo de capas, si pasas a
otra página, se verán las capas de la página del momento y todos los otros nodos se
cerrarán. Para desactivar el modo, haz clic nuevamente en el botón CAPAS . Puedes
reordenar las capas, esto es el orden de superposición en la página, arrastrando y
soltando en las capas en la galería de páginas y capas.

Puedes renombrar una capa haciendo haciendo dos veces clic (despacio) en el
nombre de la capa. (El primer clic seleccionaría la capa.) Esto se parece mucho a
renombrar archivos en Windows Explorer. Si mueves el cursor del ratón sobre los
pequeños iconos, se mostrará una miniatura del contenido de la capa.

Cuando selecciones una capa (hacer clic para resaltar la capa), los botones NUEVO,
DUPLICAR y BORRAR en la parte superior de la galería de páginas y capas harán lo que
sus nombres sugieren. El botón NUEVO creará una capa nueva vacía y la posicionará
en la parte superior de la pila. Puedes cambiar el orden arrastrándolo a la posición
requerida.

El botón DUPLICAR copiará la capa y su contenido y lo posicionará arriba en la pila, es

decir, arriba de todos los demás objetos de la página.

Propiedades de capa
Esta opción abre el diálogo de Propiedades de capa
414

Creación de capas y edición de las propiedades de capas

Con la pestaña de capas, puedes:
• Crear una nueva capa o editar una existente.
• Hacer que la capa actual sea editable y visible por defecto.
• Definir la capa como el fondo de página web que no aparecerá al imprimir.
• Especificar que todos los objetos de la capa solamente tendrán contorno de
texto (en la página 212) dentro de la misma capa. Esto evita que el texto de la
capa fluya respecto a objetos en otras capas, lo que es útil para capas de popup
en páginas web.

Uso de líneas guía

La pestaña Guías te permite crear guías para la capa en valores numéricos precisos y
escoger un color para los objetos de la capa de guías.

Lee la sección OBJETOS GUÍA Y LÍNEAS GUÍA en el capítulo Manejo de objetos (en la
página 126) para más información sobre el uso de líneas guía.

Configuración de popup

Nota: La opción CAPA DE PRESENTACIÓN solo estará activa si te encuentras en un

documento de presentación. Para convertir un documento web en una presentación,
consulta Presentaciones web (en la página 276).

Con esta pestaña podrás aplicar efectos de transición animados a una capa, si la
utilizas como capa popup en una página web o si se trata de una capa de
presentación. La capa luego aparecerá con el efecto de transición cuando se revele en
la página web exportada. Utiliza la barra para fijar el tiempo de transición entre 0 y 5
segundos.
www.magix.es
 Galería de páginas y capas 415

En una presentación, una capa puede fijarse como una presentación, si colocas la tilde
en la opción CAPA DE PRESENTACIÓN . Consulta Presentaciones como páginas web (en
la página 385).

Nota: Si desactivas la opción CAPA DE PRESENTACIÓN , el paso se quitará de la

presentación.

Por defecto, cuando aplicas una transición, los objetos solamente aparecerán o
desaparecerán desde la esquina de la página web. Si quieres que los objetos
aparezcan desde las esquinas de la ventana del navegador, en vez de desde las
esquinas de la página, quita la selección de la opción de los bordes CLIP A LA
PÁGINA en la pestaña Página web (en la página 275) del diálogo de propiedades
web.

Capas especiales
Existen diversos tipos de capas especiales. Estos aparecen en la GALERÍA DE PÁGINAS
Y CAPAS , y pueden activarse o desactivarse de forma usual, aunque se comportan de
forma levemente diferente.

CAPAS DE FONDO son capas que no se imprimen, que aparecen en el fondo del
documento, debajo de todos los otros elementos. Al aplicar un color al fondo de la
página (arrastrar y soltar desde la línea de colores) esto creará automáticamente una
capa de FONDO DE PÁGINA. En general, está bloqueada.

También puedes configurar el color del tablero de dibujo (el área alrededor de la
página) si arrastras un color desde la línea de colores y lo sueltas en el tablero de
dibujo. Esto crea una capa de FONDO DE TABLERO DE DIBUJO automáticamente.
Nuevamente, esta capa está bloqueada.

Al guardar un documento como un sitio web, las capas de fondo se convierten en

fondos de página web. Consulta el capítulo Primeros pasos (en la página 23) para
más información acerca de la configuración de los fondos de página web y la
utilización de las capas de fondo.

La CAPA DE GUÍAS es el lugar en donde se colocan las líneas guía o los objetos guía.
Cuando creas una línea guía, se creará automáticamente una capa de guías. Podrás
seleccionar la capa de guías y colocar todo lo que desees en esta capa, lo que
funcionará como una guía de ajuste, si has activado la opción "Ajustar a guía".

Lee la sección Objetos guía y líneas guía en el capítulo Manejo de objetos para más
información.
416

Ocultar capas
Las dos columnas de íconos de la derecha de la galería de Páginas y capas controlan
la visibilidad y el estado bloqueado de las capas.

Un clic en el ojo abierto ocultará la capa de la página y el ícono cambiara a un ojo

cerrado . Otro clic hará que la capa sea visible nuevamente.

Cuando se oculta cualquier elemento, se vuelve invisible en la página y no puede

verse ni seleccionarse más. La forma de volver a ver los elementos ocultos es hacer
clic en su ícono de ojo cerrado . Como alternativa puedes hacer clic sobre el botón
MÁS... y seleccionar la opción VER TODOS , lo que hace visible todos los elementos de
la página actual.

Modo Solo
Si haces clic en cualquiera de los iconos en la columna junto a cada capa, activará
el modo "solo" de esta página, lo que significa que se ocultará todo lo demás, salvo
esta capa. Ahora puedes trabajar sobre esta capa aislada. Un clic en el icono
restaurará el estado anterior.

También puedes hacer clic y arrastrar hacia abajo la columna de iconos para
navegar rápidamente por las capas independientemente de todo lo demás.

Para salir del modo Solo, haz clic en el botón nuevamente.

Bloquear capas
Un clic en el ícono de candado en el final derecho de la fila de capa bloquea la capa
(el icono adopta la forma de un candado cerrado ). Ahora no podrás seleccionar
ningún otro objeto en esa capa. Al hacer clic en los elementos cerrados, los
atravesarás como si no estuvieran allí y se seleccionarán los elementos que se
encuentran abajo. Con otro clic en el icono del candado, se vuelven a desbloquear. De
forma alternativa puedes hacer clic en el botón MÁS.. y seleccionar la opción
DESBLOQUEAR TODO .

Grupos suaves
Hay una excepción en las reglas de bloqueo. Si un elemento en una capa bloqueada
forma parte de un Grupo suave (en la página 130), al seleccionar u operar ese grupo
suave, se selecciona y opera asimismo cualquier elemento bloqueado de ese grupo
suave (para esto están pensados los grupos suaves).

www.magix.es
 Galería de páginas y capas 417

Mostrar todo y desbloquear todo

Estos dos controles en la parte superior de la GALERÍA DE PÁGINAS Y CAPAS son un

atajo de teclado para ver todos los elementos de la página actual o desbloquearlos.
Invalidan temporalmente todos los objetos individuales y configuración de capas. Un
segundo clic sobre los controles restaurará el estado anterior. Es decir, que esta es
una forma rápida de ver o desbloquear todo, en todas las capas, realizar alguna
operación y después regresar al estado anterior.

El botón "Desbloquear todo" es útil si has bloqueado un objeto en el lienzo y quieres

desbloquearlo sin tener que buscarlo primero en la galería de páginas y capas. Activa
"Desbloquear todo", haz clic derecho en el objeto en el lienzo y selecciona la opción
de desbloqueo del menú contextual. Luego puedes desactivar la opción "Desbloquear
todo". Cuando uno de los botones se ha seleccionado (están pulsados), entonces no
es posible cambiar el estado de los elementos individuales. Quita la selección de los
botones para permitir la operación normal de la visibilidad de la capa y el estado
bloqueado. Un clic sobre el botón MÁS mostrará opciones de menú para MOSTRAR
TODO EN LA PÁGINA y DESBLOQUEAR TODO EN LA PÁGINA .

Mover objetos entre capas

Hay varias formas de mover objetos entre capas. Primero, selecciona el objeto o los
objetos que quieras mover, y luego
• Arrastra y suelta el objeto en la capa deseada de la GALERÍA DE PÁGINAS Y CAPAS
• CORTA el objeto (Ctrl+X o haz clic derecho y selecciona CORTAR ). Asegúrate de
que la capa de destino es la capa actual (mostrada con , haz clic en la capa si
no es así) y luego haz clic derecho en PEGAR o PEGAR EN LUGAR. Ten en cuenta
que si cortas o copias múltiples elementos que se encuentran en diferentes
capas, la estructura de capas se conservará cuando pegues. Los elementos se
pegarán en la misma capa de la que se cortaron/copiaron, en vez de en la capa
actual. Si quieres pegar todos los elementos en la capa actual e ignorar la
estructura de capas, usa la opción PEGAR EN LA CAPA ACTUAL . Si quieres
mantener la estructura de las capas, escoge PEGAR EN EL LUGAR DE LA CAPA
ACTUAL . Estas opciones de pegado también se encuentran en la barra
desplegable del portapapeles en la barra sueperior, así como también en el
menú EDITAR .
• Haz clic derecho y escoge ARREGLO y luego MOVER A LA CAPA DE
ADELANTE /MOVER A LA CAPA DE ATRÁS para mover los objetos seleccionados a
una capa más arriba o abajo.
• Asegúrate de que la capa de destino esté seleccionada como la capa actual y
luego encuentra el elemento seleccionado en la GALERÍA DE PÁGINAS Y CAPAS
(haz clic en el botón LOCALIZAR ), haz clic derecho sobre el elemento y
selecciona MOVER A LA CAPA ACTUAL .
418

Animaciones en Flash

Introducción
MAGIX Web Designer 10 Premium tiene un enfoque tradicional con respecto a las
animaciones en Flash. Puedes crear frames claves (o snap shots) de tu animación a
través del tiempo, y MAGIX Web Designer 10 Premium producirá automáticamente
todos los frames que sean necesarios entre un frame y otro (pasos intermedios), es un
proceso llamado "tweening" (generación de transiciones).

Un ejemplo de frame de inicio

El próximo frame clave tiene la estrella en otra posición, la forma se ha rotado un poco, se ha
reducido su tamaño y se ha cambiado su color.

MAGIX Web Designer 10 Premium creará un archivo en Flash animado con movimientos suaves y
fluidos porque los frames intermedios se generan de forma automática. Este proceso se llama
"tweening".

Lo que Flash puede hacer y lo que no puede hacer

El formato Flash no es compatible con algunos efectos avanzados que ofrece MAGIX
Web Designer 10 Premium, como por ejemplo, una graduación de transparencia
compleja, difuminación (feathering), y la mayoría de los tipos de relleno de color
avanzados.

Aunque, sí es compatible con una gama de efectos que incluye la transparencia simple.
Por lo tanto, si por ejemplo le aplicas una transición a la estrella en el segundo frame
clave superior para que sea 100% transparente, obtendrás una animación en la cual la
estrella se mueve, reduce su tamaño y luego desaparece.

www.magix.es
 Animaciones en Flash 419

El mismo ejemplo mostrando los frames intermedios (in-between frames) pero con un cambio de
transparencia.

Como MAGIX Web Designer 10 Premium, Flash es un programa basado en gráficos

vectoriales, lo que te posibilita agrandar los objetos sin perder calidad en los detalles.
Esta cualidad del programa hace que los archivos en Flash sean muy compactos, que
es ideal para la web.

Para ilustrar lo pequeñas y compactas que pueden llegar a ser las animaciones flash de
MAGIX Web Designer 10 Premium, el anterior ejemplo animado que dura un segundo
y contiene 24 frames (de modo que el vídeo se reproduce suavemente a 24 frames por
segundo) crea un archivo flash de tan sólo 700 bytes.

Los 6 tipos centrales de animación

Para que los archivos en Flash se mantengan muy compactos, los tipos de formas
utilizadas en tweening compatibles con flash se limitan a seis tipos básicos de
animación. Estos tipos se denominan a veces las 6 transformaciones centrales porque
son las únicas que pueden transformar un objeto de un frame clave al siguiente.
1. Mover: desplazar los objetos de una posición a otra.
2. Modificar tamaño (scale): aumentar o reducir el tamaño de los objetos.
3. Aplastar o torcer (squash or skew): aplastar o torcer objetos.
4. Girar: rotar objetos
5. Transparencia: ajustar la transparencia general (plana) de los objetos.
6. Cambios de color: cambiar el color de relleno (plano) de los objetos.

El último ítem, los cambios de color, pueden aplicarse a las fotos a las que se ha
aplicado un tono continuo. No puedes transformar una foto de colores completos en
una foto de tono continuo, pero puedes cambiar una foto con un color de tono continuo
en otro color de tono continuo.

Nota: los seis tipos de transformación mencionados anteriormente son

absolutamente claves para todas las animaciones flash. Ningún otro tipo de
transformación es posible para frames de transición (tweened frames).

Si te fijas en algunos ejemplos de animación en Flash en la web, te darás cuenta de que

casi todas las animaciones utilizan éstos efectos. Los objetos aparecen y desaparecen
(fade in, fade out), se mueven de una posición a otra. A veces los elementos giran,
crecen o se achican. Esta es la base para casi todas las animaciones en Flash, y es muy
fácil producir este tipo de animaciones con MAGIX Web Designer 10 Premium.
420

Es imposible cambiar la forma de un objeto entre frames claves.

Es imposible cambiar la forma de un objeto entre frames claves.

Porque la forma de un objeto cambia, no se puede realizar esta acción en las

animaciones en Flash de MAGIX Web Designer 10 Premium.

Lo que no puedes hacer con Flash en MAGIX Web Designer

10 Premium
MAGIX Web Designer 10 Premium es principalmente un programa de ilustración
vectorial y no está diseñado para ser una herramienta de Flash integral. En vez, este
programa ofrece un enfoque nuevo e innovador, y de fácil comprensión de las
animaciones en Flash. El MAGIX Web Designer 10 Premium y sus herramientas de
dibujo vectoriales, te permiten crear animaciones en Flash realmente compactas de
forma mucho más sencilla y fácil que con otras aplicaciones.

Debido a su enfoque simplificado, MAGIX Web Designer 10 Premium no es

compatible con las funciones más complejas de Flash como scripting (programación),
audio o películas integradas (embedded movies). Adicionalmente, como la
renderización de vectores en Flash es relativamente primitiva, comparado con Xara
Xtreme, hay algunos efectos avanzados de Xtreme que no pueden ser utilizados con
Flash. Éstos están detallados al final de este capítulo en "¿Qué funciones de MAGIX
Web Designer 10 Premium son compatibles con Flash?".

www.magix.es
 Animaciones en Flash 421

Principios básicos
En tu animación es probable que tengas algunos objetos que se mantengan estáticos
entre un frame clave y otro, y otros que se muevan.

Para indicarle a MAGIX Web Designer 10 Premium qué objetos quieres

animar, debes colocarle un nombre a cada objeto (con el botón CREAR
NUEVOS NOMBRES que se encuentra en la barra de información de la
HERRAMIENTA DE SELECCIÓN ).

Para más información sobre cómo colocarle nombres a los objetos. ver la sección
"Nombrar objetos" en el capítulo "Trabajar con documentos".

Aquí tienes un resumen de los pasos a seguir cuando quieres crear una animación
nueva:
1. Primero decide el tamaño de la animación y luego configura el tamaño de página
(ver "Archivo > Opciones de página (en la página 477)").
2. Dibuja tu primer frame. Pónle un nombre a los objetos que desees animar.
3. Crea un frame clave nuevo (para ello copia el frame anterior).
4. Mueve y transforma los objetos según lo desees.
5. Comprueba los resultados en la vista previa.
6. Repite los pasos de 3 a 5.

Y así podrás seguir componiendo tu animación.

El botón Copiar frame de la barra de botones para animaciones.

MAGIX Web Designer 10 Premium crea un frame clave nuevo con sólo pulsar un
botón (básicamente lo que hace es copiar el frame anterior). La GALERÍA DE FRAMES te
permite ver cualquier frame clave y puedes ajustar el orden y el tiempo de duración de
los frames. La GALERÍA DE FRAMES se explica en detalle más adelante en este capítulo.

Para aquellos que estén familiarizados con las funciones animadas de GIF en el MAGIX
Web Designer 10 Premium (o sus predecesores) todo este proceso les va a ser
familiar. La diferencia es que con los archivos en Flash el MAGIX Web Designer 10
Premium puede crear automáticamente todos los pasos intermedios (tween steps)
para producir animaciones más fluidas y compactas que las animaciones GIF.

Nota: debes introducirle un nombre a los objetos que quieras animar entre un frame
clave y otro. Todos los otros objetos se mantendrán visibles pero estáticos por el
tiempo de duración del frame hasta que aparezca el próximo frame. Para borrar un
objeto de una animación, bórralo sólo en el primer frame clave en el que no quieres
que aparezca.
422

Tu primera animación
Para crear una nueva animación, crea un nuevo documento de animación. Para esto:

Selecciona ARCHIVO > NUEVA > ANIMACIÓN ("Ctrl +  + N").

Se abrirá un nuevo documento y verás la barra de botones para animaciones que

incluye algunos botones relevantes para la animación.
1. Dibuja una forma simple, por ejemplo un rectángulo redondeado, con la
herramienta de rectángulo (pero puede tener cualquier forma).
2. Haz clic sobre el icono APLICAR NOMBRE en la barra de información de la
HERRAMIENTA DE SELECCIÓN y ponle el nombre "forma".
3. Haz clic sobre el botón COPIAR FRAME para crear un segundo frame clave.
Modifica la forma según lo desees. Puedes ajustarla utilizando cualquiera
de las seis formas de animación descritas anteriormente en este capítulo.
4. Pulsa el botón de VISTA PREVIA DE ANIMACIÓN FLASH para visualizar la
animación.

Por defecto, el tiempo de duración de cada frame clave dura medio segundo. Para
producir una animación más larga, ve a la sección "Duración de frames para película
Flash y pasos intermedios", que se encuentra más adelante en este capítulo.

No estás limitado a incluir un solo objeto en movimiento por frame clave, puedes
tener todos los objetos que quieras en cada frame clave. Sólo tienen que pasar por
algún tipo de transformación en el siguiente frame clave (y todos tienen que tener un
nombre) para que sean animados.

Aquí te mostramos otro ejemplo.

El primer frame clave tiene algo de texto simple y una forma simple dentro de un rectángulo
estático.

En el siguiente frame clave, el texto se ha ampliado y oscurecido, el rectángulo azul se ha girado

90 grados y la transparencia se ha alternado para ser en la mayor parte transparente.

Así es como se construye una animación.

www.magix.es
 Animaciones en Flash 423

Frame clave 1

Pasos intermedios producidos

por MAGIX Web Designer 10
Premium

Frame clave 2

En esta animación, el objeto de texto crece y simultáneamente el rectángulo redondeado gira y

desaparece.

Exportación de un archivo Flash

Para exportar una animación como archivo Flash:

Selecciona ARCHIVO > EXPORTAR ANIMACIÓN y luego escoge Flash en GUARDAR COMO
TIPO .

O pulsa el botón EXPORTAR FLASH ANIMADO.

Con esto el archivo SWF acabado se guardará en la ubicación indicada.

Vista previa de un objeto flash en MAGIX Web Designer 10

Premium.
Para visualizar la animación tal como se verá en la página web, haz clic en el
botón de VISTA PREVIA DE ANIMACIÓN FLASH y se abrirá un navegador con la
vista previa de la animación.

La página de vista previa te mostrará la animación final e información útil como las
dimensiones de la animación, tamaño del documento, etc. También incluye
instrucciones simples sobre cómo insertar la animación en una página web.
424

Inserción de un objeto flash en MAGIX Web Designer 10

Premium.
Para aquellos que utilicen MAGIX Web Designer 10 Premium puedes arrastrar el
archivo Flash hasta la página web para insertarlo en el sitio web. Se creará
automáticamente una imagen estática de marcador de posición y se colocará en tu
página. Haz una vista previa de tu página web y verás la animación Flash en
funcionamiento.

Como alternativa, puedes crear un objeto de marcador de posición de forma manual.

En tu página web, crea un objeto marcador del lugar, puede ser algo como un simple
rectángulo o una imagen. Posiciona y ajusta el tamaño de tu marcador de lugar

A continuación, en el diálogo de PROPIEDADES WEB (Ctrl+Shift+W), selecciona la

pestaña MARCADOR DE LUGAR y las opciones de navegación REEMPLAZAR CON FLASH
para localizar el archivo .SWF requerido. Haz clic en APLICAR .

Ahora, cuando realices la vista previa de tu página web, el marcador de lugar es

reemplazado por la animación flash.

Con cualquiera de las opciones mencionadas anteriormente, el archivo .swf se copia en

la carpeta de soporte junto con tu archivo .xar, de forma que haya una copia del archivo
con el archivo .xar. Por lo tanto, si luego cambias la animación y exportas un archivo
.swf actualizado que quieras utilizar en su lugar, o bien busca el nuevo archivo .swf con
Herramientas > Propiedades web > Pestaña Marcador de posición o reemplaza
manualmente el archivo en la carpeta de soporte con el archivo actualizado.

Consulta la sección Carpetas de soporte (en la página 86) del capítulo Trabajar con
documentos para más información.

Inserción con otra herramienta de autoría web

Para posicionar tu animación SWF en tu HTML, haz clic en el enlace VER HTML en la
pantalla de vista previa de flash para obtener el código que luego puedes pegar en tu
página web con ayuda de tu editor HTML preferido.

Nota: Debes cambiarle el nombre al archivo SWF en el código para que coincida con
el nombre actual de tu archivo exportado SWF. También debes colocar tu archivo
SWF en el mismo directorio de tu página web para que funcione tu código. Si deseas
colocar el archivo SWF en otro directorio, deberás cambiar el código HTML.

www.magix.es
 Animaciones en Flash 425

Exportación de animaciones como AVI

Además de exportar tus animaciones como GIF y Flash, también podrás exportarlas
como formato .AVI.

En el documento de animación, escoge EXPORTAR ANIMACIÓN del menú ARCHIVO, y

escoge ANIMACIÓN AVI ANIMATION (*.AVI) de la lista desplegable Guardar como tipo
en el diálogo Exportar archivo. Haz clic en el botón OPCIONES para escoger la
configuración de exportación o simplemente pulsa el botón EXPORTAR para usar la
configuración actual o por defecto.

Opciones AVI
Selección del códec
Utiliza la lista desplegable para seleccionar entre los códecs que tienes instalados. Esto
determina la forma en que se codificará y comprimirá su AVI. O escoge la opción "sin
compresión" si quieres exportar un AVI sin compresión. Ten cuenta que esto tendrá
como resultado un archivo de gran tamaño.

Keyframe cada N frames

El valor por defecto lo provee el códec seleccionado y, generalmente, lo mejor es
mantener este valor. Reducir el número resultará en archivos de mayor calidad pero
también de mayor tamaño.

Configurar
Si pulsas el botón CONFIGURAR , se abrirá un diálogo de configuración específico para el
códec seleccionado (si está disponible), que te ofrecerá opciones de configuración. El
botón ACERCA te dará más información sobre el códec seleccionado.

Fondo transparente
Si seleccionas esta opción, tu AVI tendrá un fondo transparente, lo que es útil si
quieres que tu animación aparezca sobre una película (por ejemplo, para los títulos).

Cuando esta opción está activada, la lista de códecs se reduce a la opción "sin
compresión", porque ninguno de los códecs es compatible en la actualidad con la
transparencia. Si exportas un AVI sin compresión con transparencia, se importará al
software de edición de vídeos de MAGIX y en algunas otras aplicaciones de edición de
películas con transparencias.

Área a guardar
Escoge si quieres guardar una película que tenga el tamaño de tu página de animación
o del dibujo animado.

Haz clic en Aceptar para exportar la animación AVI.

426

La galería de frames de animación

Por defecto, la GALERÍA DE FRAMES DE ANIMACIÓN se muestra abierta en la parte
derecha de la ventana de Web Designer, (junto a la GALERÍA DE PÁGINAS Y CAPAS )
cuando abres o creas un nuevo documento de animación.

Para abrir la GALERÍA DE FRAMES, selecciona "HERRAMIENTAS > GALERÍAS >

GALERÍA DE FRAMES ", o haz clic en el ícono de la GALERÍA DE FRAMES en la
barra de herramientas de las GALERÍAS.

Una GALERÍA DE FRAMES típica. El frame 3 está seleccionado y por eso está visible.

Este muestra una lista de los keyframes en tu documento. Para visualizar cualquier
keyframe, haz clic sobre su nombre en la galería.

La GALERÍA DE FRAMES DE ANIMACIÓN muestra los frames de arriba hacia abajo: el

primer frame está primero en la lista y cada frame que añadas aparecerá al final de la
lista. Puedes reordenar los frames con solo arrastrarlos. La galería cuenta con varios
botones para realizar las operaciones más importantes, como crear un frame nuevo,
borrar o copiar un frame seleccionado (siempre se agregará al final) y crear nuevos
frames en blanco.

El botón PROPIEDADES es muy importante ya que muestra el diálogo de las

PROPIEDADES DE ANIMACIÓN , que controla muchos aspectos, no solo de la animación
seleccionada, sino también de la animación completa.

www.magix.es
 Animaciones en Flash 427

Diálogo de las propiedades de animación

Otra forma de visualizar el diálogo de las propiedades de la animación es hacer doble

clic sobre el nombre de un frame en la GALERÍA DE FRAMES .

Los botones TODOS LOS FRAMES VISIBLES (ícono de un ojo) y EDITAR

TODOS LOS FRAMES (candados), que se encuentran en la GALERÍA DE
FRAMES son muy útiles porque te permiten visualizar o editar todos los
frames al mismo tiempo.
Esto es particularmente práctico para cuando quieras seleccionar objetos que se
encuentran en varios frames.

Nota: cuando copies un frame, siempre se copiará el frame seleccionado y se lo

colocará como último frame. Para insertar un frame nuevo entre, por ejemplo, el
frame 4 y el 5, selecciona el frame 4, haz clic en el botón COPIAR , y luego arrastra la
nueva copia desde el final a la posición deseada entre los frames 4 y 5.

Nota: puedes elegir el nombre que quieras para los frames. No tienen que llamarse
Frame 1, Frame 2, etc.. Las animaciones siempre se reproducirán siguiendo el orden
de los frames de arriba hacia abajo, no importa cuál nombre tengan.

Copiar objetos
Puedes copiar objetos de un frame a otro de la forma usual (copia el contenido,
selecciona el nuevo frame y luego pégalo al nuevo frame). La opción "Editar > Pegar en
lugar" ("Ctrl +  + V") es muy práctica para cuando quieras ejecutar esta acción, ya
que siempre se pegarán los objetos en la misma posición que el lugar de donde los
copiaste pero en el nuevo frame.

Cuando copias un objeto, el nombre se copia junto a él, pero asegúrate de que no haya
otro objeto con el mismo nombre porque sino surgirán errores.
428

Fotos
Como los documentos en Flash están compuestos por formas vectoriales, y éstos se
transforman fácilmente, los documentos pueden ser muy pequeños. Se pueden
integrar fotos y mapas de bits a las animaciones en Flash, pero al menos que seas
especialmente cuidadoso se convertirán en documentos de animación muy grandes.
Puedes realizar 5 de las 6 transformaciones centrales sobre mapas de bits y fotos
(puedes mover los objetos, cambiarles el tamaño, aplastarlos, rotarlos y hacerlos
desaparecer).

Los documentos en Flash pueden incluir imágenes en PNG y JPEG, tal como los
documentos .xar. Si mantienes el tamaño y la resolución bajas podrás crear
animaciones pequeñas en Flash con fotos. La mejor forma de incorporar fotos en JPEG
con el tamaño más pequeño posible y con la compresión más alta que puedas aceptar.

Afortunadamente es fácil guardar imágenes en JPEG desde el MAGIX Web Designer

10 Premium en el tamaño, resolución y con la compresión que desees, y hasta tienes
una vista previa interactiva en la que podrás ajustar la compresión y ver el resultado de
forma inmediata.

Si sueltas un documento JPEG sobre la animación y le cambias el tamaño, esto no

reducirá el tamaño del documento en JPEG, sino que se reducirán sus dimensiones (y
por ende se incrementará la resolución). En este respecto el programa Flash se
comporta tal como el MAGIX Web Designer 10 Premium ya que integra (embed) la
resolución total de la imagen JPEG original a la animación para que puedas acercarte a
ella con el zoom. Por esta razón es muy fácil calcular el tamaño estimado de cualquier
animación que contenga fotos en JPEG; es aproximadamente la suma de los tamaños
de todas las imágenes JPEG integradas a la animación (la GALERÍA DE MAPA DE BITS te
mostrará el tamaño de todas las fotos y mapas de bits integrados a la animación).

Cuando realices una transición (tweening) para los mapas de bits o para una foto, sólo
se guarda una copia del mapa de bits en el documento en Flash, por lo que puedes
hacer transformaciones en un mapa de bits que no requieran mucha memoria. En otras
palabras, sólo porque aparezcan el mapa de bits en los frames 1, 2 y 3 de tu animación,
esto no quiere decir que existan tres copias del mapa de bits integrados al documento
en Flash.

Mapas de bits en otros formatos que el JPEG

Hay otros tipos de formatos de mapas de bits como, por ejemplo, los formatos BMP,
TIFF o PNG que en general generan documentos más grandes y por ende menos
adecuados para usarlos en las animaciones en Flash (la compresión JPEG es mucho
mejor que la PNG). Sin embargo, si incluyes una imagen PNG de baja resolución (una
imagen de 96 dpi o menos - la línea de estado te muestra la resolución de cualquier
imagen seleccionada), permanecerá como imagen PNG en el archivo flash. Las
imágenes con una resolución más alta (>96 dpi) serán convertidas a JPEG (JPEG
transparente, si fuera necesario).
www.magix.es
 Animaciones en Flash 429

Puedes controlar la compresión utilizada para la conversión automática a JPEG si

utilizas la barra deslizante de la pestaña OPCIONES FLASH en el diálogo de PROPIEDADES
DE ANIMACIÓN . El valor de compresión más común es de un 75% pero puedes
modificar la calidad, luego visualizar la animación en una vista previa y rápidamente ver
el tamaño y la calidad que hayas guardado.

Los mapas de bits con 256 colores o menos (como los GIF) no se codifican como JPEG
y se integran a la animación utilizando una compresión PNG, que usualmente es la
mejor tipo de compresión para este tipo de imágenes.

Calidad de mapas de bits

El programa Flash Player versión 8 y las versiones siguientes tienen una calidad más
alta de visualización de los mapas de bits. Es particularmente evidente cuando rotas y
cambias el tamaño de los mapas de bits y las fotos, mientras que en las versiones más
viejas se reproducen las imágenes de forma pixelada y con movimientos menos fluidos.

Puedes ver qué versión tienes del Flash Player si haces un clic derecho sobre
cualquier animación en tu navegador web y mira el menú "Acerca de" (About).

Te recomendamos que exportes tu animación en Flash como versión 8 si estás

utilizando fotos o mapas de bits. Puedes controlar esto en la pestaña OPCIONES FLASH
del diálogo de PROPIEDADES DE LA ANIMACIÓN .
430

Duración de frames para películas Flash y pasos

intermedios
Las animaciones Flash se reproducen a un ritmo prefijado. Cuánto más rápido sea el
ritmo (frame rate o duración de cada frame) de los frames, mejor fluirá la animación
aunque el archivo en Flash será más grande. Por defecto, las animaciones de MAGIX
Web Designer 10 Premium tienen 24 frames por segundo, pero puedes cambiarlo si lo
deseas.

Cuando creas cada keyframe, determinas la duración del período hasta el próximo
keyframe. Por ejemplo, si has definido como tiempo de duración de un frame a medio
segundo, esto significa que la animación tardará medio segundo en pasar de un
keyframe a otro. Si tienes el ritmo de la animación prefijado a 24 frames por segundo,
esto quiere decir que el MAGIX Web Designer 10 Premium generará 11 pasos
intermedios en la animación en Flash; que son 12 frames en total. (Estos frames
intermedios nunca se verán en MAGIX Web Designer 10 Premium ya que solo se
generan cuando creas un archivo Flash).

La GALERÍA DE FRAMES siempre te mostrará el tiempo de duración de cada keyframe. En

este ejemplo se muestran tres frames, cada uno durante un segundo, por lo que la
animación dura 3 segundos antes de repetirse. Para crear un efecto de intermedio más
largo (en otras palabras, hacer la animación más lenta) tienes que incrementar el
tiempo de duración en el diálogo PROPIEDADES DE LA ANIMACIÓN .

La forma más fácil de modificar el tiempo de duración de cualquier frame es hacer

doble clic sobre el nombre del frame que quieres cambiar para abrir el diálogo; luego
introduce el tiempo de duración que tú quieras en segundos y pulsa ACEPTAR o
APLICAR .

Mover frame hacia adelante/atrás

Estos botones te permiten mover un keyframe hacia adelante o hacia atrás en la

animación sin modificar la duración. Esto es útil cuando trabajas con animaciones que
se exportan como AVI y se incluyen en películas, especialmente si estás intentando
rastrear un objeto en el vídeo con tu animación. Por defecto, cada clic mueve el frame
www.magix.es
 Animaciones en Flash 431

en 1/25 de un segundo, lo que corresponde a un frame en una película de 25 fps.

Puedes cambiar este valor en la pestaña FRAME del diálogo de PROPIEDADES DE LA
ANIMACIÓN .

Mover frame 1/25 seg. hacia adelante

Mover frame 1/25 seg. hacia atrás

La duración del frame anterior se ajusta para mantener la duración general de la anima-
ción, de forma que solo estás desplazando el keyframe hacia adelante o hacia atrás.

Recortar y cortar
Quizás más adelante quieres crear animaciones en Flash como las que se pueden ver
en la web, con frases o fotos que se muevan de un lado a otro.

Para crear un animación como esta, tienes que cambiar el tamaño de la página en
MAGIX Web Designer 10 Premium al tamaño que deseas tener para la animación en
Flash. Por ejemplo, si quieres un banner en Flash que tenga 468 píxeles de ancho y 60
píxeles de alto, tienes que ajustar el tamaño de la página de tu documento de
animación a 468x60. Para cambiar el tamaño de la página ve a PESTAÑA DE PÁGINA en
el DIÁLOGO DE OPCIONES (en la página 477) (o selecciona "ARCHIVO -> OPCIONES DE
PÁGINA" ) e introduce los valores en los campos "ancho" y "alto" respectivamente.

Cuando exportas o realizas una visualización previa, la animación en Flash se ajustará

automáticamente al tamaño de la página que ya habías determinado. Por ello, es muy
fácil arreglar tu animación para que los objetos entren y salgan de la animación visible.
Por ejemplo, si colocas un objeto animado a la izquierda de la página en un frame clave
(key frame) y a la derecha de la página en el próximo frame clave, el objeto se verá
entrar del lado izquierdo del diseño para desaparecer por el lado derecho.

Nota: Si abres documentos más antiguos creados con versiones anteriores de Xara
Xtreme, no cortarán la página (el tamaño de la página era enorme), en vez de ello los
cortarán al tamaño del dibujo. Puedes controlar esto en el diálogo de propiedades de
animación.
432

Configurando el área para guardar como Dibujo creará una animación flash que sólo
sea tan grande como debe ser, por ejemplo de igual tamaño que los límites de la
animación. Esto puede ser útil si no necesitas un tamaño de página específico.

Velocidad de la animación
Cuando crees un nuevo frame clave, tendrá por defecto una duración de medio
segundo. Por lo tanto la animación de ese frame clave al siguiente tardará medio
segundo. Cuanto más larga sea la duración configurada para la animación, más lenta
será su reproducción. Para configurar el tiempo de duración para cada frame, primero
selecciona el frame que necesitas en la GALERÍA DE FRAMES (haz clic sobre él), y luego
haz clic sobre el botón de PROPIEDADES DE ANIMACIÓN (simplemente haz doble clic
sobre el nombre del frame).

Si configuras la opción "Mostrar este frame por" a 2 segundos, significa que la animación tardará
2 segundos en pasar de este frame clave al siguiente.

Nota: el diálogo de PROPIEDADES DE ANIMACIÓN es del tipo no modal (non-modal), lo

puedes tener siempre presente en la pantalla. Si presionas el botón APLICAR en lugar
de pulsar "Aceptar", el diálogo se quedará en pantalla. Los contenidos serán

www.magix.es
 Animaciones en Flash 433

actualizados a medida que vayas seleccionando los diferentes frames, y puedes

configurar distintos tiempos de duración para cada uno de ellos.

Fluidez de la animación (smoothness)

Los frames de las películas de Flash se reproducen a un ritmo constante. Cuanto más
rápido sea el ritmo de reproducción (frame rate), más fluida será la animación. Las
animaciones de MAGIX Web Designer 10 Premium tienen por defecto 24 frames por
segundo. Para cambiar el ritmo selecciona la pestaña OPCIONES FLASH del diálogo de
PROPIEDADES DE ANIMACIÓN .

La pestaña "opciones Flash" en donde puedes cambiar la velocidad de la película, así como
también la versión de la exportación en Flash.

Nota: cuanto más rápido sea el ritmo (frame rate) del frame, más grande será el
archivo resultante en Flash. Si tu animación consiste mayormente en objetos que
aparecen y desaparecen, con relativamente pocos movimientos rápidos, entonces
puedes reducir el tiempo de duración a menos de 24 frames por segundo. Si tienes
mucha acción con movimientos rápidos, quizás sea necesario aumentar el ritmo, pero
raramente es necesario tener más de 50 frames por segundo.

Rotación
MAGIX Web Designer 10 Premium genera los frames intermedios (tween frames) de
forma automática, haciendo un cálculo de cómo deben transformarse las formas de un
frame al otro. Pero a veces no es posible saber exactamente qué tipo de rotación es
necesaria.
434

Como en este caso. Supone que quieres crear una

transición (tween) entre la primera cara del reloj y la
segunda:

Seguramente esperas que las agujas se muevan en

dirección a las agujas del reloj pero también podrían
moverse en sentido contrario:

Es más, incluso podrían rotar de otras formas tam-

bién. El ejemplo de arriba asume que la aguja se
mueve de un extremo a otro, pero también podrías
crear una rotación que vaya en "línea recta", (ver
gráfico):

Si miras detenidamente, la aguja rota sobre su centro y no de un extremo a otro, y el

punto central se mueve en línea recta de un frame clave al siguiente. Por defecto el
MAGIX Web Designer 10 Premium hace rotar a los objetos de esta forma.

La función de rotación
Para que la rotación sea sobre otro punto puedes añadir la palabra clave "rotar"
enfrente del nombre del objeto (ver abajo en Galería de nombres). O puedes usar la
combinación "rotar +" para hacer que la rotación vaya en dirección a las agujas del reloj
o introducir la combinación "rotar -" para que vaya en contra de las agujas del reloj.

Vuelve al ejemplo de animación de la página anterior con dos frames claves en donde
la aguja del reloj se mueve de las 12 a las 8. Si introduces la combinación de palabras
"rotar + aguja" al objeto aguja, harás que la animación mueva la aguja en dirección a las
agujas del reloj (como en un reloj real). En cambio, si le colocas lacombinación de
palabras "rotar - aguja", ésta se moverá en dirección contraria a las agujas del reloj.

Si no has insertado un comando especial para la rotación, entonces se generará un

movimiento de transición (tween) con el trayecto más corto entre los objetos de un
frame a otro (rotando sobre el centro). Si introduces un comando de rotación para el
objeto con nombre, se calculará el punto de rotación necesario para generar la
animación.

Nota: no es posible rotar un objeto 360° entre frames claves si el punto de rotación no
se encuentra en el centro. Por ejemplo, para crear una rotación "completa" (que dé
toda la vuelta) de las agujas del reloj en el ejemplo de arriba deberías crear un frame
clave intermedio.

www.magix.es
 Animaciones en Flash 435

Grupos
Los grupos son tratados de forma especial por el programa cuando se crean
animaciones. Para que no tengas que asignarle un nombre a cada parte individual de un
grupo, puedes colocarle un nombre a todo el grupo, luego podrás copiar el grupo al
frame clave siguiente. MAGIX Web Designer 10 Premium animará el grupo completo
de un frame clave a otro. Y podrás aplicar las transformaciones normales al grupo
(como cambiar el tamaño, rotar, aplastar pero no podrás crear una transparencia para
el grupo; ver próxima página).

Si quieres que algunos miembros del grupo se muevan de forma diferente que el resto
del grupo, entonces estos objetos deberán tener un nombre distinto ("Ctrl + haz clic
para seleccionar un objeto dentro del grupo, y luego colócale un nombre).

Nota: Si quieres realizar cambios a algunos componentes del grupo, primero tendrás
que "desagrupar" el grupo, y luego tienes que re-agrupar los objetos nuevamente:

• debes volver a aplicar el nombre al nuevo grupo (selecciona el grupo, luego haz
doble clic sobre el nombre en la GALERÍA DE NOMBRE ).
• No debes cambiar el orden de los ítems del grupo.
• No debes añadir o quitar ítems del grupo.

Transparencia en un grupo
Si quieres que un objeto agrupado se vaya desvaneciendo en la animación, debes
aplicarle una transparencia a cada objeto del grupo individualmente. Hay dos formas
de hacer esto:
• Selecciona cada objeto del grupo y ajusta su transparencia.
• O desactiva la opción HACER GRUPOS TRANSPARENTES EN SU CONJUNTO en el
diálogo de OPCIONES ("Herramientas > Opciones, luego ve a la pestaña GENERAL .
Si haces esto, cuando ajustes la transparencia del grupo en conjunto, MAGIX
Web Designer 10 Premium aplicará la transparencia a cada ítem individual del
grupo, en lugar de realizar una transparencia a todo el grupo en su conjunto.

¿Qué funciones de MAGIX Web Designer 10

Premium son compatibles con Flash?
La renderización de vectores en Flash es relativamente primitiva, comparada con la del
MAGIX Web Designer 10 Premium. Por esta razón, no podrás usar las funciones más
avanzadas de MAGIX Web Designer 10 Premium como difuminación (feathering),
transparencias complejas y tipos de rellenos o sombras suaves. Las líneas (pinceladas)
sólo podrán tener un grosor simple y constante, y con extremos redondeados. No se
pueden usar líneas con guiones. El grosor mínimo para una línea es de un píxel. Las
líneas que sean más finas en MAGIX Web Designer 10 Premium serán representadas
en Flash como si tuvieran un píxel de grosor.
436

Hay dos aspectos a tener en cuenta para cuando realices dibujos que sean compatibles
con Flash. Primero, debes limitarte a utilizar sólo aquellas funciones que sean
compatibles con el Flash Player. Segundo, cuando crees animaciones sólo podrás
utilizar una serie limitada de características a las que se le puedan agregar transiciones
(tweens) o a que puedan ser animadas.

Las funciones de dibujo de MAGIX Web Designer 10 Premium que son compatibles
con flash :
• Todos los dibujos normales con líneas y formas (aunque el flash es mucho menos
preciso que MAGIX Web Designer 10 Premium, por eso, a veces, habrán
inexactitudes en líneas y formas).
• Los rellenos lisos, lineales, circulares y los rellenos elípticos con gradación de
color.
• Rellenos con gradaciones de color de varios niveles, incluyendo rellenos lineales y
elípticos. Máximo cuatro fases de color.
• Transparencia plana. Sólo tipo mixto.
• La transparencia con gradación es compatible con los objetos con relleno de color
plano (sin gradación). Es decir, puedes tener objetos con gradación de color y con
transparencia lisa u objetos con color liso y con transparencia con gradación, pero
no podrás tener ambos.
• Contornos de grosor constante (trazos de pincel) con extremos redondeados y
uniones de línea (los archivos en Flash versión 8 también aceptan otros tipos de
extremos y uniones).
• Texto, incluyendo kerning. Puedes utilizar las fuentes que desees. Los contornos
de los caracteres de cualquier fuente utilizada se integran (embedded) al archivo
en Flash. Esto es mucho más eficiente que la integración de la fuente en los
documentos en PDF.
• Texto sobre una curva. Nota: la línea utilizada para la curva deberá hacerse
invisible para que la animación funcione.
• Mapas de bits y rellenos de mapas de bits.
• Mapas de bits Contoned (coloreados) y rellenos de mapas de bits
• Saturación foto, temperatura del color y desenfoque (pero no brillo / cambios de
contraste).
• Nubes fractales y rellenos de plasma funcionarán, pero se convertirán en mapas
de bits, lo que no es tan eficiente.

Entonces, mientras algunos efectos de MAGIX Web Designer 10 Premium como, por
ejemplo, las sombras blandas, no funcionan en archivos estáticos, éstos se
exportan como mapas de bits al archivo flash, de modo que no son muy eficientes y no
son adecuados para la animación.

Lo que puede animarse:

Tal como se mencionó al comienzo de este capítulo, éstas son las reglas de oro sobre
lo que se puede cambiar de un frame clave al otro:
• Mover: desplazar los objetos de una posición a otra.

www.magix.es
 Animaciones en Flash 437

• Modificar tamaño (scale): aumentar o reducir el tamaño de los objetos.

• Aplastar o torcer (squash or skew): aplastar o torcer objetos.
• Girar: rotar objetos
• Transparencia: ajustar la transparencia general (plana) del objeto.
• Transformar color: cambiar el color de relleno (plano) de los objetos.
• O cualquier combinación de lo anterior.

Adicionalmente, hay determinados casos especiales de transformaciones de color de

foto que son compatibles con flash. Puedes alterar la saturación (así puedes convertir
una foto de color completo a una foto en blanco y negro para insertarla), además
puedes ajustar el color de la temperatura (caliente / frío) y cambiar el valor de
desenfoque. El último caso te permite convertir una foto desenfocada en una foto
enfocada. Pero observa que esto sólo funciona con valores de desenfoque, pero no
funciona con valores de enfoque. Asimismo, existe una pequeña diferencia en cómo
flash desenfoca las fotos. Flash desenfoca la foto completa incluyendo el borde,
mientras que el desenfoque en MAGIX Web Designer 10 Premium sólo desenfoca el
interior de la foto y mantiene un borde enfocado.

En segundo lugar, otro caso especial: puedes animar el texto en una curva. Esto es
especial porque puede utilizarse para mutar el texto sobre una curva en un texto sobre
otra curva totalmente diferente. De hecho, lo que hace es mezclar la posición de la letra
en un frame clave con la posición de la letra en el próximo frame. Esto puede producir
efectos muy interesantes.

Nota: la línea utilizada para la curva deberá hacerse invisible para que la animación
funcione.

Objetos sin movimiento

Puedes añadir nuevos objetos simplemente dibujándolos sobre cualquier frame clave.
Estos aparecerán en la animación al comienzo del frame y desaparecerán en el
próximo, salvo que aparezcan también en el segundo frame. Por lo tanto, la forma más
fácil de que un objeto aparezca estático en todos los frames es asegurarse de que esté
copiado en todos los frames. La optimización Flash de MAGIX Web Designer 10
Premium es muy eficiente y verás que realizar más de una copia casi no ocupa espacio
adicional en el archivo (esto es aplicable para múltiples copias de objetos en diversos
lugares).
438

El color se transforma — el color de la animación

cambia
Esto es lo que puedes y no puedes hacer con las transformaciones de color en MAGIX
Web Designer 10 Premium Flash:
• Puedes animar simples cambios de color plano de objetos de un frame clave al
siguiente.
• Puedes cambiar el color de la línea independientemente del color del relleno.
• Puedes cambiar los colores de tono continuo de una foto.
• No puedes ajustar la posición de los rellenos con gradación.

Transparencia
Tal como se mencionó anteriormente, puedes ajustar la transparencia plana de los
objetos (no las transparencias de grupo), lo que es compatible con Flash (tanto para
objetos estáticos como para cambios de transparencia tweening), pero la
transparencia con gradación de MAGIX Web Designer 10 Premium no es realmente
compatible con Flash. Existe una sola situación en la que puedes utilizar transparencia
con gradación y esta es en los objetos con relleno de color plano.

Se puede ajustar y animar la transparencia plana de todo tipo de objetos, formas, textos y fotos.

Es posible aplicar una transparencia con gradación (lineal, circular y elíptica) a los objetos con
color plano, pero no es posible animar el cambio de transparencia. Sin embargo, puede animarse el
cambio de color (regla seis).

www.magix.es
 Animaciones en Flash 439

URL en Flash
Para que un objeto en la animación Flash sea un enlace en el que pueda hacerse clic,
simplemente selecciona el objeto que quieras utilizar y selecciona HERRAMIENTAS ->
PROPIEDADES WEB (Ctrl + ñ+ W).

Introduce la URL requerida. (Si quieres que el enlace se abra en una nueva ventana o en
un nuevo frame del navegador, selecciona el frame web de destino seleccionando el
menú desplegable "ABRIR ENLACE EN ").

Si quieres que pueda hacerse clic sobre un texto, selecciona la opción RECTÁNGULO
RODEANDO OBJETO . Esto garantiza que aquellos que observan la animación Flash
puedan hacer clic en cualquier lugar sobre el texto (en vez de solamente sobre la forma
real de la letra).

Permitir clic en toda la animación

En la pestaña PROPIEDADES DE ANIMACIÓN -> OPCIONES FLASH puedes configurar que
en una URL se aplique la animación completa. Esto es de gran ayuda para los banner
publicitarios, ya que en éstos quieres que se permita hacer clic en cualquier parte de
una animación para ir a la dirección web sugerida.

clicTAG
Los clicTAG son utilizados con frecuencia por redes de publicidad. En vez de codificar
una URL en una animación Flash, el clicTAG permite a una organización insertar su
propia URL en la animación, lo que es particularmente útil para rastrear clics de
publicidad.

Si necesitas utilizar esta característica, simplemente escribe clicTAG en vez de una

URL.

Funciones de Flash avanzadas

Acelerar y desacelerar
En general, los pasos tween están separados en intervalos regulares entre los frame
claves, produciendo una animación lineal de un frame clave al otro. Al añadir los
símbolos < y > adelante del nombre de objeto, puedes hacer que la velocidad de los
objetos se acelere o desacelere. Es decir, que nombrar a un objeto >Nombre significa
que comenzará rápido y después irá más lento. Lo opuesto, <Nombre, hará que la
animación comience lento y se acelere.

Hasta puedes usarlos en combinación. Si el nombre de un objeto es <>Nombre, el

objeto comenzará lento, irá más rápido y volverá a ir más lento hacia el final del
periodo del frame. La terminología tradicional de animación denomina esto "easing"
440

porque puedes entrar ("ease in") o salir ("ease out") con facilidad, y la orden <> sería
un "ease in/out".

Puedes controlar el grado de aceleración o desaceleración utilizando números del 0 al

9. Esto significa que <2Nombre será una aceleración muy lenta, mientras que
<9Nombre será una aceleración extrema. De la misma forma >2 delante del nombre
resultará en una desaceleración. Usar el nombre >Nombre (sin número) es lo mismo
que >5Nombre.

Ejemplo: en la sección Ejemplos Flash de la GALERÍA DE DISEÑOS (haz clic sobre el

botón OBTENER DISEÑOS de la GALERÍA CLIPART ) hay un archivo de ejemplo llamado
Péndulo. El grupo del péndulo utiliza una combinación de <> y la función de giro.
También vale la pena examinar el otro ejemplo llamado "Zoom6.xar".

Funciones Detener e Ir a
Puedes añadir las funciones DETENER o IR A al nombre del frame (separado por un
punto y coma) para controlar el flujo de la secuencia. Por ejemplo, si tu primer frame se
llama "Frame 1;Ir a Frame 6", entonces la secuencia de la animación saltará al frame 6
al inicio del frame 1. Esto puede producir errores de tween, pero pueden ignorarse.
También espera el periodo específico del frame con la función IR A antes de saltar, pero
los frames con las funciones IR A o DETENER no realizan tween.

De la misma manera, un nombre de frame con DETENER al final del nombre,

interrumpirá la animación cuando llegue a ese frame. ¿Por qué esto es útil? Porque
puedes hacer que la animación salte a cualquier otro frame clave con un clic o
moviendo el ratón por encima de objetos. Por ejemplo, puede que tengas una
animación que espera a que el usuario le haga clic o mueva el ratón sobre un objeto
antes de continuar.

Botones que permiten clic y efectos de MouseOver

Puedes hacer que la secuencia de animación salte a cualquier otro frame clave
haciendo clic en un objeto o simplemente moviendo el ratón por encima de cualquier
objeto.

Para hacer esto, selecciona el objeto que quieras usar como disparador, abre el diálogo
de PROPIEDADES WEB (Ctrl+Shift+W) y en la pestaña ENLACE selecciona la opción
SALTAR A FRAME .

www.magix.es
 Animaciones en Flash 441

Si quieres que el salto ocurra simplemente moviendo el cursor sobre un objeto, selecciona la
pestaña MouseOver en lugar de la pestaña Enlace y selecciona de la opción similar " SALTAR A
FRAME ".

Ahora en tu animación, si haces clic en el objeto o pasas el cursor del ratón por encima,
la animación llevará al nuevo frame y seguirá desde ahí. Fíjate en el ejemplo del archivo
"Río Támesis" en la GALERÍA CLIPART. Esto utiliza una función Ir a para crear un loop del
frame 4 al 3 y una redirección URL del frame 1 si haces clic sobre el enlace Volver a
reproducir de la esquina.

"Ctrl +  + W" es una forma rápida de abrir el diálogo de Propiedades Web.

Resumen de animación de MAGIX Web Designer

10 Premium Flash
• Los frame claves de MAGIX Web Designer 10 Premium son "instantáneas" de tu
animación en un momento determinado. MAGIX Web Designer 10 Premium
produce automáticamente un transición o tween de objetos de un frame clave al
siguiente para producir una animación Flash fluida.
• No existe una línea de tiempo. Por lo contrario, la GALERÍA DE FRAMES te muestra
tus frames claves instantáneos en el tiempo (de arriba hacia abajo). Haz clic
sobre el nombre del frame para ver y editar ese frame clave.
442

• Si configuras la visualización de frames en MAGIX Web Designer 10 Premium en

2 seg., entonces animar objetos llevará 2 segundos desde su posición al inicio de
un frame clave a la posición de inicio del siguiente frame clave. Utiliza el diálogo
PROPIEDADES DE ANIMACIÓN para configurar el tiempo de visualización del frame.
• Para indicar a MAGIX Web Designer 10 Premium los objetos a los que debe
aplicarse la transición o tween entre un frame y el siguiente, debes nombrar el
objeto que deseas utilizar; para cada objeto nuevo que quieres animar, haz clic en
el botón NOMBRES en la barra de información de la herramienta de selección
y nómbralo (o selecciona el menú HERRAMIENTAS> NOMBRES ..). El objeto debe
tener exactamente el mismo nombre que en los frames siguientes.
• Cuando creas un frame clave nuevo (instantánea) , generalmente lo realizas
copiando el frame actual, lo que copia todos los objetos al nuevo frame junto con
sus nombres. A continuación mueve los objetos como corresponda.
• Todos los demás objetos (no nombrados) aparecerán estáticos mientras que
dura el frame clave (periodo de visualización).
• Puedes mover, ampliar, reducir, girar, estirar, alterar los colores o la transparencia
entre los frames de MAGIX Web Designer 10 Premium. Transformar los objetos
es muy eficiente.
• Existe un frame rate general para toda la película Flash. Cuantos más frames
Flash por segundo, más grande será el archivo Flash y más fluida la animación.
• Como cada frame Xtreme es una instantánea de toda la animación, todos los
objetos que deben aparecer en la instantánea deben también aparecer en el
frame. No puedes hacer una transición de un objeto del Xtreme frame 1 al frame 3
de Xtreme sin que aparezca en el frame 2.
• Puedes cambiar las formas, el texto o las fotos según lo permiten las seis reglas
de transformación descritas anteriormente (mover, cambiar de tamaño,
aplastar/torcer, rotación, transparencia plana y cambio de color). Si cambias la
forma de cualquier otra manera, esto no funcionará.
• La animación Flash depende de las dimensiones de la página que has especificado
en MAGIX Web Designer 10 Premium.

Crear GIF animados

Los GIF animados son una forma alternativa de mostrar secuencias animadas en la
web. Se emplea una tecnología más antigua y mucho más simple que tiene algunas
ventajas e inconvenientes.

Un GIF animado es un archivo GIF que contiene una secuencia de imágenes, como si
fueran frames de una película. Cada MAGIX Web Designer 10 Premium es un frame en
la animación final, como en un folioscopio.

Las ventajas:
• Todos los navegadores pueden reproducir animaciones GIF, no es necesario
ningún plugin adicional como en el caso de las animaciones flash. Esto conlleva
tiempos de carga cortos y un aumento de la compatibilidad de tus páginas.
• La animación GIF se utiliza como imágenes normales, no es necesario ningún
código HTML adicional como al incrustar animaciones flash.
www.magix.es
 Animaciones en Flash 443

Los inconvenientes:
• En los GIF animados no se pueden insertar transiciones "tween" entre los frames.
Esto significa que los frames de tu animación MAGIX Web Designer 10 Premium
se traducen 1:1 a los frames GIF resultantes. Si quieres tener animaciones fluidas
como en flash, tienes que utilizar numerosos frames.
• GIF es un formato Bitmap y no un formato vectorial como Flash. Produce archivos
de salida mucho más grandes, incluso para formas geométricas o texto.
• La profundidad de color máxima es de 256 colores.
• Las funciones de flash avanzado como el flujo de la secuencia (Detener/Ir a), los
vínculos con URLs o la aceleración no están disponibles.

No obstante, y gracias a su simplicidad, los GIF animados siguen siendo muy popular
para banners publicitarios o como imagen de avatar en foros o mensajes instantáneos.

Abrir un documento de animación

Para crear un GIF animado, primero debes abrir un documento animado. Para realizar
esto, escoge Archivo > Nuevo > Animación. Después tendrás acceso a la galería de
FRAMES .

Crear una animación

Para crear un GIF animado:

1. Escoge Herramientas > Galerías > Galería de frames. O haz clic sobre el símbolo
de la galería de FRAMES en la barra de GALERÍAS.
2. Dibuja lo que quieres que aparezca en el primer frame.
3. En la galería de FRAMES , haz clic en NUEVO para crear el próximo frame.
4. Establece el fondo y los puntos de superposición.
5. Crea los objetos que quieres que aparezcan en este frame.
6. Repite los pasos 3 a 5 hasta haber creado la secuencia de frames.

Exportar la animación
Para guardar la animación, escoge Archivo > Exportar GIF animado.

Propiedades de GIF animados

Para modificar los propiedades de la animación, haz clic sobre un frame en la galería de
FRAMES y selecciona PROPIEDADES . Podrás cambiar las opciones detalladas más
adelante.
444

La pestaña de frames
En la pestaña de FRAME puedes fijar:
• NOMBRE : el nombre de este frame. Esto es un simple recordatorio para ti, puesto
que no se exporta con el GIF animado.
• FONDO : si está establecido, el frame cubrirá todos los frames previos. Esto es útil
cuando quieres crear un fondo y después crear una animación sobre ese fondo.
Con frecuencia, el primer frame de la animación es el frame de fondo. Si el primer
frame no es el frame de fondo, el GIF animado usa el fondo de página como
fondo.
• SUPERPOSICIÓN : si esta opción está configurada, el frame se superpondrá con el
frame previo.
• RETARDO LOCAL : establece la duración que el frame tendrá en la animación.
• VER FRAME : si está activado, el frame se mostrará en la animación.
• MOVER FRAME EN LA LÍNEA DE TIEMPO: este valor determina cuánto cambia el
tiempo de un frame al utilizar los botones "MOVER FRAME HACIA
ADELANTE/ATRÁS" EN LA GALERÍA DE FRAMES.

Opciones flash
Aquí hay varias opciones para animaciones flash, la mayoría de los cuales se describen
arriba.
• Enlace que se aplicará a toda la animación (en la página 439)
• Velocidad de vídeo flash (en la página 433)
• Calidad JPEG (en la página 429)
• Área a guardar (en la página 431)

Colores de animación
En la pestaña COLORES DE ANIMACIÓN puedes configurar los colores utilizados en la
animación:
• COLORES DE PALETA: fija los colores de paleta favoritos para el GIF animado.
• CANTIDAD DE COLORES DE PALETA: esta opción está disponible si se utiliza una
paleta optimizada. Para gráficos simples puedes reducir la cantidad de colores de
la paleta. De esta forma se creará un archivo más pequeño sin pérdida de calidad.
Es posible que debas experimentar un poco para encontrar el balance óptimo
entre tamaño de archivo y calidad.
• DITHERING: selecciona uno de los tipos de dithering.
• TRANSPARENCIA: escoge esta opción para que las partes de un mapa de bits que
no contienen objetos se vuelvan transparentes.

www.magix.es
 Animaciones en Flash 445

Animación: repeticiones y velocidad

En la pestaña ANIMACIÓN puedes modificar la tasa de la animación y la frecuencia:
• LOOP: aquí determinas la cantidad de repeticiones.
• MOSTRAR CADA FRAME DURANTE: introduce aquí un valor cuando quieras obtener
una pausa igual entre cada frame de la animación. Utiliza la pestaña "Frame" para
establecer distintas pausas para frames individuales (descrito anteriormente). Se
indicará "Muchos" cuando la animación contenga más de una duración.

Vista previa en el navegador

Puedes seleccionar opciones adecuadas para los gráficos y después cargarlas en tu
navegador para poder hacer una vista previa:
• OPCIONES DE FONDO : modifica el fondo del GIF animado para ver cuál da el mejor
resultado.
• INFORMACIÓN ADICIONAL : la página de vista previa contendrá información útil
como, por ejemplo, tiempo de descarga potencial si se coloca en una página web.
• VISTA PREVIA : pulsa este botón para lanzar una vista previa en tu navegador web.

Opciones AVI
Opciones: selecciona entre los códecs que tienes instalados.

Calidad: establece el valor de calidad para AVI (hasta 100%)

Keyframe cada...: activa/desactiva la salida de key frames y ajusta la frecuencia.

Transparencia: selecciona esta opción para hacer el fondo AVI transparente.

Área a guardar: configurando el área para guardar como DIBUJO creará una animación
AVI que sólo sea tan grande como debe ser, por ejemplo de igual tamaño que los
límites de la animación. Esto puede ser útil si no necesitas un tamaño de página
específico.
446

Importación y exportación

Indicaciones generales sobre la exportación e

importación
Web Designer ofrece una amplia gama de opciones de importación y exportación.

Primero, es importante saber la diferencia entre guardar y exportar un archivo:

• GUARDAR almacena tu trabajo para que puedas abrirlo posteriormente y
continuar trabajando con él. MAGIX Web Designer 10 Premium guarda tu
trabajo en un archivo de formato web. Esto sería como el formado de
"documento master".
• EXPORTAR convierte a otros formatos compatibles. La exportación te permite
utilizar y distribuir tus diseños.

Formatos recomendados
Los formatos de exportación universal que pueden ser leídos por la mayor parte de
programas y que son utilizados en la web son los formatos de mapas de bits, GIF,
PNG y JPEG. Esto te garantiza que tu documento se verá exactamente igual que en la
pantalla de MAGIX Web Designer 10 Premium. PNG se recomienda para gráficos en
la web y JPEG para fotos.

Web Designer y HTML5

Web Designer ofrece mayor compatibilidad con HTML5. Esto es totalmente
automático sin que el usuario tenga que hacer nada o saber nada de código HTML.

Esto significa que es una forma más eficiente y rápida de descargar páginas web. Por
ejemplo, muchas funciones de gráficos tales como paneles de fondo, rectángulos,
rectángulos redondeados y objetos con sombras que previamente se convertían en
gráficos en la exportación, ahora se exportan como características nativas HTML.
Esto hace imágenes independientes

Entre las características que se exportan ahora con HTML5 están:

• Rectángulos, rectángulos redondeados, con contornos simples opcionales,
rellenos lineares graduados y transparencia plana simple.
• Rectángulos rotados o inclinados.
• Sombras de caja (negras o de colores).
• Texto con sombras.
• Rellenos de fondo de página simples graduados ( o algunos más complejos
hechos con los objetos de arriba).
• Texturas de mosaico (rellenos de mapa de bits) para rectángulos y fondos.

www.magix.es
 Importación y exportación 447

Los objetos agrupados no se exportarán como HTML5, por lo que deberías

exportarlos todavía como gráficos: consulta Agrupar y desagrupar objetos (en la
página 128) para más información.

Importar y exportar formatos de archivo

compatibles
Formatos de importación
Es importante que utilices las extensiones de archivo de tres letras de la lista de
abajo cuando cargues archivos al MAGIX Web Designer 10 Premium.

Formatos de importación de mapa de bits

.Mapa de bits Windows BMP
.CUT Halo CUT (256 colores)
.Formato de imagen DCM Imaging and Communications in Medicine (DICOM)
.DCX DCX
.FAX imagen de fax de un fax recibido o creado con un software de fax
.GIF (Graphic Interchange Format)
.ICO Microsoft Windows Icon (16 colores)
.JPG JPEG
.MXB MAGIX Bitmap
.PBM UNIX monocromo
.PCD PhotoCD
.PCT PICT
.PCX PCX Paintbrush
.PDF (ver importación de un archivo PDF)
.PGM UNIX escala de grises
.PNG PNG
.PPM UNIX color (hasta 24 bits)
PSD Photoshop (consulta importación y exportación de archivos PSD (en la página
455))
.RAS Sun Raster
.SGI (Silicon Graphics Image)
.TGA TrueVision TARGA
.TIF TIFF (RGB, RGBA con transparencias de canal alfa & CMYK)
MAGIX Web Designer 10 Premium es compatible con archivos TIFF fax (imágenes
blanco y negro. Los faxes con muchas páginas se importarán como páginas múltiples;
448

archivos TIFF con orden de bytes para Mac o PC; TIFF con capas y transparencia (si
se guarda desde el Photoshop las reglas para la compatibilidad para el modo de
mezcla son las mismas que para los archivos PSD); JPEG en TIFF (la transparencia no
es posible en este caso).
.XBM X Windows (2 colores)
.XPM X Windows (256 colores)
.WBMP Wireless Bitmap Image (imagen de mapa de bits inalámbrica). Formato de
imagen de mapa de bits en blanco y negro (1 bit) utilizado por los dispositivos
móviles.
.RAW formato de importación de cámara (ver importación de fotos RAW (en la
página 452) para ver una lista de tipos de archivos compatibles).

Formatos de importación EPS

.AI Illustrator EPS
.EPS ArtWorks
.EPS Illustrator EPS
.EPS CorelDRAW 3 & 4 EPS
.EPS FreeHand 3.0 EPS
.EPS Photoshop EPS (para importar datos de Photoshop a MAGIX Web Designer 10
Premium, utiliza archivos en PSD en lugar de en EPS para obtener mejores
resultados).
.EPS Xara

Otros formatos de importación

.ACO Adobe Color Swatch
.ACT tabla Adobe Color
.ART Xara Studio
.CPL paleta CorelDRAW
.WEB archivos Xara Webster
.AFF Acorn Draw
.CDR CorelDRAW (3, 4 & 5)
.CDT plantilla CorelDRAW
.CMX Corel CMX 5 & 6
.DRW Acorn Draw
.GIF marcador de posición GIF
.HTM. .HTM gráficos en páginas en HTML
.ODP (Open Office Impress)
.PAI imagen de MAGIX Photo Clinic
.PAL paletas CorelDRAW, Windows y PaintShopPro
.MXB MAGIX Bitmap
.WMF Windows Metafile (16 bits)
www.magix.es
 Importación y exportación 449

.EMF/ .WMF Enhanced Windows Metafile

.FLV marcador de posición FLV
.MP4 marcador de posición MP4
.PAI imagen de MAGIX Photo Clinic
.PDF marcador de posición PDF
.PPTX (PowerPoint 2007 y posteriores)
.RTF texto
.SVG (Scalable Vector Graphics)
.SWF marcador de posición Flash
.XWR marcador de posición Widget
.WIX para uso interno de Xara

Formatos de exportación
Formatos de exportación para mapas de bits (consulta resumen del diálogo de
exportación GIF, PNG y JPEG (en la página 456))
.GIF CompuServe GIF
.GIF archivos animados en GIF (consulta Creación de archivos animados en GIF (en la
página 442))
.JPG JPEG
PSD Photoshop (consulta importación y exportación de archivos PSD (en la página
455))
.PNG PNG
Otros formatos de exportación
.AVI animación AVI (documentos de animación)
.EMF, .WMF documentos EMF/WMF
.HTML, .HTM (páginas y sitios web)
.SWF Flash (consulta Animaciones en Flash (en la página 418))
.RTF Rich Text Format
.WIX, .WEB, .XAR documentos Xara

Importación de archivos
Para importar un archivo:
• Selecciona "ARCHIVO > IMPORTAR" - Esto normalmente mezcla el contenido del
archivo en el documento existente. Con algunos formatos, tendrás la opción de
importar el documento a la página actual o insertarlo como nueva página. Con
otros formatos se te dará la opción de importar los datos de archivo de forma
convencional o añadir un enlace al archivo e incluirlo en tu sitio web publicado.
• O selecciona "ARCHIVO -> ABRIR ": esta opción abre el archivo como un nuevo
documento.
450

Con MAGIX Web Designer 10 Premium podrás importar archivos utilizando el

método de arrastrar y soltar. Puedes arrastrar un archivo desde tu explorador de
archivos a un documento abierto dentro de MAGIX Web Designer 10 Premium, y con
esta acción estarás importando al documento y quedará colocado en el centro de la
página actual. O también puedes arrastrar y soltar el documento desde el Explorador
de Windows a una barra o título de barra de la ventana de Web Designer, esta acción
abrirá el archivo como un documento nuevo.

Sustitución de archivos de imagen

Puedes reemplazar cualquier imagen cargada o forma rellena con una imagen con las
tuyas. Para sustituir una imagen arrastra tu propio archivo de imagen (JPEG, GIF,
PNG, BMP) desde el explorador de Windows y suéltalo sobre la imagen que quieres
reemplazar. El tamaño de tu foto se adaptará automáticamente para sustituir la foto
de la plantilla. La nueva foto permanecerá seleccionada y se activará la herramienta
de relleno para que puedas adaptar la posición y el tamaño de la foto si lo deseas.

Importación de un archivo Photoshop PSD

Para importar un archivo PSD, importa el archivo con Archivo > Importar o
simplemente arrastra y suelta el archivo psd hasta MAGIX Web Designer 10
Premium.

Las capas del archivo PSD y la configuración de visibilidad de la capa se conservarán y

se convertirán en capas de MAGIX Web Designer 10 Premium. Podrás verlas
abriendo la GALERÍA DE CAPAS.

Consejo: si tienes objetos separados en Photoshop que deseas poder mover y

cambiar de forma independiente de otro en MAGIX Web Designer 10 Premium,
colócalos en capas separadas en Photoshop antes de realizar la exportación.

Importación de PDF
PDF es un formato de vectores gráficos complejos que ha evolucionado durante 10
años o más, y contiene numerosos subformatos y opciones. El PDF fue diseñado
como un formato de documento portátil para visualizar e imprimir solamente y no
estaba pensado como formato de archivo para la transferencia de datos entre
aplicaciones. Sin embargo, MAGIX Web Designer 10 Premium puede cargar la
mayoría de los archivos PDF.

El PDF es actualmente la forma recomendada para transferir archivos vectoriales de

Adobe Illustrator a MAGIX Web Designer 10 Premium. Guarda el archivo como PDF
y después importa el archivo resultante en MAGIX Web Designer 10 Premium.

Es importante tener en cuenta los siguientes puntos:

www.magix.es
 Importación y exportación 451

• Los archivos PDF de varias páginas se importan como documentos multipágina

en MAGIX Web Designer 10 Premium.
• El texto en los archivos PDF generalmente está separado en pequeños objetos
de texto. Esto no evita la visualización e impresión, pero significa que cuando se
lo importa lo que aparece como uno o más párrafos continuos pueden no serlo.
MAGIX Web Designer 10 Premium intenta rearmar las líneas de texto en líneas
y párrafos de texto editable, pero muchas veces verás que el texto está separado
en objetos de texto individuales.
• Para facilitar la extracción de un texto de un archivo PDF, se crea una capa que
contiene solamente el texto de esa página del PDF. Utiliza la GALERÍA DE PÁGINAS
Y CAPAS para ver esta capa.

Lo que podría no funcionar:

• Muchos archivos PDF incluyen fuentes incrustadas. No es posible extraer e
instalar de forma legal estas fuentes en tu sistema. Por lo tanto, si no tienes las
fuentes utilizadas en el archivo PDF, verás que las fuentes faltantes se
sustituirán con fuentes alternativas.
• Los archivos cifrados o protegidos por contraseña no pueden importarse.
• Los textos de archivos PDF que utilizan fuentes incrustadas no podrán leerse ni
editarse.

El PDF es un formato altamente complejo y muchas veces no puede importarse de

forma correcta. La mejor forma de importarlo puede depender del uso que quieras
darle. La opción OPTIMIZAR PARA VISUALIZAR intenta que el aspecto del resultado
importado sea lo más similar posible al Acrobat, pero puede ser más difícil de editar
(podría tener clipviews insertados, por ejemplo). La opción alternativa OPTIMIZAR
PARA EDITAR deshace algunas construcciones que son difíciles de editar de forma
manual (por ejemplo, clipviews incrustados).

Importación de un documento Word

Puedes importar un documento de Microsoft Word (.docx) de forma sencilla. Solo
arrastra y suelta el archivo desde el explorador de Windows o selecciona "ARCHIVO"
> "IMPORTAR" .

Áreas de texto de flujo automático

Cuando importas un documento Word, Web Designer te crea automáticamente
nuevas páginas si las áreas de texto sobrepasan la página actual. Del mismo modo
sucede cuando añades más texto o imágenes a tu documento: así el documento
añade nuevas páginas de forma automática para acomodarlos. Cuando creas una
nueva página, se colocará inmediatamente después de la página actual. La nueva
página tiene las mismas características que si la hubieras añadido de forma manual
(tendrá el mismo fondo y objetos repetidos de la página actual). Pero, además,
también tendrá una copia de todas las áreas de texto de la página actual que estén
vinculadas con el flujo de texto actual y estarán vinculadas de la misma manera.
452

Cambio simultáneo de áreas de texto vinculadas

Muchas veces, tu documento tendrá diseños similares de áreas de texto en muchas
de sus páginas. Es posible que si cambias un área de texto en una de las páginas
quieras que la modificación se vea reflejada en las áreas similares del mismo flujo de
texto. Por lo tanto, si mueves o cambias el tamaño de un área de texto y existen áreas
similares con el mismo flujo de texto en otras páginas (es decir, tienen el mismo
tamaño y posición en la página), Web Designer te preguntará si deseas cambiar esas
áreas también. Consulta Áreas de texto (en la página 199) para más información.

Importación de foto RAW

Puedes importar archivos RAW desde cámaras digitales utilizando la opción del menú
de importación o arrastrando y soltando el archivo en la ventana de Web Designer.

Extensiones de archivo compatibles: *.crw, *.cr2, *.nef,*.mrw,*raf,*.kdc,*.orf, *.dng,

*.ptx, *.pef, *.anw, *.x3f.

Importación desde una página web.

Puedes importar texto y gráficos directamente de páginas web a tu documento o
copiar y pegar texto y gráficos desde un navegador.

Para importar desde una página web online:

1. Selecciona "ARCHIVO" > "IMPORTAR DESDE PÁGINA WEB" (o "Ctrl + Alt + W").
2. Introduce la dirección de la página web (URL) de la página o gráfico que desees
importar.
3. Pulsa Importar.

Si la URL que has introducido es la de la página web, todo el texto y las imágenes de
esa página se importarán y colocarán en tu página en aproximadamente la misma
posición que en la página web. En otras palabras, esta función te permite importar
todos los textos y gráficos de un página web. Sin embargo, debes tener en cuenta que
la mayoría de las páginas web modernas están creadas a partir de una compleja
combinación de texto, gráficos, Javascript y otras características; por lo que es muy
probable que estas importaciones no te ofrezcan una representación precisa de la
página en MAGIX Web Designer 10 Premium. Sin embargo, esto te brinda una forma
útil de comenzar a reemplazar un sitio web ya existente con un sitio web de MAGIX
Web Designer 10 Premium.

Al importar de páginas web, la longitud de tu página de MAGIX Web Designer 10

Premium se extenderá automáticamente para incluir el texto y los gráficos nuevos, si
es que no es lo suficientemente extensa.

www.magix.es
 Importación y exportación 453

Exportación de archivos
Para exportar un archivo:
• Selecciona Archivo > Exportar.
• O pulsa Ctrl +  + E.

Se abrirá un diálogo de EXPORTACIÓN . Escoge el nombre para tu archivo y selecciona

el formato deseado de la lista desplegable de TIPO DE ARCHIVO . Algunos de los
formatos están descritos más abajo.

Exportación como Flash

Puedes exportar un dibujo al formato Macromedia SWF Flash (estático). Esto es más
apto para diseños de vectores y puede suministrar un tamaño de archivo mucho
menor. Puedes utilizar el SWF en páginas web o importarlo a Macromedia Flash para
usar en animaciones Flash. También puedes crear un Flash animado. Lee
Animaciones Flash (en la página 418) para más detalles sobre la exportación Flash.

Exportar como AVI

Selecciona ARCHIVO > EXPORTAR ANIMACIÓN y luego escoge AVI de la lista. Haz clic
en el botón OPCIONES que se encuentra en el diálogo de archivo para cambiar el códec
y otros ajustes para la exportación.

Exportación como documento Word

Selecciona "ARCHIVO" > "EXPORTAR" y luego escoge la opción MICROSOFT WORD
(.DOCX) del menú desplegable.

Exportación de un documento web

Muchas veces quieres exportar un documento de impresión como una página HTML
que pueda verse en Internet, en lugar de un archivo PDF. La ventaja de este formato
es que el tamaño de archivo es menor que el de un PDF y que facilita la visualización
en una tableta o en dispositivos con iOS.

Para más información, lee Publicación de documentos web (en la página 317).

Exportación como metarchivo de Windows (.wmf)

Word y muchos otros programas pueden leer los archivos en este formato.

Exportación como formato Extended Metafile (EMF)

Las aplicaciones modernas de Windows son compatibles con este tipo de formato de
gráficos vectoriales avanzados. Este formato también está disponible para
aplicaciones que suministran la opción de menú Pegar especial. Ten en cuenta que
454

MAGIX Web Designer 10 Premium puede contener características como estilos de

relleno avanzados que no pueden representarse en formatos vectoriales como EMF.
En este caso, parte delas imágenes se exportarán como mapas de bits. Las partes
vectoriales que pueden exportarse como vectores se exportarán como tales.

Exportación rápida de HTML y formatos de gráficos web

Puedes utilizar las opciones dedicadas en el MENÚ ARCHIVO para exportar
rápidamente páginas web y gráficos web, sin tener que seleccionar los formatos de
una lista completa de los formatos de exportación disponibles al utilizar "ARCHIVO ->
EXPORTAR ".

• ARCHIVO ->EXPORTAR PÁGINA WEB : exporta el presente documento de página

web a una ubicación de tu elección en tu ordenador.
• ARCHIVO ->EXPORTAR JPEG : exporta la selección o la página actual a un archivo
JPEG.
• ARCHIVO ->EXPORTAR PNG : exporta la selección o la página actual a un archivo
PNG.

Para más información, lee el capítulo Primeros pasos.

Exportación como mapa de bits

JPEG, GIF y PNG son formatos universales compatibles con la mayoría de las
aplicaciones informáticas modernas. PNG tiene la calidad más alta. JPEG es el mejor
formato para trabajos fotográficos, pero puede producir archivos compactos
aceptables (puede controlarse la calidad y el tamaño de archivo).

El formato GIF es compatible sólo con 256 colores y, a pesar de que es muy común en
muchas páginas web, PNG es un mejor formato. PNG también es compatible con
gráficos semitransparentes (utiliza la opción True Color + Alpha), pero esto no es
compatible correctamente con Microsoft Internet Explorer (pero sí con los demás
navegadores web).

Cuantos menos colores contenga el archivo, más pequeño será y menor calidad
tendrá. Sin embargo, al utilizar 256 colores o menos, MAGIX Web Designer 10
Premium te suministra técnicas muy avanzadas para simular una mayor gama de
colores para que obtengas resultados de calidad fotográfica utilizando solamente 256
colores o menos.

Importante
Como los mapas de bits se exportan con la calidad de vista actual, asegúrate de que
la opción "VENTANA "> "CALIDAD " esté configurada en Anti-Aliasing para obtener
mejores resultados.

www.magix.es
 Importación y exportación 455

Exportación de archivos Photoshop PSD

Photoshop es un editor de mapas de bit, por lo que cuando se exporta a un formado
PSD todos los objetos vectoriales de MAGIX Web Designer 10 Premium se
rasterizan. Puedes seleccionar la resolución (dpi) al exportar.

Siempre guarda tu trabajo en MAGIX Web Designer 10 Premium antes de exportar.

Después, si deseas alterar tus objetos originales en el futuro, simplemente carga
MAGIX Web Designer 10 Premium, realiza los cambios y después exporta
nuevamente los objetos requeridos. Para exportar como archivo PSD selecciona
"Archivo -> Exportar" y después ADOBE PHOTOSHOP en la lista GUARDAR COMO TIPO.

Capas
Las capas se conservan en MAGIX Web Designer 10 Premium cuando exportas en
formato PSD. Cada capa se rasteriza como una capa separada en PSD, incluyendo los
nombres de las capas. La visibilidad de las capas también se guarda, por lo tanto las
capas definidas como "invisibles" en MAGIX Web Designer 10 Premium serán
exportadas y guardadas como invisibles en Photoshop. Puedes activar o desactivar las
capas en Photoshop utilizando la paleta de CAPAS .

Texto
Puedes exportar texto desde MAGIX Web Designer 10 Premium para que sea un
texto editable en Photoshop, pero el texto debe encontrarse en una capa propia (al
importar se te preguntará si quieres actualizar los objetos de texto para que sean
editables en Photoshop). El texto que se encuentra en una capa con cualquier otro
objeto gráfico se rasterizará en esa capa y no será editable.

Exportación DPI
Podrás configurar el valor DPI de los mapas de bits en el archivo PSD exportado.

Un DPI de 96 es la resolución de
pantalla normal de Windows, es
decir, que si exportas en 96 dpi el
tamaño del 100% en Photoshop será
igual que el 100% en MAGIX Web
Designer 10 Premium.

Para un trabajo de impresión deberías escoger un DPI mayor.

Puedes seleccionar para exportar toda el área de página de MAGIX Web Designer 10
Premium o solamente las áreas con objetos visibles.
456

Resumen
Para obtener la mayor compatibilidad y posibilidades de edición en Photoshop:
• Coloca las partes de tu dibujo que deseas que permanezcan como capas
separadas en Photoshop, en capas separadas en MAGIX Web Designer 10
Premium.
• Si quieres que el texto pueda editarse en Photoshop, colócalo en una capa
individual sin objetos gráficos.

Resumen del diálogo de exportación GIF, PNG y

JPEG

El diálogo de exportación tiene dos ventanas de vista previa, IMAGEN A a la izquierda e

IMAGEN B a la derecha, para que puedas comparar las opciones de exportación
alternativas o los tipos de documentos. Haz clic en la ventana de vista previa
izquierda o derecha para cambiar la vista previa activa.

Arriba de la ventana de vista previa se encuentra una lista desplegable que te permite
seleccionar uno de los tres formatos de exportación más comunes: JPEG, PNG y GIF.
Una vez que hayas seleccionado la vista previa A o B , puedes ajustar numerosas
opciones de exportación con las cinco pestañas que se encuentran debajo de la vista
previa. Algunas opciones como las opciones de paleta solo se pueden aplicar a
algunos tipos de documentos como los PNG, y no son relevantes para el tipo JPEG.

www.magix.es
 Importación y exportación 457

Otras opciones de la pestaña OPCIONES cambian dependiendo del tipo de documento,

como cuando exportas un JPEG y puedes configurar la calidad requerida.

Por lo tanto el proceso para exportar una imagen:

1. Selecciona el objeto o los objetos de la página que quieras exportar
2. Selecciona el menú Exportar o "Ctrl + Shift + E", introduce un nombre de archivo
y luego escoge el tipo de archivo de la lista desplegable. El tipo de exportación
principal se mostrará en el diálogo de vista previa superior.
3. En este diálogo de vista previa puedes ajustar la configuración si lo deseas o
ignorarlo si la configuración por defecto está bien.
4. Haz clic en el botón EXPORTAR

Para los formatos más usuales JPEG y PNG, en el paso 2 puedes utilizar directamente
las opciones disponibles en el MENÚ ARCHIVO: EXPORTAR JPEG y EXPORTAR PNG . El
diálogo de exportación incluye el botón "Configuración" que te lleva al diálogo que se
muestra arriba.

La mayoría de las configuraciones de exportación se recordarán para la próxima vez

que exportes. Por ejemplo, si ajustas la calidad JPEG, la próxima vez que exportes un
JPEG se recordará la configuración.

Tamaño de imagen exportada

Si exportas el tamaño estándar normal es lo mismo que ves en la pantalla con el zoom
al 100%. El tamaño de píxel se puede ver en la ventana de vista previa. Puedes ajustar
el tamaño del objeto en la página antes de exportar o si introduces un valor de píxel o
DPI alternativo en la pestaña TAMAÑO DE MAPA DE BITS .

Controles
Estos botones modifican la vista previa de las imágenes, pero no el archivo para
exportar:
• Herramienta de ZOOM : haz clic sobre una vista previa para
ampliarla. Shift + clic para reducirla. Arrastra sobre un área de la
vista previa para realizar un zoom en esa área.
• Herramienta de DESPLAZAMIENTO: te permite mover la imagen
dentro de la ventana de vista previa.
• ZOOM PARA MAXIMIZAR : modifica el tamaño de la imagen de vista
previa de forma que se adapte a la ventana.
• ZOOM AL 100%: amplía la imagen a su tamaño completo (100%).
• ZOOM HASTA LA RESOLUCIÓN DE LA IMAGEN (1:1): no tiene ningún
efecto en el caso de archivos GIF. Modifica el tamaño de la imagen
para que un píxel del mapa de bits sea un píxel en la pantalla. Esto
es muy útil para previsualizar el mapa de bits en detalle.
458

La siguiente herramienta solo es importante para archivos que utilizan menos de 256
colores (pero verás el resultado si has seleccionado la pestaña OPCIONES DE PALETA):

SELECTOR DE COLOR (PIPETA) : al mover el cursor sobre la imagen se señalará

el color que se encuentra debajo del cursor. Haz clic para seleccionar ese
color en la paleta. Después, puedes utilizar los botones de las OPCIONES DE
PALETA (descrito a continuación) para modificar ese color.

VISTA PREVIA: el botón de vista previa está disponible en todas las pestañas de este
diálogo. Actualiza las ventanas de vista previa para reflejar cualquier cambio que
hayas hecho a las opciones de exportación.

Pestaña Opciones de paleta

Esta pestaña te permite modificar los colores de tu imagen para exportar.

Dithering y paleta
Las opciones DITHERING y PALETA solo son aplicables para la exportación de 256
colores o menos y modifican la forma en que la imagen se visualiza, así como su
paleta de colores. Se recomienda utilizar siempre la PALETA OPTIMIZADA . Si se
configura la opción DITHERING en ninguno, se producirán archivos más pequeños pero
que probablemente presentarán líneas. ERROR DE DIFUSIÓN crea resultados con mejor
calidad pero también archivos más grandes.

Profundidad de color
Escoge la cantidad de colores que requiere tu mapa de bits. Cuantos más colores,
más grande el archivo (generalmente) y mayor la calidad. La opción TRUE COLOR es
compatible con hasta 16 millones de colores. TRUE COLOR + ALPHA incluye
características de semitransparencia como sombras y transparencias. Este es el
formato recomendado para aplicaciones compatibles con archivos PNG de canal alfa.

Si escoges 256 colores o menos, tienes la posibilidad de utilizar transparencia simple

(ver a continuación el icono de la copa). Esto no es compatible con píxeles
semitransparentes, sino con píxeles completamente opacos o transparentes y, por lo
tanto, puede producir bordes dentados.

Colores máximos
Si escoges una profundidad de color de 256 colores o menos puedes controlar
exactamente la cantidad de colores que se utilizan en el archivo. Esto suministra un
gran nivel de control sobre la calidad versus el tamaño del archivo. Simplemente
introduce la cantidad de colores requeridos y pulsa el botón de VISTA PREVIA para ver
el resultado.

www.magix.es
 Importación y exportación 459

Botones
Estos botones (excepto FONDO TRANSPARENTE ) se aplican cuando se exportan
imágenes con 256 colores o menos. Estos archivos se crean con una paleta de colores
limitada y estos controles suministran un mayor nivel de control sobre esos colores
de paleta. Lee SELECTOR DE COLOR explicado anteriormente para ver cómo seleccionar
un color o haz clic sobre un color en la PALETA DE COLORES .

Bloquear un color

Puedes especificar la cantidad de colores que quieres en la paleta de los mapas de

bits exportados. Es posible que quieras asegurarte de que estos colores siempre
aparezcan en la paleta y, por lo tanto, puedes bloquearlos. Haz clic sobre un color
para seleccionarlo y después selecciona el botón BLOQUEAR . Aparecerá un pequeño
cuadrado en la esquina izquierda del color para señalar que ese color está bloqueado.

Convertir un color de la paleta en web safe

Si pulsas este botón el color seleccionado cambiará a uno de los 216 colores de la
paleta de colores web. Este es un sistema que ha dejado de ser importante o
relevante, puesto que todos los ordenadores puedes mostrar millones de colores y
restringir los gráficos web a esta paleta limitada no tiene mayores beneficios.

Convertir el fondo de imagen en transparente

Esto hace que las áreas no cubiertas por los objetos seleccionados sean
transparentes. Seleccionar esta opción activa automáticamente una entrada
transparente en la paleta.

Convertir un color de la paleta en transparente

Convierte esta entrada de color en transparente. Debes tener en cuenta la diferencia

entre esta opción, que convierte partes del objeto seleccionado en transparente, y la
opción Convertir fondeo de la imagen transparente, que convierte el fondo detrás de
los objetos seleccionados en transparentes.

Eliminar un color de la paleta

Borra este color de la paleta. Las áreas del mapa de bits que utilicen el color eliminado
utilizarán el color más cercano en la paleta. Cuantos menos colores en la paleta, más
pequeño será el archivo de mapa de bits.

Restablecer un color previamente eliminado

Restaura un color eliminado.

460

Añadir colores de sistema

Añade 28 colores a la paleta. Estos colores son los colores del sistema Windows y
una cantidad de colores primarios. Esto garantiza que la paleta incluya una extensión
de colores y puede mejorar la calidad de la imagen, especialmente si contiene una
amplia gama de colores. Es posible que necesites experimentar con esta opción para
obtener los mejores resultados.

Pestaña Tamaño de mapa de bits

En esta pestaña puedes cambiar el tamaño de la imagen para exportar.

Tamaño y resolución del mapa de bits

Puedes modificar el tamaño del mapa de bits cambiando:
• TAMAÑO . Introduce el ancho o alto en uno de los campos. Como la relación de
aspecto del mapa de bits está bloqueada, al cambiar una dimensión se cambiará
también la otra. TAMAÑO es más adecuado que ESCALA si quieres crear un mapa
de bits con un tamaño especial en píxeles.
• ESCALA. (No disponible para JPEG ni PNG). Esto te permite cambiar el tamaño
del mapa de bits con un porcentaje. ESCALA es mejor que Tamaño si quieres, por
ejemplo, crear un mapa de bits un 50% más grande que el original.
• RESOLUCIÓN. (No disponible para GIF ni BMP). Introduce la resolución en el
campo de DPI. Si quieres exportar una imagen para visualizar en una pantalla
(por ejemplo, una página web) no necesitas un valor DPI mayor que 96. Los 96
DPI también garantizan que el mapa de bits tenga el mismo tamaño que los
objetos en la pantalla (con un aumento del 100%).

Área a guardar
El mapa de bits puede crearse utilizando una de estas áreas del documento:
• PÁGINA :toda el área de la página.
• DIBUJO :
el área cubierta por los objetos.
• SELECCIÓN : el área cubierta por los objetos seleccionados. Solo disponible
cuando se han seleccionado objetos.

Anti-aliasing
El anti-aliasing mejora la apariencia de los gráficos suavizando los bordes dentados:
• CONSERVAR ANTI-ALIASING PANTALLA . El mapa de bits exportado utilizará el
mismo posicionamiento que se ve en la pantalla para que conserve el mismo
anti-aliasing. Esto puede crear bordes de objetos levemente borrosos porque no
se ajustan exactamente a los límites de los píxeles.
• MINIMIZAR ANTI-ALIASING VISIBLE . Esto reposicionará levemente los objetos en
fracciones para minimizar el anti-aliasing alrededor del borde del mapa de bits
exportado. Si tienes duda sobre la opción que debes utilizar, selecciona esta
opción.
www.magix.es
 Importación y exportación 461

Colocar image tag de HTML en el portapapeles

Esto te permite guardar la información básica del image tag de HTML cuando guardas
el mapa de bits. Después, podrás pegar la etiqueta en tu editor de texto o página
HTML.

Pestaña de opciones
Con esta pestaña puedes modificar la compresión JPEG y activar las opciones
progresivo/entrelazado de ser necesario.

Calidad JPEG: (solo JPEG) una configuración baja generará un archivo pequeño con
pérdida de calidad, mientras que un valor alto reducirá levemente el tamaño del
archivo, pero conservará una alta calidad. Ten en cuenta que una configuración de
100% también comprimirá el archivo. Un valor de 75% produce una buena
compresión sin causar pérdida de calidad evidente para la mayoría de los usos.

Entrelazado: (solo GIF y PNG) esta opción es como un JPEG progresivo. En el

navegador, la primera imagen aparecerán como una imagen de baja resolución. A
medida que el archivo se carga, la resolución aumenta.

Transparente: (solo GIF y PNG) hace que las áreas no cubiertas por los objetos
seleccionados sean transparentes. Seleccionar esta opción activa automáticamente
una entrada transparente en la paleta.

Exportar cada capa a un archivo individual: si se selecciona esta opción al exportar

un diseño que contiene varias capas, se creará un archivo por separado para cada
capa. Los nombres de cada capa (tales como se encuentran configurados en la
GALERÍA DE PÁGINAS Y CAPAS ) se utilizarán para nombrar los archivos exportados.

Vista previa
Puedes escoger el mejor compromiso entre tamaño de archivo y calidad para gráficos
web utilizando las ventanas de vista previa A y B en el diálogo de EXPORTACIÓN
(ilustrado arriba). Sin embargo, la mejor prueba es ver la forma en que el gráfico se ve
en un navegador web. Esta pestaña te ofrece algunas opciones para esa vista previa.
Haz clic en el botón VISTA PREVIA para abrir el navegador web y ver los gráficos antes
de exportarlos.
462

Imprimiendo

Mostrar bordes de impresión

El menú Ventana > Mostrar bordes de impresión muestra una línea amarilla y roja
alrededor de la página (no se imprime) que indica los márgenes y bordes de
impresión. Los límites de la página están señalados con un rectángulo rojo. El área de
impresión está establecida por los márgenes de la impresora seleccionada
actualmente. Algunas impresoras te permiten ajustar los márgenes, pero muy pocas
te dejan imprimir hasta el borde de la página.

Si algún objeto de la página se encuentra fuera del rectángulo rojo, es muy probable
que no se imprima.

Seleccionar y configurar una impresora

Archivo > Configuración de impresora. Esta opción abre el diálogo estándar de
CONFIGURACIÓN DE IMPRESIÓN de Windows:

Al seleccionar una impresora, también se selecciona el tamaño de papel y su

orientación. Ten en cuenta que este es el tamaño y la orientación de las hojas en la
impresora. No es lo mismo que el tamaño/orientación del documento. VERTICAL
imprime la hoja sin girarla. HORIZONTAL imprime girando la hoja 90%. (Estos botones
son duplicados del diálogo de OPCIONES DE IMPRESIÓN , descrito a continuación).
Recomendamos no modificar la configuración por defecto de los botones
HORIZONTAL /VERTICAL .

Por favor, ten en cuenta que no podemos darte consejo sobre la instalación o
configuración de impresoras porque estas son operaciones de sistema estándar. Si
tienes dificultades, contacta con el proveedor de tu impresora u ordenador.

www.magix.es
 Imprimiendo 463

El botón de propiedades
Esto muestra un diálogo que te permite establecer las opciones para el tipo de
impresora seleccionada. MAGIX Web Designer 10 Premium no controla este diálogo.

Botón de red
Si tu ordenador está conectado a una red, este botón te permite compartir impresoras
de la red. MAGIX Web Designer 10 Premium no controla este diálogo.

El diálogo de impresión
Escoge Archivo > Imprimir (shortcut Ctrl+P)

Botón imprimir
Una vez que has seleccionado las opciones requeridas, haz clic para imprimir.

Botón Imprimir...
Esto abre el diálogo de CONFIGURACIÓN DE IMPRESIÓN (descrito anteriormente).

Botón opciones
Esto abre el diálogo que te permite configurar opciones adicionales de impresión. Las
opciones se describen más adelante.
464

Páginas
TODAS LAS PÁGINAS: imprime todas las páginas del documento.

PÁGINA/S ACTUAL/ES: imprime la página o doble página actualmente seleccionada.

OBJETOS SELECCIONADOS: Esta opción está disponible si se selecciona cualquier objeto

del documento. Si está activada, sólo se imprimen los objetos seleccionados. Observa
que otros objetos dentro de los límites de los objetos seleccionados no se imprimen,
sólo se imprimen los objetos que estén realmente seleccionados.

Los objetos en las capas del fondo y las capas guía nunca se imprimen. Lee Galería de
capas para más detalles.

RANGO DE PÁGINAS: te permite especificar las páginas que deseas imprimir. Puedes
escribir números de páginas específicos separados por comas, o introducir un rango
de páginas separando los dos números con un guión.

Ejemplos rangos de páginas:

2 sólo imprimirá la página 2.

1,3,5-7 imprimirá las páginas 1, 3, 5, 6 y 7.

2,3,6-8,11-12 imprimirá las páginas 2,3,6,7,8,11 y 12.

La sección Opciones del diálogo te indicará si el rango de páginas que has escrito es
aceptado o no.

Imprimir a archivo
Puedes seleccionar la opción IMPRIMIR A ARCHIVO para crear un documento para
entregar a una imprenta (si pueden aceptar este tipo de archivo).

Después de activar esta opción, al hacer clic sobre IMPRIMIR , Web Designer muestra
el diálogo estándar de Windows para GUARDAR para que puedas especificar un
nombre y una ubicación para el archivo.

Los archivos de impresión tienen una extensión por defecto .prn

Copias
Establece la cantidad de copias del documento que quieres imprimir.

www.magix.es
 Imprimiendo 465

Opciones de impresión: Pestaña Salida

Imprimir capas
Hay dos opciones:
• Imprimir TODAS LAS CAPAS DE PRIMER PLANO .
• Imprimir solamente las CAPAS DE PRIMER PLANO VISIBLES actualmente.

Ten en cuenta que las capas de primer plano se imprimen, mientras que las capas de
fondo nunca se imprimen.

Imprimir como
NORMAL es adecuado para la mayoría de los tipos de documento.

Sin embargo, algunas impresoras no reproducen colores consistentes al imprimir

mapas de bits y objetos vectoriales que tienen el mismo color (este es un fallo del
driver de la impresora). Esto es visible si los objetos se superponen con mapas de bits
o con objetos con transparencia. En este caso, selecciona MAPA DE BITS o MAPA DE
BITS ANTI-ALIASED y vuelve a intentar.

La elección entre mapa de bits y MAPA DE BITS ANTI-ALIASED depende de la impresora

y la preferencia personal. Algunas impresoras dan un mejor resultado cuando el anti-
aliasing está desactivado, especialmente al imprimir líneas delgadas. En general, el
466

uso de anti-aliasing permite imprimir con resolución menor. Por ejemplo, la impresión
de un mapa de bits con 150 DPI es generalmente suficiente para todos los usos. Sin
anti-aliasing, es probable que se necesite una resolución más alta lo que resulta en
una impresión más lenta.

Resolución de transparencia
Al imprimir, los efectos de transparencia de MAGIX Web Designer 10 Premium se
crean utilizando mapas de bits.

Esta opción controla la resolución de esos mapas de bits cuando se envían a la

impresora. La opción automática es adecuada para la mayoría de los dibujos y
significa que MAGIX Web Designer 10 Premium selecciona automáticamente una
resolución apropiada para la impresora actual. Esto puede no ser adecuado si se
imprime en una impresora con resolución muy alta como dispositivos imagesetting.
En este caso, es posible que quieras controlar la resolución de forma manual e
introducir el valor deseado.

Ten en cuenta que las impresoras modernas muchas veces aseguran poder imprimir
más de 1000 DPI, pero esto no es lo mismo que "píxeles por pulgada", que es lo que
ves en tu pantalla. En general, nunca es necesario imprimir a más de 600 píxeles por
pulgada y 300 píxeles por pulgada producen en general resultados de impresión
perfectamente adecuados, especialmente con anti-aliasing.

Calidad de llenado
Si usas esta opción, puedes escoger cuántos pasos conforman los rellenos con
gradación en tu documento al imprimirlo. La configuración NORMAL es adecuada para
la mayoría de los casos. Esta opción no puede activarse en el caso de impresoras
PostcScript.

Opciones de texto
Si tu impresora tiene problemas para reproducir fuentes, selecciona la opción
IMPRIMIR TODO EL TEXTO COMO FORMAS . Todo el texto se convertirá en formas
vectoriales antes de que el documento se envíe a la impresora. Esto puede ser más
lento, pero reproducirá exactamente lo que ves en pantalla.

www.magix.es
 Imprimiendo 467

Opciones de impresión: Pestaña Diseño de la

impresión
Aquí encontrarás una compilación de los efectos más importantes para la
optimización de fotos sacadas, por ejemplo, con tu móvil.

La mayoría de las opciones en el diseño de impresión no pueden activarse si has

seleccionado las opciones OPTIMIZACIÓN o ADAPTACIÓN AUTOMÁTICA.
Recomendamos utilizar estas opciones, porque ofrecen la forma más fácil de
imprimir.

Sin embargo, puedes escoger las opciones personalizadas (lee "Individual" más
adelante).

Optimización
Tu diseño se moverá al centro de la página y se ampliará o reducirá para adaptarse al
tamaño del papel.

Esta opción es la mejor si tienes un diseño grande o pequeño que quieres adaptar al
tamaño de una página.
468

Adaptación automática
Tu diseño tendrá la orientación necesaria, pero Web Designer no cambiará el tamaño.
Recomendamos utilizar esta opción si tienes dificultades para encontrar la orientación
correcta (existen al menos cuatro lugares en donde puedes establecer la orientación
de la página, en algunos drivers de impresora todavía más).

Esta opción es la mejor si has configurado el tamaño para tu diseño y no quieres que
se modifique.

Adaptación personalizada
Te permite controlar la impresión, incluyendo orientación, tamaño y márgenes.

Los botones de ORIENTACIÓN pueden utilizarse para escoger la orientación de la

impresión. La escalación puede modificarse utilizando el campo ESCALA . Los campos
de margen superior e izquierdo pueden cambiarse (esto establece el lugar en que
aparece la esquina superior izquierda de la página en el papel de la impresora).

Los campos ANCHO y ALTURA te ofrecen una forma alternativa de configurar el

tamaño de la impresión (cuando cambias un valor, el otro cambiará también para
asegurar que la página se imprima con una relación de aspecto 100%).

Adaptación múltiple
Para imprimir muchas copias en una página, escoge MÚLTIPLE, introduce un valor para
la cantidad de copias que debe incluir el ancho de la página (hileras) y la cantidad a lo
alto de la página (columnas) y la distancia entre cada uno (margen).

www.magix.es
 Personalización de Web Designer 469

Personalización de Web Designer

Cambio del documento de plantilla en blanco

Los documentos de plantilla son las opciones disponibles en ARCHIVO > NUEVO.

Las plantillas prediseñadas están disponibles en la galería de diseños (o en

Archivo > Nuevo de la galería de diseños).

Para añadir un documento de plantilla:

1. Abre un documento existente ("Archivo > Abrir" o "Ctrl + O") o crea uno
nuevo con el botón NUEVO de la barra de control ESTÁNDAR o "Ctrl +N".
2. Haz los cambios necesarios (como cambiar la página, añadir un logo o un
mensaje). Puedes editar el documento de plantilla de la misma forma que
un documento común.
3. Cuando estés satisfecho con los cambios escoge "Archivo > Guardar
plantilla" e introduce un nombre para la plantilla.

Para establecer la nueva plantilla como plantilla por defecto (es decir, que será lo
primero que aparezca cuando abras Web Designer y cuando pulses Ctrl+N) coloca la
tilde en USAR COMO PLANTILLA POR DEFECTO al guardar la plantilla.

Opciones del menú "Herramientas"

Shortcut: Ctrl +  + O

Con esto se abre el diálogo de opciones. Allí pueden aplicarse configuraciones para
Web Designer.

Con el botón ACEPTAR se guardarán las configuraciones y se cerrará el diálogo.

APLICAR guarda las modificaciones pero el diálogo permanece abierto. De esta forma
puedes continuar realizando cambios.
470

Pestaña General

Las capas actuales siempre están visibles y pueden

editarse.
En el capítulo Capas (en la página 407) encontrarás más detalles sobre las capas y
la galería de capas.

Si se ha seleccionado esta opción, al seleccionar una capa en la GALERÍA DE CAPAS ,

éstas estarán visibles y podrán editarse automáticamente. Si esta opción no está
seleccionada, los estados VISIBILIDAD y EDICIÓN de una capa no se modificarán al
seleccionarla.

www.magix.es
 Personalización de Web Designer 471

Dar a nuevos objetos los atributos más recientes

Algunos atributos son el ancho de línea, el modelo de guiones, puntas de flecha y
color, así como color y tipo de relleno.

Si esta opción está fijada, los nuevos objetos tendrán los atributos del último objeto
que se ha dibujado o seleccionado. Por ejemplo, puedes darle a una forma existente
un relleno rojo y una línea verde. Si luego dibujas una nueva forma, ésta también
tendrá un relleno rojo y una línea verde. Consulta la sección "Atributos actuales" (en
la página 57) del capítulo Primeros pasos para una descripción completa de los
atributos actuales y esta opción. Esta opción está activa por defecto.

Preguntar antes de aplicar el atributo actual

Esto es aplicable cuando se cambia un atributo actual. (Es decir, si cambias un
atributo cuando no está seleccionado ningún objeto.) Si la opción está activada, se te
solicitará que confirmes si quieres cambiar el atributo. Si la opción está desactivada, el
cambio se realizará sin necesidad de confirmar.

Hacer grupos transparentes en su conjunto

Lee el capítulo Transparencia (en la página 244) para más información sobre las
transparencias.

Al aplicar transparencia a un grupo de objetos, Web Designer aplicará la

transparencia a todo el grupo como si fuera un solo objeto (no se verán las
transparencias individuales en el grupo). Si se deselecciona esta opción, Web
Designer añadirá la transparencia a cada objeto del grupo por separado.

Mantener los nombres de las capas importadas

Si esta opción está activada, la información de capa se preservará al importar
plantillas u otros archivos. Con la opción IMPORTAR CAPAS a la CAPA ACTIVA
seleccionada, todos los objetos importados aparecerán en la capa actual y la
información de capa en la información entrante se ignora. IMPORTAR CAPAS EN
NUEVAS CAPAS creará una capa para cada capa importada.

Archivos recientes
El menú Archivo muestra una lista de los archivos cargados o guardados más
recientemente en el submenú "Abiertos recientemente". Esta lista ofrece una forma
rápida de volver a abrir esos archivos. Esta opción te permite cambiar la cantidad de
archivos que contendrá la lista (entre 1 y 20 archivos).
472

Marco de selección de objetos

Esta opción te permite cambiar la configuración por defecto para el Marco de
selección (donde arrastras un rectángulo de selección sobre los objetos que quieres
seleccionar). Así podrás seleccionar objetos que estén tocando el rectángulo de
selección o seleccionar sólo los objetos que estén dentro del rectángulo.

Tipo de documento
Se determina el tipo de documento, como se indica en el icono de la pestaña del
documento.
• Página web: usa este tipo de documento para crear páginas y gráficos web. Este
el el tipo de documento más común con el que usa Web Designer.
• Presentación (Web): estos son documentos web especiales para hacer
presentaciones. Consulta el capítulo Presentaciones web (en la página 276)
para más información.
• Impresión: se usa para documentos creados para trabajos de impresión. Este
tipo de documento no se suele usar en Web Designer, pero otros productos de
la gama Designer sí los utilizan.
• Foto: si abres una foto JPEG en Web Designer, este es el tipo de documento. Tal
documento no tiene un área de página definida, por ejemplo. Consulta el
capítulo Manejo de fotos (en la página 318) para más información.
• Animación: usado para los documentos con animaciones. Consulta el capítulo
"Animaciones" para más detalles.

Por lo general no necesitas cambiar de tipo de documento, ya que el tipo está

establecido cuando lo creas (por ejemplo, usar una plantilla de la galería de diseños, o
escoger un documento en blanco del menú ARCHIVO >NUEVO ). Sin embargo, a veces
es útil convertir entre imprimir, documentos de página web y presentación si cambia
el propósito con el que fue creado tu documento. Puedes convertir de fotos o
documentos de animación.

Longitud de línea compatible con navegadores web

Es una pena que los diferentes navegadores visualicen el mismo texto ligeramente
diferente, por lo general con una pequeña diferencia de tamaño o longitud de línea.
Así, el texto 10 pt, por ejemplo, no se visualiza con el tamaño 10pt sino con tamaño de
píxel más próximo (13 píxeles).

MAGIX Web Designer 10 Premium se ha diseñado para emular el comportamiento

de los navegadores más comunes ajustando los tamaños intermedios a píxeles
enteros y ajustando las longitudes de línea para imitar al máximo el texto en
navegadores de Windows. Puedes desactivar este ajuste en el diálogo OPCIONES , en la
pestaña GENERAL (haz clic derecho y selecciona OPCIONES DE PÁGINA o selecciona
OPCIONES del menú HERRAMIENTAS ) desactivando la opción "LONGITUD DE LÍNEA
COMPATIBLE CON NAVEGADORES WEB ".

www.magix.es
 Personalización de Web Designer 473

Nota para usuarios avanzados: si utilizas MAGIX Web Designer 10 Premium o

desactivas esta opción de compatibilidad, cuando introduzcas un tamaño
intermedio, por ejemplo 13,6 píxeles o 10 pt, obtendrás el texto exactamente con ese
mismo tamaño. Pero te advertimos que la mayoría de los navegadores web
visualizarán este texto con un tamaño ligeramente mayor o menor al que se ve en
MAGIX Web Designer 10 Premium.

La segunda consecuencia del (mal) comportamiento de este navegador es que en el

caso de las fuentes pequeñas se produce un gran salto de un tamaño al siguiente. Es
decir, que si quieres un tamaño de fuente entre 9 píxeles y 10 píxeles, no podrás
tenerlo. La mayoría de los navegadores no puede reproducir un tamaño intermedio
(independientemente de si usas puntos, ems o cualquier otro tipo de unidad). Por lo
tanto verás cómo los tamaños de texto de MAGIX Web Designer 10 Premium saltan
de un tamaño a otro cuando cambies la dimensión de los objetos de texto.

Limitación de ángulo
Esto es aplicable para la rotación o movimiento de un objeto mientras se pulsa la tecla
Ctrl. Puedes seleccionar un valor del menú o introducir un valor en grados.

Desplazar
Esta se aplica cuando se utilizan las teclas de flecha del teclado mientras se mueve
un objeto. Este campo de texto define la distancia que el objeto se mueve cada vez
que se pulse la tecla. Si el documento utiliza unidades escaladas (por ejemplo, 1
pulgada a 1 milla) este campo de texto mostrará la distancia en la unidad escalada.

(Cuando se realiza un desplazamiento, Ctrl y  aumentan la distancia de

desplazamiento cinco y diez veces respectivamente).

Distancia duplicación
Edición > Duplicar (Ctrl+D) crea un duplicado del objeto original. Este campo de texto
te permite configurar la distancia de desplazamiento entre el original y el duplicado.
Los valores positivos crean un duplicado por arriba y a la derecha del objeto original.
Los valores negativos crean un duplicado por debajo y a la izquierda del original.
474

Pestaña Cuadrícula y regla

Espaciado de cuadrícula y regla

El ESPACIADO PRINCIPAL define la distancia entre la cuadrícula principal y las
divisiones de la regla. Las unidades utilizadas para la cuadrícula y las reglas están
definidas por las unidades que utilizas en el espaciado principal. Por ejemplo, si
introduces un espaciado principal de 2 CM. las unidades de la cuadrícula y la regla se
configurarán en centímetros sin importar la unidad de página especificada en las
opciones de unidades.

Coordinar selección
Aquí puedes cambiar la dirección de las coordinadas de la página.

www.magix.es
 Personalización de Web Designer 475

Pestaña Ratón

Función de botones de ratón

Web Designer te ofrece una gama de acciones posibles para la tecla izquierda o
derecha del ratón. Por ejemplo, si eres zurdo, es posible que quieras utilizar el botón
derecho como el botón normal. Por lo tanto, puedes asignar el clic normal a la tecla
derecha del ratón (también puedes configurar ambas teclas para la misma acción, si
así lo deseas).

Acciones posibles:
• Clic normal: al menos un botón debería tener asignado esta opción.
• +clic.
• Ctrl+clic.
• Alt+clic.
• Menú pop-up (ver más adelante).
• Cambiar a pantalla completa (descrito en Trabajar con documentos (en la
página 78)).
• Acercar o alejar el zoom +clic para alejar (descrito en Trabajar con
documentos en la página 78).
• Herramienta de DESPLAZAMIENTO (como si pulsaras +F8)

El menú pop-up contiene opciones adecuadas para el objeto sobre el que haces clic.
Por ejemplo, para la mayoría de los tipos de objetos, el menú contiene las opciones
476

CORTAR, COPIAR, PEGAR, ELIMINAR, DUPLICAR, CLONAR (descritas en el capítulo

Trabajar con objetos en la página 103).

MOVIMIENTO DE RUEDECILLA DEL RATÓN: puedes cambiar la acción de la rueda del

ratón entre desplazamiento y zoom. La primera es la opción por defecto de Web
Designer, la última logra compatibilidad con MAGIX Photo Designer 7.

Haz clic sobre RESTAURAR para regresar a las opciones de asignación de botones
originales. Esto tiene efecto inmediato, no necesitar hacer clic en ACEPTAR ni en
APLICAR AHORA .

El panel de control de Windows también te permite intercambiar los botones

izquierdo y derecho del ratón.

Radio para alineación magnética

La alineación magnética se describe en detalla en el capítulo Trabajo con objetos (en
la página 126).

Estos valores determinan la distancia a la que pueden acercarse los objetos a los
objetos magnéticos antes de alinearse automáticamente. Estas son distancias en la
pantalla y son independientes del tamaño de tu documento.

www.magix.es
 Personalización de Web Designer 477

Pestaña Tamaño de página

Si la opción "TODAS LAS PÁGINAS DEL SITIO WEB CON EL MISMO TAMAÑO" no está
seleccionada, entonces puedes asignar tamaños diferentes a tus páginas utilizando
este diálogo. Para fijar el tamaño de la página, escoge uno de los tamaños de página
suministrados en la lista desplegable o escoge "Personalizado" y luego introduce el
ancho y la altura requeridas en el campo suministrado.

Si la opción BLOQUEAR TAMAÑO DE PÁGINA está activada, no podrás cambiar el

tamaño de las páginas si arrastras el borde inferior o las esquinas derechas y
cualquier objeto de desplazamiento que se coloque fuera de la página no la ampliará.
478

Pestaña Copias de seguridad

Esta pestaña te permite activar y desactivar la función de copias de seguridad
automáticas. Esta función guarda una copia de todos los documentos abiertos
modificados en intervalos regulares. Se recomienda dejar activada esta opción para
que tu trabajo se guarde con regularidad. También puedes escoger si se te debe
advertir que no has guardado documentos al cerrar el programa o si debe guardarse
una copia de seguridad de todos estos documentos y restaurarse la próxima vez que
inicies el programa.

Consulta el capítulo Trabajar con documentos (en la página 88) para más detalles
acerca de estas funciones.

Pestaña efectos y plug-ins

Para más información sobre los efectos en tiempo real lee el capítulo Efectos en
tiempo real (en la página 355).

Plug-ins de Photoshop (solo Web Designer de 32 bits)

Un clic sobre CONFIGURAR te permite añadir y eliminar capetas de plug-ins de efectos
en vivo.

Efectos
Aquí puedes configurar la resolución por defecto de los efectos en vivo y bloqueados.

www.magix.es
 Personalización de Web Designer 479

Los nuevos efectos se bloquean por defecto

Esto bloqueará por defecto cualquier efecto en vivo que crees, de forma que no
cambiará si lo mueves o lo cambias de tamaño.

Res. de efecto en vivo por def.:

Si la resolución de un efecto en vivo está configurada en AUTOMÁTICO, entonces
cualquier efecto en vivo sobre un objeto se producirá por defecto con la resolución de
pantalla. Si deseas imprimir tu diseño puedes configurar un efecto en vivo con un DPI
mayor y todos los efectos sobre ese objeto (siempre que los otros efectos no estén
configurados como automáticos) se renderizarán automáticamente con el DPI mayor.
Por lo tanto, no será necesario modificar cada efecto. También puedes configurar una
opción por defecto diferente en esta ventana y todos los efectos en vivo se crearán
con esa resolución.

Res. efecto bloqueado por def.:

Esta es la resolución por defecto para los efectos bloqueados. Si quieres cambiar el
DPI de un objeto bloqueado necesitas volver a crear ese efecto. Ten en cuenta que
esto se aplica solamente a los efectos bloqueados y no a los efectos en vivo
bloqueados.

Barras de control
Puedes mover las barras de control de Web Designer a otros lugares de la ventana,
reordenar los botones, crear nuevas barras de control, mover o copiar botones entre
las barras de control y muchas otras operaciones.

No puedes cambiar la barra de información que depende de la herramienta ni el

contenido de las barras desplegables que se encuentran en la barra de herramienta
principal y en las barras superiores.

Modo de pantalla completa

Web Designer tiene dos configuraciones de barras de control:
• Una configuración aparece cuando la ventana tiene el tamaño normal.
• La segunda configuración aparece después de escoger Ventana > Pantalla
completa.

Cualquier cambio a la configuración de las barras de control (por ejemplo, cambio de

tamaño o desplazamiento) no tiene efecto en la otra configuración. Los cambios a
botones individuales (por ejemplo, configurar una opción) se aplican tanto al modo
normal como de pantalla completa.
480

Mostrar y ocultar barras de control

La visualización de las barras de control se modifica a través del diálogo BARRAS DE

CONTROL (VENTANA > BARRAS DE CONTROL ).

Junto al nombre de cada barra de control hay un campo. Si colocas una tilde en ese
campo, la barra de control estará visible. Haz clic sobre ese campo de la barra de
control para mostrar u ocultar la barra.

También puedes activar o desactivar las BARRAS DE CONTROL si haces clic derecho en
un área vacía de la parte superior de la ventana del programa. Utiliza el menú
desplegable para escoger las barras que deseas mostrar.

www.magix.es
 Personalización de Web Designer 481

Barras de control bloqueadas o flotantes

Normalmente, las barras de control están bloqueadas (ajustadas a los bordes de la
ventana). Al mover la ventana también se mueven las barras de control bloqueadas.

Las barras de control también pueden ser flotantes. Estas barras no siguen el
movimiento de la ventana.

Barra de control flotante Barra de control bloqueada

Puedes ocultar una barra de control flotante utilizando el diálogo de BARRAS DE

CONTROL (descrito arriba) o con un clic sobre el icono de CIERRE.

Para hacer que una barra de control sea flotante, arrástrala desde el borde de la
ventana hasta un área de edición o fuera de la ventana de Web Designer.

Para bloquear una barra de control, arrástrala sobre:

• El borde de la ventana.
• La barra de menú.
• U otra barra de control.

Una barra de control flotante presenta un contorno de doble línea al arrastrar. Esto
cambia a una línea simple cuando se encuentra en una posición bloqueada. Si quieres
que la barra de control permanezca flotante, pulsa Ctrl mientras la desplazas.

Modificación del tamaño de una barra de símbolos

Desplaza el cursor del ratón sobre el borde de la barra de símbolos hasta que se
convierte en una doble flecha. Ahora podrás arrastrar el borde para modificar el
tamaño de la barra de símbolos.

Creación de barras de símbolos

Para crear una barra de símbolos realiza lo siguiente:
• Arrastra un botón desde el área de trabajo o desde la ventana. De esta forma, se
creará una nueva barra de símbolos que contendrá el botón.
• O haz clic sobre NUEVO en el diálogo de BARRAS DE SÍMBOLOS . De esta forma
puedes crear una nueva barra de símbolos y darle un nombre. La nueva barra de
símbolos estará vacía. Ahora podrás insertar botones mediante arrastrar y
soltar.

El desplazamiento de botones se explica más adelante.

482

Eliminar las barras de control

Sólo puedes eliminar las barras de control que están vacías. Para ello, mueve
cualquier botón hasta otra barra de control. Cierra la barra de control (con un clic
sobre el icono de CIERRE o usando el diálogo de BARRAS DE CONTROL ). La barra de
control se eliminará automáticamente cuando cierres Web Designer.

Desplazar botones y herramientas

Para mover botones o herramientas:
1. Mueve el cursor hasta el botón que quieres mover.
2. Mantén pulsada "Alt" (ALT izquierdo) para mover el botón o "AltGr" (ALT
derecho) para copiar el botón cuando se utiliza en barras de control definidas de
usuario y otras barras de control. Aunque en la "paleta de botones" predefinida,
ambas teclas ALT sólo copian el botón.
3. Arrastra el botón hasta:
- Un lugar diferente sobre la misma barra de control.
- Otra barra de control.
- O hasta un área de edición o fuera de Web Designer para crear una barra de
control nueva.

No puedes mover botones desde ni hasta la barra de información.

Ocultar botones y herramientas

Mueve los botones o herramientas no deseados hasta otra barra de control y después
oculta esa barra de control (descrito anteriormente).

Si necesitas el botón o herramienta en el futuro, utiliza la ventana de BARRAS DE

CONTROL para volver a mostrar la barra de control.

No puedes eliminar los botones ni las herramientas.

www.magix.es
 Menús y shortcuts de teclado 483

Menús y shortcuts de teclado

Introducción
En muchas partes estas descripciones se refieren al objeto seleccionado. En la
mayoría de los casos, la acción descrita también es aplicable cuando se han
seleccionado varios objetos. Utilizamos la frase "objeto seleccionado" para referirnos
a uno o varios objetos seleccionados.

Muchas veces puedes seleccionar una opción de un menú, una barra de control o con
un shortcut. Si existe un botón en la barra de control y/o un shortcut, se mostrarán
detrás el nombre del menú. Por ejemplo, lo siguiente significa que hay un botón en la
barra de control ESTÁNDAR que tiene el mismo efecto que seleccionar nuevo o que
pulsar el shortcut Ctrl+N.

Nuevo (barra de control estándar o Ctrl+N)

Menú Archivo
Nuevo (barra de control estándar o Ctrl+N)
Crea un documento nuevo.

Nuevo desde el catálogo de contenido

Abre el catálogo de contenido online. Elige entre las categorías smartshapes,
plantillas, widgets y cliparts de la web del catálogo o diseño y foto.

Abrir (barra de control estándar o Ctrl+O)

Abre una nueva ventana de edición y carga un archivo. Este archivo puede ser:
• Un archivo .web de Web Designer para visualizar o editar un documento de
Web Designer existente,
• O cualquier otro de los formatos de importación (consulta Importación y
exportación (en la página 446) para ver la lista de formatos). Esto abre un
nuevo documento con un archivo.

Archivos recientes
Una lista de los archivos cargados o guardados más recientemente. Esta lista te
proporciona una forma rápida de volver a cargar cualquiera de estos archivos.

Puedes cambiar la cantidad de archivos que aparecen en esta lista. (Para más
información consulta el capítulo Personalización de Web Designer).
484

Cerrar (Ctrl+W)
Cierra la ventana de edición actual. Web Designer permanece abierto. Se te advertirá
si no has guardado cambios.

Guardar (barra de control estándar o Ctrl+S)

Guarda el documento seleccionado.

Guardar como
Te permite guardar el documento seleccionado con otro nombre o en un directorio o
unidad diferente.

Guardar todo
Guarda todos los documentos abiertos.

Guardar plantilla
Guarda el documento seleccionado como una plantilla de documento. (Consulta el
capítulo Personalización de Web Designer en la página 469).

Importar (Ctrl+Shift+I)
Carga un archivo en el documento seleccionado. El archivo puede ser cualquiera de
los formatos de importación. (Lee el capítulo Importación y exportación (en la página
446) para más información).

Ten en cuenta la diferencia entre ABRIR e IMPORTAR . Ambas opciones cargan una
variedad de formatos de documento pero ABRIR los abre en un nuevo documento;
mientras que IMPORTAR carga el archivo en el documento ya abierto.

Importar desde la dirección web (Ctrl+Alt+W)

Importar textos y gráficos directamente desde páginas web de Internet hasta tu
documento. Introduce la URL (dirección web) de la página web que desees para
importar al cuadro de diálogo.

Exportar (Ctrl+Shift+E)
O haz clic derecho y escoge EXPORTAR .

Te permite exportar el documento en una gran variedad de formatos de exportación

compatibles con Web Designer (consulta Importación y exportación (en la página
446) para la lista de formatos).

www.magix.es
 Menús y shortcuts de teclado 485

Exportar JPEG
También disponible en la barra de herramientas de
exportación. O haz clic derecho y escoge Exportar JPEG.

Te permite exportar los objetos seleccionados, una página o todo el documento como
JPEG.

Exportar PNG
Te permite exportar los objetos seleccionados, una página o todo el documento como
PNG.

Vista previa de la página web (F12)

Exporta y ofrece una vista previa de la página actual del documento de sitio web.

También puedes hacer una vista previa de tu página con un clic en el botón de
vista previa de página en la barra de herramientas web.

Haz clic en un tipo de navegador en la parte superior de la ventana de vista previa

para ver la página en tu navegador preferido.

Muestra la vista previa de tu página en Google Chrome

Muestra la vista previa de tu página en Mozilla Firefox

Muestra la vista previa de tu página en Internet Explorer

Muestra la vista previa de tu página en Opera

Muestra la vista previa de tu página en Safari

Visualizar página web

Exporta el documento de página web actual y realiza una vista previa. El documento
es exportado a la misma ubicación a la que fue exportada por última vez
(sobrescribiendo los archivos necesarios sin sugerir) o a una ubicación temporal si la
página no ha sido exportada todavía. A continuación aparece una ventana de
navegador mostrando la primera página de la página web.

Esta es la forma más rápida de realizar una vista previa de tu página cuando
trabajas en ella. También puedes realizar una vista previa haciendo clic en el
botón en la barra de herramientas de web.
486

Exportar página web

También disponible en la barra de herramientas de
exportación.

Exportar el documento actual como HTML.

Publicar página web

Se realiza la misma operación que con el botón en la barra de herramientas
de web. Exporta y luego publica el documento de página web actual a tu
página web.

Si todavía no has introducido los detalles FTP para tu espacio web, la pestaña
PUBLICAR en el diálogo de PROPIEDADES WEB se visualizará primero. A continuación la
página web se publica en tu espacio web. Un indicador de progreso aparece durante
la operación de publicación. Consulta el capítulo Primeros pasos para más detalles
sobre la publicación.

Vista previa de documentos web

Te ofrece una vista previa del documento de impresión actual como página web.

También puedes hacer una vista previa de tu página con un clic en el botón de
vista previa de página en la barra de herramientas web.

Haz clic en un tipo de navegador en la parte superior de la ventana de vista previa

para ver la página en tu navegador preferido.
Muestra la vista previa de tu página en Google Chrome

Muestra la vista previa de tu página en Mozilla Firefox

Muestra la vista previa de tu página en Internet Explorer

Muestra la vista previa de tu página en Opera

Muestra la vista previa de tu página en Safari

Exportar Página web

Exporta el documento de impresión actual como página web HTML. Lee Publicación
de documentos web HTML (en la página 453) para más información.

www.magix.es
 Menús y shortcuts de teclado 487

Publicación de documento web

Exporta y luego publica el documento de impresión actual como página web HTML
en tu espacio web. Si todavía no has introducido la información de FTP para tu
espacio web, se te solicitará que lo hagas. Luego podrás publicar el documento web
en tu espacio web. Un indicador de progreso aparece durante la operación de
publicación.

Vista previa flash

Esta opción sólo se activa cuando el documento actual es un documento de
animación. Esto exporta tu animación como flash y abre una ventana popup mos-
trando tu animación flash reproduciéndose. La ventana también incluye información
básica sobre tu animación flash, como por ejemplo el tamaño del archivo flash.

El botón en la barra de herramientas es una forma más rápida de invocar esta

operación.

Exportar animación
También disponible en la barra de herramientas de animación debajo de la
barra de herramientas estándar en un documento de animación.

Exporta una animación para utilizarla en una página web.

Información de documento
Esta opción muestra la ventana de información sobre el documento seleccionado, que
incluye las fuentes y plug-ins de efectos en vivo utilizados en el documento actual.

Opciones de página
También puedes hacer clic derecho y escoger OPCIONES DE PÁGINA . Te permite editar
el diseño de la página, su tamaño, etc.

Configuración de impresora
Establece las opciones relacionadas con la impresora o el archivo de impresión actual.
(Para más información, lee el capítulo Impresión en la página 462).

Opciones de impresión
Modifica las opciones de la impresión, incluyendo la orientación y el tamaño de
impresión. (Para más información, lee el capítulo Impresión en la página 462).
488

Imprimir (Ctrl+P)
Configura las opciones relacionadas con la impresión del documento y te permite
imprimirlo. (Para más información, lee el capítulo Impresión en la página 462).

Cerrar
Cierra todas las ventanas y borra Web Designer de la memoria de trabajo. Se te
advertirá si hay cambios sin guardar.

Menú Edición
Deshacer (barra de control estándar o Ctrl+Z)
Deshace la operación anterior. Lo que aparece escrito en esta opción refleja la última
operación realizada. Por ejemplo DESHACER CORTAR . (Lee el capítulo Deshacer y
rehacer en la página 102).

Rehacer (barra de control estándar o Ctrl+Y)

Cancela la última opción DESHACER . Lo que aparece escrito en esta opción refleja la
última operación DESHACER realizada.

Cortar (barra de control edición o Ctrl+X)

Corta el objeto seleccionado al portapapeles. Lo que aparece escrito en esta opción
refleja el tipo de objeto seleccionado. (Lee el capítulo Trabajar con objetos (en la
página 108)).

Copiar (barra de control edición o Ctrl+C)

Copia el objeto seleccionado en el portapapeles. Lo que aparece escrito en esta
opción refleja el tipo de objeto seleccionado. El objeto permanece en el lugar del
documento. (Lee el capítulo Trabajar con objetos (en la página 108)).

Pegar (barra de control edición o Ctrl+V)

O haz clic derecho y escoge PEGAR .

Pega el contenido del portapapeles en el documento seleccionado. Lo que aparece

escrito en esta opción refleja el contenido del portapapeles (consulta Manejo de
objetos (en la página 108)).

A veces, cuando pegas el contenido del portapapeles en un documento, puede

insertarse en diversos formatos. Si esto es el caso, aparecerá el diálogo PEGADO
ESPECIAL para que puedas escoger un formato.

www.magix.es
 Menús y shortcuts de teclado 489

Pegar texto sin formato

Pega el texto del portapapeles en el documento sin formato.

Pegar en lugar
Es igual a PEGAR , excepto que el objeto se pegará en la misma posición de donde lo
has copiado. Esto es útil para mover objetos de una capa a otra sin cambiar su
posición X/Y. Sin embargo, ten en cuenta que si el objeto seleccionado es un pie de
página (es decir, que siempre guarda la misma distancia de la parte inferior de la
página aun al cambiar el tamaño de la página) entonces, al pegarlo, se posicionará
respecto a la parte inferior de la página. En general, así quieres que se comporten los
objetos de pie de página.

Pegar formato/atributos
Conserva el formato (p. ej. el tipo y tamaño de fuente) o los atributos de estilo (p. ej.,
el color de la línea y del relleno) del objeto que se pega.

Pegar posición
Esta opción aplica la posición de un objeto copiado en el portapapeles a un objeto
seleccionado actualmente, que se mueve a exactamente la misma posición que el
objeto copiado.

Si se han copiado múltiples elementos en el portapapeles, Web Designer los trata

como a un grupo y mueve al objeto actual seleccionado a la posición del grupo
copiado como un todo.

El objeto seleccionado actualmente se pega o se mueve a la posición central del

objeto copiado o al grupo de objetos.

Pegar tamaño
Esta opción aplica el tamaño de un objeto copiado en el portapapeles a un objeto
seleccionado actualmente, cuyo centro cambia de tamaño para ser igual al del objeto
copiado.

Si se han copiado múltiples elementos en el portapapeles, Web Designer los trata

como a un grupo y cambia el tamaño del objeto actual seleccionado al tamaño del
grupo copiado como un todo.

Pegar reemplazo de selección

Esto es similar a PEGAR POSICIÓN , solo que el objeto copiado en el portapapeles
reemplaza al objeto seleccionado actualmente y mantiene la posición del elemento
borrado. El objeto copiado se pega en la posición central del objeto borrado.
490

Pegar en la capa actual

Igual que PEGAR EN LUGAR , pero el objeto se pegará solamente en la capa actual. Esto
es útil si quieres ver u ocultar el objeto pegado cuando se muestran capas encima o
debajo.

Pegar en el lugar de la capa actual

Igual a PEGAR EN LA CAPA ACTUAL , pero el objeto se pegará en la capa actual en la
misma posición desde la que lo has copiado.

Eliminar (“Edición“- Barra de símbolos y barra de símbolos

estándar o “Supr”)
Borra el objeto marcado. El texto de esta opción corresponde al objeto seleccionado.
Lee el capítulo: El trabajo con objetos (en la página 103).

Seleccionar todo (Ctrl+A)

Selecciona todos los objetos de las capas editables. (Las capas editables y bloqueadas
están descritas en el capítulo Capas (en la página 407).

Eliminar selección/Restaurar atributos actuales (Esc)

Deselecciona todos los objetos. Si nada está seleccionado, los atributos actuales (en
la página 57) vuelven a sus valores por defecto. Puedes ejecutar esta opción si
presionas ESC dos veces.

Duplicar (barra de control edición o Ctrl+Alt+D)

Or haz clic derecho y escoge DUPLICAR .

Copia el objeto seleccionado y coloca la copia un poco desplazada del original. La

copia se convierte en el objeto seleccionado. La distancia de desplazamiento puede
personalizarse (consulta Personalización de Web Designer (en la página 473).

Clonar (Ctrl+K)
Al igual que DUPLICAR , copia el objeto seleccionado pero coloca la copia directamente
arriba del original. La copia se convierte en el objeto seleccionado.

Páginas
O haz clic derecho y escoge PÁGINAS . El submenú Páginas te permite añadir o quitar
páginas de tu documento multipágina, duplicar la página actual o mover la página
actual más arriba o abajo del documento. Para más información sobre documentos
multipágina consulta Documentos multipágina (en la página 82).

www.magix.es
 Menús y shortcuts de teclado 491

Menú Arreglo
Mover a la capa al frente (barra de control arreglo o
Ctrl+Shift+U)
O clic derecho y escoge ARREGLO > MOVER A LA CAPA DE ADELANTE .

Mueve el objeto seleccionado una capa hacia el frente. El objeto se convierte en el

objeto de fondo de la nueva capa. En un documento con animación, esta opción es
MOVER AL PRÓXIMO FRAME .

Traer al frente (barra de control arreglo o Ctrl+F)

O haz clic derecho y escoge ARREGLO > AL FRENTE.

Mueve el objeto seleccionado hasta el frente de los otros objetos sobre la misma
capa. Consulta Manejo de objetos (en la página 103) para más información.

Mover adelante (barra de control arreglo o Ctrl+Shift+F)

O haz clic derecho y escoge ARREGLO > MOVER HACIA ADELANTE .

Mueve el objeto seleccionado un paso hacia el frente consulta Manejo de objetos (en
la página 103).

Mover atrás (barra de control arreglo o Ctrl+Shift+B)

O haz clic derecho y escoge ARREGLO > MOVER HACIA ATRÁS .

Mueve el objeto seleccionado un paso hacia atrás (consulta Manejo de objetos).

Llevar atrás (barra de control arreglo o Ctrl+B)

O haz clic derecho y escoge ARREGLO > LLEVAR ATRÁS .

Mueve el objeto seleccionado detrás de los otros objetos sobre la misma capa
(consulta Manejo de objetos (en la página 103).

Mover a la capa de atrás (barra de control arreglo o

Ctrl+Shift+D)
O clic derecho y escoge ARREGLO > MOVER A LA CAPA DE ATRÁS .

Mueve el objeto seleccionado una capa hacia atrás. El objeto se convierte en el objeto
de primer plano de la nueva capa. En un documento con animación, esta opción es
MOVER AL FRAME ANTERIOR .
492

Agrupar (barra de control arreglo o Ctrl+G)

O haz clic derecho y escoge AGRUPAR . Agrupa los objetos seleccionados para
manejarlos como un solo objeto (consulta Manejo de objetos (en la página 103).

Desagrupar (barra de control arreglo o Ctrl+U)

O haz clic derecho y escoge DESAGRUPAR.

Separa el grupo o los grupos en objetos individuales. Esta opción no está disponible,
salvo que se haya seleccionado un grupo. O cuando haya al menos un grupo dentro
de los objetos seleccionados.

Aplicar grupo suave (Ctrl+Alt+G)

O haz clic derecho y escoge APLICAR GRUPO SUAVE .

Haz que los objetos seleccionados formen un grupo suave. A diferencia de los grupos,
los grupos suaves pueden incluir objetos en diferentes capas. Consulta Manejo de
objetos (en la página 130) para detalles.

Borrar grupo suave (Ctrl+Alt+U)

O haz clic derecho y escoge BORRAR GRUPO SUAVE .

Separa el grupo suave seleccionado de modo que los objetos puedan seleccionarse
por separado de nuevo.

Aplanar grupo de fotos

Convierte un grupo de fotos en un mapa de bits individual

Alineación (Ctrl+Shift+L)
O haz clic derecho y escoge ALINEAR .

Se utiliza para alinear varios objetos. No tiene efecto si se ha seleccionado un solo

objeto (consulta Manejo de objetos (en la página 131) para más información).

Combinar formas (barra de control arreglo)

El submenú de combinar formas te permite:
• Añadir formas.
• Sustraer la forma superior de las inferiores.
• Descartar partes de otras formas no cubiertas por la forma superior.
• Utilizar la forma superior para cortar las otras formas.

www.magix.es
 Menús y shortcuts de teclado 493

Sólo las formas seleccionadas se combinarán. Las formas sin seleccionar no se

modificarán. (Para más información, lee el capítulo Trabajar con formas (en la página
171).

Crear copia de mapa de bits (Ctrl+Shift+C)

CREAR COPIA DE MAPA DE BITS crea una versión en mapa de bits (en la página 341) de
los objetos seleccionados

Adaptar texto a la curva/Eliminar texto de la curva

O haz clic derecho y escoge ADAPTAR TEXTO A LA CURVA/ELIMINAR TEXTO DE LA
CURVA .

Te permite adaptar una línea de texto a una curva arbitraria o desvincular el texto de
una curva (consulta Manejo de texto para más información).

Contorneo y anclaje
O haz clic y selecciona CONTORNEAR TEXTO , ANCLAR TEXTO o CONTORNEAR Y ANCLAR .

Haz que el objeto haga que el texto fluya a su alrededor o que se fije dentro de una
columna. Consulta Contornear objeto con texto (en la página 212) y Gráficos
anclados (en la página 214) para más detalles

Crear barra de navegación

Esta función te permite crear una barra de navegación a partir de un único botón.
Encontrarás más información en el capítulo BARRAS DE NAVEGACIÓN (en la página
372).

Repetir en todas las páginas (Shift+Ctrl+Alt+R)

O haz clic y escoge REPETIR EN TODAS LAS PÁGINAS .

El objeto seleccionado se copiará en el mismo lugar en todas las páginas. La función

creará automáticamente el nombre Repeating:AutoRepeat y se aplicará a todas las
copias, a partir de allí se actualizará cada vez que selecciones ACTUALIZAR OBJETOS
REPETIDOS .

Detener actualización (Shift+Ctrl+Alt+O)

O haz clic derecho y escoge DETENER ACTUALIZACIÓN .

La función ARREGLO > DETENER ACTUALIZACIÓN te permite desactivar la naturaleza de

repetición de un objeto o en todas las copias de ese objeto en tu sitio web.

Obtén más información en el capítulo Manejo de objetos (en la página 139).

494

Menú Insertar
Del catálogo de contenidos
Abre el catálogo de contenidos online. Elige entre las categorías plantillas, widgets y
cliparts de la web del catálogo o diseño y foto.

Imagen
• Del archivo: examina tu PC para cargar un archivo de imagen en el documento
seleccionado.
• De direcciones web: extrae todas las imágenes desde una página web específica.
(Ctrl+Alt+W)
• Captura de pantalla: abre la herramienta de captura de pantalla.
• Desde la cámara: detecta una cámara web u otro dispositivo de captura de vídeo
asociado a Windows agregado a tu PC e inserta una imagen inmóvil en tu
documento.

Forma
• Rectángulo: inserta un rectángulo en el documento actual (Shift+Ctrl+Alt+E)
• Elipse: inserta una elipse en el documento actual (Shift+Ctrl+Alt+E)
• Más formas: abre la sección "Otras formas" de Smartshapes en el catálogo de
contenido online
• Flechas: abre el área de flechas de Smartshapes en el catálogo de contenido
online
• Panel de texto: inserta un panel de texto en un documento actual (Shift+C)
• Más paneles de texto: abre la sección de paneles de texto del catálogo de
contenido online
• Globo de diálogo: inserta un globo de diálogo en el documento actual

Consulta Manejo de formas para más información.

Campo de texto
Inserta un campo de texto en el documento actual.

Número de página
Inserta un número de página en la posición del cursor al usar la HERRAMIENTA DE
TEXTO . Ver Añadir números de página para más información.

Nueva página
• Nueva página en blanco: inserta una nueva página en blanco en el documento
detrás de la página seleccionada actual.
• Duplicar página: inserta un duplicado de la página en el documento detrás de la
página actual seleccionada.
• Del catálogo de contenidos: abre el catálogo de contenidos online.
www.magix.es
 Menús y shortcuts de teclado 495

Menú Herramientas
Galerías
Páginas y galerías (barra de control galerías o "F10")
Muestra u oculta la GALERÍA DE PÁGINAS Y CAPAS. Solo utilizada en documentos no
animados , ver Capas (en la página 407).

Galería de mapas de bits (barra de control de galerías o "F11")

Muestra u oculta la GALERÍA DE MAPAS DE BITS , ver Manejo de mapas de bits (en la
página 324).

Galería de líneas (barra de control de galerías o "Ctrl + F9")

Muestra u oculta la GALERÍA DE LÍNEAS , ver Dibujo de líneas (en la página 161).

Galería de diseños (barra de control de galerías o "+ F10")

Muestra u oculta la GALERÍA DE DISEÑOS , ver Importación y exportación (en la página
446).

Galería de rellenos (barra de control de galerías o "+ F11")

Muestra u oculta la GALERÍA DE RELLENOS , ver Manejo de mapas de bits (en la página
318).

Galería de frames (barra de control de galerías o "+ F12")

Muestra u oculta la GALERÍA DE FRAMES . Solo utilizado en documentos animados , ver
Gráficos web (en la página 418).

Editor de color (Ctrl+E)

O haz clic derecho y escoge COLOR DE RELLENO. Abre el EDITOR DE COLOR (consulta
Manejo de colores en la página 178).

Nombres
O haz clic derecho y escoge NOMBRES . Abre el diálogo Aplicar/Eliminar nombres (en
la página 135).

Propiedades web (Ctrl+Shift+W)

O haz clic derecho y escoge PROPIEDADES WEB . Abre el diálogo PROPIEDADES WEB ,
que te permite agregar elementos web, como enlaces, capas popup, anclajes, etc., a
tu documento de página web. Además puedes controlar cómo se exportan las
496

imágenes para la página web y configurar otras propiedades web más utilizando este
diálogo. Consulta Primeros pasos (en la página 23) para más detalles.

Variantes de página web

• COMPARTIR CON TODAS LAS VARIANTES: permite compartir el objeto
seleccionado con todas las variantes. Si el objeto no se puede compartir,
entonces hay una opción para crear una copia no compartible del objeto en las
otras variantes.
• BORRAR DE TODAS LAS VARIANTES: borra el objeto de todas las variantes.
• DEJAR DE COMPARTIR CON LAS VARIANTES: deja de compartir el objeto
seleccionado con todas las variantes.
• COPIAR PÁGINA A TODAS LAS VARIANTES: copia la página seleccionada a todas las
variantes.
• VARIANTES DE PÁGINA WEB: abre el diálogo Variantes de página web (en la
página 295).

Optimizar foto
O haz clic derecho y escoge OPTIMIZAR FOTO . Optimizar resolución del mapa de bits
para utilizar tus diseños con MAGIX Web Designer 10 Premium. Ver Optimización de
fotos (en la página 338) para más detalles.

Optimización de todas las imágenes

Optimización de todas las fotos y mapas de bits en el diseño. Lee Optimización de
fotos (en la página 338).

Animación
Este menú sólo está disponible en los documentos con animación y ofrece tres
opciones:
• PROPIEDADES DE LA ANIMACIÓN : en este diálogo puedes cambiar las opciones
para la animación y para cada frame.
• VISTA PREVIA DE TODOS LOS FRAMES : Utiliza esto para realizar una vista previa de
todos los frames de tu animación. Esto no es muy útil para animaciones flash
porque sólo muestra los frames clave sin transiciones (tweening).
• VISTA PREVIA DE ANIMACIÓN GIF EN EL NAVEGADOR : al escoger esto se creará un
archivo GIF animado a partir de los frames de tu documento y se abrirá en tu
navegador web para que veas el resultado. Hay un botón en la barra de
animación para un acceso rápido a esta operación.
• VISTA PREVIA DE ANIMACIÓN FLASH EN EL EXPLORADOR: Abrirá una ventana donde
se reproduce tu animación como flash, tal como aparecerá en un navegador web
cuando la exportes. Utiliza esto para realizar vistas previas de animaciones flash.
Hay un botón en la barra de animación para un acceso rápido a esta operación.

www.magix.es
 Menús y shortcuts de teclado 497

Revisar ortografía mientras se escribe

Esta opción activa el CORRECTOR DE ORTOGRAFÍA (en la página 206) en la
herramienta de texto.

Opciones (Ctrl+Shift+O)
O clic derecho y OPCIONES DE PÁGINA.

Abre el diálogo OPCIONES (descrito en Personalización de Web Designer).

Menú Compartir
El menú compartir incluye diversas opciones para compartir la imagen seleccionada
actualmente con los servicios MAGIX y otros servicios de terceros. Por ejemplo,
puedes seleccionar una foto de tu página y enviarla rápidamente al MAGIX Álbum
Online, a Facebook o a Flickr. Por lo tanto, si has instalado otros programas MAGIX
compatibles, también puedes enviar las imágenes a ellos. Por ejemplo, puedes
enviarla a MAGIX Video deluxe Pro MX para incluir la imagen en una película.

Publicar online: carga de objetos a Facebook

Envío de la selección a Facebook. Aparecerá un diálogo que te permitirá especificar, si
lo deseas, un nombre de archivo, una descripción, las palabras clave de búsqueda
para tu imagen y si debe ser pública o privada. Haz clic en el botón CARGA para
continuar y aparecerá una ventana de inicio de sesión. Si ya tienes una cuenta en
Facebook, introduce la información, de lo contrario, haz clic en Registrarse para unirte
a Facebook. Si vas a cargar muchas imágenes, selecciona el campo para no cerrar
sesión, de forma que no tengas que volver a iniciar sesión cada vez que quieras cargar
una imagen. Haz clic en el botón de inicio de sesión para que tu imagen se exporte y
cargue; luego se abrirá una ventana de navegador que te permitirá acceder a tu
Facebook.

Publicar online: carga de objetos a Flickr

Envío de la selección a Flickr. El proceso es similar al que se ha descrito anteriormente
para Facebook, excepto que debes iniciar sesión con tu información de cuenta de
Flickr.

Publicar online: MAGIX Álbum Online

ENVIAR OBJETOS SELECCIONADOS
Envía la selección a MAGIX para incluirla en un álbum online nuevo o existente. Inicia
sesión con la información de tu cuenta de MAGIX Mundo Online. Puedes optar por
que los datos de inicio de sesión se guarden en tu equipo para que no tengas que
iniciar sesión nuevamente en el futuro.
498

ABRIR ÁLBUM ONLINE

Esto abre una nueva ventana de navegador web para que puedas ver tus álbumes.

MEDIA MANAGER ONLINE

Abre el Media Manager Online en una ventana para que puedas ver las fotos
incluidas en tus álbumes.

ADMINISTRAR DATOS DE INICIO DE SESIÓN

Si has seleccionado guardar tus datos de inicio de sesión de MAGIX Mundo Online en
tu equipo, esta opción te permite cambiarlos o eliminarlos si no quieres dejarlos
guardados, con solo pulsar el botón de eliminación.

Publicar online: publicar un sitio web

Esto inicia una operación de publicación del documento actual, la misma operación
disponible a través del menú Archivo y de la barra de herramientas web.

Publicar online: espacio web libre y más

Esta opción abrirá un navegador web en una página que te informará sobre los
servicios de alojamiento web gratis de MAGIX disponibles y otra información
relacionada.

Envío de imágenes a otras aplicaciones de MAGIX

instaladas
Si tu equipo tiene instaladas otras aplicaciones MAGIX compatibles, el menú
compartir incluirá opciones para enviar la imagen seleccionada a esas aplicaciones.
Por ejemplo, si tienes instalado Video deluxe Pro MX, el menú incluirá una opción
"Añadir objetos a vídeo" que te permitirá enviar la selección a esa aplicación para
incluirla en una película.

Menú Ventana
Eliminar selección/Restaurar atributos actuales (Esc)
Deselecciona todos los objetos. Si nada está seleccionado, los atributos actuales (en
la página 57) vuelven a sus valores por defecto. Puedes ejecutar esta opción si
presionas ESC dos veces.

Vista multipágina
O haz clic derecho y escoge VISTA MULTIPÁGINA.

Por defecto, Web Designer muestra solamente la página actual del del documento
abierto en el momento. Si escoges la vista multipágina, verás todas las páginas en tu
documento.

www.magix.es
 Menús y shortcuts de teclado 499

Arreglar ventanas
Ordena todas las ventanas de Web Designer como mosaico.

Animación
En un documento de animación, activará la barra de herramientas Animación.

Nueva ventana
Abre una nueva ventana en el documento seleccionado.

Mostrar barras de desplazamiento

Muestra las barras de desplazamiento de los lados y de la parte inferior de la ventana
de Web Designer.

Mostrar reglas (Ctrl + L)

O clic derecho y MOSTRAR CUADRÍCULA/GUÍAS > MOSTRAR REGLAS. Muestra las reglas
de los lados y de la parte superior de la ventana de Web Designer.

Barras de control
Muestra el diálogo de BARRAS DE CONTROL . Descrito en el capítulo Personalización de
Web Designer (en la página 479).

Calidad (barra de control estándar)

Selecciona la forma en que los objetos se visualizan, desde contorno hasta
antialiasing. (Consulta el capítulo Trabajar con documentos).

Ver pestañas de los documentos

Muestra las pestañas de los documentos que te proveen rápido acceso a los
documentos abiertos en la parte superior de la ventana de Web Designer. Un clic
sobre una pestaña selecciona el documento correspondiente. Un * tras el nombre del
documento señala que no se han guardado cambios de ese documento.

Pantalla completa (8 del teclado numérico)

Cambia entre el modo de pantalla completa y de pantalla normal.

Mostrar cuadrícula (#)

O clic derecho y MOSTRAR CUADRÍCULA/GUÍAS > MOSTRAR CUADRÍCULA.

Muestra la cuadrícula de pantalla (consulta Manejo de documentos en la página 91).

500

Mostrar guías (1 del teclado numérico)

O clic derecho y MOSTRAR CUADRÍCULA/GUÍAS > MOSTRAR GUÍAS.

Muestra u oculta la capa de guías que contiene todas las líneas guía y objetos guía.

Ajustar a cuadrícula (. del teclado numérico)

O clic derecho y AJUSTAR A > AJUSTAR A CUADRÍCULA.

Con esta opción configurada, un objeto se ajustará al punto de cuadrícula cercano al

que se lo arrastre. Consulta Manejo de documentos (en la página 126).

Ajustar a guías (2 del teclado numérico)

O clic derecho y AJUSTAR A > AJUSTAR A GUÍAS .

Con esta opción configurada, un objeto se ajustará a cualquier guía cercana a la que
se lo arrastre (consulta Manejo de objetos (en la página 126) ).

Ajustar a objetos (* del teclado numérico)

O clic derecho y AJUSTAR A > AJUSTAR A OBJETOS .

Con esta opción seleccionada, arrastrar un control deslizante cerca de otro objeto
ajusta el control al objeto (consulta Manejo de objetos (en la página 126) para más
información). Puedes ajustar la distancia de ajuste. Para más información, lee
Personalización de Web Designer.

Documentos abiertos
Una lista de todos los documentos abiertos actualmente. Un clic sobre un nombre
selecciona el documento correspondiente. (Ctrl+F6 también cambia entre los
documentos.) Un * tras el nombre del documento señala que no se han guardado
cambios de ese documento.

www.magix.es
 Menús y shortcuts de teclado 501

Menú Ayuda
Ayuda de MAGIX Web Designer 10 Premium
Utiliza la opción "Temas de ayuda" del menú "Ayuda" para abrir una página de inicio
de la ayuda del programa. Aquí puedes leer la ayuda paso a paso o escoger una
sección específica a través de la estructura de árbol de la derecha.

Ayuda
Esta opción está disponible en casi todos los lugares del programa y abre la ayuda del
programa en el tema correspondiente. Utiliza esta función para obtener ayuda sobre
cualquier función de MAGIX Web Designer 10 Premium.

Shortcut: F1

Películas
Abre una página web que contiene vídeos tutoriales acerca de la utilización de Web
Designer.

Más Web Designer

Este menú contiene enlaces de internet útiles para la página web de Xara y recursos
online útiles.

Consejo del día

Ver el consejo del día. En la ventana del consejo del día hay un recuadro en el que
puedes seleccionar si quieres ver o no un consejo cada vez que inicias Web Designer.

Actualizar programa
Esto comprueba de forma online si hay actualizaciones de programas disponibles.

En primer lugar aparecerá una pantalla que te comunica si hay una nueva versión
principal de Web Designer para actualizar. Luego, si has registrado el programa con
Xara, se iniciará un proceso automático de actualización que comprobará si hay
disponibles actualizaciones de programa gratuitas. Si hay una actualización
disponible, se descargará automáticamente y luego se cierra MAGIX Web Designer
10 Premium y se instala la actualización. El programa luego se reinicia
automáticamente para ti.'

Utiliza la opción REGISTRARME en el menú AYUDA para registrar el programa con Xara.
502

Popups informativos
Te permite mostrar consejos de herramienta que, contienen información popup,
cuando pasas el cursor sobre barras de herramientas, botones, la línea de colores y
otros elementos de la ventana de Web Designer.

Acerca de MAGIX Web Designer 10 Premium

Se verá información sobre el Copyright y el número de la versión de MAGIX Web
Designer 10 Premium.

Registrarme
Utiliza esta opción para registrar online en Xara tu adquisición para que puedas
obtener actualizaciones de programa gratuitas, descuentos en actualizaciones, ofertas
especiales y otros beneficios.

www.magix.es
 Menús y shortcuts de teclado 503

Shortcuts de teclado
Las herramientas
Herramienta de selección F2 o V o Alt + S
Herramienta Máscara a mano alzada Alt + F4
Herramienta Máscara de rectángulo Alt + F5
Herramienta de edición de forma F4
Herramienta de rectángulo  + F3 o M
Herramienta de elipse  + F4 o L
Herramienta de texto F8 o T
Herramienta de relleno G
Herramienta de transparencia F6
Herramienta de sombra Ctrl + F2
Herramienta de foto P
Herramienta de desplazamiento  + F8 o H o Alt + X (o barra espaciadora
si no está en la herramienta de texto)
Herramienta de zoom  + F7 o Z o Alt + Z

Las galerías
Galería de diseños  + F10
Galería de rellenos  + F11
Galería de frames  + F12
Galería de páginas y capas F10
Galería de mapa de bits F11
Galería de líneas Ctrl + F9

Zoom
Zoom previo Ctrl + R
Zoom a selección Ctrl +  + Z
Zoom a dibujo Ctrl +  + J
Zoom a página Ctrl +  + P
Ampliar (zoom in) Ctrl + + del teclado numérico
Alejar (zoom out) Ctrl+ - del teclado numérico
504

Zoom al 100% 1
Zoom al 200% 2
Zoom al 300% 3
Zoom al 400% 4
Zoom al 50% 5

También puedes ampliar/alejar y desplazar el documento utilizando la rueda del ratón

(Ctrl+Rueda amplia/aleja).

Manipulación de documentos
En la herramienta de texto, los shortcuts señalados con el asterisco (*) tienen una
acción diferente. Lee a continuación.

Nuevo documento Ctrl + N

Nuevo documento animado Ctrl +  + N
Abrir documento Ctrl + O
Cerrar documento Ctrl + W
Cambiar documento Ctrl + Tab
Imprimir documento Ctrl + P
Guardar documento Ctrl + S
Importar Ctrl +  +I
Importar gráficos de la web Ctrl + Alt + W *
Exportar Ctrl +  + E
Calcular tiempo de redibujo Ctrl +  + T
Mostrar cuadrícula #
Mostrar guías 1 del teclado numérico
Ajustar a cuadrícula . del teclado numérico
Ajustar a guías 2 del teclado numérico
Ajustar a objetos * del teclado numérico
Seleccionar pantalla completa 8 del teclado numérico
Mostrar reglas Ctrl +  + R
Deshacer Ctrl + Z o < o ,
Rehacer Ctrl + Y o > o .

www.magix.es
 Menús y shortcuts de teclado 505

Manipulación de objetos
En la herramienta de texto, los shortcuts señalados con el asterisco (*) tienen una
acción diferente. Lee a continuación.

Seleccionar todo Ctrl + A *

Seleccionar próximo objeto Tab
Eliminar la selección Supr *
Borrar selección Esc
Traer objeto al frente Ctrl + F
Llevar objeto al fondo Ctrl + B *
Mover objeto hacia adelante Ctrl +  + F
Mover objeto hacia atrás Ctrl +  + B
Mover objeto a la capa de adelante Ctrl +  + U
(documentos de dibujo)
Mover objeto a la capa de atrás Ctrl +  + D
(documentos de dibujo)
Mover al próximo frame (documentos de Ctrl +  + U
animación)
Mover al frame anterior (documentos de Ctrl +  + D
animación)
Agrupar objetos Ctrl + G
Desagrupar objetos Ctrl + U
Clonar objeto Ctrl + K
Duplicar objeto con offset Ctrl + D
Copiar objeto al portapapeles Ctrl + C
Cortar la selección y copiar en el Ctrl + X
portapapeles
Pegar objeto del portapapeles Ctrl + V
Pegar objeto en la posición original Ctrl +  + V
Pegar formato/atributos Ctrl +  + A
Crear copia de mapa de bits Ctrl +  + C
Añadir formas Ctrl + 1
Sustraer formas Ctrl + 2
Formas de intersección Ctrl + 3
506

Segmentar formas Ctrl + 4

Abrir el diálogo de alineación Ctrl +  + L*
Dirección web Ctrl +  + W

Mover los objetos seleccionados: teclas de flecha con la HERRAMIENTA DE SELECCIÓN

(consulta Desplazar objetos en la página 108) Mover los controles deslizantes
seleccionados: teclas de flecha en otras herramientas diferentes a la herramienta de
selección.

Herramienta de texto
Teclas de navegación Mueven el cursor de texto hacia arriba,
abajo, izquierda o derecha
un carácter por vez.
Inicio Mueve el cursor de texto al inicio de la
línea.
Fin Mueve el cursor de texto al final de la
línea.
Ctrl + flecha izquierda/derecha. Mueve el cursor de texto una palabra
hacia la izquierda/derecha.
Ctrl + Inicio Mueve el cursor de texto al inicio de la
primera línea en un objeto de texto.
Ctrl + Fin Mueve el cursor de texto al final de la
última línea en un objeto de texto.
Ctrl + A Selecciona todos los caracteres en un
objeto de texto.
Ctrl + B Aplica negrita.
Ctrl + I Aplica cursiva.
Ctrl + C Copia la región de texto seleccionado en
el portapapeles.
Ctrl + L Selecciona todos los caracteres de la línea
que contiene el cursor de texto.
Ctrl + Intro Inserta salto de página
Ctrl +  + Intro Inserta salto de columna
Ctrl +  + L Inserta el texto de ejemplo 'Lorem ipsum'
Ctrl + V Pega el texto en la posición del cursor de
texto (si el portapapeles contiene texto).
Ctrl + W Intercambia la mayúscula y minúscula del

www.magix.es
 Menús y shortcuts de teclado 507

carácter que se encuentra a la derecha del

cursor de texto.
Ctrl + - Inserta un guión suave (aparece
solamente cuando se encuentra la final de
la línea).
Ctrl + + - Inserta guión rígido para prevenir que un
guión se malinterprete al final de la línea.
Ctrl + < Aumenta/reduce el tamaño de la fuente
del texto seleccionado (solo si toda la
Ctrl + >
selección tiene el mismo tamaño)
Alt + teclas de flecha Aumenta / reduce el espaciado / kerning.
 Inicia una nueva línea de texto.
Supr Elimina el carácter a la derecha del cursor
de texto. Si el cursor se encuentra al final
de una línea de texto, une esta línea con la
línea de abajo.
Retroceso Elimina el carácter a la izquierda del
cursor de texto. Si el cursor se encuentra
al inicio de una línea de texto, une esta
línea con la línea de arriba.
 + teclas de flecha Selecciona todo el texto entre la posición
del cursor y el inicio de la línea.
 + Fin Selecciona todo el texto entre la posición
del cursor y el final de la línea.

Caracteres especiales (en la herramienta de texto)

Ctrl+barra espaciadora Espacio rígido (las palabras con espacios
rígidos entre ellas no se separaran al final
de la línea)
Ctrl + – del teclado numérico – Guión "n" (este guión tiene el ancho de
una letra "n" y es más largo que un
menos).
Ctrl + Alt + - del teclado numérico — Guión "m" (este guión es un guión largo)
Ctrl + Alt + .(punto) … Puntos suspensivos
Ctrl + Alt + C © Copyright
Ctrl + Alt + R ® Registrado
Ctrl + Alt + T ™ Marca registrada
Ctrl + Alt + B • Viñeta
508

Páginas
Ctrl + C Copiar la página actual o la selección (sin
objetos seleccionados)
Ctrl + X Cortar la página actual o la selección (sin
objetos seleccionados)
Ctrl + V Pegar página(s)
Suprimir Eliminar la página actual o la selección (sin
objetos seleccionados)
 + Ctrl + Supr Eliminar la página actual o la selección (sin
o con objetos seleccionados)
 + Ctrl + Re. Pág. Mover la página hacia arriba
 + Ctrl + Av. Pág. Mover página hacia abajo

Utilizar máscaras
Herramienta "Pincel de máscara" Alt + F3
Máscara de mano alzada Herramienta Alt + F5
Herramienta de máscara rectangular Alt + F6
Activar/desactivar inversión de Ctrl + M o  + F1
máscara
Invertir máscara Ctrl +  + I o Ctrl + F1
Eliminar máscara Ctrl + D o Alt + F1

Otros
Editor de color Ctrl + E (abre y cierra)
Diálogo de opciones Ctrl +  + O
Ayuda de MAGIX Web Designer 10 F1
Premium

www.magix.es
 Si aún tienes preguntas... 509

Si aún tienes preguntas...

Ayuda del programa (breve)

La ayuda del programa contiene información detallada sobre la utilización del
programa y mucha información adicional que puede serte útil. Para abrir la página
principal de la ayuda, ve al menú "Ayuda" > "Contenido". Pulsa la tecla "F1" de tu
teclado en cualquier lugar del programa para abrir la ayuda contextual. Para buscar
palabras específicas en la ayuda, utiliza la función de ayuda. Utilizando los operadores
lógicos (p. ej. O, Y, SIMILAR) puedes refinar la ayuda.

Manual en PDF
El manual electrónico (PDF) contiene la documentación completa del programa, al
igual que la ayuda del programa. Encontrarás el manual en el menú Inicio >
Programas > MAGIX Web Designer 10 Premium en la subcarpeta "Documentación".

Nota: para poder visualizar el archivo PDF necesitas el programa gratuito Adobe
Acrobat Reader. Si no tienes instalado el Acrobat Reader, puedes descargarlo gratis
de la página web del fabricante.

Te deseamos mucha diversión con MAGIX Web Designer 10 Premium y mucho éxito
con tus proyectos de diseño.
510

Index
¿

¿Cuáles son las novedades de MAGIX Web Designer 10 Premium?......................... 17

¿Por qué Web Designer es tan especial? ........................................................................... 15
¿Qué es MAGIX Web Designer 10 Premium?.................................................................. 15
¿Qué funciones de MAGIX Web Designer 10 Premium son compatibles con
Flash? ........................................................................................................................................435
¿Qué son las funciones deshacer y rehacer?.................................................................. 102

Abrir (barra de control estándar o Ctrl+O).................................................................... 483

Abrir enlace en:.......................................................................................................................274
Abrir un documento de animación................................................................................... 443
Abrir un documento existente.............................................................................................. 74
Abrir una segunda ventana ................................................................................................... 79
Acelerar y desacelerar ......................................................................................................... 439
Acerca de MAGIX Web Designer 10 Premium ............................................................ 502
Acerca de RWD..................................................................................................................... 294
Acerca de Web Designer....................................................................................................... 22
Activación y desactivación de las barras de navegación del sitio.............................376
Activar o desactivar (on/off) la extrusión.......................................................................367
Actualización de la barra de navegación en todas las páginas ..................................382
Actualización de los estilos de texto................................................................................. 219
Actualizaciones para el Panorama Studio .......................................................................365
Actualizar programa.............................................................................................................. 501
Adaptación automática ....................................................................................................... 468
Adaptación múltiple ............................................................................................................. 468
Adaptación personalizada .................................................................................................. 468
Adaptar a bordes de página ................................................................................................276
Adaptar texto a la curva/Eliminar texto de la curva.................................................... 493
Agregado de archivos de películas y animaciones....................................................... 402
Agregado de nuevas páginas de presentación...............................................................392
Agregado y edición de botones..........................................................................................378
Agregar extremos de flechas .............................................................................................. 150
Agregar más segmentos de línea........................................................................................ 151
Agregar menús y submenús .............................................................................................. 380
Agregar nuevas páginas a tu página web .......................................................................... 32
Agregar y quitar sangrías.....................................................................................................223
Agrupación de galerías ........................................................................................................... 98
Agrupar (barra de control arreglo o Ctrl+G) ................................................................. 492
Agrupar y desagrupar objetos ..........................................................................128, 172, 447
Ajustando la región cortada .................................................................................................351
Ajustar a cuadrícula................................................................................................................122
Ajustar a cuadrícula (. del teclado numérico) ............................................................... 500
Ajustar a guías (2 del teclado numérico) ....................................................................... 500
Ajustar a objetos (* del teclado numérico).................................................................... 500
www.magix.es
 Index 511

Ajustar el ancho de los botones a las etiquetas ............................................................ 374

Ajustar el margen izquierdo y derecho de un texto sobre una curva ......................204
Ajuste......................................................................................................................................... 122
Ajuste de una transparencia de mapa de bits................................................................ 326
Ajuste del fondo de la página para un mapa de bits .................................................... 326
Ajuste magnético de objeto (ajustar a objetos) .............................................................124
Ajuste y ancho de línea ......................................................................................................... 123
Al final de una línea:...............................................................................................................154
Al inicio de una línea:............................................................................................................. 155
Alineación ............................................................................................................... 131, 133, 492
Alineación (Ctrl+Shift+L) ....................................................................................................492
Ampliar foto a 100%.............................................................................................................346
Ampliar selección .................................................................................................................. 104
Ancho / Alto ............................................................................................................................ 351
Animación......................................................................................................................496, 499
repeticiones y velocidad ..................................................................................................445
Animaciones en Flash.............................................................. 33, 135, 418, 449, 453, 495
Anterior y Siguiente .............................................................................................................. 345
Añadir a la galería .................................................................................................................. 100
Añadir código al encabezado de página ..........................................................................290
Añadir nombres.......................................................................................................................136
Añadir nuevos botones .......................................................................................................... 54
Añadir un nuevo punto de control .....................................................................................154
Aplanar grupo de fotos.........................................................................................................492
Aplicación de la transparencia mejorada ........................................................................249
Aplicación de transiciones a las capas popup.........................................................68, 273
Aplicación de transiciones a páginas de presentaciones............................................394
Aplicación de transiciones a pasos de presentaciones ............................................... 393
Aplicar atributos a historias de texto completas........................................................... 227
Aplicar colores de relleno y línea con arrastrar y soltar ...............................................176
Aplicar estilos de texto......................................................................................................... 222
Aplicar grupo suave (Ctrl+Alt+G) ....................................................................................492
Aplicar transparencia a varios objetos............................................................................. 252
Aplicar transparencia con gradación................................................................................245
Aplicar transparencia plana ................................................................................................245
Aplicar un bisel....................................................................................................................... 258
Aplicar un bisel a varios objetos ........................................................................................ 258
Aplicar un efecto de resplandor.........................................................................................254
Aplicar un efecto en vivo ..................................................................................................... 355
Aplicar una sombra ............................................................................................................... 253
Aplicar una sombra a varios objetos ................................................................................ 256
Aplicar una sombra de pared ............................................................................................. 253
Aplicar una sombra de suelo ..............................................................................................254
Archivos de película MP4 y FLV........................................................................................402
Archivos Flash ........................................................................................................................403
Archivos JPEG integrados ................................................................................................... 327
Archivos MP3 .........................................................................................................................403
Archivos PDF ......................................................................................................................... 404
Archivos recientes........................................................................................................471, 483
Área que permite clic............................................................................................................ 274
Áreas de texto ............................................................................................................... 199, 452
Arrastrar el segmento de línea............................................................................................158
512
Arreglar ventanas.................................................................................................................. 499
Asistencia técnica ..................................................................................................................... 13
Atributos actuales (estilos)...................................................................... 57, 471, 490, 498
Atributos de la edición de fotos ..........................................................................................331
Auto-optimización.................................................................................................................347
Ayuda .................................................................................................................................. 21, 501
Ayuda de MAGIX Web Designer 10 Premium .............................................................. 501
Ayuda del programa (breve).............................................................................................. 509

Barra de estado....................................................................................................................... 106

Barra de herramientas de página Web............................................................................... 50
Barra de herramientas principal ........................................................................................... 77
Barra de información ........................................................................................................ 29, 77
Barra de información de estilos de texto ......................................................................... 218
Barra de información de Herramienta de extrusión......................................................367
Barra de información de herramienta de relleno ...........................................................233
Barra de navegación del sitio ..............................................................................................375
Barras de botones (barras de navegación) ....................................................................... 55
Barras de control ........................................................................................... 76, 77, 479, 499
Barras de control bloqueadas o flotantes ........................................................................ 481
Barras de navegación ................................................................................. 55, 372, 380, 493
Barras de navegación de botón único............................................................299, 375, 377
Barras de navegación del sitio y plantillas .......................................................................376
Barras desplegables................................................................................................................. 25
Biseles .......................................................................................................................................258
Bloquear aspecto.....................................................................................................................351
Bloquear capas........................................................................................................................ 416
Bloquear efectos.....................................................................................................................356
Borrar........................................................................................................................................ 350
Borrar durante el dibujo........................................................................................................ 144
Borrar grupo suave (Ctrl+Alt+U)...................................................................................... 492
Botón Bloquear relación de aspecto................................................................................... 114
Botón de red ........................................................................................................................... 463
Botón Escalar anchos de línea ............................................................................................. 114
Botón imprimir ....................................................................................................................... 463
Botón Imprimir....................................................................................................................... 463
Botón opciones ...................................................................................................................... 463
Botones mouseover (rollover).............................................................................................. 66
Botones MouseOver (rollover) ............................................................................................ 54
Botones que permiten clic y efectos de MouseOver................................................... 440
Botones y menús....................................................................................................................378
Brillo / Mate ............................................................................................................................369
Brillo/Contraste/Temperatura del color/Saturación/Tono ...................................... 348
Buscar y reemplazar ............................................................................................................. 207

Calidad (barra de control estándar)................................................................................. 499

Calidad de imagen ................................................................................................................... 93

www.magix.es
 Index 513

Calidad de llenado .................................................................................................................466

Calidad de mapas de bits...........................................................................................429, 444
Calidad de visualización de fotos ...................................................................................... 328
Cambiar color de fondo.........................................................................................................184
Cambiar colores de un relleno............................................................................................ 236
Cambiar colores en un grupo...............................................................................................129
Cambiar curvas .......................................................................................................................158
Cambiar el ancho de la columna.........................................................................................199
Cambiar el ancho de línea (grosor) ...........................................................................161, 197
Cambiar el ángulo de la columna .......................................................................................199
Cambiar el color de sombra o el efecto de relleno ....................................................... 255
Cambiar el color del bisel o el efecto de relleno .............................................................261
Cambiar el estilo de unión del bisel ...................................................................................261
Cambiar el tamaño de fuente ............................................................................................. 222
Cambiar el tamaño de las áreas de texto ........................................................................202
Cambiar el tamaño de página................................................................................................82
Cambiar el tamaño del bisel ...............................................................................................260
Cambiar el tamaño, rotar y reposicionar la foto dentro de su propio marco ......... 335
Cambiar el tipo de unión.............................................................................................. 163, 197
Cambiar el valor de zoom...................................................................................................... 80
Cambiar el valor de zoom utilizando el ratón................................................................... 80
Cambiar el zoom utilizando la barra de información/barra de control de zoom.... 80
Cambiar extremo de línea ....................................................................................................164
Cambiar la elevación de la luz (ángulo vertical)............................................................260
Cambiar la forma del bisel....................................................................................................261
Cambiar la fuente de luz del bisel...................................................................................... 259
Cambiar la intensidad de la luz (contraste)....................................................................260
Cambiar la transparencia de la sombra ........................................................................... 255
Cambiar lados de la línea.....................................................................................................204
Cambiar los puntos cero de las reglas ................................................................................92
Cambiar mayúsculas o minúsculas...................................................................................205
Cambiar selección de objetos............................................................................................. 104
Cambiar tamaño utilizando el ratón ...................................................................................115
Cambiar tamaño utilizando la barra de información ......................................................115
Cambiar texto de botón ......................................................................................................... 54
Cambio de la fuente de los botones de la barra de navegación ................................ 382
Cambio de tamaño de widgets ..........................................................................................405
Cambio de tamaño teniendo en cuenta el contenido ........................................ 266, 358
Cambio del documento de plantilla en blanco............................................. 74, 469, 484
Cambio del orden de los pasos .......................................................................................... 392
Cambio del tamaño de objetos (escalar) ..........................................................................114
Cambio del tamaño y la posición del relleno de mapa de bits................................... 239
Campo de texto......................................................................................................................494
Cantidad de palabras ............................................................................................................203
Capa popup ............................................................................................................................. 272
Capas ...............................................................................................................................410, 455
Capas de fondos de página o de tablero de dibujo .......................................................307
Capas de popup y capas de presentación....................................................................... 395
Capas en páginas web...........................................................................................................412
Capas especiales.....................................................................................................................415
Capas pop·up ............................................................................................................................ 69
Capas, MouseOver (rollover) y elementos emergentes ............................... 28, 65, 412
514
Caracteres especiales (en la herramienta de texto)...........................................205, 507
Catálogo de contenido online ............................................................................................... 35
Cerrar ....................................................................................................................................... 488
Cerrar (Ctrl+W) .................................................................................................................... 484
Cerrar el documento ............................................................................................................... 87
Cerrar una forma ............................................................................................................145, 155
Cerrar una galería............................................................................................................. 95, 101
Clipart flash................................................................................................................................ 33
Clonar.......................................................................................................................................... 111
Clonar (Ctrl+K)...................................................................................................................... 490
Colocar objetos en la capa guía...........................................................................................127
Color previo y actual ..............................................................................................................179
Coloreado de mapa de bits................................................................................ 176, 177, 238
Colorear formas.................................................................................................................37, 60
Colorear fotos ..................................................................................................................38, 335
Colores de animación........................................................................................................... 444
Colores de la línea de colores ..............................................................................................175
Colores de la página web ....................................................................................................... 36
Colores locales y colores originales .................................................................................. 180
Colores normales ................................................................................................................... 187
Colores normales, tintes, tonalidades y colores vinculados ....................................... 187
Colores para enlaces de sitios web ...................................................................................276
Colores vinculados................................................................................................................. 188
Combinar formas ........................................................................................149, 171, 267, 493
Combinar formas (barra de control arreglo) ................................................................. 492
Comillas inteligentes............................................................................................................ 205
Cómo crear sangrías francesas ...........................................................................................212
Cómo sincronizar el texto empleando Grupos suaves................................................ 208
Comparar y restaurar el original........................................................................................ 348
Compartir a través de variantes .........................................................................................297
Compatibilidad entre el navegador y el texto.................................................................229
Conexión de áreas de texto, flujo de texto ...................................................................... 199
Configuración de impresora ............................................................................................... 487
Consejo del día........................................................................................................................ 501
Consejos de herramientas ............................................................................................... 21, 22
Contenido del directorio de compatibilidad...................................................................... 87
Contornear texto alrededor de objetos .............................................................................. 47
Contorneo y anclaje.............................................................................................................. 493
Control deslizante / resolución ...........................................................................................251
Controles ..................................................................................................................................457
Controles deslizantes de límites de selección................................................................ 106
Controles para rotar 90°......................................................................................................345
Conversión de una página web existente en una presentación.......................388, 390
Convertir a formas editables.......................................................................................146, 173
Convertir color con nombre en local para frame/capa................................................ 186
Convertir objetos o dibujos a mapas de bits..........................................................341, 493
Convertir texto en un gráfico ................................................................................................. 51
Convertir una línea recta en una curva (y viceversa) ................................................... 158
Coordenadas X-Y..................................................................................................................... 78
Coordinar selección.............................................................................................................. 474
Copiar (barra de control edición o Ctrl+C) .................................................................... 488
Copiar / Pegar texto con formato (RTF)..........................................................................228
www.magix.es
 Index 515

Copiar atributos de una extrusión 3D ............................................................................... 371

Copiar efectos en vivo .......................................................................................................... 358
Copiar estilos - pegar atributos................................................................................. 134, 368
Copiar estilos de texto.......................................................................................................... 227
Copiar formas a la capa de máscara................................................................................. 267
Copiar objetos .................................................................................................................29, 427
Copiar sombras a otros objetos......................................................................................... 257
Copiar y pegar páginas.................................................................................................... 29, 84
Copias .......................................................................................................................................464
Copias de memoria cero ...................................................................................................... 323
Copias de seguridad al cerrar el sistema........................................................................... 90
Copias de seguridad automáticas ...............................................................49, 85, 88, 478
Copias de seguridad de documentos abiertos................................................................. 88
Copyright ...................................................................................................................................... 2
Corrector de ortografía....................................................................................... 48, 206, 497
Cortar (barra de control edición o Ctrl+X) .....................................................................488
Cortar en documentos fotográficos................................................................................... 351
Cortar formas........................................................................................................................... 172
Cortar objetos...........................................................................................................................110
Cortar, copiar y pegar ........................................................................................108, 358, 488
Cortar, copiar, eliminar......................................................................................................... 265
Creación de barras de navegación propias ..................................................................... 383
Creación de barras de símbolos..........................................................................................481
Creación de botones, banners y otros gráficos web....................................................... 70
Creación de grupo suaves ....................................................................................................130
Creación de listas con números y viñetas....................................................................... 392
Creación de los botones MouseOver propios.......................................................379, 383
Creación de nuevos colores con nombre ................................................................182, 188
Creación de nuevos estilos..................................................................................................220
Creación de panorámicas .................................................................................................... 363
Creación de tus propios esquemas de colores ................................................................181
Creación de un tinte, una tonalidad o un color vinculado..........................175, 180, 188
Creación de una página Web ............................................................................................... 30
Creación de una presentación............................................................................................ 387
Creación de una presentación a partir de plantillas ........................................... 387, 388
Creación de una presentación desde cero ......................................................................388
Creación y edición de rectángulos con esquinas redondeadas..................................165
Crear agujeros en las formas ................................................................................................171
Crear barra de navegación ..................................................................................................493
Crear círculos y elipses .........................................................................................................166
Crear copia de mapa de bits (Ctrl+Shift+C)...................................................................493
Crear GIF animados ....................................................................................................442, 449
Crear nuevos objetos de texto nuevos............................................................................... 46
Crear páginas web RWD desde las plantillas.................................................................296
Crear polígonos y estrellas ...................................................................................................168
Crear rectángulos y cuadrados ...........................................................................................165
CREAR RECTÁNGULOS Y CUADRADOS ......................................................................264
Crear sitios web RWD desde sitios existentes ..............................................................296
Crear un cuadrado ..................................................................................................................165
Crear un línea guía.................................................................................................................. 127
Crear un relleno de color con gradación........................................................................... 231
Crear una animación.............................................................................................................443
516
Crear una máscara.................................................................................................................263
Crear una máscara suave.....................................................................................................265
Crear uniones en curva......................................................................................................... 159
Crear uniones en punta ........................................................................................................ 159
Cuadrícula en pantalla ...................................................................................................91, 499

Dar a nuevos objetos los atributos más recientes......................................................... 471

Darle el tamaño completo a una foto ...............................................................................338
Del catálogo de contenidos ................................................................................................ 494
Dentro ........................................................................................................................................132
Desactivación de la regeneración del marcador de posición .................................... 406
Desagrupar (barra de control arreglo o Ctrl+U) ........................................................... 492
Desagrupar objetos ............................................................................................................... 128
Deseleccionar un objeto....................................................................................................... 105
Desenfocar los bordes de la sombra.................................................................................255
Desenfoque / Enfoque......................................................................................................... 348
Deshacer (barra de control estándar o Ctrl+Z) ............................................................ 488
Deshacer corte....................................................................................................................... 350
Deshacer y rehacer................................................................................................................ 102
Desplazamiento de la parte superior de la página ....................................................... 306
Desplazamiento de los controles de inicio y fin de un relleno ...................................236
Desplazamiento y tranformación de una barra de navegación del sitio..................375
Desplazar........................................................................................................................ 108, 473
Desplazar botones y herramientas................................................................................... 482
Desplazar el documento dentro de la ventana.................................................................. 81
Desplazar objetos.................................................................................................. 29, 108, 506
Detención de la repetición de objetos .....................................................................139, 493
Detener actualización (Shift+Ctrl+Alt+O)..................................................................... 493
Diálogo de propiedades web...............................................................................................268
Diálogo Propiedades de la barra de navegación ............................................................373
Dibujar una linea o forma..................................................................................................... 143
Dibujo de segmentos rectos con la herramienta de dibujo libre ............................... 144
Dibujo sensible a la presión................................................................................................. 147
Dibujo y edición de líneas rectas ....................................................................................... 150
Diccionario de usuario ......................................................................................................... 207
Difuminación ............................................................................................................................. 62
Difuminación (Feathering) .................................................................................................. 126
Dirección del bisel..................................................................................................................259
Directorios de compatibilidad............................................................................86, 272, 424
Diseño del programa ............................................................................................................... 23
Diseño web adaptativo ................................................................................................219, 294
Diseño web basado en objetos............................................................................................. 27
Distancia duplicación .......................................................................................... 111, 473, 490
Distribuir....................................................................................................................................133
Documento seleccionado y barra de título ....................................................................... 76
Documentos abiertos........................................................................................................... 500
Documentos fotográficos ..................................................................................322, 342, 351
Documentos sin título............................................................................................................. 89
Documentos web y PDF........................................................................................................317
Duplicar ...................................................................................................................................... 111
www.magix.es
 Index 517

Duplicar (barra de control edición o Ctrl+Alt+D)........................................................ 490

Duplicar y clonar .......................................................................................................................111
Duplicar, clonar ......................................................................................................................266
Duración de frames para películas Flash y pasos intermedios..................................430

Edición de archivos de fotos ............................................................................................... 343

Edición de estrellas.................................................................................................................170
Edición de foto con................................................................................................................250
Edición de smartshapes ........................................................................................................167
Edición de widgets existentes ........................................................................................... 400
Edición del contenido de un objeto repetido ...................................................................138
Edición en el lienzo ................................................................................................................ 382
Editar colores con nombre ..................................................................................181, 182, 184
Editar el color de un objeto .................................................................................................. 177
Editar el color principal..........................................................................................................189
Editar el contorno de las fotos............................................................................................. 331
Editar formas........................................................................................................................... 356
Editar formas de molde ..........................................................................................................121
Editar líneas/formas con la herramienta de dibujo libre y pincel ..............................146
Editar máscara........................................................................................................................264
Editar polígonos y estrellas ..................................................................................................169
Editar texto ..............................................................................................................................204
Editor de color (Ctrl+E)........................................................................................................495
Efectos ......................................................................................................................................478
Efectos en tiempo real (solo 32 bits) ..................................................................... 355, 478
Efectos MouseOver................................................................................................................. 65
Ejemplo para cambiar el tamaño de una foto y guardarla en JPEG. .........................330
El botón de propiedades ......................................................................................................463
El color se transforma — el color de la animación cambia .........................................438
El diálogo de impresión ........................................................................................................463
El editor de color .................................................................................................. 174, 178, 495
El orden de los botones coincide con el orden de la página ....................................... 374
Eliminación de estilos ............................................................................................................ 221
Eliminación de grupos suaves .............................................................................................130
Eliminación de una barra de navegación del sitio de una página.............................. 376
Eliminar colores con nombre ...............................................................................................185
Eliminar colores no utilizados..............................................................................................185
Eliminar imágenes de la galería.......................................................................................... 326
Eliminar las barras de control .............................................................................................482
Eliminar objetos........................................................................................................................110
Eliminar objetos de un grupo ...............................................................................................129
Eliminar objetos de un paso ................................................................................................ 392
Eliminar objetos del documento ..........................................................................................110
Eliminar objetos repetidos................................................................................................... 140
Eliminar páginas de presentación...................................................................................... 393
Eliminar páginas de tu documento...................................................................................... 84
Eliminar puntos........................................................................................................................ 155
Eliminar secciones de una galería........................................................................................101
Eliminar selección/Restaurar atributos actuales (Esc) .................................... 490, 498
Eliminar un ancla..................................................................................................................... 217
518
Eliminar un bisel .....................................................................................................................262
Eliminar un paso .....................................................................................................................392
Eliminar una galería del espacio de trabajo...................................................................... 101
Eliminar una línea guía.......................................................................................................... 128
Eliminar una sombra..............................................................................................................256
En el medio de una línea:...................................................................................................... 154
Enderezar horizonte...............................................................................................................337
Enlace al archivo.....................................................................................................................272
Enlace automático de páginas ............................................................................................375
Enlaces al paso siguiente/anterior ....................................................................................393
Enlaces de texto......................................................................................................................226
Enlaces, botones y barras de navegación .......................................................................... 53
Enlazar a una dirección web............................................................................................... 270
Enlazar a una referencia ........................................................................................................271
Enlazar a... ......................................................................................................................270, 393
Envío de imágenes a otras aplicaciones de MAGIX instaladas ................................ 498
Envolturas ................................................................................................................................ 120
Equilibrar curvas ..................................................................................................................... 159
Espaciado de botón ...............................................................................................................374
Espaciado de cuadrícula y regla ........................................................................................ 474
Espaciado de línea..................................................................................................................225
Espaciado de párrafos...........................................................................................................225
Esquemas de colores originales .................................................................................181, 372
Esquina con inglete / Esquina redonda............................................................................369
Estilo de párrafo y estilo de carácter................................................................................. 218
Estilos basados en otros estilos.......................................................................................... 219
Estilos de menú...................................................................................................................... 380
Estilos de pincel ...................................................................................................................... 150
Estilos de texto........................................................................................................ 27, 217, 295
Explorar espacio web ............................................................................................................292
Exportación como documento Word ...............................................................................453
Exportación como Flash .......................................................................................................453
Exportación como formato Extended Metafile (EMF) .................................................453
Exportación como mapa de bits........................................................................................ 454
Exportación como metarchivo de Windows (.wmf).....................................................453
Exportación de animaciones como AVI ...........................................................................425
Exportación de archivos .......................................................................................................453
Exportación de archivos Photoshop PSD.................................................... 447, 449, 455
Exportación de páginas web con directorios de compatibilidad ................................. 87
Exportación de un archivo Flash ........................................................................................423
Exportación de un documento web.........................................................................453, 486
Exportación DPI ......................................................................................................................455
Exportación rápida de HTML y formatos de gráficos web......................................... 454
Exportar (Ctrl+Shift+E) ....................................................................................................... 484
Exportar animación............................................................................................................... 487
Exportar como AVI ................................................................................................................453
Exportar JPEG......................................................................................................................... 485
Exportar la animación .......................................................................................................... 443
Exportar página web............................................................................................................. 486
Exportar Página web............................................................................................................. 486
Exportar PNG ......................................................................................................................... 485
Extender la línea. .....................................................................................................................153
www.magix.es
 Index 519

Extender o reducir objetos ....................................................................................................116

Extender una línea ..................................................................................................................145
Extracción del JPEG original................................................................................................ 328
Extrudir texto ..........................................................................................................................370
Extrudir una forma.................................................................................................................366

Finalizar la línea.......................................................................................................................154
Fluidez de la animación (smoothness) ..................................................................433, 444
Fondos avanzados .................................................................................................................308
Fondos de página web................................................................................39, 299, 303, 327
Fondos de plantilla y cambio de color de fondo ............................................................305
Fondos fijos no desplazables ..............................................................................................305
Forma ........................................................................................................................................494
Formatos de exportación.....................................................................................................449
Formatos de importación ....................................................................................................447
Foto emergente ...................................................................................................................... 273
Fotos.................................................................................................................................. 40, 428
Fotos emergentes ...................................................................................................................281
Fotos en miniatura con popup............................................................................. 42, 70, 286
Fotos pop-up............................................................................................................................. 70
Fuentes compatibles con la web.........................................................................................194
Fuentes de Google..................................................................................................................195
Función de botones de ratón ...................................................................................... 80, 475
Funciones comunes para fotos .......................................................................................... 345
Funciones de Flash avanzadas ...........................................................................................439
Fusionar varias formas en una sola.....................................................................................171

Galería de diseños ................................................................................................................... 34

Galería de líneas.................................................................................................... 155, 161, 495
Galería de páginas y capas..28, 49, 85, 105, 112, 126, 129, 385, 407, 470, 490, 495
Galerías..........................................................................................34, 94, 163, 243, 324, 495
Generación automática del marcador de posición ...................................................... 400
GIF animados ......................................................................................................................... 404
Girar objetos.......................................................................................................................29, 113
Girar objetos en el modo de cambio de tamaño .....................................................114, 118
Girar utilizando el ratón .........................................................................................................112
Gradaciones de color de varios niveles.................................................................... 177, 241
Gráficos anclados ..................................................................................................52, 214, 493
Gráficos de ejemplo .................................................................................................................63
Gráficos incrustados .............................................................................................................. 217
Grupos ...............................................................................................................46, 51, 379, 435
Grupos anclados .......................................................................................................................52
Grupos de foto.................................................................................................... 250, 320, 354
Grupos de repetición ...............................................................................................................52
Grupos suaves (soft groups) ......................................................................................... 52, 66
Grupos suaves (soft groups, en inglés) ............................. 130, 208, 217, 412, 416, 492
Grupos y capas........................................................................................................................129
520
Grupos y capas suaves ......................................................................................................... 412
Guardar .....................................................................................................................................327
Guardar (barra de control estándar o Ctrl+S) ............................................................... 484
Guardar como ........................................................................................................................ 484
Guardar como (en el menú Archivo).................................................................................. 86
Guardar copias de seguridad de documentos abiertos al cerrar el programa .........90
Guardar el documento ............................................................................................................ 85
Guardar la configuración de publicación en el documento..........................................316
Guardar perfiles .......................................................................................................................315
Guardar plantilla.................................................................................................................... 484
Guardar todo .......................................................................................................................... 484
Guardar todo (en el menú Archivo).................................................................................... 86
Guardar tu trabajo. Creación de una página Web...........................................................48
Guardar y exportar fotos ......................................................................................................329
Guardar y transferir archivos ..............................................................................................357

Habilitar Supersites .............................................................................................................. 300

Hacer grupos transparentes en su conjunto................................................................... 471
Hacer que un objeto se rodee de texto .............................................................................213
Hacer una presentación .......................................................................................................396
Herramienta Capturar pantalla...........................................................................................333
Herramienta de corte ........................................................................................................... 349
Herramienta de extrusión 3D .............................................................................................366
Herramienta de formas........................................................................................................... 58
Herramienta de optimización ............................................................................................ 346
Herramienta de optimización de foto ...............................................................................267
Herramienta de rectángulo....................................................................................................60
Herramienta de relleno...........................................................................................................60
Herramienta de sombra ......................................................................................................... 63
Herramienta de texto ........................................................................................................... 506
Herramienta de transparencia ............................................................................................... 61
Herramientas de dibujo ................................................................................................... 27, 56
Herramientas de dibujo y forma ........................................................................................ 165

Imagen ..................................................................................................................................... 494

Imágenes de alta resolución....................................................................................... 277, 318
Importación de archivos...................................................................................................... 449
Importación de clipart con color .......................................................................................... 38
Importación de colores con nombre ................................................................................. 185
Importación de foto RAW......................................................................................... 448, 452
Importación de fotos ..............................................................................................................321
Importación de fotos grandes................................................................................................41
Importación de PDF.............................................................................................................. 450
Importación de un archivo Photoshop PSD.................................................................... 450
Importación de un documento Word ............................................................................... 451
Importación desde una página web. .................................................................................452
Importación e inserción de barras de navegación.........................................................383

www.magix.es
 Index 521

Importación y exportación ............................................................ 85, 446, 483, 484, 495

Importante...............................................................................................................................454
Importar (Ctrl+Shift+I).........................................................................................................484
Importar desde la dirección web (Ctrl+Alt+W)............................................................484
Importar y exportar formatos de archivo compatibles ...................................... 100, 447
Imprimiendo........................................................................................................462, 487, 488
Imprimir (Ctrl+P)...................................................................................................................488
Imprimir a archivo .................................................................................................................464
Imprimir capas........................................................................................................................465
Imprimir como ........................................................................................................................465
Inclinar objetos .........................................................................................................................117
Incluir página web en la galería de usuarios ....................................................................316
Incrustación de fuentes en el documento ....................................................................... 228
Incrustación de fuentes en un sitio web .......................................................................... 229
Indicaciones generales sobre la exportación e importación ......................................446
Información de documento..........................................................................................22, 487
Información de presentación avanzada ........................................................................... 395
Iniciar un nuevo documento ................................................................................................. 74
Inserción.................................................................................................................................. 400
Inserción con otra herramienta de autoría web.............................................................424
Inserción de un objeto flash en MAGIX Web Designer 10 Premium. .....................424
Inserción manual de marcadores de posición para widgets ..................................... 406
Insertar sombras detrás del objeto .................................................................................... 371
Insertar texto de ejemplo ('Lorem Ipsum') .....................................................................206
Integración de películas, Flash y otros widgets ......................................................33, 290
Intersección de formas...........................................................................................................171
Introducción ....................................................................... 15, 190, 318, 344, 355, 418, 483
Introducir caracteres especiales ........................................................................................205
Introducir páginas en tu documento....................................................................................83

Justificación o alineación de texto..................................................................................... 222

Justificado................................................................................................................................ 374

La barra de estado ....................................................................................................................78

La barra de herramientas...................................................................................385, 387, 391
La capa actual ...........................................................................................................................411
La función de rotación ..........................................................................................................434
La función deshacer ...............................................................................................................102
La función rehacer ..................................................................................................................102
La galería de frames de animación....................................................................................426
La galería de mapa de bits................................................................................237, 324, 495
La galería de páginas y capas .............................................................................................407
La galería de rellenos ...................................................................................................237, 242
La herramienta de bisel ........................................................................................................ 258
La herramienta de dibujo libre y pincel .............................................................................143
La herramienta de edición de formas ..........................................................................58, 151
La herramienta de fotos .......................................................................................42, 331, 344
522
La herramienta de líneas rectas y flechas........................................................ 59, 150, 163
La herramienta de máscaras ...............................................................................................263
La herramienta de moldes .................................................................................................... 118
La herramienta de ojos rojos...............................................................................................353
La herramienta de relleno ..........................................................................38, 231, 245, 246
La herramienta de selección..................................................................................28, 60, 103
La herramienta de sombra.........................................................................................240, 253
La herramienta de texto ........................................................................................................ 191
La línea de colores.................................................................................................................. 174
La página actual........................................................................................................................ 83
La pestaña de frames ........................................................................................................... 444
La tecla de restricción .................................................................................................... 93, 199
La ventana de MAGIX Web Designer 10 Premium ........................................................ 75
Las capas actuales siempre están visibles y pueden editarse................................... 470
Las capas MouseOff y MouseOver..................................................................................... 65
Las galerías ............................................................................................................................. 503
Las herramientas ................................................................................................................... 503
Limitación de ángulo ..............................................................................................93, 113, 473
Lista con viñetas.....................................................................................................................223
Lista con viñetas y numeradas .............................................................................................46
Lista con viñetas y números con gráficos........................................................................224
Lista numerada .......................................................................................................................224

Ll

Llevar atrás (barra de control arreglo o Ctrl+B)............................................................. 491

Lo que Flash puede hacer y lo que no puede hacer ...................................................... 418

Lo que no puedes hacer con Flash en MAGIX Web Designer 10 Premium .......... 420
Longitud de línea compatible con navegadores web....................................................472
Los 6 tipos centrales de animación ................................................................................... 419
Los indicadores ......................................................................................................................... 78
Los nuevos efectos se bloquean por defecto................................................................. 479
Luces..........................................................................................................................................368

Manejo de documento.................................................................................................. 74, 289

Manejo de formas .................................................................................................................. 165
Manejo de los pasos de presentación ...............................................................................391
Manipulación de documentos ........................................................................................... 504
Manipulación de objetos..................................................................................................... 505
Mantener los nombres de las capas importadas........................................................... 471
Manual en PDF ...................................................................................................................... 509
Mapas de bits...........................................................................................................................251
Mapas de bits en otros formatos que el JPEG............................................................... 428
Marcadores de selección ..................................................................................................... 106
Marco de selección................................................................................................................ 104
Marco de selección de objetos...........................................................................................472
www.magix.es
 Index 523

Márgenes y sangrías.............................................................................................................209
Más Web Designer ................................................................................................................501
Máscaras................................................................................................................ 263, 333, 361
Máscaras suaves.................................................................................................................... 265
Membresía del sitio del widget......................................................................................... 400
Menú Archivo .........................................................................................................................483
Menú Arreglo...........................................................................................................................491
Menú Ayuda ............................................................................................................................501
Menú Compartir ....................................................................................................................497
Menú contextual de la línea de colores ............................................................................176
Menú de fuente .......................................................................................................................193
Menú Edición ..........................................................................................................................488
Menú Herramientas ..............................................................................................................495
Menú Insertar .........................................................................................................................494
Menú Ventana........................................................................................................................498
Menús con clic derecho ......................................................................................................... 64
Menús y shortcuts de teclado ............................................................................................483
Mezclar líneas curvas y rectas ............................................................................................ 153
Mezclar transparencias individuales y de grupo ........................................................... 252
Minimizar ventanas múltiples ...............................................................................................79
Mismo ancho para todos los botones .............................................................................. 374
Modificación de tamaño con contenido alternativa ..................................................... 362
Modificación de tamaño de foto con contenido............................................................266
Modificación del tamaño de una barra de símbolos .....................................................481
Modificar un bisel .................................................................................................................. 259
Modo Bosquejo .......................................................................................................................147
Modo de pantalla completa ................................................................................................479
Modo de pantalla normal/completa .........................................................................78, 475
Modo de trazo .........................................................................................................................148
Modo Solo ................................................................................................................................416
Mostrar barras de desplazamiento ...................................................................................499
Mostrar bordes de impresión .............................................................................................462
Mostrar cuadrícula (#) ........................................................................................................499
Mostrar guías (1 del teclado numérico)...........................................................................500
Mostrar reglas (Ctrl + L)......................................................................................................499
Mostrar todo y desbloquear todo.......................................................................................417
Mostrar y ocultar barras de control ................................................................................. 480
Mostrar/ocultar reglas............................................................................................................92
Mover a la capa al frente (barra de control arreglo o Ctrl+Shift+U).........................491
Mover a la capa de atrás (barra de control arreglo o Ctrl+Shift+D).........................491
Mover adelante (barra de control arreglo o Ctrl+Shift+F) ..........................................491
Mover atrás (barra de control arreglo o Ctrl+Shift+B) .................................................491
Mover objetos..........................................................................................................................106
Mover objetos anclados........................................................................................................216
Mover objetos de un paso a otro........................................................................................391
Mover objetos entre capas........................................................................................... 68, 417
Mover objetos hacia adelante o hacia atrás .....................................................................112
Mover objetos seleccionados debajo o dentro ...............................................................105
Mover páginas dentro del documento ............................................................................... 84
Mover puntos de control - Herramienta de edición de formas.................................156
Mover y fijar una galería ........................................................................................................ 95
524

Navegación instantánea del menú de fuente ................................................................. 195

Navegar entre páginas............................................................................................................ 85
Negrita y cursiva.....................................................................................................................222
Nombrar objetos ...........................................................................................................135, 495
Nombres.................................................................................................................................. 495
Nombres aplicados .................................................................................................................136
Nombres para el directorio de compatibilidad................................................................. 86
Notas acerca de Cambio de tamaño teniendo en cuenta el contenido ...................363
Notas para la herramienta de foto.....................................................................................352
Nueva página.......................................................................................................................... 494
Nueva ventana ....................................................................................................................... 499
Nuevo (barra de control estándar o Ctrl+N) ................................................................. 483
Nuevo desde el catálogo de contenido ........................................................................... 483
Número de página................................................................................................................. 494

Objetos ancla ............................................................................................................................ 47

Objetos de fotos ......................................................................................................................319
Objetos de marcador de lugar ........................................................................................... 290
Objetos en la página................................................................................................................ 26
Objetos extensibles .................................................................................................................49
Objetos guía y líneas guía ...................................................78, 91, 92, 126, 414, 476, 500
Objetos repetidos.......................................................................................... 52, 135, 137, 298
Objetos sin movimiento .......................................................................................................437
Ocultar botones y herramientas ....................................................................................... 482
Ocultar capas .......................................................................................................................... 416
Opción Guardar (en el menú Archivo)............................................................................... 86
Opciones (Ctrl+Shift+O) .................................................................................................... 497
Opciones AVI......................................................................................................................... 445
Opciones de exportación web ............................................................................................277
Opciones de impresión........................................................................................................ 487
Pestaña Diseño de la impresión.................................................................................... 467
Pestaña Salida.................................................................................................................... 465
Opciones de la foto emergente ..........................................................................................282
Opciones de página .............................................................................................................. 487
Opciones de texto................................................................................................................. 466
Opciones del menú............................................................................................................... 469
Opciones flash ....................................................................................................................... 444
Operaciones de capa............................................................................................................. 413
Operaciones de color avanzadas ........................................................................................179
Operaciones que utilizan la máscara ................................................................................265
Optimización .......................................................................................................................... 467
Optimización de fotos y mapas de bits..................................................................338, 496
Optimización de todas las imágenes ............................................................................... 496
Optimizar ...................................................................................................................... 249, 360
Optimizar foto........................................................................................................................ 496
Optimizar imágenes ............................................................................................................. 364

www.magix.es
 Index 525

Orden de capas en documentos de página web...............................................................67

Orden de los objetos................................................................................................................27
Orden de múltiples ventanas.................................................................................................79
Orientación.............................................................................................................................. 373
Otros .........................................................................................................................................508
Otros aspectos interesantes............................................................................................... 376
Otros formatos de película..................................................................................................403

Páginas ....................................................................................................... 410, 464, 490, 508

Páginas de múltiples columnas..........................................................................................200
Páginas múltiples en el documento .......................................................................... 82, 490
Pantalla completa (8 del teclado numérico) ..................................................................499
Para crear un grupo ................................................................................................................128
Para dibujar un segmento de línea curvo: ........................................................................ 153
Para dibujar un segmento de línea recto .......................................................................... 152
Pasos y capas.......................................................................................................................... 385
Pegar (barra de control edición o Ctrl+V).......................................................................488
Películas.....................................................................................................................................501
Perfil ........................................................................................................................................... 251
Personalización de Web Designer ....................................................................................469
Perspectivas ..............................................................................................................................119
Pestaña Analytics ........................................................................................................ 268, 293
Pestaña Copias de seguridad..............................................................................................478
Pestaña Cuadrícula y regla ........................................................................... 91, 92, 156, 474
Pestaña de opciones ..............................................................................................................461
Pestaña efectos y plug-ins...................................................................................................478
Pestaña Enlace.............................................................................................................. 269, 379
Pestaña General .....................................................................................................57, 412, 470
Pestaña Imagen............................................................................................................. 273, 281
Pestaña Marcador de lugar ................................................................................87, 287, 406
Pestaña Mouse-over.............................................................................................................286
Pestaña Opciones de paleta................................................................................................458
Pestaña Página ....................................................................................................270, 275, 278
Pestaña Página web ........................................................................................... 275, 280, 415
Pestaña Publicar......................................................................................................................291
Pestaña Ratón ......................................................................................................................... 475
Pestaña Tamaño de mapa de bits .................................................................................... 460
Pestaña Tamaño de página ........................................................................ 76, 421, 431, 477
Pies de página y objetos que se amplían con la página. .............................................. 140
Plug-ins de Photoshop (solo Web Designer de 32 bits) .............................................478
Polígonos o estrellas con esquinas redondeadas ...........................................................169
Pop-ups deslizantes .............................................................................................................. 347
Popups informativos .............................................................................................................502
Preguntar antes de aplicar el atributo actual...................................................................471
Preparar tu foto ......................................................................................................................360
Presentaciones como páginas web................................................................ 300, 385, 415
Presentaciones web ........................................................................................... 276, 414, 472
Primeros pasos .......................................................................................................23, 415, 496
Principios básicos ...................................................................................................................421
Profundidad de la extrusión ................................................................................................368
526
Propiedades de capa .......................................................................... 47, 214, 387, 395, 413
Propiedades de estilo .............................................................................................................221
Propiedades de GIF animados ........................................................................................... 443
Propiedades del mapa de bits.............................................................................................327
Propiedades web (Ctrl+Shift+W)..................................................................................... 495
Publicación de documento web ........................................................................................ 487
Publicación de documentos web .............................................................................. 317, 453
Publicación de variantes.......................................................................................................299
Publicación rápida (solo archivos modificados) .............................................................316
Publicar en MAGIX Mundo Online (MOW) .................................................................. 310
Publicar en un alojamiento web alternativo .....................................................................312
Publicar la página web ............................................................................................................ 72
Publicar online
carga de objetos a Facebook ......................................................................................... 497
carga de objetos a Flickr ................................................................................................. 497
espacio web libre y más.................................................................................................. 498
MAGIX Álbum Online..................................................................................................... 497
publicar un sitio web........................................................................................................ 498
Publicar página web.....................................................................................72, 292, 310, 486

Radio para alineación magnética ...................................................................................... 476

Recortar fotos..........................................................................................................................332
Recortar fotos con una máscara ........................................................................................332
Recortar o cortar imágenes ................................................................................................ 349
Recortar y cortar........................................................................................................... 431, 444
Recuperación de copias de seguridad ................................................................................90
Recuperación tras cierres anormales del programa........................................................90
Reemplazar colores .......................................................................................................168, 183
Reemplazar con código HTML ...........................................................................................289
Reemplazar con Flash ...........................................................................................................288
Reemplazar con un archivo gráfico ...................................................................................289
Registrarme............................................................................................................................. 502
Regla de los tercios............................................................................................................... 350
Reglas .......................................................................................................................... 77, 91, 208
Rehacer (barra de control estándar o Ctrl+Y)............................................................... 488
Relleno de formas con un mapa de bits ...........................................................................326
Relleno fractal ........................................................................................................................ 240
Rellenos..................................................................................................................................... 107
Rellenos circulares .................................................................................................................236
Rellenos de mapa de bits .....................................................................................................237
Rellenos elípticos....................................................................................................................237
Rellenos lineales .....................................................................................................................235
Rellenos lisos...........................................................................................................................235
Renombrar colores con nombre......................................................................................... 185
Reordenar ítems en la galería.............................................................................................. 100
Reordenar los colores de la línea de color. .......................................................................175
Repetir en todas las páginas (Shift+Ctrl+Alt+R) .......................................................... 493
Res. de efecto en vivo por def.: .......................................................................................... 479
Res. efecto bloqueado por def.: ......................................................................................... 479
Resolución de los efectos en vivo ......................................................................................357
www.magix.es
 Index 527

Resolución de transparencia...............................................................................................466
Restricciones de diseño de botones ................................................................................. 383
Restringir la línea .................................................................................................................... 157
Resumen...................................................................................................................................456
Resumen de animación de MAGIX Web Designer 10 Premium Flash.................... 441
Resumen de shortcuts del teclado numérico .........................................................128, 130
Resumen del diálogo de exportación GIF, PNG y JPEG ........... 72, 330, 341, 449, 456
Retina (activado por defecto)............................................................................................. 277
Revisar ortografía mientras se escribe .............................................................................497
Revisiones .................................................................................................................................. 89
Rotación ................................................................................................................................... 433
Rotación con ángulos exactos (utilizando la barra de información)..........................113

Saltos de columna ..................................................................................................................201

Saltos de página .....................................................................................................................202
Selección de idioma ..............................................................................................................206
Selección de la ventana que se quiere visualizar..............................................................79
Selección de objetos con ayuda de la herramienta de sombras................................ 256
Selección interna.................................................................................................................... 104
Selección y capas....................................................................................................................105
Seleccionar bajo ..................................................................................................................... 104
Seleccionar ítems................................................................................................................... 100
Seleccionar múltiples puntos de control .......................................................................... 155
Seleccionar objetos .......................................................................................................103, 160
Seleccionar todo (Ctrl+A) .................................................................................................. 490
Seleccionar todo el objeto de texto...................................................................................205
Seleccionar todos los objetos ..............................................................................................105
Seleccionar un objeto dentro de un grupo .......................................................................129
Seleccionar y configurar una impresora ..........................................................................462
Separadores de menú ...........................................................................................................380
Separar una forma .................................................................................................................. 172
Sesiones remotas de presentación ................................................................................... 395
Shortcuts de teclado .............................................................................................................503
Si aún tienes preguntas... .....................................................................................................509
Sincronización de texto .........................................................................................................130
Smartshapes ............................................................................................................................167
Sobre las presentaciones ..................................................................................................... 385
Sobre las Supersites .................................................................................277, 299, 300, 385
Soltar una copia.......................................................................................................................107
Sombras .......................................................................................................................... 128, 253
Sombras suaves, texto relleno de color, texto transparente ........................................ 47
Suavizar una línea ................................................................................................................... 157
Subrayado de texto ............................................................................................................... 222
Subtítulos de imagen ............................................................................................................284
Superíndice y subíndice ....................................................................................................... 223
Supersites ................................................................................................................................300
Sustitución de archivos de imagen....................................................................................450
Sustitución de los rellenos de mapa de bits.................................................................... 238
Sustitución de múltiples fotos ............................................................................................... 41
Sustitución de múltiples fotos en simultáneo ................................................................ 322
528
Sustituir fotos ..........................................................................................................................322

Tab ............................................................................................................................................. 106

Tabulaciones ........................................................................................................................... 210
Tabulaciones personalizadas ............................................................................................... 211
Tabulaciones, márgenes y sangrías............................................................................ 91, 208
Tamaño de foto inicial ..........................................................................................................323
Tamaño de fuente ....................................................................................................................46
Tamaño de página....................................................................................................................48
Terminología............................................................................................................................. 191
Texto.................................................................................................................................. 44, 455
Texto alrededor de objetos........................................................................ 47, 212, 414, 493
Texto dentro de grupos para páginas web ......................................................................226
Texto en una columna .......................................................................................................... 198
Texto girado...............................................................................................................................46
Texto siguiendo una curva..........................................................................................203, 210
Texto simple .............................................................................................................................197
Texturas y fotos......................................................................................................................370
Tintes......................................................................................................................................... 187
Tipo de documento................................................................................................................472
Tipo de imagen web ..............................................................................................................285
Tipo y tamaño del bisel.........................................................................................................368
Tipos de relleno .......................................................................................................................231
Tipos de tabulaciones personalizadas ............................................................................... 211
Tipos de transparencia ........................................................................................................ 246
Tonalidades.............................................................................................................................. 187
Trabajar con colores............................................ 174, 197, 204, 235, 236, 248, 256, 261
Trabajar con fotos .............................................................................251, 277, 318, 472, 495
Trabajar con objetos..................................................... 103, 104, 169, 476, 490, 491, 492
Trabajar con textos................................................................................27, 47, 173, 190, 393
Traer al frente (barra de control arreglo o Ctrl+F) ........................................................ 491
Transparencia.................................................................................... 128, 244, 326, 438, 471
Transparencia con gradación de varios niveles..............................................................245
Transparencia en un grupo..................................................................................................435
Trayectoria invertida .............................................................................................................. 151
Tu primera animación ...........................................................................................................422
Tus propios iconos en las pestañas de los navegadores (favicon)............................. 55

Ubicación de la copia de seguridad..................................................................................... 89

Un ejemplo.....................................................................................................................238, 240
Una página web en 6 pasos.................................................................................................... 16
Unir dos líneas ........................................................................................................................ 145
Unir líneas ................................................................................................................................ 160
URL en Flash ................................................................................................................. 439, 444
Usar de barras de navegación de plantillas.....................................................................372
Usar fotos como fondo. ....................................................................................................... 306
Usar fuentes en tu página web .............................................................................................46

www.magix.es
 Index 529

Usar la pipeta para escoger colores................................................................. 174, 175, 179

Uso de la herramienta de zoom ........................................................................................... 80
USO DE LA HERRAMIENTA DE ZOOM ......................................................................... 353
Uso de las galerías................................................................................................................... 99
Uso de máscaras con la función .........................................................................................361
Uso de plantillas, cliparts y widgets.....................................................................................32
Uso del control de curva .......................................................................................................158
Utilización de fotos como relleno ...................................................................................... 323
Utilización de la herramienta de fotos .............................................................................344
Utilización de los campos de texto de la barra de información..................................156
Utilizar colores habituales para enlaces de sitios web................................................. 273
Utilizar máscaras ...................................................................................................................508

Variantes de página web .....................................................................................................496

Variantes múltiples ..................................................................................................... 295, 496
Variantes y barras de navegación .....................................................................................298
Variantes y fondos.................................................................................................................299
Variantes y objetos repetidos.............................................................................................298
Velocidad de la animación .................................................................................................. 432
Ventajas de la herramienta de fotos.................................................................................344
Ver pestañas de los documentos ......................................................................................499
Ver una foto ampliada en su tamaño completo ............................................................ 338
Ver una galería ......................................................................................................................... 95
Vista multipágina...................................................................................................................498
Vista previa ..............................................................................................................................461
Vista previa de documentos web ......................................................................................486
Vista previa de fuente en tiempo real ...............................................................................194
Vista previa de la página web (F12)..................................................................................485
Vista previa de tamaño de fuente en tiempo real ................................................ 194, 222
Vista previa de tu página web .............................................................................................. 30
Vista previa de un objeto flash en MAGIX Web Designer 10 Premium. ................ 423
Vista previa en el navegador...............................................................................................445
Vista previa flash ...................................................................................................................487
Visualización de una presentación.................................................................................... 397
Visualización del contenido de los pasos.........................................................................391
Visualización del punto de anclaje.....................................................................................216
Visualizar fuentes utilizadas ............................................................................................... 228
Visualizar página web...........................................................................................................485
Voltear objetos .........................................................................................................................116

Web Designer y HTML5......................................................................................................446

Widgets de la galería de diseños.......................................................................................399
Widgets de otros sitios de widgets.................................................................................. 404
Widgets de sitios web .........................................................................27, 33, 287, 288, 398
Widgets y marcadores de posición - todo automático ...............................................398
530

Zoom ........................................................................................................................................ 503

Zoom 1: 1.................................................................................................................................. 346
Zoom de foto teniendo en cuenta el contenido .............................................................362
Zoom y desplazamiento de la página ................................................................................. 24

www.magix.es