Responsive（响应式设计）从去年开始讨论的人越来越多，而国外使用这种设计的也层出不穷。W3cplus紧跟国外的前沿，也在站上介绍了很多这方面的知识点，并收集了很多相关的资源。在Shay Howe的《An Adavnced Guide to HTML & CSS》教程中第四课也是《Responsive Web Design》，由D姐翻译。在整篇文章介绍了很多知识点，比说媒体、视窗、流体布局等等，因为这些知识点很Responsive息息相关，并且在每个知识点后面附上了大量的扩展阅读，我想喜欢Responsive的同学看完这篇文章后会受益非浅。

几乎每个人都在讨论响应式设计，但是我不敢确定每个人都理解他是用来做什么的？许多web设计者开发者希望我能解决这些存在的误解，而我也在尝试这么做。简单来说，响应式设计不是专门为手机做网站，而是为了使网站布局适应多种设备大小设计的。

这篇文章由D姐根据Jason Michael的英文文章原名《Build a basic responsive site with CSS》进行翻译，在这篇文章里，将给你展现响应式设计背后的细节原则，所以我们需要真正理解这些原则。一旦我们理解了他，就可以在大屏幕小屏幕设备上，完美的呈现一个网站了。

你有过多少次接手别人开发过的项目，却发现作者的代码思路一团糟吗？或是你跟几个团队成员合作开发，他们每个人都有自己书写代码的方式吗？或是你重新回顾你多年前开发的项目，不记得当初是怎么想的？

我总是遇到这种事情。事实上，我最近在修复供应商提供facepalm-inducing的css上花费了将近300个小时。这300个小时，使我充满了挫败感，不仅是因为我自己，还有我的团队成员的原因。而且他占用了本应该花费在新项目上的宝贵时间和资源

如果供应商在他的css中已经遵循了一些基本的指导方针。那么将会为他节省宝贵的时间和金钱，更不用说我会已更好的状态去对待他。在本文中,你将学习书写CSS的最佳实践来帮助你避免不一致和冗余;实际上,这样制定标准,简化了团队开发的工作。

CSS架构，听名称够霸气的了，当然这也是很多CSSer想做的事情，也是一些团队的想做的事情，因为谁都想让自己的工作变得轻松，国内有很多大公司都有自己的前端架构，而且有些成员在维护，但对于小公司或者一些同学想学习写CSS架构却是件很困难的事，困难到都不知道从何处下手，要怎么写，要写到什么程度。由于这一系列的为什么，让很多同学只是想想，却不敢动手一试，就算是试着写的同学都半路夭折了，我就是属于这一类型，但我始终没有放弃，我一直在积累这方面的知识，也在开始构思如何写一个CSS方面的东西让自己的工作变得更轻松，让更多的同学受益。今天D姐根据Philip Walton的《CSS Architecture》一文译了一篇有关于CSS架构的文章，这篇文章从结构到样式进行了详细介绍，更详细介绍了写CSS架构时会碰到的一些坑，又是如何的来填这些坑。通过这篇文章的学习，让我认清了当初的失败之处，同时让我的思想与视野都更开阔了，个人认为是很值得阅读的一篇文章。感兴趣的同学，或者想做这样一件事情的同学，不仿花几分钟阅读一下。

OOCSS，第一次接触的时候觉得他很神奇，根本没有想到，在CSS中也会有一个面向对象的概念。因为面向对象是那些程序员的产物，怎么就和CSS挂上关系了。后来进行了解，知道OOCSS更趋向于一种思想。于是自己也学了一些这方面的思想，并做了些许的读书笔记（《OOCSS——概念篇》和《OOCSS——核心篇》），可还是没有领会到其中神的层面，今天D姐的译文，让我再次了解了OOCSS，真心不错的一种思想，很值得每一个前端人员去思考。

非常高兴，w3cplus今天迎来了一位新成员enggirl（朋友们口中的“D姐”），今后她将主要负责一些优秀外文的翻译，也就是说，D姐今天开始会不间断的为大家翻译一些国外优秀的前端技术博文，希望大家喜欢，同时更希望这些译文能帮助大家学到国外一些新的前端技术，好的前端技术。在这里我也特别感谢D姐对ｗ３ｃｐｌｕｓ的大力支持，给您道一声“辛苦了”，希望您能伴随着“w3cplus”一起成长，一起进步。