How to prepare photos for publication on the Internet?
Any material on any site wins, provided it is illustrated with photographs, drawings, diagrams and other graphic files. And if the size of these files does not matter when typesetting the material on a modern computer equipped with gigabytes of RAM and hundreds of gigabytes of space on the hard drive, then when publishing on the Internet the situation changes.
In our country, only a few of the largest cities can boast the availability of high-speed unlimited Internet. The province still sits tightly on modem communications, and the backwoods even on GPRS (communication using a mobile phone). The data transfer rates on these channels are depressingly low, so large web pages load annoyingly slowly. Since image files are champions in their place, you should reduce them as much as possible with the selected quality standard. How to do it in a few minutes?
We will not consider the method of obtaining images: these may be your own pictures; photos and drawings downloaded from the web; scanned images; computer screenshots (screenshots) and the like.
All of them are united by one property – an unacceptably large volume. Photoshop will help us reduce this value. No need to be afraid of this program – it equally serves both the picky professional illustrator and the trainee of the School of Life.ru. The version of the program for our purposes does not matter, any one from the sixth or older is suitable (7, 8, cs, and so on). An older version is even preferable, as it takes up less space, works faster and has fewer options. This article uses screenshots taken from version 8.0.
If Photoshop is not installed on your computer, then it is worth installing. Installation takes place almost automatically, you just have to agree to all the default settings. An open program window is shown in Fig. 1.
On the left you see a narrow high window of Tools (Tools), it can be moved with the mouse over the blue bar at the top to any convenient place on the screen. This applies to all other auxiliary windows of the program. In the right part of the window we see three more auxiliary windows. They are not needed for our task, so we will close them so that they do not interfere. If necessary, they can always be returned from the Window menu.
It is time to open the image, which we will reduce. To do this, open the File menu and select the second position from the top – Open. A standard file selection window will appear that is familiar to everyone.
Having opened the necessary file, we will begin to work with it. If this is a photograph, then the first thing you need to cut off all the excess. To crop, use the Crop Tool, in Figure 1 it is in the Tools window on the left in the third row of tools, highlighted in a white square. Using the specified tool, we make a rectangular selection of the desired portion of the photo.
Keep in mind that the borders of a rectangular selection frame can be moved with the mouse over the small squares on the sides, and even rotated over the corner squares. Having selected the desired part of the image, double-click the mouse inside the selection and the photo will be cropped.
Next, you need to set the size. To do this, select the Image Size line in the Image menu and set the desired one in the window that opens. In this case, you can choose the size in centimeters, but better – in pixels. A 700-pixel-wide photo will occupy most of the browser window. The most common width is 500 pixels. The height will be set automatically while maintaining the proportions of the picture.
And it remains to do the most important thing – to optimize the image for the web. The fact is that it is still too large, and we need to reduce its size.
But this is not all – the image carries a lot of redundant information. For example, the .jpg file format contains millions of shades of colors, and the web uses mainly only 216 so-called “safe” ones, that is, those that are guaranteed to be transmitted without distortion by any browser. The same picture with the resolution, the resolution of 300 lines / inch is redundant, 72 is enough. Photoshop’s Save function for the Web is a program in the program that allows you to optimize the image while maintaining decent quality and reducing its size. Open the File menu and select Save for Web.
The program allows you to save files in several formats, but we need only two main ones: .jpg for photos and pictures and .gif for texts, drawings, diagrams and more. The .gif format is also unique in that it supports transparency (for example, background) and animation.
The Save for Web program menu allows you to experiment with various degrees of image “degradation”, for which two images are displayed on the screen – the original and the optimized one. (It is possible to display 4 images). Experiment with different settings and find the optimal size / quality ratio for you. I personally do not recognize photos larger than 30 kilobytes, because I live in a village and use GPRS. The final result of 500 × 344 pixels was 10.2