Retina responsive images

With use tag <picture></picture> Full screen image image description
            
                <picture>
                <source
                srcset="http://via.placeholder.com/1920x1440/008B8B/ffffff?text=Desktop+image+1920x1440px,
                        http://via.placeholder.com/3840x2880/008B8B/ffffff?text=Desktop+image+(retina)+3840x2880px 2x"
                media="(min-width: 1281px) and (min-height: 1024px)">
                <source
                srcset="http://via.placeholder.com/1920x1024/008B8B/ffffff?text=Desktop+image+1920x1024px,
                        http://via.placeholder.com/3840x2048/008B8B/ffffff?text=Desktop+image+(retina)+3840x2048px 2x"
                media="(min-width: 1281px)">
                <source
                srcset="http://via.placeholder.com/1280x1440/008B8B/ffffff?text=Landscape+image+1280x1440px,
                        http://via.placeholder.com/2560x2880/008B8B/ffffff?text=Landscape+image+(retina)+2560x2880px 2x"
                media="(min-width: 981px) and (min-height: 980px)">
                <source
                srcset="http://via.placeholder.com/1280x980/008B8B/ffffff?text=Landscape+image+1280x980px,
                        http://via.placeholder.com/2560x1960/008B8B/ffffff?text=Landscape+image+(retina)+2560x1960px 2x"
                media="(min-width: 981px)">
                <source
                srcset="http://via.placeholder.com/980x1024/008B8B/ffffff?text=Landscape+image+980x1024px,
                        http://via.placeholder.com/1960x2048/008B8B/ffffff?text=Landscape+image+(retina)+1960x2048px 2x"
                media="(min-width: 769px) and (min-height: 900px)">
                <source
                srcset="http://via.placeholder.com/980x900/008B8B/ffffff?text=Landscape+image+980x900px,
                        http://via.placeholder.com/1960x1800/008B8B/ffffff?text=Landscape+image+(retina)+1960x1800px 2x"
                media="(min-width: 769px)">
                <source
                srcset="http://via.placeholder.com/768x1024/008B8B/ffffff?text=Tablet+image+768x1024px,
                        http://via.placeholder.com/1536x2048/008B8B/ffffff?text=Tablet+image+(retina)+1536x2048px 2x"
                media="(min-width: 415px) and (min-height: 800px)">
                <source
                srcset="http://via.placeholder.com/768x800/008B8B/ffffff?text=Tablet+image+768x800px,
                        http://via.placeholder.com/1536x1600/008B8B/ffffff?text=Tablet+image+(retina)+1536x1600px 2x"
                media="(min-width: 415px)">
                <source
                srcset="http://via.placeholder.com/414x1024/008B8B/ffffff?text=Tablet+image+414x1024px,
                        http://via.placeholder.com/828x2048/008B8B/ffffff?text=Tablet+image+(retina)+828x2048px 2x"
                media="(min-height: 900px)">
                <img src="http://via.placeholder.com/414x900/008B8B/ffffff?text=Mobile+image+414px" srcset="http://via.placeholder.com/414x900/008B8B/ffffff?text=Mobile+image+414x900px,
                    http://via.placeholder.com/828x1800/008B8B/ffffff?text=Mobile+image+(retina)+828x1800px 2x"
                alt="image description">
                </picture>
            
        
Full width image image description
                
                    <picture>
                            <source srcset="http://via.placeholder.com/1920x500/008B8B/ffffff?text=Desktop+image+1920px,
                                            http://via.placeholder.com/3840x1000/008B8B/ffffff?text=Desktop+image+(retina)+3840px 2x" media="(min-width: 1281px)">
                            <source srcset="http://via.placeholder.com/1280x500/008B8B/ffffff?text=Landscape+image+1280px,
                                            http://via.placeholder.com/2560x1000/008B8B/ffffff?text=Landscape+image+(retina)+2560px 2x" media="(min-width: 981px)">
                            <source srcset="http://via.placeholder.com/980x500/008B8B/ffffff?text=Landscape+image+980px,
                                    http://via.placeholder.com/1960x1000/008B8B/ffffff?text=Landscape+image+(retina)+1960px 2x" media="(min-width: 769px)">
                            <source  srcset="http://via.placeholder.com/768x500/008B8B/ffffff?text=Tablet+image+768px,
                                    http://via.placeholder.com/1536x1000/008B8B/ffffff?text=Tablet+image+(retina)+1536px 2x" media="(min-width: 415px)">
                            <img src="http://via.placeholder.com/414x500/008B8B/ffffff?text=Mobile+image+414px"
                                srcset="http://via.placeholder.com/414x500/008B8B/ffffff?text=Mobile+image+414px,
                                            http://via.placeholder.com/828x1000/008B8B/ffffff?text=Mobile+image+(retina)+828px 2x" alt="image description">
                    </picture>
                
            
Not full width image
image description
                
                    <div class="img-holder max-800">
                        <picture>
                                <source srcset="http://via.placeholder.com/800x500/008B8B/ffffff?text=Tablet+image+800px,
                                                http://via.placeholder.com/1600x1000/008B8B/ffffff?text=Tablet+image+(retina)+1600px 2x" media="(min-width: 769px)">
                                <source srcset="http://via.placeholder.com/768x500/008B8B/ffffff?text=Tablet+image+768px,
                                        http://via.placeholder.com/1536x1000/008B8B/ffffff?text=Tablet+image+(retina)+1536px 2x" media="(min-width: 415px)">
                                <img src="http://via.placeholder.com/414x500/008B8B/ffffff?text=Mobile+image+414px"
                                    srcset="http://via.placeholder.com/414x500/008B8B/ffffff?text=Mobile+image+414px,
                                                http://via.placeholder.com/828x1000/008B8B/ffffff?text=Mobile+image+(retina)+828px 2x" alt="image description">
                        </picture>
                    </div>
                
            
Multicolumn
image description
image description
image description
image description
                
                    <picture>
                            <source srcset="http://via.placeholder.com/240x240/008B8B/ffffff?text=Tablet+image+240px,
                                        http://via.placeholder.com/480x480/008B8B/ffffff?text=Tablet+image+(retina)+480px 2x" media="(min-width: 769px)">
                            <source srcset="http://via.placeholder.com/376x376/008B8B/ffffff?text=Tablet+image+376px,
                                        http://via.placeholder.com/752x752/008B8B/ffffff?text=Tablet+image+(retina)+752px 2x" media="(min-width: 415px)">
                            <img src="http://via.placeholder.com/414x414/008B8B/ffffff?text=Mobile+image+414px"
                            srcset="http://via.placeholder.com/414x414/008B8B/ffffff?text=Mobile+image+414px,
                                    http://via.placeholder.com/828x828/008B8B/ffffff?text=Mobile+image+(retina)+828px 2x" alt="image description">
                    </picture>
                
            
Multicolumn lazyLoad
image description
image description
image description
image description
image description
image description
image description
image description
                
                    <picture class="lazy">
                            <source  data-srcset="http://via.placeholder.com/240x240/008B8B/ffffff?text=Tablet+image+240px,
                                    http://via.placeholder.com/480x480/008B8B/ffffff?text=Tablet+image+(retina)+480px 2x"
                                    media="(min-width: 769px)">
                            <source  data-srcset="http://via.placeholder.com/376x376/008B8B/ffffff?text=Tablet+image+376px,
                                    http://via.placeholder.com/752x752/008B8B/ffffff?text=Tablet+image+(retina)+752px 2x"
                                    media="(min-width: 415px)">
                            <img data-src="http://via.placeholder.com/414x414/008B8B/ffffff?text=Mobile+image+414px"
                            data-srcset="http://via.placeholder.com/414x414/008B8B/ffffff?text=Mobile+image+414px,
                            http://via.placeholder.com/828x828/008B8B/ffffff?text=Mobile+image+(retina)+828px 2x"
                            alt="image description">
                    </picture>