A raster graphic is an image composed entirely of single pixels to create a larger, more detailed image. You would typically expect images from cameras, screenshots and the web to be made up of separate pixels. There are many file formats which will be used to save raster images, although typically the most common formats would be .jpg, .jif, .png . Each of the corresponding formats will be used for a different purpose. A Fantastic example of a raster image would be large pixel art portraits, like the one pictured below:

Although at a distance the picture appears to be very high in detail, however on closer inspection it is very clear that the image is composed of many smaller pixels that have been carefully placed so that at a further distance, the image becomes much clearer and appears to have more detail.

Raster images are resolution dependant, this means as the image is scaled up, and the size of both planes will determine the resulting quality. This means they cannot be scaled up to an arbitrary size without loss of detail and pixilation. For example an image that is 1000x1000 would look perfect at its native resolution (1000x1000), however if this image was then scaled up to 2000x2000 it would create dramatic amounts of pixilation and distortion, resulting in an unusable image.

Some of the advantages of Raster Graphics:

The image is typically much more compatible than a vector. Each location of each cell holding a pixel is implied by its position in the cell matrix. This

means other than an origin point, no geographic coordinates are stored. Quick to perform and easy to program. Easy to create.

Some of the disadvantages of Raster Graphics:

Images can be scaled but with a distinct loss in image quality, so typically the size a raster image is taken in, will be the size it stays forever.

They require higher resolutions and anti-aliasing for smooth appearences. Some formats not compatible with other operating systems.

Raster Applications

Paint:

Firstly it is important to know what you are going to be using the final graphic for and what you need from the editing software. Typically if you only want to do extremely primitive editing such as cropping, free-hand drawing or small typographay based pictures a program such as Paint will suffice.

Photoshop:

Photoshop is widely considered one of the mose powerful and feature rich raster image editing packages available on the market. There is a plethora of tools which can take years to completely master and come to terms with. There is a multitude of different tools such as:

Pen tools Filters Gradient Fills In-Depth text editing Hundreds of image and colour adjustments Masking And thousands more...

Lossy compression

Lossy Compression eliminates “unnecessary” bits of information, changing the file so that it becomes smaller. This type of compression is used commonly for reducing the size of bitmap pictures, which are usually quite large in size. Typically, a substantial amount of data can be discarded before the result is sufficiently degraded to be noticed by the user, this is very useful as you can lower the file size a fair amount and save space without any problems. Files are compressed to reduce the overall size and this make them more suitable to use for streaming mediums I.E an internet gallery.

.jpeg images can be saved at different compression rates and thus altering the file size, and also unfortunately lowering the overall quality of the image, there is a definite loss of colour reproduction and also quality, as you lose large amount of detail.

Lossy compression works by “Discarding” data that is less neccicary. In photos

this can be things such as deep blacks, whites and relative colours that are near each other, for example in the above image, this is why you will find images “layering” the colours in an image, for example the three images opposite have all been altered in quality, with the best one at the top, and the worst at the bottom. You can see layering in the sky of the bottom picture.

Vector Graphics

Vector Graphics use “geometrical primitives” and mathematical equations to keep the quality extremely consistent, not matter how much zoom or expansion is placed on that particular image.

Vectoring does this by applying mathematical equations to ever shape placed into the particular image, to constantly resize the shape and create a smooth undeviating line whenever it is resized or expanded. Since these formulas can produce an image scalable to any size and detail, the quality of the image is limited only by the resolution of the display, and the file size of vector data generating the image stays the same.

Vectors can be particularly useful as there is never a loss of quality, and a consistent image is always portrayed, no matter what zoom or stretch is applied to the image.

The drawback to using vector graphics is that they are more processor intensive than raster images, meaning this inherently limits the functionality for large data sets. Points are a mathematical plot in the vector image. These are saved in relation to where the other points are. They are used to bridge the gap between another point and the lines that join them. Lines are the items used to go in-between the points, these are called paths and they are determined by where the points are.

Typically Vector images are saved in the following file formats:

Ai:

The Adobe illustrator file is a common file type used for saving vector images. It is one of the most widely used graphic design programs. It has a file with the tag AI, meaning that this is the file originally used for developing the vector image design. These files can almost always be opened by Adobe Illustrator programs exclusively and cant be brought into other applications.

EPS:

EPS stands for Encapsulated PostScript. Surprisingly, it can contain both vector and bitmap data. PostScript Is the universal language used for computer printers and also professional printers. If the file contains only vectors it can easily be reduced or enlarged without loss of resolution and is the best file to use for printing logos or vector graphics.

SVG:

SVG or Scale Vector Graphics File is a family of an XML-based file format. Similarly to the rest of the vector file formats it allows for unlimited scaling.

Vector Applications

Adobe Fireworks:

Fireworks is a vector and bitmap graphics editor. Typically you would associate Fireworks with web editing due to the fact it has image splicing in order to reduce load times and also includes may other features which would be of use to the budding web designer.

Adobe Illustrator:

Illustrator is a vector specific application which shares a few qualities with Photoshop, this is mainly due to the fact both Photoshop and Illustrator are made by the same company, Adobe. This program would be for the “high end” user, although typically vectors should not be created or altered by people who don’t know what they are doing as it is distinctly more difficult that dealing with Raster images. Illustrator features things such as:

Pen and line tools Live trace Live paint Gradients Layers Lots more...

Metafiles

Metafiles is a bracket term used for a file format that can contain both Raster & Vector images, commonly graphics formats. These files can contain Raster, Vector and Type Deta. There are a few different file formats used to save metafiles, with the most common being a PDF (Portable Document Format). Another format that you would associate with Metafiles would be SVG or Scalable Vector Graphic(s). There are some key things to do with Metafiles which are worth noting, they are:

Mobile Can host both Raster and Vector Widely compatible Common

When saving a file it is important to know wether or not you’re going to need a metafile, this will typically depend on what the final use of the graphic file will be. If there is no reason to use a Metafile it would be more sensible to use a Raster or Vector.

There are a number of different programs you can use to edit and create Metafiles. The most common of these would probably be Photoshop, however adobe also has Illustrator for creating a mix of Raster and Vector. .svg

Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics that has support for interactivity and animation. This format is used by all major internet browsers such as Chrome, Firefox, Opera and Safari, and can mark up directly. .svg is able to include Raster, Vector and Text which makes it useful for creating lots of various things.

.PDF

This format is quite possibly the most well known and highly distributed form of Metafile, it is used in lots of online documents and is the product of Adobe Systems, created in 1993. Each PDF file encapsulates a complete description of a fixed-layout flat document, including the text, fonts, graphics, and other information needed to display it.