|
Png Notes On-line
Non Transparent Gifs On-line
Gif Hints And Tips Here On-line
Save Jpegs And Paint Shop Pro Files On-line
Optimise And Save Transparent Text On-line
Optimise And Save Transparent Graphics On-line
Save A Navigation Button As A Transparent Gif On-line
Save A Navigation Button As A Transparent Png On-line
Make A Single Colour Transparent And Apply Buttonise Effects On-line
Optimise And Save Jpegs - Paint Shop Pro File Format And Png Explained On-line
Abbreviation Meanings
Jpeg stands for Joint Photo Exports Group, Png stands for Portable Network Graphics and Gif stands for Graphic Interchange Format.
When creating images for a website, or sending them via e-mail - your main consideration should be the download time for recipients; this is especially important for recipients and visitors who have a dial-up modem, or a low specification PC. For example, if they visit a website that has lots of un optimised graphics, they may not wait for the web page to load.
This tutorial explains the pros and cons of saving your text, graphic or photograph as a Jpeg and a Gif.
Remember, you are aiming to strike a balance between download/sending times and graphic quality.
Generally speaking, if you are saving coloured photographs, you will be better off using the Jpeg format. If you have flat, plain coloured graphics, or text, (that have few colours), saving them as a Gif might be advisable.
Png Notes - Further Png notes can be found here
Png compresses images, (retaining their transparency), whilst at the same time - retaining the image’s 16.7 million colours. Gifs on the other hand compress files, reducing them to a maximum of 256 colours. The disadvantage of Pngs is that some older web browsers don’t support it. Save Images As Transparent Pngs Here.
Number of Colours
Jpegs have 24-bit colour channels - and are capable of displaying up to a maximum of
16.7 million colours. Gifs on the other hand, are 8-bit colour channels, and are capable of displaying a maximum of 256 colours.
Saving Jpegs, Gifs And Png Files - Loss Of Image Quality Notes
In order to keep the file size down, the compression process randomly takes away pixels from your photograph; and as a result, every time you save an image as a Jpeg, Gif, or Png file, its quality will degrade. Therefore, to keep your Jpeg, Gif and Png files in optimum condition, always save the original image as a Paint Shop Pro Image; then open the original Paint Shop Pro file, and save it as a Gif, Jpeg or Png. Your images will then be perfectly optimised every time they are saved.
Note
Photographs will undoubtedly react uniquely; therefore, experiment with different file formats and discover the right choice for your image.
1/
Cropping
There are different ways to reduce the size of your finished image and cropping is the first step - this removes extraneous areas not important to your image; for example, sky and extra scenery - or perhaps people.
2/
Resizing
This is another way to reduce the size of your image without too much loss of quality - depending on your resizing settings.
3/
Jpegs or Gifs
After you have cropped or resized your text or photographs, the final step is to save them as a Jpeg or a Gif. Save and Optimise Images.
The following gradient squares are both 100 Pixels X 100 Pixels; however, the Jpeg
(below), is 873 Bytes.
 |
And the Non Transparent Gif (below), is 2,603 Bytes. This is a big difference in terms of image size and subsequent download/sending speed - and loss of quality is kept to a minimum.
The following (plain text) Jpeg image has minimum colours, and the subsequent file size is
3.90 Kbytes
The following Gif is 2.74 Kilobytes - which is not hugely different, and its quality is similar to the previous Jpeg.
If you decide to create coloured text, and add an Inner Bevel and a Drop Shadow, you will notice the following results.
Jpeg = 3.52 Kbytes
Gif = 5.29 Kbytes
The difference in file size is slightly increased; therefore, for a smaller file size without loss of quality, save your file as a Jpeg.
Note
You may not think there is a huge difference, and saving a few Kbytes is pointless - however, if your website has lots of navigation buttons, or graphics, their files size will accumulate, and the total file size for your web page may be too large.
4/ Optimising Photographs
If you are optimising a photograph, Jpegs create a smaller file size, with better image
quality- depending on the compression value you select. Save images as Jpegs here
This Jpeg is 13.3 Kbytes.
The following Gif is 68.9 Kbytes - again, this is a huge difference if you are sending it via
e-mail, or uploading it to your website - always consider the loading time for people with dial-up modems.
Now you know the importance of optimising your images; in future, take a little time to achieve the best balance between quality and download speed.
Wendi E M Scarth Top of Page - Home.
|
