Documentation

  x 
x
Building A Page
Adding Images
A good Web page needs images. Graphics give you the opportunity to create an esthetically pleasing page, to highlight your trademark or logo, to present your products, and to provide illustrative material that can enable your visitor to visualize important concepts.

WebBuild Express gives you a number of flexible tools for adding and editing images on your site.

We'll start by assuming that you have a source for your images. They could come from:
 
Go to the Web for Updated Help Topics
Table of Contents
Index of Help Topics 
Next Topic
Next Topic
Previous Topic
Previous Topic
  • Photographs taken by a digital camera or scanned from a paper print

  • Drawings and other art created by a computer graphics program or downloaded from the Web

  • Corporate logos, trademarks, and other graphics

  • Animated graphics
It's important when using art that you have gotten from other sources to respect any copyrights that may apply. There are many Web sites where you can get Web art and photographs that are "freeware" -- you have permission to use them freely without paying any fees to the copyright holder. Sometimes such sites request that you credit the source of the artwork or provide a link back to them you should respect such requests. Thousands of other images are available at Web sites and on disks and CD-ROM's for a moderate fee.

Graphics for use in WebBuild Express should be in either of two formats: JPEG or GIF. JPEG (Joint Photographic Editors Group) is the format most commonly used for photographs. GIF (Graphic Interchange Format) is the format most often used for drawings, logos, Web art -- most images that are not photos. If you have images in some other format (TIFF, Bitmap, PNG, etc.), you will have to use a computer graphics program to convert to GIF or JPEG format. There are a number of good computer graphics programs available on the Web for free or for a low cost.

Let's put an image on the page. First start with an empty cell:
First, highlight the words "Empty Cell" and press the backspace or delete key to delete this text.
  
  
Now you can add the image. Either click on "Edit" in the menu, and then "Images", and then "Add", or click on the       icon in the toolbar. You will see a window like:
  
  
Notice that this window has a list (the large pane) of images that are available to the application. When you first start building this site, this list will be empty. Click on the "Add Image" button to add an image to the list.

When you click "Add Image", a window will pop up that will enable you to navigate on your computer to the location of the image. In the example below, the user has gone to a folder on the desktop and located an image (Train.jpg):
  
  
Now, when you click on the "Open" button, the file is added to the list of available images. Note that there is a thumbnail representation of the image in the area to the right of the list:
   
Images and Text in a Single Cell

You can have an image and text in a single cell. By doing so you can get interesting effects as the text wraps around the image.

The following example shows a way of doing this. First, you add an image into an empty cell. (You delete the "Empty Cell" text, click on "Edit" on the menu, click on "Image" and then on "Insert").

When you get to the "Image" screen, add the image to the list (if necessary) and select the picture from the list.
Now, clicking on the "OK" button adds the image to the original cell. If necessary, the cell borders will be extended to contain the image.
Now let's position the cursor to the right of the image and enter text:
  
  
Click "OK" to continue. The image is now added to the cell:
   
Notice how the text wraps to the right of and below the image.

Now let's change the Text formatting, put a border on the cell and change the cell dimensions. Here's how the cell will appear in the published page:
  
House Blend Cofee 
After the site is published, the Alternative Text will appear when a visitor moves the mouse over the image.
  
Site Search
   
 
Copyright 2002-2005 Net Fulfillment Technologies, Inc.
All rights reserved.
 
 
   
  
  

Alternative Text for Images

It is considered good practice to use Alternative Text for most images that you place on a Web page. Alternative text produces a short message over the image when the cursor hovers over it:











Alternative Text will display on browsers that do not support images or where the user has disabled image viewing. Alternative Text is also a neat way to add a little "extra" to your images to further enhance and clarify your site's message.

Alternative Text is especially useful with images used for hyperlinks (see "
Adding Links"). When a visitor to your site hovers over a link image, you can tell him or her what to do, for example: "Click Here to See an Example."

You can add Alternative Text when you add an image or edit one. On the Images screen, just type in the Alternative Text you want in the "Alt" field near the top right of the screen: