diff --git a/index.html b/index.html
index 1d33f5ce..bc120caf 100644
--- a/index.html
+++ b/index.html
@@ -1,53 +1,80 @@
 <!DOCTYPE html>
 <html lang="he">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta name="Open-Bus" content="Open Bus web app" />
-    <link rel="apple-touch-icon" href="logo192.png" />
-    <link rel="manifest" href="manifest.json" />
-    <title>Open Bus</title>
-    <style>
-      .preloader {
-        width: 80px;
-        height: 80px;
-        border: 2px solid #f3f3f3;
-        border-top: 3px solid #f25a41;
-        border-radius: 100%;
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        margin: auto;
-        animation: spin 1s infinite linear;
-      }
 
-      @keyframes spin {
-        from {
-          transform: rotate(0deg);
-        }
-        to {
-          transform: rotate(360deg);
-        }
+<head>
+  <meta charset="utf-8" />
+  <link rel="icon" href="favicon.ico" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="theme-color" content="#000000" />
+  <meta name="Open-Bus" content="Open Bus web app" />
+  <link rel="apple-touch-icon" href="logo192.png" />
+  <link rel="manifest" href="manifest.json" />
+
+  <!-- Primary Meta Tags -->
+  <title>דאטאבוס</title>
+  <meta name="title" content='דאטאבוס - נתוני ביצוע לתחב"צ הישראלי' />
+  <meta name="description"
+    content="אתר דאטאבוס מציג נתונים על איכות קווי התחבורה הציבורית בארץ, מתוך מקורות מידע ממשלתיים, במטרה להביא תמונת מצב על תפקוד התחבורה הציבורית בארץ." />
+
+  <!-- Open Graph / Facebook -->
+  <meta property="og:type" content="website" />
+  <meta property="og:url" content="https://www.facebook.com/hasadna.org.il/" />
+  <meta property="og:title" content='דאטאבוס - נתוני ביצוע לתחב"צ הישראלי' />
+  <meta property="og:description"
+    content="אתר דאטאבוס מציג נתונים על איכות קווי התחבורה הציבורית בארץ, מתוך מקורות מידע ממשלתיים, במטרה להביא תמונת מצב על תפקוד התחבורה הציבורית בארץ." />
+  <meta property="og:image" content="social-image.png" />
+
+  <!-- Twitter -->
+  <meta property="twitter:card" content="summary_large_image" />
+  <meta property="twitter:url" content="https://x.com/hasadna" />
+  <meta property="twitter:title" content='דאטאבוס - נתוני ביצוע לתחב"צ הישראלי' />
+  <meta property="twitter:description"
+    content="אתר דאטאבוס מציג נתונים על איכות קווי התחבורה הציבורית בארץ, מתוך מקורות מידע ממשלתיים, במטרה להביא תמונת מצב על תפקוד התחבורה הציבורית בארץ." />
+  <meta property="twitter:image" content="social-image.png" />
+
+  <style>
+    .preloader {
+      width: 80px;
+      height: 80px;
+      border: 2px solid #f3f3f3;
+      border-top: 3px solid #f25a41;
+      border-radius: 100%;
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      margin: auto;
+      animation: spin 1s infinite linear;
+    }
+
+    @keyframes spin {
+      from {
+        transform: rotate(0deg);
       }
-      .preloader-bus {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        font-size: 25px;
-        transform: translate(-50%, -50%);
+
+      to {
+        transform: rotate(360deg);
       }
-    </style>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root">
-      <div class="preloader-bus">🚌</div>
-      <div class="preloader"></div>
-    </div>
-    <script type="module" src="/src/index.tsx"></script>
-  </body>
-</html>
+    }
+
+    .preloader-bus {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      font-size: 25px;
+      transform: translate(-50%, -50%);
+    }
+  </style>
+</head>
+
+<body>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <div id="root">
+    <div class="preloader-bus">🚌</div>
+    <div class="preloader"></div>
+  </div>
+  <script type="module" src="/src/index.tsx"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/public/social-image.png b/public/social-image.png
new file mode 100644
index 00000000..e07cf882
Binary files /dev/null and b/public/social-image.png differ
