How to Add Alt Text to Images Using OzSpeed hPanel

Alt text (alternative text) is a short description added to images on your website that helps search engines and screen readers understand the content of the image. It’s an essential part of Search Engine Optimization (SEO) and improves website accessibility for users with visual impairments. Adding alt text to your images can help boost your search rankings and ensure that your content is inclusive. Here’s a step-by-step guide on how to add alt text using OzSpeed’s hPanel.

---

Step 1: Access the Page Editor in hPanel #

To start adding alt text to your images, open the Page Editor in hPanel.

1. Log in to hPanel at ozspeed.com.au.
2. Go to Website Builder > Edit Site.
3. Select the page where you want to update or add alt text.

Tip: #

• Begin with your most important pages, such as your homepage, blog posts, or product pages, to maximize the SEO benefits.

---

Step 2: Click on the Image You Want to Edit #

Find the image on the page where you want to add alt text.

How to Select the Image: #

1. Click directly on the image in the Page Editor.
2. This will open the Image Settings panel.

Tip: #

• If the image is part of a gallery or slider, select the specific image you want to update from the gallery settings.

---

Step 3: Enter the Alt Text #

The Alt Text field is where you describe the image for search engines and screen readers.

How to Add Alt Text: #

1. Locate the Alt Text field in the Image Settings panel.
2. Enter a brief, descriptive text that accurately reflects the content of the image (e.g., “Woman using a laptop to browse the OzSpeed website”).
3. Click Save to apply the changes.

Tip: #

• Keep your alt text under 125 characters and include relevant keywords naturally, but avoid keyword stuffing.

---

Step 4: Check the Alt Text in the Page Source #

After adding the alt text, you can verify it by checking the HTML source of the page.

How to Verify: #

1. Right-click on the page and select View Page Source.
2. Search for the image using the Ctrl + F (Windows) or Cmd + F (Mac) function.
3. Look for the alt attribute in the image tag (e.g., <img src="image.jpg" alt="Woman using a laptop to browse the OzSpeed website">).

Tip: #

• Ensure that each image has unique alt text to provide specific context and avoid duplication.

---

Step 5: Preview the Page #

Before publishing, preview the page to make sure the images and alt text appear correctly.

How to Preview: #

1. Click Preview in the top toolbar of the Page Editor.
2. Review the images on both desktop and mobile views.
3. Click Exit Preview when you’re satisfied.

Tip: #

• Use a screen reader tool to test how the alt text is read aloud for accessibility purposes.

---

Step 6: Publish the Changes #

Once you’ve confirmed the alt text updates, publish the page to make the changes live on your website.

How to Publish: #

1. Click Publish in the top right corner of the editor.
2. Confirm the changes.

Tip: #

• Regularly update the alt text on your site, especially if you replace images or update content.

---

Best Practices for Writing Alt Text #

1. Be Descriptive: Clearly describe the image content (e.g., “Close-up of a person holding a cup of coffee”).
2. Include Keywords: Use relevant keywords naturally, but avoid stuffing them into the alt text (e.g., “SEO tips infographic showing key strategies”).
3. Keep It Short: Aim for under 125 characters. Long alt text can be cut off by screen readers.
4. Avoid Redundancy: Don’t use phrases like “image of” or “photo of.” Screen readers already identify the element as an image.

---

Troubleshooting Tips #

1. Alt Text Not Showing in Source Code:
   • Ensure you’ve saved the changes in the Image Settings panel.
   • Clear your website cache in hPanel and your browser cache.
2. Alt Text Doesn’t Improve SEO:
   • Make sure your alt text is descriptive and includes relevant keywords.
   • Use unique alt text for each image on the page to avoid duplicate content issues.
3. Accessibility Issues:
   • Test your website with a screen reader tool to ensure the alt text is helpful for users with visual impairments.
   • Use simple, clear language in your descriptions.

---

Additional Tips: #

• Optimize All Images: Don’t just focus on featured images. Add alt text to logos, icons, and background images if they convey meaningful content.
• Use Descriptive File Names: Rename your image files to include relevant keywords before uploading them (e.g., “ozspeed-hosting-dashboard.jpg”).
• Monitor Performance: Track the performance of your images using Google Search Console to see how they appear in image search results.