반응형 웹 그리드 설계를 간단하게 해결해주는 'Grid Calculator'

http://gridcalculator.dk/

반응형 웹을 디자인 시 그리드는 중요한 요소 중 하나이다. 개인적으론 그리드를 잘 활용하지 않다가 최근에 들어 신경을 쓰기 시작했는데, 포토샵으로 작업 시 그리드를 손쉽게 만들 수 있는 사이트를 소개하려고 한다.

사이트에 들어가서 폭(Max width), 칼럼 사이 간격(Gutter width), 칼럼(Columms), 마진 간격(Margin width)을 설정한 뒤 원하는 파일 포맷을 선택하여 다운로드하면 된다. 파일 포맷은 일러스트레이터, 포토샵, PNG로 포토샵의 경우 JSX란 파일로 다운받아진다. JSX 파일을 포토샵에서 실행 시 자동으로 가이드라인이 생기며, 실행 방법은 메뉴에서 File > Scripts > Browse 순으로 들어가면 된다.