售前咨询 售后咨询
当前位置: 上海网站设计 > 建站知识 > 建站教程

〖更新〗2016年网页设计常用图片格式识别诀窍

网站编辑:小润 | 发表时间:2019-02-02 23:24:58

互联网上文字、图片和色彩是网页设中必不可以的三大元素,其中文字有字体、字号、颜色等进行区分,图片主要以图片格式进行区分,色彩以色相、色调进行区分。在不同的网页中这三种元素所占的比重也是不同的,合理的将这三大元运用到网页设计中是每位网页设计师的必备技能。掌握识别图片格式的诀窍是每个网页设计师的必修课,在2016年里,润壤科技经过半年的沉淀,对最新的2016年网页设计常用图片版格式识别诀窍进行了总结。

图片可以带浏览网页的人们带来丰富的色彩和强烈的视觉效果,同样也为网页增加了点缀和修饰,在网页设计中合理的利用图像,选择适合的图片格式不但可以将让设计得到合理的显示效果、甚至还可以有效的控制图档的档案大小,节省下载时间、有效的减少服务器的负担。图片在网页中是以一定的图片格式存在的,常见的图片格式有很多种,如:JPG、GIF、PNG、BMP、TIFF、TGA等等,其中网页设计常用的有JPG、GIF、PNG三种。我们只有了解JPG、GIF、PNG了这三种网页设计常用格式的概、特性后,才能有效的利用这些常见的图像文件格式是优化自己的图形设计。想要识别并运用如图片格式就需要对它们进行深入的了解,下面润壤科技就来与大家分享一下我们的识别诀窍。




识别JPG格式图片的诀窍

1、什么是JPEG图片格式

JPEG图片格式,简称JPG,全称为Joint Photographic Experts Group,支持24位颜色,并保留照片和其它连续色调图像中存在的亮度和色相的显著和细微变化。目前网络上最流行的一种图像格式为JPEG图片格式,在Web上使用仅次于GIF图像格式。JPEG格式是专门用于不含大色块的图像。JPEG的图像有一定的失真度,但是在正常的损失下肉眼分辨不出来的。,而JPEG文件只有GIF文件的1/4大小。JPEG格式不支持透明图和动态图。

2、JPEG格式的特性

JPEG格式是一种可以把文件压缩到最小的格式,因为其可压缩的特性,也使JPEG成为了一种很典型的使用破坏性压缩的图档格式。所以JPEG 压缩称为损耗压缩。较高品质的设置可以使图片弃用的数据较少,但是JPEG压缩方法会降低图像中细节的清晰度,尤其是包含文字或矢量图形的图像。图片多次重复进行JPEG格式的储存将会永久性地破坏图片中的细节。目前各类浏览器均支持JPEG这种图像格式,因为JPEG格式的文件尺寸较小,下载速度快。

PS:JPEG图片格式非常适合作为储存像素色彩丰富的图片、例如照片等等,这些图片即使有些微的失真也不容易轻易的察觉:而反过来说JPEG并不适合用来储存线条图、图标或文字等等有清晰边缘的图片。

识别GIF格式图片的诀窍

什么是GIF图片格式

GIF图片格式是一种索引型格式,全称为Graphics Interchange Format,是GIF图片格式可以用来存储各种图像文件。特别适用于存储线条、图标和电脑生成的图像、卡通和其它有大色块的图像,含有多达256种的颜色。每一个象素点都有一个对应的颜色值。GIF图片格式在存储时使用的是无损压缩的格式,这意味着当你修改并且保存了GIF图片时,它的质量不会有任何损耗。GIF图片格式可以用来存储各种图像文件。特别适用于存储线条、图标和电脑生成的图像、卡通和其它有大色块的图像。

GIF图片格式的特性

Gif图片格式在许多特性与表现上都与JPEG图片格式有着相对的特性,GIF格式使用的是无损压缩格式存储,但却限制了色彩的表现能力、能够有效地节省图片尺寸。GIF图片格式只拥有8位的颜色深度信息,这里所说的8位是指2的8次方也就是256色,只要你的图片中出现的色彩在256色以内时,使用GIF格式可以得到相当好的输出质量、同时兼顾了档案大小。因此GIF格式非常适合用来表现图标、UI接口、线条插画、文字等部分的输出。

PS:GIF图片格式的在网络上的适用性很强,几乎不用担心浏览器的支持的问题:几乎100%的浏览器都支持它。GIF格式透明度的值是一种布尔类型数据,GIF图片里的一个象素要么完全透明,要么完全不透明。GIF格式还可以创建动画图像,原理就是GIF格式将多幅图像保存为一个图像文件,从而形成动画,其中最常见的就是通过一帧帧的动画串联起来的搞笑gif图,所以归根到底GIF仍然是图片文件格式。

识别PNG格式图片的诀窍




什么是PNG图片格式

PNG图片格式一种无损压缩格式,全称为Portable Network Graphic,最多可以支持32位颜色,不支持动画图。虽然是网络上的常用格式,但是如果没有插件支持的话,有的浏览器可能不支持这种格式。PNG图片格式最初的开发目的是为了作为GIF的替代方案的,分为PNG-8以及PNG-24两种格式。PNG-8的特性很接近GIF,支持256色以及透明背景的特性,而PNG-24则支持了多达160万个色彩。

PNG图片格式的特性

PNG图片格式的图片又分为PNG-8、PNG-24两种。其中,PNG-8与GIF类似,支持256色调色板,而PNG-24只支持48位真彩色,凡是GIF拥有的优势PNG-8都拥有,GIF 所没有的优势PNG-8也有,同样的文件,PNG-8格式比GIF要小,PNG-8的特点使得它在网站设计切图环节深受网站设计师的喜爱。PNG可以以任何颜色深度存储图像,也支持高级别的无损耗压缩、支持伽玛校正,支持交错,受最新Web浏览器的支持,能够提供长度比GIF小30%的无损压缩图像文件,最高支持48位真彩色图像以及16位灰度图像,渐近显示和流式读写,深圳网站设计不足的是较旧的浏览器和程序可能不支持PNG文件。

PS:同一图像的PNG-24文件常比JPEG文件大。该格式除了支持背景透明度和背景杂边外,PNG-24格式还支持多色阶透明度。多色阶透明度允许保留多达256个色阶的透明度(不是所有的浏览器都支持),可以平滑地将图像边缘与任何背景色混合。PNG用来存储灰度图像时,灰度图像的深度可多到16位,存储彩色图像时,彩色图像的深度可多到48位,并且还可存储多到16位的α通道数据。PNG使用从LZ77派生的无损数据压缩算法,一般应用于JAVA程序、网页或S60程序中,原因是它压缩比高,生成文件体积小。

总结

在了对以上三种网络常用的图片格式估了详细的了解后,再掌握了〖最新〗2016年网页设计常用图片格式识别诀窍就能分析出哪种格式最适合我们的需。由于JPEG与GIF和PNG都有着如此不同的特性,因此我们可以很轻易的选择何时该用哪一种格式来输出我们需要的图档。

第一。当图片拥有丰富的色彩时,并且没有明显锐利反差的边缘线条时,选择 JPEG 可以得到最好的输出结果。

第二,当图片是拥有明确边缘的线条图、没有使用太多色彩、甚至可能需要透明背景时,GIF 是很完美的选择,档案小、画质又精美。

第三,当图片颜色简单对比强烈的则需要采用PNG,选择PNG格式时设计师必须根据图片需求来选择不同的图档格式,并且对其做适当的调整。还需要注意的就是浏览器支持度的问题。

另外还有一个原则就是用于页面结构的基本视觉元素,如容器的背景、按钮、导航的背景等应该尽量用PNG格式进行存储,这样才能更好的保证设计品质。而其他一些内容元素,如广告Banner、商品图片等对质量要求不是特别苛刻的图片,则可以用JPG去进行存储,这样可以有效降低文件大小。


>>关注之篇文的人还在在看:
手机网站建设如何充分利用网页设计三剑客?
网页设计对于图片的运用有哪些特殊要求?
快看!如何为动漫网站打造出酷炫的网页设计

解析:利用合理配色突出网站页面设计风格的三大技巧

深度挖掘微信网站与手机网站的四大本质区别



TAG标签耗时:0.0091578960418701 秒

关键字:
官方微信
上海市长宁区宣化路300号华宁国际广场中区7层
+021-8031 0607
+135 8590 1130