META 태그 속성

  1. http-equiv="항목명"
    웹 브라우저가 서버에 명령을 내리는 속성으로 name 속성을 대신하여 사용될 수 있으며, HTML 문서가 응답 헤더와 함께 웹 서버로부터 웹 브라우저에 전송되었을 때에만 의미를 갖습니다.

  1. content="정보값"
    meta 정보의 내용을 지정합니다.
  2. name="정보 이름"
    몇 개의 meta 정보의 이름을 정할 수 있으며 지정하지 않으면 http-equiv 와 같은 기능을 합니다.

META 태그 사용법

<html>
    <head>
        <meta name="subject" content="toy code project" />
        <meta name="description" content="디자이너, 퍼블리셔, 프론트엔드, 백엔드" />
        <title>TOY CODE</title>
    </head>
    <body>
        //...code
    </body>
</html>

META 태그 종류

  1. KEYWORD
    검색이 되는 단어들을 정의합니다.

     <meta name="Keywords" content="디자이너, 퍼블리셔, 프론트엔드, 백엔드" />
  2. DESCRIPTION
    검색 결과에 표시되는 단어를 정의합니다.

      <meta name="Description" content="디자이너, 퍼블리셔, 프론트엔드, 백엔드" />
  3. ROBOTS
    검색 로봇을 제어합니다.

    • All (Default) : 'index, follow' 를 지정한 것과 같습니다.
    • None : 'noindex, nofollow' 를 지정한 것과 같습니다.
    • Index : 이 페이지를 수집 대상으로 지정합니다.
    • Follow : 이 페이지를 포함, 링크가 걸린 모든 페이지를 수집 대상으로 지정합니다.
    • Noindex : 이 페이지를 수집 대상에서 제외합니다.
    • Nofollow : 이 페이지를 포함, 링크가 걸린 모든 페이지를 수집 대상에서 제외합니다.
    • 아래와 같은 속성도 사용되지만 웹표준에서 인정하지 않는, 권고되지 않은 방식입니다.
    • Noarchive : 그 페이지를 캐시하지 않습니다.
    • Noimageindex : 그 페이지에 포함된 이미지를 검색 대상에서 제외합니다.
    • Noimageclick : 그 페이지에 포함된 이미지의 링크를 방지합니다.
      <meta name="Robots" content="index, follow" />
  4. CONTENT-TYPE
    문자 인코딩을 설정합니다.

    • EUC-KR / ISO-2022-KR : 한국어 문자 인코딩
    • EUC-JP / ISO-2022-JP : 일본어 문자 인코딩
    • GB2312 : 중국어 문자 인코딩
    • ISO-8859-1 : 북미, 서부유럽, 라틴 아메리카, 카리브해, 캐나다, 아프리카
    • ISO-8859-2 : 동유럽
    • ISO-8859-3 : 남동유럽, 에스페란토
    • ISO-8859-4 : 스칸디나비아, 발트 연안국
    • ISO-8859-5 : 불가리아어, 벨로루시어, 러시아어, 마케도니아
    • ISO-8859-6 : 아랍문자
    • ISO-8859-7 : 현대 그리스문자 언어뿐 만 아니라 수학 기호
    • ISO-8859-8 : 히브리어 문자를 사용하는 언어
    • ISO-8859-9 : 터키어
    • ISO-8859-10 : 에스키모, 북유럽 언어
    • UTF-8, UTF-16, UTF-32 : 모든 언어의 문자를 지원하는 인코딩
    • ISO-* 타입의 문자 설정은 크기의 제한이 있습니다. 또한 다국어 환경 ( 영문과 중문, 일문, 한글을 함께 사용하는 경우 )에서 호환되지 않기 때문에 유니코드 컨소시엄이 개발한 유니코드 표준 문자로 지정해야합니다. ( 대표적으로 UTF )
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. DATE
    사이트를 생성한 날짜를 명시해 줍니다.사용할 때 content '+09:00' 은 GMT(그리니치 표준시)로 부터의 시차이며, 한국은 '+09:00', 미국 동부는 '-05:00'(서머타임 때에는 -04:00)이 되며 나라/지역에 따라 결정됩니다.

      <meta name="Date" content="2021-08-04T07:45:37+09:00" />
  6. SUBJECT
    홈페이지의 주제를 지정해 줍니다.

      <meta name="Subject" content="TOY CODE PROJECT" />
  7. TITLE
    홈페이지의 제목을 지정해 줍니다.

      <meta name="Title" content="TOY CODE" />
  8. AUTHOR
    페이지를 제작한 제작자 이름을 지정해 줍니다.

      <meta name="Author" content="eaim93k" />
  9. PUBLISHER
    페이지를 제작한 제작사의 명칭을 지정해 줍니다.

      <meta name="Publisher" content="toy project" />
  10. OTHER AGENT
    페이지의 책임자를 지정해 줍니다.

      <meta name="Other Agent" content="eaim93k" />
  11. GENERATOR
    페이지의 제작도구를 지정해 줍니다.

      <meta name="Generator" content="VUE.JS 3.X" />
  12. EMAIL, REPLAY-TO
    이메일 주소를 지정해 줍니다.

      <meta name="Replay-To" content="email@eamil.com" /> <meta name="Email" content="email@eamil.com" />
  13. FILENAME
    이 페이지의 파일 이름을 지정해 줍니다.

      <meta name="Filename" content="index.html" />
  14. LOCATION
    회사의 위치를 지정해 줍니다.

      <meta name="Location" content="서울특별시" />
  15. DISTRIBUTION
    이 페이지를 배포한 사람을 지정해 줍니다.

      <meta name="Distribution" content="eaim93k" />
  16. COPYRIGHT
    이 페이지의 저작권을 지정해 줍니다.

      <meta name="Copyright" content="eaim93k" />
  17. REFRESH
    새로고침이나 페이지를 전환할 때 사용합니다.

      <!-- 120초 후에 페이지를 새로고침 -->
      <meta name="Refresh" content="120" />
      <!-- 10초 후에 페이지를 지정 URL로 이동 -->
      <meta name="Refresh" content="10;url=naver.com" />
  18. PAGE-ENTER
    페이지 진입시 전환 효과를 지정해 줍니다.

    • Box out : 네모난 박스가 안쪽에서 바깥쪽으로
    • Circle in : 원이 바깥에서 안쪽으로
    • Circle out : 원이 안쪽에서 바깥쪽으로
    • Wipe up : 이미지의 아래에서 위쪽으로 수직 이동
    • Wipe down : 이미지의 위에서 아래쪽으로 수직 이동
    • Wipe right : 이미지의 왼쪽에서 오른쪽으로 수평 이동
    • Wipe left : 이미지의 오른쪽에서 왼쪽으로 수평 이동
    • Vertical blinds : 수직 블라인드가 쳐지는 형태로 변환
    • Horizontal blinds : 수평 블라인드가 쳐지는 형태로 변환
    • Checkerboard across : 바둑판 형태의 격자가 왼쪽에서 오른쪽으로 생성
    • Checkerboard down : 바둑판 형태의 격자가 위에서 아래로 생성
    • Random dissove : 안개와 비슷한 형태로 전환
    • Split vertical in : 왼쪽과 오른쪽 끝에서 중앙으로 수직 이동
    • Split vertical out : 중앙에서 양쪽 끝으로 수직 이동
    • Split Horizontal in : 양쪽에서 중앙으로 수평 이동
    • Split Horizontal out : 중앙에서 양쪽끝으로 수직이동
    • Strips left down : 대각선 형태로 오른쪽 상단에서 왼쪽 하단으로 이동
    • Strips left up : 대각선 형태로 오른쪽 하단에서 왼쪽 상단으로 이동
    • Strips right down : 대각선 형태로 왼쪽 상단에서 오른쪽 하단으로 이동
    • Strips right up : 대각선 형태로 왼쪽 하단에서 오른쪽 상단으로 이동
    • Random bars horizontal : 수평선이 무작위로 생성
    • Random bars vertical : 수직선이 무작위로 생성
    • Random : 임의로 생성
      <meta name="Page-Enter" content="revealtrans(Duration=1,Transition=12)" />

'WEB > HTML' 카테고리의 다른 글

[HTML] 버튼 클릭으로 이미지 다운로드  (0) 2017.12.27
[HTML] link 태그 사용법  (0) 2017.12.12
[HTML] 메타(meta) 태그  (0) 2017.12.12
[HTML] 주석 및 띄어쓰기, 선긋기(hr 태그)  (0) 2017.12.05
[HTML] class와 id의 정의  (0) 2017.12.05

+ Recent posts