Add social preview image (og:image) for link sharing

Author: ttingchen

assets/og-image.png

@@ -19,11 +19,16 @@
 <meta property="og:title" content="Wine Explorer — Interactive Guide to Notable Wines & Grape Varieties">
 <meta property="og:description" content="Explore notable wines and grape varieties interactively: body, tannin, sweetness, key flavors and regions, plus a built-in quiz.">
 <meta property="og:url" content="https://ttingchen.github.io/wine-learning/">
+<meta property="og:image" content="https://ttingchen.github.io/wine-learning/assets/og-image.png">
+<meta property="og:image:width" content="1200">
+<meta property="og:image:height" content="630">
+<meta property="og:image:alt" content="Wine Explorer — interactive guide to notable wines and grape varieties">
 
 <!-- Twitter / X card -->
-<meta name="twitter:card" content="summary">
+<meta name="twitter:card" content="summary_large_image">
 <meta name="twitter:title" content="Wine Explorer — Interactive Guide to Notable Wines & Grape Varieties">
 <meta name="twitter:description" content="Explore notable wines and grape varieties interactively: body, tannin, sweetness, key flavors and regions, plus a built-in quiz.">
+<meta name="twitter:image" content="https://ttingchen.github.io/wine-learning/assets/og-image.png">
 
 <!-- Structured data: help search engines understand the page -->
 <script type="application/ld+json">