Colorful, evocative images are perhaps the most vibrant part of web content that easily to works in most web browsers. Some browsers, however—those for the blind, those with slow connections, and many more—do not display images at all, and we must be sure to add images to a page in a way that does not descriminate against these users.
Adding Images: the
image icon
The image icon allows you to upload, insert and customize images for your web pages. Clicking the image icon will open a pop-up window that lets you choose an image to insert.
Uploading an Image

The "Upload an Image" fieldset allows you to upload an image to the web server. Clicking "browse" navigates your computer for an image, which you can upload by clicking upload file.
The WYSIWYG
Editor only allows yout upload images with dimensions less than 500
pixels by 500 pixels and smaller than 80 kilobytes. Larger images may
be uploaded via the "Images" section of the Content management system.
Remember, however, that the content area of Alma's template is only 495
pixels wide—larger images will disrupt page layout.
Inserting an image
Navigating to an image in the left-hand menu of the image window or typing the image address directly into the "Source" field and clicking "OK" will insert the image into your web page.
Customizing Images
Selecting an image and clicking the image button, or clicking "Next..." from the Insert Image window will give you serveral options to customizing your image.
| Field | Description |
|---|---|
| Source | The location of your image |
| Width/Height | The width and height of your image. Changing one will cause the other field to change by the same scale. |
| Shrinking large images does not decrease their file size: they will still take a long time to load with slow connections. Avoid changing image sizes. | |
| Title | A description of the image for browsers that do not display images. Although optional, image descriptions are essential to good page design |
| Alignment | Sets the alignment of the image within the text. A preview below shows an example of how the image will align. |
| Margin | Offsets any text or objects from the image by this number of pixels |

