Started a Micro.blog experiment that renders a snapshot of your blog post as an image, which could be used for Open Graph previews or thumbnails in the UI. Not sure the best form this should take when it’s live. Suggestions? If you could have a little thumbnail of any web page, how would you use it?

@manton I admit this is a little harsh and I don’t intend it that way but, it’s one of my pet peeves when people encode text as an image.

Surely there must be a better way to do it that preserves the text, right? That doesn’t introduce all the downsides of converting to image? PDF? Something?

Again, I don’t want to downplay the work you’ve put into this, it’s just one of my pet peeves.

Jason Becker

aarol.dev/posts/hug… this is one of the coolest examples I’ve seen. An image that includes title and some of the styling from the header would be really cool.

Greg Morris

11ty does this but it is far too complicated for me to work out how to use 😂

Paul Robert Lloyd

Oh, please don’t. Share images were originally meant to be included if there was an image to share; now every link has an image, regardless of its usefulness. It’s a symptom of engagement based click-chasing and thus antithetical to the design decisions usually found on Micro.blog.

Manton Reece

@paulrobertlloyd To be clear, I hate the way page previews have taken over social sites. I’m not adding that to the Micro.blog timeline. It’s more about how to improve thumbnails when the generic image that another platform picks is no good. For example, Threads will show a cropped version of the favicon which makes no sense.

Manton Reece

@pratik Could be any posts. This is not a real feature yet, so it’s up for debate.

Numeric Citizen

@pratik this could be an option to include on a per-post basis…

Bryan

Chris Hannah has an app for that, Text Shot.

On this topic, I’d love an Open Graph style preview of links, if not on the timeline, on the blog itself.

Jim Mitchell

I think I get what you’re going for here, but my take is rendering an image of a post for OpenGraph might look worse than a favicon itself when displayed on smaller screens. Maybe an option is to set a default OG image in a Mb site to be used if a post doesn’t already have a leading image, which is what I see in practice on other platforms. Of course if I’m missing it completely, tell me so.

Ivo

@manton Let's say a blog post contains images. This feature could use the first image and overlay the blog title to create a preview image.

For blog post without an image I can only imagine to draw fake text lines like from books in a comic for the content. Titel could be added on top in a nice font.

I would not render the real post itself.

Manton Reece

@jimmitchell Thanks. You’re not missing it, that could be a good approach.

Manton Reece

@volkris I agree, “text as image” is a pet peeve of mine too. This started because of the proliferation of fairly useless web page previews, thinking how that can be improved.

Manton Reece

@jsonbecker Nice, that looks cool.

Mitch Wagner

I like this idea a lot for sharing to Masto, Bluesky and Threads. If a Micro.blog post is titled, the text of the Masto/Bsky/Threads post would be the title, a link, and a thumbnail of the post itself. @jwz does that and I have always liked it.

This method would solve an existing design problem with the current way titled MB posts are syndicated to those services: The Masto/Bsky/Threads post comprises the title, the link and then the link preview shows the title again.

Manton Reece

@MitchW Good point, thanks.

Jim Mitchell

Cool. Of course this is a user chosen image, just like for podcasts.

Mitch Wagner

@volkris I have mixed feelings about “text as image.” Clearly it’s a function of social media siloing—but it often works.

jden :prami:

@manton I think this is a great feature. I’d like some control over what and how is gets screenshotted. But yes this would be great for open graph images.

Matthew Lindfield Seager

May I ask how you’re doing it? Is it like the Hugo example from jsonbecker or are you doing something different?

Reason I ask is that I took a run at generating custom OG images in a Rails app but didn’t manage to get it working satisfactorily… curious to know your high level approach

Gunnar

Great feature!

Manton Reece @manton
Lightbox Image