CSS 스타일 시트 소스 코드 압축 및 해제 방법

티스토리 스킨을 건들다 보면 HTML 그다음 제일 많이 건드리는 부분이 바로 CSS 스타일 시트입니다. 바로 디자인을 위해 건드리는 부분인데 잘 알면은 내 맘대로 레이아웃 구조와 디자인 등을 마음껏 수정할 수 있지만 자바스크립트와 똑같이 소스 코드 양이 많아질수록 압축이 안되면 로딩이 점점 조금 느릴 수 있는 부분 중 하나입니다.

물론 상황에 따라 꼭 압축을 해도 안 해도 상관없지만 저의 블로그는 이미 마크 쿼리 스킨 개발자님이 지금은 개발이 중단되었지만 CSS를 수정하는데 힘들 정도로 미리 압축이 되어 있었습니다. 그래도 웹페이지 속도 향상을 생각해서 그냥 두고 있습니다.

CSS 소스 압축하기

코드 수정이 힘들어 질지라도 웹 페이지 로딩 개선에 많은 도움이 됩니다.

1) [링크] 에 접속하여 CSS 소스 코드를 넣고 CSS 메뉴를 선택합니다.

2) 그러면 아래와 같이 CSS 압축이 된 것을 볼 수 있습니다. 파일로도 받을 수 있으며 그냥 코드 전체를 드래그하여 복사할 수 있습니다.

CSS 소스 압축 해제하기

수정이 좀 더 쉬워 유지 보수가 조금 더 쉬울 수 있습니다.

1) [링크] 로 접속하여 압축된 CSS 소스 코드를 넣고 UNMINIFY 버튼을 누릅니다.

2) 그러면 순식간에 압축 해제가 된 것을 볼 수 있습니다.

CSS 압축을 통해 웹 페이지 로딩 향상에 도움이 되시길 바라며 저의 경우 공부한다는 핑계(?)로 압축된 상태에서 코드를 수정하고 있습니다.