Skip to content

Commit 27bceea

Browse files
bsmthpepelsbey
andauthored
chore(ia): reorg Web/Media (#37898)
* chore: move media guides * chore: move media guides * feat: add mediasidebar, tidy media dir * feat: add mediasidebar * feat: add mediasidebar * feat: add mediasidebar * chore: revert sidebar / fmconfig changes * chore: revert web/html/element to resolve conflict * chore: add mediasidebar, fix redirects * chore: revert unrelated changes * chore(ia): update redirects from main * chore(ia): update manifest ref from main * Update files/en-us/web/media/guides/audio_and_video_delivery/cross-browser_audio_basics/index.md Co-authored-by: Vadim Makeev <hi@pepelsbey.dev> --------- Co-authored-by: Vadim Makeev <hi@pepelsbey.dev>
1 parent 32e4a82 commit 27bceea

139 files changed

Lines changed: 638 additions & 656 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

files/en-us/_redirects.txt

Lines changed: 81 additions & 55 deletions
Large diffs are not rendered by default.

files/en-us/_wikihistory.json

Lines changed: 27 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -121927,7 +121927,7 @@
121927121927
"Bean2223"
121928121928
]
121929121929
},
121930-
"Web/Media/Audio_and_video_delivery": {
121930+
"Web/Media/Guides/Audio_and_video_delivery": {
121931121931
"modified": "2020-12-11T05:27:12.652Z",
121932121932
"contributors": [
121933121933
"bershanskiy",
@@ -121941,7 +121941,7 @@
121941121941
"FredB"
121942121942
]
121943121943
},
121944-
"Web/Media/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video": {
121944+
"Web/Media/Guides/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video": {
121945121945
"modified": "2019-03-18T20:51:47.296Z",
121946121946
"contributors": [
121947121947
"chrisdavidmills",
@@ -121958,7 +121958,7 @@
121958121958
"MartinRinehart"
121959121959
]
121960121960
},
121961-
"Web/Media/Audio_and_video_delivery/Cross-browser_audio_basics": {
121961+
"Web/Media/Guides/Audio_and_video_delivery/Cross-browser_audio_basics": {
121962121962
"modified": "2020-11-16T08:10:17.867Z",
121963121963
"contributors": [
121964121964
"chrisdavidmills",
@@ -121974,7 +121974,7 @@
121974121974
"maboa"
121975121975
]
121976121976
},
121977-
"Web/Media/Audio_and_video_delivery/Live_streaming_web_audio_and_video": {
121977+
"Web/Media/Guides/Audio_and_video_delivery/Live_streaming_web_audio_and_video": {
121978121978
"modified": "2019-04-02T11:11:28.390Z",
121979121979
"contributors": [
121980121980
"kenrick95",
@@ -121990,15 +121990,15 @@
121990121990
"maboa"
121991121991
]
121992121992
},
121993-
"Web/Media/Audio_and_video_delivery/Setting_up_adaptive_streaming_media_sources": {
121993+
"Web/Media/Guides/Audio_and_video_delivery/Setting_up_adaptive_streaming_media_sources": {
121994121994
"modified": "2019-03-18T20:51:46.989Z",
121995121995
"contributors": ["chrisdavidmills", "mfuji09", "obax", "rybi", "maboa"]
121996121996
},
121997-
"Web/Media/Audio_and_video_delivery/Video_player_styling_basics": {
121997+
"Web/Media/Guides/Audio_and_video_delivery/Video_player_styling_basics": {
121998121998
"modified": "2019-09-06T13:44:57.765Z",
121999121999
"contributors": ["agdillon", "DeltaTV", "chrisdavidmills"]
122000122000
},
122001-
"Web/Media/Audio_and_video_delivery/WebAudio_playbackRate_explained": {
122001+
"Web/Media/Guides/Audio_and_video_delivery/WebAudio_playbackRate_explained": {
122002122002
"modified": "2019-03-18T20:51:48.122Z",
122003122003
"contributors": [
122004122004
"chrisdavidmills",
@@ -122007,7 +122007,7 @@
122007122007
"teoli"
122008122008
]
122009122009
},
122010-
"Web/Media/Audio_and_video_delivery/buffering_seeking_time_ranges": {
122010+
"Web/Media/Guides/Audio_and_video_delivery/buffering_seeking_time_ranges": {
122011122011
"modified": "2019-04-12T10:12:05.792Z",
122012122012
"contributors": [
122013122013
"industral",
@@ -122017,7 +122017,7 @@
122017122017
"maboa"
122018122018
]
122019122019
},
122020-
"Web/Media/Audio_and_video_delivery/cross_browser_video_player": {
122020+
"Web/Media/Guides/Audio_and_video_delivery/cross_browser_video_player": {
122021122021
"modified": "2020-05-27T13:29:20.861Z",
122022122022
"contributors": [
122023122023
"rafaqf",
@@ -122033,7 +122033,7 @@
122033122033
"Ian-Devlin"
122034122034
]
122035122035
},
122036-
"Web/Media/Audio_and_video_manipulation": {
122036+
"Web/Media/Guides/Audio_and_video_manipulation": {
122037122037
"modified": "2020-09-02T12:20:43.182Z",
122038122038
"contributors": [
122039122039
"mfuji09",
@@ -122044,11 +122044,11 @@
122044122044
"a-mt"
122045122045
]
122046122046
},
122047-
"Web/Media/Autoplay_guide": {
122047+
"Web/Media/Guides/Autoplay": {
122048122048
"modified": "2020-10-11T23:21:36.266Z",
122049122049
"contributors": ["Malvoz", "scunliffe", "MrAlexWeber", "Sheppy"]
122050122050
},
122051-
"Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video": {
122051+
"Web/Media/Guides/DASH_Adaptive_Streaming_for_HTML_5_Video": {
122052122052
"modified": "2020-11-09T07:34:43.578Z",
122053122053
"contributors": [
122054122054
"mfuji09",
@@ -122070,11 +122070,11 @@
122070122070
"joshmoz"
122071122071
]
122072122072
},
122073-
"Web/Media/Formats": {
122073+
"Web/Media/Guides/Formats": {
122074122074
"modified": "2019-11-15T11:45:09.792Z",
122075122075
"contributors": ["Sheppy", "jswisher", "Havi Hoffman"]
122076122076
},
122077-
"Web/Media/Formats/Audio_codecs": {
122077+
"Web/Media/Guides/Formats/Audio_codecs": {
122078122078
"modified": "2019-12-06T17:58:10.741Z",
122079122079
"contributors": [
122080122080
"slokhorst",
@@ -122084,11 +122084,11 @@
122084122084
"GiacomoSorbi"
122085122085
]
122086122086
},
122087-
"Web/Media/Formats/Audio_concepts": {
122087+
"Web/Media/Guides/Formats/Audio_concepts": {
122088122088
"modified": "2020-06-01T18:13:20.323Z",
122089122089
"contributors": ["atd30", "Sheppy"]
122090122090
},
122091-
"Web/Media/Formats/Configuring_servers_for_Ogg_media": {
122091+
"Web/Media/Guides/Formats/Configuring_servers_for_Ogg_media": {
122092122092
"modified": "2019-09-10T19:10:12.290Z",
122093122093
"contributors": [
122094122094
"Sheppy",
@@ -122106,11 +122106,11 @@
122106122106
"sorinelpusti"
122107122107
]
122108122108
},
122109-
"Web/Media/Formats/Containers": {
122109+
"Web/Media/Guides/Formats/Containers": {
122110122110
"modified": "2020-04-18T23:02:19.945Z",
122111122111
"contributors": ["sideshowbarker", "FFV47", "Sheppy", "mukhtar-github"]
122112122112
},
122113-
"Web/Media/Formats/Image_types": {
122113+
"Web/Media/Guides/Formats/Image_types": {
122114122114
"modified": "2020-11-08T19:25:21.989Z",
122115122115
"contributors": [
122116122116
"hamishwillee",
@@ -122124,11 +122124,11 @@
122124122124
"matthendrix"
122125122125
]
122126122126
},
122127-
"Web/Media/Formats/Support_issues": {
122127+
"Web/Media/Guides/Formats/Support_issues": {
122128122128
"modified": "2019-08-13T12:38:59.984Z",
122129122129
"contributors": ["Sheppy"]
122130122130
},
122131-
"Web/Media/Formats/Video_codecs": {
122131+
"Web/Media/Guides/Formats/Video_codecs": {
122132122132
"modified": "2020-11-12T07:24:28.263Z",
122133122133
"contributors": [
122134122134
"chrisdavidmills",
@@ -122140,30 +122140,26 @@
122140122140
"KarlPiper"
122141122141
]
122142122142
},
122143-
"Web/Media/Formats/Video_concepts": {
122143+
"Web/Media/Guides/Formats/Video_concepts": {
122144122144
"modified": "2020-05-08T05:39:14.735Z",
122145122145
"contributors": ["Tolokoban2", "Sheppy"]
122146122146
},
122147-
"Web/Media/Formats/WebRTC_codecs": {
122147+
"Web/Media/Guides/Formats/WebRTC_codecs": {
122148122148
"modified": "2020-08-20T11:05:40.490Z",
122149122149
"contributors": ["Sheppy", "bfamchon", "TheSpecialist4"]
122150122150
},
122151-
"Web/Media/Formats/codecs_parameter": {
122151+
"Web/Media/Guides/Formats/codecs_parameter": {
122152122152
"modified": "2020-11-09T17:29:24.908Z",
122153122153
"contributors": ["lucaswerkmeister", "leela52452", "Sheppy", "pehrsons"]
122154122154
},
122155-
"Web/Media/HTML_media": {
122156-
"modified": "2020-01-27T09:41:23.530Z",
122157-
"contributors": ["germain", "rachelandrew", "Sheppy"]
122155+
"Web/Media/Guides/Images": {
122156+
"modified": "2020-07-28T00:42:48.458Z",
122157+
"contributors": ["lbd1607", "Sheppy", "rachelandrew"]
122158122158
},
122159-
"Web/Media/Streaming": {
122159+
"Web/Media/Guides/Streaming": {
122160122160
"modified": "2020-10-12T00:53:55.010Z",
122161122161
"contributors": ["krankj", "catecate", "Sheppy"]
122162122162
},
122163-
"Web/Media/images": {
122164-
"modified": "2020-07-28T00:42:48.458Z",
122165-
"contributors": ["lbd1607", "Sheppy", "rachelandrew"]
122166-
},
122167122163
"Web/OpenSearch": {
122168122164
"modified": "2019-10-30T22:44:38.715Z",
122169122165
"contributors": [

files/en-us/glossary/alpha/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ As you can see, the color without an alpha channel completely blocks the backgro
1818

1919
- [CSS colors](/en-US/docs/Web/CSS/CSS_colors)
2020
- [Learn: Values and units](/en-US/docs/Learn_web_development/Core/Styling_basics/Values_and_units)
21-
- [Image file type and format guide](/en-US/docs/Web/Media/Formats/Image_types)
21+
- [Image file type and format guide](/en-US/docs/Web/Media/Guides/Formats/Image_types)
2222
- [Alpha compositing](https://en.wikipedia.org/wiki/Alpha_compositing) on Wikipedia
2323
- [RGBA color model](https://en.wikipedia.org/wiki/RGBA_color_model) on Wikipedia
2424
- [Channel (digital image)](<https://en.wikipedia.org/wiki/Channel_(digital_image)>) on Wikipedia

files/en-us/glossary/codec/index.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,6 @@ A **codec** (a blend word derived from "**co**der-**dec**oder") is a program, al
1111
## See also
1212

1313
- [Codec](https://en.wikipedia.org/wiki/Codec) on Wikipedia
14-
- [Web video codec guide](/en-US/docs/Web/Media/Formats/Video_codecs)
15-
- [Web audio codec guide](/en-US/docs/Web/Media/Formats/Audio_codecs)
16-
- [Guide to media types and formats on the web](/en-US/docs/Web/Media/Formats)
14+
- [Web video codec guide](/en-US/docs/Web/Media/Guides/Formats/Video_codecs)
15+
- [Web audio codec guide](/en-US/docs/Web/Media/Guides/Formats/Audio_codecs)
16+
- [Guide to media types and formats on the web](/en-US/docs/Web/Media/Guides/Formats)

files/en-us/glossary/webm/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ page-type: glossary-definition
66

77
{{GlossarySidebar}}
88

9-
**[WebM](/en-US/docs/Web/Media/Formats/Containers#webm)** is a royalty-free and open web video format, which is natively supported in all modern browsers.
9+
**[WebM](/en-US/docs/Web/Media/Guides/Formats/Containers#webm)** is a royalty-free and open web video format, which is natively supported in all modern browsers.
1010

1111
## See also
1212

files/en-us/learn_web_development/core/accessibility/multimedia/index.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -225,9 +225,9 @@ Each time the time updates (once per second), we fire this function. It works ou
225225

226226
This gives you a basic idea of how to add custom player functionality to video/audio player instances. For more information on how to add more complex features to video/audio players, see:
227227

228-
- [Audio and video delivery](/en-US/docs/Web/Media/Audio_and_video_delivery)
229-
- [Video player styling basics](/en-US/docs/Web/Media/Audio_and_video_delivery/Video_player_styling_basics)
230-
- [Creating a cross-browser video player](/en-US/docs/Web/Media/Audio_and_video_delivery/cross_browser_video_player)
228+
- [Audio and video delivery](/en-US/docs/Web/Media/Guides/Audio_and_video_delivery)
229+
- [Video player styling basics](/en-US/docs/Web/Media/Guides/Audio_and_video_delivery/Video_player_styling_basics)
230+
- [Creating a cross-browser video player](/en-US/docs/Web/Media/Guides/Audio_and_video_delivery/cross_browser_video_player)
231231

232232
We've also created an advanced example to show how you could create an object-oriented system that finds every video and audio player on the page (no matter how many there are) and adds our custom controls to it. See [custom-controls-oojs](https://mdn.github.io/learning-area/accessibility/multimedia/custom-controls-OOJS/) (also [see the source code](https://github.com/mdn/learning-area/tree/main/accessibility/multimedia/custom-controls-OOJS)).
233233

@@ -323,7 +323,7 @@ This will result in a video that has subtitles displayed, kind of like this:
323323

324324
![Video player with standard controls such as play, stop, volume, and captions on and off. The video playing shows a scene of a man holding a spear-like weapon, and a caption reads "Esta hoja tiene pasado oscuro."](video-player-with-captions.png)
325325

326-
For more details, see [Adding captions and subtitles to HTML video](/en-US/docs/Web/Media/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video). You can find [the example](https://iandevlin.github.io/mdn/video-player-with-captions/) that goes along with this article on GitHub, written by Ian Devlin (see the [source code](https://github.com/iandevlin/iandevlin.github.io/tree/master/mdn/video-player-with-captions) too.) This example uses JavaScript to allow users to choose between different subtitles. Note that to turn the subtitles on, you need to press the "CC" button and select an option — English, Deutsch, or Español.
326+
For more details, see [Adding captions and subtitles to HTML video](/en-US/docs/Web/Media/Guides/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video). You can find [the example](https://iandevlin.github.io/mdn/video-player-with-captions/) that goes along with this article on GitHub, written by Ian Devlin (see the [source code](https://github.com/iandevlin/iandevlin.github.io/tree/master/mdn/video-player-with-captions) too.) This example uses JavaScript to allow users to choose between different subtitles. Note that to turn the subtitles on, you need to press the "CC" button and select an option — English, Deutsch, or Español.
327327

328328
> [!NOTE]
329329
> Text tracks and transcriptions also help you with {{glossary("SEO")}}, since search engines especially thrive on text. Text tracks even allow search engines to link directly to a spot partway through the video.

files/en-us/learn_web_development/core/scripting/what_is_javascript/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ They generally fall into two categories.
114114
This is how [Google Maps](https://www.google.com/maps) is able to find your location and plot it on a map.
115115
- The [Canvas](/en-US/docs/Web/API/Canvas_API) and [WebGL](/en-US/docs/Web/API/WebGL_API) APIs allow you to create animated 2D and 3D graphics.
116116
People are doing some amazing things using these web technologies — see [Chrome Experiments](https://experiments.withgoogle.com/collection/chrome) and [webglsamples](https://webglsamples.org/).
117-
- [Audio and Video APIs](/en-US/docs/Web/Media/Audio_and_video_delivery) like {{domxref("HTMLMediaElement")}} and [WebRTC](/en-US/docs/Web/API/WebRTC_API) allow you to do really interesting things with multimedia, such as play audio and video right in a web page, or grab video from your web camera and display it on someone else's computer (try our simple [Snapshot demo](https://chrisdavidmills.github.io/snapshot/) to get the idea).
117+
- [Audio and Video APIs](/en-US/docs/Web/Media/Guides/Audio_and_video_delivery) like {{domxref("HTMLMediaElement")}} and [WebRTC](/en-US/docs/Web/API/WebRTC_API) allow you to do really interesting things with multimedia, such as play audio and video right in a web page, or grab video from your web camera and display it on someone else's computer (try our simple [Snapshot demo](https://chrisdavidmills.github.io/snapshot/) to get the idea).
118118

119119
**Third party APIs** are not built into the browser by default, and you generally have to grab their code and information from somewhere on the Web. For example:
120120

0 commit comments

Comments
 (0)