The use of graphics for decorative purposes should be minimized, as they can place unnecessary burden on the download time of a page and are not appreciated by most users, anyway. Studies, for example, by the NN Group, which specializes in user experience, have shown that users generally pay attention to only those images that carry relevant information, such as photos of real people (not stock photos of models) and products, while ignoring decorative graphics. In particular, large graphics should not be used for decorative purposes, because whatever benefits they offer are likely outweighed by the performance problems that they are likely to cause.
The most common decorative use of images is as background. When an image is used for background, it should match the mood or context of a design; otherwise, it may create conflict and distraction. For example, a background image consisting of different-color balloons suits a page providing information about a party than one that is providing information about a funeral. Even when background image is relevant and complements a design theme, it should not be so overwhelming that it gets in the way of the content being delivered. This is unprofessional and particularly unacceptable in learning applications, given that focus is especially required during learning. To prevent background graphics from interfering with the content of a page, they should be subdued or toned down. Figure 6.31 shows some examples.
Another common technique used to prevent background image from overwhelming content is to place the content in a plain color box on the background, as shown in Figure 6.32. However, this can look a bit messy, confusing, and distracting sometimes, especially when users have to scroll through the content. Also, the background can keep attracting the eyes from the periphery.
Source: Sklar David (2016), HTML: A Gentle Introduction to the Web’s Most Popular Language, O’Reilly Media; 1st edition.