마크업(Mark up)이란?
- 마크업(mark up)은 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지이다.
- 주요 마크업 언어에는 HTML,Markdown등이 있다.
- 간단하게 말해 문서의 골격에 해당하는 부분을 작성하는데 사용된다.
시멘틱 마크업(Semantic markup)
시멘틱(Semantic)의 사전적인 뜻은 "의미론적인" 정도로 해석할 수 있다.
이것은 마크업을 할 때 의미를 부여하는 태그로 보면 되는데 시멘틱 하게 마크업을 하는 것이 중요한 이유는 HTML 문서는 보통 시각적인 방법으로 사용자들에게 정보를 전달하지만 , 모든 사람이 정보를 동일하게 받아들일 수 있는 환경이 아닐 수도 있기 때문이다. 사용자가 보편적인 방법으로 정보전달을 받지 못하는 상황에서 시멘틱한 마크업을 사용하였다면 조금 더 정확한 정보를 전달할 수 있다.
예를 들어 시각장애인의 경우에는 음성으로 정보를 전달 받아야하는데 시멘틱하게 마크업이 되어 있지 않다면 지금 듣고 있는 곳이 제목인지 내용인지 알기 힘든데 시멘틱한 마크업을 통해 작업되었다면 그러한 것들을 조금 더 정확하게 전달받을 수 있게 된다. 물론 실제로 마크업을 할 때는 작업자마다 콘텐츠의 의미를 해석하는 차이가 조금 있을 수도 있지만 가급적 시멘틱하게 마크업을 하려고 노력하는 것도 중요하다.
논리적 순서 마크업(Logical sequence markup)
시멘틱한 마크업과 함께 논리적인 순서에 의해 마크업을 하는 것도 매우 중요하다.
논리적 순서 마크업이란 마크업을 할 때 그냥 눈에 보이는 순서대로 마크업을 하는 것이 아니라 같은 카테고리별로 작업을 진행하는 것을 뜻하며 키보드나 터치패드와 같은 입력 장치만으로 HTML 문서의 모든 콘텐츠를 논리적인 순서로 이동하여 사용할 수 있도록 하는 입력장치 접근성 및 웹 접근성과 밀접한 관련이 있다. 따라서 마크업을 할 때 최대한 논리적 순서에 맞게 마크업하는 것이 중요하다.
간단하게 말해 마크업을 할 때는 디자인의 시각적 흐름보다는 내용에 대한 논리적 흐름 순서를 잘 파악하여 마크업 하는 것이 무엇보다 중요하다는 뜻이다.
이상으로 오늘은 시멘틱 마크업과 논리적 순서 마크업에 대해 알아보았습니다.
시멘틱 마크업은 마크업을 하는 구조적인 부분이고 논리적 순서 마크업은 마크업을 하는 순서라고 할 수 있습니다.
건물을 짓거나 무언가를 만들 때 올바른 장소에 필요한 재료가 순서대로 쌓여야 제대로 만들어지는 것처럼
마크업 또한 올바른 장소에 맞는 요소가 순서대로 들어가야 뼈대가 튼튼한 마크업이 되고
나중에 유지/보수하는 것도 편해집니다. 우리 모두 기초가 튼튼한 마크업을 할 수 있도록 노력합시다!