refactor(seo): refine metadata (#2517)

inabagumi · Mar 1, 2023 · cb4081d · cb4081d
1 parent 8d4841e
commit cb4081d
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 26 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -5,16 +5,10 @@ import { Analytics } from '@vercel/analytics/react'
 import { type Metadata } from 'next'
 import Link from 'next/link'
 import { type ReactNode } from 'react'
-import cardImage from '@/assets/card.jpg'
 import appleTouchIcon from '@/assets/icons/apple-touch-icon.png'
 import favicon192x192 from '@/assets/icons/favicon-192x192.png'
 import favicon512x512 from '@/assets/icons/favicon-512x512.png'
-import {
-  description,
-  title as siteName,
-  themeColor,
-  twitterAccount
-} from '@/lib/constants'
+import { description, title as siteName, themeColor } from '@/lib/constants'
 import Background from './Background'
 import Menu from './Menu'
 import styles from './layout.module.css'
@@ -38,18 +32,6 @@ export const metadata: Metadata = {
     ]
   },
   metadataBase: new URL(process.env.NEXT_PUBLIC_BASE_URL),
-  openGraph: {
-    description,
-    images: [
-      {
-        height: cardImage.height,
-        url: cardImage.src,
-        width: cardImage.width
-      }
-    ],
-    siteName,
-    type: 'article'
-  },
   robots: {
     follow: true,
     index: true
@@ -59,11 +41,10 @@ export const metadata: Metadata = {
     default: siteName,
     template: `%s - ${siteName}`
   },
-  twitter: {
-    card: 'summary_large_image',
-    site: `@${twitterAccount}`
-  },
-  viewport: 'viewport-fit=cover,width=device-width'
+  viewport: {
+    viewportFit: 'cover',
+    width: 'device-width'
+  }
 }
 
 type Props = {

diff --git a/app/page.tsx b/app/page.tsx
@@ -3,7 +3,7 @@ import { type Metadata } from 'next'
 import Link from 'next/link'
 import cardImage from '@/assets/card.jpg'
 import Logo from '@/assets/vertical-logo.svg'
-import { description, title } from '@/lib/constants'
+import { description, title, twitterAccount } from '@/lib/constants'
 import styles from './page.module.css'
 
 export const metadata: Metadata = {
@@ -19,9 +19,14 @@ export const metadata: Metadata = {
         width: cardImage.width
       }
     ],
-    siteName: title,
+    title,
     type: 'website',
     url: '/'
+  },
+  twitter: {
+    card: 'summary_large_image',
+    site: `@${twitterAccount}`,
+    title
   }
 }