我曾经是一名开发人员，正在努力跟上面向客户的网站的发展速度。我有一个设计师(她有多年的经验，但都是打印品，所以她也在加强网页设计)所以我不是在寻找设计或可用性技巧。我感兴趣的是为页面进行实际编码的分步过程。我想确保我的出发点是正确的，并按照逻辑顺序构建各个部分。
因此，请分享您对您通常在样式表和 HTML 中首先做什么、其次做什么等的想法。我的意思是在您已经有了模型(在 Photoshop 或其他软件中)并坐下来创建您的代码之后。
例如，您是否首先考虑页面上的所有部分(标题、导航栏、内容、RSS 提要)，然后将适当的 DIV 添加到您的样式表？然后深入研究每个部分的细节？
(我知道还有其他关于网页设计技巧/最佳实践的帖子，但我还没有找到任何专注于逐步编码过程的帖子。)
谢谢!
最佳答案
这是通过数字来做到这一点的正确方法:
1) 编写您的 HTML。除了写它什么都不做。不要在浏览器中渲染它以查看最重要的外观。关注语义、简洁性和可访问性。在这一点上，其他都不重要。如果您弄错了这一步，其他一切都无关紧要。
2) 验证您的 HTML。如果您的 HTML 未通过验证，请在执行任何其他操作之前修复它。
3) 为您的 HTML 编写 CSS。此时，您将不得不在浏览器中呈现 HTML 以查看 CSS 的影响。不要更改 HTML 的结构以满足演示的要求。这就是您首先编写 HTML 的原因。此时您唯一应该在 HTML 中更改的是标签的类、id 和标题属性。使用属性为 rel="stylesheet"的链接标记从 HTML 的头部引用 CSS。不要尝试使用样式标签或@import 规则来包含样式表。
4) 在 CSS 完成并且一切看起来都很漂亮之后，然后创建 CSS 所需的任何背景图像。
5) 只有在 CSS 和 CSS 所需的一切都完成后，您才能开始使用 JavaScript。 JavaScript 永远不会进入您的 HTML。 JavaScript 总是进入外部 js 文件。 JavaScript 是通过使用仅在结束 body 标记之前直接出现的脚本标记来引用的。
6) 完成 JavaScript 后，将其传递给 JSLint 工具。完全按照说明重写您的 JavaScript。
当我与从打印品迁移到网络的设计师合作时，我遇到了问题。当打印设计师试图使他们的布局体验适应网络时，他们通常无法将打印世界抛在脑后。网络不是打印的。与网络相比，打印品具有不同的限制和自由。即使是网格布局有时也无法从打印品转换为网页设计。
关于html - CSS/HTML 布局的分步过程？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1311494/