响应式网页设计已经成为新的网页标准，许多公司已经接受挑战并建立了专门的网页设计解决方案（例如仅移动设备开发）或已经开始尝试解决跨平台响应式网页设计方案。本文将带您了解一些实用建议，以帮助您的设计过程并提高效率。1.规划一如既往，规划是重中之重。一旦您开始在纸上解决您的设计挑战，您就可以构建您的网站了。2.充分利用好的原型制作软件。推荐AdobeEdgeReflow，它可以让你使用媒体查询，在程序中设置断点，设计适配台式电脑、平板电脑和手机的布局。然后，您可以将CSS复制到另一个HTML编辑器，如Adob??eDreamweaver或另一个HTML编辑器，以进一步完善您的设计。3.首先考虑移动策略如果您是第一次创建移动网站，那么您可以将其放大并在平板电脑和台式机上设计页面。这三个平台的重点是网页标识和文字。如果文本可以在移动设备上轻松阅读，那么您在平板电脑和桌面平台上就不会遇到任何问题。4.谨慎使用导航如果您的站点只有两个或三个导航按钮，您可以将这些按钮包含在屏幕上的一个简单菜单中。如果您有更多菜单元素，您可能需要考虑创建一个带有下拉菜单项的图标。5.先粗略的创建网站，感受一下整体。一些公司，如JiffySoftware，会先创建整个页面布局，然后开始编写代码，这样才能实现客户想要的外观和感觉。在创建移动页面时，将按钮设计得足够大以覆盖指尖非常重要，还有一点是保持界面简单和功能。许多设计师倾向于向移动界面添加太多元素，这可能会导致设计和可用性问题。如有疑问，请保持页面简洁明了。6.准备好使用大量的软件程序。对于许多用户来说，使用WordPress模板就足够了，但如果你想实现复杂的设计，你可能需要使用自定义程序并为每个站点单独编写一些个性化的代码。例如，如果你的布局很简单，你可以使用像Moboom这样的模板，但对于更复杂的布局，你可能需要使用像Adob??eDreamweaver这样的程序来设计你的桌面计算机布局，而像GoMobi是在这里设计移动设备网页布局。#p#7.图片在创建响应式设计布局时，为每个布局使用优化的图片。这将减少缩放和带宽问题，使用JPEG、GIF和PNG-8图像而不是PNG，因为它会使文件大小增加5到10倍。8.使用精确的图像参数，如500X300像素、100ppi，并调整图像大小以匹配，这将消除缩放比例并保持图像的分辨率和质量。如果您的图像也需要缩放，这可能会导致颜色深度和分辨率出现问题。9.使用视差滚动这可以使您的网站以更受欢迎的方式响应。设计有许多设计元素，这种效果可能有点矫枉过正，所以这里有一些使用这种效果的网站示例。10、关于升级的问题如果你设计的网站是一次性的，就没有必要考虑升级的问题。但是如果你要做一个网站，交给别人维护和更新，确保它可以方便地更新，包括为后代写一个升级指南，确保你的代码中有合理的注释和文档，所以让其他需要更新的人可以看到你做了什么，可维护性/更新往往是非常必要的。11.在移动设备上使用尽可能少的文字只使用必要的文字，而不是将您的台式电脑设计复制到您的移动终端上。后者往往会导致滚动页面过长，这是一种糟糕的体验，可能会让您在移动设备上失去大量用户。12.使用谷歌设计标准在此页面上，您将了解谷歌针对智能手机设计网站的建议。除其他事项外，您将了解如何使您的移动页面加载速度更快。13.测试代码片段和模板使用API??时要小心。您的意外操作可能会导致您的网站出现性能问题。如有疑问，请先测试下一个组件。14.创建框架的工具快速创建响应式设计的方法是在已有的基础上进行二次设计，比如利用现成的主题创建一些子主题等。这为您节省了大量时间，因为您不必从头开始创建新布局。15.简单的设计这对于响应式网页设计尤为重要。只要确保在设计您的网站时，您摆脱了所有非必需品，这将大大缩短页面加载时间。总结随着响应式网页设计越来越流行，性能变得越来越重要。想想这些事情：精确的代码、测试模板组件、优化图像等，所有这些都会让您的网站加载速度更快，性能更好。原文：http://www.htmlgoodies.com/html5/css/15-responsive-design-tips.html#fbid=najXA61N6Vn翻译：http://www.php100.com/html/it/focus/2014/1219/8101.html（翻译：PHP100_Alex）
