H5手机QQ分享到手Q、QQ空间、微信好友、朋友圈础通用接口

H5手Q分享通用接口代码片段

<meta itemprop="name" content="网页标题">
<meta itemprop="description" content="网页描述">
<meta itemprop="image" content="缩略图">

写在页面head标签中。

这里用到的是结构化资料标签的知识，可以在schema.org深度学习。小不这个半桶水就不深度解说，只分享在QQ和手机上的应用。
经过测试支持PC QQ直接发送链接展现分享卡片和手机QQ分享到手机QQ、QQ空间、微信、微信朋友圈

H5手Q分享通用接口参数说明

itemprop=”name”

网页标题，不同社交APP截取的长度都不一样，然后手机屏幕大小也会再次不同程度裁减文字。微信只用这个标题。

itemprop=”description”

网页简介/摘要，和网页标题一样有长度限制，如果小屏幕可能还会裁减。微信不会使用到这个标签。

itemprop=”image”

网页缩略图/分享图标，显示在分享内容的左边，图片支持.jpg、.png等常见格式，建议使用200px*200px的图片，如果太大可能读取比较慢。

H5手Q分享通用接口演示

<meta itemprop="name" content="H5分享也可以很任性的一段代码包办">
<meta itemprop="description" content="如何做到大道为简，通用的一段让页面分享后有脸有标题有摘要">
<meta itemprop="image" content="http://pp.myapp.com/ma_icon/0/icon_11778207_1453189893/96">

H5手Q分享通用接口的坑

这些卡片上的标题、摘要、图片是会被缓存的，所以当你发送过一次，即使做了修改也会是第一次发送时的内容。

有时会应网络、不可以知原因获取不到信息，但是出现几率极小。

这个方法还支持google+的分享，然后微信好友、微信朋友圈二次分享需要另外配置。

闲话

几乎每次都是一样，更新的时候都会有这么一段总结“又很久没更新了，生活工作都乱糟糟的！”。这次分享的这篇文章一点都不“候塞雷”，不能再水了，结构化资料标签Google推行也应该有几年了，刚才看了下百度百科首页和详情页简直就是浑（can）然（bu）天（ren）成（du）。w3school这种资料站也只有XML Schema，然而schema.org还被墙…

扩展阅读

Getting Started - schema.org
Must-Have Social Meta Tags for Twitter, Google+, Facebook and More
結構化資料 SEO 與 meta 標籤
玩转HTML5移动页面(优化篇)

Relay Tips: 一极乐（ https://yijile.com/log/515/ ）