• 388k
  • 56
Design Inspiration \ JUL 26th 2018

6 Different Types of Files and How to Use Them

Do you ever feel like people are talking a secret language that you simply don’t understand? For example, when someone asks you to send them a video in MP4 or your boss asks you for a PNG version of your company logo. “Are they talking in Morse code?” you think to yourself, and “what is all this MP4, PNG nonsense?!” Well, actually, these are all different types of computer file formats.

Each file type can support one or more forms of content, like images, video, and text. When deciding which one to use, it’s important to note the advantages and disadvantages of each. In this article, we will give you a thorough explanation of the most common file formats used today. So, the next time you want to upload an image to your newly created website or share a video as a Facebook post, you’ll know exactly which file format fits your exact needs (and maybe, just maybe you’ll be speaking a little Morse code yourself). Low and behold, here are the different types of files you should know and how to use them:

  1. JPEG (Joint Photographic Experts Group)

    JPEG is the most common format used by digital cameras and images living on the World Wide Web. This file format is based on lossy compression, meaning that it keeps information that is visible to the viewer and gets rid of data that the human eye can’t perceive. The popularity of the JPEG file stems from the fact that it is lightweight, while still being good enough quality for digital use. Due to its size, it will not only load faster, but it can be uploaded to any platform regardless of size limitations. This format can also be viewed on any device without the need to download a special image viewer. However, it’s important to be aware that everytime you save a file as a JPEG, hence compressing it over and over again, it causes the image to lose quality and possibly become pixelated or grainy.

    Advantages: lightweight file, viewable on almost any program.

    Disadvantages: loses quality when saved multiple times.

    Best places to use it: images for web design, social networks, and photo portfolios.

    JPEG is a common example of the different types of files

  2. PNG (Portable Network Graphics)

    PNG is a high-quality file format used for images. This file type is based on the lossless compression, which means that it supports high-quality images for online use while retaining the original image colors and sharpness. Unlike JPEG files, PNGs also support images with transparent backgrounds. So, if you want to have an image without a background, like a logo or product, you can save it as a PNG file and use it with different backgrounds. However, this file is not as lightweight as a JPEG. Therefore, it’s not recommended to upload hundreds of large PNG’s to your website or portfolio as it will take up a lot of storage and ultimately increase the loading time of your site. And nobody has time for that.

    Advantages: high-quality files, supports transparent backgrounds.

    Disadvantages: heavyweight file (slows down loading time and takes up lots of storage).

    Best places to use it: logos, websites photos, social networks (profile pictures, posts, and cover photos).

    PNG is a common example of the different types of files

  3. GIF (Graphics Interchange Format)

    You’ve probably heard of this file type based on its most popular feature that’s taken the Internet by storm: animation! The GIF file is a form of bitmap images, meaning the graphic is composed of many tiny parts called pixels, just like the JPEG and PNG file formats. This file type is based on LZW (Lempel-Ziv-Welch), a special form of the lossless data compression algorithm. A GIF is most suitable for storing graphics with a few colors, such as simple diagrams, shapes, and logos, rather than gradients. For example, your business’ icons that contain three colors or less look great in this file format – plus, the small file size will be suitable to use anywhere. However, a beautiful sunset picture would not only be too heavy of a file size but also will look distorted because of the color limitations. One benefit of this file type is that it supports a transparent background, like a PNG file.

    Advantages: supports transparency and basic animation.

    Disadvantages: displays gradient colors poorly.

    Best places to use it: short animations for social channels, like Facebook and Twitter.

    GIF is a common example of the different types of files

  4. PDF (Portable Document Format)

    This file format is used for online documents and printing purposes. It was created by Adobe with the goal of displaying files in the same format, no matter what device they are viewed on or what software they are opened with. Thanks to the reliability of PDFs you can create long documents and share them with others without risking a loss to your original design – text is not larger, images are not smaller, etc. PDF files can contain many different elements: text, photos, vector images, videos, audio files and even interactive elements like forms and buttons. It’s possible to create this file using many different kinds of software, from Adobe Photoshop, Illustrator, Indesign, and Acrobat to Microsoft Word, Google Docs and more. But to be able to view a PDF, you need to have a PDF reader installed on your device.

    Advantages: keeps all formatting regardless of what device it is displayed on.

    Disadvantages: you need a PDF Reader installed on the device to view it.

    Best places to use it: online forms, documents and printing services.

  5. SVG (Scalable Vector Graphics)

    SVG is a format commonly used to save and display vectors. Vector what? Vector art graphics are digital illustrations that are based on geometric shapes. They are created using a vector illustration software, like Illustrator. Apart from the clean and professional look they embody, their biggest advantage is that they maintain the highest quality even when resized. For example, if your business logo is a vector – and it should be – you can resize it to fit something as big as a billboard sign or as small as your business cards without risking a loss in quality. Today, we can view SVG images on all web browsers. It’s also a good format for printing purposes. So when you’re creating logos, icons and illustrations, make sure you save them as an SVG file. Also, if you’re working with designers on visual assets for your business, ask them to send it to you as an SVG file version, as well as other relevant formats (like PNG, JPEG, etc.).

    Advantages: resizable without losing quality.

    Disadvantages: social media platforms do not support this file type.

    Best places to use it: Graphics on your web design, illustrated assets for your business (logo, icons, diagrams illustrations, etc.).

    SVG is a common example of the different types of files

  6. MP4 (Moving Picture Experts Group)

    MP4 is a multimedia container format, which is just a fancy term for most of the videos we consume on the Internet. This file can contain video, audio, and subtitles. Thanks to its compression format, the end result will be a very lightweight file that can be easily uploaded to your website or favorite social media channel. MP4s can also be played on all major media players and streamed over the Internet, so you won’t need any sophisticated program to view it. In summary, this is the best choice for creating or saving video files to your website, social media and more.

    Advantages: lightweight file, playable on all major media players and streamable online.

    Disadvantages: we searched high and low, but it seems that this file type has no flaws.

    Best places to use it: videos on your website and social media videos (Facebook, Youtube, Vimeo, etc.).

Now that you know a thing or two about file types, you can create a stunning website with Wix to share your work!

Ofra Lior
By Ofra Lior
Team Lead of Community Designers
By Jennifer Kaplan
Community Writer, Wix About the Wix Blog

Get The Wix Blog
Straight to Your Email

Subscribe to the WixBlog And never miss an update!

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.

Join Us! \ 

Get the latest and freshest content on creating
& marketing your Wix website.

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.