HTML에서 요소의 콘텐츠 언어를 지정하려면 lang 속성을 사용합니다. 이 속성은 해당 요소 안에 담긴 텍스트가 어떤 언어로 작성되었는지 브라우저, 검색 엔진, 스크린 리더 등에 알려주는 역할을 합니다.
lang 속성이 중요한 이유
- 검색 엔진이 페이지 내용의 언어를 정확하게 파악하여 SEO에 도움이 됩니다.
- 스크린 리더가 올바른 발음으로 텍스트를 읽어 접근성이 향상됩니다.
- 브라우저가 언어에 맞는 하이픈 넣기, 따옴표 스타일, 글꼴 렌더링 등을 적용할 수 있습니다.
예제
아래 예제에서는 영어뿐만 아니라 프랑스어와 스페인어로 작성된 콘텐츠도 함께 추가했습니다. 각 문단에는 해당 언어에 맞는 ISO 언어 코드(en, fr, es)가 lang 속성으로 지정되어 있습니다.
<!DOCTYPE html> <html> <body> <h2>English</h2> <p lang = "en">This is demo text</p> <h2>French</h2> <p lang = "fr">Ceci est un texte de démonstration</p> <h2>Spanish</h2> <p lang = "es">Este es un texto de demostración</p> </body> </html>
참고 사항
페이지 전체의 기본 언어를 지정하려면 <html> 태그에 lang 속성을 설정하고, 특정 부분만 다른 언어라면 해당 요소에 개별적으로 lang 속성을 지정하면 됩니다.