HTML: 두 판 사이의 차이
IT 위키
(새 문서: HTML(HyperText Markup Language, 하이퍼텍스트 마크업 언어)은 웹 페이지를 구성하고 구조화하기 위해 사용되는 표준 마크업 언어이다. 텍스트, 이미지, 링크, 멀티미디어 등 다양한 콘텐츠를 웹 브라우저에 표시하기 위해 사용되며, 웹의 기본 뼈대를 정의한다. == 개념 == * HTML은 '''마크업 언어'''로, 콘텐츠에 의미와 구조를 부여함 * '''태그(tag)'''를 사용해 제목, 문단, 표,...) |
편집 요약 없음 |
||
| 8번째 줄: | 8번째 줄: | ||
== 기본 구조 == | == 기본 구조 == | ||
HTML 문서는 다음과 같은 기본 구조를 가진다: | HTML 문서는 다음과 같은 기본 구조를 가진다:<syntaxhighlight lang="html"> | ||
<!DOCTYPE html> | |||
<html> | |||
<head> | |||
<title>문서 제목</title> | |||
</head> | |||
<body> | |||
<h1>제목</h1> | |||
<p>여기는 문단입니다.</p> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
* `<!DOCTYPE html>`: HTML5 문서임을 선언 | * `<!DOCTYPE html>`: HTML5 문서임을 선언 | ||
| 17번째 줄: | 27번째 줄: | ||
== 주요 태그 == | == 주요 태그 == | ||
* | * <nowiki><h1></nowiki>~<nowiki><h6></nowiki>: 제목 | ||
* | *<nowiki><p></nowiki>: 문단 | ||
* | *<nowiki><a href=""></nowiki>: 하이퍼링크 | ||
* | *<nowiki><img src=""></nowiki>: 이미지 | ||
* | *<nowiki><ul></nowiki>, <nowiki><ol></nowiki>, <nowiki><li></nowiki>: 리스트 | ||
* | *<nowiki><table></nowiki>, <nowiki><tr></nowiki>, <nowiki><td></nowiki>: 표 | ||
* | *<nowiki><div></nowiki>, <nowiki><span></nowiki>: 구역 나누기 및 스타일 지정 | ||
== 특징 == | == 특징== | ||
* 태그 기반의 마크업 구조 | *태그 기반의 마크업 구조 | ||
* 웹 표준을 따르는 시맨틱 마크업 가능 | *웹 표준을 따르는 시맨틱 마크업 가능 | ||
* 텍스트 기반 → 사람이 읽고 편집하기 쉬움 | *텍스트 기반 → 사람이 읽고 편집하기 쉬움 | ||
* [[CSS]], [[JavaScript]]와 함께 사용됨 | *[[CSS]], [[JavaScript]]와 함께 사용됨 | ||
== HTML 버전 == | ==HTML 버전 == | ||
* HTML 4.01: 오랜 시간 표준으로 사용됨 | *HTML 4.01: 오랜 시간 표준으로 사용됨 | ||
* XHTML: XML 기반의 엄격한 문법 | *XHTML: XML 기반의 엄격한 문법 | ||
* HTML5: 현재 표준, 멀티미디어 및 모바일 웹 지원 강화 | *HTML5: 현재 표준, 멀티미디어 및 모바일 웹 지원 강화 | ||
== 활용 == | ==활용== | ||
* 웹 사이트 및 웹 애플리케이션 개발 | *웹 사이트 및 웹 애플리케이션 개발 | ||
* 전자문서 구조화 | *전자문서 구조화 | ||
* SEO(검색 엔진 최적화)를 위한 구조 제공 | *SEO(검색 엔진 최적화)를 위한 구조 제공 | ||
== 같이 보기 == | ==같이 보기== | ||
* [[웹]] | *[[웹]] | ||
* [[CSS]] | *[[CSS]] | ||
* [[JavaScript]] | *[[JavaScript]] | ||
* [[DOM]] | *[[DOM]] | ||
* [[웹 브라우저]] | *[[웹 브라우저]] | ||
== 참고 문헌 == | ==참고 문헌== | ||
* W3C. HTML Standard. https://html.spec.whatwg.org/ | *W3C. HTML Standard. https://html.spec.whatwg.org/ | ||
* MDN Web Docs. HTML Reference. https://developer.mozilla.org/ko/docs/Web/HTML | *MDN Web Docs. HTML Reference. https://developer.mozilla.org/ko/docs/Web/HTML | ||
[[분류:프로그래밍 언어]] | |||
[[분류:인터넷]] | |||
2025년 4월 4일 (금) 01:40 기준 최신판
HTML(HyperText Markup Language, 하이퍼텍스트 마크업 언어)은 웹 페이지를 구성하고 구조화하기 위해 사용되는 표준 마크업 언어이다. 텍스트, 이미지, 링크, 멀티미디어 등 다양한 콘텐츠를 웹 브라우저에 표시하기 위해 사용되며, 웹의 기본 뼈대를 정의한다.
1 개념[편집 | 원본 편집]
- HTML은 마크업 언어로, 콘텐츠에 의미와 구조를 부여함
- 태그(tag)를 사용해 제목, 문단, 표, 목록, 링크 등을 정의
- 웹 브라우저는 HTML 문서를 해석하여 사용자에게 시각적으로 보여줌
- CSS는 스타일, JavaScript는 동작을 정의함으로써 HTML과 함께 웹을 구성
2 기본 구조[편집 | 원본 편집]
HTML 문서는 다음과 같은 기본 구조를 가진다:
<!DOCTYPE html>
<html>
<head>
<title>문서 제목</title>
</head>
<body>
<h1>제목</h1>
<p>여기는 문단입니다.</p>
</body>
</html>
- `<!DOCTYPE html>`: HTML5 문서임을 선언
- `<html>`: 전체 HTML 문서의 루트
- `<head>`: 메타데이터 영역 (제목, 문자셋, CSS 연결 등)
- `<body>`: 실제 화면에 표시되는 콘텐츠 영역
3 주요 태그[편집 | 원본 편집]
- <h1>~<h6>: 제목
- <p>: 문단
- <a href="">: 하이퍼링크
- <img src="">: 이미지
- <ul>, <ol>, <li>: 리스트
- <table>, <tr>, <td>: 표
- <div>, <span>: 구역 나누기 및 스타일 지정
4 특징[편집 | 원본 편집]
- 태그 기반의 마크업 구조
- 웹 표준을 따르는 시맨틱 마크업 가능
- 텍스트 기반 → 사람이 읽고 편집하기 쉬움
- CSS, JavaScript와 함께 사용됨
5 HTML 버전[편집 | 원본 편집]
- HTML 4.01: 오랜 시간 표준으로 사용됨
- XHTML: XML 기반의 엄격한 문법
- HTML5: 현재 표준, 멀티미디어 및 모바일 웹 지원 강화
6 활용[편집 | 원본 편집]
- 웹 사이트 및 웹 애플리케이션 개발
- 전자문서 구조화
- SEO(검색 엔진 최적화)를 위한 구조 제공
7 같이 보기[편집 | 원본 편집]
8 참고 문헌[편집 | 원본 편집]
- W3C. HTML Standard. https://html.spec.whatwg.org/
- MDN Web Docs. HTML Reference. https://developer.mozilla.org/ko/docs/Web/HTML
