How best to check 1x images

Today, I was told my recently uploaded Blocs website had broken images. I couldn’t confirm any problem on my 5K iMac or iPhone, but when I checked various PCs and old iMacs in the office, sure enough, the images were not loading. I used multiple browsers to confirm it was NOT a cache issue on my iMac or iPhone. Apparently, I had forgotten to upload the 1x images to my web server. Only the 2x images were on the server. This concerns me because logically I would think that browsers should default to displaying the 2x images if the 1x image cannot be found on the server – very frustrating.

How can I make a browser like FireFox display only 1x images on a 5k iMac, which would allow me to confirm if 1x images are missing on the server? (Safari is my main browser, but I use Firefox for testing, so I don’t care if I force it to always display low resolution images.)

I basically need to find an easy and fast way to confirm if a 1x image is missing on the server via web browser.

Thanks.

I guess with changing your display to a 1x high resolution?

I’m afraid I don’t know how to change the resolution of a 5K iMac such that the change would then ONLY display 1x images. If you have a list of steps, I am all ears!

True, seems you are not able to use the default display settings to change to a 1x resolution.

I am using a app like EasyRes for my display resolutions. There are other little apps providing the same functionality.

I’ve found it too time consuming and confusing having multiple size versions of every image on a site and in cases of 3x resolution it can make sites slow loading for those users. The easiest answer is to make all images 2x but select them as the 1x resolution. That way they should load for everything and look pretty good everywhere.

I thought about that, but I have some very large images on my site, so having 1x versions really would be boon for 1x screen visitors.

I’ve stopped using 3x because I honestly don’t know when they are used and they don’t seem to make any logical sense.

On those largest images it may just be a question of using better compression. I’ve run tests where you can compress retina images to seemingly ridiculous levels and they still look good on screen, despite being smaller in kb size than the non retina versions. It’s a sort of fuzzy maths that doesn’t make logical sense but often works in practice.

One caveat is that Webkit browsers had a bug where retina images were appearing rather blurry on non retina displays and I was actually the one who first reported this. I don’t know if they have fixed this as yet, however it’s worth pointing out 2K is practically the minimum nowadays for most users and 4K is increasingly common.

Except here in Japan. Windows 7 diehards are still around. None of the AutoBacs stores here have hi-rez displays on their PCs, and the same is true of our product distributors. Japan is in the dark ages when it comes to personal computers. Even folks using PCs at home just buy the cheapest Windows PC junk they can find. Most people here still use FAX machines!

That’s kind of strange. You don’t imagine Japan as a backward country with technology, quite the opposite.

Things were cutting edge when I came here in 1994. Electronic toilets, fully automated washing machines using Fuzzy Logic, Robots galore – things you didn’t see in other countries. But there haven’t been a lot of advancements since then. Indeed some of the greatest advancements came in the late 1980’s before I arrived. The Yen was very weak against the Dollar which is why there was a lot of manufacturing going on here, and with that true innovation. But after the economic bubble burst, about all the Japanese government did was increase red tape and regulations, and jack up sales taxes. Japan used to not have any sales tax at all. Now it’s 10%. That combined with the strong Yen drove manufacturing outside Japan. There’s a lot more I could say, but basically, other than automotive tech innovations, there’s not a whole lot of brain power being used over here on what you would deem
“the cutting edge of tech.” It’s quite sad.

I’ve completely stopped using anything but one image. Making three separate images for everything is time-consuming and in my opinion not needed. Compressing a large file is easy and yes they still look good.

casey

1 Like

There will come a point when I will probably use a 2x image as the 1x image too. That’s because a large percentage of our web visitors are mobile anyway, and those folks see the 2x images. But because Japan is so backward when it comes to desktop PCs, even now the 2020 is half over, it probably will take another 2 years before most people in Japan come up to the level of what you see there in Western countries (regarding screen resolution). So for now, there’s a speed benefit for me to add the 1x images. And since you already have a 2x, it’s not hard to make a 1x. It’s just a bit fiddly. And then when you upload only the 2x images like I did, folks with the 1x displays complain. That’s how I learned about the problem today. I uploaded my site last night, and today we got numerous phone calls from our dealers saying they couldn’t see the graphics. It was because they still use 1x screens.

I am now using SwitchResX to change to 1920x1080 (1x) and can see my 1x images.

I would like to say that Carousel in Blocs doesn’t play with 1x images at all. I unfortunately need to make 2x images only, since multiple resolutions are not allowed. Perhaps that won’t be an issue in the future, but for now, 2x images are wasted on 1x screens which are still in wide use here in Japan (and I assume in other countries too).