CSS Image Sprites 기법

CSS Sprites 기법이 뭔가?? 해서 찾아보니 다량수의 이미지를 하나의 이미지로 묶고 CSS를 이용해 이미지들 마다의 위치로 이동시켜서 특정 이미지가 보이도록 하는 것이였네요.
웹사이트 뿐만아닐라 어플 만들때나 게임 만들때도 많이 사용하는 방식이죠. 그런데 중요한 것은 이 작업을 자동화 해주는 툴들이 있다는 것입니다. 이미지들을 하나의 이미지로 만들어 주고 각각의 위치를 알려 주는 툴이 있다고 합니다.

그래서, 이런 작업을 자동화해주는 도구들이 개발돼서 한둘씩 생겨나고 있는데, 대표적으로 Website Performance | CSS Sprite Generator가 있다. 이곳에서는 이미지들을 하나로 묶은 압축 파일(zip)을 올려놓으면 약간의 설정만으로 Sprite 이미지와 함께 CSS 적용 rule까지 한꺼번에 얻을 수 있어서 편하다.

나중에 이런 툴들에 대한 글들을 찾아 봐야 겠습니다.

[참고사이트]

  1. HTTP 요청 횟수를 줄여줄 수 있는 CSS Sprites 기법.
Advertisements

Published by: benant

WEB PROGRAMMER. PHP, ASP, XML, Javascript, VBScript, PL/SQL, MySQL, Oracle. scrollads.co.kr 새로운 모바일 광고 서비스. trenue.com 시스탬 트래이딩 서비스. blogman.co.kr 블로그 운영 관리 서비스. creget.co.kr 해외 상품 구매대행. 핫딜 정보 제공 서비스. fgshop.co.kr - 독립형 쇼핑몰 솔루션.

카테고리 Web태그댓글 남기기

답글 남기기

아래 항목을 채우거나 오른쪽 아이콘 중 하나를 클릭하여 로그 인 하세요:

WordPress.com 로고

WordPress.com의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Twitter 사진

Twitter의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Facebook 사진

Facebook의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Google+ photo

Google+의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

%s에 연결하는 중