Only ideas worth spreading

더 좋은 웹을 위한
우리의 고민

PSD 용량 최적화 시키기

WRITE윈드디자인 DATE2017.07.03 CATEGORY웹디자인


안녕하세요. 윈드디자인 입니다. 

무더운 여름과 가뭄에서 다행히 장마가 오네요. :D
(너무 극단적인 가요... ㄷㄷ)

웹 디자이너가 가장 많이 사용하는 툴인 
포토샵의 psd 파일 용량을 최적화 시키는 방법을 소개해 드리고자 합니다.
(jpg 사이즈가 아닌 psd 원본 용량을 줄이는 방법!)

간단한 방법이기에 웹 에이전시에서 협업 또는 자료 백업에 있어서
편리함이 있는 만큼 내부 디자이너 분들이 자주 사용하는데요.

경우에 따라 다르긴 하지만 
메인 psd 같은 경우 100MB 가 초과할 시에 
불필요한 리소스가 많이 들어가 있다고 생각합니다. 
(물론 대규모 사이트나 그래픽 요소가 많이 들어가야 하는 경우는 다르겠지만요 ㅎ)

그럼 어떻게??? 최적화를 해야 할까요? 



#1. 첫 번째 _ 흰색 레이어 추가
(가장 쉬운 방법) 



8MB(7%) 정도의 용량이 줄어들었습니다. 
(흰색 레이어를 추가만 했을 뿐인데! 참 쉽죠!?)


psd는 view도 포함하고 있기 때문에 
흰색 레이어로 가리는 것만으로도 용량을 줄일 수 있습니다. 
(하지만 큰 차이가 없어 자주 사용하고 있지 않습니다.)




#2. 두 번째 _ 리사이즈 레이어
조금 더 손이 가긴 하지만 상당히 많은 용량을 줄일 수 있습니다.


5MB(38%) 정도의 용량이 줄어들었습니다. 

main.psd 같은 경우는 
폴더에 있는 사진을 바로 레이어로 가져와서 
이미지 자체가 오브젝트가 되어 용량이 증가합니다. 

main_.psd 같은 경우는 
포토샵에서 사진을 가져온 후 리사이즈하여 
레이어로 가져오게 되면 용량을 최적화 시킬 수 있습니다. 

대용량 이미지를 많이 사용하는 psd라면 
main_.psd와 같이 사용하는 것이
용량 최적화에 도움이 될 것입니다.





#3. 세 번째 _ 90%오브젝트 레이어화
이 부분은 장. 단점이 있기 때문에 잘 활용하는 것이 좋습니다.


97MB(93%) 정도의 용량이 줄어들었습니다. 
모든 오브젝트들을 레이어화 시키니 상상할 수 없는 용량으로 줄어들었습니다. :D
(다른 에이전시와 협업하는데 1.5GB psd 원본을 받을 때란... ㄷㄷ)

예시로 보여드리기 위해 
모든 오브젝트를 레이어화 시켰지만 

때에 따라 퍼블리셔가 원본 오브젝트가 필요하기도 하니 
모든 오브젝트를 레이어화 시키는 것은 피하시길 바랍니다.
(저희 퍼블리셔 분들은 거의 필요 없다고 해서... 메인이나 주요 페이지만 살려 둡니다!)

결론 

대용량 이미지는 포토샵에서 최소화하여 사용하고 
가변적이지 않은 오브젝트들은 레이어화 시켜서 사용하면 
psd 용량을 상당 부분 줄일 수 있습니다. 


이 밖에  
- 기존 템플릿 사용하지 않고 새로 만들기
(저희가 템플릿을 안 쓰다 보니...)
- 콘텐츠 소스(이미지, 로고 등) PSD 말고  jpg 저장 후 사용하기

등등 다양한 방법이 있지만, 
기본적으로 사용하는 방법에 대해 이야기 드립니다.

귀찮더라도 대부분의 웹 에이전시들이 활용하는 
SVN이나 내부 서버를 통한 협업을 위해선
최적화는 언제나 필요하겠지요~? :D


사용자의 바람에 고민합니다.
다채로움 속 집중을 통해
더 좋은 웹을 꿈꿉니다.

디자인과 기술이 융화된 디지털 서비스를 만듭니다.


 

WIND DESIGN Co., Ltd