• access the menu Web > Template (since v. 12: TypoScript)
• click the root page of your site 
• edit whole template (or Typoscript)
• from tab Includes select the library: Text/Image size: Bootstrap5 (SCSS) (textimage_size)
• save and close

• Edit the preferred content, i.e. text with media
• Under tab Appearance, section Layout select the desired size for the image area (options: image/media size from 8% to 91%)
• the text  column size will be automatically calculated
• Remember: the image column is the zone where you want to publish the images
• the image area could be populated with some images justified by columns; select how many columns you need, this should be done from
  tab Images > Gallery settings > number of columns (1-6)
• select from tab Image or Media (depends on the content type in use) the layout preferred (image to the right, left, ecc.) from tab Images > Gallery settings

It is recommended to use images at an adequate resolution in relation to the container that hosts them and the number of images inserted into it.
For example, in a site that has a width of 1280 pixels, inserting a full screen image, this must be at least 1280 pixels wide.

Otherwise, if the image is inserted in a column equal to 50%, its size must be at least 640px.

The size of an image to be published must also be related to the arrangement of the text in relation to the image and the number of columns chosen.

For example, it may happen that content such as text with Image is configured with the container for one or more images on the right. If the image container (or a single image) has been configured at 75% and only one image has been indicated, this must be chosen with the right size. In short, if an image appears blurry, it means that the width is too low and should be replaced with a larger one.

In most cases, choosing an image with a width of at least 512-640 pixels will be sufficient.