Image Properties (CK Editor)

The properties window can be accessed by double-clicking the image, or highlighting, then selecting the 'Image' icon from the toolbar.

Image properties can be broken down into these sub-sections:

URL

This is the 'location' of the image within your website. This automatically gets inserted once an image is selected from your library. No action is required on your part, but if you would like to use a different image, click the Browse Server button to select a new one.

Alternative Text

This feature serves a dual purpose. First, if used consistently, it can help with  SEO rankings, which is why we recommend it. Second, it is picked up and narrated by screen readers to their users. These are machines which will read web content to blind or visually impaired individuals. 

Enter a few words or a brief phrase describing the image. Make sure that the image is placed close to relative content. 

Examples:

Good: "Work Meeting"

Better: "Architectural Design Meeting"

Dimensions & Proportions

Width and Height can be specified here. The 'Lock' icon will constrain proportions. This means when one dimension is changed, the other will adjust accordingly. This is used to preserve its quality, preventing the image from appearing stretched or distorted.

Always make sure the ' Lock' icon is closed. If for any reason it is not, click it once.


Border

This will add a black border to your image. The larger the number, the thicker the border. (We recommend 1 or 2.)

HSpace & VSpace

These stand for horizontal and vertical space, respectively. When these features are used, the image is given padding (space) from the rest of the content.

HSpace will apply the specified padding amount to both the left and right of the image. (We recommend between 5 and 10.)

VSpace will apply the specified padding amount to both the top and bottom of the image. (We recommend between 5 and 10.)

Use the preview box to see how your positioning adjustments will reflect on your image.

Alignment

Alignment will shift your image to the left or right of the screen and will force the content to wrap around it.

Still need help? Contact Us Contact Us