Image Tags are inconsistent

I use the upper left Tile Image Tags to display certain information about a particular row of data (content). But lately I’ve noticed that the size of font and (worse) the amount of the displayed text is so inconsistent that it makes those tags hard to use.

I have relatively short Tags now being truncated with three dots […] cutting off some important information for my users, whereas other much longer strings of data are still being displayed just fine… albeit with a much smaller font. I’d prefer that nothing be truncated, even if that means a much smaller font, but I find it odd that now I’m getting text truncated with just one or two words in the tag. Are you guys working through something, or should we expect tags to behave like this going forward?

2 Likes

I’ve never noticed different font sizes for the tags. What size tiles do you have? Do you have a screenshot? I’m curious.

What it is is that the tags are not proportional to the size of the tile/image. A full screen image tag uses the same dimensions as the 2-col tiles/cards. It’s an optical illusion that makes the tag appear smaller (I think) and it IS a bit disappointing.

Also, captions on images need gradients. There…I said it.

So like the first image… why does A Gray Divide have three dots after it?? Whereas a tag like Stick: The Skinny Hitman [3] is full. There isn’t even any text following A Gray Divide. That’s the full title.

No take a look at the differences in these Tags. They are indeed different font sizes. Take a look at Until Like X [2] just to the right of A Double Negative [7]. Totally different sizes. Or “A Gray Divide…” to the left of Ulfis Otrinne: Sacrifice [11] +4 More Today… which is smaller in font size. Not to mention way longer and displaying the full text whereas A Gray Divide has three dots for truncation.

@Mark? Any insight?

It’s all just terribly inconsistent. Some long, some short. Some bigger font, some smaller. Some truncated with dots, some not. I’ve been resisting placing this info from Cloudinary to save on Cloudinary credits, and love the instant labeling in glide without image processing, but this makes it hard for my use case, I think.

1 Like

That’s weird. I’ve never noticed that before. Haven’t used tags too much either. Could it have something to do with different image dimensions and the tag being applied to the image before the image is resized to fit the tile? Just a thought.

No, because every image in that Tile-set is the exact same dimensions. I process it all with Cloudinary so these are all 2:3 images of the exact same pixel size and quality… regardless of what the user uploads. I constrain and letterbox the images if they’re wider than 2:3, all those pages of text are images processed from Cloudinary so they’re no different than the image content as far as the Inline List component is concerned.

Mmm. Maybe Mark will have an answer.

2 Likes

I’m looking into it

1 Like

While you’re looking can you also make them (and avatars/captions) clearer and easier to read?

I have raised it with design

2 Likes

:raised_hands:

To be clear @Jason, the issue to me is not so much the different font sizes for longer or shorter strings of text… it’s the fact that some text is getting truncated with those three dots. Some of them with not even with much text compared to much longer strings that aren’t being truncated at all.

Found the bug. It’s caused by a rendering error in safaris handling of all-small-caps. It will roll out on a future release.

1 Like

Ah, that make sense, because the three dots weren’t rendering when visiting on my windows desktop.