Embedded audio and video

Extensions
103

Personally, I would say that ![]() is the best solution as it already is a media embedding, on the other hand, for backend rendering of markdown this will hurt rendering time a lot as they have to check source type for video/mp4 or audio/mp3 to determine the source type which is 900ms slower than just a normal embed. So 3 simple images will add a time of 2700ms while the standard ![]() only use 300ms (100ms/image).

Tested in PHP 7.3

I don’t like the idea of adding new syntax but I have to admit that $[]() and @[]() isn’t a bad idea

104

what do you think of this? markua by Leanpub.com

105

I read through this thread a few weeks ago and couldn’t come up with a case in which mp4 was used for audio only.

Today after downloading an audio note from WhatsApp saw that, even though it’s an audio note, it’s using the mp4 format. Definitely not a common practice but it’s out there.

A standard way to generate video tags in Markdown would be awesome. At the moment I’m using regular expressions for video (and image to figures using the alt as caption) expansions.

1 Like
106

After coming back to this topic which I created years ago, I’ve been able to look at this from a fresh perspective.

There’s a few corner cases like what @nonoesp posted which might create potential confusion for a syntax that originally file extension-independent. If there’s ever an image extension that clashes with an audio or video extension in the future (e.g. if someone introduces a .ogg, .mp4, or .webm for images) we’d have a problem.

Perhaps these issues are not enough to be blockers, but there’s also a nicer syntax that we could use for file extension based content blocks:

Because this syntax is intended to be file extension based from the start, there’s no question confusion about the existing behaviour of the Markdown image syntax - it’s a clean break from existing syntax that is also simpler for writers. It also improves how images are embedded by placing them inside figures. I’d be in favour of uniting around this syntax (as an extension to the main spec) for embedded content instead.

1 Like
107

Using content blocks would really simplify things.

Here’s a link with the initial announcement of that specification, which were introduced in iA Writer 4 some time ago.

github.com/iainc/Markdown-Content-Blocks

The major distinction is between “online” and “local” embeddings (and I’d guess that what makes more sense here are “online” embeddings).

1 Like
108

For local embedded content, the iA Writer content block syntax would work well:

/directory/video.mp4

For online embedded content (from another domain), the spec could support just pasting in a URL ending with a video file extension:

https://example.com/directory/video.mp4

The latter syntax was suggested by John Gruber for images, instead of the current image syntax, which he describes as his “biggest mistake” with Markdown.

1 Like
109

That makes a lot of sense, @chrisalley.

110

Are there any ideas on how to go about adding closed captions to videos and audio?

I’m developing an education platform where accessibility is pretty important (as it should be everywhere on the web). Users should have the option—and be encouraged—to add captioning to any uploads containing audio.

HTML has the <track> element to accommodate this, which you can add as a child element to <video> and <audio>:

<video controls src="/media/cc0-videos/friday.mp4">
  <track default kind="captions" srclang="en" src="/media/examples/friday.vtt" />
  Download the
  <a href="/media/cc0-videos/friday.mp4">MP4</a>
  video, and
  <a href="/media/examples/friday.vtt">subtitles</a>.
</video>

However I haven’t found a single markdown plugin which supports adding tracks to your videos.

I will probably end up writing a plugin my self with some syntax such as:

![Alt text](/path/to/video.webv en="/path/to/video.en.vtt")

which would compile to something like:

<video controls src="/path/to/video.webv">
  <track kind="captions" srclang="en" src="/path/to/video.en.vtt" />
  Alt Text
  Download the
  <a href="/path/to/video.webm">WEBM video</a>, and the
  <a href="/path/to/video.en.vtt">English subtitles</a>.
</video>

However I think any discussion about media embedding in Markdown should include the possibility of captioning in multiple languages.