陀螺仪测试图像分析
This article was sponsored by Cloudinary. Thank you for supporting the partners who make SitePoint possible.
本文由Cloudinary赞助。 感谢您支持使SitePoint成为可能的合作伙伴。
Because images dominate page weight, methodical image optimization can have a significant effect on conversions and user experience. The performance tools you choose to use can have a powerful impact on how websites are built and maintained. One such popular open source tool is WebPagetest. It is designed to measure and analyze webpage performance, which is why Cloudinary chose to partner with our friends there to launch Website Speed Test.
由于图像在页面权重中占主导地位，因此系统的图像优化可能会对转换和用户体验产生重大影响。 您选择使用的性能工具会对网站的构建和维护产生巨大影响。 WebPagetest是这样一种流行的开源工具。 它旨在测量和分析网页性能，这就是为什么Cloudinary选择与我们那里的朋友合作推出Website Speed Test的原因 。
Website Speed Test is an image analysis tool that provides detailed optimization insights beyond a simple compression check. The tool leverages Cloudinary’s advanced algorithms to demonstrate how changes to image size, format, quality and encoding parameters can result in significant reductions in file size while maintaining perceived quality. In short, Website Speed Test shows the why and how of image optimization.
网站速度测试是一种图像分析工具，除了提供简单的压缩检查之外，还提供了详细的优化见解。 该工具利用Cloudinary的高级算法来演示图像大小，格式，质量和编码参数的更改如何在保持可感知质量的同时显着减小文件大小。 简而言之，“网站速度测试”显示了图像优化的原因和方式。
Advanced algorithms take into account many factors when examining images, including the exact content of an image and the need for responsive design. The resulting insights enable you to ensure that images are encoded correctly, optimized for performance, and look their best regardless of bandwidth, viewing browser, device or viewport.
先进的算法在检查图像时会考虑许多因素，包括图像的确切内容以及对响应设计的需求。 由此产生的洞察力使您能够确保图像正确编码，针对性能进行了优化，并且无论带宽如何，查看浏览器，设备或视口如何，它们的外观都最佳。
At the top of the page, the report shows the total weight of images, potential compression and ‘Page Image Score’: a grade ranging from A-F. This grade is based on the image format used, fit between image resolution and the displayed size in the graphic design, and compression rate of all the images that were analyzed.
该报告在页面顶部显示图像的总重量，潜在的压缩率和“页面图像得分”：从AF到不等。 该等级基于所使用的图像格式，图像分辨率与图形设计中显示的大小之间的适合度以及所分析的所有图像的压缩率。
The overview is followed by a detailed analysis of each image, with performance insights and recommendations for improvement.
概述之后是对每个图像的详细分析，并提供性能见解和改进建议。
Presents the current version of the image being analyzed along with its image score.
显示正在分析的图像的当前版本及其图像得分。
Presents an optimized version of the image, using the same format as the original image, with the following adjustments:
使用与原始图像相同的格式，显示图像的优化版本，并进行以下调整：
Correctly-sized images – scales the image down to the actual required dimensions on the web page 尺寸正确的图像–将图像缩小到网页上实际所需的尺寸 Intelligent content-aware encoding – analyzes the image to find the best quality compression level and optimal encoding settings, based on the content and viewing browser, producing a perceptually fine image while minimizing the file size. 智能的内容感知编码–根据内容和查看浏览器，分析图像以找到最佳质量压缩级别和最佳编码设置，从而在缩小文件大小的同时生成可感知的精细图像。Learn more about these manipulations
了解有关这些操作的更多信息
This tab shows how optimization works for different image formats and the impact on image weight.
此选项卡显示了优化对不同图像格式的工作方式以及对图像权重的影响。
Linked from a new Image Analysis tab, Cloudinary powers WebPagetest with robust image analysis capabilities, enabling you to receive valuable data and guidance on how to manage images and deliver an optimal user experience.
通过新的“图像分析”选项卡链接，Cloudinary通过强大的图像分析功能为WebPagetest提供支持，使您能够接收有价值的数据和有关如何管理图像并提供最佳用户体验的指南。
The Website Speed Test tool provides insights on the why and how of optimization. While you may be able to optimize an image or two manually, the process becomes exponentially more complicated when you need to scale up, managing hundreds, thousands, or even millions of images delivered to a website.
网站速度测试工具可提供有关优化原因和优化方式的见解。 尽管您可以手动优化一两个图像，但是当您需要放大，管理交付给网站的数百，数千甚至数百万个图像时，该过程将成倍增加。
For the best user experience, each image should be enhanced and optimized to meet the viewing context. This entails automatically adapting the image to fit the layout of the page and selecting the optimal quality and encoding settings.
为了获得最佳的用户体验，应该对每个图像进行增强和优化以满足观看环境。 这需要自动调整图像以适合页面布局，并选择最佳质量和编码设置。
Accomplishing this type of optimization is no ordinary feat. Optimizing images for different browsers, devices and bandwidth requires considerable knowledge of the intricacies of image formats, encoding parameters and visual quality metrics. For example, it makes sense that a smaller image file size will result in faster load time, less bandwidth usage and a better user experience. However, reduce the file size too much, and image quality could suffer and impair user satisfaction. This is where Cloudinary’s automatic optimization comes in play.
完成这种类型的优化绝非易事。 针对不同的浏览器，设备和带宽优化图像需要对图像格式，编码参数和视觉质量指标的复杂性有足够的了解。 例如，有意义的是，较小的图像文件大小将导致更快的加载时间，更少的带宽使用和更好的用户体验。 但是，减小文件太大，会降低图像质量并损害用户满意度。 这就是Cloudinary的自动优化发挥作用的地方。
You can create your free account here.
您可以在此处创建免费帐户 。
翻译自: https://www.sitepoint.com/introducing-website-speed-test-an-image-analysis-tool/
陀螺仪测试图像分析
