0️⃣ HTML과 XML이 왜 궁금한데?
본격적으로 안드로이드 공부에 앞서 간단히 강의를 들으며 XML로 UI를 그리니 '어라? 뭔가 HTML이랑 유사한 것 같은데?' 라는 생각이 들었다. MVVM 패턴처럼 UI코드와 로직코드가 나뉘어져 HTML 내부에 직접 인라인 CSS를 작성하는 듯한 느낌을 가장 많이 받았다. 물론 안드로이드를 배우다보면 이 생각의 옳고 그름을 알 수 있겠지만 XML과 HTML이 어떻게 다른지에 대해 궁금해진 계기는 이렇다.
1️⃣ HTML이란?
HTML은 Hypertext Markup Language 의 약자로 웹페이지가 어떻게 구조화되어 있는지 브라우저가 알 수 있도록 하는, 웹 브라우저를 위한 마크업 언어 이다. 이 HTML은 단순히 텍스트 파일에 불과하고 구조를 설계해주는 언어이기 때문에 CSS와 JavaScript로 보조하여 웹 페이지를 만들어내는 것이다.
HTML은 이러한 구조로 생겼다. 태그를 열고 닫아 하나의 요소를 구성하고 그 안에 내용을 입력해주면 된다. 일반적으로 들어오는 내용은 문자지만 다른 요소가 들어올 수도 있다. 또한 태그 내부에 속성값을 입력해 원하는 대로 조작할 수 있다.
2️⃣ XML이란?
XML은 Extensible Markup Language 의 약자로 HTML과 유사하지만 미리 정의된 태그가 없는 마크업 언어 이다. 대신 필요에 맞게 특별히 설계된 태그를 직접 정의하고, 이는 데이터를 공유 가능한 방식으로 정의하고 저장 할 수 있음을 의미한다. 사전에 정의된 규칙을 사용하면 수신자가 이러한 규칙을 사용하여 데이터를 효율적이고 정확하게 읽을 수 있다.
위 HTML에서는 <p> 태그를 사용하여 이미 정해진 태그를 썼지만 이렇듯 XML은 사용자가 지정하는대로 태그를 사용할 수 있기 때문에 훨씬 더 유연하게 사용할 수 있다.
3️⃣ HTML과 XML의 유사점
HTML과 XML은 마크업 언어 라는 프로그래밍 언어 계열에 속한다.
❓ 그럼, 여기서 잠깐 봐야할 점이 있는데 도대체 마크업 언어 가 무엇일까?
마크업 언어 는 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어이다. 일반적으로 데이터를 기술하는 정도로만 사용되기에 프로그래밍 언어와는 구별된다.
사람과 다른 소프트웨어 프로그램 모두에 데이터를 설명한다는 특징을 가지고 있으며, 데이터의 구조, 유형, 속성, 부품 간의 관계, 표시 및 의미를 정의하는 읽기 쉬운 구문을 사용한다.
대표적으로 HTML과 XML이 있으며 SVG도 이에 속한다.
- 마크업 언어이기 때문에 태그와 속성, 요소를 비롯한 구문이 비슷하고, 지정된 언어의 구문 규칙을 준수 해야한다.
- 단독으로 사용하지 않아고 스크립팅 언어와 결합 되어 웹 페이지 또는 어플리케이션을 동적으로 생성한다.
- 텍스트 기반의 간단한 구문이기 때문에 언어가 다른 운영체제 및 플랫폼에서 수정 없이 작동한다.
4️⃣ HTML과 XML의 차이점
1. 태그
- HTML은 모든 사람이 사용해야 하는 사전에 정의된 태그가 있고, HTML을 작성하는 동안에는 태그를 직접 만들 수 없다.
- <head> <p> <h1><div> 등등 사전 정의된 태그들
- XML은 문서 작성자로서 정의할 수 있는 사용자 지정 태그를 사용한다.
- XML 태그는 확장이 가능하므로 문서 목적에 맞게 맞춤 제작되고, 문서 작성자가 태그와 속성을 모두 정의한다.
2. 목적
- HTML은 웹 언어로 널리 알려져있어 주요 목적은 텍스트 기반 문서에 제공된 콘텐츠를 브라우저에 표시하는 것이다.
- XML은 데이터의 구조를 교환하고 저장할 수 있기 때문에 이를 이해하고 사용할 수 있게 한다.
3. 타이핑
- HTML은 런타임에 예상 데이터 유형과 속성 유형을 확인하는 동적 타이핑을 사용한다. 때문에 서로의 유형이 다르면 런타임에 웹 페이지 오류가 발생하거나 예기치 않은 동작이 발생할 수 있다.
- XML은 스키마에서 속성 유형을 미리 정의하고 컴파일하거나 처리하기 전에 확인하는 정적 타이핑을 사용한다.
| HTML | XML | |
| 정의 | 브라우저에서 주로 사용되며 구조화된 콘텐츠를 표시하는 마크업 언어 |
컴퓨터 시스템 간에 구조화된 데이터를 교환하는 마크업 언어 |
| 출시연도 | 1993년 | 1998년 |
| 목적 | 프리젠테이션 언어 | 데이터 교환 언어 |
| 태그 | 사전 정의된 태그 | 확장 가능한 태그 |
| 타이핑 | 동적 | 정적 |
| 사용처 | 웹 페이지 또는 웹앱 구축 | 두 시스템의 데이터 교환 (근래에는 JSON이 더 대세) |
❗ 출처
참고 사이트1 : https://developer.mozilla.org/ko/docs/Learn/HTML/Introduction_to_HTML/Getting_started
HTML 시작하기 - Web 개발 학습하기 | MDN
HTML 기본 사항을 둘러 보셨기를 바랍니다.
developer.mozilla.org
참고 사이트2 : https://aws.amazon.com/ko/what-is/xml/
XML이란 무엇인가요? - Extensible Markup Language(XML) 설명 - AWS
Extensible Markup Language(XML)를 사용하면 공유 가능한 방식으로 데이터를 정의하고 저장할 수 있습니다. XML은 웹 사이트, 데이터베이스 및 타사 애플리케이션과 같은 컴퓨터 시스템 간의 정보 교환을
aws.amazon.com
참고 사이트3 : https://aws.amazon.com/ko/compare/the-difference-between-html-and-xml/
XML과 HTML 비교 - 마크업 언어 간의 차이점 - AWS
HTML과 XML은 애플리케이션 개발과 웹 개발에서 널리 사용되는 두 가지 마크업 언어입니다. 이름은 비슷하지만 사용 사례는 다릅니다. HTML은 주로 애플리케이션의 UI를 개발하는 데 사용됩니다. 웹
aws.amazon.com
참고 사이트3 : https://ko.wikipedia.org/wiki/%EB%A7%88%ED%81%AC%EC%97%85_%EC%96%B8%EC%96%B4?tableofcontents=1
마크업 언어 - 위키백과, 우리 모두의 백과사전
위키백과, 우리 모두의 백과사전.
ko.wikipedia.org
