I want to use one file format for the in-webpage version of an image, but then also provide an uncompressed png download. Does anyone have any web design suggestions on how I can do this transparently and not confuse the user?

@thufie not sure if this is exactly what you're looking for but i usually just put a button explicitly labeled as full quality download on a page as that's pretty clear in my eyes. Other than that I don't know of any other way.

@edensgarden I wonder if the styling can be made to look nice without javascript.

@thufie I don't think I've ever done website styling with javascript. Only layout construction from arbitrary json files and url parameters. I've only ever done styling entirely with css and css classes

@thufie hell the only javascript I have for my website (current work in progress) is for the art gallery page. Everything else is static generated using jekyll and markdown and styled in pure css.

Follow

@edensgarden I just meant I might wanna know some tips on what might look nice. I want to ensure it isn't easy to accidentally download the wrong version of the image, you know? Maybe I can add a little overlay element to discourage right-click saving the preview version.

@thufie Overlay element might work fine as long as it's not blocking anything important when you're just trying to look at the image. I personally just had a visible "Download Full Image" button in plain view on the page right by the art which I felt would've been enough by my standards. Might reevaluate them though.

If you want to go extreme you could disable the ability to right click on the image entirely but that wouldn't provide a good UX in 90% of cases.

@thufie oh and also you can do specific hover effects with css and divs that in theory shouldn't affect screen readers if set up right in theory. The specific pseudoclass I believe is `::hover`

Sign in to participate in the conversation
Pixietown

Small server part of the pixie.town infrastructure. Registration is closed.