diff --git a/package.json b/package.json
index e082f19..295e158 100644
--- a/package.json
+++ b/package.json
@@ -42,5 +42,14 @@
     "> 1%",
     "last 2 versions",
     "not dead"
-  ]
-}
+  ],
+  "meta": {
+    "title": "luftbilder.berlin.codefor.de",
+    "description": "Luftbilder aus dem Geoportal Berlin",
+    "language": "de",
+    "url": "https://luftbilder.berlin.codefor.de",
+    "image": "https://luftbilder.berlin.codefor.de/screenshot.jpg",
+    "imageAlt": "luftbilder.berlin.codefor.de screenshot",
+    "twitter": "@codeforbe"
+  }
+}
\ No newline at end of file
diff --git a/public/favicon.png b/public/favicon.png
new file mode 100644
index 0000000..a942da5
Binary files /dev/null and b/public/favicon.png differ
diff --git a/public/index.html b/public/index.html
index aed52a2..eabe108 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,8 +4,30 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
+
+    <link rel="icon" href="<%= BASE_URL %>favicon.png">
+
+    <title><%= htmlWebpackPlugin.options.meta.title %></title>
+    <meta name="description" content="<%= htmlWebpackPlugin.options.meta.description %>">
+
+    <meta name="twitter:title" content="<%= htmlWebpackPlugin.options.meta.title %>">
+    <meta name="twitter:description" content="<%= htmlWebpackPlugin.options.meta.description %>">
+    <meta name="twitter:url" content="<%= htmlWebpackPlugin.options.meta.url %>">
+    <meta name="twitter:site" content="<%= htmlWebpackPlugin.options.meta.twitter %>">
+    <meta name="twitter:creator" content="<%= htmlWebpackPlugin.options.meta.twitter %>">
+    <meta name="twitter:image" content="<%= htmlWebpackPlugin.options.meta.image %>">
+    <meta name="twitter:image:alt" content="<%= htmlWebpackPlugin.options.meta.imageAlt %>">
+    <meta name="twitter:card" content="summary_large_image">
+
+    <meta property="og:title" content="<%= htmlWebpackPlugin.options.meta.title %>">
+    <meta property="og:description" content="<%= htmlWebpackPlugin.options.meta.description %>">
+    <meta property="og:url" content="<%= htmlWebpackPlugin.options.meta.url %>">
+    <meta property="og:site_name" content="<%= htmlWebpackPlugin.options.meta.title %>">
+    <meta property="og:locale" content="<%= htmlWebpackPlugin.options.meta.language %>">
+    <meta property="og:image" content="<%= htmlWebpackPlugin.options.meta.image %>">
+    <meta property="og:image:alt" content="<%= htmlWebpackPlugin.options.meta.imageAlt %>">
+    <meta property="og:type" content="website">
+
   </head>
   <body>
     <noscript>
diff --git a/public/screenshot.jpg b/public/screenshot.jpg
new file mode 100644
index 0000000..8279078
Binary files /dev/null and b/public/screenshot.jpg differ
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..42262df
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,10 @@
+module.exports = {
+  chainWebpack: config => {
+  config
+    .plugin('html')
+    .tap(args => {
+        args[0].meta = require('./package.json').meta
+        return args;
+    })
+  }
+}
