Vectr is a free online vector graphics editor or browser extension, depending on your web browser. The site boasts its user-friendliness with the steep learning curve in designing and editing vector graphics on the platform. It offers various ways to use the images, whether by URL, social media link, print, or download.
A source file on Vectr is the raw file of the design you or a designer has created that allows for editing and reproduction for prints without losing quality. There is no universal source file format, so the file format you choose will be dependent on the application or website you use.
Each format has its pros and cons when it comes to editing, printing, or putting the design on the web. Keep reading to find out which format would suit your particular needs.
There are a few scenarios in which a source file may be needed or requested. Suppose a client or yourself desires to print a logo or graphic created on Vectr for business cards or brochures. Another scenario would be putting the logo on the internet via social media or a company website. These situations may warrant different requirements like a scalable image— to make it bigger or smaller or transparent background. Let’s see which file format best suits these needs.
The file format you decide will entirely depend on your current and future needs for the design. In the case of Vectr, you can save a file in one of three formats:
PNG format is a popular choice for saving images, primarily for its lossless compression, which retains all the image data and therefore maintains the original quality of the image, no matter how many times it is edited.
However, PNG files are raster based or pixel based. Meaning, it will lose quality when scaled up.
Another big contribution to its wide use is transparency. The ability to have a transparent background for your image is especially important when working with a logo or graphic that will be used on the web. It allows you to put the logo or graphic on virtually anything, merchandise, a website, social media, etc.
The disadvantage to saving your source file as a PNG is the file size. Due to its lossless compression style, PNG file sizes are large, taking up quite a bit of storage space on your hard drive, causing slow upload/download times if used on the web, and causing significant lag on your site.
PNG is not ideal for printing because it doesn’t support non-RGB color spaces like CMYK, which most digital and commercial printers use. Lastly, PNG is a raster image format, so there will be some loss of quality when scaled.
JPG is also a popular image file format because it takes up very little storage space due to its lossy compression style, so it’s fast and easy to upload/download and won’t cause your website to lag. It’s the best file format for photographs; many digital cameras automatically save photos to JPG.
JPG files are also raster based or pixel based. These will also lose quality when scaled up.
The disadvantage to having your source file saved as a JPG is the lossy compression that permanently deletes redundant image data during the process, causing a loss of quality each time the image is edited and saved. JPG is also not ideal for images with text, requiring transparency or logos and icons with multiple color options. Finally, JPG is also a raster image format, so it would not be scalable without suffering an additional loss of quality.
SVG combines the best of both worlds in popular file formats. It is small in size but does not suffer any loss of quality when stretched or compressed— this means SVG images are scalable. SVG has image and text-based data indexed by search engines, so it’s great for SEO (Search Engine Optimization) purposes. SVG can be used for printing, but some professional printers may prefer other file formats for large-scale prints.
Being the only format that is vector based, you can scale up SVG files without losing any quality.
The downside to saving your source file as SVG is that some legacy browsers do not support these file formats, so if you need to put your graphic on the web, you could be looking at 5% of internet users not being able to view your image. SVG is not ideal for detailed pictures because the format can’t display as many details as standard image format due to being rendered with points and paths instead of pixels.
Using an online graphics tool instead of an application, you may be limited with the file formats for your source file. The key to these limitations is to save multiple renditions of the graphic in different sizes and formats to accommodate your particular needs. For example, you could save a detailed graphic as a JPG in the different sizes you want to print or save your simple 2D graphic as an SVG to use on a website or social media.
If you’re looking for the best of the three on Vectr, SVG seems to have more versatility in print and web. You don’t have to be concerned with the file taking up too much space or slowing down your site and can still maintain the image quality.
Keep in mind that all three image formats can be opened in Illustrator, Photoshop, or any other Adobe application if you need to convert it to a different image format— this is common with online graphics websites like Placeit.net.
No matter the format of the source file, there are always applications or editing tools that can help you make any necessary changes. If you’re a designer providing the source file to a client, they would need some know-how on a design program that can open the file to make changes.
Likely you’ll have to provide multiple options, as previously mentioned, so the client will have a variety of options to choose from without messing with design applications or graphics websites.