首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

网站SEO优化:Meta标签如何书写?Vue项目怎么优化Meta标签

/shareicons/cloud.png"> [腾讯云官网] og标签全称是...用处最多就是当用户使用百度分享等分享类插件工具,将网页分享到微博或者 facebook、twitter 时候,SNS 网站内容就是按照我们 OG 协议属性规定内容呈现,以此保证信息分享更准确更符合作者所想...更简单理解就是分享时候外链卡片显示…… 比如:QQ就是参考OGog:image属性设置图片 image.png 现在越来越多搜索引擎,也支持og(e.g....百度2015年支持爬取og标签)。 Vue项目优化 现在我们看看Vue项目优化,因为Vue项目使用单页进行开发。...就使用完成,路由内添加即可: [Demo] 效果验收: [最终效果] 至于og属性,你可以参考官网进行自定义,比如这里自定义一个ogimageog:url,全局VueX内添加: [添加] 之后到修改脚手架内内容

3K53

如何给网站添加Web Bookmark

当然 Twitter 也支持 OG 协议OG协议存在于页面meta标签,这些 meta 标签声明就是为了便于其他站点爬虫抓取有效信息用。...这里我们就需要使用OG协议来在网站添加关键信息,其实也就是meta标签添加信息。 Open Graph Protocol 这里总结下比较常用OG协议配置。...以下提到所有配置都是需要放在meta标签。 最基本配置共有四个,也是每个页面所需。四个必须配置分别是: og:title - 卡片中显示网站标题。...og:type - 网站类型,可以进行指定。 og:image - 图像URL,用来卡片中展示。 og:url - 指定URL,作为卡片本身永久ID。...og:image:secure_url - 如果网页需要HTTPS,可以使用另一个URLog:image:type - 该图片MIME类型。

1.4K10
您找到你想要的搜索结果了吗?
是的
没有找到

如何给网站添加Web Bookmark

Open Graph Protocol,简称 OG 协议,它是由 Facebook 2010年首次被提出一种网页元信息标记协议,是一种为社交分享而生协议。...当然 Twitter 也支持 OG 协议OG协议存在于页面meta标签,这些 meta 标签声明就是为了便于其他站点爬虫抓取有效信息用。...这里我们就需要使用OG协议来在网站添加关键信息,其实也就是meta标签添加信息。 Open Graph Protocol 这里总结下比较常用OG协议配置。...以下提到所有配置都是需要放在meta标签。 最基本配置共有四个,也是每个页面所需。四个必须配置分别是: og:title - 卡片中显示网站标题。...og:image:secure_url - 如果网页需要HTTPS,可以使用另一个URLog:image:type - 该图片MIME类型。

94150

个人博客建设——Hexo主题icarus_config.icarus.yml配置参数注释

于是乎我又准备重新建一个项目,并在其基础上更换一套新模板,并与Typore.md文件进行使用尝试,近期这几篇可能就是这个系列来进行了。...正文 本篇用于记录我Hexo个人博客中使用icarus主题中配置文件,为了方便使用该主题小伙伴们进行配置,我根据该主题提供一些说明进行整理到了配置文件,方便英语弱小伙伴使用。.../ # 封面地址 (og:image) (可选) # 你应该在大部分时间里把这个空着 image: https://gitee.com/cnhuashao...# Facebook App ID fb_app_id: # 页面的结构化数据 # https://developers.google.com/search/docs/...# _config.post.yml配置对所有文章生效,而_config.page.yml配置对所有自定义页面生效。 # 这两个文件将覆盖主题配置文件配置。

72330

优化property=og标签,让你网站在搜索引擎面前更优雅

property=og 标签是一种开放内容协议(Open Graph Protocol)标签,它可以让网页成为一个“富媒体对象”,并被其他社会化网站如Facebook、百度、谷歌等引用和展示。...property=og 标签使用方法是, 添加 形式,其中 xxx 表示属性名,yyy 表示属性值。...帮助您内容更有效SNS网络传播; Meta Property=og 主要标签属性 og:title 网页标题 og:type 网页类型(常用值:article 、book 、movie 、video... 、website) og:image 网页主要图片 og:author 作者名称 og:url 网页地址 og:release_date 发布时间 og:description 网页简介 og:...=og标签注意 一个网页可以重复使用同样 property=og 标签,但要用 og:type 标签将其分割,表示不同内容段落。

1.2K40

WordPress SEO优化:添加OG协议标签

翻看一些主流网址网页源代码, HTTP 头部经常能看到一些 og:type、og:title、og:image meta 标签。这些 OG 是什么东西?有什么用?...这些 OG 是开放内容协议(Open Graph Protocol)简称,由 Facebook 2010 年后公布,目前已有百度、谷歌、YouTube 和推特等主流搜索引擎或社交网站支持,是非常好...标签IDog:price //产品价格og:nick //店铺名og:postfee //运费要注意两点第一点:一个网页可以重复同样 meta 标签,一般使用 og:type 标签将其分割,也就是..., WordPress 方面,一般首页、列表页会使用 website 文章页一般用 article 下面是具体例子:网站首页、列表页:<meta property="<em>og</em>:type" content=...添加 OG 协议标签,常见插件一般是 Yoast SEO 或者 The SEO Framework(The SEO Framework 性能比较好,带有缓存功能)如何使用纯代码添加呢?

91300

#Crystals #nft.storage #ipfs

image.png image.png OG:CRYSTAL Crystals 系列 NFT 包含10301种独特 NFT 藏品。NFT 每次从其他收藏家处购买时都会发生变化和增长。...image.png 小杜 成长为一个待出售 Crystal 总共要经历六个步骤~ # 01 获取种子 当通过一级市场获得 OG:Crystal 时,收藏家将获得一颗“种子”。...# 04 形态生长 当目标 OG:Crystal 再次出售时,又会在前两个结构添加另一个新结构。对于每笔交易,产生不寻常和无法控制稀有特征可能性都会增加。...# 06 封藏并产生社会价值 所出售 “种子” 会确保这些非凡 OG:Crystals 每一个都将组合成一个单一公共艺术品。...image.png NFT.Storage NFT.Storage 官网详解了运用 IPFS 存储 NFT 思路,有 NFT 藏品存储需求的藏家可以上手尝试~ NFT.Storage 提供将大型目录拖放到

67230

详谈WordPress 360&百度搜索引擎展现出图策略

随着权重稳定,百度出图率也提升了很多。今天就来聊一聊百度收录提交和搜索引擎出图个人部分见解。区别于百度出图佛系,360则有具体细则说明。并给出了适配规范。至于搜狗应该也是蛮佛系吧。...智能摘要可以帮助网站在搜索结果展现更丰富,带来更多点击。需要提供网站结构化数据,在网站页面插入相应协议标签但需要依据站点模板进行适配。...--选填--> <meta property="<em>og</em>:video" content="视频播放地址,若是更新<em>中</em><em>的</em>电视剧...比如钻芒博客,在前端页面<em>中</em>插入博客类型<em>的</em>摘要<em>标签</em>规范。那么360<em>的</em>蜘蛛抓取<em>的</em>时候就方便取到相关<em>的</em>信息。从而更有利于展现出图及展现拓展。效果预览如下:图片但是这里也是有一些定义条件<em>的</em>。...:页面访问不稳定、死链、失效,站点质量差,提交<em>的</em><em>标签</em>内容错误,<em>标签</em>信息与页面相关性较差等情况一个站点,一种类型,提交一个预览页面地址即可,提交预览<em>的</em>页面必须是已经正确插入协议<em>标签</em><em>的</em>内容页,请勿重复提交,

1.1K20

「译」无处不在微浏览器

Facebook 和 Twitter 早在十多年前就开始帖子中使用这个技术了。那也是最早使用案例。...事实上,新用户将会被认为是“直接”流量 —— 就好像他们是通过键入 url 来访问网站一样。 其次,微浏览器无法使用高级网络算法。...例如,iMessage 决定渲染什么之前会找出并加载所有的 网站图标,所有的 <meta property="<em>og</em>:<em>image</em>" 图片,以及所有的 <meta name...如果没有 OG 和 twitter card 标签,那么将使用默认 SEO <meta name=“description”。...图片 6:亚马逊使用用户代理检测,这导致许多链接预览使用是用于描述 meta 标签使用 <meta property="<em>og</em>:video* 来达到渐进式(而不是流式)<em>的</em>视频体验。

73010

H5 打开 App 并跳转指定页(AndroidiOS)最 low 实现

Google 大白话意思就是,根据你指定某种规则去执行特定某些操作。 例如,此例子,支持外部通过打开 URL(例如:com.test.app://topic?... intent-filter ,包含如下三个属性: android:icon:表示父 Activity、服务或广播接收器图标,将该组件以具备过滤器所描述功能形式呈现给用户时显示。...将相应组件以具备过滤器所描述功能形式呈现给用户时,将使用标签(而不是父组件设置标签)。默认值为父组件设置标签。...默认值为 0 在过滤器必须包含以下属性: action: name 属性,声明接受 Intent 操作。例如这个例子我们通过隐式启动了我们目标 Activity。...以及如下可选参数: category: name 属性,声明接受 Intent 类别。例如这个例子我们设置了默认支持浏览器打开该页面。

8.7K31
领券