첫 날 다루었던 HTML에 대해 간단히 정리해 보려 한다.

HTML

HTML이란 웹브라우저에서 표현되는 모든 문서라고 할 수 있다.

html에서는 우리가 흔히 보는 글자, 사진, 링크 등을 표현할 때 태그(tag)를 사용한다.

html 파일의 구조는 간단히 보면 다음과 같다.

<!DOCTYPE html> 
<html>
    <head>
       <meta charset="utf-8">
       <meta name="viewport" content="width=device-width">
       <title>문서의 제목</title>
    </head>
    <body>
        내가 쓰고 싶은 내용들을 이곳에 작성
    </body>
</html>

기억해야 할 것은 태그를 이용하여 작성한다는 것인데, start tag와 end tag가 있다.
예외로 끝태그가 없는 것도 있으니 사용할 때에 유의해야한다.

가장 첫 줄에 나오는 DOCTYPE은 HTML 파일이라면 제일 첫 줄에 위치해야 하는 선언문이다.
모습은 태그와 비슷하지만 태그는 아닌데 이 html파일이 어떤 버전의 html을 사용했는지 브라우저에 알려주는 역할을 한다.

head태그에는 사이트의 제목, 설명, 부가 정보나 기술적 내용이 들어가는 부분이다.

<meta charset="utf-8"> : 한글, 일본어, 중국어가 포함된 페이지라면 utf-8 이라는 값으로 문자 인코딩을 추가해야 한다. 이것을 설정해 주지 않으면 웹브라우저가 해당 html파일을 인코딩 할 때 문자코드를 알 수 없어 글자가 깨지는 현상이 나타난다. 즉, 해당 태그는 '웹문서 파일이 웹브라우저에서 표시되는 과정에서 인코딩할때 지정된 문자코드로 인코딩해라' 라는 의미이다.

<meta name="viewport" content="width=device-width"> : 디바이스의 가로 크기가 곧 웹 페이지의 가로와 같다는 의미. 모바일에서 웹사이트가 예쁘게 잘 보이려면 추가해야 하는 정보인데 해당 정보를 추가하지 않으면 데스크탑 버전의 웹페이지가 축소되어 보이는 현상이 나타난다고 한다.

다음에 나오는 body태그에는 본문을 작성하면 되는데, 여기에 사용되는 태그가 꽤 많다. 해당 태그들을 더 자세히 알고 싶으면 HTML태그 정리를 참조하면 좋을 것이다.