Tooltips in Edit Image are confusing

[siobhan]

Now that it's possible to Edit Images from the media modal (yay!!!), it's possible a lot more people will be looking at the Edit Image screen. The tooltips that are included in the screen to explain what's going on are words and not very clear. I propose making the following changes:

You can proportionally scale the original image. For best results the scaling should be done before performing any other operations on it like crop, rotate, etc. Note that images can only be scaled down, not up.

Updated to:

You can proportionally scale the original image. For best results, scaling should be done before you crop, flip, or rotate. Images can only be scaled down, not up.

to:

The image can be cropped by clicking on it and dragging to select the desired part. While dragging the dimensions of the selection are displayed below.
Crop Aspect Ratio
You can specify the crop selection aspect ratio then hold down the Shift key while dragging to lock it. The values can be 1:1 (square), 4:3, 16:9, etc. If there is a selection, specifying aspect ratio will set it immediately.
Crop Selection
Once started, the selection can be adjusted by entering new values (in pixels). Note that these values are scaled to approximately match the original image dimensions. The minimum selection size equals the thumbnail size as set in the Media settings.

to

To crop the image, click on it and drag to make your selection.
Crop Aspect Ratio
The aspect ratio is the relationship between the width and height. You can preserve the aspect ratio by holding down the shift key while resizing your selection. Use the input box to specific the aspect ratio, e.g. 1:1 (square), 4:3, 16:9, etc.
Crop Selection
Once you have made your selection, you can adjust it by entering the size in pixels. The minimum selection size is the thumbnail size as set in the Media settings.

The thumbnail image can be cropped differently. For example it can be square or contain only a portion of the original image to showcase it better. Here you can select whether to apply changes to all image sizes or make the thumbnail different.

to

You can edit the image while preserving the thumbnail. For example, you may wish to have a square thumbnail that displays just a section of the image.

Not huge changes, but hopefully they're a bit clearer. In a perfect word, we would have no tooltips :)

There is another issue related to this that I'm not quite sure how to solve. The aspect ratio help should come directly above the aspect ratio box, but the image selection help text is in the way. This is somewhat confusing.

[SergeyBiryukov]

27651.diff​ appears to have an unrelated change from [27774] (there's no wp-admin/css/colors.css file in trunk since [27106]).

[SergeyBiryukov]

Introduced in [11965].

[siobhan]

Derp. Attached a new one.

[kirasong]

These descriptions are much easier to understand for the general user. It doesn't fix the UX, which we still have to tackle, but it's a good step in the right direction.

[SergeyBiryukov]

In 27938:

Fix typo in verify_file_md5() description. see [25541].

props siobhan.
see #27651.

[SergeyBiryukov]

In 27939:

Clarify tooltips on Edit Image screen.

props siobhan.
fixes #27651.