[Do it] 01장 HTML 기본 다지기
01 HTML 기본 다지기
01 HTML 기본 문서구조
태그, 이것은 꼭 알아 두어야 합니다.
< />입니다. 태그는 <로 시작해서="">로 닫아주는 형식입니다.
태그는 소문자를 사용합니다.
꼭 그래야하는 것은 아니지만 HTML5 표준 명세에서는 태그와 태그 안에 사용하는 속성들은 모두 소문자로 사용할 것을 권장 합니다.
02 문서구조 살펴보기
빈 html문서를 생성한 뒤에 !를 쓰고 tab을 누르면 자동 완성이 됩니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html> - 문서 유형을 지정하는 선언문
문서 유형이란 웹 브라우저에게 ‘이제 부터 처리할 문서는 HTML 문서이고 어떤 유형을 사용했으니 그 버전에 맞는 방법으로 해석하라’라고 알려주는 것입니다.
<html> 태그 - 웹 문서 시작을 알리는 태그
<html lang="ko"> lang이라는 속성을 사용해해 문서에 지정할 수 있습니다.
| 코드 | 언어 |
|---|---|
| de | 독일어 |
| en | 영어 |
| fr | 프랑스어 |
| ja | 일본어 |
| ko | 한국어 |
| zh | 중국어 |
언어를 따로 설정하는 이유는 검색 사이트에서 특정언어로 검색할 때 제한될 수 있기 때문입니다.
<head> 태그 - 브라우저에게 정보를 주는 태그
웹 브라우저 화면에 보이지는 않지만 웹 브라우저가 알아야 할 정보들 은 보두 <head> 부분에 입력합니다. 문서에서 하용할 외부 파일들도 이곳에서 링크합니다.
<title>태그 - 문서 제목 title태그에서 지정하는 내용은 거의 모든 웹 브라우저의 제목 표시줄에 표시되고 해당 페이지를 방문하는 방문자나 검색엔진은 제목 표시줄의 제목을 보고 페이지 전체의 내용을 추측합니다.
<meta> 태그 - 문자 세트를 비롯한 문서 정보
데이터에 대한 데이터를 보통 메타 데이터라고 말하는데 이와 유사합니다. 메타 태그는 웹 브라우저 화면에는 보이지 않지만 웹 문서와 관련된 정보들을 지정합니다.
문자 세트 지정하기
화면에 글자를 표시할 때 어떤 인코딩 방법을 사용할지 지정할지 지정하는 것입니다. 웹 서버는 영어를 기본으로 하기 때무에 영어 이외의 문자를 화면에 표시하기 위해 미리 약속된 문자 세트를 사용해야 하는데 이때 HTML 5에서는 utf-8이라는 문자세트를 사용합니다.
<meta charset ="UTF-8">
모바일 기기 고려하기
모바일 기기에서 접속해서도 잘 적용되서 보이기 위해서
<meta name="viewport" content="width=device-width, initial-scale=1.0">
…
웹 문서에서 특수 문자 및 특수 기호 사용하기
HTML문서에서는 한글이나 영문, 숫자 등 사용자가 키보드로 입력하는 텍스트를 화면에 보여줍니다.
대표적인 특수 문자들을 몇가지 외워두는 것이 편합니다.
nbsp; : 공백
<br/>: 한 줄 띄어쓰기
⟨: <
WC3에서 제공하는 엔티티 코드표 https://dev.w3.org/html5/html-author/charref 에서 확인 가능합니다.
댓글남기기