HTML 문서는 일반적으로 다음과 같은 기본 구조로 구성됩니다.
<!DOCTYPE html>
<html>
<head>
<title>문서 제목</title>
</head>
<body>
<h1>안녕하세요, HTML!</h1>
<p>HTML 문서의 기본 예제입니다.</p>
</body>
</html>
주요 구성 요소:
- <!DOCTYPE html>: HTML문서가 어떤 버전으로 작성되었는지 브라우저가 알 수 있도록 선언하는 코드입니다. 브라우저는 <!DOCTYPE html>을 확인한 뒤, HTML5 표준을 기준으로 문서를 해석합니다. 선언이 없거나 잘못된 경우, 브라우저는 "호환성 모드"가 아닌 "쿼크 모드"로 문서를 렌더링(컴퓨터에서 이미지를 보이는 방식)할 수 도 있습니다.
- <html>: 문서의 루트 요소로, 모든 HTML 콘텐츠를 감쌉니다.
- <head>: 이 태그 사이에 놓인 정보가 웹페이지에서 보이지는 않지만 웹 페이지 전체에 적용할 사항들인 문서 메타데이터(문서 제목, 문자 인코딩 등)이 코딩됩니다.
- <title>: 이 태그에 적힌 내용은 웹페이지의 제목입니다.
- <body>: 이 태그 사이에 놓인 정보는 웹 페이지의 실제 콘텐츠(텍스트, 이미지, 링크 등)를 코딩하는 부분입니다.
- <p>: 문단을 표시하는 태그입니다. <p> 태그 사이의 글은 홈페이지가 한 문단으로 인식합니다.
- 쿼크모드와 호환성 모드
더보기
* 쿼크 모드 (Quirks Mode)
오래된 웹 브라우저의 렌더링(컴퓨터에서 이미지를 보이는 방식)을 모방하는 모드로 HTML 문서에 DOCTYPE 선언이 없거나, 잘못된 DOCTYPE을 사용했을 때 사용됩니다.
레이아웃과 스타일이 옛날 브라우저의 방식으로 처리되고 CSS와 JavaScript의 일부 기능에 문제가 발생할 수 있습니다. 구형 웹사이트와의 호환성을 위해 사용되기도 합니다.
* 호환성 모드 (Standards Mode)
최신 웹 표준을 따르는 모드로, DOCTYPE 선언이 올바르게 설정된 경우 활성화됩니다.
최신 CSS와 JavaScript 기능을 지원하고 웹 페이지의 레이아웃과 스타일이 표준에 맞게 처리됩니다.
'웹페이지 만들기 > HTML' 카테고리의 다른 글
| HTML로 웹페이지 만들기 4: 영역 나누기<div></div> (0) | 2025.01.06 |
|---|---|
| HTML로 웹페이지 만들기 3: 그림태그 <img> (1) | 2025.01.06 |
| HTML로 웹페이지 만들기 2: 줄 바꿈 태그 <br> (0) | 2025.01.06 |
| HTML소개 (0) | 2025.01.06 |