HTML5 translate 속성이란?
HTML5의 translate 전역 속성은 특정 요소의 콘텐츠를 기계 번역 대상에 포함할지 여부를 지정하는 데 사용됩니다. 브라우저의 자동 번역 기능이나 Google Translate 같은 번역 도구가 페이지를 번역할 때, 이 속성을 통해 번역하지 않아야 할 부분(예: 브랜드명, 코드, 고유명사)을 명확하게 표시할 수 있습니다.
translate 속성 값
translate 속성은 다음 두 가지 값을 가질 수 있습니다.
| 속성 값 | 설명 |
|---|---|
| yes | 해당 요소의 콘텐츠를 번역해야 함을 나타냅니다. |
| no | 해당 요소의 콘텐츠를 번역하면 안 됨을 나타냅니다. |
참고로, 이 속성은 HTML5의 전역(global) 속성이므로 모든 HTML 요소에 적용할 수 있습니다.
translate 속성 사용 예제
특정 단어나 문장이 자동으로 번역되지 않도록 하려면 해당 요소에 translate="no" 속성을 추가하면 됩니다.
<p translate="no">This won't get translated.</p>
위 예제에서는 문단에 translate="no"를 지정했기 때문에, 사용자가 브라우저의 자동 번역 기능을 사용하더라도 이 문단의 텍스트는 원문 그대로 유지됩니다.
활용 팁
- 브랜드명, 제품명, 회사명처럼 번역되면 안 되는 고유명사에
translate="no"를 적용하세요. - 코드 스니펫이나 변수명 등 기술적 텍스트에도 유용하게 사용할 수 있습니다.
- 반대로, 부모 요소에
translate="no"가 설정된 경우 자식 요소에translate="yes"를 지정하여 개별적으로 번역을 허용할 수 있습니다.