첫 날 다루었던 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태그 정리를 참조하면 좋을 것이다.
열공하세요!!ㅎㅎ