featured

From IndieWeb
Jump to: navigation, search

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:

Kartik Prabhu

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

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:

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

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.

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.

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

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"

See Also