HTML5 SEO优化的一些建议


Posted in HTML / CSS onAugust 27, 2020

举个例子

<title>淘宝网 - 淘!我喜欢</title>

使用description以及keyword标签(不超过300个字符最优)

<meta name="description" content="淘宝网 - 亚洲较大的网上交易平台,提供各类服饰、美容、家居、数码、话费/点卡充值… 数亿优质商品,同时提供担保交易(先收货后付款)等安全交易保障服务,并由商家提供退货承诺、破损补寄等消费者保障服务,让你安心享受网上购物乐趣!" />
<meta name="aplus-xplug" content="NONE">
<meta name="keyword" content="淘宝,掏宝,网上购物,C2C,在线交易,交易市场,网上交易,交易市场,网上买,网上卖,购物网站,团购,网上贸易,安全购物,电子商务,放心买,供应,买卖信息,网店,一口价,拍卖,网上开店,网络购物,打折,免费开店,网购,频道,店铺" />

图片添加 alt 和 title

<img src="https://gw.alicdn.com/tfs/TB1DP0yAoY1gK0jSZFMXXaWcVXa-1190-70.png" alt="淘小铺" style="width:1190px;height:70px"/>

使用语义化标签

<h1>大标题</h1>
<h2>大标题</h2>
<artice>文章</artice>

使用 Open Graph 标签

(OG)标记是页面HTML 部分中的附加元标记,该标记允许任何网页成为社交网络中的丰富对象。它于2010年由Facebook首次推出,并得到其他主要社交媒体平台(LinkedIn,Google +等)的认可。

在HTML中,它看起来可能像这样:

<meta name="og:title" property="og:title" content="Your Awesome Open Graph Title">

通过设置 Open Graph , 可以更好的提高社交媒体的网页性能, 优雅的使用将该属性转化为点击量

使用nofollow属性

nofollow是什么?

nofollow 是HTML页面中a标签的属性值。这个标签的意义是告诉搜索引擎"不要追踪此网页上的链接或不要追踪此特定链接"。

nofollow的作用?

  1. 防止不可信的内容,最常见的是博客上的垃圾留言与评论中为了获取外链的垃圾链接,为了防止页面指向一些拉圾页面和站点。
  2. 为了防止付费链接影响Google的搜索结果排名。
  3. 引导爬虫抓取有效的页面,避免爬虫抓取一些无意义的页面,影响爬虫抓取的效率。
     

nofollow基本用法
 

用于 <meta> 标签
 

告诉搜索引擎(爬虫)该页面上所有链接都无需追踪 (这种方法一般用的较少)

<meta name="robots" content="nofollow" />

用于 <a> 标签

告诉搜索引擎(爬虫)加上此属性的链接无需追踪

(一般推荐用这种方法)

<a href="javascript:" class="back" rel="nofollow"></a>

以上就是HTML5 SEO优化的一些建议的详细内容,更多关于HTML5 SEO优化的资料请关注三水点靠木其它相关文章!

HTML / CSS 相关文章推荐
css背景图片的背景裁切、背景透明度、背景变换等效果运用
Dec 24 HTML / CSS
CSS3 Media Queries详细介绍和使用实例
May 08 HTML / CSS
css3实例教程 一款纯css3实现的环形导航菜单
Oct 20 HTML / CSS
CSS3 text shadow字体阴影效果
Jan 08 HTML / CSS
css3 media 响应式布局的简单实例
Aug 03 HTML / CSS
H5 canvas中width、height和style的宽高区别详解
Nov 02 HTML / CSS
HTML5 MiranaVideo播放器 (代码开源)
Jun 11 HTML / CSS
html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例
May 08 HTML / CSS
HTML5几个设计和修改的页面范例分享
Sep 29 HTML / CSS
video下autoplay属性无效的解决方法(添加muted属性)
May 19 HTML / CSS
前端H5 Video常见使用场景简介
Aug 21 HTML / CSS
CSS中float高度塌陷问题的四种解决方案
Apr 18 HTML / CSS
Amaze UI 文件选择域的示例代码
Aug 26 #HTML / CSS
h5封装下拉刷新
Aug 25 #HTML / CSS
amazeui页面分析之登录页面的示例代码
Aug 25 #HTML / CSS
详解淘宝H5 sign加密算法
Aug 25 #HTML / CSS
AmazeUI 等分网格的实现示例
Aug 25 #HTML / CSS
AmazeUI 点击元素显示全屏的实现
Aug 25 #HTML / CSS
AmazeUI 按钮交互的实现示例
Aug 24 #HTML / CSS
You might like
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
基于ThinkPHP5.0实现图片上传插件
2017/09/25 PHP
PHP的mysqli_thread_id()函数讲解
2019/01/24 PHP
ie和firefox中img对象区别的困惑
2006/12/27 Javascript
将string解析为json的几种方式小结
2010/11/11 Javascript
Jquery封装tab自动切换效果的具体实现
2013/07/13 Javascript
详解JS 比较两个Json对象的值是否相等的实例
2013/11/20 Javascript
详解JavaScript中jQuery和Ajax以及JSONP的联合使用
2015/08/13 Javascript
js+css实现select的美化效果
2016/03/24 Javascript
jQuery实现鼠标跟随提示层效果代码(可显示文本,Div,Table,Html等)
2016/04/18 Javascript
javascript中JSON.parse()与eval()解析json的区别
2016/05/19 Javascript
AngularJS延迟加载html template
2016/07/27 Javascript
jquery操作ID带有变量的节点实例
2016/12/07 Javascript
jQuery删除当前节点元素
2016/12/07 Javascript
JS中静态页面实现微信分享功能
2017/02/06 Javascript
关于jQuery.ajax()的jsonp碰上post详解
2017/07/02 jQuery
Vue.js实例方法之生命周期详解
2017/07/03 Javascript
Vue+SpringBoot开发V部落博客管理平台
2017/12/27 Javascript
vue 引用自定义ttf、otf、在线字体的方法
2019/05/09 Javascript
vue实现简单计算商品价格
2020/09/14 Javascript
[57:28]2018DOTA2亚洲邀请赛 4.6 淘汰赛 TNC vs Liquid 第一场
2018/04/10 DOTA
Python使用py2exe打包程序介绍
2014/11/20 Python
仅用500行Python代码实现一个英文解析器的教程
2015/04/02 Python
python3.4下django集成使用xadmin后台的方法
2017/08/15 Python
Python运行不显示DOS窗口的解决方法
2018/10/22 Python
基于 HTML5 Canvas实现 的交互式地铁线路图
2018/03/05 HTML / CSS
FC-Moto美国:欧洲最大的摩托车服装和头盔商店之一
2019/08/24 全球购物
公司出纳岗位职责
2013/12/07 职场文书
汽车运用工程系毕业生自荐信
2013/12/27 职场文书
经济管理专业自荐信
2013/12/30 职场文书
安全检查管理制度
2014/02/02 职场文书
法律进学校实施方案
2014/03/15 职场文书
个人工作表现评语
2014/04/30 职场文书
开展批评与自我批评发言材料
2014/05/15 职场文书
工作表扬信
2015/01/17 职场文书
opencv 分类白天与夜景视频的方法
2021/06/05 Python