마크업 언어는 문서의 형식이나 데이터의 구조를 나타내는 규칙을 정의하는 컴퓨터 언어이다. 문서에 어떤 내용이 있고 각 부분이 어떤 관계를 이루는지 기술한다. 데이터의 의미와 구조를 표현하는 데 초점을 둔다는 점에서, 계산이나 동작을 표현하는 프로그래밍 언어와 구별된다.[2][4]

1. 개요

마크업은 본래 문서에 교정 부호를 표시하는 데 쓰였으며, 이후 문서 구조와 데이터 표현으로 활용 범위가 넓어졌다. HTML과 XML, 마크다운은 이러한 규칙을 서로 다른 방식으로 사용하는 사례다.[2]

일반적인 문서 작성에서도 글자를 굵게 하거나 크게 만들고, 문서의 모양을 정하는 일은 마크업으로 이해할 수 있다. 컴퓨터 문서에서는 이러한 정보가 소스에 기록되고, 렌더링을 거쳐 사용자에게 보이는 형태로 나타날 수 있다.[2]

2. 태그와 문서 구조 표현

태그는 문서의 각 부분을 표시하는 표식이다. HTML에서는 태그를 이용해 제목과 단락을 묶고, 글자를 굵게 하거나 이탤릭체로 표현하는 등 콘텐츠의 종류와 표시 방식을 지정할 수 있다.[1][4]

XML 요소는 시작 태그와 종료 태그 사이에 내용을 담고, 속성은 요소에 대한 추가 정보를 이름과 값의 쌍으로 제공한다. 요소들이 안팎으로 포함되면서 문서는 계층적인 트리가 되고, 이 구조로 데이터 사이의 관계를 나타낼 수 있다.[3]

XML에서는 사용자가 태그를 정의해 특정 분야나 응용 프로그램에 맞는 데이터 형식을 표현할 수 있다. 문서가 정해진 문법 규칙을 따르는지 확인할 수 있고, DTD나 XML 스키마로 구조를 정의하고 유효성을 검증할 수도 있다.[3]

3. 마크업의 유형과 의미

기술적 마크업은 문서의 외형이나 처리 절차보다 내용의 의미와 구조를 기술하는 데 중점을 둔다. HTML과 마크다운, 위키 문법은 문서의 논리적 구조를 표현하는 사례로 제시된다.[2]

시맨틱 HTML은 태그에 역할과 의미를 부여한다. 예를 들어 header, nav, main, section 같은 요소는 문서의 어느 부분이 머리말이나 탐색, 주요 내용에 해당하는지를 나타낸다.[1]

의미가 분명한 태그는 웹 크롤러가 페이지를 색인하는 데 도움을 줄 수 있다. 또한 스크린 리더를 사용하는 사람에게 페이지의 구조와 정보에 관한 단서를 제공해 접근과 이용을 돕는다.[1]

4. 대표적인 마크업 언어

HTML은 웹 페이지의 구조와 콘텐츠를 정의하는 대표적인 기술적 마크업 언어다. 태그로 제목과 단락, 링크 같은 부분을 조직하고, 브라우저가 텍스트와 이미지 등의 콘텐츠를 해석하고 렌더링하도록 정보를 제공한다.[2][4]

XML은 사용자가 직접 태그를 정의할 수 있으며, 주로 시스템 간 구조화된 데이터를 교환하기 위한 형식으로 쓰인다. XML은 SGML의 단순화된 부분집합으로 설계되었고, 설정 파일과 오피스 문서 형식, 과학 데이터 교환 등에서도 활용된다.[2][3]

마크다운은 간결한 문법으로 문서를 작성할 수 있는 마크업 언어다. 위키 엔진도 고유한 문법을 사용해 편집자가 문서의 논리적 구조를 표현하도록 지원하는 사례다.[2]

5. 문서 변환과 활용

마크업 소스는 문서를 여는 프로그램에서 렌더링되어 사용자가 보는 형태가 될 수 있다. 워드프로세서에서 글꼴이나 굵기를 지정한 내용도 XML 등의 소스 형태로 저장될 수 있다.[2]

위키 문법의 __'''나무위키'''__라는 표기는 HTML의 <u><strong>나무위키</strong></u>로 변환되는 사례가 있다. 이는 작성할 때 입력한 마크업과 최종 문서에 적용되는 구조가 서로 다른 표기 방식일 수 있음을 보여준다.[2]

마크업 언어의 활용은 문서 구조 표현에서 데이터 직렬화와 설정 파일 작성으로 넓어졌다. XML은 구조화된 데이터 교환뿐 아니라 설정 파일과 오피스 문서 형식 등에도 사용된다.[2][3]

6. 관련 문서

  • HTML
  • 마크다운
  • XML
  • SGML
  • DTD
  • XML 스키마

7. 인용 및 각주

[1] Wwww.freecodecamp.org(새 탭에서 열림)

[2] Uunisquads.io(새 탭에서 열림)

[3] Uunisquads.io(새 탭에서 열림)

[4] Uunisquads.io(새 탭에서 열림)