CSS 愿望清单:21 位设计师/开发者的心声

Avatar of Chris Coyier
Chris Coyier

DigitalOcean 提供适用于旅程各个阶段的云产品。立即开始使用 $200 免费积分!

我问了一群设计师他们认为 CSS 需要哪些改变。

Wolfgang Bartelme

Bartelme Design 的设计师 Bartelme Design

我很想看到跨浏览器支持渐变、阴影、不透明度蒙版和圆角。我认为这不仅会显著减少带宽,而且还会加快生产和定制速度。

Jon Hicks

hicksdesign 的设计师 hicksdesign

我想要一个不同的盒子模型!我觉得填充和边框会增加对象宽度很奇怪,我希望能够给 textarea 设置 100% 宽度和 3px 填充,而不用担心它会对布局造成什么影响。也许可以像 padding-inside 一样添加一个新的选择器?

同理,我希望能够为元素指定 100% 宽度,减去一个固定的宽度。同样,在使用表单元素创建流式设计时非常有用!

Andy Budd

作者和 Web 标准先驱: AndyBudd.com

我想要的大部分东西都在 CSS3 中,所以我真正想要的是核心模块的完成,并至少由两个浏览器厂商完全实现。

David Walsh

Web 开发博客作者: David Walsh Blog

我认为我们一直忍受着缺乏字体功能是一种罪过。我们使用非标准 Web 字体的其他选择,比如 sIFR 和利用图像,既痛苦又限制了 Web 的创造力。我也认为必须添加标准的圆角属性——我们都厌倦了创建圆角图像和浏览器特定的 hack 来实现我们的目标。最后,我希望 CSS 能在浏览器中更快地实现。过去几年我们几乎没有进步。

Collis Ta'eed

企业家、博主、Envato 的设计师, Envato主页

我对 CSS 的最大问题是,对于大型网站来说,它变得非常笨拙。在像 FlashDen 这样的网站上,CSS 会占用很多空间,然后我需要另外一组样式表来应用于访问网站替代版本(ThemeForest 或 AudioJungle)的用户。即使有最好的意愿,它也非常混乱。

我希望 CSS 中能够有像面向对象编程中的继承概念。这样你就可以这样写

.button {  
 /* some styles */
}
.button >> .sidebar_button { 
/* inherits all of .button and adds new styles */
}

我知道我现在可以这样定义它

.button, .sidebar_button {  
/* some styles */
}
.sidebar_button { 
/* inherits all of .button and adds new styles */
}

但不知何故,这似乎不是一种优雅的方式。如果第一个和第二个定义恰好被一大块其他 CSS 代码隔开,当你之后再回来查看 CSS 时,你无法知道 .sidebar_button 是否还附带了一些其他的样式。而上面的继承版本,你可以读出它派生自 .button。

Keith Robinson

Blue Flavor 的创意总监, Blue Flavor主页

我希望 CSS 可以像我们现在使用 sIFR 一样处理嵌入字体,

Shaun Inman

Mint 的设计师/开发者, Mint主页

关键是,再添加一个半成品、拼凑的权宜之计不会以任何有意义的方式改善 CSS——只会加剧其设计中的根本缺陷。CSS 感觉像是你在 90 年代后期的桌面出版应用程序中会遇到的样式表实现。它仍然非常以文本为中心。样式表根本不是为创建复杂布局而设计的。CSS 的布局功能是附加的——10 年后,它确实显得很明显。

我很想看到 CSS 文本模块由经验丰富的排版师和排版员重写,以及 CSS 布局模块由经验丰富的出版物设计师重写,包括传统和新式的设计师。

而且,如果可能的话,最好在 2022 年之前完成。

Jeffrey Jordan Way

编辑于 NETTUTSThemeForest 博客主页

我希望我们可以在样式表中分配变量。例如,如果可以将我选择的“蓝色”的十六进制值分配给名为“myBlue”的变量,而不是每次需要获取该值时都滚动到文档顶部,那将非常棒。

var myBlue = #191955;

#someElement{
  color: myBlue;
}

这是一个已经被讨论到死的话题,说实话,这可能是一个坏主意。我仍然不确定。在这样的讨论中,我可能会左右摇摆。一旦你打开了这扇门,你就会失去 CSS 的整个概念。但是,我认为如果负责任地使用,分配变量潜在地可以为我们节省大量的设计时间。

Steven Vandelay

Vandelay 设计公司的设计师

使用 CSS 的一大好处是,通常有多种方法可以实现你想要实现的目标,但在某种程度上,我希望看到更多关于布局的标准化。

Andy Clarke

作者、设计师和开发者:Stuff and Nonsense

好吧,除了显而易见的事情(确保奥巴马当选、让我变得非常富有、给我泡一杯好茶)之外,我最希望 CSS 能做到的就是有更好的布局工具,让我可以创建丰富的、错综复杂的 设计,而无需在标记中添加表现形式的元素。CSS 工作组(我以前是成员)一直在努力开发这些布局工具。我希望在不久的将来,我们能看到浏览器制造商实现这些提案(使用-browser-扩展),这样设计师和开发人员就可以进行实验。

Chris Spooner

SpoonGraphics 的设计师,主页

当我被问到我希望 CSS 能做什么时,我首先想到的是多个背景、圆角、边框图像和不透明度,然后我想起来——这些都在 CSS3 的开发计划中!在这种情况下,我的 CSS 梦想正在成真,这就引出了一个问题:你希望浏览器能做些什么?

我希望有一种更简短的方法来轻松地创建具有等高侧边栏的二列或三列布局,而无需使用伪列方法。

Elliot Jay Stocks

设计师、作家和演讲者,主页

我希望 CSS 能原生支持条件语句,而无需使用像(出色的)Conditional-CSS 这样的变通方法。许多人认为浏览器检测本质上应该在样式表之外处理,但我用来处理 IE 特定代码的所有基于 HTML 的条件注释完全是为了调用“hack” CSS 文件。实现类似于我们用来定位基于 Gecko 或 WebKit 的浏览器的代码,对我来说将是一个非常受欢迎的补充。

Nick La

设计师 – Web Designer WallN.Design Studio

我希望 CSS 可以像 Photoshop 那样做图层样式,你可以在其中添加:内阴影、外发光、斜面和浮雕效果等。如果我们能有图层混合模式就更好了。

Jesse Bennett-Chamberlain

31Three 的设计师

我唯一想到的就是变量。我现在不太常直接接触代码,但是如果我需要,变量会非常方便。问问我我希望 Photoshop 能做什么,我就能给你一个更长的答案 :)

Volkan Görgülü

设计师 / 开发者 – Web Deneyimleri

我希望可以不用写

#sample h1, #sample h2, #sample h3 —> (又长又难看)

而是像这样写

#sample [h1, h2, h3] —> (简短而干净)

就可以完成工作 :)

另一个例子是

#sample a:link, #sample a:visited

#sample a [link, visited]

Veerle Pieters

Duoh! 的设计师,Duoh!博客

我希望 CSS 能支持渐变边框,并且像 InDesign 或 Quark 一样简化透明度的使用。 适用于所有可能的物体、文字等。 更加简单和逻辑化的浮动元素方式。 最后,我们不必再等待 5 年才能使用 CSS 3。 我也希望 CSS 能发怒,如果某些浏览器不配合就惩罚它们 :)

Jonathan Snook

Sidebar Creative 的设计师/开发者,主页

我很想看到所有主流浏览器对 CSS3 特性的实现,比如多重背景、圆角和边框图像。 CSS 变换也很有用。 它们可能看起来很花哨,但有很多实际用途,比如数据表格中窄列的超长标题名称。 能够旋转元素可以改善设计,同时保持可访问性(并避免使用图片)。 我相信,五年后的环境将为我们提供现在无法享受的众多功能。

Eric Meyer

Web 标准编写者和演讲者,主页

强大的基于网格的布局。 我们现在还没有,但非常需要。 坦白说,我现在并不关心它是通过 CSS 还是其他新的语言实现的。

Cameron Moll

设计师、演讲者、作者,主页

首先,我希望 CSS 能回复我的邮件。

其次,我希望 CSS 能说服浏览器开发者,让他们合作并逐步引入现有的“未来”CSS 特性和提案,而不是等待完整的规范“正式”发布。

空想吗? 也许吧,尽管我认为第一个可能会在第二个之前发生。

Dan Rubin

Sidebar Creative 的用户体验总监,主页

我希望看到 W3C 邀请一位专业的排版师和书籍设计师来帮助制定规范的字体和版式部分。 就像罗伯特·布林赫斯特那样,既是专业的排版师,又是书籍设计师,这样规范的制定就会考虑到设计师的需求,而不是由程序员来决定。

在功能特性的角度上,我希望这能带来更好的排版控制,以及 web 版的“母版页”,这是印刷设计软件中的一个老标准。

Stephanie Sullivan

W3Conversions 的编码员、培训师、作家

除了创建等高列的圣杯问题(无需使用伪方法,同时支持 IE6 和 IE7 等浏览器)之外,我还希望看到一种方法,可以从元素的底部或右侧设置背景定位。 不,我的意思是不要将它们设置到底部或右侧,我们现在可以做到这一点。 我的意思是设置一个背景图片,它离底部或右侧有一定的距离,并保持特定值。 无法准确确定包含文本的元素的高度,因此将背景图片从顶部设置 350 像素会导致与元素底部相关的各种结果。 有一种可靠的方法可以在不添加非语义包装器的情况下,将背景图片设置在距离底部 20 像素的地方,这在某些情况下可能非常有用。

来自评论的一些好主意

  • Andy Ford:
    我希望看到一个“高度增量”属性。
    本质上是让块级元素只以指定的“块”形式增加高度,而不是逐像素地增加。
  • Tony Freixas:
    GUI 应用程序可以访问丰富的布局工具,这些工具可以轻松地适应 Web 布局,但完全被忽视了。
    布局绝对是完全可以重写的。
  • Andy Pemberton:
    CSS 需要一个更先进的“回退”支持模型。
    现在,我们可以指定多个字体作为“回退”,但如果回退字体也需要一些负字间距呢?