7.0
Table Of Contents
- Purchasing and unlocking Xara Web Designer 7 Premium
- Support
- What is new in Xara Web Designer 7 Premium?
- Introduction
- Getting Help
- Getting Started
- Program Layout
- Objects On The Page
- Object Based Web Design
- The Selector Tool
- Website Toolbar
- Creating a website
- Previewing Your Website
- Using Templates, Clipart & Widgets
- Website Colors
- Photos
- Text
- Page Size
- Saving Your Work. Creating A Website
- Stretchy Objects
- Groups
- Repeating Objects
- Links, Buttons & Navigation Bars
- Drawing Tools
- Right-click menus
- Layers, Mouseover (Rollover) & Pop-ups
- Creating Buttons, Banners And Other Web Graphics
- Publishing Your Website
- Document handling
- Starting Xara Web Designer 7 Premium
- Starting a new document
- Opening an existing document
- The Xara Web Designer 7 Premium window
- Opening a second window
- Changing the zoom value
- Sliding the document within the window
- Changing the page size
- Multiple pages in the document
- Saving the document
- Support folders
- Closing the document
- Automatic Backups
- On-screen grid
- Rulers
- View quality
- Galleries
- Displaying a gallery
- Moving and docking a gallery
- Grouping galleries
- Using galleries
- Selecting items
- Re-ordering items in the gallery
- Searching for an item name
- Adding to a gallery
- Deleting sections from a gallery
- Closing a gallery
- Removing a gallery from the workspace
- Restoring the default control bars/galleries
- Undo and Redo
- Object Handling
- The Selector Tool
- Moving objects
- Removing objects from the document
- Duplicating and cloning
- Moving objects forward and backwards
- Rotating objects
- Scaling (resizing) objects
- Flipping objects
- Stretching and squashing objects
- Skewing objects
- The Mold tool
- Snapping
- Guide Objects and Guidelines
- Summary of shortcuts on the numeric keypad
- Grouping and ungrouping objects
- Soft Groups
- Alignment
- Copying Styles: Paste Attributes
- Naming objects
- Repeating Objects
- Drawing Lines and Shapes
- Drawing a line or shape
- The Freehand & Brush Tool
- Editing lines/shapes with the Freehand & Brush Tool
- The Straight Line & Arrow tool
- The Shape Editor tool
- Extending the line
- Finishing the line
- Adding a new point handle
- Selecting multiple point handles
- Deleting points
- Moving point handles—Shape Editor Tool
- Smoothing a line
- Constraining the line
- Changing curves
- Changing a straight line to a curve (and vice versa)
- Joining lines
- Splitting a shape
- Changing the line width (thickness)
- Line Gallery
- Shape Handling
- Color Handling
- The color line
- Applying fill & line colors by drag & drop
- Editing an object’s color
- The Color Editor
- Local colors and Theme colors
- Theme color schemes
- Creating your own color schemes
- Creating new named colors
- Editing named colors
- Normal colors, Tints, Shades and Linked colors
- Creating a Tint, Shade or Linked color
- Text Handling
- Introduction
- Terminology
- The Text Tool
- The Font Menu
- Simple text
- Text in a column
- Text areas
- Text along a curve
- Editing text
- Spell checker
- Find & Replace
- Synchronising Text using Soft Groups
- Tabs, Margins and Indents
- Repelling text objects
- Anchored Graphics
- Applying text styles
- Text links
- Text inside groups for websites
- Copying text styles
- Copying/Pasting formatted text (RTF)
- Seeing fonts in use
- Font embedding
- Browser text compatibility
- The Fill Tool
- Shadows
- Transparency
- Bevels
- Masks
- Web Properties Dialog
- Photo Handling
- Introduction
- Photo Objects
- Photo Groups
- Importing Photos
- Photo resolution
- Zero-memory Copies
- The Bitmap Gallery
- Embedded JPEG files
- Lossless vs. Lossy
- Blending & Merging photos
- Photo display quality
- Saving & Exporting Photos
- Photo Edit Attributes
- Editing the outline of Photos
- Cropping photos
- Cropping photos with a mask
- Cutting objects out of photos
- Screen capture utility
- Coloring photos
- Integration with external Photo Editors
- Resize, rotate and position a photo within its frame
- Horizon Straighten
- Viewing a scaled photo at its full size
- Making a photo its full size
- Optimizing Photos and Bitmaps
- Photo Documents
- Editing Photo Files
- The Photo Tools
- 3D Extrude Tool
- Navigation Bars
- Using template Navbars
- Navigation bar properties dialog
- Site navigation bar
- Buttons & Menus
- Updating your Navbar across all pages
- On canvas editing
- Changing the font on Navbar buttons
- Importing & pasting Navbars
- Creating your own Navigation Bars
- Button margins
- Advanced - Editing a Navbar button design
- Navbars with different first or last buttons
- Website Presentations
- The Presentation toolbar
- Creating a presentation
- Managing presentation steps
- Adding new presentation pages
- Deleting presentation pages
- Linking to next/previous step
- Applying transitions to presentation step links
- Applying presentation step transitions
- Applying presentation page transitions
- Advanced presentation information
- Hosting remote presentation sessions
- Website Widgets
- Page & Layer Gallery
- Animations
- Introduction
- Core Principles
- Your First Animation
- Exporting a Flash File
- Exporting animations as AVI
- The Animation Frame Gallery
- Photos
- Animation Frame Rate and Tween Steps
- Cropping, Clipping and Animation Size
- Animation Speed
- Animation smoothness
- Rotation
- Groups
- What Xara Web Designer 7 Premium features does Flash support?
- Color Transforms—Animating Color Changes
- Transparency
- URLs in Flash
- Advanced Flash Commands
- Xara Web Designer 7 Premium Flash Animation Summary
- Creating animated GIFs
- Animation properties
- Printing
- Importing and Exporting
- Customizing Web Designer Premium
- Changing the blank template document
- Displaying your own icons in browser tabs: favicons
- Options in the Utilities menu
- General tab
- Recent file list size
- Current layer always visible and editable
- Ask before setting current attribute
- Make groups be transparent as a whole.
- Maintain imported layer names
- Marquee Object Selection
- Angle constraint
- Document is intended to be a website
- Show Windows compatible text lengths
- Nudge size
- Duplication distance
- Grid and Ruler tab
- Mouse tab
- Page Size tab
- Backups Tab
- Control bars
- Menus and Keyboard Shortcuts
- Introduction
- File menu
- New (Standard control bar or Ctrl+N)
- New from Designs Gallery
- Open (Standard control bar or Ctrl+O)
- Open recent
- Close (Ctrl+W)
- Save (Standard control bar or Ctrl+S)
- Save As
- Save All
- Save Template
- Import (Ctrl+Alt+I)
- Export (Ctrl+Shift+E)
- Export JPEG
- Export PNG
- Preview web page (F12)
- Preview Website
- Export Website
- Publish Website
- Preview Flash
- Export Animation
- Document Info
- Page Options
- Printer Setup
- Print Options
- Print (Ctrl+P)
- Exit
- Edit menu
- Undo (Standard control bar or Ctrl+Z)
- Redo (Standard control bar or Ctrl+Y)
- Cut (Edit control bar or Ctrl+X)
- Copy (Edit control bar or Ctrl+C)
- Paste (Edit control bar or Ctrl+V)
- Delete (Edit & Standard control bars or Delete)
- Select All (Ctrl+A)
- Clear Selection / Reset current attributes (Esc)
- Duplicate (Edit control bar or Ctrl+Alt+D)
- Clone (Ctrl+K)
- Pages
- Arrange menu
- Move to Layer in Front (Arrange control bar or Ctrl+Shift+U)
- Bring to Front (Arrange control bar or Ctrl+F)
- Move Forwards (Arrange control bar or Ctrl+Shift+F)
- Move Backwards (Arrange control bar or Ctrl+Shift+B)
- Put to Back (Arrange control bar or Ctrl+B)
- Move To Layer Behind (Arrange control bar or Ctrl+Shift+D)
- Group (Arrange control bar or Ctrl+G)
- Ungroup (Arrange control bar or Ctrl+U)
- Apply soft group (Ctrl+Alt+G)
- Remove soft group (Ctrl+Alt+U)
- Alignment (Ctrl+Shift+L)
- Fit Text to Curve/Remove Text From Curve
- Repelling and Anchoring
- Create Navigation Bar
- Repeat on all pages (Shift+Ctrl+Alt+R)
- Stop updating (Shift+Ctrl+Alt+O)
- Utilities menu
- Window menu
- Clear Selection / Reset current attributes (Esc)
- Multiple Page View
- New View
- Arrange Views
- Animation
- Show Scrollbars
- Show Rulers (Ctrl + L)
- Control Bars
- Quality (Standard control bar)
- Show Document Tabs
- Full Screen (8 on numeric keypad)
- Show Grid (#)
- Show Guides (1 on numeric keypad)
- Show Print Borders
- Snap to Grid (. on numeric keypad)
- More about Xara Group
- Legal
There you can change how your pop-up appears. One option allows you to place a title above each
pop-up photo. Set the title for each photo using the Title field. You can also optionally show a caption
below each popup photo. Just set the Image Caption (Alt text) for the thumbnail on the same dialog.
See the popup photo section
of the Web Properties Dialog chapter for full details of the options available.
In Internet Explorer the Image caption ("ALT"-Text) will be also shown in a tooltip pop-up as you
mouse-over the image. To show different text, typically something like 'Click to enlarge' as you move
over the thumbnail image, go to the Mouse-over tab and set Show pop-up text to be Click to Enlarge
.
Photo Resolution - It's All Automatic!
When importing high resolution photos (anything above 1920 pixels either wide or high) into a web
document, Xara Web Designer 7 Premium automatically resizes the photo down to HD screen size
without asking you if you want to import a lower resolution version. For a web document, even at the
reduced size, there should be more than enough resolution in your photos for high quality results on your
website, so it's rarely necessary to import digital camera images at full resolution for web use.
However, if you are importing a large photo into a print or animation document, Xara Web Designer 7
Premium asks you if you want to import a lower resolution version of your photos. If your document is to
include many photos, you may want to choose this reduced resolution option. Otherwise with large
photos you may find that your saved design file is much bigger than it needs to be (because it contains a
copy of each of your photos) and you may not have enough memory in your computer to load, edit and
export your documents.
If you're not sure whether you will need the full resolution photo you can import the original photo and
then optimize it down later. To optimize a photo, right click on it and choose the Optimize option from
the context menu. Or you can optimize all the JPEG photos in your document at once, using "Utilities"
> "Optimize all JPEGs"
.
Web Designer Premium always stores the full resolution image (unless you chose to import reduced
resolution images when asked during import, as mentioned above). This means you can resize or crop
your image as required with no loss of quality. Web Designer Premium automatically converts all photos
into the correct resolution JPEG image when saving your website. You do not need to bother about dpi,
image size, pixels or anything like that. What you see in Web Designer Premium (at 100% zoom) is
exactly what will be produced on your web page.
If you want to size a photo, or any object, to a specific size, just enter the required size into the Selector
Tool
InfoBar width or height fields.
When you drop a photo on the page (assuming you're not replacing an existing photo), it's sized to be
500 pixels wide. But if you want this to be exactly 200 pixels wide, just enter 200pix into the W size field
of the Selector Tool
. You can enter it in any unit e.g. entering 2in will make it 2 inches wide.
Page 92










