Structure and Anatomy

4695 단어 htmlhtml

Structure

<html>
  
  <!-- 문서의 정보 -->
  <head>
    <meta charset="UTF-8">  <!-- 문자 인코딩 방식 (UTF-8: 한글 지원) -->
    <meta name="description" content="deepbm의 velog입니다.">
    <meta name="keywords" content="HTML, CSS, JS">
    <!-- 반응형 웹 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>브라우저 탭에 표시되는 웹사이트 제목</title>
  </head>

  <body>
    <!-- 화면에 보여지는 부분 -->
  </body>
  
</html>

<!DOCTYPE html>
html 문서 첫줄에 반드시 <!DOCTYPE> 선언을 해줘야 한다.
웹 브라우저에게 HTML 버전을 알려주는 역할을 하며, 위 선언은 html5 버전을 말한다.

<meta name="description" content="deepbm의 velog입니다.">
웹 페이지에 대한 설명을 정의

<meta name="keywords" content="HTML, CSS, JS">
SEO(검색엔진최적화)를 위해 검색엔진이 사용할 키워드 정의

<meta name="viewport" content="width=device-width, initial-scale=1.0">
뷰포트 설정
모든 장치의 실제 폭으로 렌더링되며, 화면 줌 레벨을 설정한다.


옵셔널 태그

필수가 아니며, 보통 정리의 목적으로 쓰인다.

<html>
<!doctype> 선언 뒤에 쓴다.

<head>
웹 페이지의 mata data가 포함된다.
메타데이터는 웹 페이지에 직접 표시되지 않는 페이지에 대한 정보를 말한다.

<body>
html 문서의 내용을 나타내며, 웹 브라우저에 렌더링된다.





Anatomy

좋은 웹페이지 즐겨찾기