HTML srclang Attribute

HTML srclang Attribute

The HTML srclang attribute specifies the language of the text track data referenced by a <track> element. It uses a valid language tag, such as en for English or es for Spanish, and is required when the track represents subtitles.

Elements That Use the srclang Attribute

The srclang attribute is used with the <track> element.

srclang Attribute Value

The value of the srclang attribute must be a valid BCP 47 language tag identifying the language of the text track data.

<track src="subtitles-en.vtt"
       kind="subtitles"
       srclang="en"
       label="English">

In this example, srclang="en" identifies the subtitle track as English.

Language Tags

Language tags can identify a language and, when needed, provide additional information such as a regional variation.

Use the language tag that accurately identifies the language of the referenced text track.

Subtitles

The srclang attribute must be present when the <track> element is in the subtitles state. This includes an explicitly specified kind="subtitles" track.

<video controls>
  <source src="video.mp4" type="video/mp4">
  <track src="subtitles-en.vtt"
         kind="subtitles"
         srclang="en"
         label="English">
</video>

The language information helps identify the subtitle track and allows browsers to present appropriate track choices to users.

Multiple Languages

A media element can provide multiple text tracks for different languages. Each <track> can use its own srclang value.

<video controls>
  <source src="video.mp4" type="video/mp4">
  <track src="subtitles-en.vtt"
         kind="subtitles"
         srclang="en"
         label="English">
  <track src="subtitles-es.vtt"
         kind="subtitles"
         srclang="es"
         label="Spanish">
</video>

In this example, the media has separate English and Spanish subtitle tracks. The browser can use the language and label information when presenting available tracks to the user.

srclang and label

The srclang and label attributes provide different information. The srclang attribute identifies the language of the track data, while label provides a user-readable title for the track.

<track src="subtitles-en.vtt"
       kind="subtitles"
       srclang="en"
       label="English">

Using both attributes makes the language machine-readable while also providing a clear name that can be displayed in the browser's track selection interface.

Common Mistakes

Do not omit srclang from a subtitle track. The attribute is required when the <track> element is in the subtitles state.

Do not use a language name such as English as the srclang value. Use a valid language tag such as en.

Do not confuse srclang with lang. The srclang attribute identifies the language of external text track data, while the global lang attribute identifies the language of an HTML element's content.

Do not use srclang as the user-visible track name. Use the label attribute to provide a readable title such as English or Spanish.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

The srclang attribute on the <track> element is widely supported in current core browsers.

Checking Browser Support

For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.

Try the srclang Attribute

The example shows two subtitle tracks for a video. The first uses srclang="en" for English and the second uses srclang="es" for Spanish.

Summary

The HTML srclang attribute specifies the language of text track data referenced by a <track> element. Its value must be a valid BCP 47 language tag, such as en, es, or en-US. The attribute is required for subtitle tracks and can be combined with label to provide both machine-readable language information and a user-readable track name.