This isn’t the usual image tutorial that we feature where the focus is on the responsive code implementation. Instead, Ahmad takes a close look at the different design approaches you can have with images and how they’re done with CSS & HTML.
One of the decisions that a front-end developer needs to make while building a website is the technique to include an image. It could be an HTML
<img>, or an image via CSS backgrounds, or maybe SVG
<image>. Choosing the correct technique is important and can play a huge role in performance and accessibility.
In this article, we’ll learn the various ways of including an image in addition to mentioning the advantages and disadvantages of each one, and the context of when and why to use each.An excerpt from Image Techniques On The Web