作为一个小小的项目，我开始为我所属的某个组织建立一个新的网站，当前的网站已经过时了。
我经常是一名Java开发人员，上次我真的做了一些Web开发，早在90年代后期，<p>仍然比<div>更受欢迎，Javascript是最先进的技术（ JQuery现在是懒惰的流浪汉:)）。
无论如何，我觉得我已经过时了。该网站基本上将是：
我的问题是设计整个事情。我找到了一些不错的基于网络的CSS布局生成器让我顺利，但我仍然觉得我在浪费时间来平滑CSS文件并对齐<div> s。
是否有任何工具 - 更简单，更快，更好 - 您建议我可以使用它来加快网站的设计部分，以便我可以专注于真正的工作？
我不需要任何花哨的东西，只是一个漂亮的布局和设计，我可以稍微调整一下，使网站看起来很漂亮。
答案 0 :(得分：32)
我的第二个布兰登建议使用CSS框架。它不会让你100％自由地设计任何你喜欢的东西，但它可以大大加快你的设计过程，并腾出你的手去做你真正想要的编码。
建议 2013年7月更新：
答案 1 :(得分：19)
我不会骗你。如果您正在寻找可靠的网页设计建议，这个网站不是最好的去处。 Stack Overflow是一个编程社区，程序员很少对设计有所了解。如果您想获得一些真实的建议，那么我强烈推荐互联网上的主要Web设计/开发论坛，尤其是SitePoint。
话虽如此，作为一名前自由撰稿人的网页设计师/开发者，我将就此问题提供我的意见。当然，并不是说你应该重视它。毕竟，这是一个编程网站。
永远不要再说CSS编辑器了！如果您打算认真设计网页，那么首先需要学习语义XHTML和CSS。虽然很多人都认为W3Schools是最权威的资源，但我认为它是程序员的回答（即不是很好），并且希望你能用... Google阅读这个主题。有很多很棒的网站可以提供网页设计/开发的基础知识，谷歌可能是最好的网站。此外，由于有大量新网站提供此信息，您知道它将比W3Schools更加完善。你真的很想弄清楚你的设计，因为以后在项目中解决问题要困难得多。
如果您要设计网页，那么了解实际设计的内容是个好主意。查看CSS Vault以获取一些设计最好的网页的绝佳资源，当然所有源代码都完好无损，这样您就可以玩他们的代码，看看他们如何管理一些他们产生的奇妙效果。我从CSS Vault上的网站上学到的不仅仅是一两件事。最重要的是，您应该从大型Web设计/开发站点上阅读Web Design。我最喜欢的两个是SitePoint和A List Apart两个名字，当你听到人们谈论资源时，你会不时地接近这两个名字。浏览这些网站，查看他们的论坛，查看 REAL 网页设计师/开发人员正在使用的内容，而不是程序员正在使用的内容。
关于CSS框架的主题;他们帮了！使用它们的问题在于，您经常花费大量时间寻找一个有价值的框架，您可以自己为自己的网站完成大部分CSS。你要么爱他们要么恨他们，但很多人会说他们没有必要。
一旦你了解了一个好的设计是什么样的，你就拥有了创造价值所需的资源，我建议你开始工作！实际上，当您设计网页时，您真正需要的是具有保存功能的文本编辑器，图像处理程序，浏览器窗口和FireBug。 IDE可以帮助很多人，但是如果你确实使用了IDE，那么你肯定希望以文本模式工作。我只使用NotePad ++或Emacs，但很多人喜欢使用Aptana Studio，所以值得一看。
当您真正构建网站背后的代码时，您实际上不会比您喜欢的IDE /文本编辑器和源代码控制工具更糟糕。作为一名Java程序员，你更适合谈论编程，所以我不会为你讲授你已经知道的主题。
最后，网页设计需要花费时间，我们选择使用的许多工具我们声称“节省时间”在现实中保存很少。如果你不是设计大师，那么你需要花费大量的时间来创建一个外观漂亮的网站。这是生活中的事实。叫我老式（来自21岁的一个有趣的词）但我仍然认为最快的方法是在一张纸上绘制一个设计（如果真的有必要的图像程序）并且只是走出去做该死的东西！再一次，我将不得不把这个寻找银弹的心态作为程序员的特质，在设计时真的无济于事，因为设计一个网页与写一个网页有很大不同Java程序。
简而言之，忽略你在这里阅读的所有内容，阅读真正的设计师正在做的事情，只是做出该死的事情！
答案 2 :(得分：10)
在快速开发CSS样式的网站时，有一条建议比其他任何建议节省更多时间，并且保持简单
使用一个有吸引力的简单布局，不需要像素完美，并且可以在不太兼容的浏览器（IE6）中“优雅地”降级。最大限度地减少CSS的数量并修复上面提到的基本错误。然后专注于内容和功能...... 真正的工作
答案 3 :(得分：7)
在我之前的工作中，我为网站创建了数十个模板 我发现的最有用的是Firefox Web Developer Toolbar 它有很多小的有用工具。我最喜欢的功能是能够编辑CSS并实时查看结果。这节省了整个编辑 - 上传 - 刷新周期。请注意，即CSS不一致！ 在我的头顶，这些是最重要的陷阱。
双边距错误[google：双边距错误]
不正确（但更直观）的盒子模型[google：box model]
不正确（但更直观）浮动清算[google：clearfix]
FireBug是另一个非常有用的Firefox插件，可以进行更深入的分析。
答案 4 :(得分：3)
- http://patterntap.com/
- http://www.dotemplate.com/（自定义模板的有趣概念）
- http://www.templatemonster.com/
- http://www.freelayouts.com/websites/html-templates
- http://www.templateyes.com/
答案 5 :(得分：3)
我一直认为Open Source Web Design是一个很好的资源，在开始尝试设计时。
答案 6 :(得分：2)
不知道该网站会是什么，但您是否想过使用像Drupal，Joomla等预先构建的CMS？然后你可以调整模板等，而不是担心从头开始。
答案 7 :(得分：2)
这个问题已经很老了，但是自从我们在2012年以来，我回答自己的问题时，我回答的问题是回到2009年。
答案 8 :(得分：1)
您是否查看了CSS frameworks？如果你对CSS足够称职，那么像框架一样可以帮助加快速度。
答案 9 :(得分：1)
不要忘记firebug :)如果你担心调整设计它真的很棒。使用inspect功能，您可以实时编辑页面的CSS。
答案 10 :(得分：1)
我是CSS框架的第二个Jens Roland's list。
但我还建议您查看Smashing Magazine等网站。您可能会发现其中许多人感兴趣this article。他们倾向于为网络开发人员做很多很好的长期混搭，如果不是直接的解决方案，至少会给你灵感。
答案 11 :(得分：0)
我的一位同事一直试图说服我整整一周 Dreamweaver ，在我上一次被迫在枪口下使用它5年后，实际上现在非常值得快速无痛地敲击设计，现在也有能力为该设计制作HTML。
我拒绝投入10分钟的时间来根据我以前的经验来找出它，但你可能想让这个演示快速运行一下：）
答案 12 :(得分：0)
我建议找一个CMS包，因为你正在使用Django，请查看django-cms。它具有TinyMCE和Markdown支持，因此更新页面应该很容易。 django-cms也与Django管理界面很好地集成。
答案 13 :(得分：0)
答案 14 :(得分：0)
如果您正在进行任何JavaScript开发，请使用高级编辑器，在您键入时突出显示错误和警告。这种功能直到最近才成为静态语言编辑器的一部分，但免费的NetBeans 6实现了这一惊人的壮举。传统上，首次将父页面加载到浏览器时，您首先发现了JavaScript拼写错误和简单错误。从能够缩短这些迭代中获得的速度是非常深刻的。
NetBeans 6还突出了CSS错误，对于Web开发人员最近可能会使用的大多数语言来说，它都是一个功能强大的编辑器。
答案 15 :(得分：0)
您还可以使用www.zbugs.com - 它可以帮助您加快压缩和压缩CSS和Javascript文件的过程