meta property=og标签含义及作用

最新推荐文章于 2023-06-28 10:22:56 发布
最新推荐文章于 2023-06-28 10:22:56 发布
阅读量940 收藏
点赞数

MetaProperty=og标签是什么呢?

　　og是一种新的HTTP头部标记，即OpenGraph Protocol：

　　The OpenGraph Protocol enablesany web page to become a rich object in a socialgraph. 

　　即这种协议可以让网页成为一个“富媒体对象”。

　　用了MetaProperty=og标签，就是你同意了网页内容可以被其他社会化网站引用等，目前这种协议被SNS网站如Fackbook、renren采用。

　　SNS已经成为网络上的一大热门应用，优质的内容通过分享在好友间迅速传播。为了提高站外内容的传播效率，2010年F8会议上Facebook公布了一套开放内容协议(OpenGraph Protocol)，任何网页只要遵守该协议，SNS就能从页面上提取最有效的信息并呈现给用户。

 

OpenGraph Protocol应用指南

参与到OpenGraph Protocol的好处

　　● 能够正确的分享您的内容到SNS网站

　　● 帮助您的内容更有效的在SNS网络中传播

MetaProperty标签的应用

　　● 按照您网页的类型，在<head>中添加入meta标签,并填上相应的内容

　　● 如果一个页面上有多个需要标识出的内容怎么办？

　　您可以重复meta标签，将认为og:type 标签是每一段内容的起始处，例如：

　　<metaproperty="og:type"content="video"/> 

　　<metaproperty="og:title" content="五月天_突然好想你MV现场版"/>

　　<metaproperty="og:image"content="http://g1.ykimg.com/0100641F464AC21FF0B3ED00F48F151F43D4BF-5F0F-BD39-76EA-E5E20A1887C4"/>

　　<metaproperty="og:url"content="http://v.youku.com/v_show/id_XMTIyMTY5NzMy.html"/> 

　　<metaproperty="og:videosrc"content="http://player.youku.com/player.php/sid/XMTIyMTY5NzMy&isAutoPlay=true/v.swf"/>

　　<metaproperty="og:width" content="500″/> 

　　<metaproperty="og:height" content="416″/> 

　　<metaproperty="og:type"content="video"/> 

　　<metaproperty="og:title" content="五月天_突然好想你MV现场版_AA"/> 

　　<metaproperty="og:image"content="http://g1.ykimg.com/0100641F464AC21FF0B3ED00F48F151F43D4BF-5F0F-BD39-76EA-E5E20A1887C44444"/> 

　　<metaproperty="og:url"content="http://v.youku.com/v_show/id_XMTIyMTY5NzMyyyyyyyyyyyyyyyy.html"/> 

　　<metaproperty="og:videosrc"content="http://player.youku.com/player.php/sid/XXXXXXXXXXXXMTIyMTY5NzMy&isAutoPlay=true/y.swf"/> 

　　<metaproperty="og:width" content="600"/> 

　　<metaproperty="og:height"content="716"/> 

　　● 安装SNS网站插件如人人网插件，同样会出现MetaProperty标签，卸载后可以去除。

 

使用OpenGraph Protocol应注意

　　MetaProperty=og代码的功能并不等同于网页的metaname标签，两者针对的对象不一致，功能不同。

　　如果网站上要使用opengraph protocol，那么，MetaProperty=og和MetaName、Title标签应同时赋值。

　　文章开头举例的B2C网站，<head>如下：

　　<head> 

　　<metahttp-equiv="Content-Type" content="text/html;charset=utf-8"/> 

　　<title>CoolGadgets at the Right Price - Worldwide Free Shipping -******</title> 

　　<metaproperty="og:title" content="**’s Facebook"/> 

　　<metaproperty="og:type"content="product"/> 

　　<metaproperty="og:url" content="http://www.******.com"/> 

　　<metaproperty="og:image"content="http://www.******.com/logo.gif"/> 

　　<metaproperty="og:site_name" content="******.COM"/> 

　　<metaproperty="og:description" content="Cool Gadgets at the Right Price- Worldwide Free Shipping -******"/> 

　　<metaproperty="fb:admins" content="100001422224225"/> 

　　<metaproperty="fb:page_id"content="241333394220"/> 

　　<linkhref="/css/reset.css" rel="stylesheet" type="text/css"/> 

　　<linkhref="/css/default/all.16666.css" rel="stylesheet" type="text/css"/> 

　　<scripttype="text/javascript"src="/shop.js"></script> 

　　<scripttype="text/javascript"src="/scripts/all.16666.build.js"></script> 

　　<metahttp-equiv="Content-Type" content="text/html;charset=utf-8"/> 

　　<metaname="description"content="Online shopping for cool gadgets at the right price. "/> 

　　<metaname="keywords"content="cool gadgets, cheap gadgets, free shipping"/> 

　　</head> 

　　如果你用上了metaproperty标签，你得在后台设置好，不然，就是空白.


OpenGraph Protocol对SEO的影响

　　有些人使用所谓的网站质量在线检测，检测后结果提示MetaProperty=og这段代码有问题，特别是一些SEO的检测，更是提示“特别错误”！然后删除MetaProperty=og代码，检测正常。

　　因此担心MetaProperty=og这段代码会对网站照成不良影响。

　　其实OpenGraph Protocol并不会对SEO照成不良影响，相反，应用的合理，非常有利于网站的推广。

凉川望远
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
meta-grabber::bookmark_tabs:简单的node.js链接预览生成器与cheerio！
05-29
这些元素可能包括`<meta property="og:title">`（Open Graph标题）、`<meta property="og:description">`（Open Graph描述）、`<meta property="og:image">`（Open Graph图像）等。 **Open Graph (OG)**： Open ...
social-tags-webpack-plugin：一个wepback插件，用于生成社交元标签
02-06
社交标签Webpack插件social-tags-webpack-plugin是一个webpack插件，可为Facebook和Twitter生成元标签，如下所示： < meta property =" fb:app_id " content =" 123456789 " ... meta property =" og:title " conten
og标签的参数说明
LueDong的博客
06-28 966
meta property="og:soft:operating_system" content="软件运行的操作系统，如windows、android、ios等"/>url=歌曲播放链接"/>(可以有 多个)(注：1) tv 电视剧；
HTMl中Meta标签详解以及meta property=og标签含义
乔亚菲的博客
11-24 666
meta是用来在HTML文档中模拟HTTP协议的响应头报文。META标签是HTML语言HEAD区的一个辅助性标签，它位于HTML文档头部的标记和标记之间，它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC内容等
常用meta标签总结
weixin_53172312的博客
12-05 177
#常用meta标签总结 charset /charset一定要第一行写，以下两种charset定义方式均可/ 百度禁止转码 百度会自动对网页进行转码，这个标签是禁止百度的自动转码 SEO 优化部分 <!-- 页面标题<title>标签(head 头部必须) --> <title>your title</title> <!-- 页面关键词 keywords --> <meta name="keywords" content="your ke
什么是OG协议？
杨春建的博客
09-12 5271
Meta Property=og标签是什么呢? og是一种新的HTTP头部标记，即Open Graph Protocol： The Open Graph Protocol enables any web page to become a rich object in a social graph. 即这种协议可以让网页成为一个“富媒体对象”。 用了Meta Property=og标签，就是你同意了...
og卡
03-04
无服务器服务，可生成可嵌入到<meta>... meta property =" og:image " content =" http://example.com/logo.jpg " /> </ head > 为什么要使用这项服务？ 简短的答案是，为每个博客文
html-meta-tags
03-04
4. `<meta property="og:*">`: 开放图谱协议，提供社交媒体分享时的预览信息。 三、其他用途的元标签 1. `<meta name="generator">`: 记录页面生成工具，便于识别网页来源。 2. `<meta name="revisit-after">`: ...
seo-social-meta-tags:网站的社交和SEO元标记的完整集合
05-24
1. `<meta property="og:title">`：Open Graph（OG）标题，定义了在Facebook、LinkedIn等平台上分享时显示的标题。 2. `<meta property="og:description">`：OG描述，用于分享时的预览文本。 3. `<meta property=...
标签系列三：spring 中property解释以及property标签里面的属性
热门推荐
xiao1_1bing的博客
07-17 8万+
一、property标签： 英文解释：Bean definitions can have zero or more properties. Property elements correspond to JavaBean setter methods exposed by the bean classes. Spring supports primitives, references to ot...
og属性优化教程，什么是og标签
计算机毕业论文源码，学生个人网页制作html源码。贴近用户做网络推广和互联网优化。
07-02 538
og标签很拉风的样子。 前两天使用一套国外的网站模板，分析网页代码的时候发现了meta信息中出现了property=”og:title”这种新东西。本着存在即合理，既然作者这样设计必定有所意图的，第一反应就是这种写法对于seo优化的影响。所以网上淘了一些资料，结合自己的经验理解将整理一个og属性优化教程，把这些内容页归...
关于网站的meta标签里有property="og:title"
farmerXU的博客
05-13 5232
无意中看到一个人博客网站的源代码meta里面property="og:title"觉得好奇就查了一下； og是一种新的HTTP头部标记，即Open Graph Protocol，这种协议可以让网页成为一个“富媒体对象”。 OG主要标签属性 og:title 标题 og:type 类型 常用值:article book movie og:image 略缩图地址 og:url 页面地址 og:description 页面的简单描述 og:site_name 页面所在网站名 og:videosrc 视频或者F
Struts2标签 数据标签--property标签
皇马啸西风的一亩三分地
09-19 203
  property 标签作用就是输出指定值，property标签输出value属性指定的值，如果没有指定value，则默认输出ValueStack栈顶的值。     该标签有以下属性：     default：可选属性，如果需要输出的属性值为null，则显示default属性指定的值。 escape：可选属性，指定是否escape HTML代码 value：可选属性，指定需要输出的值 i...
记录：s:property 标签——value属性使用事项
wenlele的专栏
10-03 4万+
简单介绍 1）涉及问题：取值时什么时候该加#，什么时候不加？ 2）介绍 Struts2中的property标签 用于获取ognlcontext对象中的属性值，亦称为数据标签。其中value的值为具体的属性名称。 获取值时，一般有两种情况： 1）在获取req
<meta property="og:需要写的标签"的应用
爱笑的天使
01-06 7787
代码： Meta Property=og标签是什么呢? og是一种新的HTTP头部标记，即Open Graph Protocol： The Open Graph Protocol enables any web page to become a rich object in a social graph. 即这种协议可以让网页
Struts 2的property标签的原理
comeandgo201205的专栏
10-07 2719
Struts2中的property标签 是用于取得OgnlContext上下文中的属性值,也称为数据标签 特点是取request/session/application/attr/parameters这五个范围时,需要明确指定范围如: ,记住,范围前面带#号,如果取ValueStack中的值时,是不需要带#的,可以直接取,因为Action中存储在ValueStack中的,所以取Action中
spring 通过property标签给对象添加属性入门
Tomsheng321的专栏
02-02 5170
User.java package cn.itcast.c_property; public class User { private int id; private String name; ////////////////// --> 通过容器注入属性值 public void setId(int id) { this.id = id; } // //--> 通过容
html中的meta标签
最新发布
07-05
HTML中的`<meta>`标签主要用于提供有关网页元数据的信息，这些信息对于搜索引擎优化（SEO）、页面描述、编码类型以及其他浏览器理解和处理网页的重要设置至关重要。`<meta>`标签通常出现在`<head>`元素内部，但并不直接插入到内容流中。 以下是一些常见的`<meta>`标签及其用途： 1. `<meta charset="UTF-8">`: 定义文档的字符编码，如UTF-8，告诉浏览器如何解读网页文本。 2. `<meta name="description" content="...">`: 描述网页的主要内容，有助于搜索引擎确定搜索结果摘要。 3. `<meta name="keywords" content="...">`: 提供一串关键词，用于搜索引擎索引和用户搜索建议。 4. `<meta name="viewport" content="width=device-width, initial-scale=1.0">`: 响应式设计，调整视口宽度适应不同设备屏幕。 5. `<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">`: 同上，用`http-equiv`属性指定字符集。 6. `<meta name="robots" content="index,follow">`: 控制搜索引擎是否抓取（index）和跟随链接（follow）。 7. `<meta property="og:title" content="...">` 和 `<meta property="og:description" content="...">`: Facebook开放图元（Open Graph）规范的一部分，定义分享到社交媒体的标题和摘要。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值