zoukankan      html  css  js  c++  java
  • 手机加载优化

    人们常说,现在的流量不值钱了,图越大越好咯!

    我想说的是,浏览器虽然不值钱了,但速度还是略快吧!

    文章来自:UI妹儿

     

    icon_alipay.png→iPhone 1-3代的手机(已经不考虑了)

    icon_alipay@2x.png→iPhone4/4S/5/5S/6/6S/7对应尺寸,这就是我们通常所说的2倍图

    icon_alipay@3x.png→iPhone6P/6SP/7P使用的尺寸,这就是3倍图

     

    评论者:

    A、到底哪些资源需要切图,哪些不需要切图?

     

    ① 只要是无法用代码来实现和表达出来的,就需要切图

    ② 如果实在不清楚要不要切图,多和开发沟通,他会告诉你哪些是需要你切图的

     

    B、切图需要切几套?(这里我只以iOS作为标准,安卓下期再说)

     

    ① 理论上,我们需要切3套图,是为了更好的适配。

    ② 在实际工作中,iOS只需要切2套图就可以,分别为:@2x和@3x

     

    C、切图该怎么命名,不会命名怎么办?

    之前我专门写了一篇关于界面切图命名规范的文章,请戳进去:

    《UI设计师必须要知道的界面切图命名规范(升级版)》

     

    注意:切图是需要注意几点:

     

    ① 切图输出格式必须为png24位、png8位、jpg格3种格式

    ② 同一模块内,切图大小应保持一致

    ③ 切图输出大小必须保持为偶数

    ④ 为了减小包的大小,所有切图尽量压缩后在给开发(包越小,你的boss越高兴,说不好会给你多发点年终奖哈)

    具体更详细的规范你可点击查看《iOS界面设计规范》,谢谢

    D、实现(可解决的方案):

    1.@media(加载不同样式)

    2.使用插件:http://imulus.github.io/retinajs/

  • 相关阅读:
    oracle10G/11G官方迅雷下载地址合集(转载)
    Oracle数据库的登录以及常用数据导入查询
    Tomcat添加SSL网站证书配置
    SVN的安装与在IDEA中的配置
    01-Spring Boot配置文件详解
    微服务概况及注册中心搭建
    zk实现分布式锁
    ZooKeeper初识
    Reids集群知识
    redis初识
  • 原文地址:https://www.cnblogs.com/cisum/p/8629706.html
Copyright © 2011-2022 走看看