티스토리 뷰

프로그래밍/웹개발

HTML이란?

키성열 2025. 4. 11. 00:05
반응형

 

✅ HTML이란?

**HTML (HyperText Markup Language)**은 웹페이지를 구성하는 구조를 정의하는 언어입니다.
문서의 제목, 단락, 표, 이미지, 링크 등의 요소가 무엇인지, 어디에 위치해야 하는지, 어떤 역할을 하는지를 명시해주는 표준 마크업 언어입니다.

HTML은 단독으로 작동하지 않습니다. 웹이라는 시스템 안에서, 그리고 웹 브라우저라는 해석기와 함께 작동할 때 비로소 우리가 보는 웹페이지가 완성됩니다.


🧩 HTML은 어떤 문제를 해결하려고 등장했는가?

인터넷이 등장했을 때, 사람들은 단순히 파일을 주고받는 수준에 머물러 있었습니다. 그런데 문서를 교환하다 보니 다음과 같은 문제가 생겼습니다:

  1. 이 문서에서 제목과 본문을 구분하고 싶다.
  2. 어떤 문장에서 **다른 문서로 연결(링크)**하고 싶다.
  3. 표, 이미지, 리스트 같은 다양한 요소를 넣고 싶다.
  4. 그리고 이걸 브라우저에서 똑같이 볼 수 있게 하고 싶다.

이 문제들을 해결하기 위해 HTML이 등장했습니다. 즉, HTML은 "이 문서의 구조와 의미를 표준화하자"는 목적에서 출발한 언어입니다.


🌐 HTML과 웹의 관계

**웹(Web)**은 단순한 네트워크가 아니라, 하이퍼텍스트(문서 간 연결) 기반의 정보 공간입니다. 여기서 HTML은 이런 기능을 실현하는 핵심 문서 언어입니다.

 

구성 요소  역할
HTML 웹페이지의 구조를 정의하는 문서 언어
Web HTML, CSS, JS 등이 존재하는 인터넷상의 정보 공간
HTTP HTML 문서를 주고받는 통신 규약
URL HTML 문서의 위치를 지정하는 주소 체계

즉, HTML은 웹이라는 공간에서 ‘내용’을 담은 문서 그 자체입니다.


🧭 HTML과 브라우저의 관계

HTML은 사람이 읽기에는 불편한 태그 문서이고, 이것을 읽고 해석해서 화면에 보여주는 것이 웹 브라우저의 역할입니다.

브라우저(예: Chrome, Safari, Edge)는 다음과 같은 과정을 거칩니다:

  1. HTML 문서를 서버로부터 받아옴
  2. HTML의 태그들을 분석(Parsing)
  3. 구조를 이해하고 화면에 렌더링(Rendering)
  4. 필요시, CSS/JavaScript 파일도 함께 해석

즉, HTML은 ‘설계도’, 브라우저는 그걸 읽고 화면에 **‘지어주는 건축가’**입니다.


🧱 HTML 문서 구조

HTML 문서는 다음과 같은 구조를 가집니다:


  
    

안녕하세요

이건 문단입니다.

    링크로 이동
  

 

태그  설명
<!DOCTYPE html> HTML5 문서임을 선언
<html> 전체 HTML 문서의 루트
<head> 문서의 정보 (메타데이터, 제목, 스타일 등)
<body> 실제 화면에 나타날 콘텐츠

🔧 HTML은 어떤 일을 할 수 있는가?

HTML은 직접 디자인하거나 동작을 만들진 않습니다. 다만 웹페이지의 요소를 정의하는 역할을 합니다.

 

역할  대표 태그
제목 <h1>~<h6>
문단 <p>
이미지 <img src="...">
링크 <a href="...">
리스트 <ul>, <ol>, <li>
<table>, <tr>, <td>

🧠 HTML의 의의

HTML은 웹이 존재하려면 반드시 필요한 언어입니다.
웹 = HTML 문서들의 네트워크라고 봐도 무방합니다. HTML이 없다면 웹은 단순한 파일 모음에 지나지 않으며,
링크, 구조화, 정보 탐색, 시각적 구분 등도 불가능해집니다.

또한 HTML은 CSS, JavaScript와 함께 작동함으로써:

  • HTML: 구조
  • CSS: 스타일 (색, 크기, 정렬 등)
  • JavaScript: 동작 (클릭 이벤트, 팝업 등)

을 함께 구성하며 완전한 웹 경험을 구성합니다.


 

반응형

'프로그래밍 > 웹개발' 카테고리의 다른 글

선택자란?  (0) 2025.04.11
CSS란? 왜 CSS는 생겨났을까?  (0) 2025.04.11
block요소랑 inline요소란?  (0) 2025.04.11
요소와 태그의 차이 (HTML)  (0) 2025.04.11
태그란?  (0) 2025.04.11
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2025/04   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30
글 보관함
반응형