Feedback Front page images

Jonathan F/2

Los Angeles, USA
Thanks for checking! I've been using a Mac in Cloud VM to debug but the screen rendering from the VM through the remote desktop app I'm using (mRemoteNG) on my Dell XPS with a UHD screen is not giving me the best user experience so I appreciate you guys helping me out with the testing. :cool:

You'll have to wait for someone else to check on an iPad though, my kids are currently watching Youtube videos on it! :D


Code Monkey 🐒
iPad Pro 12.9": Some pix are still squeezed, but not all, and I am now getting a full page of them instead of the minimal view I was getting before. Its an improvement.
The images are dynamically resized to fit the device screen dimensions so there'll always be some that might appear a little squeezed.

The alternatives to a using a fully responsive design is to either leave gaps of wide space around each image, to crop the preview images to be squared so that they can be displayed in a grid instead of keeping the original image orientation & proportions, or to use a hard set content width & height targeting specific devices.

The problem with leaving gaps is that, well, it's just ugly and there's no reason for it.

The problem with auto cropping images is what gets cropped might be what is of interest unless somebody manually crops each individual image for the preview and makes the decision on how the preview image should be edited.

The problem with using a hard set content area is that depending on your device, browser, and screen size you may or may not end seeing the images zoomed in/out or you may end up with the images being shown full size with scroll bars.

A response design that dynamically scales is the most friendly solution for trying to accomodate all devices (laptops, phones, tablets), all OSs (Windows, Mac, Android, iOS, Linux), all browsers (Chrome, Edge, Firefox, Opera, Safari and their various offshoots), source images that could be of nearly any dimensions (when uploading images we don't enforce a max or min value for height & width), and all while making it as easy as possible for the community team members to 'feature' an image.

Now that the Safari issue seems to be under control, give it a chance. :)


Looks great on my 2018 MBP with safari 12.1
Image 4-19-19 at 5.20 PM.jpg


Code Monkey 🐒
A slight change I'm trying for the mobile users (and attn @kyteflyer)...

On desktop devices the front page shows the image information as an overlay when you hover over the image with your mouse. This is the same behavior as when you visit the "Media" section of the site and view the thumbnails.

Mobile touch-screen devices, such as smartphones and tablets, was behaving a little bit differently. The Media section always displays the overlay info' because there is no 'mouse hover' action on those devices. When I did the front page (yes, it's all bespoke software done just for Cameraderie;)) I went with suppressing the overlay info' so that when browsing the front page the images themselves are clear & unhindered with the hope being that they'd be interesting enough on their own to get visitors to click/tap on them to view the full post.

It's come up in a few conversations that some Cameraderie members would prefer seeing the overlay on their mobile devices. You guys ask, I listen. :D I've changed it so that mobile devices now will always see the information overlay on the images.