코딩스쿨

▶ HTML References

HTML Lang Codes

1. HTML Lang Code란?

HTML Lang Code는 웹 페이지에서 문서의 기본 언어를 정의하기 위해 사용됩니다. lang 속성은 HTML 문서의 최상위 <html> 태그에 추가되며, 검색 엔진, 스크린 리더(접근성 도구), 번역 소프트웨어 등이 이 정보를 활용하여 콘텐츠를 적절히 처리합니다.

예를 들어, 한국어로 작성된 웹 페이지는 다음과 같이 lang 속성을 설정할 수 있습니다:

<html lang="ko">

2. HTML Lang Code의 중요성

검색 엔진 최적화 (SEO): 검색 엔진은 lang 속성을 사용하여 웹 페이지의 언어를 인식하고, 이를 통해 해당 페이지를 적절한 사용자에게 표시할 수 있습니다.
접근성: 시각 장애인을 위한 스크린 리더는 lang 속성 정보를 기반으로 페이지의 언어를 인식하고, 해당 언어에 맞는 발음 규칙을 사용해 페이지를 읽어줍니다.
자동 번역: 브라우저의 자동 번역 기능은 lang 속성에 따라 페이지의 언어를 인식하고 번역을 제안할 수 있습니다.
다국어 웹 사이트: 다국어 웹 사이트를 운영하는 경우, 각 페이지에 적절한 언어 코드를 설정하여 브라우저나 검색 엔진이 정확하게 해당 페이지의 언어를 처리하도록 돕습니다.

3. HTML Lang Code 설정

HTML 문서의 언어 코드는 <html> 태그에 lang 속성을 추가하여 정의할 수 있습니다.

예시 1: 한국어 문서 설정

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>한국어 웹 페이지</title>
</head>
<body>
    <p>이 페이지는 한국어로 작성되었습니다.</p>
</body>
</html>

예시 2: 영어 문서 설정

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>English Web Page</title>
</head>
<body>
    <p>This page is written in English.</p>
</body>
</html>

4. 주요 HTML 언어 코드

HTML에서 사용하는 언어 코드는 주로 IETF BCP 47 표준에 기반합니다. 언어 코드는 ISO 639 표준에 따라 두 자리 또는 세 자리 코드로 구성되며, 필요한 경우 국가 코드도 포함할 수 있습니다.

언어	언어 코드	설명
한국어	`ko`	한국어
영어	`en`	영어 (일반)
미국 영어	`en-US`	미국 영어
영국 영어	`en-GB`	영국 영어
일본어	`ja`	일본어
중국어 (간체)	`zh-CN`	중국어 (간체)
중국어 (번체)	`zh-TW`	중국어 (번체)
독일어	`de`	독일어
프랑스어	`fr`	프랑스어
스페인어	`es`	스페인어
이탈리아어	`it`	이탈리아어
러시아어	`ru`	러시아어
포르투갈어	`pt`	포르투갈어
아랍어	`ar`	아랍어
힌디어	`hi`	힌디어
스웨덴어	`sv`	스웨덴어

5. 국가별 언어 코드

일부 언어는 지역별로 차이가 있을 수 있기 때문에, 지역 코드를 언어 코드에 추가하여 세부적으로 지정할 수 있습니다. 예를 들어, 영어는 미국과 영국에서 약간 다르게 사용되므로, en-US는 미국 영어를 의미하고 en-GB는 영국 영어를 의미합니다.

예시:

영국 영어 (British English):
```
    <html lang="en-GB">
```
미국 영어 (American English):
```
    <html lang="en-US">
```

이와 같은 방식으로, 같은 언어라도 국가별로 약간의 차이가 있는 경우에는 국가 코드까지 포함하여 세부적으로 지정할 수 있습니다.

6. 다국어 웹 페이지에서의 언어 코드 사용

웹 페이지가 여러 언어를 포함하는 경우, 각 섹션별로 lang 속성을 지정할 수 있습니다. 예를 들어, 페이지의 기본 언어는 영어이지만, 특정 문단은 한국어로 작성된 경우 각 문단에 lang 속성을 적용할 수 있습니다.

예시: 다국어 페이지

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Multi-language Web Page</title>
</head>
<body>
    <p>This paragraph is in English.</p>
    <p lang="ko">이 문단은 한국어로 작성되었습니다.</p>
</body>
</html>

이와 같이 각 언어에 맞는 lang 속성을 설정하면, 스크린 리더나 검색 엔진이 해당 섹션을 올바르게 처리할 수 있습니다.

7. 브라우저 호환성

HTML lang 속성은 모든 최신 브라우저에서 지원됩니다. 이 속성은 SEO, 접근성, 사용자 경험 등을 향상시키는 데 기여하며, 모든 HTML 문서에 설정하는 것이 권장됩니다.

브라우저	지원 여부
Chrome	Yes
Firefox	Yes
Safari	Yes
Edge	Yes
Internet Explorer	Yes

코딩 스쿨 HTML