我的网站现在是响应式的。与弹性图片、弹性布局和媒体查询一起工作的越久，我对取得的成果评价就越高。
在为 Do Lectures website 网站做重新设计时，我对“响应式方案是否应该与设计以及 Paravel 的工作流（Paravel 是作者所在的公司，一家位于德克萨斯州奥斯汀的网页设计公司。—— 译者注）保持一致”的所有认知被全部颠覆了。我们不必大改整个流程，还可以控制预算，还能保证网站结构从台式电脑到移动设备都保持完好。由于在这个项目获取的积极意义的经验，我决定把我学到的以及关于本网站形成的观点写一篇文章。
距 Ethan Marcotte 的分水岭级文章 A List Apart：响应式 Web 设计已经快一年了，从那以后每当看到我的网站在我妻子的笔记本电脑上出现横向滚动条时我都备受折磨。对响应式的喜爱是因为他的理念，就是无论手机、全屏桌面还是介于两者之间的任何一种设备都可以访问网站。如果说人们不会用网站宽度一半的设备访问网站，那绝对是在逃避问题。人们不会，那是因为我们没有提供这种访问的可能性。然而我依然推荐用户使用全屏访问，不可否认无论是同时对比两篇文章，还是在文本编辑器窗口旁打开一个参考网页都是十分方便的。
结构完整性
如果说之前有什么顾虑的话，也不是关于响应式设计本身，而是一些我曾经看到过的响应式实例。在大部分情况下，屏幕调整时页面元素糟糕的剧烈调整会误导用户。诚然，当 3 列变成 1 列时有些东西必须放弃，但是网站的结构和层级必须仍然保留。如果用户第一次使用网站全宽的设备访问，当使用较窄窗口的浏览器或者移动设备再次访问时，他们应该也能认识该网站且能轻松自如的访问。个人认为这应该被认为 UX 设计的另一个组成部分。
我们花费了如此多的时间讨论决定页面上每个元素的位置，那为什么当窗口变窄时就让所有这些工作都付诸东流呢？响应式 Web 设计不是适应内容（就像重新装填搬家货车），而是裁剪内容去适应用户（就像布置家具）。当设备宽度变化时，内容与布局要优雅的缩放。
FitText 简介
我喜欢对 Web 字体排版和响应式进行细微控制，但我很担心这两者不能共存。如何让字符，单词或者行的位置微调也变成可缩放的？当你想保留格式化的大标题和紧跟其后未被 h1 包裹 2 或 3 次的文章段落或图片之间的间距时会发生什么？即使是这个网站，也仍然有一些地方的依赖文本的布局不管窗口大小都显示成全宽度。我知道 Lettering.js 需要一个插件了，带着这个想法我去找 Paravel 的小伙伴 Dave Rupert。第二天他给我介绍了 FitText！
我真的想挑战一下自己，让之前写的文章适应新的响应式布局。过程中每篇文章都会暴露出一个待解决的独特问题集，未解决的问题都被 FitText 处理了。该 jQuery 插件放大 web 类型来适应其父元素。不管窗口大小文本总显示成全宽度。FitText 能与 Lettering.js 或任何 CSS3 属性（本文标题就是一个例子）完美搭配，不用说你也永远不会在段落文本上使用 FitText（我希望你不要这样用），但是在适当的位置，FitText 能让响应式 Web 设计令人更加兴奋。
我的关键属性
现在本网站是响应式的，我打算继续拿他当练兵场 —— 持续改进我的计划和针对内容的设计。从旧的设计方法转变到 web 响应式并不是自动的，在真正得出效果最佳的方案前还有一些令人兴奋的工作。我所有的文章都有他们自己一个小而独特的样式表，在使每篇博客在任何宽度的设备上看起来都好的路上我学了很多东西。下面是一些真正支撑本网站更新的属性：
backgroun-size 的百分比能帮我直观地、无缝地缩放旧文章中的网页结构，插图和文字图片。
用垂直 padding 或 margins 代替垂直 height，这样保持标题栏的高宽比会变得非常简单。
Column-count 依然不是很可靠，但在 tags 模块通过媒体查询，Column-count 简化了 4 栏布局变成 3 栏再到 2 栏的过渡过程。当这个和 flex-box 都时机成熟时，代码产出将会异常高效。
Ok，这些对目前来说足够了。我会写更多关于响应式 Web 设计和 FitText 的文章。同时，点一点我的博客或使用 FitText 创建一些自己的东西。感谢阅读，希望你喜欢这篇更新！
2011 年 5 月 10 日