我是开发人员，我发现我很难处理图形和视觉设计。就好像我的大脑中用于抽象推理的部分吞噬了视觉部分。
对各种编程语言有一堆很棒的介绍，它们假定编程具有一定程度的复杂性。有没有这样的HTML和CSS教程？在以类似方式处理HTML和CSS的教程中？
如果不这样，你们推荐哪些好的网页设计教程？
答案 0 :(得分：4)
HTML和CSS只是达到目的的手段。 20年后，我们可能会有不同的东西，但设计基础保持不变。从您的问题来看，我认为您希望了解视觉上令人愉悦和可用的内容，并了解如何实现此类设计。
沿着这些方向，看看杂志的布局;看专业广告;看看标志设计，并尝试挑选出与众不同的东西。查看流行，易于浏览，易于阅读的网站。
拍摄你看到和喜欢的东西，并尝试将一些内容融入你构建的每个设计中。一些工具（如Photoshop）起初可能令人生畏，所以不要试图征服世界。只需使每个设计比上一个更好。
这是一个真实，可行的例子，仅以最少的知识开始：
从数据库中读取一些表格数据;作为一名程序员，我相信你知道该怎么做。
在HTML表格的任何地方阅读教程。他们的结构只涉及3个主要标签和少数支持标签。 [见脚注＃1]
将数据放入表中，没有样式。看起来很糟糕吧？现在确定为什么它看起来很糟糕。什么不悦目？将它与您喜欢的其他网站上的干净布局进行比较。
检查填充和边距等小细节，并学习实现这些内容的基本CSS规则。在这样做的过程中，您将开始形成一种基本的可用性和美学指导感（例如精心布置的空白的重要性）。
现在选择Photoshop之类的“令人生畏”的工具之一，完成一项非常简单的任务。也许它会像裁剪图标或为表格标题创建简单的渐变一样简单。选择一个任务，如果需要，找一个教程。
这一切听起来都非常简单，但是你会惊讶于有多少开发者从不费心去尝试。
另一个例子
字体对视觉设计的美学和可用性产生巨大影响。首先仔细阅读几个主要网站并查看常用字体。稍微阅读一下印刷中常用的字体，以及原因。
现在采取技术方法。我们可以在网上安全使用哪些字体？我们作为开发人员可以使用哪些工具来嵌入自定义字体？
有了这些知识，创建一个普通页面并尝试设计一个小新闻文章（从某处剪切并粘贴原始文本;这没关系）。
选择好的字体会改善设计。但标题怎么样？特殊款式如滴帽？一切都在HTML和CSS中;开始阅读语义结构化文档的最佳实践以及如何实现不同的样式。
在本练习结束时，您会成为专家吗？当然不是。但是你会发现一整套新的技术途径，你应该进一步追求，比如语义结构，HTML文档模型和CSS文本样式指令。
您甚至可能会遇到多设备/辅助功能主题，例如如何容纳屏幕阅读器。
作为一名设计师，你将开始理解作为样式文本“简单”的努力程度，你将开始发展那种“感觉”正确的无形感。你获得的越多，你的观众就越能分享这种感觉。
我的意见
开发人员不能/不应该是视觉设计师，这是一种常见的误解。我不同意;工程师应该了解最终用户体验，启发式和美学。不是每个人都可以成为一个伟大的视觉设计师，但我教过许多人基本知识，他们的设计总是比其他人更好（即使他们并不完美）。我也很熟悉最技术性和最面向用户的方面，坦率地说，这很有趣。没有什么是禁区。
<强>链接
A List Apart - Code Articles - 关于特定技术的精彩文章，但请务必不要错过其他一般设计文章。
Printed Text Guidelines - 非常适用于某些类型的网站。
CSS Basics - 直接来自W3。
[脚注＃1] - 对任何HTML / CSS开发人员：我不是建议OP构建基于表格的布局;只是建议他们采用熟悉的数据结构，并了解样式化所涉及的任务。
答案 1 :(得分：1)
图形设计和HTML / CSS几乎完全不同。你想要变得更好的是什么？使用Photoshop或Gimp等程序进行图形设计？您是否希望更好地了解CSS和HTML的工作原理？或者您是否希望了解良好的用户体验（用户体验）设计以及如何将其纳入HTML / CSS布局？
我认为您需要更好地了解您首先要寻找的是什么。也许以W3C specs为出发点。拥有技术背景，阅读这些规范应该是相对微不足道的（大部分），并将帮助您了解您想要理解的内容。
答案 2 :(得分：1)
我认为同时成为优秀网页设计师和开发人员的最佳方法是在thenewboston.com上学习网页开发教程，同时让学习轻松有趣。
学习CSS，HTML，Javascript等后，您可以下载各种网站模板的源代码，并从中学习。