Responsive Site PSD Creation Guideline

To create responsive site there are certain changes we need to make in terms of look and feel of the site. We have listed down must things to do while creating PSD for responsive sites.

1. Size: There are 4 sizes which we should concentrate on. Out of four we will need PSD for 3 sizes as the 4th one is already a size of the main site.
a. 320 (width) – This is a portrait version for Mobile Phones. 320px is the width we require and height is automatic as per the content. ( PSD required )
b. 480 (width) – This is a landscape version of the Mobile Phones. ( PSD required )
c. 768 (width) – This is a portrait version of iPad and tablets. ( PSD required )
d. 1024 (width) – This is a landscape version of ipad & tablets. ( Not required )

2. Design elements :
a. While making PSD please move the content clockwise for example in inner page we have two column layout so content will move from left to right i.e. after navigation the first thing which come will be the left column and then right column will come under it. This is a standard layout format devices use and is acceptable as well.
b. Please use less number of images as we will be using mostly CSS to have the ame look and feel of the site as the current site so background images etc will not be used completely but in smaller parts or through CSS or generic text. We can use desired fonts from Google fonts as well.