index.html
◈.meta 메타 태그
◈.메타 태그란 것은 문서에 관련된 정보라고 생각하면 됩니다.*^^*
메타태그을 삽입하는 이유는 페이지에 정보을 알리기 위한것도 있지만.
검색엔진에 등록을 했을뗴 검색키워드로 사용됨다고 합니다.
키워드는 콤마(,)로 구분되어 짐니다.
이것은 <head> 와 </head>사이에 사용되며 문서의 외양과는
크게 상관이 없습니다. 메타 태그의 하나의 예를 보죠.
밑에 보고 있는것은 제홈페이지에 쓰인 메타태그입니다.
참고 삼아 보세요.@^^@
--------------------------------------------------------------------------------
◀메타 태그에 대한 설명▶
<mete name="title" content=" ">
┗☞브라우져 타이틀 제목을 설명합니다
<meta name="description" content=" ">
┗☞ 해당 웹페이지의 내용을 요약해서 설명하는 부분.
<meta name="keywords" content=" ">
┗☞검색사이트의 방문자가 content부분의 키워드를
입력하면 여러분의 홈페이지가 소개됩니다.
<meta name="author" content=" ">
┗☞홈페이지을 만든사람의 이름이나 아이디등을 적으세요.
<meta name="generator" content=" ">
┗☞홈을 만들떼 사용했던 tool을 말하는것입니다.
※.넷스케잎에서 한글코드의 자동 인코딩
익스플로러에서는 문제가 없지만 넷스케잎의 경우는 기본적으로
영문폰트(western(iso-8859-1))로 인코딩하여 문서를 보여줍니다.
따라서 웹페이지를 만들때
우리가 자주쓰는 font태그에서 face="궁서체"로 지정해 주어도
넷스케이프는 속성을 이해하지 못해 궁서체로 폰트를
보여주지 못합니다.
따라서 브라우저가 문서를 로딩할 때 자동으로 한글 폰트(euc-kr)로
인코딩하게 만들어 줄 필요가 있는 것이죠.
<meta http-equiv="content-type" content="text/html;charset=euc-kr">
한글로 된 문서라면 기본적으로 위의 부분은
넣어주는 것이 일반적입니다.
물론 익스플로러 전용이라면 문제가 없겠지만.....
그런데 주의할 점이 있습니다. 넷스케이프에서 이 meta
태그를 사용하면 form으로 작성된 박스의 크기가
달라진다는 것과 영문 폰트를
제대로 사용하지 못하게 되므로 다 좋은 것은 아니라는 거죠.
--------------------------------------------------------------------------------
◀자동적으로 html 문서를 이동시킬뗴도 meta 태그가 사용됨니다▶
※.자동적으로 html 문서를 이동시킬뗴도 meta 태그가 사용됨니다.^^;;
다른홈페이지 구경하시다가 페이지가 뜨자마자 몇초있다가
메인홈으로 이동합니다. 잠시만 기다려 주세요.
이런걸 보신적이 있을꺼라고 생각합니다.
--------------------------------------------------------------------------------
<meta http-equiv="refresh" content="10;url=http://www.yahoo.co.kr">
--------------------------------------------------------------------------------
ⓐ.content="10; ☜━10초후에 이동시키라는 뜻입니다.
원하는숫자 적으면 되겠죠.^^;;
ⓑ.url=http://www.yahoo.co.kr ☜━원하시는 경로명을
적어 주시면 됨니다.^^;;
--------------------------------------------------------------------------------
◀메타태그 화면전환 효과 태그예요▶
※.이런걸 모라구 표현하지.? 첫페이지에서 다음페이지가로
넘어갈뗴 페이지 화면이 여러가지 효과을 내면서 바뀌게 됨니다
. 밑에 소스는 총 25가지 효과을 갱신하면서 나타나게 됨니다.!
페이지가 바뀔떼마다 다르게나옴.!!
--------------------------------------------------------------------------------
<meta http-equiv="page-enter" content="revealtrans(duration=3,
transition=23)">
<meta http-equiv="page-exit" content="revealtrans(duration=2,
transition=23)">
--------------------------------------------------------------------------------
※.특정적으로 페이지전환효과을 낼수도 있습니다.(밑에 참고하세요.!!)
1. blend
<meta http-equiv="page-enter" content="blendtrans(duration=2.0)">
2. box in
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=0)">
3. box out
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=1)">
4. circle in
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=2)">
5. circle out
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=3)">
6. wipe up
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=4)">
7. wipe down
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=5)">
8. wipe right
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=6)">
9. wipe left
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=7)">
10. vertical blinds
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=8)">
11. horizontal blinds
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=9)">
12. checkerboard across
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=10)">
13. checkerboard down
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=11)">
14. random dissolve
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=12)">
15. split vertical in
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=13)">
16. split vertical out
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=14)">
17. split horizontal in
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=15)">
18. split horizontal out
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=16)">
19. strips left down
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=17)">
20. strips left up
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=18)">
21. strips right down
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=19)">
22. strips right up
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=20)">
23. random bars horizontal
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=21)">
24. random bars vertical
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=22)">
25. random
<meta http-equiv="page-enter" content="revealtrans(duration=2.0, transition=23)">
--------요일별 배경바꾸는소스---------
<script>
today = new Date();
var day = today.getDay();
if(day==0) { myback = "배경 주소";}
else if(day==1) { myback = "배경 주소";}
else if(day==2) { myback = "배경 주소";}
else if(day==3) { myback = "배경 주소";}
else if(day==4) { myback = "배경 주소";}
else if(day==5) { myback = "배경 주소";}
else if(day==6) { myback = "배경 주소";}
document.write("");
</script>
--------------------이미지툴바제거 & 선택사용---------------
익스프롤러 6.0 사용시 이미지에 마우스를 갖다대면 다운받을수 있는 툴바가
나타나는데 그걸 없애주는 팁이랍니다.
모든 이미지 툴바를 숨김
<head>
<!-- 모든 이미지에 툴바가 나타나지 않는다. -->
<meta http-equiv="imagetoolbar" content="no">
</head>
<body>
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
</body>
특정 이미지의툴바 보여줌
<head>
<meta http-equiv="imagetoolbar" content="no">
</head>
<body>
<img src="1.jpg" galleryimg="yes"> <!-- 이곳 이미지에만 이미지툴바가 나타난다. -->
<img src="2.jpg">
<img src="3.jpg">
</body>
특정 이미지의 툴바 감춤
<body>
<img src="1.jpg" galleryimg="no"> <!-- 특정 이미지만 툴바가 나타나지 않는다. -->
<img src="2.jpg">
<img src="3.jpg">
</body>
헤더에 http-equiv="imagetoolbar" content="no" 를 선언하지 않고
특정 이미지만 툴바가 나타나지 않도록 설정할 수 있습니다
------------홈페이지URL포워딩방법--------------
URL 포워딩
보통 index.html 에서 하부 디렉토리로 연결하거나
외부 주소로 연결할 때 이용됩니다.
1. 메타태그를 이용한 방법
<meta http-equiv="Refresh" content="0; URL=http://test.com">
-------> naver.com 으로 연결
<meta http-equiv="Refresh" content="0; URL=/html/">
-------> /html/ 폴더로 연결
2. 자바스크립트를 이용한 방법
<script-x>document.location="http://test.com";</script-x>
<script-x>document.location="/html/";</script-x>
3. PHP 를 이용한 방법
<? header("Location:http://test.com"); ?>
<? header("Location:/html/"); ?>