{"id":29056,"date":"2015-10-07T05:00:09","date_gmt":"2015-10-07T12:00:09","guid":{"rendered":"https:\/\/creativemarket.com\/blog\/?p=29056"},"modified":"2024-04-09T05:22:09","modified_gmt":"2024-04-09T12:22:09","slug":"infographic-the-missing-guide-to-file-types","status":"publish","type":"post","link":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types","title":{"rendered":"Infographic: The Missing Guide to File Types"},"content":{"rendered":"

As the market begins to consume an increasing amount of digital assets it is important to know what you are buying and how to make the most of a file type in its application.\nDifferent file types serve various purposes, each with its own advantages and disadvantages. The pros and cons of a particular file type are what may make it more useful over another. To illustrate this, a PNG file may not be the best choice when you are looking to keep file sizes low and<\/strong> have an image that has full coverage (meaning no transparent pixels). In this example a JPEG would be the better choice, since it can be outputted at a smaller size.\nIn addition to outputted file types, each program a graphic designer may use will have a default file type. These default file types, like PSD’s or Ai files, will allow for manipulation of the original asset and are often referred to as “working filesâ€.\nThis buyer’s guide will focus on a few of the most common programs a graphic designer will use along with their more frequently outputted file types. Keep in mind this is a buyer’s guide, so it will be geared towards what a buyer may want to know before purchasing digital goods.\nFor a detailed description of each file type, read the definitions below this infographic.\n\"FileTypes-01\"\n

<\/span> Programs <\/span><\/h2>

<\/span> (.ai) Adobe Illustrator <\/span><\/h3>

\nAdobe Illustrator is a vector based program, which, in it simplest form, uses bezier curves to create shapes. There is a substantial advantage to being a vector based program, and that is thanks to the scalability of the working file. A vector working file can easily scale from one square inch to ten square feet, with no image quality loss. Logos, for example, should always be made in vector form, since a logo’s application can range in sizes from that of shirt tag, to the side of a airplane.\nMain Feature: Scalability.\nCommon outputs: JPEG, PNG, PDF, SVG\n<\/p>

<\/span> (.psd) Adobe Photoshop <\/span><\/h3>

\nPhotoshop is synonymous with the modern graphic designer and is a powerful digital tool. At the core of the program, it is raster based and conforms to a pixel grid. Its uses range from photo retouching and digital painting to web design and app design. A raster working file is great for highly detailed imagery in addition to working within a specified pixel dimension.\nMain Feature: Pixel Perfection.\nCommon outputs: JPEG, PNG, GIF\n<\/p>

<\/span> (.indd) Adobe InDesign <\/span><\/h3>

\nAdobe Indesign is the premier desktop publishing software and is used predominantly for print projects. Indesign is best for when projects will have a lot of copy, and may span multiple pages, in addition it will give the designer the largest amount of tools and functions for typesetting. Print projects are ideal candidates and should almost always be created in Adobe InDesign. The INDD working file will often come in a package along with the project’s fonts, images, and other working files that were used. For example, your INDD working file may have utilized external files like a PSD, the external files remain editable, but will need to be linked to the INDD file so that updates are reflected in real time.\nMain Feature: Print Layouts\nCommon output: PDF\n<\/p>

<\/span> File types <\/span><\/h2>

<\/span> (.jpeg) Joint Photographic Expert Group <\/span><\/h3>

\nA JPG is a very common image file type, versatile and compact. It is used for a variety of applications, so keep in mind its core features to know when it is the needed file type. A JPG is great for when both the final dimensions and the intended use is known. For example, the pixel dimensions of a Facebook profile header on a desktop viewport is 851×315 (width x height), meaning you would want to have a JPG that matches those dimensions.\nA JPG can also be outputted at different quality levels. The advantage to this is that the weight of the file can be controlled, keep this in mind when a file is intended to be passed around. A website mockup could be sent as low quality jpg, speeding up email transfers and avoiding going over an emails maximum file size.\n<\/p>

<\/span> (.png) Portable Network Graphics <\/span><\/h3>

\nA PNG is also an image file type, and can often carry a little more digital weight than a JPG; however, the lossless compression and transparent backgrounds make up for the con of the additional megabytes.\nA lossless file type allows the image to be passed around digitally, through email for example, and have zero degradation of the image’s visual quality. Along with that, a PNG can also have a transparent background. That quality is helpful for when you want to use a logo, for example, and you intend to overlap that logo onto an established background, avoiding the disruption that a rectangular JPG would cause. Look at the logos used on many websites, they will likely be PNGs so that they can adapt to their surroundings better with transparent backgrounds.\n<\/p>

<\/span> (.gif) Graphics Interchange Format <\/span><\/h3>

\nThe unanimated GIF image file type is becoming slightly antiquated since larger file transfers are becoming faster and easier to access. A GIF’s main advantage is its small file size, but the compromises of its restricted color palette do not make it a good choice for static images.\nA static GIF might not be as commonly needed, but thankfully there is a resurgence of quality animated GIF’s, albeit some more questionable than others.\n<\/p>

<\/span> (.svg) Scalable Vector Graphics <\/span><\/h3>

\nThe Scalable Vector Graphic is accurately named, and currently has fairly specific uses. Like the Ai working file, a SVG is a vector image, but unlike the Ai working files, a SVG is code not an image file. In fact the SVG is comprised of XML files that dictate its vector shape, color, placement, and so on. This allows both a vector editing program and a developer with knowledge of the XML language to edit the outputted look of the image.\nFor example, web developers are beginning to use SVG files on websites in replacement of a vector based image. Logos, icons, illustrations and more are being replaced with SVGs, which can help decrease production time when on the fly changes are made.\n<\/p>

<\/span> (.pdf) Portable Document Format <\/span><\/h3>

\nIn my experience, a PDF is very commonly used when the file could or does have a printed version. Forms (interactive or not), brochures, annual reports, books, posters, and any document that could be printed is usually transferred as a PDF. This is because the PDF, when outputted by Adobe Illustrator or Adobe InDesign, has a huge range of options, giving it a lot of control over its compression, file size, printer settings and more. A PDF can also carry additional data like vector paths or originals image files, and can remain text editable when needed.\nPDFs can be small when needed, but when keeping the highest fidelity, the file size can also quickly increase. Large PDFs will be common when they are outputted for print, since the highest quality will be wanted. Additionally, be aware that you may be sent small PDFs initially as drafts, but before going to print, double check with who ever created it if that file size and quality is “print-ready.â€\nIt should be obvious that this list is not a comprehensive gathering of all file types, rather an introduction to common file types you may encounter when interacting with digital creatives. Knowing when to use a certain file over others can avoid headaches, wasted money, and lost time.\n<\/p>

Products Seen In This Post:<\/strong><\/p>

<\/figure>\n \n<\/p><\/p>\n","protected":false},"excerpt":{"rendered":"

As the market begins to consume an increasing amount of digital assets it is important to know what you are buying and how to make the most of a file type in its application. Different file types serve various purposes, each with its own advantages and disadvantages. The pros and cons of a particular file […]<\/p>\n","protected":false},"author":87,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[74],"tags":[],"topics":[],"class_list":["post-29056","post","type-post","status-publish","format-standard","hentry","category-tutorials"],"acf":[],"yoast_head":"\nInfographic: The Missing Guide to File Types - Creative Market Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Infographic: The Missing Guide to File Types\" \/>\n<meta property=\"og:description\" content=\"As the market begins to consume an increasing amount of digital assets it is important to know what you are buying and how to make the most of a file type\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types\" \/>\n<meta property=\"og:site_name\" content=\"Creative Market Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/crtvmrkt\" \/>\n<meta property=\"article:published_time\" content=\"2015-10-07T12:00:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-09T12:22:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2015\/10\/09050055\/FileTypes-01.jpg.webp\" \/>\n<meta name=\"author\" content=\"Marshall Taylor\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:site\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Marshall Taylor\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types\",\"name\":\"Infographic: The Missing Guide to File Types - Creative Market Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2015\\\/10\\\/09050055\\\/FileTypes-01.jpg.webp\",\"datePublished\":\"2015-10-07T12:00:09+00:00\",\"dateModified\":\"2024-04-09T12:22:09+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#\\\/schema\\\/person\\\/439ec5c60a6103855f6c9bd98d8a4781\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types#primaryimage\",\"url\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2015\\\/10\\\/09050055\\\/FileTypes-01.jpg.webp\",\"contentUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2015\\\/10\\\/09050055\\\/FileTypes-01.jpg.webp\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/infographic-the-missing-guide-to-file-types#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Infographic: The Missing Guide to File Types\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\",\"name\":\"Creative Market Blog\",\"description\":\"Creative Market Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Infographic: The Missing Guide to File Types - Creative Market Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types","og_locale":"en_US","og_type":"article","og_title":"Infographic: The Missing Guide to File Types","og_description":"As the market begins to consume an increasing amount of digital assets it is important to know what you are buying and how to make the most of a file type","og_url":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types","og_site_name":"Creative Market Blog","article_publisher":"https:\/\/www.facebook.com\/crtvmrkt","article_published_time":"2015-10-07T12:00:09+00:00","article_modified_time":"2024-04-09T12:22:09+00:00","og_image":[{"url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2015\/10\/09050055\/FileTypes-01.jpg.webp","type":"","width":"","height":""}],"author":"Marshall Taylor","twitter_card":"summary_large_image","twitter_creator":"@creativemarket","twitter_site":"@creativemarket","twitter_misc":{"Written by":"Marshall Taylor","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types","url":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types","name":"Infographic: The Missing Guide to File Types - Creative Market Blog","isPartOf":{"@id":"https:\/\/creativemarket.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types#primaryimage"},"image":{"@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types#primaryimage"},"thumbnailUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2015\/10\/09050055\/FileTypes-01.jpg.webp","datePublished":"2015-10-07T12:00:09+00:00","dateModified":"2024-04-09T12:22:09+00:00","author":{"@id":"https:\/\/creativemarket.com\/blog\/#\/schema\/person\/439ec5c60a6103855f6c9bd98d8a4781"},"breadcrumb":{"@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types#primaryimage","url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2015\/10\/09050055\/FileTypes-01.jpg.webp","contentUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2015\/10\/09050055\/FileTypes-01.jpg.webp"},{"@type":"BreadcrumbList","@id":"https:\/\/creativemarket.com\/blog\/infographic-the-missing-guide-to-file-types#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/creativemarket.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Infographic: The Missing Guide to File Types"}]},{"@type":"WebSite","@id":"https:\/\/creativemarket.com\/blog\/#website","url":"https:\/\/creativemarket.com\/blog\/","name":"Creative Market Blog","description":"Creative Market Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/creativemarket.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/29056","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/users\/87"}],"replies":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/comments?post=29056"}],"version-history":[{"count":0,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/29056\/revisions"}],"wp:attachment":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/media?parent=29056"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/categories?post=29056"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/tags?post=29056"},{"taxonomy":"topics","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/topics?post=29056"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}