Pixels are the tiny dots that make up bitmapped pictures on computer screens. Elements on the screen, such as font and area sizes, are often measured in pixels.
Pixelation occurs when a graphic is scaled it up and the image becomes blocky and unrefined in appearance – i.e. the individual pixels are apparent to the viewer.
The more ppi (pixels per inch) the original image has, the better the image clarity. For print, 72 ppi is acceptable but will not have the same high-clarity that a 200 ppi image would have. Over 300 ppi is not necessary since the naked eye cannot distinguish any difference at this point. As most modern monitors are limited to 72 ppi, there has until recently been little point designing images for web sites with a greater ppi than this. However, with the recent introduction of Retina displays, designers are now starting to design with a higher ppi for high definition viewing.
When producing or obtaining images, designers should always look to start of with as large an image as possible, regardless of ultimate image size required. Images can always be successfully scaled down, but scaling up will always result in data loss and there pixelation of some degree.
Below is an example of an image that has suffered from pixelation (left hand image)