Improve SEO with meta tags

technoph1le · technoph1le · commit e4ac06c5ba91 · 2025-02-20T19:10:54.000+02:00
diff --git a/cspell-dict.txt b/cspell-dict.txt
@@ -2,4 +2,7 @@ quicksnip
 slugified
 slugifyed
 sublanguage
-fastapi
+fastapi
+Technophile
+technophile
+technophileyt
diff --git a/index.html b/index.html
@@ -2,6 +2,46 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <!-- SEO Meta Tags -->
+    <meta
+      name="description"
+      content="QuickSnip - An open-source project that categorizes handy code snippets across various programming languages. Powered by an awesome community."
+    />
+    <meta
+      name="keywords"
+      content="QuickSnip, code snippets, snippet manager, developer tools, programming, coding"
+    />
+    <meta name="author" content="Technophile" />
+
+    <!-- Open Graph (OG) Meta Tags for Social Media -->
+    <meta property="og:title" content="QuickSnip - Code Snippet Manager" />
+    <meta
+      property="og:description"
+      content="QuickSnip helps you organize, search, and manage your code snippets efficiently."
+    />
+    <meta
+      property="og:image"
+      content="https://github.com/technoph1le/quicksnip/blob/main/public/preview.png?raw=true"
+    />
+    <meta property="og:url" content="https://quicksnip.dev/" />
+    <meta property="og:type" content="website" />
+
+    <!-- Twitter Card for better link previews -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="QuickSnip - Code Snippet Manager" />
+    <meta
+      name="twitter:description"
+      content="QuickSnip helps you organize, search, and manage your code snippets efficiently."
+    />
+    <meta
+      name="twitter:image"
+      content="https://github.com/technoph1le/quicksnip/blob/main/public/preview.png?raw=true"
+    />
+    <meta name="twitter:site" content="@technoph1leyt" />
+
+    <!-- Favicon -->
     <link
       rel="apple-touch-icon"
       sizes="180x180"
@@ -20,8 +60,11 @@
       href="/favicon/favicon-16x16.png"
     />
     <link rel="manifest" href="/site.webmanifest" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>QuickSnip</title>
+
+    <!-- Canonical URL (Avoid duplicate content issues) -->
+    <link rel="canonical" href="https://quicksnip.dev/" />
+
+    <title>QuickSnip - Code Snippet Manager</title>
   </head>
   <body>
     <div id="root" role="presentation"></div>
diff --git a/public/preview.png b/public/preview.png
diff --git a/src/styles/main.css b/src/styles/main.css
@@ -684,7 +684,7 @@ abbr {
   max-height: 90vh;
   overflow-y: auto;
   overflow-x: hidden;
-  padding-right: 0.5rem;
+  padding: 0.5rem;
   align-content: start;
 }
 

Original file line number	Diff line number	Diff line change
`@@ -684,7 +684,7 @@ abbr {`
`684`	`684`	`max-height: 90vh;`
`685`	`685`	`overflow-y: auto;`
`686`	`686`	`overflow-x: hidden;`
`687`		`- padding-right: 0.5rem;`
	`687`	`+ padding: 0.5rem;`
`688`	`688`	`align-content: start;`
`689`	`689`	`}`
`690`	`690`