V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
MonoLogueChi
V2EX  ›  问与答

为什么前端切图大多用长方形图?

  •  
  •   MonoLogueChi · 2019-10-17 17:44:20 +08:00 · 1768 次点击
    这是一个创建于 1624 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我见过的网站或者项目,前端切图的时候基本都是用长方形的图片,有没有人能解释一下为什么要拼成长方形的图片?

    从图片压缩的角度来说,越接近正方形的图片压缩效果越理想(这个我自己实验过的,16 张图排成 4*41*16 差别很大)。

    14 条回复    2019-10-18 09:05:26 +08:00
    siys
        1
    siys  
       2019-10-17 17:46:25 +08:00   ❤️ 1
    因为只要长和宽差了一点点他就不是正方形
    MonoLogueChi
        2
    MonoLogueChi  
    OP
       2019-10-17 17:52:45 +08:00 via Android
    @siys 不是差一点的那种,是整个一长条
    Leez088
        3
    Leez088  
       2019-10-17 17:56:02 +08:00
    可能图标坐标容易取吧
    ShangAliyun
        4
    ShangAliyun  
       2019-10-17 17:57:35 +08:00
    前端的更在乎黄金比例,不太在乎图片大小
    b821025551b
        5
    b821025551b  
       2019-10-17 17:57:47 +08:00
    因为左右两张图,百分比长度可能会导致撕裂
    MonoLogueChi
        6
    MonoLogueChi  
    OP
       2019-10-17 19:29:11 +08:00 via Android
    @Leez088 这个有可能,但是排列规整的话正方形坐标应该也不难取吧
    CallMeReznov
        7
    CallMeReznov  
       2019-10-17 19:35:30 +08:00
    切长方形一行一行的只需要上下对齐
    切正方形太小就得一行拼,载入不完全时会错误,体验不好,而且麻烦
    所以,都是长条一行一行拼


    我原来最早学 Dreamweaver 和 Fireworks 的时候就要切长条的,也没说为什么。
    lamada
        8
    lamada  
       2019-10-17 19:57:58 +08:00 via iPhone
    问的太宽泛了,另外也不差这点流量,内存占用也是一样的
    rykka
        9
    rykka  
       2019-10-17 20:45:52 +08:00 via Android
    切图考虑的是图片本身,跟图像压缩无关
    需要优化图片下载有 Sprite 工具可用
    MonoLogueChi
        10
    MonoLogueChi  
    OP
       2019-10-17 22:01:52 +08:00 via Android
    @rykka @lamada 我是做游戏的,对图片处理稍微有点强迫症,这种图片不是接近正方形,或者不是 4 的倍数都有点不能接受
    rykka
        11
    rykka  
       2019-10-17 22:05:03 +08:00
    @MonoLogueChi 那做 sprite 动画的时候,也是需要 sprite 工具的吧,不可能切出来的每幅动画都是正方形
    ragnaroks
        12
    ragnaroks  
       2019-10-17 22:12:19 +08:00
    前端应该是走的路多了吧,
    我以前用 unity 做游戏,很多工具也确实默认导出就是正方形,即使有很多留白.
    MonoLogueChi
        13
    MonoLogueChi  
    OP
       2019-10-17 22:34:24 +08:00 via Android
    @rykka 对,是拿工具拼的
    lamada
        14
    lamada  
       2019-10-18 09:05:26 +08:00 via iPhone
    @MonoLogueChi 那确实可以理解,但除开 webgl(影响也不大),强行切成正方形确实容易留白,这留白多的部分也是内存的浪费,pc 还好,移动端可能就比较在乎
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   964 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 20:24 · PVG 04:24 · LAX 13:24 · JFK 16:24
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.