Best way to add text over video in a HTML5 web banner?

Question

I need to add some copy over a HTML5 banner however I am not sure the best way to do so, I know you can’t add text over a video using layers. The options I have discovered are:

Making the video into an image sequence and creating it this way (but it is a lot of frames)
Adding the text in After Effects and then importing the video into Animate
Adding the text in with HTML/JS but I’d need a very beginner level tutorial on how to do this

I also am not sure what is best practice for using video in general, as keeping the file format as small as possible is important.

If anyone has some advice or a better suggestion about how I could achieve this, that would be amazing!

Thank you

Colin Holgate · Accepted Answer

The way I found to add the video is through the component menu? This was the only way I could find how to do it?

That's the way I would do it, but then I don't care about the 8k overhead!

If you want to add your own video to the page at run time, read discussions like this one:

javascript - Dynamically create a HTML5 video element without it being shown in the page - Stack Overflow

Colin Holgate · Answer

You're adding the video using an HTML5 Component. Do the same with the text, then it will be on top of the video.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded