Src
Src is a CSS descriptor in the @fontface rule which specifies the resource containing font data and is neeeded in order for the @font-face rule to be valid.
Srcset
Srcset is a HTML property and is a string that identifies many image candidate strings and uses commas to specify the image resources in each circumstance. Each string has an image URL and a width or pixel density that describes when the candidate would be used instead of the image in the src property.
Sizes
Sizes are one or more strings that are separated with commas which implies that there are multiple source sizes. Every source size will have a media condition and a source size value. Media conditions are the properties of the viewport rather than the image, the source size explains the display size of the image.
Art Direction
Art Direction is where the image may look not how you intended it to and what you do to fix that problem is use art direction. For example if an image looks to large or too long on a narrow screen you can crop the image to make it look better on the narrow screen.
Summary
Src, Srcset, Size, and Art Direction are all very important to make a site look appealing and professional. Using Src in CSS to specify the resource that contains font data and using Srcset when there are multiple source size is important so the image appears correctly. Art direction and size are also important as the images need to have the proper display size to fit all different size screens.