Comment Presentation

Expansion of a section of the page on comment posts.

How comments are presented, should be, and who is doing what.

Current Indiewebcamp Practices

Automatically:

• Laurent Eschenauer using Storytlr: displays comment posts from the IndieWeb marked up with h-entry and received via pingback, and comments posted locally on his posts, in an integrated time-ordered "Comments" section, e.g.:
  • http://eschnou.com/entry/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html

Manually:

List of links in a post footer section:

• Tom Morris sometimes adds links+favicons to a “this post is discussed further at” section (recent example).
• Tantek sometimes maintains a citation list of posts which link to one of his posts, e.g. http://tantek.com/2013/073/b1/silos-vs-open-social-web#silos-vs-open-social-web-comments

Past Practices

• Tantek used to maintain lists of links to his posts of people’s names linked to comment permalinks:
  • 2002: inline list with flags to represent comment languages
  • 2003: inline list with some text annotations.
  • 2005: block list with follow-ups to comments

Silo Comment Presentation

• Tumblr groups various different response types into a generic “notes” feed, at the bottom of each post (example). They show:
  • The author’s username
  • The author’s profile photo
• Twitter shows all tweets which are both in-reply-to a particular tweet AND contain the original tweeters @name below the tweet metadata in chronological order. They provide a “reply” box above (?) the reply feed (example). The tweets have:
  • The authors name
  • The author’s @name
  • The author’s profile photo
  • A relative timestamp
  • The tweet content
  • A bunch of actions (on hover)
• Facebook treats comments as completely secondary to “full” posts, showing them in chronological order beneath the post’s action bar. Facebook only show the latest ~4 comments if there are more, and display the leave-a-comment box below. They have:
  • The author’s name
  • The author’s profile photo
  • The comment content
  • A relative timestamp
  • 'via mobile' if applicable
  • Like button w/ like counter

Display received comments brainstorm

Note: this is an abstract brainstorm, unimplemented, please take with a grain of salt, and feel free to suggest alternatives or improvements. - Tantek 00:31, 10 April 2013 (PDT)

Goal: display received comments in high fidelity, at least as nicely designed as the comments that are "natively" displayed on blog posts and silo posts (e.g. replies on Twitter posts, comments on Facebook posts, Flickr/Instagram photos, etc.)

Existing displays. Existing blog/silo posts display comments (in either chronological or reverse chronological order) with the following details:

• commenter logo/photo
• commenter name
  • hyperlinked to commenter profile
• full text of comment
• time of comment
  • often in relative time since rather than absolute datetime
    • though see reasons why you should not be displaying relative dates
  • hyperlinked to comment permalink
• commenter location (variable granularity) at time of comment writing
  • hyperlinked to silo aggregation of activity at that location
• like/favorite button (to like or favorite the comment/@-reply)

Therefore at a minimum, any IndieWeb peer-to-peer commenting solution should include at least these pieces of information in a nice design. This information can be retrieved from the reply post.

• parse the h-entry at the reply (first if more than one, seriously, it's supposed to be a permalink)
• if its hyperlink to the original post lacks in-reply-to markup, then add it to the "Related Articles" section in the post footer, otherwise keep going:
• get commenter information
  • if the h-entry has a p-author, use its h-card for:
  • otherwise look for a rel-author and use the representative h-card at that URL for:
    • logo/photo
    • name
    • url (of commenter profile)
• for the text of the comment
  • if the h-entry has a p-summary, use that (useful for longer posts where only a part of it is the comment)
  • otherwise, if it has an e-content
  • otherwise, if it has a p-name, use that
  • if the text of the comment is too long (your site, your judgment), abbreviate it with some intelligent ellipsing code (e.g. see POSSEing an abbreviated note to Twitter for some thinking) and provide a "See more" link to the permalink.
• use its dt-published for the time of the post
  • additionally, its dt-updated could be used for an "edited: datetime" annotation
• use its u-url for the permalink
• use its p-geo / p-latitude / p-longitude for location - you may need to use a service to translate that into a human readable neighborhood / city / state / country name.
  • (Issue: perhaps h-entry could use a p-location property similar to h-event that would permit embedding of an h-adr with structured address information.)

With that information a sufficiently similar comment display should be possible in a "Comments" section in the footer on the original post permalink. Add to that for each comment:

• webaction like/favorite/props button/link

And you've hopefully got a comment display of similar fidelity to anything the silos have.

Note: none of this has been implemented yet - this is merely an outline for an implementation strategy at this point. As soon as any indiewebcamp community member actually implements displaying indieweb comments from other sites on their own site, we should document how they're doing it, and what best practices they've come up with. Such experience will trump any hypothetical brainstorm. - Tantek 00:31, 10 April 2013 (PDT)

Existing specifications for display

Included here for thoroughness / historical purposes - a critique of existing specifications for display.

Summary: Existing specifications either don't say much or provide bad advice for what to display (if anything) in response to receiving a webmention.

WebMention (the specification) does not say what to do with successfully received & verified webmentions.

Pingback (the specification) is very vague and somewhat contradictory. It says things like:

• "include this information on her site"
  • could mean the link, the comment post, a portion thereof?
• "Bob's blogging system then includes a link back to Alice's post on his original post."
  • implying that perhaps only links show-up from pingbacks
• "Reader's [sic] of Bob's article can follow this link to Alice's post to read her opinion."
  • implying that readers can't see Alice's opinion on Bob's article, and have to follow the link to Alice's post to read it. seems a bit inconvenient, and not how comment presentation works on typical blogs, or silo posts.
• the "Conformance Requirements" do not mention any requirement for displaying pingback links or content therefrom on the original post
• in the "Example", it says:

  "Bob's blog also retrieves other data required from the content of Alice's new post, such as the page title, an extract of the page content surrounding the link to Bob's post, any attributes indicating which language the page is in, and so forth.

  "Finally, Bob's post records the pingback in its database, and regenerates the static pages referring to Bob's post so that they mention the pingback."

  emphasis added.

  • This is vague but provides some additional display guidance which is unfortunately not very well thought out and leaves much to be desired:
    • page title - this is odd as typical comments displayed on post pages don't have titles, just comment text.
    • extract of the page content surrounding the link - in practice this is unreadable and unfriendly. It doesn't look at all like a comment and usually has both leading and trailing ellipses making you wonder what the broader context of the comment is.
    • which language the page is in - this could be useful for marking up the display of the comment with a lang attribute, and the link to the comment permalink with the hreflang attribute.

In practice:

Pingback displays are nearly always useless, e.g.

• https://blog.mozilla.org/blog/2013/04/10/gearing-up-for-the-next-chapter/

Problems demonstrated:

• "Pingback from" is jargon - provides no value to the user - only noise
• the title of the comment blog post is useless as it provides a summary of the original blog post
• the [...] ... [...] summary text is nearly unreadable without more context, and doesn't even show what phrase linked to the original blog post
  • in the first pingback, even just including the entire first paragraph of the comment post would have been better.And if it wasn't a reply then it should just be a list of related articles (date, author, linked post name, all marked up with h-cite), rather than including cryptic broken summaries.
• the overall visual design is very dated and has fallen behind modern comment presentation designs