咱们聊点实在的。
搞网站的时候，很多新人最怕的就是图片。不是怕不会弄，是怕弄不好。网站加载慢得像蜗牛，百度蜘蛛都嫌弃。或者图片歪歪扭扭，在手机上看直接糊成一团。那网站建设需要什么格式的图片，这事儿真不能糊弄。
今儿个我不扯那些高大上的理论，就聊聊我这些年踩过的坑，顺便教你们咋整。
第一步，得搞清楚，到底啥图该用啥格式。别不管三七二十一，全拿个JPG或者PNG糊弄事。
首先是PNG。这玩意儿适合干啥？适合那种背景透明的图。比如你做个Logo，或者某些图标，得透明底儿才好看是吧？PNG保存这些时候，线条锐利，文字清晰。但是！千万别拿PNG去存那种几十兆的照片，那会让你的服务器哭的。PNG体积大，传得慢。所以，图标、Logo、透明背景素材，无脑选PNG。
然后是JPG，或者叫JPEG。这个大家最熟。照片、海报、那种颜色丰富的图，用JPG准没错。它能压缩，体积小。但是有个毛病，它不支持透明，而且压缩太狠了会模糊，有那些恶心人的噪点。如果你发现你的大图在手机上看着有锯齿，那就是压缩比没设好。一般建议75%-85%的质量，肉眼看着差不多，体积小一半。
还有个小妖精，叫WebP。这是谷歌搞出来的好东西。现在的浏览器基本都支持。它的特点是，同样画质下，体积比JPG小30%左右，比PNG还小。如果你的服务器支持，或者你用了云存储，强烈建议转成WebP。现在的趋势就是这。不过有个小麻烦，就是老式浏览器可能不认，你得做兼容处理，但这对于普通个人站长来说，稍微复杂点，先不管，主打一个简单粗暴，就用WebP，不行再回退。
第二步，图片压缩。这一步太重要了。很多人直接上传原图，那是自杀。
你得下工具。电脑上用tinypng，网页版的，免费好用。拖进去，它自动给你压。有时候压完之后你会发现，妈蛋，怎么还更小了？对，就是那样。别心疼那一点点画质损失，用户又不会拿放大镜看。
手机端截图或者拍照的图片，千万别直接传。像素太高，手机屏才多大？你传个4000万像素的图上去，除了浪费流量和增加加载时间，没任何卵用。缩放到1920x1080，或者更小的宽幅，足以应付绝大多数显示器。
第三步，规范命名。别叫“新建文件夹(2).jpg”。真的，看着都心烦。SEO懂不懂？搜索引擎不识字吗？它看的是文件名。
比如你写篇讲做饭的文章，图片名叫“红烧肉.jpg”或者“hongshaorou.jpg”，好过“DSC00234.jpg”。这不仅对seo有帮助，以后你找图也快。
再说说Alt属性。这是很多人忽略的。图片加载失败的时候，或者屏幕阅读器读给你的时候，得知道这是啥吧？
给每张重要的图加上Alt描述。别写“图片1”，写“某某品牌的男士休闲西装”。这细节，能体现你的专业度。
还有一点，响应式图片。现在谁还在用台式机啊？全是手机。你得保证图片在不同屏幕下大小合适。可以用srcset这个属性，或者懒加载。懒加载就是，用户往下滑，图片才出。这样首屏加载速度嗖嗖的。
最后，总结一下。
网站建设需要什么格式的图片？核心就三点：透明选PNG，普通照片用JPG，追求速度上WebP。
别忘了压缩，别忘了命名，别忘了Alt。
别总想着一步到位，完美主义是网站的大敌。先跑起来，再优化。我前阵子有个朋友，非要把所有图都做成4K分辨率，结果网站打开得三分钟，访客跑了一半。心疼我吗？我不心疼，我只觉得他傻。
还有个小细节，字体图片。别把文字直接做成图。那是大忌。文字要做成HTML，这样用户可以复制，搜索引擎能抓取，还能根据用户的系统设置缩放。做成图，啥都干不了，还费流量。
行了，就唠叨这么多。照着做，你的网站图片部分至少能及格。要是还想高分，那就去研究下AVIF格式，那是未来的事，现在先管好WebP就行。
记住，网站是给人看的，也是给机器跑的。两边都得哄高兴了，才能长长久久。别偷懒，别投机，老实点干活，数据不会骗人。
要是你还有什么奇怪的图片问题，比如GIF动图，那是给小动画用的，别拿它做大背景，太卡。还有SVG，矢量图，无限放大不失真，适合做复杂的图标和插画，也是好东西，值得单独写一篇讲讲，下次再说。
今天就这样，收工。去检查检查你的图片格式吧。
