攻城掠梦,首战魔都——2015iWeb峰会上海站

一年一度由HTML5梦工场主办的行业最大最接地气最有诚意的iWeb峰会(HTML5峰会)闪亮登场了。随着HTML5普及在从多领域得到广泛高效的应用,随之关注和使用的人群也越来越多,借此契机,iWeb今年新增广州站和厦门站,共在8个城市举办,同时,上海站晋升为主峰会之一。

CSS分层

随着CSS的发展,使用CSS有语义化的命名约定和CSS层的分离,将有助于它的可扩展性,性能的提高和代码的组织管理。在我前面的文章中讨论很多关于CSS的问题都可以通过使用一个适当的CSS策略来避免。在这篇文章里,我将着重于讨论使用一种方法或者一个命名规则所带来的好处。这里有很多可供使用的前端方法和命名规则,每个都有自己的优缺点。在几乎所有的案例中CSS被分割成更易于管理的代码“块”。CSS的这种分割方式定义了每一种方法。

Responsive Image:使用srcset

今天给大家介绍有关于响应式设计中的一个新东西,现在也比较流行:响应式图像。RWD不是一个新话题,但实现它的方法并不轻松,在实现过程当中充满了陷阱。尤其是当RWD涉及到图片的处理时,有很多问题还有待于解决。

Responsive Hero Images

Hero images 给响应式设计提出了独特的挑战。在最近的响应式图片核查期间,我们发现了一个独特的解决方法,一个我想要分享的方法。直到几年前,我都不熟悉Hero image这个术语。一个就职于大公司的朋友用这个术语,我不得不问这个是什么意思。我不知道这是不是一个常见的描述因为我与世隔绝了。或者这可能是大公司的术语。

前端路上的旅行

从步入社会算起到今天,风风雨雨走过了15个年头,望着天空,掐指一算,从事前端已近五个年头。也算三分之一的时间在做前端,也是从事过时间最久的一份工作。问我为什么能做这么久?其实我也时常问自己,怎么就进前端这个行当,怎么就整了五年。正如网上所言,一入前端深似海。玩了五年,或许后面还会有一个五年,两个五年,或许...... 未来的路,谁与说不清楚,我只想每天走好自己想走的路。

使用Sass Map实现响应式排版

本来要管理Rhythm排版一致不是一件易事,响应式中的Rhythm排版就更加困难。幸运的是,Sass的Map可以更好的管理和实现响应式排版。有各种各样的方法来处理响应式排版和Vertical Rhythm,并不局限于我的建议。然而,这是我很多次工作中总结出来的经验之谈。

CSS动画

本文是为帮助您入门和熟悉CSS动画而编写的,使用它们来为您带来基于Web的接口以及为艺术带来生命。虽然W3C的CSS动画规范仍在修订中,但是如今它已经有大量的内容可以供我们使用了。对我而言,CSS动画最令人激动的事情之一是,我们可以非常轻松地使用我们已经熟悉的工具来把它们添加进我们的项目中。如果您已经精通HTML和CSS,您就不需要学习新的语言或插件来为您的项目添加动态效果了。HTML和CSS已经足够,这是一个非常大的加分!无论你只是添加一点点引人注目的设计细节,还是添加非常多的动画,都没有问题。

SVG Sprite

Sprite(雪碧图)在Web运用中已不是新技术,但大部分同学都还停留在位图的Sprite运用,比如.png图的合成。而这种技术对于现在的Web页面而言并不完美,比如位图在Retina屏幕带来的图标不清晰等现像,是我们技术人员必须面对的一件事情。而今天要说的,就是如何避开使用位图制作Sprite,来适应所有屏幕的显示。而这种技术就是SVG的Sprite来替代早期的位图Sprite。

SVG滤镜的艺术以及它为什么这么棒

经过近20年的发展,如今的网页排版,以其高密度的显示以及OpenType功能的支持,离现实世界的印刷排版仅是一步之遥。但是平面设计还是有一个领域,我们还在不断地fall back到使用位图,而不是使用单纯的文本:字体显示,如说明性的、绚丽的、戏剧性的、俏皮的、试验性的或料想不到的艺术字母。

性能工具

嗨,各位,又到了周末总结时间!得益于大量的 Grunt 和 Gulp 插件,我们可以轻松实现网站数据的可视化,虽然深入理解这些工具还比较困难,但分门别类的将它们列出来,也是很有帮助的。

页面

返回顶部