HTML 페이지를 직접 작성하기 위한 사전 공부입니다. 모든 HTML 페이지는 다음 코드에서 시작합니다.
|
<!DOCTYPE html> <html> <head> <title>html5 Basic Page</title> </head> <body>
</body> </html> |
<!DOCTYPE html>태그는 웹 브라우저가 현재 웹 페이지가 HTML5 문서임을 인식하게 만들어줍니다. W3C의 HTML5 명세에 따르면 모든 HTML5 문서는 반드시 <!DOCTYPE html> 태그를 표기해야합니다. 또한 반드시 첫 번째 줄에 있어야 합니다.
예시1
| <html lang="ko"> |
두 번째 줄의 html 태그는 모든 HTML 페이지의 루트 요소입니다. 모든 HTML 태그는 html 태그의 내부에 작성합니다. html 태그에는 lang속성을 입력할 수 있습니다. lang 속성에는 아래 표의 값을 입력합니다.
| 국가 | 속성값 | 국가 | 속성값 |
| 한국 | ko | 미국 | en |
| 일본 | ja | 러시아 | ru |
| 중국 | zh | 독일 | de |
lang 속성은 실제 웹 브라우저가 동작하는 데 어떠한 영향을 주지 않습니다. 대신 구글과 같은 검색 엔진이 웹 페이지를 탐색할 때 해당 웹 페이지가 어떤 언어로 만들어져 있는지 쉽게 인식하게 만듭니다. 전 세계적인 데이터 네트워크 구축을 위해서는 lang 속성을 입력하는 것이 좋습니다.
HTML 페이지 안에는 head 태그와 body 태그를 입력합니다. body 태그는 사용자에게 보이는 실제 부분이며, head 태그는 body 태그에서 필요한 스타일시트와 자바스크립트를 제공하는 데 사용됩니다.
head 태그 내부에는 다음 태그만 입력할 수 있습니다.
| 태그 이름 | 설명 |
| meta | 웹 페이지에 추가 정보를 전달합니다. |
| title | 웹 페이지의 제목 |
| script | 웹 페이지에 스크립트를 추가합니다. |
| link | 웹 페이지에 다른 파일을 추가합니다. |
| style | 웹 페이지에 스타일시트를 추가합니다. |
| base | 웹 페이지에 기본경로를 지정합니다. |
body 태그 내부에 삽입하는 태그는 굉장히 많습니다. title 태그는 브라우저에 표시하는 제목을 지정하는 태그입니다. title 태그에 글자를 입력하면 예시2처럼 웹 브라우저 상단에 표시됩니다.
예시2
title 태그도 html 태그의 lang 속성처럼 검색 엔진에게 웹 페이지의 제목과 관련된 정보를 주는 데 사용되므로 입력하는 것이 좋습니다.
'프로그래밍 공부 > HTML5' 카테고리의 다른 글
| HTML5 - 이미지 태그 (0) | 2019.11.12 |
|---|---|
| HTML5 - 테이블 태그 (0) | 2019.11.11 |
| HTML5 - 목록 태그 (0) | 2019.11.11 |
| HTML5 - 글자 태그 (0) | 2019.11.11 |
| HTML5 - 기본 용어 정리 (0) | 2019.11.11 |
