티스토리 뷰
HTML 쉽게 이해하기 강좌가 계속 진행중입니다. 많은 관심 부탁드립니다.
이번시간에는 <head> 태그에 대해서 알아보도록 하겠습니다.
이번시간에는 <head> 태그에 대해서 알아보도록 하겠습니다.
<head> 태그에 대해서 알아볼까요?
전 시간에 HTML문서는
크게 head 부분과 body 부분으로 구성되어 있다는 설명을 드렸습니다.
이번 시간에는 <head> 태그에 대해서 설명드리려고 합니다.
<head>영역은 <head>로 시작해서 </head>로 끝이 나는데, 일반적으로 웹 문서의 내용이 아니라 웹 문서의 제목이나 머리말에 해당하는 정보를 입력합니다.
<head>영역은 <head>로 시작해서 </head>로 끝이 나는데, 일반적으로 웹 문서의 내용이 아니라 웹 문서의 제목이나 머리말에 해당하는 정보를 입력합니다.
[알아두기] <head>에 대해서
<head>로 시작해서 </head>로 끝남
웹문서의 제목이나 머리말에 해당하는 정보를 입력합니다.
head 태그 안에 들어가는 요소
head 태그 안에는 <title>태그, <meta> 태그, <link> 태그 등이 들어갈 수 있습니다.
이 태그들을 하나씩 알아보도록 하겠습니다
이 태그들을 하나씩 알아보도록 하겠습니다
<title> - 페이지의 제목 표시 | <title> 태그는 페이지의 제목을 표시합니다 |
<title>태그는 웹페이지의 제목을 표시하는 태그입니다. <title>태그는 HTML문서의 <head> 영역 안에 반드시 지정되어야 하며, 단 한번만 지정하면 됩니다.
<title> 태그 내에는 문자(텍스트)만 가능하며 이는 웹브라우저에 타이틀 바, 탭 등 창이름으로 사용됩니다. 그러므로 웹페이지의 내용을 대표할 수 있는 내용으로 간결하게 명확하게 작성해야 합니다.
<title> 태그 내에는 문자(텍스트)만 가능하며 이는 웹브라우저에 타이틀 바, 탭 등 창이름으로 사용됩니다. 그러므로 웹페이지의 내용을 대표할 수 있는 내용으로 간결하게 명확하게 작성해야 합니다.
[알아두기] <title> 태그
<title> 태그
- 웹페이지의 제목을 표시하는 태그
- <head> 영역 안에 반드시 지정되어야 함
- 문서 내에서 한번만 지정
제 블로그를 예로 들어서 설명을 드리도록 하겠습니다.
제 블로그에 접속하면 아래와 같이 하늘과 나의 IT School이라고 보이는데 이것도 <title> 태그 안에 하늘과 나의 IT School이라는 내용을 넣어준 것입니다.
제 블로그에 접속하면 아래와 같이 하늘과 나의 IT School이라고 보이는데 이것도 <title> 태그 안에 하늘과 나의 IT School이라는 내용을 넣어준 것입니다.
<html> <head>하늘과 나의 IT School </head> </html>
실제 소스를 보면 위와 같습니다.
메모장에 위와 같이 입력해서 저장한 후 실행해 보면 위의 그림과 같이 나옴을 볼 수 있습니다.
'백문이 불여일타' 라는 말이 있다고 합니다.
백번 듣는 것보다 직접 한번 쳐서 해보는 것이 낫다는 말이라고 합니다.
<head> 안에 들어갈 수 있는 <meta> 요소는 HTML 페이지의 정보를 작성하는 태그입니다.
이 <meta> 태그로 작성되는 정보는 사람을 위한 정보라기 보다는 프로그램이나 검색 엔진 등에 사용된다고 보시면 좋을 것 같습니다.
이 <meta> 요소 중에도 필수적으로 써줘야 할 것이 있는데 MIME Type과 코드 세트를 지정하는 것인데요. 일반적으로 아래와 같이 작성해 줍니다.
일반적인 <meta> 요소는 name과 content 속성을 지정하여 사용하는데요.
아래와 같이 사용합니다.
다음은 많이 사용하는 <meta> 요소의 name 속성과 content 속성을 정리해 보았습니다.
메모장에 위와 같이 입력해서 저장한 후 실행해 보면 위의 그림과 같이 나옴을 볼 수 있습니다.
'백문이 불여일타' 라는 말이 있다고 합니다.
백번 듣는 것보다 직접 한번 쳐서 해보는 것이 낫다는 말이라고 합니다.
<meta> | <meta> 태그는 페이지에 대한 정보를 작성합니다 |
이 <meta> 태그로 작성되는 정보는 사람을 위한 정보라기 보다는 프로그램이나 검색 엔진 등에 사용된다고 보시면 좋을 것 같습니다.
[알아두기] <meta> 요소
HTML 페이지의 정보를 작성하는 태그
이 <meta> 요소 중에도 필수적으로 써줘야 할 것이 있는데 MIME Type과 코드 세트를 지정하는 것인데요. 일반적으로 아래와 같이 작성해 줍니다.
<meta http-equiv="Content-Type" content="text/html; charsett=utf-8" />
일반적인 <meta> 요소는 name과 content 속성을 지정하여 사용하는데요.
아래와 같이 사용합니다.
[알아두기] <meta>요소의 사용법
<meta name="name 속성" content="content 속성" />
다음은 많이 사용하는 <meta> 요소의 name 속성과 content 속성을 정리해 보았습니다.
용도 | 속성(name) | 값(value) |
요약 설명 | description | 페이지의 간략한 설명 |
키워드 | keyword | 페이지의 키워드 |
저작자 | author | 페이지의 작성자 |
저작권 표시 | copyright | 저작권자 |
연락처 | reply-to | 연락할 수 있는 e-mail 주소 |
편집일 | data | 페이지가 최종 편집된 시간 |
검색 로봇 제어 | ROBOT | 검색 로봇의 크롤링 허용 여부 |
'IT 이야기 > 프로그래밍' 카테고리의 다른 글
[HTML 쉽게 이해하기 강좌] - DOCTYPE에 대해서 (0) | 2011.12.05 |
---|---|
[Javascript] getElementById 예제 - 링크 보이기/숨기기 (0) | 2011.12.05 |
[C언어] 함수 rand(), srand() 쉽게 이해하기 (55) | 2011.12.05 |
[Javascript] 홈페이지에 현재의 년월일을 이미지로 된 숫자로 표시하는 자바스크립트 소스 (1) | 2011.12.03 |
[HTML 쉽게 이해하기 강좌] - <h1>~<h6> 태그에 대해서 (0) | 2011.12.03 |
[HTML 쉽게 이해하기 강좌] - HTML 문서의 기본 구조 (0) | 2011.12.02 |
[HTML 쉽게 이해하기 강좌] - 주석문 (0) | 2011.12.02 |
[HTML 쉽게 이해하기 강좌 #1] - HTML의 기본 (2) | 2011.12.02 |
[HTML/CSS] 마우스 커서 모양(스타일) 바꾸기 (1) | 2011.11.30 |
[강의] HTML5 그 두번째 이야기 - HTML5는 OOO가 다르다 (2) | 2011.11.05 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
- W3Schools Online Web Tutorials
- 구차니의 잡동사니 모음
- [IT]블로거팁닷컴
- 비앤아이님의 블로그
- Blog Suspect
- 즐거운하루 blog
- zinicap의 검색엔진 마케팅(SEM)
- 머니야머니야님의 블로그
- [Friend] AtinStory
- [기타배우기]해브원 박스
- [웹표준] SINDB.com
- 해커 C 이야기
- [애드센스] 길라잡이
- 정순봉의 IT SCHOOL
- 씨디맨의 컴퓨터이야기
- 2proo Life Story
- 못된준코의 세상리뷰
- [IT강좌] 정보문화사
- IN 대전
- 에우르트는 나쁜남자 -_-
- 씬의 싱크탱크
- 엔돌슨의 IT이야기
- 진이늘이
- 'Cooltime'의 블로그
- 후이의 Tistory
- Soulstorage
- 앤드&엔드의 블로그
- June Blog
- 노지의 소박한 이야기
- gbWorld
- 인터넷 속 나의 생각
- HarshNix
- ART of WEB
- 녹두장군 - 상상을 현실로
TAG
- 인터넷
- HTML
- 소스코드
- C
- 예제 소스
- It
- MBTI 자료
- C언어 소스
- 안드로이드 어플
- 강좌
- 모토로이
- MBTI 강좌
- 스마트폰
- 성공
- 강의
- php
- C언어
- 프로그래밍
- 인터넷 익스플로러
- 안드로이드 어플 추천
- JavaScript
- MBTI 검사
- C언어 문제
- 소스
- 프로그래밍 문제
- 안드로이드
- MBTI
- 효과음
- MBTI 테스트
- 리뷰
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
글 보관함