学习总结——网页设计最佳方式

欢迎转载,请注明作者和出处。
本文链接: https://blog.csdn.net/weixin_43217942/article/details/100077967

什么是网页的最佳设计方式,每个学前端可能都会这样问自己吧,时代在进步,技术在发展,没有什么是最佳的最好的,只有相对来说比较好的。我曾经读《重构——改善既有代码》时作者在书中写到:我不能告诉你你什么时候需要重构代码,我只能以我这么多年的经验给你说一些不好代码的表现,那些代码的“坏味道”。说实话,没有人知道什么才是最佳的、怎么做才是最正确的,我也不知到怎样才算是最佳网页设计,但是通过这么多天的学习我可以告诉你一些我对前端网页设计的一些感受,一些我在用的技巧。

1.尽量让子元素撑起父元素,可以利用子元素的padding,margin等属性,width,height

在我写网页的时候发现,设置父元素的某些属性是没有必要的,写了还不如不写好。

2.尽量多使用相对单位,少使用固定单位(px),常用相对单位有:百分比、em、rem、vh、vw、vmin

如果不想让你的网页一放大或缩小浏览器窗口就布局全乱,请尽量这么做,浏览器是根据屏幕刷新的,你确定不了用户屏幕的大小或分辨率,有可能是手机、平板或者一些其他低分辨率的设备上。所以屏幕既然不固定,那你为什么要把元素属性固定呢?

3.尽量用最少的CSS属性实现效果,有些属性没必要设置尽量省略。通常子元素比父元素设置的多

4.父元素常用来设置布局,整体属性,子元素设置本身的效果呈现

5.选择器尽量精确些,不要选择到其他部分,有时候会引来意想不到的问题

6.尽量少用后代选择器,用子代选择器会更好些

这个牵扯到 CSS解析的原理,记住子代选择器比后代选择器可以完成的功能相同但范围更小就行,效率更高。

7.html网页结构的共享部分要使用http请求的方式获取数据源,相对路径容易出问题

8.尽量使用flex布局

flex是响应式网页设计的支撑技术,也是现在网页设计的潮流,使用flex一时爽,一直flex一直爽~~~哈哈哈~

9.不要频繁请求http,优化的地方:小图标尽量用精灵图(sprite),合并CSS文件,合并JS文件等等

10.网页不要使用太多太大的图片

新手刚入坑不久,多多包涵,不妥之处请指出。

猜你喜欢

转载自blog.csdn.net/weixin_43217942/article/details/100077967