웹페이지를 구성하는 HTML 태그에서 가장 상단에 있는 태그는 <html> 태그다.
그리고 만약 여기에 lang 속성이 없다면 직접 입력해서 써넣고 저장해야 한다.
그게 무슨 말인지, 그리고 왜 lang 속성을 꼭 넣어야 하는지 설명하겠다.
구글 블로그의 html 태그에 lang 속성이 없었다
일단 이게 무슨 말인지 개발자 도구를 열어서 눈으로 확인해 보자.
블로그가 열려있는 웹브라우저에서 [F12] 키를 눌러서 개발자 도구를 열어서 확인해 보자.
html 태그에 여러가지 속성들이 있지만, 그중에 lang이라는 속성은 보이지 않는다.
lang은 language의 준말이다.
lang 속성을 넣어야 하는 이유와 넣었을 때의 장점
lang 속성은 language라는 단어의 뜻 그대로 웹페이지의 주요 언어를 선언하는 역할을 한다.
그리고 다음과 같은 이유로 반드시 넣는 것을 추천한다.
1. 검색엔진 최적화 (SEO)
구글과 같은 검색엔진은 lang 속성을 통해 페이지의 언어를 파악한다.
이 정보를 바탕으로 검색 결과를 필터링하고, 해당 언어를 사용하는 사용자에게 더 적절한 콘텐츠를 노출시킨다.
lang='ko'로 설정하면 한국어 검색 결과에서 더 잘 노출될 가능성이 높아진다.
2. 스크린 리더 등 보조 기술
시각 장애인을 위한 스크린 리더(Screen Reader)는 lang 속성을 활용해 웹페이지의 언어를 인식한다.
올바른 언어로 설정되어야 스크린 리더가 정확한 발음으로 콘텐츠를 읽어줄 수 있어, 웹 접근성을 크게 향상시킨다.
3. 번역 서비스
위의 이미지를 보면 주요 언어가 한국어가 아닌 웹페이지에 들어갔을 때 구글 크롬 브라우저에서 뜨는 번역 서비스가 보인다.
이런 구글 크롬의 번역 기능과 같은 브라우저 내 번역 서비스는 lang 속성 정보를 바탕으로 번역 여부를 결정한다.
그러니 한국어를 잘 모르는 외국인이 우리 블로그를 방문했을 때를 대비해서 lang 속성이 제대로 설정되어 있어야 한다.
만약 lang 속성이 없거나 잘못 설정되어 있으면, 브라우저가 언어를 잘못 인식해 번역이 제대로 작동하지 않을 수 있다.
4. 웹 접근성 (Web Accessibility)
lang 속성은 웹 표준을 준수하는 기본적인 요소다.
정확한 언어 선언은 모든 사용자가 웹 콘텐츠를 불편함 없이 이용할 수 있도록 하는 '웹 접근성'의 중요한 부분이다.
직접 html 태그에 lang 속성을 추가하자
참고로 나는 구글 블로그 관리 페이지에서 '설정'으로 들어가서 이렇게 블로그 언어를 설정하면, 당연히 블로그의 <html> 태그에 lang='ko' 속성이 들어갈 줄 알았다.
그런데 그게 아니라면 위의 설정은 도대체 무엇을 위한 설정이었는지 모르겠다.
어쨌든 이것과는 관계 없으니 템플릿 HTML 편집을 통해 직접 lang 속성을 추가하자.
<html lang='ko'>이런 식으로 <html> 태그 안에 lang='ko'를 추가하면 된다.
구글 블로그 관리 페이지에서 '테마' > 'HTML 편집'으로 이동한다.
그리고 이렇게 <html> 태그 안에 lang='ko'를 추가하고 저장하자.
그리고 블로그를 다시 새로고침하고 개발자 도구를 확인해 보면 <html> 태그 안에 제대로 lang='ko'가 추가된 것을 확인할 수 있다.
응원이나 피드백이 담긴 댓글은 제가 계속 블로그를 해나갈 수 있는 원동력이 됩니다. 😊
지인에게 보여주고 싶은 글이었다면 URL을 복사해서 메신저나 소셜 미디어에 공유해 주세요.
0 Comments
댓글 쓰기
🔸 댓글은 블로그 운영자의 승인 후에 블로그에 표시됩니다.
🔸 비로그인 방문자 분께서는 '익명'보다 이름/URL로 댓글을 남겨주시면 감사하겠습니다. (URL은 생략 가능합니다.)
🔸 구글 로그인 방문자는 '알림 사용'에 체크를 하시면, 남겨주신 댓글에 대한 답글 알림을 메일로 받아볼 수 있습니다. 📩