When it comes to creating and editing images, many of us are confused about selecting the best image file format for our content. Some of us approach this essential decision making with a pinch of salt. They do not know that it impacts the size of images on their website. Thus, it is essential for appropriate image optimization.
Its pages and post contain text with images. The images enrich our text. They illustrate the content of our text and also serve as page breaks making our content highly readable. They occupy almost 10percent of the content on most websites. As such, we must understand the different types of image file format and when to use them.
Let us get started with the basic classes of image file format – Raster and Vector.
Raster Image Files Formats
JPEG and PNG are the most common file types on the internet, they fall under this category. They are characterized by their position. Every pixel under this class has a specific position and proportion. It makes resizing them a little challenging.
Resizing them without compromising their resolution is difficult. When resizing, you have to take their proportion to heart.
Vector Image File Format
These file types are very much different from the raster image file format. They do not use pixels, they are based on proportional formulas. Good examples are PDF and EPS. They are useful when it comes to creating graphics.
With these graphics, you can enlarge the original image without losing quality. It relies on curves and lines on a Cartesian plane.
You have given us a lot of very useful information on file formats. I found Harry's input below interesting. I had not heard of GIMP. I have been using a sort of Photoshop wannabe program called Photostudio that I received free with a scanner I bought many years ago. I don't think it is supported anymore. It says it only runs on Windows NT. But I can get it to run I just have to remember to keep saving my work otherwise it hangs itself. It has many of the features of Photoshop including working with layers, transparency, cloning, 2D transformations, and special arty effects but doesn't have the clever learning and macros that you get with Photoshop. I did have my own version of Photoshop many years ago when I was working in that field but I can't justify the cost of the license now and Photostudio does the trick.
I think the important questions for most of us are what are the best file formats to use for image creation and development, and then what formats are best used for online display on our sites. I wasn't aware, for example, that you can post vector graphics to websites, I guess other than PDF, but when I post PDFs I put them on separate single infographic pages with the express intent that they are available for download. I haven't tried embedding PDFs in a post.
Interesting topic.
Best regards
Andy
Reply
I stay more with JPEG, PNG and PDF. I WEBP would have been another alternative but its drawback of non-compatibility with all OS makes me drift away from it.
GIMP is free, you can easily download it from the net. I dwelt on GIMP and some free tools in this training 5 Free Image Editing tools that you can Use Thank you,
Ayodeji
I will also continue with JPEG and PNG. I think the main point for consideration that I got from your article was that I could also use PDF for infographics. I tend to produce my infographics in Powerpoint and then export one version in PNG for display in the post linking to a downloadable PDF which I publish on a separate page.
Best regards
Andy
You mention PSD using Adobe Photoshop and creating images using layers. To do this you need to use transparencies by removing unwanted background from different images and layering them one over the other.
This is ok if you can afford Photoshop, but what if you can’t. GIMP (Graphic Image Manipulation Program) is the answer. It’s free and, apart from some minor attributes, has everything you’ll find in Photoshop, more thanl enough unless you are a professional graphic designer.
This is where image file formats are important when creating images using transparencies and layers. Any transparencies created using JPEG will be lost when the final image is saved in the JPEG file format, as it doesn’t support transparencies. To overcome this problem, save the final image in the PNG file format.
Once the final image has been saved, upload it to Tinypng, where it can compress the image by as much as 70% without any noticeable loss.
Transparencies can be created using Gimp, but in many cases I find it easier to use removebg, an online background removal program. Below is an image I created for one of my sites using Gimp and seven different images.
Hi Harry, Just seeing this. I quite agree with you, GIMP is an excellent alternative to Photoshop. It is a totally free tool and it is easier to learn.
Ayodeji
