4.页面优化

为什么要优化? 优化的好处 1.提升网页响应速度 2.有利于搜索引擎搜索 3.对后期维护比较方便

怎么优化? 1.减少请求 2.减少文件的大小 3.页面性能 4.可读性、维护性

1.图片合并 2.css文件合并 (多个css文件合并为一个、少量的行内样式、避免import的方式引入文件) 3.减少图片的大小(选择合适的图片格式) 4.css值缩写 5.0px 中px省略 0% 0 0.5可以写成.5 6.选择器合并 7.link标签引入样式放到head标签中 8.js脚本建议放在底部,等页面加载完之后再处理js 9.把不需要的标签去掉 10.选择器的长度 #nav ul li a{} 影响查找的性能 11.避免耗性能的属性 比如说css3中的渐变 12.img设置宽高的时候应该和实际的宽高一致 13.可读性的规范 14.尽量用语义化的标签来编写,有利于seo 15.类型和id名,以内容语义来命名 16.避免hack 17.模块化(一系列相关的结构做成一个模块来处理) 18.必要的时候添加注释,可读性比较好

比如说代码优化,大家试着说一下怎么优化?

.g-bd{
  border-top: 1px solid #000;
  border-right: 1px solid #f00;
  border-bottom: 1px solid #f00;
  border-left: 1px solid #000;
}
.m-side{
  width: 200px;
  background-image: url(bg.png);
  background-repeat: repeat-y;
  background-color: #ccc;
}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏知晓程序

开发 | 天天用小程序页面跳转接口,但你真的了解它们吗?

今天,知晓程序(微信号 zxcx0101)就来为你详细解析,小程序中有关页面跳转的 4 个接口,帮助你更有效地利用小程序的 5 层页面层级限制。

16930
来自专栏码神联盟

IntelliJ系列 ⑥ | IDEA 之 常见的高效配置全解

39830
来自专栏Theo Tsao

Vim的基本使用(二)

本文包含Vim的基本使用有: 可视模式、指定计数、重复命令、外部命令、命令行编辑、文件编辑、分割窗口、GUI命令、配置。 另附一张Vim Cheat Sheet...

13320
来自专栏Java成神之路

Eclipse_常用技巧_02_使用Eclipse进行源码分析

       在代码区中选择需要的类和接口定义,然后右击,选择“Open Type Hiberarchy”,可以在“Hiberarchy View”中看到继承关...

12020
来自专栏DannyHoo的专栏

在Xcode的模拟器中的textField中输入中文

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/...

22520
来自专栏jianhuicode

使用node-inspector调试nodejs程序<nodejs>

1.npm install -g node-inspector  // -g 导入安装路径到环境变量 一般是c盘下AppData目录下 2.node-inspe...

21770
来自专栏小白鼠

Ionic3 自定义指令

组件的概念比较大,本文讲解的是属性指令和结构指令的创建和使用,Angular官方文档

15030
来自专栏王二麻子IT技术交流园地

九、VueJs 填坑日记之在项目中使用jQuery

很多人学习 js 都是从 jQuery 开始的,我也不例外。有时候进行一些操作的时候,还是感觉 jQuery 比较好用,那么,我们如何在项目中使用 jQuery...

575100
来自专栏Python疯子

Selenium和PhantomJS 终极最全使用总结

1. 加载页面[image.png]PhantomJS 截取的是网页的完整页面,包括下拉进度条的内容

1.1K30
来自专栏磨磨谈

Luminous监控界面中文语言包

之前有各种ceph的管理平台,在部署方面大部分都比较麻烦,现在在luminous版本当中有一个原生的dashboard,虽然目前这个只能看,但是从界面上面,从接...

19720

扫码关注云+社区

领取腾讯云代金券