Please, Don't Improvise

The following text is a partial translation of the original English article, performed by ChatGPT (gpt-3.5-turbo) and this Jekyll plugin:

我们都知道当一个程序员决定一个网站或移动应用程序的外观时会发生什么。最终会变得丑陋。为什么会这样呢?我不确定,但我最有把握的是程序员们的“左脑”特质,他们大多是固执而逻辑严谨的数学家。而相反,界面设计需要创造力和直觉,这些都驻留在我们大脑的右侧。一些最近的研究对此表示怀疑,但我的个人经验告诉我,你永远不应该期望程序员能够设计出良好的用户界面。而且,我就是其中一个程序员:不管我画什么,要么是黑白的,要么是丑陋的。但我仍然需要设计我的个人项目。以下是我为自己学到的一些最重要的教训,这些教训帮助我在我那左脑盛行的世界中存活下来。

领导者。我看看那些大公司和著名公司做的事情。我查看我每天使用的网站,看看现代网页设计中的“好”是什么:stackoverflow、github、apple、amazon、craigslist(别开玩笑),等等。我实际上只关注不到十个网站。他们把按钮设计成平面的?那我也设计成平面的。他们把字体放大了?那我也放大字体。他们把背景设为白色,我也设为白色。我只是照搬他们的设计。他们肯定更懂。

框架。有很多网页框架。我倾向于选择最简单的一个并使用它。嗯,几年前我甚至创建了自己的CSS框架:Tacit,一个没有类的CSS框架。我总是尽量少“设计”,而是遵循框架作者强制的惯例。如果他们要求我的按钮是蓝色的,那它们就是蓝色的。我不试图创造,只是按照我使用的框架的规则来。

默认设置。总是有很大的诱惑使内容“漂亮”地对齐,居中或者以多列方式排放。我尽量不这样做,尽管很诱人。我不知道如何正确地做,这就是为什么内容会从上到下“流动”,一项接一项地按照左对齐排列的原因。当然,除非是表格式数据。有时候也会有添加或删除元素之间间距的诱惑,可以通过额外的<br/>margin来实现。我不这样做。元素将按照我的框架的默认方式放置。

颜色。选择正确的颜色对我来说是个大问题——我不知道如何正确选择。我不知道哪种红色与哪种绿色相配。这就是为什么我使用Coolors的原因。我只需点击多次“空格”,他们就会提供一组相配的五种颜色。我找到最吸引人的组合并使用它。对于任何网页应用来说,五种颜色总是足够的。

粗体、斜体、下划线和全大写。很简单——不要使用它们。从不。嗯,尽量少用。你绝对不应该使用它们来增加一个视觉元素的可见性。你有字体可以做到。如果你想让标题引人注目,那就把字体放大。但不要使用斜体、粗体,更不能全大写。我有时会使用它们,但非常少,只是为了在句子中强调一个词。

字体。我尽量坚持使用默认字体,即Serif、Sans-serif和Monospace。如果不能使用默认字体,我会非常小心地使用Google Fonts。当然,我每个系统只使用一种字体。我知道哪两种字体兼容吗?我不知道。你知道吗?不要试图做出正确的决定。只用一种字体,就这样。我总是尽量把它们做得尽可能大。这似乎是一种趋势,很可能是因为屏幕变得越来越大。

图片。老实说,我尽力避免使用图片。我总是试图用文本或者Unicode符号来代替它们,如果必要的话。当绝对必要时,我会使用SVG矢量图形。PNG/JPEG位图是我最后的选择。

艺术家。我对现代网页艺术家所做的事情完全不感兴趣。他们创造出美丽的东西,但我甚至不需要了解它们。它们只会让我烦恼,因为我无法创造出类似的东西。当有人向我展示一个带有新的CSS技巧的网站时,我立即关闭它。这不是给我看的。我的CSS必须尽可能“简短”和“原始”。

合规性。W3C有一些用于静态分析网站的HTML和CSS验证器,可以告诉网站有什么问题。这类似于Checkstyle对我们的Java代码所做的。我总是依赖他们的建议。有时候他们听起来太严格,但他们告诉我那些了解网页设计比我更好的人的期望。例如,在HTML5中,我们应该在表格中有<thead>,或者在所有<img>元素中有alt属性。我总是尽量遵循这些和其他规则。

响应式。设计必须是手机友好的。始终如此。

总结一下,我建议:不要即兴发挥,不要试图创造,不要认为你懂得何为美和何为不美。你不懂,我也不懂。尽量保持极简和传统,这样你将给自己和用户带来很大的帮助。

Translated by ChatGPT gpt-3.5-turbo/42 on 2023-12-05 at 22:10

sixnines availability badge   GitHub stars