The core difference between vector and raster graphics is that raster graphics are made of colored pixels, while vector graphics are made of paths created by mathematical formulas.
Those are the examples of a raster graphic format:
- jpeg
- png
- gif
- bmp
- tiff
Those are the examples of a vector graphic format:
- svg
- eps
- ai
Benefits of vector graphics
The main advantage of vector graphics is that you can scale it as you wish, and the graphics would not get pixelated and blurry. Vector graphics are more flexible and there are no limits for sizing.
Vector graphics are the best when you use logotypes and icons on your website. However, it is not recommended to use too many big vector images on your website, as their size is way higher than the size of raster (bitmap) images, which may lead to an overload of your website and it will lose its loading speed.
Raster formats are the best for photographs that you use on your website.
If we are considering graphic design elements for printing, for example on banners, business cards, billboards, brochures, then it is a completely different story, and you can use vector graphics for any element of your design which will be printed.
A smart design always contains a smart use of vector and raster images.