Update format of page <title> tag

[eric-schneider]

The Marketing team suggested that we update the format of the <title> tag for pages on the docs site. The goal is to make the titles more descriptive and useful when they appear in Google search results.

Currently, the page <title> tag is constructed as follows:

    <title>PAGE TITLE :: SITE TITLE</title>

• PAGE TITLE - the AsciiDoc page title (value following single = at the top of each adoc page)
• Two colons ::
• SITE TITLE - the Antora site title (site.title key in the playbook)

Marketing recommends the following format:

    <title>PAGE TITLE | COMPONENT TITLE | SITE TITLE</title>

• Adds the name of the component (product name) in which the page resides.
• Replaces the two colons with a vertical bar |.

Additional requirements

Marketing had some additional suggestions:

1. If the page title already contains the component title, then we should not include component title in the <title> tag.

   • If possible, we should try and implement a matching rule that looks for the component title within the page title, and if true, either removes or supresses the component title from the <title> tag of the page.
   • Currently, the titles of our landing pages are the same as the component titles. So if we can't implement the above solution, then we should try to at least remove the component title from the <title> tag of landing pages, specifically.

2. (DEFERRED - will open a separate issue for this in the future) In some cases, a component title might not be well-known or descriptive enough for all users. For example, some users may not know that Starlight for Kafka falls under the umbrella of "Streaming".

   • We should maybe look into whether it's possible to customize the format of the <title> tag for specific components. For example:

         <title>PAGE TITLE | COMPONENT TITLE | Streaming | SITE TITLE</title>

3. Apparently, studies show that click-through rate is higher for search results that are in title case (we use sentence case).

   • After some light searching, it doesn't seem to be common practice for documentation websites to use different cases for the <title> tag vs <h1>. Therefore, I think we should set aside this recommendation for the time being.

Algolia considerations

We need to look into why Algolia is presenting generic page titles in search analytics. It may be related to the page title tag. For more info, see the following Slack thread: https://datastax.slack.com/archives/C04B8E5LQ7L/p1710778039481909

[eric-schneider]

CC @stephan1echung for visibility

[eric-schneider]

@colegoldsmith @mlr I assigned this to both of you since I think this might need modifications in the UI and the build. We should probably implement this enhancement at the same time we launch the unified site.