前端优化搜索引擎（seo）：
- 合理的title，description，keywords 搜索引擎对这三项的权重逐个减小：title值强调重点即可，关键词设定要突出，重要的关键词不要出现超过两次，而且要靠前，不同页面的title有所不同；description围绕网站主题内容和目标关键字，对网站做概要介绍，要能突出特点，体现优势，不过分堆砌关键字，不同页面的description有所不同；keyword应将title中的关键词，包括长尾中的短关键词罗列。
- 语义化标签让搜索引擎容易理解网页：恰当使用语义化的html标签、class类名等内容，让页面具有良好的结构和含义，便于浏览器、搜索引擎解析。网站的导航尽量使用纯文字进行导航。
- 重要内容的html代码放在最前面：seo抓取html顺序是由上至下。
- 重要内容不用js输出：爬虫不会执行js获取内容。
- 少用iframe：搜索引擎不会抓取iframe中的内容。
- 非装饰性图片必须加alt。
- 提高网站速度：网站速度是搜索引擎排序的一个重要指标。
如何进行网站性能优化：
- 减少http请求：合并css、合并js、利用css sprtes图片精灵合并图片、用LazyLoad Images使得页面刚加载时减少http请求数。
- 将css放在页面最上部，使用<link>引入，不使用@import编写样式。
- 将js放在页面最下面，如果页面解析时就需要用到js，可采用LazyLoad Javascript实现当页面需要时再加载js文件。
- 减少cookie传输：cookie包含在每次请求和响应中，太大的cookie会严重影响数据传输；对于某些静态资源的访问，如css、script等发送cookie没有意义，可以考虑静态资源使用独立域名访问，避免请求静态资源时发送cookie，减少cookie传输次数。
CSS优化、提高性能的方法：
css优化主要是四个方面：加载性能、选择器性能、渲染性能、可维护性；
- css压缩；css单一样式；减少使用@import，因为他会等待页面加载完之后再进行加载；
- 避免使用通配符*；尽量少得对标签进行选择，而是用class；尽量少使用后代选择器，降低选择器的权重值；考虑继承，避免对一些属性重复指定规则；选择器优化嵌套，尽量避免层级过深；
- 慎重使用高性能属性：
-
- 浮动、定位；
- 尽量减少页面重排、重绘；
- 重排按照css的书写顺序：去除空标签；属性值为0.几时省略前面的0；
- 位置：positon、top、left、z-index、float、display；
- 大小：width、height、margin、padding；
- 文字系列： font、line-height、color、letter-spacing；
- 背景边框：background、 border；
- 其它：anmation、transition；
- 重绘:border、outline、background、box-shadow,能使用background-color,就尽量不要使用background;
- 标准化各种浏览器前缀：带浏览器前缀的在前，标准属性在后；
- 抽象提取公共样式，减少代码量；
- 将css文件放在页面最上面；
4. 将具有相同属性的样式抽离出来，整合并通过class在页面中进行使用，提高css的可维修性；样式与内容分离，将css代码定义到外部css中。
网站加载速度慢如何优化：
1. 服务器配置：
-
- 服务器的带宽是第一要素。带宽小，打开网站的速度会很慢，如果服务器响应很慢，那要考虑升级更高的带宽来支撑网站。
- 建议使用阿里云或者腾讯云服务器来配置网站，云服务器有CDN节点加速，网站打开速度快，相对也比较稳定。
2. 精简网站程序：
-
- 在页面内容较多的情况下，网站程序就有必要进行压缩和精简了，尽可能得压缩网页体积，多个文件整合在一起，从而提升页面的加载速度。
3. 图片优化：
-
- 图片过大也是影响网站打开速度的原因。对网站的图片进行压缩，尽量控制单张图片的大小在100KB以下。
4. 用h5代替flash：
-
- Flash动画可以带来很酷炫的效果，但也很占流量，也不利于后期优化，flash现在已经慢慢被淘汰，取而代之的是h5动效，如果你网站存在flash，应该用h5来代替。
前端性能优化相关问题
原文：https://www.cnblogs.com/pleaseAnswer/p/11994629.html
