精华内容
下载资源
问答
  • web图片

    千次阅读 2016-09-04 17:07:31
    图片的不同类型Web图片优化Kraken (Web) 主页:https://kraken.io/智图 (Web) 主页:http://zhitu.tencent.com/ 腾讯ISUX团队有篇文章介绍智图:http://isux.tencent.com/zhitu.html我常用的一个网站: ...

    如何选择图片类型?

    这里写图片描述

    图片的不同类型

    这里写图片描述

    Web图片优化

    Kraken (Web)
    主页:https://kraken.io/

    智图 (Web)
    主页:http://zhitu.tencent.com/
    腾讯ISUX团队有篇文章介绍智图:http://isux.tencent.com/zhitu.html

    我常用的一个网站:
    https://tinypng.com/

    【此篇博文待补充】

    展开全文
  • 闲谈 Web 图片服务器

    千次阅读 2008-03-19 23:26:00
    原贴:http://www.dbanotes.net/web/web_image_server.html闲谈 Web 图片服务器 作者: Fenng | 可以转载, 转载时务必以超链接形式标明文章原始出处和作者信息及版权声明 网址: ...现在很多中小
    原贴:http://www.dbanotes.net/web/web_image_server.html
    

    闲谈 Web 图片服务器

    现在很多中小网站(尤其是 Web 2.0 站点) 都允许用户上传图片,如果前期没有很好的规划,那么随着图片文件的增多,无论是管理还是性能上都带来很多问题。就自己的一点理解,抛砖引玉,以期能引出更具价值的信息。

    事关图片的存储

    把图片存储到什么介质上? 如果有足够的资金购买专用的图片服务器硬件或者 NAS 设备,那么简单的很;如果有能力自己开发单独存储图片的文件系统,那么也不用接着往下看了。

    如果上述条件不具备,只想在普通的硬盘上存储,首先还是要考虑一下物理硬盘的实际处理能力。是 7200 转的还是 15000 转的,实际表现差别就很大。是选择 ReiserFS 还是 Ext3 ,怎么也要测试一下吧? 创建文件系统的时候 Inode 问题也要加以考虑,选择合适大小的 inode size ,在空间和速度上做取舍,同时防患于未然,注意单个文件系统下文件个数别达到极限。

    独立,独立的服务器

    无论从管理上,还是从性能上看,只要有可能,尽量部署独立的图片服务器。这几乎成为常识了(不过在我做过面向 Web 的项目之前就这个问题也被人笑话过)。具备独立的图片服务器或者服务器集群后,在 Web 服务器上就可以有针对性的进行配置优化。比如采用传说中更有效率的 Lighttpd

    如果不想在几台机器间同步所有图片,只用 NFS 模式共享一下即可。注意软、硬连接可能带来的问题,以及 NFS 特定的传输速度。

    独立,独立的域名

    如果大部分 Web 页面必须要载入很多图片,那么需要注意 IE 浏览器的连接数问题(参见对该问题的测试)。

    前几天有个朋友在线上问我,"一些大网站,图片服务器为什么都用另外一个域名? 比如yahoo.com 图片服务器用了 yimg.com 的域名?" ,粗糙一点的答案:除了管理方便,便于CDN 同步处理,上面说的 IE 连接数限制也是个考虑因素吧(其他原因我也不知,有请 Yahoo!的同学发言)

    雅虎 Web 优化 14 条

    关于雅虎 YSlow 工具倡导的 优化 14 条规则,建议每个 Web 维护人员必须倒背如流,当然也应该辩证来看--介绍这 14 条规则的页面本身也只能得到 70 多分...其中的第九条和上面说的独立域名之间多少有些矛盾。实际情况要根据自己的 Benchmark 与具体需求而确定了。

    有效利用客户端 Cache

    很多网站的 UI 设计人员为了达到某些视觉效果,会在一些用户需要频繁访问的页面模块上应用大量的图片。这样的情况,研究表明,对于用户粘度比较高的站点, 在Web 服务器上对这一类对象设置 Expires Header 就是十分有必要的,大量带宽就这么节省下来,费用也节省了下来。顺便说一下,对于验证码这样的东西,要加个简单的规则过滤掉。

    服务器端的 Cache

    在国内,CDN 也是有钱才能玩得起。而类似 Amazon S3 这样的一揽子存储服务,国内还没有出现。所以,充分利用服务器端的 Cache 也是有必要的。Squid 作为反向代理服务器,缓冲图片效果应该说尚可,新浪技术团队贡献的 Ncache 据评测,效果更佳。

    高解析图片问题

    如果网站存在大量高解析度的图片,那么有必要考虑部署 IIPImage 或者类似的软件。

    运营问题

    很多比较有规模的网站对于用户上传的图片不做任何处理,结果页面上还能看到很多 BMP 格式的图片(个人觉得任何网站出现 BMP 格式的图片都是可耻的)...这完全是运营上的策略之误了。找个程序员投入一点时间写个图片处理模块,对那些"截屏"得来的图片做个转换,投入成本可能远 比存储上的开销小,而用户再访问该图片,质量未必能有什么损失,浏览速度无疑好多了。哪种处理方式更让人接受,不言而喻。

    --EOF--

    | | TrackBacks (0) | | Edit

    Generator | Trampoline
    <script type="text/javascript"> </script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script> <script src="http://pagead2.googlesyndication.com/cpa/ads?client=ca-pub-2198040673582211&cpa_choice=CAAQhaT2_gEaCI52gVKP95-sKLGsuIEBMAA&oe=UTF-8&dt=1205940237754&lmt=1205939550&format=ref_text&output=textlink&correlator=1205940237753&url=http%3A%2F%2Fwww.dbanotes.net%2Fweb%2Fweb_image_server.html&region=_google_cpa_region_&ref=http%3A%2F%2Fwww.dbanotes.net%2F&frm=0&cc=100&ga_vid=1685895127.1205940238&ga_sid=1205940238&ga_hid=1215587463&flash=9.0.64&u_h=800&u_w=1280&u_ah=772&u_aw=1280&u_cd=24&u_tz=480&u_his=1&u_nplug=3&u_nmime=4" language="JavaScript1.1" type="text/javascript"></script> Get Firefox with Google Toolbar for better browsing
    <script type="text/javascript"> </script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script> <script src="http://pagead2.googlesyndication.com/cpa/ads?client=ca-pub-2198040673582211&cpa_choice=CAAQidTQgAIaCEapPfRcsfp6KN2uuIEBMAA&oe=UTF-8&dt=1205940238506&lmt=1205939550&prev_fmts=ref_text&format=ref_text&output=textlink&correlator=1205940237753&url=http%3A%2F%2Fwww.dbanotes.net%2Fweb%2Fweb_image_server.html&region=_google_cpa_region_&ref=http%3A%2F%2Fwww.dbanotes.net%2F&frm=0&cc=100&ga_vid=1685895127.1205940238&ga_sid=1205940238&ga_hid=1215587463&flash=9.0.64&u_h=800&u_w=1280&u_ah=772&u_aw=1280&u_cd=24&u_tz=480&u_his=1&u_nplug=3&u_nmime=4" language="JavaScript1.1" type="text/javascript"></script> Generate revenue from your website. Google AdSense.  
    展开全文
  • [转]闲谈 Web 图片服务器

    千次阅读 2008-06-02 16:21:00
    闲谈 Web 图片服务器作者: Fenng | 可以转载, 转载时务必以超链接形式标明文章原始出处和作者信息及版权声明网址: http://www.dbanotes.net/web/web_image_server.html 现在很多中小网站(尤其是 Web 2.0 站点) 都...

     

    闲谈 Web 图片服务器

    现在很多中小网站(尤其是 Web 2.0 站点) 都允许用户上传图片,如果前期没有很好的规划,那么随着图片文件的增多,无论是管理还是性能上都带来很多问题。就自己的一点理解,抛砖引玉,以期能引出更具价值的信息。

    事关图片的存储

    把图片存储到什么介质上? 如果有足够的资金购买专用的图片服务器硬件或者 NAS 设备,那么简单的很;如果有能力自己开发单独存储图片的文件系统,那么也不用接着往下看了。

    如果上述条件不具备,只想在普通的硬盘上存储,首先还是要考虑一下物理硬盘的实际处理能力。是 7200 转的还是 15000 转的,实际表现差别就很大。是选择 ReiserFS 还是 Ext3 ,怎么也要测试一下吧? 创建文件系统的时候 Inode 问题也要加以考虑,选择合适大小的 inode size ,在空间和速度上做取舍,同时防患于未然,注意单个文件系统下文件个数别达到极限。

    独立,独立的服务器

    无论从管理上,还是从性能上看,只要有可能,尽量部署独立的图片服务器。这几乎成为常识了(不过在我做过面向 Web 的项目之前就这个问题也被人笑话过)。具备独立的图片服务器或者服务器集群后,在 Web 服务器上就可以有针对性的进行配置优化。比如采用传说中更有效率的 Lighttpd

    如果不想在几台机器间同步所有图片,只用 NFS 模式共享一下即可。注意软、硬连接可能带来的问题,以及 NFS 特定的传输速度。

    独立,独立的域名

    如果大部分 Web 页面必须要载入很多图片,那么需要注意 IE 浏览器的连接数问题(参见对该问题的测试)。

    前几天有个朋友在线上问我,"一些大网站,图片服务器为什么都用另外一个域名? 比如yahoo.com 图片服务器用了 yimg.com 的域名?" ,粗糙一点的答案:除了管理方便,便于CDN 同步处理,上面说的 IE 连接数限制也是个考虑因素吧(其他原因我也不知,有请 Yahoo!的同学发言) 【还有一个我没考虑到的是 Cookie 的因素,参加楼下高春辉的留言】

    雅虎 Web 优化 14 条

    关于雅虎 YSlow 工具倡导的 优化 14 条规则,建议每个 Web 维护人员必须倒背如流,当然也应该辩证来看--介绍这 14 条规则的页面本身也只能得到 70 多分...其中的第九条和上面说的独立域名之间多少有些矛盾。实际情况要根据自己的 Benchmark 与具体需求而确定了。

    有效利用客户端 Cache

    很多网站的 UI 设计人员为了达到某些视觉效果,会在一些用户需要频繁访问的页面模块上应用大量的图片。这样的情况,研究表明,对于用户粘度比较高的站点, 在Web 服务器上对这一类对象设置 Expires Header 就是十分有必要的,大量带宽就这么节省下来,费用也节省了下来。顺便说一下,对于验证码这样的东西,要加个简单的规则过滤掉。

    服务器端的 Cache

    在国内,CDN 也是有钱才能玩得起。而类似 Amazon S3 这样的一揽子存储服务,国内还没有出现。所以,充分利用服务器端的 Cache 也是有必要的。Squid 作为反向代理服务器,缓冲图片效果应该说尚可,新浪技术团队贡献的 Ncache 据评测,效果更佳。

    高解析图片问题

    如果网站存在大量高解析度的图片,那么有必要考虑部署 IIPImage 或者类似的软件。

    运营问题

    很多比较有规模的网站对于用户上传的图片不做任何处理,结果页面上还能看到很多 BMP 格式的图片(个人觉得任何网站出现 BMP 格式的图片都是可耻的)...这完全是运营上的策略之误了。找个程序员投入一点时间写个图片处理模块,对那些"截屏"得来的图片做个转换,投入成本可能远比存储上的开销小,而用户再访问该图片,质量未必能有什么损失,浏览速度无疑好多了。哪种处理方式更让人接受,不言而喻。

    --EOF--

    展开全文
  • web图片优化

    千次阅读 2010-05-31 16:28:00
    使用YSlow 的Smush.it 工具,对web站点的图片进行优化。

        周六参加web交流会www.w3ctech.com ,获益匪浅。开发中只是使用YSlow 的Grade评级进行web站点优化,却没有发现,其实YSlow的Tools也相当强大。

     

         这里,我就现学现卖。讲讲使用YSlow的Smush.it 进行web图片的优化。

     

    1. 首先,还是使用前端开发的不可缺少的利器--FireFox 浏览器。安装上YSlow--Add-ons

     

     

    2.  Get Add-ons,搜索yslow

     

     

    3. 安装

     

     

    4. 重启Firefox

     

    5. 输入要进行分析的web站点后,选择 YSlow -- Tools -- All.Smush.it

     

     

     

    6. Firefox 会弹出一个新的页面,显示分析处理后的结果

    我已我们公司的产品www.atelink.com 登录页做测试后,可以发现,仅仅是一个登录页,图片可以压缩处理28.36%.

     

    点击“Download Smushed images” 可以将经过Yahoo站点压缩过的图片打包下载下来。

     

    如果想保持图片的目录结构(比方说有图片是在global/images 目录下,有的是在content/images 目录下),勾选"keep Directory structure in zip file"。

    通过这种方式,可以直接替换网站的图片文件即可。但是,需要注意的是,如果图片是使用css的background-image 设置的,那么需要更改相应的css代码。

     

     

     

    PS: 将鼠标放在图片名称上,会显示该图片的缩略图。 真的是太强大了~~  O(∩_∩)O...

     

     

    7. 使用UPLOADER ,我们可以选择本地文件上传后,通过Yahoo网站处理后,然后下载图片文件。

     

        

     

     

    WEB标准化交流会是由“WEB标准化联盟”(46077068)在2009年发起的线下活动。在每月的最后一个周六,与Web从业者共同研究并讨论前端动态。本活动以技术交流为目的,不收取任何费用。官方站点是www.w3ctech.com ,期待你的加入,共同学习,分享经验。

     

     

    展开全文
  • Web图片服务器准备NFS共享

    千次阅读 2011-07-28 08:16:44
    正在准备Web图片服务器,打算用NFS做共享将图片分布在不同的机器上。对NFS的配置和挂载做个笔记,免得老忘记:环境:服务器和客户端都是ubuntu10.04NFS Server: 192.168.1.105$ sudo apt-get install nfs-kernel-s
  • Web图片在线压缩优化工具

    千次阅读 2017-11-01 14:00:33
    如今的Web设计中,图片的应用是必不可少的,为了更好地设计网站效果,大体积的图片被越来越多地应用到Web设计中来,所以,更好地优化图片文件,减少图片文件的体积就变的非常重要,这里为大家介绍的几款图片压缩工具...
  • 手机web图片左右滑动动画效果分享

    千次阅读 2016-01-17 19:55:51
    最近在做一个手机端web站点,里面有一个图片展示效果: 1、点击任意图片图片全屏展示,左右滑动能展示其他的图片。 2、滑动超过一定范围自动滑到下一张图片,不超过则回退到当前照片位置。此处的滑动要带动画...
  • jQuery图片延迟加载插件jQuery.lazyload,使用延迟加载在可提高网页下载速度,帮助减轻服务器负载。 script src="jquery-1.11.0.min.js">script> script src="jquery.lazyload.js?v=1.9.1">script> "text...
  • Web 图片引用之相对路径与绝对路径

    千次阅读 2019-11-06 14:34:07
    相对路径与绝对路径,在 Web 开发中我们会经常遇到,本文将尽可能详细的讲解相对路径与绝对路径的区别,并举例说明。 一、基本概念 相对路径(Relative Path): 相对路径就是指由这个文件所在的路径引起的跟其它...
  • [转]Web图片上传控件发布-Xproer.ImageUploader http://www.cnblogs.com/xproer/archive/2010/08/09/1796077.html
  • 各种Web图片格式及其应用场景

    千次阅读 2018-09-07 19:02:14
    通常网页在显示的图片(图形)的时候,有以下几种格式:GIF、PNG、JPG、SVG,还有个比较新的WebP格式。 ▍GIF 优点:GIF是动态的;支持无损耗压缩和透明度。 缺点:的详细的图片和写实摄影图像会丢失颜色信息...
  • js实现手机web图片左右滑动效果

    千次阅读 2018-06-06 17:02:19
    此处的滑动要带动画效果实现:每张图片外面一个div,将其宽度设置为100%,最外层有一个div[命名为outerDiv],其宽度设为:总图片数量*100+‘%'。给最外层div设置touchstart,touchmove,touchend事件监听处理函数,在...
  • web图片预加载的几种方式

    千次阅读 2018-06-13 18:59:22
    类似H5和一些动画元素都需要提前加载完一些图片 如果图片在使用之前就已经请求过了, 那么再次使用的时候,就不会再去请求(ps:图片路径一样)。 1.使用纯的css进行图片预加载 body:after { content: &...
  • 移动web图片高度自适应的解决方案

    千次阅读 2017-11-02 00:15:22
    由于图片的加载是在dom加载完成之后进行的,于是,在手机端浏览网页时,经常会看到页面刚打开时很多内容叠在一起,当图片加载完成后,页面会由于图片加载完成出现明显的抖动 针对这个问题,有以下几种解决方案 ...
  • web前端图片极限优化策略

    千次阅读 2016-01-22 11:03:24
    随着web的发展,网站资源...一、现有web图片格式 我们先来看下现在常用的web图片的格式: 图片格式 支持透明 动画支持 压缩方式 浏览器支持 相对原图大小 适应场景 b
  • Eclipse web工程图片引用

    千次阅读 2014-12-05 21:42:00
    Eclipse web工程图片引用
  • SharePoint 2010 图片播放器Web部件

    千次阅读 2014-06-03 22:55:08
    SharePoint图片播放器Web部件
  • web前端 图片缩放特效

    千次阅读 2017-06-19 22:56:34
    web前端 图片缩放特效 如下图: 当鼠标进入div框内;图片发生放大或缩小
  • SharePoint 2010 缩略图 Web Part Web 部件,本WebPart以缩略图布局显示来自SharePoint图片库的图片
  • SharePoint 2010 图片Web部件

    千次阅读 2014-06-03 22:47:24
    SharePoint图片Web部件 此图片Web部件
  • 写了一个web项目,参考其他人的网站,看到有的图片存放在服务器, 有的存放在文件里,显示页面时再下载,图片存在哪里比较好呢?还有需要存数据库吗?
  • WEB开发的图片素材

    热门讨论 2008-02-27 16:48:42
    WEB开发的图片素材
  • ASP.NET WebApi 图片上传

    千次阅读 2017-11-07 07:39:00
    遇到的问题(基于Web服务前后端分离开发):(1)服务端通过文件流的形式把图片上传至服务器指定的文件夹下,但是部署以后却不能实现图片上传。解决的方法:(2)主要原因没有理解Web项目的本质:浏览器相当于客户端,当...
  • web中的图片(img/background)操作

    千次阅读 2018-12-01 15:50:45
    web图片的格式(大部分格式) 图片格式 压缩方式 透明度 动 画 适应场景 jpg 有损压缩 不支持 不支持 照片|文章配图|广告图 png 无损压缩 支持 不支持 透明图|图标...
  • web项目引用WEB-INF下面的图片例子

    千次阅读 2019-04-20 20:31:51
    web项目引用WEB-INF下面的图片例子
  • 控制web前端图片位置

    千次阅读 2021-02-16 15:52:06
    控制图片位置: 距离页面右端 margin-right:200px 距离页面左端: margin-left:200px 距离页面顶部: margin-top:200px 距离页面底部: margin-bottem:200px
  • java web读取显示图片

    千次阅读 2017-10-27 08:43:54
    一般读取显示图片最简单的是在标签中的src属性中直接写图片地址,但是这样的话会暴露图片存放目录,因此可以让请求通过controller写回流的方式进行显示。 controller:@RequestMapping(value = "getImage", method ...
  • 我使用SpringBoot复原了一下源码,需要的可以去我的GitHub上下载 ... 从前台页面获取图片,后台接收图片文件转化成数据,然后存储到数据库,然后反向输出到jsp页面 二、分析一下数据转换和数据流通...
  • web项目图片/文件保存方式

    千次阅读 2019-05-07 21:57:12
    web项目图片/文件保存方式其实文件和图片都是二进制流文件 以下统称图片1直接把图片存到数据库字段中2图片存项目/public/img目录,文件名存数据库字段3规范的使用阿里云oss/腾讯云cos存图片,数据库存图片名 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 611,895
精华内容 244,758
关键字:

web图片