Menu
Can I add an alt info for the image used as the poster in HTML5?
<video controls poster="/images/w3html5.gif">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
496
Alt text can be read by screen readers, and helps people who are blind or who have low vision understand what images and other objects are in a document. You can add alt text to objects, such as pictures, clip art, charts, tables, shapes, SmartArt, embedded objects, and audio or video objects.
Simply add an alt attribute to the <img> tag in the HTML code. If you're using a modern CMS, it should be possible to add alt text without having to dig into the HTML code. For example, in WordPress, there's a field for alt text when adding an image to a page or post: Things are similar in other CMS'.
To add alt text, simply include alt=”” attribute within the image tag.
Just because it is an image does not imply that it will behave like an <img> tag. In fact in this case it is not even a tag, and there would be no way to do that.
Nesting <img> inside <video> would not have the desired effect, since the browser will interpret it only if it doesn't know about <video> tag at all (i.e. an old browser), and this is not the demographic you are shooting for.
What are you attempting to do here?
If you are adding alt to achieve some sort of search engine optimisation, then you should only do so in the event that search engine will actually recognise it as legitimate text to index and identify with the image in question. In this case it may very well be a good idea to add an <img> inside your <video> as so:
<video poster='image.png'>
<source .../>
<img src='image.png' alt='Image showing a cute cat' />
Unfortunately your browser is too old.
</video>
If, on the other hand, you are attempting to do this to enable screen-reader to understand what is displayed there; then you are in much more trouble, since they are usually smarter than most search engines, and will often read text under the cursor. The approach above will not work, since <img> will not be displayed at all. I don't know enough about screen readers to help you further.
153
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
