Recommendations for the creation of web galleries. Photoshop as a tool to prepare images.

Photoshop program to date - one of the best graphic editors. It is used by millions of people: someone with the aim of earning someone needed it possible to support their hobby. This article will discuss things that are useful for people who create and post their own gallery on the Internet. Photographers and artists certainly have the need to demonstrate to users of the Network.

First of all, I would like to voice a few recommendations. So, if you create a web gallery, then:

1) A good habit is considered to be first to show visitors not gigantic images compressed using the attributes width and height tag, but really small. The thing is that the large decrease in the size of the picture does not lead to a reduction in the size of the file. As a result, your users have to download a huge image, and only after the download the browser will reduce it in the display.
Of course, you could argue: more people enjoy the unlimited packages, the problem is less concerned about the traffic. You are right, the progress does not stand still. But, first, not all, nor even an absolute majority of our users buy bezlimitki. And forget about those who paid their money for each MB, it should not be. Secondly, is still a very critical time of loading your site. Many users can not simply wait until the thirty-loaded images (each of which, for example, weighs a few megabytes), and leave the web resource. Better to give visitors a chance to see and evaluate your work properly.

2) If you heeded the arguments art.1 and placed in the gallery thumbnails are small, then take the fill attributes alt and title tag. Internet Explorer interprets these attributes are the same, but Mozilla and Netscape believe title help bubble (it appears when you move your mouse on the image), and alt - is what is written on the spot pictures, if it is not loaded. Therefore, these two attributes must be filled. Recommended in the following information:

Name of the image. This helps search engines to determine what the theme is relevant, your picture and give a link to it in the search results for relevant queries.

The size of the original image. If a visitor like this is the work he wants to go to the page where you can examine a larger scale (or the real amount depends on how the gallery is set up). Therefore it is polite to warn the concerned people about the size of the file, allowing him to decide to download. For example, when pointing the cursor on the icon displays the following prompt:

And now a few words on how to prepare images for publication on the Internet for example, the graphic editor Photoshop.

Suppose you picked up a few dozen photos, and want to make them icons. Please note that this article will discuss creating icons manually by an example of the images. To learn how you can automate this process for a large number of images, read one of the following articles. So, the launch editor of Photoshop and open it in a large image. Reduce it with the help of dialogue changes the size of the image (a combination of keys Ctrl + Alt + I, or choose from the menu Image (Picture) of the Image size (Image size)):

Be sure to expose the box (if it has not exhibited) Constrain Proportions (Keep aspect ratio). In the figure, it marked a red circle. Then you change one of the first two fields - the figure in box Width (Width) cursor - the value of the second will be changed automatically, taking into account the factor of proportionality. For example, in the gallery expected to put the image size of 150x110. Enter in the box determines the width, the value of 150. The second field is generated value of 116. This is not exactly what we need, and now will need to fix it. Click OK to the values of 150x116. Then use the Crop tool and are best "extra" pixels - exactly what part or all at once, you decide as the author. Do not worry, that the icon is not the whole image. This is much better than the distorted proportions. After performing these steps, I got this icon:

Saved at the highest quality, it has a size of about 18 kilobytes. A luxury for such chips. Therefore, use the option, especially for optimizing the size of existing images: File / Save for web (File / Save for Web).

On the 2-Up, marked by a red circle on the picture to the left you will see the original image, and right - with the changes. You can choose the compression algorithm is JPEG, GIF, PNG or webBMP. To cite a few pairs for comparison with the characteristics of compression.

The original image edited picture settings preservation
JPEG compression quality 80. The file has been 9 kilobytes. Visible loss of quality is not there.
JPEG compression quality 60. The file has been 6 kilobytes. Visible loss of quality is not there.
JPEG compression quality 30. The file has been 3 kilobytes. There are artifacts on the borders of the change of color.
JPEG compression quality 10. File size became 2 kilobytes. Rasplyvanie clearly marked on the color boundaries.
GIF compression, 32 in color. File size 7.5 kb.
GIF compression, 16 colors. File size 6 kb.

In GIF format images is best to maintain when the number of color transitions low (white bird against a background of blue sky, for example). Or, if you want to preserve the clarity of the lines (drawings). Speaking of the GIF, it should be noted that it actively displaces PNG. He, unlike GIF, supports partial transparency and a greater degree of compression.

In each case it is better that you can find a compromise between quality and size of the image and choose the right format.

I hope that the information contained in this article will help you and your gallery will attract many fans. Successes in creativity!

0 коммент.:

Отправить комментарий