现在前端开发工程师的工作任务主要是HTML、CSS、javaScript,而在组长做前端开发那会儿,还负责网页设计,这不是个例,那个时期的前端开发工作就是这样,行业默认。所以当时的前端开发工程师很多都是“偏科生”,有的擅长设计,有的擅长写代码。发展至今,现在的前端开发和网页设计成了两个工种,后者被称为“美工”,组长认为这是科学合理的,毕竟每个人擅长的领域不一样,善用所长才能让项目达到最好效果。

前端开发常用软件(前前端开发工程师)(1)

2006年组长考取的adobe设计师证

组长做前端开发那个时期,最流行的软件有四个dreamweaver(以下简称“DW”)、fireworks(以下简称“FW”)、flash、photoshop(以下简称“PS”),前三者被称为“网页三剑客”,是前端开发必须熟练掌握的三款软件,PS为设计类软件。只有分别通过了这四款软件考试,就会颁发“adobe中国认证设计师”证。是不是有点儿像集齐七颗龙珠召唤神龙的感觉?

前端开发常用软件(前前端开发工程师)(2)

fireworks软件

曾经闻名遐迩的“网页三剑客”,现在一个沦为“备胎”(DW)、一个彻底被淘汰(flash)、还有一个快被遗忘(FW),今天咱们要重点说的就是这款软件。

目前FW最新版本为2019版,很多人把FW这款软件归纳为设计类软件,经常拿PS与其做对比,甚至有人把其“陨落”的原因归结为设计能力无法与PS媲美。作为一个前前端开发开发工程师,组长认为这是对FW软件的误解。

FW确实与PS在功能上有部分重叠,比如图片编辑方面、滤镜方面。但无论如何,FW这款软件绝对不是为设计而生,而是用于“图片处理",特别在图片优化——无损压缩方面是首屈一指,在目前来看仍然无敌。

前端开发常用软件(前前端开发工程师)(3)

tinypng

组长查了一下资料,现在用于图片无损压缩的软件有很多,每个人都会根据自己的习惯去选择。而用的最广、讨论最多的是一个叫tinypng的平台,tinypng是一款在线的图片无损压缩平台。下面咱们就拿FW与tinypng进行对比。

前端开发常用软件(前前端开发工程师)(4)

样图原效果

上面这个样图是组长从手机里拷贝出来的照片,大小为309K。

前端开发常用软件(前前端开发工程师)(5)

tinypng处理图片

前端开发常用软件(前前端开发工程师)(6)

经过tinypng处理后的样图效果

把这张样图通过tinypng优化处理后,发现只有70K左右,不得不说确实强大,平台已经给出了77%的压缩率,而且处理后的样图颜色没有丢失(至少肉眼观察是这样),果然强悍!

前端开发常用软件(前前端开发工程师)(7)

经过FW品质80处理

前端开发常用软件(前前端开发工程师)(8)

FW80品质处理后的样图效果

接下来,我们用FW进行处理,品质调为80。压缩后同样为70K左右!这里说明一下,在FW里压缩图片,80是比较安全的品质,清晰度不会产生影响。如果觉得图片还不够小,可以调到75,75以下图片效果就不保证了。

前端开发常用软件(前前端开发工程师)(9)

经过FW品质75处理

前端开发常用软件(前前端开发工程师)(10)

FW75品质处理后的样图效果

品质调到75,压缩后样图大小为57K左右,相比80的品质,样图大小又减小了13K,并且样图效果无明显模糊。

前端开发常用软件(前前端开发工程师)(11)

通过tinypng与FW处理后的样图效果对比图

通过上面三张样图对比,色彩、清晰度均无明显差别。不受限于网络,图片压缩大小随心所欲调整,FW在图片优化方面在今天看来仍然毫无槽点!

FW作为网页三剑客中的一员,从来都是以图片优化处理闻名,当然做设计也是没有问题的,只不过效果没长PS那么丰富细腻而已。在当初服务器硬件配置、网络传输速率都十分有限的情况下,图片压缩质量是相当重要的指标。只不过在互联网软硬件技术突飞猛进的今天,这方面的要求可能不是那么高了。这可能也是FW走到今天这个困境的主要原因了。

前端开发常用软件(前前端开发工程师)(12)

FW批处理功能

不过,如果你在从事前端开发工作,还是要精益求精,而图片压缩效果就是精、细的体现之一。大家在工作中若有图片压缩方面的需求,不防可以试一试这个快被遗忘的软件。并且它还有个非常“霸道”的功能——批处理,多少图片都可以一次改尺寸、一次压缩完成。

(作者:科技组长)

,