featured

This article is a stub. You can help the IndieWeb wiki by expanding it.

featured is a proposed mf2 property (typically as u-featured) for h-entry that indicates a representative image for a post.

Why

To indicate which image (among many potentially) should be used in summaries or other link-preview use-cases for a post.

How

Add the class name "u-featured" to the <img> tag that you want used as the featured image for your post.

IndieWeb Examples

Ryan Barrett

Ryan Barrett uses u-featured occasionally on articles on https://snarfed.org/, since 2014-09-23:

https://snarfed.org/2014-09-23_brooke
- uses u-featured on an <img> tag inside the h-entry

Kartik Prabhu

Kartik Prabhu on all articles on https://kartikprabhu.com/ uses "u-featured" on thumbnail images since sometime in 2015-??-??.

need permalink to first usage
retro-actively enabled on https://kartikprabhu.com/article/streets-india a post dated 2009-12-15 imported from old Blogger blog.

Michael Bishop

Michael Bishop on all articles at https://miklb.com uses u-featured for featured images inserted with the WordPress featured image feature. Since 2017. Wrote a little how-to accomplish with template tag or filter.

by its nature, retro-actively applied the class to all WP featured images.

Marty McGuire

Marty McGuire on events on https://martymcgui.re/, since 2016-11-02:

https://martymcgui.re/2016/11/02/215844/
- uses u-featured on an <img> tag inside the h-entry

Chris Aldrich

Chris Aldrich on all articles at http://boffosocko.com with WordPress Post Thumbnails/Featured Images (retroactively since 4/25/17); also used selectively on posts since ~2/2017

Example: 2018-02-08 Chris Aldrich: A better way to subscribe to or follow sites on the open web (archived)

Jacky Alcine

Jacky Alciné uses u-featured on his representative h-card at https://jacky.wtf/about to show that the selected photo is the preferred one to be used.

epoch

epoch uses u-featured on his representative h-card at https://thebackupbox.net/~epoch to designate the selected as a banner_image

IndieWeb wiki

The Template:featured can be used to put a class=u-featured image on a page, e.g.:

The Lazarus Corporation

Paul Watson uses u-featured on an <img> tag inside the h-entry on the banner images for his blog posts since September 2024:

Example: 2024-10-15 Paul Watson: Collective joy and collective ownership of ritual

Services

Bridgy

Bridgy Publish will detect a 'u-featured' photo in the absence of any 'u-photo' and use it, e.g. in a POSSE tweet since 2017-04-11.
Bridgy Fed uses u-featured to set the header image on the fediverse. See: https://fed.brid.gy/docs#profile

Brainstorming

More Use-cases

There has been thinking, starting in December 2018, that featured is an image that represents a post, regardless of the content of the post (beyond the banner image or first inset image in an article). Examples:

cover art for an audio podcast post
preferred photo to show-first (and in link-previews) for a multi-photo
thumbnail or album thumbnail / thumbnail grid for a multi-photo
video thumbnail for a video

Featured Images in Feeds

There’s at least one recommendation to use RSS’s <enclosure /> element for feature images in RSS items.

2012-08-30 Add Featured Images as Enclosures to Posts in WordPress RSS Feeds

Example: <enclosure url="https://example.com/featured.jpg" type="image/jpeg" />

And one to use Atom’s <image>…</image> element for featured images for Atom entries

https://wordpress.stackexchange.com/questions/303704/adding-a-featured-image-to-atom-feed

Example: <image>https://example.com/featured.jpg</image>

It’s unknown if there are any consuming applications that parse these as expected and support displaying them as featured images. If folks can add specific examples (and perhaps screenshots) then we can move this to "How to"