HTML 기본 구조
HTML이라는 것은 이미 1990년대 후반 "인터넷에 집짓자~!!!"시대 이전부터 만들어져서 사용되던 것이다. 이미 대중화되어 사용한지 20여년이 넘어 티스토리 스킨정도를 만들기 위한 단순한 HTML 언어와 디자인을 위한 CSS정도는 고등학교를 졸업한 누구라도 사용이 가능해야 정상인데, 낯선 단어의 나열들이 부담스러워 쉽게 접근을 못하는 것 같다...
하지만, 사이트 리뉴얼이 끝나면 자다가 이불을 뻥~ 찰것 같은 스킨"티스토리스킨 - 세인티스킨(Saintiskin)"[보러가기]을 보고 이 글들을 따라 스킨에 포함되어 있는 HTML과 CSS를 원하는 스킨으로 바꾸어 가는 작업을 하다 보면 누구나 쉽게 스킨을 제작할 수 있으리라 본다…
<head> 웹페이지의 기본정보 </head>
<body>
웹페이지의 내용
</body>
</html>
이며,
<html> </html> : html문서의 시작과 끝을 알림.
<head> </head> : xml선언, 타이틀, 메타태그, 언어선언, 스타일링크등 페이지에 필요한 기본정보
<body> </body> : 웹페이지에서 보이는 내용이 들어가는 부분.
으로 작성한다. 위 링크에서 스킨을 다운받아 보면 <head>부분이
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
로 작성되어 있는데, 1차 domain을 2차 domain으로 automatic forwarding하는 것을 적용하지 않고 Category 더보기 position change source와 블로그 주소창 Logo를 제외하면
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
가 포함되어야 하는 필수 소스로 남는다. 이 중<title>HTML 기본 구조 세인트닷컴</title>은 Internet explorer의 Tap 부분의 순서를 정해주는 부분으로 HTML 기본 구조 세인트닷컴의 순서로 배열을 하면 아래와 같은 순서로 Tap이 배열이 되고
반대 순서로 배열이 되면 "세인트닷컴 HTML 기본 구조" 순으로 Tap이 보여진다. 여기까지가 티스토리 스킨을 제작함에 있어서 HTML Head에 필수적으로 들어가야 하는 부분이다.
HTML이라는 것은 이미 1990년대 후반 "인터넷에 집짓자~!!!"시대 이전부터 만들어져서 사용되던 것이다. 이미 대중화되어 사용한지 20여년이 넘어 티스토리 스킨정도를 만들기 위한 단순한 HTML 언어와 디자인을 위한 CSS정도는 고등학교를 졸업한 누구라도 사용이 가능해야 정상인데, 낯선 단어의 나열들이 부담스러워 쉽게 접근을 못하는 것 같다...
하지만, 사이트 리뉴얼이 끝나면 자다가 이불을 뻥~ 찰것 같은 스킨"티스토리스킨 - 세인티스킨(Saintiskin)"[보러가기]을 보고 이 글들을 따라 스킨에 포함되어 있는 HTML과 CSS를 원하는 스킨으로 바꾸어 가는 작업을 하다 보면 누구나 쉽게 스킨을 제작할 수 있으리라 본다…
HTML의 기본구조
<html><head> 웹페이지의 기본정보 </head>
<body>
웹페이지의 내용
</body>
</html>
이며,
<html> </html> : html문서의 시작과 끝을 알림.
<head> </head> : xml선언, 타이틀, 메타태그, 언어선언, 스타일링크등 페이지에 필요한 기본정보
<body> </body> : 웹페이지에서 보이는 내용이 들어가는 부분.
으로 작성한다. 위 링크에서 스킨을 다운받아 보면 <head>부분이
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--//html 선언-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head><!--//html head 선언-->
<meta http-equiv="Keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>HTML 기본 구조 세인트닷컴</title>
<link rel="shortcut icon" href="https://t1.daumcdn.net/cfile/tistory/192C68444F129D2520" />
<link rel="stylesheet" media="screen" type="text/css" href="./style.css" />
<!--//1차 domain을 2차 domain으로 automatic forwarding 선언-->
<script language = javascript>
var url1 = 'whitesaint.tistory.com';
var url2 = 'www.trsos.com';
var online = document.URL;
if(online.match(url1)) document.location.href=online.replace(url1, url2);
</script>
<!--//Close of 1차 domain을 2차 domain으로 automatic forwarding-->
<!--// Category 더보기 position change source 1 선언-->
<script type="text/javascript" language="javascript">
var MissFlash_Div_Num = 1;
</script>
<script type="text/javascript" language="javascript">
function getElementsByClass(MissFlash_Div_Num,searchClass,node,tag){
// JavaScript function was developed by MissFlash (http://blog.missflash.com)
var classElements = new Array();
if(node == null) node = document;
if(tag == null) tag = '*';
var els = node.getElementsByTagName(tag);
var elsLen = els.length;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
var j = 0;
var MissFlash_Check = 1;
var MissFlash_ID = "MF_Reference" + MissFlash_Div_Num;
for(i=0; i<elsLen; i++){
if(pattern.test(els[i].className)){
classElements[j] = els[i];
j++;
if(els[i].id.indexOf("MF_Reference") == -1){
var result = els[i].innerHTML;
els[i].style.display = "none";
}
}
}
return result;
}
</script>
<!--//Close of Category 더보기 position change source 1-->
</head><!--//Close of html head -->
로 작성되어 있는데, 1차 domain을 2차 domain으로 automatic forwarding하는 것을 적용하지 않고 Category 더보기 position change source와 블로그 주소창 Logo를 제외하면<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--//html 선언-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head><!--//html head 선언-->
<meta http-equiv="Keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>HTML 기본 구조 세인트닷컴</title>
<link rel="stylesheet" media="screen" type="text/css" href="./style.css" />
</head><!--//Close of html head -->
가 포함되어야 하는 필수 소스로 남는다. 이 중<title>HTML 기본 구조 세인트닷컴</title>은 Internet explorer의 Tap 부분의 순서를 정해주는 부분으로 HTML 기본 구조 세인트닷컴의 순서로 배열을 하면 아래와 같은 순서로 Tap이 배열이 되고
반대 순서로 배열이 되면 "세인트닷컴 HTML 기본 구조" 순으로 Tap이 보여진다. 여기까지가 티스토리 스킨을 제작함에 있어서 HTML Head에 필수적으로 들어가야 하는 부분이다.