The Media Folder is one of the most known folders. This folder contains the full media files for our site, as well as videos, images and even complex animations. Each file in the site has its own format and so do media folders. Today we will talk about the different formats and how to upload them correctly to our site.
The main files in the folder are image files – images ranging from portrait images or backgrounds image to images of characters and many more…
We have a few types of image formats and we’re going to go over them all in that part.
Jpeg / jpg image – One of the best-known formats, a simple image format that includes wallpapers. We’ll use this format for images that include a background or images we’d like to upload in low weight... An image of this format type is important for an adjusted ratio depending on where it should appear on the page. Because the width of a desktop page is 1920 pixels, there is no reason to upload a wider image than this size. For mobile, as of today the full width is 768 pixels (iPhone 11).
Png image – An image file without a background, an important detail is to build it without background with designing software (like Photoshop). PNG images are used on the site usually in a portrait, member’s image, or in an image of various graphic icons. We can use the image without background even in cases where we want to display our main product on the site. For example, an image like this won’t fit in case we want to show a catalog.
SVG file – A vector file built with dedicated designing software (Illustrator Dodge). This file is now considered the highest quality file for web apps, it is possible to resize the file freely and perform lots of cool design actions and animations. Such a file is recommended for use in icons and call-to-action buttons.
MP4 file – A video file with a full background, like the videos you watch on YouTube, Vimeo, Felix and so on…
Video files have a fixed ratio and cannot be resized Dimensions unless we have design software. An MP4 video file can be very heavy so if it is too heavy it is better to upload it to a third party company like YouTube or any video uploading network.
LOTTIE ANIMATION / JSON file – The animation technology developed by AIRBNB. In the previous part we talked about an SVG image file and explained that it is the highest quality file, Lottie is actually the animated version of SVG files and it is the highest quality video / animated version! This file type is actually a very long code and requires dedicated software in order to watch these animations or videos.