css3.0的用途,优点,缺点

html-css047

css3.0的用途,优点,缺点,第1张

一、使页面载入得更快 由于将大部分页面代码写在了CSS当中,使得页面体积容量变得更小。相对于表格嵌套的方式,DIV+CSS将页面独立成更多的区域,在打开页面的时候,逐层加载。而不像表格嵌套那样将整个页面圈在一个大表格里,使得加载速度很慢。 二、降低流量费用 页面体积变小,浏览速度变快,这就使得对于某些控制主机流量的网站来说是最大的优势了。 三、修改设计时更有效率 由于使用了DIV+CSS制作方法,在修改页面的时候更加容易省时。根据区域内容标记,到CSS里找到相应的ID,使得修改页面的时候更加方便,也不会破坏页面其他部分的布局样式。 四、保持视觉的一致性 DIV+CSS最重要的优势之一:保持视觉的一致性;以往表格嵌套的制作方法,会使得页面与页面,或者区域与区域之间的显示效果会有偏差。而使用DIV+CSS的制作方法,将所有页面,或所有区域统一用CSS文件控制,就避免了不同区域或不同页面体现出的效果偏差。 五、更好地被搜索引擎收录 由于将大部分的HTML代码和内容样式写入了CSS文件中,这就使得网页中正文部分更为突出明显,便于被搜索引擎采集收录。 六、对浏览者和浏览器更具亲和力 我们都知道网站做出来是给浏览者使用的,对浏览者和浏览器更具亲和力,DIV+CSS在这方面更具优势。由于CSS富含丰富的样式,使页面更加灵活性,它可以根据不同的浏览器,而达到显示效果的统一和不变形。编辑本段存在问题尽管DIV+CSS具有一定的优势,不过现阶段CSS+DIV网站建设存在的问题也比较明显,主要表现在: 第一,对于CSS的高度依赖使得网页设计变得比较复杂。相对于HTML4.0中的表格布局(table),CSS+DIV尽管不是高不可及,但至少要比表格定位复杂的多,即使对于网站设计高手也很容易出现问题,更不要说初学者了,这在一定程度上影响了XHTML网站设计语言的普及应用。 第二,CSS文件异常将影响整个网站的正常浏览。CSS网站制作的设计元素通常放在几个l外部文件中,这一个或几个文件有可能相当复杂,甚至比较庞大,如果CSS文件调用出现异常,那么整个网站将变得惨不忍睹。 第三,对于CSS网站设计的浏览器兼容性问题比较突出。基于HTML4.0的网页设计在IE4.0之后的版本中几乎不存在浏览器兼容性问题,但CSS+DIV设计的网站在IE浏览器里面正常显示的页面,到火狐浏览器(FireFox )中却可能面目全非(这也是为什么建议网络营销人员使用火狐浏览器的原因所在 )。CSS+DIV还有待于各个浏览器厂商的进一步支持。 第四,CSS+DIV对搜索引擎优化与否取决于网页设计的专业水平而不是CSS+DIV本身。CSS+DIV网页设计并不能保证网页对搜索引擎的优化,甚至不能保证一定比HTML网站有更简洁的代码设计,何况搜索引擎对于网页的收录和排序显然不是以是否采用表格和CSS定位来衡量,这就是为什么很多传统表格布局制作的网站在搜索结果中的排序靠前,而很多使用CSS及web标准制作的网页排名依然靠后的原因。因为对于搜索引擎而言,网站结构、内容、相关网站链接等因素始终是网站优化最重要的指标。

制作时间

首先,笔者在制作时间上进行对比,利用CSS3制作页面远比使用CSS节省时间。因为CSS3可以直接制作很多效果用来替换图片,而使用旧CSS版本制作的页面需要制作一些图片来体现效果,所以在制作图片上也要花费很多时间。

文件数量、容量及加载时间

CSS3版本的CSS文件大小为5.2K,网页文件总数为12,总容量为767.9K;CSS版本的CSS文件为4.5K,但网页文件总数为22,网页容量为849.2K。加载时间分别是3.3秒和4.7秒。

从以上数据可见,CSS3比CSS精简很多,速度也更快。

服务器请求次数

另外一个衡量指标是服务器请求次数,一般网页中有多少文件,就会对服务器有多少次请求数。不要小看这个指标,很多网页制作高手为了减少对服务器的请求负载,才探索出CSS Sprite技术。

CSS3中一共有12个文件,CSS版本中有22个文件,所以它们对服务器的请求数分别为12和22。又是CSS3胜出。

最后,综合以上的数据,在图三中已经列出CSS3和CSS的相关数据,CSS3完胜。

这下我们可以看到CSS3除了比较美观的效果外,还有更多的优点,毕竟它是网络技术发展中的产物,必然会向更加简单实用美观的方向发展。

今天小编要跟大家分享的文章是关于想成为合格的web前端人员应该注意的几点!想要成为一个月薪过万,企业争相互抢的web前端开发工程师,光掌握基本开发技术是远远不够的。今天为大家总结五点不能忽略的技术要领,希望可以帮到各位。下面我们一起来看一看吧!

一、以为不需要学习后端知识

随着行业在发展着,前端的功能越来越强大。离线数据库能提供数据存储和管理的功能,但不会写SQL语句显然已经行不通。

WebSocket能提供即时通信,但不了解socket和WebSocket的区别,能和后端开发(很多后端开发只会socket技术)一起搭建吗?

加快页面展示速度不只是要从前端分析,后端也要考虑到,使用keepalive、缓存等后端技术能使页面更快地打开。

二、网页考虑不周全

大部分前端呈现使用DOM,但DOM用得多了会有性能问题。现在很流行列表页页底上拉加载更多,但很少有前端关注加载的极端问题,如果一个页面我下拉了很多次,加载了几千个DOM,会发生什么问题?答案是轻则页面响应缓慢,重则浏览器闪退。

另外举个例子:LocalStorage使用起来确实方便,很多企业的前端重度依赖它,甚至知名的前端开发框架也依赖它。但它有个缺点——有容量限制(2.6M-10M),我们得考虑极端情况,当LocalStorage空间快满时,怎么处理。或在架构上避免这种极端情况的发生。

三、效果只需懂JS

有些人会认为,前端开发只有js,其实非也,不是所有的效果只有js能够解决问题,还需要掌握很多知识,比如:浏览器原理,html5,css3等。比如说做一个触摸屏上的转盘,看似一个简单的效果,但是代表了前端知识的综合应用。你没有触摸屏开发经验,不知道CSS3或canvas,不了解网页优化,是做不出来的。前端是综合技术的应用,只会JS是解决不了问题的。

四、不尝试新技术

我们已经有新的技术了,不要把它们浪费了,是时候对以前的网页和以前的操作方式进行变革了。试问一下自己,网页用了CSS3动画吗?网页支持多点触摸操作吗?距离感应器,动作感应器,你用了没有?并不是说为了用而用这些新技术,而是更应该将技术不断提升,将新技术运用到工作中。

五、不考虑SEO问题

WebApp一直在觊觎NativeApp的位置,有的WebApp和NativeApp根本看不出差别。Web

App大红大紫,各种前端MVC框架也风声水起,但它们都有个问题,几乎没法做SEO,因为搜索引擎无视JS。流量是企业的立命之本,SEO做得好能引来大量的流量,所以前端还是得考虑SEO问题。

前端工程师是一个高薪职业,希望大家能够不断优化自己的工作,为用户创造出更多有价值的WEB

。学习前端开发没有任何捷径,如果要想提高学习效率,推荐以系统化教程为主,专业行业大牛辅助进行学习。这样知识点覆盖会更广更深。

以上就是小编今天为大家分享的关于想成为合格的web前端人员应该注意的几点的文章,希望本篇文章能够对正在从事web前端工作的小伙伴们有所帮助。想要了解更多web前端知识记得关注北大青鸟web前端培训官网。最后祝愿小伙伴们工作顺利!