Explain the correct use of the "sizes" and "srcset" attributes in pictures

[rosstik333]

Please explain how to correctly display an image with the "sizes" and "srcset" attributes. How they should change and how to display them correctly. For example, I display a logo:

  <img
                srcset="{{ settings.logo | image_url: width: settings.logo_width }} {{ settings.logo_width }}w,{{ settings.logo | image_url: width: settings.mobile_logo_width }} {{ settings.mobile_logo_width }}w"
                sizes="(min-width: 750px) {{ settings.logo_width }}px,(max-width: 749px) {{ settings.mobile_logo_width }}px"
                src="{{ settings.logo | image_url: width: settings.logo_width }}"
                alt="{{ settings.logo.alt | default: shop.name | escape }}"
                height="{{ settings.logo_width | divided_by: settings.logo.aspect_ratio }}"
                width="{{ settings.logo_width }}"
                fetchpriority="high"
              >

Am I pointing this correctly? How this should work for other images on the page