When creating graphics for print and web you must consider a few little basic rules. I know most graphic designers know this but incase you are trying to make the leap from web to print or print to web or you are still learning the ropes and self teaching yourself because you enjoy being creative here are some of the fundemental rules to follow.
Dpi is different
Dpi means dots per inch…if you are creating an image for web then 72dpi is sufficient, alternatively if you are designing for print you should set up your image at at least 250dpi. To do this in Photoshop you can either create a new file with the correct dimensions and then select resolution and enter either 72 if creating an image for web or 250 for print. The benefit of doing this is if you are creating for web you want your image file size to be small… im not talking about the dimensions here, I am talking about the bytes that make up that beautiful Mona Lisa you are going to create. Likewise if you are creating a file for print then you want more dots so that when it prints it looks like a very crisp and sharp image.
CMYK or RGB
CMYK or RGB. These are the two colour modes. CMYK is selected for print as these are the colours you find in a print cartridge where as RGB stands for Red Green & Blue ( how a monitor displays colour through light). So yes you guessed it, select the appropriate colour for your file and it will be more accurately represented for the media you are designing for.
Bleeds
Any time you are creating an image for print whether it is a poster, banner or magazine advert it is more than likely your printers will ask you to add a bleed to your design which is usually a border that is around 3mm to 5mm with lines in the corners that represent the corners and are guides for the cutting of the design. Its pretty easy to do but if you require a guide please leave a comment and I will create one for you.
Saving your image correctly for its purpose
Once you have your masterpiece completed to perfection it is important to save your image in the correct way depending what it is you are trying to do.
Before you do anything, whether using GIMP or Photoshop make sure to save your file with a unique file name in way that you can easily change any layer of your design (psd file). These are the 3 most common file formats used.
.png
.jpg
.gif
GIFs are for webs that are usually animations ( you can find some usually to the right here in the adverts ). If you want to create a gif in photoshop use this tutorial of how to create a bouncing ball and it will give you the basics.
.jpg
jpgs are lossy files but can be used for both print and web. Usually used for photographs and images that don’t need to be altered due to the fact if you enlarge it it will look granuallar due to the fact that when you enlarge the image you are actually enlarging each and every dot that makes up the image.
.png
png files can have a transparent background and are really useful for good quality clear images for web. Especially logos and such like..the last thing you want is a white background with a website that is mainly green…man! That’d just look plain uuuuuuuuuuugly!
Saving for web
If you are creating the image for a website or device then make sure to select File > Save for web… and then follow the instructions to try and reduce your file size to a small a size as possible without loosing the quality of the image.
I realise this is pretty straightforward for most graphic/web designers that most of you may know but we are all at different stages of learning so for some this information will be very useful so that is why I decided to include it today as a blog post. If you need any more help regarding designing for print or web please feel free to contact me and I will do what I can to help you.
