top of page

How to Add Images within the Wix Editor with Proper Alt Text Descriptions

Writer's picture: Ron SchindlerRon Schindler

Meeting Accessibility Guidelines

an individual with their head in their hand with long hair hanging down. Text is written across the person's shirt.
Properly label all images with Alt Text

In today's digital age, creating accessible content is not just about following guidelines, but ensuring that everyone, regardless of their abilities, can interact with your website. One essential part of this is adding images with proper alternate descriptions (alt text) in Wix Editor. Alt text not only helps visually impaired users understand the content but also improves your site's SEO. This guide will walk you through the process of adding images with appropriate alt text in the Wix Editor.


Why Alt Text is Important

Accessibility

Alt text provides a textual alternative to non-text content in web pages. Screen readers use alt text to describe images to visually impaired users, ensuring that they can understand the content and context of the images. So make sure you can feel what you are describing.

SEO Benefits

Search engines cannot interpret images directly. Alt text helps search engines understand the content of images, which can improve your site's search engine ranking and drive more traffic.


Steps to Add Images with Alt Text in Wix Editor

Step 1: Access Wix Editor

To begin, log in to your Wix account and open the website you wish to edit. Click on "Edit Site" to access the Wix Editor.


A screen capture of the "Add Image" navigation in the Wix Editor showing options of Site Files or Media from Wix
A screen capture of the "Add Image" navigation in the Wix Editor showing options of Site Files or Media from Wix

Step 2: Add an Image

·         Click on the "Add" (+) button on the left side of the editor.

·         Select "Image" from the list of elements.

·         Choose "My Image Uploads" to upload a new image or select an image from Wix's free image library.

·         Click "Add to Page" to place the image on your webpage.

Step 3: Add Alt Text to the Image

·         Click on the image you have added to select it. A toolbar will appear above the image.

·         Click on the "Settings" icon in the toolbar. This will open the Image Settings panel.

·         In the Image Settings panel, find the "What's in the image? Tell Google" field. This is where you can add your alt text.

·         Enter a descriptive and concise alt text that accurately describes the image. For example, if the image is of a sunset over a beach, you could write "Sunset over a beach with orange and pink hues."

·         Click "Done" to save your changes.

Step 4: Optimize Alt Text for SEO

an image of a balloon just above a lake surrounded by trees at sunset.
an image of the sunset over a lake with glassy water with trees all around as seen from rental balloons from Rent-A-View

While adding alt text, consider the following SEO tips:

·         Use relevant keywords that describe the image.

·         Keep the description concise and avoid keyword stuffing.

·         Ensure the alt text is contextually relevant to the surrounding content.

Step 5: Preview and Publish

Once you have added and optimized the alt text for your image, preview your website to ensure everything looks correct. Click the "Preview" button at the top right corner of the editor. If satisfied, click on "Publish" to make your changes live.


Other Images for Galleries, Repeaters, and Lists

Gallery Images

Besides the example of adding images through the "Add Image" option, you may find an image in another place that doesn't have the settings in the same place as explained above. For example, in a Gallery, you must go into the "Manage Media" option to see all of the images that are part of your gallery and as you select each image, you will have options on the right to add information. One of those is the Alt Text information.


Backgrounds in Strips, Sections, and Columns

Images may also be part of a background within a strip or column of a strip. They may be a background of a section or a page. To enter your Alt Text information on these images, you need to select the object (page, section, column, strip, etc.), then choose "Change Background". In the popup window, choose the settings. this brings up the image settings. If you scroll to the bottom, you will see the "What's in the Image" box. That is where you add your alternate text for the background image. There is not a save option, just exit out when done.


Exceptions to the Above

If you find other images not covered by the above, click around or right click, control click, to find the settings for the image.


Best Practices for Writing Alt Text

Infographic of things to remember when working with Alt text for images. Used for blog post on Alternate descriptions by RonSchindler.com
Infographic describing useful steps to remember when marking images with alternate text for SEO. Provided by RonSchindler.com

Be Descriptive

Provide enough detail to give context but avoid overly lengthy descriptions. Aim for clear and concise text that adequately describes the image content.

Avoid Redundancy

Do not repeat information that is already provided in the caption or surrounding text. Alt text should add value and information that is not immediately obvious from the rest of the content.

Use Keywords Mindfully

Incorporate keywords naturally without forcing them into the description. The primary goal is to convey the image's content accurately, with SEO being a secondary benefit.

Handle Decorative Images

If the image is purely decorative and does not add informational value, you can set the alt text as empty (alt="") to indicate that the image is not important for context.

Alt Text Tips Conclusion

Adding images with proper alternate descriptions in Wix Editor is a crucial step in creating an accessible and SEO-friendly website. By following the steps and best practices outlined in this guide, you can ensure that your website is inclusive and provides a better user experience for everyone. Remember, accessibility is an ongoing process, and staying updated with the latest guidelines and best practices is essential for maintaining an inclusive digital presence.



2 views0 comments

Recent Posts

See All

Comments


bottom of page