enable adding default meta tags

[ndrezn]

Dash applications have a default title ("Dash") but no other default <meta> tags. You can add those tags using the builtin component: https://dash.plotly.com/dash-html-components/meta

But, would be great to have some general meta tags (an image, description maybe?) added by default to every Dash app. This way... they look great out-of-the-box when they're shared! Plausibly we could add some first-class API for meta tags? like, app.config(description=...)?

[alexcjohnson]

We do have a meta_tags constructor arg https://dash.plotly.com/external-resources#overriding-default-tags

What default tags would you propose?

[alexcjohnson]

Also if you're using pages, there's include_pages_meta

[ndrezn]

Maybe a default og:image only, where the image is a Plotly banner (something we can host on Prismic?)

An og:description would maybe be trickier to generalize well, but would also be good. I think most Dash developers just won't realize that they can/should/how to set meta tags, which means many shared on Twitter, LinkedIn, etc. look pretty sloppy.

[alexcjohnson]

See also https://github.com/plotly/dash/issues/2536 which in retrospect I'm not sure we ever fully addressed.

[AnnMarieW]

If people aren't using Pages, it would be nice to specify:

app.title='...'
app.description='...'
app.image='...'

Then it would build the meta tags like Pages does here

Providing defaults could be tricky though. For the image, it might be better if it was something generic and not associated with the Plotly brand?

Once # 2536 is addressed, I could do the PR if you like :slightly_smiling_face:

[ndrezn]

@AnnMarieW love that API!

Just a note, I see this like an extension to our default title & favicon (which we've provided for ages...)

I wonder, @jingningzhang1 -- do you have any ideas for a default image meta which isn't super brand-focused but conveys... "dashboard"?

[antonymilne]

I guess I probably inspired the creation of this issue from my comments in https://github.com/mckinsey/vizro/issues/176, so just to add my bit... 🙂

It's not a big deal at all, but to me it feels a little odd that Dash() exposes many possible arguments but does not include description and image, when these are included in dash.register_page. The meta_tags argument makes it possible to achieve the same functionality, but the higher-level description and image interface provided by Dash pages (plus automatic image discovery) is definitely easier to use. Probably most people aren't even aware that you can set meta tags to do these things (I certainly wasn't until @AnnMarieW showed it in the linked issue) and so wouldn't think of doing it if the description/image arguments didn't exist to prompt them. As an alternative, maybe just some docs pointing out you can do this would be nice.

As for defaults, I think just not including a description is fine."og:title" presumably just takes app.title. I'd suggest that making "og:image" a Plotly branded image is actually very consistent with the default favicon which (I think?) is the plotly logo - so whatever the right sized version of that is would make sense to me. But no strong feelings.

Slightly off-topic, so not wanting to derail things, but since it was mentioned already... Actually it would be nice if the favicon could be made part of the public API (currently it's all done in self._favicon). If the changes suggested here were made then I think this would feel consistent if favicon were also exposed as a public argument. But if you don't want to add too much public interface then I totally understand 🙂

I'd also be very interested in finding out if #2536 is fully resolved.

[jingningzhang1]

@AnnMarieW love that API!

Just a note, I see this like an extension to our default title & favicon (which we've provided for ages...)

I wonder, @jingningzhang1 -- do you have any ideas for a default image meta which isn't super brand-focused but conveys... "dashboard"?

@ndrezn @alexcjohnson @Coding-with-Adam would it be possible to have the meta image be the default state that an app loads in? e.g. this app https://hyperion-analytics-7b00dad124d2.herokuapp.com/ has the default meta image below:

[Coding-with-Adam]

hi @jingningzhang1 Alex and I talked about this. It's not the best way to move forward. We could probably build this capability but it's pretty complex and would take a lot of time. We would need to make a service that goes to the app and figures out what it looks like and saves the image of the app -- all done automatically.

[AnnMarieW]

As of this PR there is now an app.description https://github.com/plotly/dash/pull/2826

It currently applies only when use_pages=True but it could also be used to create meta tags for single page apps as well.