Enhance opengraph rich preview for changeset, relation, way, node, user pages

[claudiush]

Reason:
Changeset, relation, way and node pages are regularly shared on IM and social media channels to discuss, promote or brag about OSM contributions. Right now all of these pages use the same variable "layouts.intro_text" for the OpenGraph description meta tag og:description which is just a general OSM project description: OpenStreetMap is a map of the world, created by people like you and free to use under an open licence.
See example rich preview for a changeset (and card rendering preview for IM and social media types): https://richpreview.com/?url=https%3A%2F%2Fwww.openstreetmap.org%2Frelation%2F36970
Some prerequisites/observations:

• Page type and IDs/names are already represented in the page title.
• Rich previews work best for descriptions below 50 characters.
• The relating code currently resides in openstreetmap-website/app/helpers/open_graph_helper.rb

Proposal:
Description field should describe/represent the page's content.
Change og:description for detail page types on openstreetmap.org:

• Changeset: <changeset_description_cropped_to_50_characters> by <osm_username> on <changeset_timestamp>
• Relation: <relation_name> - <member_count> members - Last changed: <last_updated_timestamp> (If relation doesn't have a name use type instead for <relation_name>)
• Way: <way_name> - <node_count> nodes - Last changed: <last_updated_timestamp> (If way doesn't have a name either omit completely or alternatively show key:value for popular top level keys, like highway=, amenity=, waterway=*)
• Node: <node_name> - Location: - Last changed: <last_updated_timestamp> (Same comment as for way names should apply here as well)
• User: <changeset_count> changes, last <last_changeset_timestamp> - <track_count> tracks - <blog_count> blogs

NB: The OpenGraph description should remain as is (layouts.intro_text) for all other pages

[mmd-osm]

Just wanted to mention that some points in your proposal are affected by proposed changes for GDPR: https://wiki.openstreetmap.org/wiki/GDPR/Affected_Services

Especially for changeset, this may cause some strange side effect: you will still see all details as long as you're authenticated, and a forbidden message otherwise. Sharing such a "forbidden" link on Twitter isn't exactly what people expect.

Somehow this OpenGraph topic slipped under the radar...

[sfkeller]

Not sure if this relates to this issue and patch. But in any case I'd propose to add Social Media meta tags in the HTML head section, in order to show a map preview at appropriate zoom level when mentioning OSM in Social Media, like here (where the Twitter card/image obviously is missing): https://twitter.com/sfkeller/status/1249388633838309377

[1ec5]

Currently the same code sets the Open Graph meta tags for every page, regardless of the view:

openstreetmap-website/app/helpers/open_graph_helper.rb

Lines 3 to 11 in 466de96

	tags = {
	"og:site_name" => t("layouts.project_name.title"),
	"og:title" => [title, t("layouts.project_name.title")].compact.join(" | "),
	"og:type" => "website",
	"og:image" => image_url("osm_logo_256.png", :protocol => "http"),
	"og:image:secure_url" => image_url("osm_logo_256.png", :protocol => "https"),
	"og:url" => url_for(:only_path => false),
	"og:description" => t("layouts.intro_text")
	}

The Open Graph Protocol specification describes an article namespace that would be useful for diary posts as long as og:type is set to article. Diary posts should also have og:locale set to the post’s language. I suppose changesets could be articles as well, with article:published_time and article:modified_time corresponding to the changeset’s opened and closed timestamps.

Especially for changeset, this may cause some strange side effect: you will still see all details as long as you're authenticated, and a forbidden message otherwise. Sharing such a "forbidden" link on Twitter isn't exactly what people expect.

I think this would only be relevant to changesets in the proposal above. The user and diary post views should be unaffected, because the user name is part of the URL anyways.