A lead image creates good structure, hierarchy and allows you to show the main thing. It always makes the design more cohesive and visually attractive.
It's frustrating when an image separates the heading from the text. So it becomes not quite clear what the heading refers to. It is good if the image comes first and only after the title and text.
It works in all forms of content, including cards and any other modules. It's always better when the image comes first, then the heading, and finally, the text that refers to the heading.
When the heading combines the image and text in two columns, it is better to place the image on the right. If the image is on the left, the heading is detached from the entire composition and looks strange.
If you arrange the top edge of the image to the same level as the header, the text will read well, regardless of where the image is: left or right.
Showing a gallery with equal sizes of images and equal columns is usually boring and uniform. It is better to vary the layout by changing the size of images, width, and some columns in the gallery. This works also in product catalogs. The listing can be varied by background, size, etc.
It's a good idea to pull the image outside the edges of the text. This often creates a more cohesive layout and looks interesting. This works well in many cases, such as when the image is a cover of text or card.
A horizontal image next to a column of text can look strange. In that case, it's best to use vertical images.
Vertical blocks with an image mix with each other even if there is a reasonable distance between them. Therefore, separating such blocks with a line or alternating backgrounds is better.
It's always weird to make an image float in text, especially on websites and application design. It implies small images, which is not such a good thing. Larger images in the text are better. It also creates some other problems, like jagged margins from the picture, and generally makes the text worse to read.
Instead of floating images, it's always a good idea to separate text and images into columns. It reads better and looks great.
