美文网首页
前端需要知道的 HTML5 SEO优化

前端需要知道的 HTML5 SEO优化

作者: WEB前端含光 | 来源:发表于2020-08-05 12:53 被阅读0次
<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的作用?
防止不可信的内容,最常见的是博客上的垃圾留言与评论中为了获取外链的垃圾链接,为了防止页面指向一些拉圾页面和站点。
为了防止付费链接影响Google的搜索结果排名。
引导爬虫抓取有效的页面,避免爬虫抓取一些无意义的页面,影响爬虫抓取的效率。

nofollow基本用法
用于 <meta> 标签
告诉搜索引擎(爬虫)该页面上所有链接都无需追踪 (这种方法一般用的较少)

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

用于 <a> 标签
告诉搜索引擎(爬虫)加上此属性的链接无需追踪

(一般推荐用这种方法)

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

如果你现在也想学习前端开发技术,在学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,你都可以申请加入我的Q群链接里面有许多学习资料 大厂面试真题,希望能够对你们有所帮助。

相关文章

  • 前端需要知道的 HTML5 SEO优化

    使用description以及keyword标签(不超过300个字符最优) 图片添加 alt 和 title 使用...

  • 关于前端SEO要点(二)

    背景:前端SEO并不难理解,对资深SEO来说,前端SEO性能优化方案也有掌握的必要。 一、页面级优化 1、js、c...

  • H5性能优化

    移动端HTML5页面前端性能优化。如何优化HTML5在移动设置上的性能表现,首先需要明确以下几个原则:1、PC优化...

  • 谈谈微博seo优化要怎么去优化?有哪些技巧?

    大家都知道的,如果想要网站变得更好就需要对网站进行SEO优化,那么微博需不需要做SEO优化呢?答案是“必然的”,也...

  • SEO学习零基础入门需要多久?

    新手想学习SEO需要多久的问题,这个就需要好好的规划下。 怎样才算seo入门? 就是拿到一个网站后,知道SEO优化...

  • 前端SEO优化

    1.合理的title、description、keywords:搜索引擎对于三项的权重逐个减小; 2.重要的内容一...

  • 前端SEO优化

    一、搜索引擎工作原理 当我们在输入框中输入关键词,点击搜索或查询时,然后得到结果。深究其背后的故事,搜索引擎做了很...

  • 前端SEO优化

    简介 全称:SEO(Search Engine Optimization):汉译为搜索引擎优化。 作用:搜索引擎优...

  • 前端Seo优化

    1、合理的title,description,keywords,搜索引擎对三项的权重逐渐减小,title标题强调重...

  • 前端面试每日 3+1 —— 第37天

    今天的面试题 (2019.05.23) —— 第37天 [html] html5哪些标签可以优化SEO? [css...

网友评论

      本文标题:前端需要知道的 HTML5 SEO优化

      本文链接:https://www.haomeiwen.com/subject/yhmdrktx.html