## HTML translate Attribute
The `translate` attribute is an HTML global attribute used to specify whether the text content of an element (and its attribute values, such as `title` or `alt`) should be translated when the page is localized or processed by automatic translation engines (like Google Translate).
---
## Definition and Usage
The `translate` attribute tells translation tools whether to translate the content of a specific element.
This is particularly useful for:
* Brand names, trademarks, or company names (e.g., "Apple", "Google", "Microsoft").
* Code snippets, programming syntax, or variables.
* Domain names, email addresses, or specific technical terms.
* Usernames or user-generated content that must remain in its original language.
### HTML 4.01 vs. HTML5
* The `translate` attribute is a **new global attribute introduced in HTML5**.
---
## Syntax
```html
```
### Attribute Values
| Value | Description |
| :--- | :--- |
| `yes` | Specifies that the element's content and attribute values **should** be translated. (Default behavior) |
| `no` | Specifies that the element's content and attribute values **should not** be translated. |
---
## Code Examples
### Basic Usage
In this example, we prevent a specific paragraph from being translated while allowing others to be translated normally:
```html
This paragraph must remain in English.
This paragraph can be translated into other languages.
```
### Protecting Brand Names Within a Sentence
You can wrap specific words in an inline element (like ``) to protect them from translation:
```html
We love eating ice cream on hot summer days.
```
---
## Browser Support and Practical Workarounds
Historically, native browser support for the `translate` attribute was limited. Today, modern translation engines (such as Google Translate, Microsoft Translator, and browser-integrated translation tools) recognize and respect the `translate="no"` attribute.
### The `class="notranslate"` Workaround
Because some older translation tools or legacy systems may not fully support the HTML5 `translate` attribute, a widely adopted industry workaround is to use the class name `notranslate`.
If you want to ensure maximum compatibility across all translation tools, you can combine both approaches:
```html
Using translate="no": ice cream
Using class="notranslate": ice cream
Using both: ice cream
```
YouTip