ow

WebVue/index.html

@@ -1,10 +1,27 @@
 <!doctype html>
-<html lang="en">
+<html lang="zh-CN">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/youjia.svg" />
+    <!--
+      这里的信息决定「浏览器标签页」和「微信收藏 / 转发卡片」长什么样：
+      卡片标题取 document.title（本文的 <title>，之后由 src/App.vue 按路由 meta 覆盖），
+      卡片副标题取 description，图标取 icon（微信不认 svg，所以用 png 的 logo）。
+      微信会缓存卡片信息：换过文案/图标后把下面的 ?v= 递增一位，促使它重新抓取。
+    -->
+    <link rel="icon" type="image/png" href="/images/logo.png?v=2" />
+    <link rel="shortcut icon" href="/images/logo.png?v=2" />
+    <link rel="apple-touch-icon" href="/images/logo.png?v=2" />
+    <!-- 手机把本站「添加到主屏幕」时的名称 -->
+    <meta name="apple-mobile-web-app-title" content="有家相册" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title></title>
+    <title>有家相册</title>
+    <meta name="description" content="欢迎回家，记录温暖瞬间" />
+    <meta property="og:type" content="website" />
+    <meta property="og:site_name" content="有家相册" />
+    <meta property="og:title" content="有家相册" />
+    <meta property="og:description" content="欢迎回家，记录温暖瞬间" />
+    <!-- 转发到聊天的大图卡片用它：512×512（微信要求不小于 300×300），由品牌 svg 矢量渲染而来 -->
+    <meta property="og:image" content="/images/logo-512.png?v=2" />
   </head>
   <body>
     <div id="app"></div>