首页 > 网站制作推广 > 网页图像优化
2017
10-14

网页图像优化

网页图像优化
初学者的指南,为你的网站图片优化
图像的网页优化
我们都遇到了他们;网站下载时间太长。我注意到许多人没有花时间去优化他们的维克斯网站形象,这可以导致缓慢的加载时间。高度可视化的网站摄影网站在线等,投资组合,更容易发生危险。所以在您所有的痒,确保你的图像进行适当优化网站。真的,质量小的牺牲是必要的,但如果做得正确的平均眼睛不会注意到它,你就会有一个更容易获得网站干净。

初学者的指南,为你的网站图片优化

原始图像:223kb
这个图像将花费约25秒(!!!)在56kbps连接负载。

网页图像优化


关于图像格式的事实
有许多图像格式,但在网络上只有很少的工作。为了压缩你的图片,你首先需要知道的有两种:有损和无损图像压缩。
有损压缩意味着一旦你解压缩的压缩数据,你不会得到相同的图像作为原始。然而,这只会在仔细看可见。一个显著的好处就是这些图像使用少量的内存是足够相似的原始图像。

格式
JPEG
此图像类型是有损的,你可以控制在图像编辑压缩级别。这是保存图像有数百万种颜色,好喜欢的照片,有许多差别的图纸,包含图像的梯度等。
GIF
这种格式是位图,这基本上意味着它是一个由微小的像素的正方形网格。每一个像素数据保存(所以它是无损),您可以节省高达256的颜色。像素也可以是透明的。GIF可能包含多个帧,因此可以动画。它是用较少的颜色,图像保存好格式如图,小图形(子弹,网站按钮),包含文本和其他重要的细节图像,平面彩色图和动画图片。
PNG
具有比GIF更大的颜色深度,它可以存储的透明度,可以提供更大的压缩。最好在这种格式保存的图像,当你想保持他们的alpha通道透明度。

新手指南来优化图像为您的网站-步骤1

PNG格式,(灰色的方块是透明的)

对网页保存
在选择格式保留此图在心:
GIF

    如果动画需要。
    线图和简单的图形。

JPEG

    照片,特别是没有高对比度。
    截图,尤其是电影,游戏,或类似的内容。

PNG

    艺术线条,插图。
    高反差的照片。
    透明,alpha通道透明度。
    应用截图或其他详细图解。

如何压缩图像
保存图像为图像输出为Web网页选项下文件>另存为网页和设备发现(按Ctrl + Shift + Alt + S)。

网页图像优化

保存图片为您的网站

    选择文件>另存为网页…
    选择JPEG,PNG或者GIF。
    首先选择高质量水平,如果图像是可见的,如果你想使用它作为背景的媒体或Low。
    有质量控制,使用滑块或输入字段中的质量数。
    看文件的大小和估计的加载时间在左下角显示在调整设置。同时,看图像决定什么质量看上去不够好。
    一旦你发现质量和压缩之间的完美平衡,点击保存按钮。

如果这是一个背景,确保文件大小在5kb。如果图像是一个布局标题,到40kb。如果它的图像被显示在页面上,20-30kb。

压缩图像。25kb。原始图像大小12%!
这个图像会加载在5秒左右在56kbps连接


本文》有 0 条评论

留下一个回复