웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
HTML 문서 용량 줄이기
2002.02.24 13:33
1. 불필요한 따옴표 제거
요즘 보통 비쥬얼툴을 사용하면 대부분 따옴표(")가 생깁니다.
이런것들을 제거해주면 문서의 용량이 꽤 줄어듭니다.
(a) <img src="image.gif" width="100" height="20" border="0">
(b) <img src=image.gif width=100 height=20 border=0>
위의 두 소스는 똑같은 결과를 나타내지만 a소스가 b소스보다 10바이트 정도 많습니다.
공백이 있는 특별한 경우를 제외하곤 모든 따옴표를 제거해도 브라우저는 해당문서를 정확히 해석합니다.
따라서 따옴표를 제거하는 습관을 들이면 좋습니다.
2. 공백 제거
드림위버나 나모같은 비주얼툴을 사용하는 공백을 많이 씁니다.
예를들어 드림위버의 경우는
<table border=0 cellspacing=0 cellpadding=0 width=100%>
<tr>
<td>테이블</td>
</tr>
</table>
이런식으로 되더군요.
여기서 공백을 없애보겠습니다.
방법 : 찾아바꾸기(ctrl + h)에서 공백 두칸 ( )을 제거해주면 됩니다.
<table border=0 cellspacing=0 cellpadding=0 width=100%>
<tr>
<td>테이블</td>
</tr>
</table>
이 두 소스는 약 10바이트쯤 차이가 납니다.
여기서 한줄로 만들어버리면
방법 : 찾아바꾸기(ctrl + h)에서 줄 (
)을 제거해주시면 됩니다.
<table border=0 cellspacing=0 cellpadding=0 width=100%><tr><td>테이블</td></tr></table>
또다시 10바이트정도 줄어듭니다.
한 문서를 이렇게 1줄 만들어 버리면 대단히 용량이 줄어들겠죠.
하지만 1줄이니 소스보기하시면 정말 짜증나겠네요 -_-;
그리고 만든사람도 어디에 뭐가 있는지 알기 힘들겠습니다.
따라서 원본소스를 백업해두고 하셔도; 귀찮긴 하지만요 =.=
방문자들이 소스보기를 원하시는 분들은 이렇게 하지 마세요~
알고 계시는 분들이 대부분이겠지만...
조금이나마 도움이 되었기를 바랍니다.
요즘 보통 비쥬얼툴을 사용하면 대부분 따옴표(")가 생깁니다.
이런것들을 제거해주면 문서의 용량이 꽤 줄어듭니다.
(a) <img src="image.gif" width="100" height="20" border="0">
(b) <img src=image.gif width=100 height=20 border=0>
위의 두 소스는 똑같은 결과를 나타내지만 a소스가 b소스보다 10바이트 정도 많습니다.
공백이 있는 특별한 경우를 제외하곤 모든 따옴표를 제거해도 브라우저는 해당문서를 정확히 해석합니다.
따라서 따옴표를 제거하는 습관을 들이면 좋습니다.
2. 공백 제거
드림위버나 나모같은 비주얼툴을 사용하는 공백을 많이 씁니다.
예를들어 드림위버의 경우는
<table border=0 cellspacing=0 cellpadding=0 width=100%>
<tr>
<td>테이블</td>
</tr>
</table>
이런식으로 되더군요.
여기서 공백을 없애보겠습니다.
방법 : 찾아바꾸기(ctrl + h)에서 공백 두칸 ( )을 제거해주면 됩니다.
<table border=0 cellspacing=0 cellpadding=0 width=100%>
<tr>
<td>테이블</td>
</tr>
</table>
이 두 소스는 약 10바이트쯤 차이가 납니다.
여기서 한줄로 만들어버리면
방법 : 찾아바꾸기(ctrl + h)에서 줄 (
)을 제거해주시면 됩니다.
<table border=0 cellspacing=0 cellpadding=0 width=100%><tr><td>테이블</td></tr></table>
또다시 10바이트정도 줄어듭니다.
한 문서를 이렇게 1줄 만들어 버리면 대단히 용량이 줄어들겠죠.
하지만 1줄이니 소스보기하시면 정말 짜증나겠네요 -_-;
그리고 만든사람도 어디에 뭐가 있는지 알기 힘들겠습니다.
따라서 원본소스를 백업해두고 하셔도; 귀찮긴 하지만요 =.=
방문자들이 소스보기를 원하시는 분들은 이렇게 하지 마세요~
알고 계시는 분들이 대부분이겠지만...
조금이나마 도움이 되었기를 바랍니다.
댓글 9
-
티르-_-)/
2002.02.24 15:27
-_-; -
Webme
2002.02.24 20:29
테이블...-_-;; 무척 비효율적이군요... -
김의주
2002.02.24 21:54
흘 ㅡㅡㅋ 할말없는 친구네 ㅡ.ㅡ -
이대민
2002.02.26 02:46
하하..좋은정보 -
황태현
2002.03.09 11:39
저는 에디트플러스의 ALT+E F T(줄끝 공백제거) 기능을 주로 씁니다. -
incognita
2002.05.29 12:23
아주 가끔이긴 하지만 따옴표 삭제하면 안되는 경우도 있습니다. -
개가죽
2003.08.26 00:57
아주가끔도 그렇치만 원래 규칙상으로는 " 따옴표 쓰게 되어 있을겁니다.
그리고 써주는게 더 좋습니다. 미래를 위해서라면 !!
매일 html 만 할거라면야 모르겠지만요 !!
미리 손에 익혀두는게 미래를 위해서 편해집니다. -
HwangTi
2003.08.28 12:51
따옴표 삭제했다가 안돼서 고생했던 기억이 나서...
그냥 내버려 둡니다 -_-; -
☺심심
2004.05.16 01:29
아씨방새 다날려먹었다,.. 아 미친..
제목 | 글쓴이 | 날짜 |
---|---|---|
[HTML] 기초적인 태그모음 #1 | 태엽감는새 | 2002.02.26 |
[스타일시트] 스타일 시트의 개념 [4] | 태엽감는새 | 2002.02.26 |
동영상을 띄어볼까요? [2] | ZipShin | 2002.02.24 |
[CSS+JAVA]CSS 와 자바스크립트를 파일로 만들어 연결 [5] | ▩윤미 | 2002.02.24 |
HTML 문서 용량 줄이기 [9] | Telles | 2002.02.24 |
Microsoft 에이전트를 이용해서 멋나게 꾸며보자 -_-)/ [7] | 티르-_-)/ | 2002.02.23 |
[CSS]모든 엘리먼트에 스타일시트 지정 [1] | 엔카일 | 2002.02.22 |
▩(a href=#) 대신에 쓸수 있는 스타일 태그 [3] | ▩윤미 | 2002.02.22 |
▩<subject> 앞으로가기, 뒤로가기, 새로고침 버튼 만들기 | ▩윤미 | 2002.02.22 |
▩[CSS] 한꺼번에 border =0 으로주기 (최적화 방법) | ▩윤미 | 2002.02.22 |
Http에러코드들입니다 [8] | Shyos | 2002.02.22 |
원하는 위치에 배경 고정 시키기 [5] | Topy | 2002.02.22 |
브라우저 입력 창에 나만의 아이콘 띄우기 [2] | Topy | 2002.02.22 |
msn 메신저 내 홈에서 채팅창과/대화상대 추가하기를 넣어보장! [8] | 카멜롯™ | 2002.02.21 |
▩HTML 최적화 기법 [3] | ▩윤미 | 2002.02.21 |
▩왼쪽에다가 스크롤바 넣기 [1] | ▩윤미 | 2002.02.21 |
윈도우 꽉찬 화면으로 보기 태그 [1] | ▩윤미 | 2002.02.21 |
CSS 와 HTML 과 연결하기 [5] | Topy | 2002.02.21 |
CSS에 클래스에 관한거 추가 [4] | DearMai | 2002.02.21 |
웹사이트 로딩속도 높혀주는 10가지 방법 [32] | 秀 | 2001.07.25 |