前端seo优化

参考链接:http://www.cnblogs.com/EnSnail/p/5671345.html 博客园

链接:https://www.zhihu.com/question/21658448/answer/18903129
来源:知乎

以上链接方法写的很详细

补充:

1.增加网页的文字,如果不是个性字体,都可以将图片设为背景,自己用css写文字样式,保留搜索引擎的文本

h1 {
  background: url(img/replacement-image.png) no-repeat;
  height: 50px;
  width: 400px;
  display: block;
  text-indent: -9999px;
}

2.如果需要有个性字体的图片,可以让文本文字不会出现在浏览器上,但在网页代码中是有该标题的。

可以做成背景图,之后用样式让html中的文字的缩进设置成足够大的负数,偏离出浏览器之外,也可以利用设置行高的方法让文字隐藏。注意:不可使用display:none;的方法让文字隐藏,因为搜索引擎会过滤掉display:none;里边的内容,就不会被蜘蛛检索了。

.tit{

  font-size:18px;

  height:25px;

  line-height:25px;

  overflow:hidden;

  text-indent:-9999px;

}或

.tit{

  font-size:18px;

  height:25px;

  line-height:50px;

  overflow:hidden;

}

3.链接中加入title,关键文字可以使用h2标签,因为一个网页最好尽量少h1标签,外部链接,链接到其他网站的,则需要加上 el="nofollow" 属性。

<a href="" title="">跳转<h2>关键字</h2></a>

4.如果是动态网页,可以开启伪静态功能,让蜘蛛“误以为”这是静态网页,因为静态网页比较合蜘蛛的胃口,如果url中带有关键词效果更好。

5.减少不必要的http跳转

对于以目录形式访问的 HTTP链接,很多人都会忽略链接最后是否带 ’/‘,假如你的服务器对此是区别对待的话,那么你也需要注意,这其中很可能隐藏了 301跳转,增加了多余请求。

6.高效率写法

// 全局变量
var globalVar = 1;
function myCallback(info){
//局部变量缓存全局变量
var localVar = globalVar;
for( var i = 100000; i--;){
//访问局部变量是最快的
localVar += i;
}

在 Javascript中使用"+" 号来拼接字符串效率是比较低的,因为每次运行都会开辟新的内存并生成新的字符串变量,然后将拼接结果赋值给新变量。与之相比更为高效的做法是使用数组的 join方法,即将需要拼接的字符串放在数组中最后调用其 join方法得到结果。不过由于使用数组也有一定的开销,因此当需要拼接的字符串较多的时候可以考虑用此方法。

7.使用async关键字,告知浏览器遇到script时不阻塞DOM的构建

<script src="app.js" async></script>
时间: 2024-12-18 18:42:58

前端seo优化的相关文章

WEB前端-搜索引擎工作原理与SEO优化

一.搜索引擎工作原理 搜索引擎的工作分为三个阶段,即爬行,索引和检索 1.爬行  搜索引擎具有网络爬虫或蜘蛛来执行爬网,每次抓取工具访问网页时,它都会复制该网页并将其网址添加到索引中. 在“蜘蛛”抓取网页内容,提炼关键词的这个过程中,就存在一个问题:“蜘蛛”能否看懂.如果网站内容是 flash 和 js,那么它是看不懂的.相应的,如果网站内容是它的语言,那么它便能看懂,它的语言即 SEO 2.索引  此阶段,爬网程序会创建搜索引擎的索引.索引就像一本巨大的书,其中包含爬虫找到的每个网页的副本.如

web前端之网站seo优化学习笔记

这两天因为一些公司业务上的原因,学习了一些关于网站seo优化的方法和技巧. 之前在码代码的过程中其实还没有考虑过对于网站导流和优化网站关键字搜索排名的问题. 在了解了一些这方面的资料之后,觉得这是一个很有意思的领域.把这几天的学习笔记记下来. 个人理解是在一个项目基本上完成主要需求后需要运营需求加入的时候,此时seo优化就非常重要.所以在网站开发的最开始有经验的前端coder们在搭架子的时候就应该提前把以后运营汪们可能会提出的运营需求,特别是一些针对影响关键字排名和与搜索引擎相关的部分就可以考虑

关于web前端开发过程中SEO优化的注意点

SEO优化通俗点说就是为了让网站在各大搜索引擎中更容易的被搜到,即提高搜索排行,从而提高网站流量的一个技术手段 在写web页面的时候,为了让网络爬虫更容易的搜索到页面,需要注意几个点: html语义化 刚接触web前端开发的时候很奇怪,既然html标签可以通过css进行更改它的内置属性,为什么还有这么多的标签存在 <div>,<h1>,<span>,<strong>.... 而现在,随着对前端的不断深入,才逐渐明白它的用处 语义化的html可以让开发者更容易

web前端性能&amp;SEO优化

前端性能优化 浏览器请求处理流程如下图: 1.减少http请求,合理设置 HTTP缓存 http协议是无状态的应用层协议,意味着每次http请求都需要建立通信链路.进行数据传输,而在服务器端,每个http都需要启动独立的线程去处理.这些通信和服务的开销都很昂贵,减少http请求的数目可有效提高访问性能. 减少http的主要手段是合并CSS.合并javascript.合并图片.将浏览器一次访问需要的javascript和CSS合并成一个文件,这样浏览器就只需要一次请求.图片也可以合并,多张图片合并

前端应该知道的SEO优化(转)

网站SEO优化分为站内.站外. 一.站内优化 1.做好HTML头标签 标题(title):标题是网页优化中相当有分量,一般网页title主要包含一些关键词.网站名称等. 关键词(keyword):重要性大家都知道!关键词设定要参考热度.百度指数等一些手段,当然选择这些的前提要与自己网站的主题相关.关键词不宜多,一般就是1-3个. 描述(description):主要是对网站的一个介绍,虽然没有前两个标签在搜索引擎蜘蛛眼中作用大,但是也是不可忽略的一个因素.用户搜索时显示在搜索引擎网页中的只有它跟

CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

目录 一.浏览器兼容 1.1.概要 1.2.浏览器内核 1.3.浏览器市场份额(Browser Market Share) 1.4.兼容的一般标准 1.5.CSS Reset 1.6.CSS Hack 1.6.1.条件注释法 1.6.2.样式内属性标记法 1.6.3.选择器前缀法 1.7.文档模式 (X-UA-Compatible) 1.8.javascript兼容 二.前端性能优化 2.1.概要 2.2.减少HTTP请求数量 2.2.1.图片地图 2.2.2.精灵图片(Sprite) 2.2.

前端SEO技巧

前几天在慕课网上学习了“SEO在网页制作中的应用”,觉得挺好.挺有用的,今天,特此做了一个小小的笔记,也算是对学习过后的一个总结. 一.搜索引擎工作原理 当我们在输入框中输入关键词,点击搜索或查询时,然后得到结果.深究其背后的故事,搜索引擎做了很多事情. 在搜索引擎网站,比如百度,在其后台有一个非常庞大的数据库,里面存储了海量的关键词,而每个关键词又对应着很多网址,这些网址是百度程序从茫茫的互联网上一点一点下载收集而来的,这些程序称之为“搜索引擎蜘蛛”或“网络爬虫”.这些勤劳的“蜘蛛”每天在互联

前端SEO

白帽seo SEO白帽技术: 白帽SEO定义:白帽seo顾名思义就是光明正大流出水面.一种正义的手法,是使用符合主流搜索引擎发行方针规定的seo优化方法.它是与黑帽seo相反,白帽SEO一直被业内认为是最佳的seo手法,它是在避免一切风险的情况下进行操作的,同时也避免了与搜索引擎发行方针发生任何的冲突,它也是seoer从业者的最高职业道德标准. 白帽SEO意义:白帽seo关注长远利益,可能是3-5年后或是更长时间需要的时间更长久,效果更加.坚持不使用作弊手段,坚持几年,不出意外的话,你的网站应该

网站完整详细的SEO优化方案

一个完整的SEO优化方案主要由四个小组组成: 一.前端/页编人员 二.内容编辑人员 三.推广人员 四.数据分析人员 接下来,我们就对这四个小组分配工作. 首先,前端/页编人员主要负责站内优化,主要从四个方面入手: 第一个,站内结构优化 合理规划站点结构(1.扁平化结构 2.辅助导航.面包屑导航.次导航) 内容页结构设置(最新文章.推荐文章.热门文章.增加相关性.方便自助根据链接抓取更多内容) 较快的加载速度 简洁的页面结构 第二个,代码优化 Robot.txt 次导航 404页面设置.301重定