I have been wanting to look into WordPress and images for a while now. One of the reasons is that I run a webcomic and the other reason is that I am wondering what to do with my photos from travels. I seriously want to process those picture in one way or another.
Before version 4.4 there was a plugin which handled responsive images, RICG Responsive Images. At the back of my mind I was aware of it but didn’t find time or space to use it somewhere. As of version 4.4 generates several versions of the image.
Personally I prefer <picture> element because in my view it is cleaner than using scrset attribute on <img> element. But if it works, I won’t protest against it much. There are many ways to the desired result.
At default WordPress generates the sizes according to some predefined set of sizes defined by the Core developers. But theme developers are able to override it, except for very large images – there’s an upper limit.
When I compare code on my blog and on my webcomic, I still think that picture is cleaner but WordPress’ way makes some sense and probably saves time.
<source media="(-webkit-min-device-pixel-ratio: 1.5),(-o-min-device-pixel-ratio: 3/2),(min-device-pixel-ratio: 1.5),(min-resolution: 1.5dppx)" srcset="http://lonewolfcomic.com/wp-content/uploads/2016/04/LWC-30-1-5.jpg">
<source media="(-webkit-min-device-pixel-ratio: 2),(-o-min-device-pixel-ratio: 2/1),(min-device-pixel-ratio: 2),(min-resolution: 2dppx)" srcset="http://lonewolfcomic.com/wp-content/uploads/2016/04/LWC-30-2-0.jpg">
<source media="(-webkit-min-device-pixel-ratio: 3),(-o-min-device-pixel-ratio: 3/1),(min-device-pixel-ratio: 3),(min-resolution: 3dppx)" srcset="http://lonewolfcomic.com/wp-content/uploads/2016/04/LWC-30-3-0.jpg">
<img src="http://lonewolfcomic.com/wp-content/uploads/2016/04/LWC-30-1-0.jpg" alt="" id="strip">
<img width="600" height="300"
class="attachment-post-thumbnail size-post-thumbnail wp-post-image"
alt="GameDev log #1"
sizes="(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 60vw,
(max-width: 1362px) 62vw, 840px" />
Another thing I was hoping that I will see is some alt text in the code generated by WordPress. My webcomic lacks that and I need to fix that at latest when I’ll be migrating to a different web host next month. It’s not perfect, I wish that I could add alt attribute when I am uploading.
It seems that at least in Twenty Sixteen defining a separate alt attribute in Media library won’t work for thumbnail images. I will put this on my list of this to look at when I will be deep in WordPress development again and I might write a plug-in for that.