R's Hacking Daily Log

HTML vs XML 본문

Daily-Note

HTML vs XML

hanhxx 2023. 3. 21. 20:45

HTML :: hypertext markup language

html은 웹 페이지를 만들 때 사용되는 언어로 html만으로 웹 페이지를 구성한다고 하기엔 무리가 있다 보니

Css, Javascript와 같이 사용되는 것을 흔히 볼 수 있다. 

 

 

브라우저에 들어가서 개발자 도구를 켜면 

Element 부분에서 현재 페이지에 대한 html 내용을 확인할 수 있다.

 

 

XML :: extensible markup language

xml은 웹 문서를 구조화하는 표준 형식으로, 데이터가 크다는 특성상 좀 더 가벼운 느낌의 Json이 탄생하게 되었다.

 

간단하게 살펴본 정의를 봤을 때 웹 문서 구조화? 웹 문서 생성? 거기서 거기인 말 같은데

뭐가 다르다는 건지 와닿지 않을 수 있다. 

 

그.래.서

html과 xml의 차이점이 무엇인지 정리해보고자 한다.

 

 

HTML vs XML

각 language의 목적을 생각해 보자.

html은 css, javascript와 더불어 browser에 web page를 띄우는 것(display)을 목적으로 한다.

html 코딩을 해봤거나 위에서 처럼(개발자 도구) html file을 읽어봤다면 알겠지만 " Tag "가 페이지의 구조를 잡아준다. 

 

 

<html>
    <head>
    	~~~
    </head>
    <body>
    	<h1>TITLE</h1>
        <p>content</p>
        <a href="zzzzxxxxyyyy">Click here</a>
        <img src="abcdefg.jpg"/>
    </body>
</html>

html 문서는 html이라는 tag안에 head, body tag가 있고 web page를 구성하는 부분의 내용은 body내용에 작성되고

html에서 tag라는 건 각자의 역할이 이미 표준으로 지정되어 있고 그 쓰임에 맞게 사용되어야 한다. 

 

 

 

이번엔 xml을 살펴보자.

xml은 데이터를 컴퓨터끼리 주고받을 때 그 데이터를 어떻게 나타낼 것인가(구조화할 것이가)에 초점을 맞춘다.

 

어떤 엑셀 파일이 있다고 해보자.

이름 학년 학번  성적
완두콩 4 1001 3.88
병아리콩 2 1102 4.1
강낭콩 2 1203 2.95

사람 입장에서는 데이터를 읽고 정보를 받아들이는 데에 간편한 형태일 수 있지만

데이터를 주고 받는 당사자(컴퓨터) 입장에서는 그리 좋은 형태라 할 수 없다.

 

 

그렇다면 위의 엑셀 파일 데이터를 어떻게 나타내야 좋을까??

이 문제를 해결하는 역할을 xml이 하는 것!! 

 

 

사실 html과 xml을 더 헷갈려했던 이유는 태그를 사용해 데이터의 구조를 표현했기 때문이다.

위의 데이터를 xml 형태로 나타낸 예시를 확인해 보자. 

<student>
    <name>완두콩</name>
    <grade>4</grade>
    <id>1001</id>
    <score>3.88</score>
</student>

html과 비교했을 때 볼 수 있는 점 중 하나는 태그를 마음대로 만들 수 있다는 것이다.

 

xml에서는 전달하고자 하는 데이터를 구조화할 때 사용하는 태그가 지정되어 있는 것이 아니기 때문에

"학생의 이름을 나타내는 태그를 name으로 할 거야"라고 한다면 위와 같이 구조를 만들 수 있다는 것!!

 

 

그렇다면 또 다른 예시를 보자.

저자 발행일
완두콩 껍질 까기 완듀콩 2022.3.21
혼자 공부하려 했지만
펴보지도 않은 파이썬
애플 파이 2022.3.22

위와 같은 책과 관련된 데이터가 있다고 한다면 이런 경우에는

 

 

<book>
    <title>완두콩 껍질 까기</title>
    <author>완듀콩</author>
    <date>2023.3.21</date>
</book>

학생과 관련된 경우와는 또 다르게 데이터에 알맞은 태그를 만들어 데이터를 구조화할 수 있다. 

 

 

 

지금까지 훑어본 내용으로 xml & html의 차이점을 정리해보자면,

1. tag

데이터를 구조화하는 태그(tag)의 역할이 고정되어 있는 html과 달리

xml은 데이터에 알맞게 생성한 태그로 데이터를 구조화할 수 있다.

 

 

2. 사용 목적

브라우저에서 웹 페이지를 띄우기 위한 html과 달리 

xml은 컴퓨터 입장에서 이해하기 쉽게 데이터를 구조화하여 주고받기 위해 탄생(?)했다!!

 

'Daily-Note' 카테고리의 다른 글

ICMP  (0) 2023.04.01
Binaryfuck  (0) 2023.03.23
NDP - overview  (0) 2023.03.18
절대 경로 & 상대 경로  (2) 2023.03.11
find / -type -perm -ls  (0) 2023.03.09
Comments