How big do you like your images?

[boriskovivanslav]

A lotta people here like to put images into their stories, and I'm no exception. I'm glad to put that kind of stuff into my posts...but there's always a question: just how big should an image be? Make it too small and you lose half the point of having an image and end up eating up details, make it too big and it disrupts the page, especially for people with smaller monitors or on mobile devices. There's a goldilocks zone somewhere between, but different authors have different views.

So, example. Here's a picture from my WIP (and as yet unpublished) story, made by yours truly with zero AI:

Right now, that's my native resolution (1920x1080. I should probably get a 4k monitor sometime since I've got the hardware for it, but that's a different topic), which is way, way too big to go into a CHYOA post without warping the page to kingdom come and fucking over people on mobile devices and the like. I usually scale that down to 960x540, which is the format I've used in Twine before, and that works well a lot of the time. That'll make that image look like this:

That's great for mobile, but could probably do with being a fair bit bigger to avoid losing so much of the detail, which is the last thing I want to do after putting so much effort into the bloody thing. It's one of those things that needs some tinkering to get right, you know how it is. Rather than being half, it might be, say, a 75% size of the full image.

But just what size would you like for an image? What's your gold-standard for image sizes? Landscape, portrait? Do you like big chunky images with lots of detail, or smaller ones for better reading, or do you hunt for the sweet spot between the two?

 

[TheLowKing]

I'd say: the bigger the better. Small images only look good on small screens, but large images look great on big and small screens (once the browser downscales it to avoid warping the page).

There are a couple of caveats, though. When I come to CHYOA, it's for the prose, not the pictures. There's a real risk that overly large pictures divert attention away from the prose. I like to be able to read both the paragraph before and after the image without scrolling. If the image is too big for that, then one or both get lost, and the picture becomes distracting rather than enriching.

You should also keep in mind loading times and (for mobile users) bandwidth use. However, my experience is that images with large dimensions and high compression look a lot better than images with smaller dimensions and low compression, so if you're worried about file sizes, I'd suggest increasing the compression rather than reducing the image dimensions. And use JPEG, not PNG.

...putting that all in concrete terms: 1920x1080 is totally reasonable.


P.S. Even though both of your images are displayed at the same size for me, the first image looks way more detailed than the second, suggesting you've done something wrong when resizing the second. You might want to look into different scaling methods.

 

[boriskovivanslav]

I'd say: the bigger the better. Small images only look good on small screens, but large images look great on big and small screens (once the browser downscales it to avoid warping the page).

There are a couple of caveats, though. When I come to CHYOA, it's for the prose, not the pictures. There's a real risk that overly large pictures divert attention away from the prose. I like to be able to read both the paragraph before and after the image without scrolling. If the image is too big for that, then one or both get lost, and the picture becomes distracting rather than enriching.

You should also keep in mind loading times and (for mobile users) bandwidth use. However, my experience is that images with large dimensions and high compression look a lot better than images with smaller dimensions and low compression, so if you're worried about file sizes, I'd suggest increasing the compression rather than reducing the image dimensions. And use JPEG, not PNG.

...putting that all in concrete terms: 1920x1080 is totally reasonable.


P.S. Even though both of your images are displayed at the same size for me, the first image looks way more detailed than the second, suggesting you've done something wrong when resizing the second. You might want to look into different scaling methods.

I hadn't considered that auto-scale might be a thing on CHYOA (I'd actually forgot that it was a thing in general), so thanks for that reminder! That puts us back to 1920x1080, back to full size. As for the image, I kinda resized that one in a hurry just to get a small image for the post as a comparison on desktop, so it was done with plain ol' paint rather than Paint.net which is what I usually use. MSPaint probably ate some details as an image tax, or something.

 

[Audiflex]

I'd say: the bigger the better. Small images only look good on small screens, but large images look great on big and small screens (once the browser downscales it to avoid warping the page).

There are a couple of caveats, though. When I come to CHYOA, it's for the prose, not the pictures. There's a real risk that overly large pictures divert attention away from the prose. I like to be able to read both the paragraph before and after the image without scrolling. If the image is too big for that, then one or both get lost, and the picture becomes distracting rather than enriching.

You should also keep in mind loading times and (for mobile users) bandwidth use. However, my experience is that images with large dimensions and high compression look a lot better than images with smaller dimensions and low compression, so if you're worried about file sizes, I'd suggest increasing the compression rather than reducing the image dimensions. And use JPEG, not PNG.

...putting that all in concrete terms: 1920x1080 is totally reasonable.


P.S. Even though both of your images are displayed at the same size for me, the first image looks way more detailed than the second, suggesting you've done something wrong when resizing the second. You might want to look into different scaling methods.

Solid advice! Bigger images do scale better across devices, but you’re right balance is key. They should enhance the story, not overshadow it. Keeping images large but highly compressed (JPEG over PNG) is a smart move for quality and loading times. And yeah, 1920x1080 sounds like a sweet spot. Also, good catch on the scaling issue, consistent quality matters! Great tips for keeping visuals and prose in harmony.

 

[remysloane]

The ideal situation for me would be to display a small picture on screen but have that picture itself be a hotlink to a larger version that opens in another browser tab. Is this possible to setup?

We already have function where you can put the small picture but then have actual text that says something like "Original picture here" and have that text link to the larger picture. That might be a good solution for you, borisK

I would not put a large picture in the text flow itself. I've noticed the page sometimes takes a long time to load with a bigger image or especially with GIFs. That's even with a fast connection on my side.

 

[Err0rkatze]

750px on the largest axis has always been the sweet spot for me. It's at that point of being small enough not to bloat or spread text too much, but still large enough to maintain most of it's detail. Since I always tend to use my own stuff for things, I tend to prefer that public versions of them are slightly reduced in resolution anyway.