Inline video: Pravidlá a príklady

Inline video je hostovaný alebo externe vložený záznam umiestnený v čítacom toku článku, ktorý demonštruje, vysvetľuje alebo dokumentuje jednu ohraničenú myšlienku. Zahŕňa viditeľný štítok, zámerný úvodný snímok, ovládacie prvky prehrávania, titulky, dĺžku trvania a kompletný prepis. Bez týchto sprievodných slov je neoznačený prehrávač neviditeľný pre každého čitateľa, ktorý nemôže alebo sa rozhodne nepozerať – a takmer prázdny pre systémy, ktoré extrahujú text namiesto dekódovania záznamu.

Komentár k pripravovanému snímku je špecifikáciou pre zachytenie, nie odkazom na zdroj. Okolité HTML demonštruje požadované poradie čítania pred dokončením mediálnej produkcie.

Prečo na tomto elemente záleží

Video znižuje náklady na vysvetlenie, keď pohyb, načasovanie, hlas alebo zmena v čase nesú význam. Čitateľ môže vidieť, ako sa otvára menu, ako sa pohybuje fyzický produkt alebo ako rečník kvalifikuje záver. Sledovanie vyžaduje pozornosť, zvuk alebo titulky, čas a často aj viac údajov ako čítanie, preto jasný štítok a dĺžka trvania umožňujú čitateľovi posúdiť tieto náklady.

Úvodné snímky ovplyvňujú toto rozhodnutie ešte pred prehrávaním. Reprezentatívny záber pôsobí ako vizuálny sľub toho, čo záznam obsahuje. Náhodný záber so zatvorenými očami, načítavacím spinnerom alebo nesúvisiacou titulkovou kartou pôsobí nedbale a núti čitateľa stlačiť tlačidlo prehrávania, aby zistil, o čom video je. Snímok by mal odhaliť stav, osobu, objekt alebo výsledok, ktorý video skutočne vysvetľuje.

Strojová extrahovateľnosť je schopnosť softvéru získať význam obsahovej jednotky bez reprodukovania jej prezentácie. Holý iframe zvyčajne odhalí len málo viac ako URL poskytovateľa. Označený element odhalí názov, zhrnutie, dĺžku trvania, dátum, snímok, titulky, prepis a stabilný identifikátor. Vyhľadávacie, prekladové, prístupové a získavacie systémy potom môžu porozumieť ohraničenému vysvetleniu.

Prepis je preto súčasťou elementu, nie voliteľným súborom na stiahnutie. Zachováva hovorené tvrdenia, zmeny rečníka, zmysluplné zvuky a vizuálne akcie v poradí dokumentu. Titulky podporujú zážitok z prehrávania; prepis podporuje stránku. Postupujte podľa spoločných pravidiel písania elementov pre sémantickú prioritu, direktívnu syntax a mapovanie tela. Táto stránka má prednosť tam, kde vyžaduje prepis, snímok, dĺžku trvania a prístupové polia špecifické pre video.

Kedy ho použiť

Použite inline video, keď časovo podmienený dôkaz objasňuje ohraničený bod lepšie ako statické obrázky a próza. Vhodné prípady zahŕňajú operáciu v rozhraní, fyzickú techniku, viditeľný prechod, odborné vysvetlenie, správanie produktu závislé od pohybu alebo zaznamenaný výsledok, ktorého podanie je dôkazom.

Pred objednaním nahrávky aplikujte test náhrady. Ak jedna snímka obrazovky a dve vety vysvetlia bod rovnako dobre, použite ich: načítajú sa rýchlejšie, rýchlejšie sa prehliadajú a sú lacnejšie na aktualizáciu. Video si svoje miesto zaslúži, keď postupnosť, tempo, pohyb, hlas alebo pozorované správanie menia pochopenie.

Prípady na hranici zahŕňajú:

• Dlhý webinár vložený do nesúvisiaceho odseku: odkazujte na vyhradenú stránku videa alebo použite celú sekciu na vloženie videa. Inline element musí slúžiť miestnemu argumentu, nie importovať hodinu vedľajšej témy.
• Tichá slučková dekorácia: to je motion dizajn, nie redakčné video. Odstráňte ho alebo s ním zaobchádzajte ako s dekoratívnym médiom so správaním pre znížený pohyb.
• Nahrávka obrazovky použitá namiesto inštrukcií: napíšte kroky a stav úspechu v texte. Video ich môže demonštrovať, ale nemôže byť jediným spôsobom, ako dokončiť úlohu.
• Citácia zákaznika vystrihnutá bez kontextu: krátky klip môže podporiť prípadovú štúdiu len vtedy, keď sú zverejnené rečník, vzťah, dátum nahrávky, schválenie a okolitý nárok.
• Video, ktorého jedinou hodnotou je osobnosť: použite ho len vtedy, keď je relevantný hlas, podanie alebo autorita rečníka. Nenúťte čitateľov pozerať prezentujúceho, ktorý recituje text už na stránke.
• Niekoľko súvisiacich klipov: použite galériu alebo vyhradenú mediálnu sekciu, keď je úlohou výber medzi nahrávkami. Neukladajte inline prehrávače na seba.

Kam ho umiestniť

Umiestnite video hneď za odsek, ktorý pomenúva, čo sa čitateľ dozvie alebo uvidí. Jeho názov, dĺžku trvania a zhrnutie uveďte pred prehrávač. Prepis umiestnite priamo zaň, skrytý len vtedy, keď je kompletný text v HTML bez kódu prehrávania.

V postupe umiestnite prehrávač za napísanú postupnosť akcií a pred riešenie problémov. Čitateľ by mal byť schopný konať bez pozerania a potom použiť nahrávku na potvrdenie pohybu alebo stavu rozhrania. V argumente alebo prípadovej štúdii uveďte tvrdenie pred nahrávkou a interpretujte jeho obmedzenia po nej.

Neumiestňujte ho vedľa iného prehrávača, automaticky prehrávanej animácie, veľkej výzvy na akciu, formulára alebo kalkulačky. Konkurujúce ovládacie prvky vytvárajú nejasné zameranie. Neumiestňujte ho do bunky tabuľky, položky zoznamu, calloutu, karty, karuselu, akordeónového panelu ani klikateľnej karty. Prepis môže používať ovládací prvok zobrazenia/skrytia; celé video nesmie byť skryté.

Názov, zhrnutie, snímok, prehrávač, dĺžku trvania, ovládací prvok prepisu a kredit uchovajte v rámci jedného figure ohraničenia. Zdrojová poznámka môže nasledovať hneď za ním. Nikdy neoddeľujte prehrávač od jeho prepisu reklamou, propagáciou alebo nesúvisiacou sekciou.

Anatómia

1. Viditeľný názov: Pomenúva úlohu, ukážku, udalosť alebo tvrdenie v konkrétnom HTML texte.
2. Zhrnutie: Vysvetľuje v jednej vete, čo čitateľ uvidí a prečo je to dôležité.
3. Dĺžka trvania: Uvádza časovú náročnosť sledovania pred prehrávaním v minútach a sekundách.
4. Úvodný snímok: Zobrazuje reprezentatívny, schválený záber bez toho, aby sám o sebe predstieral, že je tlačidlom.
5. Ovládacie prvky prehrávača: Poskytujú prehrávanie, pauzu, vyhľadávanie, hlasitosť, celú obrazovku, rýchlosť prehrávania a prístup k titulkom.
6. Titulky: Synchronizujú dialóg, zmeny rečníka a zmysluplné nerečové zvuky s prehrávaním.
7. Prepis: Reprodukuje kompletnú zmysluplnú postupnosť ako vybrateľný, vyhľadávateľný HTML text.
8. Vizuálne opisy: Zaznamenávajú zmysluplné akcie na obrazovke alebo zmeny, ktoré komentár neuvádza.
9. Kredit a zdroj: Identifikujú rečníka, tvorcu, dátum nahrávky alebo pôvod dôkazu, keď je to relevantné.

Názov nie je názov súboru a zhrnutie nie je „Pozrite si video nižšie." Každý z nich musí zostať užitočný, aj keď je skopírovaný bez prehrávača.

Príklady dizajnu

Všetky varianty zdieľajú rovnakú obsahovú zmluvu. Spôsob doručenia sa mení; označenie, titulky, kvalita prepisu, súhlas s prehrávaním a poradie čítania sa nemenia.

Hostovaná ukážka

Použite HTML5 prehrávač prvej strany pre krátky záznam produktu alebo procesu, keď organizácia kontroluje kódovanie, titulky, výber snímku a dostupnosť.

Súkromie rešpektujúce externé vloženie

Použite externú platformu, keď je potrebné jej doručenie, analýza alebo zavedený kanál. Načítajte poskytovateľa len po súhlase tam, kde to politika vyžaduje, identifikujte poskytovateľa pred aktiváciou a zachovajte lokálny prepis aj v prípade, že poskytovateľ nahrávku odstráni.

Krátky klip rozhrania

Použite stručný klip pre jednu zmenu stavu, ktorá sa ťažko komunikuje statickými obrázkami. Stále potrebuje ovládacie prvky, mechanizmus pauzy, zmysluplný textový opis a prepis; nemeňte ho na automaticky sa opakujúci GIF.

Klip rozhovoru alebo dôkazu

Použite klip vedený rečníkom, keď záleží na autorstve, formulácii alebo pozorovanom svedectve. Zobrazte meno a rolu osoby v HTML, zverejnite úpravy a prepíšte reč aj materiálny vizuálny dôkaz.

Parametre

Tieto polia tvoria prenosnú obsahovú zmluvu. Šírka, okraj, tieň, štýl tlačidla prehrávania a správanie pri zlomoch patria do vykresľovača.

Prvý nadpis v tele sa mapuje na title; prvý odsek sa mapuje na summary; zvyšok tela sa mapuje na transcript. Časové rozsahy v prepise sú voliteľné pre súvislé vysvetlenie jedného rečníka a odporúčané pre postupy, zmeny rečníka a nahrávky dlhšie ako dve minúty. Polia autoplay, loop a polia pre zvuk na pozadí sú zámerne vynechané.

Syntax a príklady kódu

Každý zápis zachováva rovnaký názov, zhrnutie, mediálne metadáta, titulky a prepis. Uvedené domény opisujú zmluvu a nie sú odkazmi na produkčné zdroje.

Prenosná Markdown direktíva

:::inline-video{src="https://media.example.com/freshness-filter.mp4" provider=hosted poster="https://media.example.com/freshness-filter-poster.webp" duration="PT1M30S" captions="https://media.example.com/freshness-filter.en.vtt" language=en uploadDate="2026-08-27"}

## Filter pages that need review

See how to apply the Needs review filter and verify the resulting work queue.

**00:00–00:18 — Open the report.** From Audit, open Freshness.

**00:19–00:54 — Apply the filter.** Open Status and choose Needs review.

**00:55–01:30 — Verify the queue.** Confirm that every visible row has the expected status.
:::

Hugo shortcode

{{< inline-video src="https://media.example.com/freshness-filter.mp4" provider="hosted" poster="https://media.example.com/freshness-filter-poster.webp" duration="PT1M30S" captions="https://media.example.com/freshness-filter.en.vtt" language="en" uploadDate="2026-08-27" >}}
## Filter pages that need review

See how to apply the Needs review filter and verify the resulting work queue.

**00:00–00:18 — Open the report.** From Audit, open Freshness.

**00:19–00:54 — Apply the filter.** Open Status and choose Needs review.

**00:55–01:30 — Verify the queue.** Confirm that every visible row has the expected status.
{{< /inline-video >}}

Toto je zamýšľaná adaptérová zmluva, nie tvrdenie, že lokálny shortcode existuje. Používa iba pomenované parametre. Kým nie je zaregistrovaný vykresľovač, používajte sémantické HTML s figure, video, track a prepisom, ktoré zachováva rovnaké polia.

WordPress blok

<!-- wp:amicited/inline-video {"src":"https://media.example.com/freshness-filter.mp4","provider":"hosted","poster":"https://media.example.com/freshness-filter-poster.webp","duration":"PT1M30S","captions":"https://media.example.com/freshness-filter.en.vtt","language":"en","uploadDate":"2026-08-27"} -->
<h2>Filter pages that need review</h2>
<p>See how to apply the Needs review filter and verify the resulting work queue.</p>
<video controls preload="metadata" poster="https://media.example.com/freshness-filter-poster.webp">
  <source src="https://media.example.com/freshness-filter.mp4" type="video/mp4">
  <track kind="captions" srclang="en" src="https://media.example.com/freshness-filter.en.vtt" label="English" default>
</video>
<details><summary>Read the transcript</summary><p><strong>00:00–00:18 — Open the report.</strong> From Audit, open Freshness.</p><p><strong>00:19–00:54 — Apply the filter.</strong> Open Status and choose Needs review.</p><p><strong>00:55–01:30 — Verify the queue.</strong> Confirm that every visible row has the expected status.</p></details>
<!-- /wp:amicited/inline-video -->

Ak registrovaný WordPress blok nie je k dispozícii, použite natívne bloky Video, Heading, Paragraph a Details. Nevkladajte iframe a nevynechávajte lokálny prepis.

Príklady

Dobrý: ohraničená ukážka s čitateľskou alternatívou

Filter pages that need review · 1:30

Video zobrazuje jednu úlohu: otvorenie reportu čerstvosti, aplikovanie filtra stavu a skontrolovanie počtu výsledkov. Jeho snímok zobrazuje otvorený filter, titulky presne identifikujú štítky rozhrania a trojčastný prepis zaznamenáva každú akciu a kontrolu úspechu. Prehrávanie začína až po aktivácii.

Funguje to, pretože čitateľ môže predvídať hodnotu a časovú náročnosť, pozerať so zvukom, pozerať s titulkami alebo dokončiť rovnakú úlohu z prepisu. Nahrávka pridáva dôkaz pohybu a zmeny stavu bez toho, aby sa stala jedinou inštrukciou.

Zlý: neoznačený prehrávač

Pozrite si toto
Tretiastranový iframe sa automaticky načíta pod nadpisom. Jeho snímok je čierny rám, nezobrazuje sa dĺžka trvania, titulky sú vygenerované poskytovateľom a neskontrolované a stránka neobsahuje žiadny prepis ani zhrnutie.

Zlá verzia núti každého nepozerajúceho čitateľa hádať. Extrakčným nástrojom neposkytuje žiadny predmet, žiada čitateľov citlivých na súkromie, aby kontaktovali poskytovateľa pred výberom prehrávania, neponúka trvalý text, keď nahrávka zmizne, a môže prezentovať nesprávne titulky ako fakty. Opravte to konkrétnym názvom a zhrnutím, zámerným snímkom, dĺžkou trvania, načítaním s ohľadom na súhlas, skontrolovanými titulkami, kompletným lokálnym prepisom a napísanou úlohou alebo tvrdením mimo prehrávača.

Schéma markup a prístupnosť

Inline video automaticky nevytvára nárok na schému. Používajte VideoObject len vtedy, keď stránka viditeľne poskytuje presné hodnoty name, description, thumbnailUrl, uploadDate, duration a contentUrl alebo embedUrl pre prístupnú nahrávku. Nikdy nevymýšľajte polia, aby ste uspokojili validátor, alebo neoznačujte dekoratívny klip ako primárne video.

Relevantné video môže podporiť oprávnený Article, HowTo alebo Product, keď stránka samostatne spĺňa podmienky. Jeho prepis nemôže odôvodniť tvrdenia alebo kroky, ktoré na viditeľnej stránke chýbajú.

Prístupnosť začína pred prehrávaním. Označte figure, zobrazte názov a dĺžku trvania v texte a poskytnite ovládacím prvkom klávesnicové ovládanie a viditeľné zameranie. Nikdy nespúšťajte automatické prehrávanie. Poskytnite pauzu, vyhľadávanie, hlasitosť, rýchlosť, titulky a celú obrazovku. Nezachytávajte zameranie v prehrávači tretej strany; po zatvorení celej obrazovky ho vráťte na iniciujúci ovládací prvok.

Titulky musia byť synchronizované, interpunkčne správne a skontrolované oproti nahrávke. Identifikujte rečníkov, keď hlas nie je zrejmý, a zahŕňajte zmysluplné zvuky, ako napríklad „[tón oznámenia]", keď ovplyvňujú porozumenie. Zvukový opis je potrebný, keď zmysluplné vizuálne informácie nie sú uvedené v hlavnom zvuku; samotný opisný prepis nerobí časovaný zážitok z prehrávania ekvivalentným.

Prepis musí byť skutočné HTML v logickom poradí – nie canvas, obsah len na prehrávanie, skrytý text ani PDF na stiahnutie. Ovládacie prvky zobrazenia/skrytia potrebujú prístupný názov a rozbalený stav. Prehrávač a prepis musia fungovať pri 200% zväčšení a úzkych šírkach bez horizontálneho posúvania na úrovni stránky.

Pravidlá písania

Slová okolo prehrávača určujú, či je video obsahovým elementom alebo nevysvetleným objektom:

• Napíšte konkrétny názov o 4–12 slovách. Pomenujte úlohu, ukážku, rečníka, udalosť alebo zistenie; nikdy nepoužívajte „Video", „Pozrite si" alebo „Dozviete sa viac" samostatne.
• Napíšte jednu zhrňujúcu vetu o 15–35 slovách, ktorá čitateľovi povie, čo sa deje a prečo je to dôležité. Neopakujte názov.
• Udržujte inline nahrávky zamerané a zvyčajne do piatich minút. Tvrdé maximum je 20 minút; dlhšie nahrávky patria na vyhradenú stránku alebo potrebujú redakčné rozdelenie.
• Zobrazte dĺžku trvania pred prehrávaním. Použite M:SS pre viditeľný text a ISO 8601, napríklad PT1M30S, v štruktúrovaných poliach.
• Vyberte snímok, ktorý reprezentuje tému pri normálnej veľkosti zobrazenia. Vyhýbajte sa prázdnym rámom, spinnerom, náhodným výrazom, klamlivým tlačidlám prehrávania, malému textu rozhrania a neschváleným osobným alebo zákazníckym informáciám.
• Skontrolujte titulky oproti finálnej úprave. Opravte mená, štítky produktov, čísla, doménovú terminológiu, interpunkciu, zmeny rečníka a zmysluplné zvuky.
• Prepíšte všetku zmysluplnú reč a vizuálne prvky. Zhrnutia, názvy kapitol a automaticky generované súbory tituliek nenahrádzajú prepis.
• Používajte krátke odseky prepisu, označenie rečníka tam, kde je to potrebné, a časové rozsahy okolo procedurálnych fáz alebo zmien témy. Nevytvárajte citácie z parafrázovanej reči.
• Uveďte úpravy, ktoré by mohli zmeniť interpretáciu. Nespájajte svedectvo, experiment alebo ukážku tak, aby postupnosť naznačovala nepodložený výsledok.
• Uchovajte základné inštrukcie, ceny, varovania, podmienky oprávnenosti, dôkazy a výzvy na akciu mimo nahrávky. Čitateľ nesmie musieť prehľadávať časovú os, aby našiel dôležitý fakt.
• Nikdy neumiestňujte automatické prehrávanie, blikajúci obsah, zvuk na pozadí, konverzné prekryvy, bránené polia prepisu ani druhý prehrávač dovnútra elementu.
• Zaznamenajte vlastníka média a spúšťač kontroly. Skontrolujte video, keď sa zmení rozhranie, politika, správanie produktu, priradenie rečníka alebo okolité tvrdenie.

Typy príspevkov, ktoré ho používajú

Pole postTypes v frontmatteri riadi túto maticu. Zaradenie povoľuje inline video, keď časovo podmienený dôkaz pridáva význam; nevyžaduje prehrávač na každej stránke.

Kontrolný zoznam QA

• Video pridáva časovo podmienený význam, ktorý statický obrázok a stručná próza nedokážu rovnako dobre sprostredkovať.
• Viditeľný názov konkrétne pomenúva nahrávku a zhrnutie vysvetľuje jej hodnotu pred prehrávaním.
• Dĺžka trvania sa zobrazí predtým, než čitateľ aktivuje prehrávač.
• Snímok je reprezentatívny, čitateľný, schválený a bez súkromného alebo zavádzajúceho obsahu.
• Prehrávanie sa nikdy nespúšťa automaticky, neopakuje sa neočakávane ani nevytvára zvuk bez akcie čitateľa.
• Ovládacie prvky prehrávania, pauzy, vyhľadávania, hlasitosti, rýchlosti, tituliek a celej obrazovky fungujú s klávesnicou aj dotykom.
• Titulky zodpovedajú finálnej úprave a správne zachovávajú mená, čísla, zmeny rečníka a zmysluplné zvuky.
• Zmysluplné vizuálne prvky, ktoré nie sú vyjadrené v reči, dostanú zvukový opis alebo ekvivalentnú alternatívnu verziu.
• Kompletný prepis je vybrateľné HTML, sleduje poradie nahrávky a opisuje potrebné vizuálne akcie.
• Písomné inštrukcie, varovania, podmienky, dôkazy a výzvy na akciu zostávajú dostupné mimo videa.
• Načítanie externého poskytovateľa sa riadi platnými pravidlami súhlasu a poskytovateľ je identifikovaný pred aktiváciou.
• Prehrávač, štítok a prepis zostávajú jedným sémantickým figure a nie sú prerušené nesúvisiacim obsahom.
• Element nie je vnorený do tabuľky, zoznamu, calloutu, karty, karuselu, akordeónového panelu ani klikateľného kontajnera.
• Nahrávka a prepis fungujú pri 200% zväčšení, úzkych šírkach, zníženom pohybe a bez významu závislého len od JavaScriptu.
• Všetky polia VideoObject zodpovedajú viditeľným, overiteľným mediálnym metadátam a prístupnej nahrávke.
• Vybraný typ príspevku sa nachádza v postTypes a umiestnenie zodpovedá matici vyššie.
• Vlastník média, práva, dátum nahrávky a podmienky kontroly alebo výmeny sú zaznamenané.

FAQ

Potrebuje každé inline video prepis?

Áno. Titulky slúžia synchronizovanému prehrávaniu; prepis slúži čítaniu, prehliadaniu, vyhľadávaniu, prekladu, citovaniu, prístupnosti a extrakcii. Musí obsahovať kompletný zmysluplný obsah vrátane vizuálnych akcií, ktoré reč nevysvetľuje.

Môže úvodný snímok obsahovať názov videa?

Áno, ale rovnaká identifikačná informácia musí byť uvedená aj v HTML texte. Text na snímku môže byť nečitateľný na malej obrazovke, nedostupný, keď obrázky zlyhajú, a neprístupný pre softvér, ktorý neinterpretuje pixely.

Malo by sa inline video prehrávať automaticky?

Nie. Automatické prehrávanie spotrebúva dáta, prerušuje čítanie, vnáša nevyžiadaný pohyb alebo zvuk a odoberá čitateľovi možnosť voľby, kedy sa zapojiť. Spúšťajte len po explicitnej aktivácii.

Sú titulky a prepis to isté?

Nie. Titulky sú časované na prehrávanie a zahŕňajú relevantné zvukové podnety. Prepis je trvalá čitateľská alternatíva usporiadaná v postupnosti nahrávky a obohatená o potrebné opisy zmysluplných vizuálnych prvkov.

Vyžaduje inline video schému VideoObject?

Nie. Pridajte VideoObject len vtedy, keď ho podporujú presné viditeľné metadáta a stabilná nahrávka. Prehrávač bez dôveryhodného názvu, opisu, snímku, dátumu nahrania, dĺžky trvania a URL média by nemal generovať neúplné alebo vymyslené značenie.