Hi there,
I want to be able to add an image whereby the content in the image is readable by google for SEO purposes.
The reason I would like to add an image, is because my design is complex and can’t be created as an add on.
Very generally speaking that’s the purpose of an alt text attribute - it’s a text equivalent (or at least explanation) of an image, for users that might be visually impaired and are using accessibility tools such as screen readers.
Search engines will also refer to this text. Google and others are likely to see this as something to index the image, rather than treat it as full page content, but it still helps for SEO to have meaningful and relevant text in the alt attribute.
What’d I’d recommend though would be:
- add an alt attribute to your image, something that specifically but succinctly describes the image ‘a chart of beer sales in the UK, showing an upwards trend of craft beer’
- underneath the image try to just add some normal content that covers the meaning behind the image, maybe go into a bit more detail. You could potentially hide this content, but I’d encourage you not to. If you do hide it, don’t just do it with ‘display: none’, look to hide it with some CSS specifically meant to hide content but keep it available to screen readers. Frameworks like bootstrap have ‘visually-hidden’ class for this purpose: Visually hidden · Bootstrap v5.0
Then you’ve sort of got the best of both worlds, you’re using appropriate alt attributes for accessibility, but you’re not 100% reliant on it for SEO purposes. And the additional explanation underneath might be great for all users. Remember that some users may have difficulty understanding graphics/graphs, and would benefit from additional explanations.
What you’ve specifically asked about SEO, content that is set up for good accessibility and readability tends to be good for SEO as well.
1 Like