图片加载失败的默认UI是比较丑陋的，因为前端开发会使用出错图进行替换，但是这种做法会隐藏图像的内容信息，有没有什么办法在CSS样式美化同时显示图像的信息呢？本文就介绍我摸索出来的应对此场景的最佳实践技巧，希望可以对您的工作与学习带来帮助。
文章关键字 ‘加载’
图片加载失败后CSS样式处理最佳实践
2020年10月24日，星期六浏览器IMG图片原生懒加载loading=”lazy”实践指南
2019年09月30日，星期一
本文介绍自己在研究与实践Lazy loading原生懒加载得到的结论与知识，scroll滚动，resize缩放，网速，屏幕高度都是影响特性，同时也会介绍在JavaScript中的一些实用tips。
开源移动端元素拖拽惯性弹动以及下拉加载两个JS
2017年01月25日，星期三开源两个起点中文网M站两个动效交互JS，封装良好，即插即用。一个是任意元素屏幕拖移外带惯性边缘弹动效果，另外一个是基于窗体的下拉释放加载刷新效果。
内容loading加载后高度变化CSS3 transition体验优化
2015年01月22日，星期四现在web技术不断发展，视图与数据渲染更多由前端呈现，后台更多与数据打交道。于是，我们会经常看到这样的交互场景。页面加载，看到一个框框里面有个菊花在转，然后内容呈现；或者点击个按钮，菊花在转，然后列表动态加载呈现。
确实，功能上OK，有菊花，用户也愿意等。但是，大家有没有觉得所有交互，出现菊花→出现内容，都是“砰砰砰”很生硬的感觉，尤其当内容是动态，高度不确定的时候。我们使用一些比较好的手机APP(如微信)的时候一定不会有这样的感觉，整个交互流程都是很流畅的，就像山涧的泉水，涓涓细流到山脚，而不是巨人在峡谷走路的感觉。
所以，如果菊花的呈现到内容的展示能够通过自然的动画过渡呈现，势必会增强用户体验。
而本文就将分享，我是如何渐进处理，让动画过渡呈现更自然的…… 必须的，demo，截图，源代码展示一个不少，希望本文的内容能够对您的学习有所帮助。
CSS3实现鸡蛋饼饼图loading等待转转转
2014年04月25日，星期五今天，要实现一个长任务等待提示效果。然后设计师就把做好的gif效果图给我，就是下面这个，转转转等待提示效果。按照大众做法，我应该是把图片直接按图索骥，调调布局，然后早早回家抱老婆。
但是，我这个人，天生不安分守己。想到是用在客户端，客户端又是用的webkit内核，于是，立马决定使用CSS3来折腾一番……
小tip: CSS3 animation渐进实现点点点等待提示效果
2013年06月9日，星期日一个名叫“阿贾克斯”的屌丝男在名为“客户端”的学校上学，为了追女神，下狠心，借了高利贷给女神买Mac. 结果，期限已到，要债的找上门，没办法，只能向身在“服务器端”的父母要钱。但是，要钱是要一定的过程和时间的。他必须想办法向要债的表明，钱正在过来的过程中，否则，可能要债的会认为你在忽悠，直接使大招——”Ctrl+W”，瞬间灭了你，眼不见心不烦。
如果告知钱正在过来的过程中呢？
有人可能如下处理，弄个转转转的小图片告诉要债的，看，我在原地不停地转……
翻译 – 高性能网站需避免的7个错误
2011年11月28日，星期一假期临近（应该指感恩节和圣诞节），公司增加了SEM方面的花费，关注SEO，修改页面。然而，为了最大的销售额，这些时间、财力上的付出可能就是打水漂——如果假期增加了访问量让网站速度变慢甚至下去的话。
性能影响用户是毫无疑问的。网站速度直接影响反弹率、转化率、收入、用户满意度、搜索引擎优化（已知的如反映网站流行度的Page Rank）以及几乎所有值得追踪的业务。用户离开速度慢的网站，而且往往不会再回来。
还在不久前，用户离开一个网站的时间点是8秒。然而，很快就是6秒，然后4秒，然后现在是2秒……
新版无图片版zxxbox jQuery弹出框插件
2010年09月7日，星期二
当初写zxxbox jQuery弹出框插件纯粹是学习的目的，另外就是临时应付个人站点上的一些弹框应用。所以写得比较简单，业余，并没有期望谁会去使用它。但是，后来，一些同行的留言以及相关的交流发现，还是有人使用此轻便，简洁的弹框效果的。
但是，一方面由于自己之前的水平比较稚嫩，同时，对插件的逻辑没有很好的梳理。所以，之前版本的弹出框插件，虽然也能用，但是，功能确实有效，不能给内置的弹框按钮添加回调方法，不支持Ajax加载，而且，还有些小的隐晦的bug等，在调用上也是有点不利索的。所以，这几天，我就把之前的zxxbox弹出框插件重新写了下。虽然弹框的UI界面还是更之前的一样，但是，内部的逻辑，调用，以及参数等都有所不同，可以说是从底层核心都改变了。所以，只是简单的以插件更新的方式放在之前的文章下，则会有有力使不出的感觉。故，另起一篇文章，对新版的zxxbox弹出框插件参数，使用等细致地讲解下，希望对有需要的同行有所帮助。
翻译 – CSS Sprites:实用技术还是生厌之物？
2010年03月30日，星期二
这是一篇翻译的文章，翻译的原因在于，我与原作者有类似的观点，即我自己也觉得CSS sprites的使用到了重新审视的时候。不过老实讲，本文作者在观点的表达以及论证上多少有些牵强，但是实际上，CSS sprites确实是需要善用的。难得的，本文没有demo，没有源文件。只是希望能够对您有一些新的启示。
我的应用
我的应用