Images
Images are inserted into the content using the WYSIWYG content editor. Images must be uploaded to the server using the File Manager or they can be uploaded from directly from your computer.
To insert an image:
Place the cursor where the image will be inserted.
Click on the insert image icon.
When the image picker window opens, navigate to the directory where the image is located and look for the image file name. The default image directory is the root directory for your site. (http://www.your-site-name.com/images/). If you are uploading the image from your computer click on the browse button to select locate and upload the image.
Click on the image name or click on the check box to select the image. A preview of the image will appear.
Set the image properties. Image properties include:
- Alternate Text - Text to display if images are turned off on the internet browser. Alternative text is also used to comply with Section 508 accessibility guidelines. Screen readers will read the descriptive text. You can use the Long Description field if the image is too complex to describe using a short descriptive phrase.
- Alignment - how the image should be aligned in the content page
- Width - In most cases it is better to re-size the image to the correct width rather than adding it with an image property
- Image Border - Selects the width of the image border (color established by style sheet). If border is set to "0" then the image will not have a border.
Click on the Insert button.
Once the image is inserted, it can be dragged and dropped to other areas of the page.
Image Best Practices
- Resize images before placing them on a web page. Image sizes greater than 100 KB will cause your pages to load slowly.
- Resizing images with the WYSIWYG by selecting a width can cause your images to look grainy.
- Do not upload images larger than 150K in size. Larger images will slow down the loading of your site!
- JPG/JPEG files are good for photos
- GIF images are good for Animated or Transparent web images.
- PNG good for transparent images. PNG images are very common on the web.
