chore: static og image and better og description

Author: canerakdas

src/generators/web/template.html

@@ -8,9 +8,10 @@
   <title>{{title}}</title>
   <meta name="description" content="Node.js® is a free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts.">
   <link rel="stylesheet" href="styles.css" />
-  <meta property="og:title" content="{{title}}">
-  <meta property="og:description" content="Node.js® is a free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts.">
-  <meta property="og:image" content="https://nodejs.org/en/next-data/og/announcement/{{ogTitle}}" />
+  <meta property="og:title" content="{{ogTitle}}">
+  <meta property="og:description" content="{{ogDescription}}">
+  <meta property="og:image" content="https://nodejs.org/en/next-data/og/announcement/Node.js%20%E2%80%94%20Run%20JavaScript%20Everywhere" />
+  <meta property="og:type" content="website">
 
   <link rel="preconnect" href="https://fonts.googleapis.com" />
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

src/generators/web/utils/processing.mjs

@@ -112,6 +112,7 @@ export async function processJSXEntries(
   const results = entries.map(({ data: { api, heading } }) => {
     const fileName = `${api}.js`;
     const title = `${heading.data.name} | ${titleSuffix}`;
+    const description = `Documentation for ${heading.data.name} in Node.js v${version.version}`;
 
     // Replace template placeholders with actual content
     const renderedHtml = template
@@ -120,7 +121,8 @@ export async function processJSXEntries(
       .replace('{{importMap}}', clientBundle.importMap ?? '')
       .replace('{{entrypoint}}', `./${fileName}?${randomUUID()}`)
       .replace('{{speculationRules}}', SPECULATION_RULES)
-      .replace('{{ogTitle}}', encodeURIComponent(title));
+      .replace('{{ogTitle}}', title)
+      .replace('{{ogDescription}}', description);
 
     // Minify HTML (input must be a Buffer)
     const finalHTMLBuffer = HTMLMinifier.minify(Buffer.from(renderedHtml), {});