Mexabet Website Builder End User Guide
Working With Images:
Table of Contents: INTRODUCTION. GETTING STARTED. BUILDING YOUR SITE WITH SITE BUILDER. WORKING WITH IMAGES. WORKING WITH FLASH MOVIES. WORKING WITH MEDIA FILES. ADDING A PAGE TO YOUR WEB SITE. CREATING A NEW FOLDER. RENAMING A FILE OR FOLDER. COPYING A FILE. DELETING A FILE. UPDATING SITE OPTIONS. UPLOADING A FILE. GLOSSARY.

WORKING WITH IMAGES

Images on the web

Images are used to add photos and animations (such as your company’s logo and product pictures)
to your web pages.

There are two main types of image files you will use, ‘.gif’ and ‘.jpeg/.jpg’.

GIF is an acronym is for Graphics Interchange Format, created so that images could be exchanged regardless of which operating system you were on. The file format is known for its compression and the fact that it can store and display multiple images for animation. The major drawback to GIF is that images that images are displayed with less colors than JPEG files, which doesn’t make GIF’s the best choice for photographic images.

You would choose the .GIF format for:

  • Images with a transparent background.
  • Animated graphics
  • Less complex images containing 256 colors or less

JPEG/JPG is an acronym for (developed by) theJoint Photographic Experts Group. This file format is the Internet standard for presenting photo realistic images. It has the capability to compress large images down to very small file sizes while retaining the overall photographic quality of the image.

You would choose the .JPG format for:

  • Photographs
  • More complex images
  •  When you can get better quality AND a smaller file size (using a method called compression)

Like HTML files, image files also have a filename.extension. For example:

  • smile.jpg is a JPEG (a compressed digital image file format) named “smile”
  • laugh.gif is a GIF (a graphics file format) named “laugh”.
Image Manager


The Image Manager is similar to the File Manager, the difference being - it is an area where you can see your image files and image folders. In the image manager you will see:
  • The name and optionally a preview shot of the image for quick reference.
  • The size of your images.
  • When you put your mouse over certain text or icons, a comment will appear which tells you what clicking on the link will do. Links are view, insert, backgd, rename, copy and delete.

Note that image files are not editable in this editor.

The image manager allows you to organize your image files into relevant groups of folders. This software application has a very simple to use, yet powerful Image Manager that makes it easy to organize your image files and folders.

For Images you can:


- Insert

- Set as background

- Upload

- View

- Copy

- Rename

- Delete

 

 

All folders are represented with the folder       icon and files all image files have a small preview.
The Current Working Directory, located directly above the Images, will at all times reflect your current location in the file system, relative to your document root.

Uploading an Image

You may want to upload an image to keep it handy in the image manager for inserting into your web pages. You can upload an image for later use or to insert into your pages as many times as needed. Your uploaded images can be viewed as thumbnails (smaller versions of the actual image – for easy browsing).

To upload an image:

  1. Click the 'Browse' button to open a 'Choose File' box that allows you to select a local image to upload.
  2. Once the file has been selected, click 'Go' to begin uploading the file.

Upon successful upload of the image, you will be taken back to the Image Manager.
Once your image has been successfully uploaded, you will receive the following message:


Viewing an Image

You may need to view an image to see what it will look like when displayed on your website. Viewing an image doesn’t change it.

To view an image:

  1. Select the desired image and click on it in the list of images. The image will be shown in the preview area on the right side of the image manager. Click the image in the preview area to see it in full size.

Close the window to return to the site builder/editor.


Inserting an Image

Once you have uploaded an image, you can insert it where you need to. Just select the area on your page you want the image, and select browse the images to select the image you need.

To insert an image:

Click the 'Insert Image' button in the image browser at the bottom of the screen.

Set background Image

There may be a certain image you have uploaded that you want to set as the background image of your web page.

To set an image as a background image:

Click the Background  icon in the image browser next to the image to be set. The image will be set as the current page background image.

Renaming an Image or a Folder



When creating a file or folder, you may have chosen a name that you then decide is not appropriate or needs to be changed to reflect its contents or context better. The ‘rename’ function will allow you to easily change the name of the file or folder as you require.

To rename:

1. Select the desired image or folder and click on the Rename  icon. 2. Enter a valid name and click 'OK' to rename, or click 'Cancel' to be taken back to the Image Manager. Valid image names consist of
            - Alphanumeric characters (a-z, A-Z 0-9)
            - The underscore '_' or a dash '-'.
            - MUST have a single dot '.' and be followed by an extension.


Deleting an Image file or Folder

You may no longer have a need for a certain file or folder. You can choose to keep it, or if you are sure it doesn’t need to be used again, you can PERMANENTLY delete it. Only use the delete function if you are sure you do not need the file/folder and its contents.

To delete:

  1. Select the desired image or folder and click on the 'Delete' icon. You will be prompted for confirmation of the deletion.
  2. If you are sure you wish to delete the selected image/folder, click 'OK'. Clicking on 'Cancel' will take you back to the Image Manager.